/* Polices auto-hébergées (SIL Open Font License) : aucune requête vers Google (RGPD) */
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(../fonts/archivo-latin-wdth-normal.woff2) format("woff2-variations"),url(../fonts/archivo-latin-wdth-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(../fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2-variations"),url(../fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:400;src:url(../fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:500;src:url(../fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-display:swap;font-weight:600;src:url(../fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2")}

/* Layout: dark-first SaaS landing. Hero thesis + live product mockups (desktop dashboard + phone in the club's light theme),
   flow strip, bento of features, subdomain playground, pricing, FAQ, demo form. Tokens = design system le-tournoi.fr. */
:root{
  color-scheme:dark;
  /* dark (site vitrine) */
  --surface:#0a1626; --surface-raised:#122238; --surface-2:#0e1c30;
  --ink:#f3f5f7; --ink-muted:#9fb0c2; --hairline:#22344b;
  --table:#2f6fce; --table-deep:#1d4f99; --table-text:#6ea8ff;
  --ball:#ff7a2e; --on-accent:#13212e; --ball-soft:#4a2a14;
  --success:#4cc38a; --danger:#ff6b61;
  /* light (sites des clubs, dans les maquettes) */
  --l-surface:#f7f6f2; --l-raised:#ffffff; --l-ink:#13212e; --l-muted:#56616c; --l-hairline:#dcded8;
  --l-table:#1c4f8a; --l-ball:#f26a1b; --l-ball-soft:#fde3d1; --l-success:#1f7a4d; --l-success-soft:#e3f1e8;

  --font-sans:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r-sm:4px; --r-md:8px; --r-lg:16px; --r-pill:999px;
  --maxw:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--surface);color:var(--ink);font-family:var(--font-sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3{margin:0;text-wrap:balance;letter-spacing:-.02em}
p{margin:0}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--table-text)}
:focus-visible{outline:2px solid var(--ball);outline-offset:3px;border-radius:4px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:var(--r-md);font:600 16px/1 var(--font-sans);text-decoration:none;border:0;cursor:pointer;transition:transform .15s ease,background .15s ease}
.btn:active{transform:translateY(1px)}
.btn-ball{background:var(--ball);color:var(--on-accent)}
.btn-ball:hover{background:#ff8f4f}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--hairline)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1px var(--ink-muted)}
.btn-sm{height:40px;padding:0 16px;font-size:15px}

/* Nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline)}
.nav .wrap{display:flex;align-items:center;gap:24px;height:68px}
.logo{white-space:nowrap;font-weight:800;font-stretch:112%;font-size:21px;letter-spacing:-.02em;text-decoration:none;display:inline-flex;align-items:baseline}
.logo .tld{color:var(--ball)}
.nav-links{display:flex;gap:28px;margin-left:auto;font-size:15px;color:var(--ink-muted)}
.nav-links a{text-decoration:none}
.nav-links a:hover{color:var(--ink)}
@media (max-width:860px){.nav-links{display:none}.nav .btn{margin-left:auto}}
@media (max-width:480px){.nav .btn .long{display:none}}

/* Hero */
.hero{position:relative;padding-block:clamp(56px,9vw,112px) 40px;overflow:hidden}
.hero::before{ /* la table vue de dessus, en filigrane */
  content:"";position:absolute;inset:40px -10% auto auto;width:min(900px,90vw);aspect-ratio:1.8;border:2px solid var(--hairline);border-radius:var(--r-lg);
  background:linear-gradient(var(--hairline),var(--hairline)) 50% 0/2px 100% no-repeat,linear-gradient(var(--hairline),var(--hairline)) 0 50%/100% 1px no-repeat;opacity:.6;pointer-events:none}
.hero-grid{position:relative;display:grid;gap:40px}
.hero h1{font-size:clamp(46px,8.2vw,112px);line-height:.92;font-weight:900;font-stretch:118%;letter-spacing:-.035em;max-width:14ch}
.hero h1 .hl{color:var(--ball)}
.hero .lede{font-size:clamp(18px,1.6vw,21px);color:var(--ink-muted);max-width:60ch;margin-top:28px}
.hero .lede strong{color:var(--ink);font-weight:600}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;align-items:center}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:24px;font-size:14px;color:var(--ink-muted)}
.hero-meta span{display:inline-flex;align-items:center;gap:8px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--success);flex:none}

/* Showcase: desktop + phone */
.showcase{position:relative;margin-top:56px;padding-bottom:40px}
.browser{background:var(--surface-raised);border:1px solid var(--hairline);border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.6);max-width:980px}
.browser-bar{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--hairline);background:var(--surface-2)}
.browser-bar i{width:10px;height:10px;border-radius:50%;background:var(--hairline)}
.url{margin-left:12px;flex:1;min-width:0;background:var(--surface);border-radius:var(--r-pill);padding:6px 14px;font:500 13px var(--font-mono);color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.url b{color:var(--ink);font-weight:500}
.dash{display:grid;grid-template-columns:200px 1fr;min-height:420px}
.dash-side{border-right:1px solid var(--hairline);padding:20px 14px;display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--ink-muted)}
.dash-side .club{font-weight:700;color:var(--ink);font-size:15px;padding:0 10px 14px}
.dash-side span{padding:8px 10px;border-radius:6px}
.dash-side .on{background:var(--surface);color:var(--ink)}
.dash-main{padding:22px;min-width:0}
.dash-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.dash-head h3{font-size:22px;font-stretch:108%}
.dash-head p{font-size:13px;color:var(--ink-muted)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}
.kpi{background:var(--surface);border-radius:10px;padding:12px 14px}
.kpi small{display:block;font-size:12px;color:var(--ink-muted)}
.kpi b{font:600 22px var(--font-mono);letter-spacing:-.02em}
.kpi b.ok{color:var(--success)}
.days{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.day h4{margin:0 0 8px;font-size:12px;letter-spacing:.08em;color:var(--table-text)}
.trow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--hairline);font-size:13px}
.trow .tn{font-weight:700;width:22px;height:22px;border-radius:6px;background:var(--table);color:#fff;display:grid;place-items:center;font-size:12px}
.trow .bar{height:6px;border-radius:3px;background:var(--surface);overflow:hidden;position:relative}
.trow .bar i{position:absolute;inset:0 auto 0 0;border-radius:3px;background:var(--table)}
.trow .bar i.full{background:var(--ball)}
.trow .n{font-family:var(--font-mono);color:var(--ink-muted);font-size:12px;min-width:52px;text-align:right}
.trow .lbl{min-width:0}
.trow .lbl small{display:block;color:var(--ink-muted);font-size:11px}

.phone{position:absolute;right:0;bottom:0;width:300px;background:#05090f;border-radius:44px;padding:10px;box-shadow:0 50px 90px -30px rgba(0,0,0,.8),0 0 0 1px #2a3a50}
.screen{background:var(--l-surface);color:var(--l-ink);border-radius:35px;overflow:hidden;height:600px;display:flex;flex-direction:column}
.notch{height:34px;display:flex;justify-content:center;align-items:center}
.notch i{width:90px;height:24px;background:#05090f;border-radius:14px}
.pscroll{padding:6px 16px 16px;display:flex;flex-direction:column;gap:12px;flex:1}
.p-club{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--l-muted);font-weight:600}
.p-title{font-size:22px;line-height:1.05;font-weight:800;font-stretch:110%;letter-spacing:-.02em}
.p-card{background:var(--l-raised);border:1px solid var(--l-hairline);border-radius:12px;padding:12px}
.p-label{font-size:11px;color:var(--l-muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}
.p-input{font:500 15px var(--font-mono);border:1px solid var(--l-muted);border-radius:6px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center}
.spid{margin-top:8px;border-radius:8px;padding:9px 10px;font-size:13px;display:flex;gap:10px;align-items:flex-start;background:var(--l-success-soft);color:var(--l-ink)}
.spid .chk{flex:none;width:20px;height:20px;border-radius:50%;background:var(--l-success);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}
.spid b{display:block;color:var(--l-success);font-size:12px}
.spid .who{font-family:var(--font-mono);font-size:12px;color:var(--l-muted)}
.spid.pending{background:var(--l-surface)}
.spid.pending .chk{background:transparent;border:2px solid var(--l-hairline);border-top-color:var(--l-table);animation:spin .8s linear infinite}
.spid.pending b{color:var(--l-table)}
@keyframes spin{to{transform:rotate(360deg)}}
.opt{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--l-hairline);font-size:13px}
.opt:first-of-type{border-top:0}
.box{width:18px;height:18px;border-radius:4px;border:1.5px solid var(--l-muted);flex:none;display:grid;place-items:center;font-size:11px;color:#fff;font-weight:800}
.box.on{background:var(--l-table);border-color:var(--l-table)}
.opt .d{font-size:10px;font-weight:700;letter-spacing:.06em;padding:2px 7px;border-radius:999px;background:var(--l-surface);color:var(--l-muted)}
.opt .pr{margin-left:auto;font-family:var(--font-mono);font-size:12px}
.opt.dis{color:var(--l-muted)}
.opt .full{font-size:10px;font-weight:700;background:var(--l-ball-soft);color:var(--l-ink);padding:2px 7px;border-radius:999px}
.pay{margin-top:auto;background:var(--l-table);color:#fff;border-radius:10px;height:46px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;gap:6px}
.pay .mono{font-weight:600}

@media (max-width:980px){
  .showcase{display:flex;flex-direction:column;align-items:center;gap:0}
  .browser{width:100%}
  .phone{position:relative;margin-top:-120px;right:auto}
}
@media (max-width:720px){
  .dash{grid-template-columns:1fr}
  .dash-side{display:none}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .days{grid-template-columns:1fr}
  .phone{width:min(300px,100%);margin-top:-60px}
}

/* Flow strip */
.flow{border-block:1px solid var(--hairline);background:var(--surface-2)}
.flow ol{list-style:none;margin:0;padding:28px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:s}
.flow li{counter-increment:s;display:flex;gap:14px;align-items:flex-start;font-size:15px;color:var(--ink-muted);min-width:0}
.flow li::before{content:counter(s);flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:600 14px var(--font-mono);color:var(--ink);box-shadow:inset 0 0 0 1px var(--hairline)}
.flow li:last-child::before{background:var(--ball);color:var(--on-accent);box-shadow:none}
.flow b{display:block;color:var(--ink);font-weight:700;font-size:16px}
@media (max-width:860px){.flow ol{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.flow ol{grid-template-columns:1fr}}

/* Sections */
section.block{padding-block:clamp(72px,10vw,128px)}
.sec-head{display:grid;gap:16px;max-width:760px;margin-bottom:48px}
.sec-head h2{font-size:clamp(34px,5vw,60px);line-height:.98;font-weight:900;font-stretch:115%}
.sec-head p{color:var(--ink-muted);font-size:18px;max-width:60ch}

/* Bento */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.cell{background:var(--surface-raised);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;gap:12px;min-width:0}
.cell h3{font-size:22px;font-stretch:108%;font-weight:800}
.cell p{color:var(--ink-muted);font-size:16px}
.c-a{grid-column:span 4}.c-b{grid-column:span 2}.c-c{grid-column:span 2}.c-d{grid-column:span 2}.c-e{grid-column:span 2}.c-f{grid-column:span 6}
.cell.feature{background:var(--table-deep);border-color:transparent}
.cell.feature p{color:#d3e1f5}
.viz{margin-top:auto;padding-top:12px}
.weekend{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wk{background:rgba(10,22,38,.45);border-radius:10px;padding:12px}
.wk h4{margin:0 0 8px;font-size:12px;letter-spacing:.08em;color:#fff}
.chip{display:inline-flex;align-items:center;gap:6px;margin:0 6px 6px 0;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.1);font-size:13px;color:#fff}
.chip .mono{font-size:12px;color:#d3e1f5}
.range{position:relative;height:34px}
.range .track{position:absolute;left:0;right:0;top:12px;height:8px;border-radius:4px;background:var(--surface)}
.range .sel{position:absolute;left:18%;width:40%;top:12px;height:8px;border-radius:4px;background:var(--table)}
.range .me{position:absolute;left:33%;top:6px;width:20px;height:20px;border-radius:50%;background:var(--ball);box-shadow:0 0 0 4px var(--surface-raised)}
.range-lbl{display:flex;justify-content:space-between;font:500 12px var(--font-mono);color:var(--ink-muted)}
.seats{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.seats i{aspect-ratio:1;border-radius:50%;background:var(--table)}
.seats i.w{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ball)}
.seat-lbl{display:flex;justify-content:space-between;margin-top:10px;font-size:13px;color:var(--ink-muted)}
.seat-lbl b{color:var(--ink);font-family:var(--font-mono);font-weight:600}
.ha{display:flex;flex-direction:column;gap:8px}
.ha-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;padding:10px 12px;background:var(--surface);border-radius:8px}
.ha-row .mono{font-size:13px}
.ha-row .ok{color:var(--success);font-weight:600;font-size:13px}
.exports{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.exp{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;background:var(--surface);font-size:14px}
.exp .mono{font-size:12px;color:var(--table-text)}
.c-f{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:center}
.c-f .txt{display:flex;flex-direction:column;gap:12px}
@media (max-width:980px){.c-a,.c-f{grid-column:span 6}.c-b,.c-c,.c-d,.c-e{grid-column:span 3}.c-f{grid-template-columns:1fr}}
@media (max-width:640px){.bento{grid-template-columns:1fr}.c-a,.c-b,.c-c,.c-d,.c-e,.c-f{grid-column:auto}.weekend{grid-template-columns:1fr}}

/* Subdomain playground */
.sub{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.sub-card{background:var(--surface-raised);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:14px;font-weight:600}
.field input,.field textarea,.field select{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--ink-muted);border-radius:var(--r-sm);padding:12px 14px;width:100%}
.field input::placeholder,.field textarea::placeholder{color:#7f90a3}
.field input:focus,.field textarea:focus{outline:2px solid var(--table-text);outline-offset:1px;border-color:transparent}
.big-url{font:600 clamp(20px,2.6vw,30px)/1.2 var(--font-mono);letter-spacing:-.02em;word-break:break-all;padding:18px;border-radius:12px;background:var(--surface);border:1px dashed var(--hairline)}
.big-url .slug{color:var(--ball)}
.big-url .base{color:var(--ink-muted)}
.checks{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px}
.checks li{display:flex;gap:12px;color:var(--ink-muted)}
.checks li::before{content:"";flex:none;width:18px;height:18px;margin-top:4px;border-radius:50%;background:var(--table);box-shadow:inset 0 0 0 5px var(--table-deep)}
.checks b{color:var(--ink)}
@media (max-width:860px){.sub{grid-template-columns:1fr;gap:32px}}

/* Pricing */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:980px}
.plan{border:1px solid var(--hairline);border-radius:20px;padding:32px;display:flex;flex-direction:column;gap:20px;background:var(--surface-raised)}
.plan.alt{background:var(--ink);color:var(--on-accent);border-color:transparent}
.plan h3{font-size:24px;font-stretch:110%;font-weight:800}
.plan .desc{color:var(--ink-muted);font-size:16px}
.plan.alt .desc{color:#46525e}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.price .amt{font-size:64px;font-weight:900;font-stretch:115%;letter-spacing:-.04em;line-height:1}
.price .per{font-size:15px;color:var(--ink-muted)}
.plan.alt .price .per{color:#46525e}
.plus{font:500 14px var(--font-mono);margin-top:-8px}
.plan ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15px}
.plan li{display:flex;gap:10px}
.plan li::before{content:"✓";font-weight:800;color:var(--success)}
.plan.alt li::before{color:#1f7a4d}
.plan .btn{margin-top:auto}
.plan.alt .btn-ghost{color:var(--on-accent);box-shadow:inset 0 0 0 1.5px var(--on-accent)}
.tag{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:var(--ball);color:var(--on-accent)}
.fine{margin-top:20px;font-size:14px;color:var(--ink-muted);max-width:70ch}
@media (max-width:760px){.plans{grid-template-columns:1fr}}

/* FAQ */
.faq{display:grid;grid-template-columns:1fr 1.6fr;gap:48px}
.faq details{border-top:1px solid var(--hairline);padding:20px 0}
.faq details:last-child{border-bottom:1px solid var(--hairline)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-weight:700;font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:500 22px/1 var(--font-mono);color:var(--table-text);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:12px;color:var(--ink-muted);max-width:62ch}
@media (max-width:860px){.faq{grid-template-columns:1fr;gap:16px}}

/* Contact */
.contact{background:var(--table-deep);border-radius:24px;padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:1fr 1.1fr;gap:48px;position:relative;overflow:hidden}
.contact::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:var(--ball);right:-70px;top:-70px;opacity:.95}
.contact h2{font-size:clamp(34px,4.6vw,56px);line-height:.98;font-weight:900;font-stretch:115%;position:relative}
.contact .intro p{color:#d3e1f5;margin-top:16px;font-size:18px;max-width:44ch}
.contact form{position:relative;z-index:1;background:var(--surface);border-radius:var(--r-lg);padding:24px;display:grid;gap:16px;grid-template-columns:1fr 1fr}
.contact form .full{grid-column:1/-1}
.contact form .btn{width:100%}
.req{color:var(--ball)}
.err{font-size:13px;color:var(--danger)}
.done{grid-column:1/-1;display:flex;flex-direction:column;gap:10px;align-items:flex-start;padding:12px 4px}
.done h3{font-size:26px;font-stretch:110%}
.done p{color:var(--ink-muted)}
@media (max-width:860px){.contact::after{width:120px;height:120px;right:-60px;top:-60px}.contact{grid-template-columns:1fr;gap:28px}.contact form{grid-template-columns:1fr}}

footer{padding-block:48px;border-top:1px solid var(--hairline);margin-top:clamp(72px,10vw,128px);font-size:14px;color:var(--ink-muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:flex-start}
footer p{max-width:62ch}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* Utilitaires (pas de style inline : CSP stricte) */
.hero h1{margin-top:18px}
section.block.tight{padding-top:0}
.sec-head.flush{margin:16px 0 0}
.sec-head.flush0{margin:0}
.p-label.muted{color:var(--ink-muted)}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-muted)}
.consent input{margin-top:3px;width:18px;height:18px;accent-color:var(--ball);flex:none}
.consent a{color:var(--table-text)}
.btn[disabled]{opacity:.6;cursor:progress}
.notice{grid-column:1/-1;padding:12px 14px;border-radius:var(--r-sm);font-size:14px}
.notice.error{background:rgba(255,107,97,.12);color:var(--danger)}
footer nav{display:flex;gap:20px}
footer nav a{color:var(--ink-muted)}
footer nav a:hover{color:var(--ink)}

/* Pages de texte (mentions légales) */
.legal{padding-block:clamp(48px,7vw,96px)}
.legal .wrap{max-width:760px}
.legal h1{font-size:clamp(34px,5vw,56px);font-weight:900;font-stretch:115%;line-height:1}
.legal h2{font-size:22px;font-stretch:108%;margin-top:40px}
.legal p,.legal li{color:var(--ink-muted);margin-top:12px}
.legal strong{color:var(--ink)}
.legal a{color:var(--table-text)}
.todo{background:var(--ball-soft);color:var(--ink);padding:0 6px;border-radius:4px;font-family:var(--font-mono);font-size:.9em}
.skip{position:absolute;left:-10000px;top:8px;z-index:50;background:var(--ball);color:var(--on-accent);padding:8px 14px;border-radius:var(--r-sm);font-weight:600}
.skip:focus{left:16px}