/* Charte inspirée d'IRONMAN : noir, blanc, rouge M-Dot. Typo condensée grasse pour les titres. */
:root{
  --red:#D6001C; --red-ink:#B00017; --black:#0B0B0B;
  --bg:#F3F3F3; --surface:#FFFFFF; --surface-2:#F0F0F0; --ink:#111111; --muted:#6B6B6B; --line:#E1E1E1;
  --ok:#1E8E3E; --warn:#C77700; --on-red:#FFFFFF;
  --swim:#0091DA; --bike:#F2A900; --run:#D6001C; --strength:#8A8A8A; --race:#111111; --brick:#5E5E5E; --rest:#C9C9C9;
  --carb:#D6001C; --fluid:#0091DA; --sodium:#B07A00;
  --display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --tabs-h:64px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --red:#FF2D42; --red-ink:#FF5A6A; --bg:#0A0A0A; --surface:#161616; --surface-2:#1F1F1F; --ink:#F2F2F2; --muted:#A0A0A0; --line:#2B2B2B;
  --ok:#4CC26E; --warn:#F0A43A; --swim:#38B6FF; --bike:#FFC233; --run:#FF2D42; --strength:#9A9A9A; --race:#F2F2F2; --brick:#8C8C8C; --rest:#3A3A3A;
  --carb:#FF3B4E; --fluid:#1E8FD0; --sodium:#C08A10;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --red:#FF2D42; --red-ink:#FF5A6A; --bg:#0A0A0A; --surface:#161616; --surface-2:#1F1F1F; --ink:#F2F2F2; --muted:#A0A0A0; --line:#2B2B2B;
  --ok:#4CC26E; --warn:#F0A43A; --swim:#38B6FF; --bike:#FFC233; --run:#FF2D42; --strength:#9A9A9A; --race:#F2F2F2; --brick:#8C8C8C; --rest:#3A3A3A;
  --carb:#FF3B4E; --fluid:#1E8FD0; --sodium:#C08A10;
  color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--body);
  padding-bottom:calc(var(--tabs-h) + env(safe-area-inset-bottom))}
body.wizard-open{padding-bottom:0}
h1,h2,h3{font-family:var(--display);font-weight:700;margin:0;line-height:1.02;letter-spacing:.01em}
h2{font-size:1.6rem;text-transform:uppercase}
h3{font-size:1.2rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
.eyebrow{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.muted{color:var(--muted)} .small{font-size:.85rem} .center{text-align:center}
.num{font-variant-numeric:tabular-nums;font-family:var(--mono)}
[hidden]{display:none!important}

/* En-tête noir */
.top{position:sticky;top:0;z-index:20;background:var(--black);color:#fff;padding-top:env(safe-area-inset-top);border-bottom:3px solid var(--red)}
.top-in{max-width:760px;margin:0 auto;padding:10px max(16px,env(safe-area-inset-left)) 12px;display:grid;gap:6px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:30px;width:auto}
.brand b{font-family:var(--display);font-size:1.35rem;letter-spacing:.06em}
.brand .cd{margin-left:auto;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;background:#D6001C;color:#fff;padding:3px 8px;border-radius:3px}
.brand .gear{border:0;background:none;color:#fff;font-size:1.3rem;cursor:pointer;padding:4px 2px 4px 8px;line-height:1}
.top h1{font-size:2.1rem;text-transform:uppercase;font-style:italic}
.sync{font-family:var(--mono);font-size:.7rem;color:rgba(255,255,255,.7);min-height:1em}

.view{max-width:760px;margin:0 auto;padding:16px max(16px,env(safe-area-inset-left)) 32px;display:grid;gap:16px;outline:none}

/* Onglets */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(5,1fr);
  background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabs button{position:relative;border:0;background:none;height:var(--tabs-h);display:grid;place-content:center;gap:3px;font-size:.68rem;color:var(--muted);cursor:pointer;font-weight:500}
.tabs svg{width:22px;height:22px;margin:0 auto;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tabs button[aria-current="page"]{color:var(--ink);font-weight:700}
.tabs button[aria-current="page"]::before{content:"";position:absolute;top:0;left:22%;right:22%;height:3px;background:var(--red);border-radius:0 0 3px 3px}
.tabs .dot{position:absolute;top:10px;right:calc(50% - 18px);width:8px;height:8px;border-radius:50%;background:var(--red)}

/* Cartes */
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:16px;display:grid;gap:12px}
.card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;align-items:center;gap:8px}
.card.accent{border-left:4px solid var(--red)}
.card.alert{border:1px solid var(--red);background:color-mix(in srgb,var(--red) 6%,var(--surface))}

/* Bandeau semaine noir + ECG */
.hero{background:var(--black);color:#fff;border:1px solid var(--line);position:relative;overflow:hidden;padding-bottom:clamp(96px,30vw,150px)}
.hero>*{position:relative;z-index:1}
.hero .eyebrow{color:rgba(255,255,255,.65)}
.hero h2{font-size:2rem;font-style:italic}
.hero .ecg{position:absolute;z-index:0;left:0;bottom:-2px;width:100%;max-width:520px;height:auto;opacity:.85;pointer-events:none}
.hero .bar{background:rgba(255,255,255,.18)}
.bar{height:8px;border-radius:4px;background:var(--line);overflow:hidden}
.bar>i{display:block;height:100%;background:var(--red);border-radius:4px}

.daynav{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px}
.daynav button{height:44px;border-radius:6px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-size:1.2rem}
.daynav .d{text-align:center}
.daynav .d b{display:block;font-family:var(--display);font-size:1.45rem;text-transform:uppercase}
.today-link{border:0;background:none;color:var(--red-ink);font-size:.8rem;cursor:pointer;padding:0;text-decoration:underline}

/* Séances */
.sess{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;background:var(--surface);
  border:1px solid var(--line);border-left:6px solid var(--c,var(--muted));border-radius:6px;padding:12px}
.sess .t b{display:block;font-weight:600}
.sess .t small{display:block;color:var(--muted);font-size:.85rem;line-height:1.35}
.sess .meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.tick{width:36px;height:36px;border-radius:50%;border:2px solid var(--c,var(--muted));background:none;cursor:pointer;display:grid;place-items:center;font-size:1rem;color:#fff;font-weight:700}
.tick[data-s="done"]{background:var(--ok);border-color:var(--ok)}
.tick[data-s="partial"]{background:var(--warn);border-color:var(--warn)}
.tick[data-s="skipped"]{background:var(--muted);border-color:var(--muted)}
.chip{font-family:var(--mono);font-size:.7rem;padding:2px 7px;border-radius:3px;background:var(--surface-2);color:var(--ink);white-space:nowrap}
.chip.ok{background:color-mix(in srgb,var(--ok) 18%,transparent)}
.chip.warn{background:color-mix(in srgb,var(--warn) 22%,transparent)}
.chip.bad,.chip.red{background:color-mix(in srgb,var(--red) 16%,transparent)}
.link{border:0;background:none;color:var(--red-ink);cursor:pointer;padding:6px;font-weight:700;text-transform:uppercase;font-size:.78rem;letter-spacing:.06em}

/* Boutons */
.btn{border:1px solid var(--line);background:var(--surface);border-radius:4px;min-height:44px;padding:0 16px;cursor:pointer;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.85rem}
/* Rouge M-Dot fixe : contraste suffisant avec le texte blanc dans les deux thèmes */
.btn.primary{background:#D6001C;border-color:#D6001C;color:#fff}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn.danger{color:var(--red-ink)}
.btn.block{width:100%}
.btn:disabled{opacity:.55}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{border:1px solid var(--line);background:var(--surface);border-radius:3px;padding:8px 12px;cursor:pointer;font-size:.85rem;min-height:40px}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* Programme */
details.wk{background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden}
details.wk.current{border:2px solid var(--red)}
details.wk>summary{list-style:none;cursor:pointer;padding:12px 14px;display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center}
details.wk>summary::-webkit-details-marker{display:none}
.wn{font-family:var(--display);font-weight:700;font-size:1.4rem;font-style:italic}
.wf b{display:block;font-weight:600}
.wf span{display:block;color:var(--muted);font-size:.82rem}
.wr{text-align:right;font-family:var(--mono);font-size:.76rem;line-height:1.4}
.wk-body{padding:0 12px 12px;display:grid;gap:10px}
.wk-day{display:grid;gap:6px}
.wk-day .dd{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding-top:4px}

/* Formulaires */
label{display:grid;gap:4px;font-size:.85rem;color:var(--muted)}
input,select,textarea{width:100%;min-height:44px;border:1px solid var(--line);border-radius:4px;background:var(--bg);padding:8px 10px;font-size:16px;color:var(--ink)}
textarea{min-height:84px;resize:vertical}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid var(--red);outline-offset:1px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
fieldset{border:0;padding:0;margin:0;display:grid;gap:10px}
legend{font-family:var(--display);font-weight:700;font-size:1.15rem;text-transform:uppercase;padding:0;margin-bottom:6px;color:var(--ink)}
.scale{display:grid;grid-template-columns:repeat(var(--n,5),1fr);gap:4px}
.scale button{min-height:42px;border:1px solid var(--line);border-radius:4px;background:var(--surface);cursor:pointer;font-family:var(--mono)}
.scale button[aria-pressed="true"]{background:#D6001C;color:#fff;border-color:#D6001C}
.hint{font-size:.82rem;color:var(--muted)}
.calc{font-family:var(--mono);font-size:.85rem;background:var(--surface-2);border-radius:4px;padding:8px 10px}
.err{color:var(--red-ink);font-size:.9rem;font-weight:500}
.unit{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}
.unit span{font-family:var(--mono);font-size:.8rem;color:var(--muted)}
details.edit{border-top:1px solid var(--line);padding-top:12px}
details.edit>summary{cursor:pointer;font-weight:700;text-transform:uppercase;font-size:.85rem;letter-spacing:.05em}
details.edit[open]>summary{margin-bottom:12px}

/* Assistant (questionnaires) */
.wizard{max-width:640px;margin:0 auto;padding:16px max(16px,env(safe-area-inset-left)) calc(24px + env(safe-area-inset-bottom));display:grid;gap:18px}
.wizard .steps{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:4px}
.wizard .steps i{height:4px;border-radius:2px;background:var(--line)}
.wizard .steps i.on{background:var(--red)}
.wizard h2{font-size:2.2rem;font-style:italic}
.q{display:grid;gap:6px}
.q>.ql{font-size:.95rem;color:var(--ink);font-weight:500}
.q>.ql em{color:var(--red-ink);font-style:normal}
.days{display:grid;gap:6px}
.days .dr{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:10px}
.race-row{display:grid;gap:8px;border:1px solid var(--line);border-radius:4px;padding:10px}
.wizard-actions{display:flex;gap:8px;position:sticky;bottom:0;background:var(--bg);padding:10px 0 calc(6px + env(safe-area-inset-bottom))}
.wizard-actions .btn{flex:1}

/* Feuille de saisie */
.sheet{border:0;padding:0;margin:auto auto 0;width:100%;max-width:640px;max-height:92vh;border-radius:12px 12px 0 0;background:var(--surface);color:var(--ink)}
.sheet::backdrop{background:rgba(0,0,0,.6)}
@media (min-width:700px){.sheet{margin:auto;border-radius:12px}}
.sheet form{display:grid;gap:16px;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
.sheet-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;position:sticky;top:0;background:var(--surface);padding:4px 0 8px;z-index:1;border-bottom:1px solid var(--line)}
.sheet-head .x{border:0;background:var(--surface-2);border-radius:50%;width:36px;height:36px;cursor:pointer;flex:none}
.sheet-actions{display:flex;gap:8px;position:sticky;bottom:0;background:var(--surface);padding-top:8px}
.sheet-actions .btn{flex:1}

/* Tableaux */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.85rem}
th,td{padding:8px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap;font-variant-numeric:tabular-nums}
th{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:500}
tr:last-child td{border-bottom:0}
td input{min-height:36px;padding:4px 6px;width:84px}
tr.clickable{cursor:pointer}

/* Indicateurs */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.kpi{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--red);border-radius:6px;padding:12px;display:grid;gap:2px}
.kpi b{font-family:var(--display);font-size:1.9rem;line-height:1;font-style:italic}
.kpi span{font-size:.78rem;color:var(--muted)}
svg.chart{width:100%;height:auto;display:block}
svg.chart text{font-family:var(--mono);font-size:11px;fill:var(--muted)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.8rem;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
ul.reasons{margin:0;padding-left:18px;display:grid;gap:6px}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--tabs-h) + 16px + env(safe-area-inset-bottom));
  background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:4px;z-index:100;font-size:.9rem;max-width:90vw}
.empty{padding:20px;text-align:center;color:var(--muted)}

/* Connexion */
.login-page{padding-bottom:0;background:var(--black);color:#fff;min-height:100vh}
.login{max-width:420px;margin:0 auto;padding:max(40px,env(safe-area-inset-top)) 16px 32px;display:grid;gap:18px}
.login-brand{display:grid;justify-items:center;gap:10px;text-align:center}
.login-brand img.mdot{height:96px}
.login-brand h1{font-size:3.2rem;font-style:italic;letter-spacing:.04em;text-transform:uppercase}
.login-brand img.ecg{width:100%;height:auto;opacity:.95}
.login .card{background:#161616;border-color:#2B2B2B;color:#F2F2F2}
.login label{color:#A0A0A0}
.login input{background:#0A0A0A;border-color:#2B2B2B;color:#F2F2F2}
.login .btn.primary{background:#D6001C;border-color:#D6001C;color:#fff}
.login .err{color:#FF5A6A}
.login .muted{color:#8A8A8A}

/* Compte à rebours */
.countdown{padding-bottom:clamp(90px,28vw,140px)}
.countdown .ecg{opacity:.45}
.cd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}
.cd-grid b{display:block;font-family:var(--display);font-style:italic;font-size:clamp(2rem,10vw,3.2rem);line-height:1}
.cd-grid span{font-family:var(--mono);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;opacity:.7}

/* Chat coach IA */
.chat-list{display:grid;gap:8px;max-height:60vh;overflow-y:auto;padding:2px}
.msg{padding:10px 12px;border-radius:10px;white-space:pre-wrap;line-height:1.45;font-size:.92rem;max-width:92%}
.msg.user{justify-self:end;background:var(--ink);color:var(--bg);border-bottom-right-radius:3px}
.msg.assistant{justify-self:start;background:var(--surface-2);border-left:3px solid var(--red);border-bottom-left-radius:3px}
.chat-form{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}
.chat-form textarea{min-height:48px}
input[type="checkbox"]{width:22px;height:22px;min-height:22px;flex:none;accent-color:#D6001C;padding:0}

/* Guide nutrition */
.nutri{position:relative;display:grid;gap:16px}
.nutri .ql{font-size:.85rem;color:var(--muted);margin-top:4px}
.nutri .range{gap:6px}
.nutri .range b{color:var(--ink)}
input[type="range"]{padding:0;min-height:32px;accent-color:#D6001C;background:none;border:0}
.nrow{display:grid;gap:2px}
.multiples{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
svg.chart text.strong{fill:var(--ink);font-weight:500}
.viz-tip{position:absolute;z-index:5;pointer-events:none;background:var(--ink);color:var(--bg);font:500 .78rem/1.3 var(--body);padding:6px 9px;border-radius:4px;max-width:220px}
.alert-line{border-left:3px solid var(--red);padding-left:8px}
ol.timeline{list-style:none;margin:0;padding:0;display:grid;gap:0;border-left:2px solid var(--line);margin-left:6px}
ol.timeline li{position:relative;padding:0 0 12px 16px;display:grid;gap:2px;font-size:.88rem}
ol.timeline li::before{content:"";position:absolute;left:-6px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--red)}
ol.timeline li b{font-family:var(--display);text-transform:uppercase;font-size:1rem}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.fact{background:var(--surface-2);border-radius:6px;padding:10px 12px;display:grid;gap:4px;font-size:.86rem}
.fact b{font-family:var(--display);text-transform:uppercase;font-size:1rem}

.toggle-row{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;color:var(--ink);font-size:.95rem}
.toggle-row small{display:block}
.multiples svg.chart{overflow:visible}
a.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:inherit}
a.btn.dark{color:var(--bg)}
a.btn.primary{color:#fff}

/* =====================================================================
   Design system v2 « cockpit » : neutres premium, un accent, 3 disciplines
   (couleurs du logo, validées daltonisme : nage / vélo / course)
   ===================================================================== */
:root{
  --bg:#F4F4F2; --surface:#FFFFFF; --surface-2:#F1F2F4; --ink:#0E1014; --muted:#6A6F78; --line:#E3E5E9; --track:#ECEDF0;
  --accent:#D6001C; --red:#D6001C; --red-ink:#B00017; --black:#0A0B0E;
  --swim:#2E6DB4; --bike:#2A7A3E; --run:#E0743F; --brick:#8A6A55; --strength:#7C828C; --race:#0E1014;
  --ph-tests:#CDD0D6; --ph-base:#B3B8C0; --ph-build:#8D949F; --ph-spec:#5D6571; --ph-taper:#A6ACB5;
  --shadow:0 1px 2px rgba(14,16,20,.04),0 4px 16px rgba(14,16,20,.04);
  --radius:12px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0A0B0E; --surface:#14161A; --surface-2:#1C1F24; --ink:#F1F2F4; --muted:#9AA0A8; --line:#262A30; --track:#23272D;
  --accent:#FF3B4E; --red:#FF3B4E; --red-ink:#FF6B7A;
  --swim:#4A8ED6; --bike:#2A7539; --run:#DA7640; --brick:#A0826C; --strength:#8E949D; --race:#F1F2F4;
  --ph-tests:#3A3F47; --ph-base:#4A515B; --ph-build:#6A727E; --ph-spec:#9AA2AE; --ph-taper:#5A616B;
  --shadow:none;
}}
:root[data-theme="dark"]{
  --bg:#0A0B0E; --surface:#14161A; --surface-2:#1C1F24; --ink:#F1F2F4; --muted:#9AA0A8; --line:#262A30; --track:#23272D;
  --accent:#FF3B4E; --red:#FF3B4E; --red-ink:#FF6B7A;
  --swim:#4A8ED6; --bike:#2A7539; --run:#DA7640; --brick:#A0826C; --strength:#8E949D; --race:#F1F2F4;
  --ph-tests:#3A3F47; --ph-base:#4A515B; --ph-build:#6A727E; --ph-spec:#9AA2AE; --ph-taper:#5A616B;
  --shadow:none;
}
.card{border-radius:var(--radius);box-shadow:var(--shadow);border-color:var(--line)}
.top{background:var(--black);border-bottom:1px solid #1E2127}
.brand img{height:32px;width:32px;border-radius:8px}
.brand b{letter-spacing:.12em;font-size:1.2rem}
.top h1{font-size:1.9rem;font-style:normal;letter-spacing:.02em}
.tabs button[aria-current="page"]::before{background:var(--ink)}
.tabs .dot{background:var(--accent)}
.bar{height:6px;background:var(--track)}
.bar.thin{height:4px}
.bar>i{background:var(--accent);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.kpi{border-top:1px solid var(--line)}
.eyebrow{letter-spacing:.16em}

/* Chiffres */
b.big{display:block;font-family:var(--display);font-weight:700;font-size:3.4rem;line-height:.95;letter-spacing:-.01em}
b.mid{display:block;font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1.05}
b.huge{display:block;font-family:var(--display);font-weight:700;font-size:clamp(3rem,14vw,4.4rem);line-height:.95;letter-spacing:.01em}
.tone-ok{color:var(--ok)} .tone-warn{color:var(--warn)} .tone-bad{color:var(--red)}

/* Cockpit */
.cockpit{grid-template-columns:1fr;justify-items:center;gap:18px;padding:20px}
.cockpit-ring{border:0;background:none;padding:0;cursor:pointer;color:inherit}
.ring-wrap{position:relative;width:min(220px,62vw);aspect-ratio:1}
.ring{width:100%;height:100%;display:block}
.ring-arc{transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1)}
.ring-center{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:2px}
.cockpit-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;width:100%}
.stat{display:grid;gap:3px;align-content:start}
.stat .bar{margin-top:4px}
@media (min-width:620px){.cockpit{grid-template-columns:auto 1fr;justify-items:stretch;align-items:center}}

/* Disciplines, à venir, objectifs */
.disc{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;font-size:.92rem}
.disc>div{display:grid;gap:6px}
.disc-dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none}
.upcoming{display:grid;gap:2px}
.up{display:grid;grid-template-columns:44px auto 1fr auto;gap:12px;align-items:center;border:0;background:none;padding:10px 4px;border-bottom:1px solid var(--line);text-align:left;cursor:pointer;color:inherit}
.up:last-child{border-bottom:0}
.up-date{display:grid;text-align:center;line-height:1.1}
.up-date b{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;color:var(--muted);font-weight:500}
.up-date span{font-family:var(--display);font-size:1.4rem;font-weight:700}
.up-t b{display:block;font-weight:600;font-size:.92rem}
.up-t small{display:block;color:var(--muted);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}
.goals{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.goals>div{display:grid;gap:2px}
.dash-grid{display:grid;gap:16px}
.dash-col{display:grid;gap:16px;align-content:start}

/* Séance : cartes plus sobres */
.sess{border-left-width:1px;border-radius:var(--radius);box-shadow:var(--shadow);position:relative;overflow:hidden}
.sess::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--c)}
.tick{transition:transform .2s ease,background .2s ease}
.tick[data-s="done"]{animation:pop .35s ease}
@keyframes pop{0%{transform:scale(.8)}60%{transform:scale(1.12)}100%{transform:scale(1)}}

/* Onglets segmentés (Saison / Semaine / Liste) */
.segtabs{display:grid;grid-template-columns:repeat(3,1fr);background:var(--surface-2);border-radius:10px;padding:3px;gap:3px}
.segtabs button{border:0;background:none;border-radius:8px;min-height:38px;font-weight:600;cursor:pointer;color:var(--muted)}
.segtabs button[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}

/* Saison */
.season{position:relative}
.season-svg text{font-size:10px}
.grow{transform-box:fill-box;transform-origin:bottom;animation:grow .6s cubic-bezier(.2,.8,.2,1) both}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* Semaine */
.stack{display:flex;height:8px;border-radius:4px;overflow:hidden;gap:2px}
.stack i{display:block;height:100%}
.week-grid{display:grid;gap:8px}
.wday{display:grid;grid-template-columns:48px 1fr;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px;box-shadow:var(--shadow)}
.wday.today{border-color:var(--ink)}
.wday-h{display:grid;align-content:start;text-align:center;line-height:1.1}
.wday-h b{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;color:var(--muted);font-weight:500}
.wday-h span{font-family:var(--display);font-size:1.5rem;font-weight:700}
.wday-s{display:grid;gap:6px;align-content:center}
.mini{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border:0;background:var(--surface-2);border-radius:8px;padding:8px 10px;text-align:left;cursor:pointer;color:inherit}
.mini-t b{display:block;font-size:.88rem;font-weight:600}
.mini-t small{display:block;font-size:.76rem;color:var(--muted);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.mini.st-done{opacity:.6}
.mini.st-done .num{color:var(--ok);font-weight:700}
.rest{font-size:.82rem;color:var(--muted)}
@media (min-width:900px){
  .week-grid{grid-template-columns:repeat(7,1fr)}
  .wday{grid-template-columns:1fr;align-content:start;min-height:180px}
  .mini{grid-template-columns:auto 1fr}
  .mini .num{grid-column:2}
}

/* Fiche séance cockpit */
.cockpit-session{display:grid;gap:6px;padding:4px 0 8px;border-bottom:1px solid var(--line)}
.sport-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cockpit-session h2{font-size:1.5rem;text-transform:uppercase}
.facts-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:10px;margin-top:6px}
.facts-row div{display:grid}
.facts-row b{font-size:1.15rem}
.facts-row span{font-size:.72rem;color:var(--muted)}

/* Race Day : écran émotionnel */
body.race-open .top,body.race-open .tabs{display:none}
body.race-open{padding-bottom:0;background:#050607}
.raceday{position:relative;min-height:100vh;margin:-16px calc(-1 * max(16px,env(safe-area-inset-left))) -32px;padding:max(28px,env(safe-area-inset-top)) 24px 160px;
  background:radial-gradient(120% 70% at 50% 0%,#1A1D23 0%,#050607 60%);color:#F1F2F4;display:grid;align-content:start;gap:18px;overflow:hidden}
.raceday .eyebrow{color:#9AA0A8}
.raceday h1{font-size:clamp(3.6rem,18vw,7rem);letter-spacing:.04em;line-height:.9}
.race-name{font-size:1.05rem;color:#C9CDD3;margin-top:-8px}
.race-back{justify-self:start;border:1px solid #2A2E35;background:transparent;color:#F1F2F4;border-radius:999px;padding:8px 14px;cursor:pointer}
.race-dist{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:1px solid #23262C;border-bottom:1px solid #23262C;padding:14px 0}
.race-dist b{display:block;font-family:var(--display);font-size:2rem}
.race-dist span{font-size:.75rem;color:#9AA0A8}
.race-cd b{color:#fff}
.race-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.race-grid b{display:block;font-family:var(--display);font-size:1.6rem}
.race-grid small{color:#9AA0A8}
.race-bar{height:4px;background:#23262C;border-radius:2px;overflow:hidden}
.race-bar i{display:block;height:100%;background:#FF3B4E}
.raceday .ecg{position:absolute;left:0;right:0;bottom:-4px;width:100%;opacity:.35;pointer-events:none}
.clickable-card{cursor:pointer}

/* Ordinateur : rail de navigation à gauche, tableau de bord en 2 colonnes */
@media (min-width:1000px){
  body{padding-bottom:0;padding-left:96px}
  .tabs{top:0;bottom:0;right:auto;width:96px;grid-template-columns:1fr;grid-auto-rows:84px;align-content:start;padding-top:96px;border-top:0;border-right:1px solid var(--line)}
  .tabs button{height:84px}
  .tabs button[aria-current="page"]::before{left:0;right:auto;top:22%;bottom:22%;width:3px;height:auto;border-radius:0 3px 3px 0}
  .top-in,.view{max-width:1120px}
  .dash-grid{grid-template-columns:1.25fr 1fr;align-items:start}
  body.race-open{padding-left:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
.up .num{white-space:nowrap}
.season-svg text{font-size:11px}
