:root{--navy:#092b46;--blue:#17618e;--orange:#f28a28;--cream:#fff8ef;--bg:#f6f8fa;--card:#fff;--text:#17232c;--muted:#667782;--line:#e2e8ec;--green:#188653;--greenbg:#e8f6ee;--red:#b42318;--redbg:#fff0ee;--yellow:#9a6200;--yellowbg:#fff5dc;--shadow:0 10px 35px rgba(9,43,70,.08);--r:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}
a{text-decoration:none;color:inherit}.hidden{display:none!important}.container{max-width:1220px;margin:auto;padding:0 22px}
.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:20}.nav{display:flex;align-items:center;justify-content:space-between;width:100%;gap:20px}.logo{font-weight:950;font-size:27px;color:var(--navy);letter-spacing:-1px}.logo span{color:var(--orange)}.links{display:flex;gap:24px;color:#42525c;font-weight:700;font-size:14px}.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.btn{border:0;border-radius:11px;padding:11px 15px;font-weight:850}.primary{background:var(--orange);color:#fff}.dark{background:var(--navy);color:#fff}.outline{background:#fff;border:1px solid var(--line);color:var(--navy)}.soft{background:#edf4f8;color:var(--navy)}.danger{background:var(--redbg);color:var(--red)}.success{background:var(--greenbg);color:var(--green)}
.hero{padding:82px 0 70px;background:linear-gradient(180deg,#fff,#fff8ef)}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:center}.eyebrow{color:var(--orange);font-weight:900;text-transform:uppercase;letter-spacing:1.5px;font-size:12px}.hero h1{font-size:58px;line-height:1.02;letter-spacing:-2.5px;color:var(--navy);margin:12px 0 18px}.hero p{font-size:19px;line-height:1.55;color:#53636c;max-width:650px}.hero-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:24px;padding:24px}.mini-calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin-top:14px}.mini-day{background:#f5f8fa;border-radius:10px;padding:10px 5px;text-align:center;font-size:11px;color:var(--muted)}.mini-day b{display:block;color:var(--navy);font-size:12px;margin-bottom:7px}.mini-session{background:var(--orange);color:#fff;border-radius:7px;padding:7px 2px;font-weight:800}.section{padding:70px 0}.section h2{font-size:37px;color:var(--navy);letter-spacing:-1px;margin:0 0 10px}.section-lead{color:var(--muted);max-width:720px;font-size:17px}.grid{display:grid;gap:16px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}.icon{font-size:28px}.card h3{color:var(--navy);margin:10px 0 7px}.muted{color:var(--muted)}.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:28px}.price{position:relative}.price.featured{border:2px solid var(--orange);transform:translateY(-5px)}.price .amount{font-size:34px;font-weight:950;color:var(--navy)}.price small{color:var(--muted)}.price ul{padding-left:18px;line-height:1.9;color:#53636c}.popular{position:absolute;right:15px;top:15px;background:var(--orange);color:#fff;padding:5px 8px;border-radius:99px;font-size:10px;font-weight:900}
.footer{background:var(--navy);color:#d7e4eb;padding:35px 0;margin-top:20px}.footer .logo{color:#fff}.footer span{color:var(--orange)}
.app-shell{min-height:calc(100vh - 72px)}.dash{display:grid;grid-template-columns:235px 1fr;min-height:100vh}.side{background:var(--navy);color:#d9e6ed;padding:22px 13px}.side .userbox{padding:13px;border:1px solid #31536a;border-radius:13px;margin-bottom:18px}.side .userbox b{color:#fff;display:block}.side button{width:100%;border:0;background:transparent;color:#d9e6ed;text-align:left;padding:11px 12px;border-radius:10px;font-weight:750;margin:2px 0}.side button:hover,.side button.active{background:#164e73;color:#fff}.workspace{padding:28px;max-width:1500px;width:100%;margin:auto}.workspace-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;margin-bottom:22px}.workspace h1{margin:0;color:var(--navy);font-size:29px}.sub{color:var(--muted);margin-top:5px}.stat{padding:18px;border:1px solid var(--line);background:#fff;border-radius:15px}.stat .n{font-size:29px;font-weight:950;color:var(--navy)}.stat .l{font-size:12px;color:var(--muted)}.client{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid var(--line);background:#fff;padding:14px;border-radius:13px;margin:8px 0}.avatar{width:43px;height:43px;border-radius:50%;background:#eaf2f7;display:grid;place-items:center;font-weight:950;color:var(--navy)}.client-info{display:flex;align-items:center;gap:12px}.badge{display:inline-block;padding:5px 9px;border-radius:99px;background:#edf4f8;color:var(--blue);font-size:11px;font-weight:850}.badge.green{background:var(--greenbg);color:var(--green)}.badge.orange{background:var(--yellowbg);color:var(--yellow)}.badge.red{background:var(--redbg);color:var(--red)}
.plan{border:1px solid var(--line);background:#fff;border-radius:16px;overflow:hidden;margin-bottom:16px}.week-head{background:var(--navy);color:#fff;padding:11px 14px;display:flex;justify-content:space-between}.days{display:grid;grid-template-columns:repeat(7,1fr);min-width:1050px}.day{min-height:185px;padding:10px;border-right:1px solid var(--line)}.day:last-child{border-right:0}.dayname{font-size:10px;text-transform:uppercase;font-weight:900;color:var(--muted);margin-bottom:8px}.session{padding:10px;border:1px solid #dce5ea;border-left:4px solid var(--orange);border-radius:10px;background:#fbfcfd;cursor:pointer}.session.rest{border-left-color:#b8c2c8;background:#f5f6f7;cursor:default}.session b{font-size:12px;color:var(--navy)}.session small{display:block;color:#53636c;line-height:1.4;margin-top:5px}.scroll{overflow:auto}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.field label{display:block;font-size:12px;font-weight:850;color:var(--navy);margin-bottom:6px}.field input,.field select,.field textarea{width:100%;padding:11px;border:1px solid #d5dde2;border-radius:10px;background:#fff}.field textarea{min-height:90px;resize:vertical}.notice{padding:12px 14px;border-radius:11px;background:var(--yellowbg);color:#754d0a;border:1px solid #f1d49e;margin:12px 0}.notice.red{background:var(--redbg);color:var(--red);border-color:#f0c4c0}.notice.green{background:var(--greenbg);color:#155b3c;border-color:#bfe3cc}.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.filters input,.filters select{padding:10px;border:1px solid #d5dde2;border-radius:10px}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;font-size:12px}.table th{background:#f3f6f8;color:var(--navy)}.empty{text-align:center;padding:35px;color:var(--muted)}
.modalback{position:fixed;inset:0;background:rgba(5,20,32,.62);z-index:100;display:flex;justify-content:center;align-items:center;padding:20px}.modal{width:min(850px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:20px;padding:22px}.modal-head{display:flex;justify-content:space-between;gap:15px}.modal-close{border:0;border-radius:50%;width:34px;height:34px;background:#edf1f3;font-size:20px;cursor:pointer;flex:none}.detail{border:1px solid var(--line);border-radius:11px;padding:12px;margin:8px 0}.detail b{display:block;font-size:10px;text-transform:uppercase;color:var(--navy);margin-bottom:5px}.modal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.chooser{border:1px solid var(--line);border-radius:11px;padding:12px;margin:7px 0;cursor:pointer}.chooser:hover{background:#f5f9fb}.toast{position:fixed;right:20px;bottom:20px;background:var(--navy);color:#fff;padding:12px 16px;border-radius:10px;display:none;z-index:200}
.login{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:30px;background:linear-gradient(180deg,#fff8ef,#f6f8fa)}.login-card{width:min(460px,100%);background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--shadow)}.role-tabs{display:grid;grid-template-columns:1fr 1fr;background:#edf3f6;border-radius:11px;padding:4px;margin-bottom:20px}.role-tabs button{border:0;background:transparent;padding:10px;border-radius:8px;font-weight:850}.role-tabs button.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.06)}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr}.price-grid,.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr 1fr}.dash{grid-template-columns:190px 1fr}}
@media(max-width:700px){.links{display:none}.hero h1{font-size:42px}.price-grid,.g3,.g4,.form-grid,.filters{grid-template-columns:1fr}.dash{display:block}.side{display:block}.workspace{padding:17px}.workspace-head{flex-direction:column}.topbar{height:62px}.hero{padding-top:55px}}
@media print{.topbar,.side,.workspace-head,.no-print{display:none!important}.workspace{padding:0}.card{box-shadow:none}.plan{break-inside:avoid}}

/* ===== UNYWAYS V2 — finition produit ===== */
:root{
  --orange2:#ff9b3d;
  --navy2:#061f33;
  --surface:#ffffff;
  --surface2:#f9fbfc;
}
::selection{background:rgba(242,138,40,.22);color:var(--navy)}
body{letter-spacing:-.01em}
button,.btn,a,.session,.chooser,.client{transition:all .18s ease}
.btn:hover{transform:translateY(-1px);filter:brightness(1.02)}
.btn:active{transform:translateY(0)}
.card{transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.card:hover{box-shadow:0 14px 42px rgba(9,43,70,.11)}
.hero:after{content:"";display:block;position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.hero{position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;width:480px;height:480px;border-radius:50%;right:-220px;top:-220px;background:radial-gradient(circle,rgba(242,138,40,.11),transparent 68%);pointer-events:none}
.kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:#fff;border:1px solid #f1dfcc;color:var(--navy);font-size:11px;font-weight:900}
.kicker i{width:7px;height:7px;border-radius:50%;background:var(--green);display:block}
.trust-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.trust-pill{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#52636d;font-size:12px;font-weight:750}
.feature-card{height:100%;display:flex;flex-direction:column}
.feature-card .bottom{margin-top:auto;padding-top:15px}
.quote{font-size:15px;line-height:1.6;color:#43535d}
.quote-author{font-size:12px;font-weight:850;color:var(--navy);margin-top:14px}
.faq{border:1px solid var(--line);border-radius:14px;background:#fff;margin:9px 0;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:850;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";float:right;font-size:20px;color:var(--orange)}
.faq[open] summary:after{content:"−"}
.faq .faq-body{padding:0 18px 18px;color:var(--muted);line-height:1.6}
.cta-band{background:linear-gradient(135deg,var(--navy),#124a70);border-radius:24px;padding:34px;color:#fff;position:relative;overflow:hidden}
.cta-band:after{content:"";position:absolute;width:300px;height:300px;right:-120px;top:-140px;border-radius:50%;background:rgba(242,138,40,.16)}
.progress{height:8px;border-radius:99px;background:#e9eef1;overflow:hidden}
.progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),var(--orange2))}
.app-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.mobile-nav{display:none}
.notification-dot{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--orange);color:#fff;font-size:10px;font-weight:900}
.stat .n{letter-spacing:-1px}
.client:hover{border-color:#cbd9e1;transform:translateY(-1px)}
.table tbody tr:hover{background:#f8fafb}
.table tbody tr{transition:background .15s}
.plan-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.plan .session:hover{border-color:#c8d8e1;box-shadow:0 5px 15px rgba(9,43,70,.06)}
/* Code couleur par type de séance (voir sessionColorClass()/SESSION_KIND_COLOR dans
   member-app.js) : appliqué sur la bordure gauche des séances du calendrier, sur le point
   coloré de la bibliothèque, et sur l'accent de la case "séance du jour" de l'accueil.
   Placé AVANT .session.done/.session.rest ci-dessous : ces états gardent la priorité
   visuelle (une séance terminée reste verte "terminée", quel que soit son type). */
.session.k-green,.today-card.k-green{border-left-color:#16A34A}
.session.k-blue,.today-card.k-blue{border-left-color:#2563EB}
.session.k-orange,.today-card.k-orange{border-left-color:#F97316}
.session.k-red,.today-card.k-red{border-left-color:#DC2626}
.session.k-purple,.today-card.k-purple{border-left-color:#9333EA}
.session.k-teal,.today-card.k-teal{border-left-color:#0D9488}
.session.k-pink,.today-card.k-pink{border-left-color:#DB2777}
.session.k-grey,.today-card.k-grey{border-left-color:#6B7280}
.today-card.k-green,.today-card.k-blue,.today-card.k-orange,.today-card.k-red,.today-card.k-purple,.today-card.k-teal,.today-card.k-pink,.today-card.k-grey{border-left-width:4px}
.kind-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle;flex-shrink:0}
.kind-dot.k-green{background:#16A34A}
.kind-dot.k-blue{background:#2563EB}
.kind-dot.k-orange{background:#F97316}
.kind-dot.k-red{background:#DC2626}
.kind-dot.k-purple{background:#9333EA}
.kind-dot.k-teal{background:#0D9488}
.kind-dot.k-pink{background:#DB2777}
.kind-dot.k-grey{background:#6B7280}
.kind-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin:14px 0;font-size:11.5px;font-weight:750;color:var(--muted)}
.kind-legend-item{display:inline-flex;align-items:center}
.session.done{opacity:.72;border-left-color:var(--green);background:var(--greenbg)}
.session.done:after{content:"✓";float:right;color:var(--green);font-weight:950}
/* Bouton × de suppression directe d'une séance (calendrier coach) */
.session.has-del{position:relative;padding-right:30px}
.session-del{position:absolute;top:6px;right:6px;width:24px;height:24px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:transparent;color:#5b6b7f;font-size:17px;line-height:1;font-weight:700;cursor:pointer}
.session-del:hover,.session-del:focus-visible{background:#fde8e6;color:#b42318}
.session-del:focus-visible{outline:2px solid #b42318;outline-offset:1px}
@media print{.session-del{display:none}}
.side small{color:#9eb4c2}
.side{position:relative}
.side .side-foot{position:absolute;left:13px;right:13px;bottom:16px}
.form-note{font-size:11px;color:var(--muted);line-height:1.5;margin-top:8px}
.checkbox-row{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:#53636c;line-height:1.45}
.checkbox-row input{margin-top:3px}
.login-card{position:relative}
.stepper{display:flex;gap:7px;margin:0 0 18px}
.stepper span{height:5px;flex:1;border-radius:99px;background:#e8edf0}
.stepper span.active{background:var(--orange)}
.section.alt{background:#f1f5f7}
@media(max-width:700px){
  .container{padding:0 16px}
  .hero-grid{gap:28px}
  .hero h1{font-size:40px;letter-spacing:-1.8px}
  .hero p{font-size:16px}
  .hero .actions{width:100%}
  .hero .actions .btn{flex:1}
  .section{padding:54px 0}
  .section h2{font-size:31px}
  .dash{min-height:100vh}
  /* top:0 (pas top:62px) : ces pages (coach.html/coureur.html) n'ont pas de .topbar fixe
     au-dessus — un décalage de 62px ici recollait la nav sous un en-tête qui n'existe
     pas, et faisait passer le titre de chaque page sous la barre de nav dès le chargement
     (le contenu suit le flux normal, pas la position "collée" de .side). */
  .side{padding:12px;display:flex;gap:6px;overflow:auto;position:sticky;top:0;z-index:15}
  .side .logo,.side .userbox,.side .side-foot{display:none}
  .side button{white-space:nowrap;width:auto;margin:0;padding:9px 11px;font-size:12px}
  /* #coachNav enveloppe les boutons du coach dans un <div> (contrairement à l'espace
     coureur, où les boutons sont enfants directs de .side) : sans ce correctif, ce <div>
     casse la ligne défilante horizontale ci-dessus et les boutons s'empilent sur
     plusieurs lignes, recouvrant le titre de la page. display:contents le retire de la
     mise en page pour que ses boutons redeviennent des enfants directs de la ligne flex. */
  #coachNav{display:contents}
  .workspace{padding:14px}
  .workspace-head{gap:10px}
  .workspace-head .actions{width:100%}
  .workspace-head .actions .btn{flex:1}
  .days{min-width:910px}
  .day{min-height:170px}
  .modal{padding:17px;border-radius:16px}
  .price.featured{transform:none}
  .cta-band{padding:25px 20px}
}
@media(min-width:701px) and (max-width:1000px){
  .side{position:sticky;top:72px;height:calc(100vh - 72px)}
}


/* ===== HOME V2 — direction produit : accueil coureur centré sur la séance du jour ===== */
.today-card{margin-top:18px;padding:24px;border:1px solid var(--line)}
.today-card.rest{background:linear-gradient(180deg,#fff,#f7fbf8)}
.today-card.done{background:linear-gradient(180deg,#fff,var(--greenbg))}
.today-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.today-card h2{margin:6px 0 4px;color:var(--navy);font-size:24px;letter-spacing:-.5px}
.today-sub{color:var(--muted);margin:0 0 4px}
.today-pace{display:block;margin:4px 0 10px;padding:10px 12px;border-radius:10px;background:#edf4f8;color:var(--blue);font-weight:850;font-size:13px}
.today-pace-explain{display:block;margin-top:4px;color:var(--muted);font-weight:600;font-size:12px}
.today-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px}
.today-detail-grid .detail{margin:0}
.today-cta{width:100%;margin-top:18px;padding:17px;font-size:16px;border-radius:14px}
.week-stats{margin-top:18px;padding:20px}
.week-stats-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.week-stats-head b{display:block;color:var(--navy);font-size:15px}
.week-stats-head .muted{display:block;font-size:12px;margin-top:3px}
.week-stats-count{font-size:22px;font-weight:950;color:var(--navy);white-space:nowrap}
.week-stats-count small{font-size:12px;font-weight:700;color:var(--muted);margin-left:2px}
.week-stats-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.wd{position:relative;aspect-ratio:1;border-radius:10px;background:#f2f5f7;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10px;font-weight:900;gap:2px}
.wd span{font-size:10px;text-transform:uppercase;letter-spacing:.02em}
.wd.rest{background:#f7f8f9;color:#b7c0c6}
.wd.done{background:var(--greenbg);color:var(--green)}
.wd.today{background:#fff2e6;color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange)}
.wd.missed{background:var(--redbg);color:var(--red)}
.wd.upcoming{background:#f2f5f7;color:#8b9aa3}
.week-stats-foot{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:12.5px;font-weight:750;color:var(--muted)}
.quick-summary .stat.info{display:flex;align-items:center}
.quick-summary .stat.info .l{font-size:13px;color:rgba(255,255,255,.85);font-weight:750;line-height:1.4}
.pill-radio-row{display:flex;gap:8px;flex-wrap:wrap}
.pill-radio{flex:1;min-width:90px;min-height:46px;border:1px solid #d5dde2;background:#fff;border-radius:11px;font-weight:850;color:var(--navy);padding:10px}
.pill-radio.active{background:var(--navy);border-color:var(--navy);color:#fff}
.anchor-slider{background:#f6f8fa;border:1px solid #d5dde2;border-radius:14px;padding:16px 18px;text-align:center}
.anchor-slider-value{display:flex;align-items:baseline;justify-content:center;gap:4px}
.anchor-slider-value b{font-size:34px;font-weight:900;color:var(--navy)}
.anchor-slider-value span{font-size:14px;font-weight:700;color:var(--slate-light)}
.anchor-slider-label{margin:4px 0 14px;font-size:13.5px;font-weight:800;color:var(--orange);min-height:17px}
.anchor-slider input[type="range"]{width:100%;accent-color:var(--orange);height:6px}
.rpe-scale-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:4px}
.glossary{display:flex;flex-direction:column;gap:9px}
.gloss-item b{display:block;font-size:11.5px;font-weight:800;color:var(--navy);margin-bottom:2px}
.gloss-item span{display:block;font-size:12.5px;color:var(--muted);line-height:1.4}
#modalBack .modal .gloss-item b{color:#fff}
#modalBack .modal .gloss-item span{color:rgba(255,255,255,.68)}
@media(max-width:700px){
  .today-detail-grid{grid-template-columns:1fr}
  .today-card{padding:18px}
  .today-card h2{font-size:20px}
  .pill-radio{font-size:12.5px;padding:10px 4px;min-width:0}
}

/* ===== LIQUID GLASS — espace membre (coach + coureur) =====
   Reprend exactement les tokens de la page d'accueil (index.html : navy
   #0A1B33/#071021, orange #FF5A1F/amber #FF8A3D, polices Archivo Expanded /
   Manrope / JetBrains Mono, composant .card-program) pour que le tableau de
   bord ait la même finition « verre » sombre que le hero du site public.
   Tout est scopé sous .dash pour ne jamais toucher la page de connexion ni
   l'ancienne page d'accueil publique (.hero/.price/.faq, non utilisées ici). */
:root{
  --dg-navy-900:#070B18;
  --dg-navy-800:#0D2244;
  --dg-navy-700:#1B2E63;
  --dg-orange:#FF6B35;
  --dg-orange-600:#E8541E;
  --dg-amber:#FFA351;
  --dg-violet:#8A6FFF;
  --dg-blue:#4C9FFF;
  --dg-blue-light:#8AC4FF;
}
.dash{
  font-family:'Manrope',Inter,ui-sans-serif,system-ui,sans-serif;
  /* Davantage d'orange (retour du 25/08 : "que du bleu", comparé à la page d'accueil, qui
     en montre beaucoup plus — glow du hero, ticker, CTA...) : lueur du coin haut-droit
     renforcée, + une seconde lueur orange en bas de page pour que la couleur de marque
     porte sur tout le défilement, pas seulement l'écran d'accueil de chaque page. */
  background:
    radial-gradient(1100px 640px at 90% -8%, rgba(255,107,53,.28), transparent 60%),
    radial-gradient(900px 680px at 8% 100%, rgba(255,107,53,.14), transparent 62%),
    radial-gradient(760px 620px at 6% 18%, rgba(138,111,255,.13), transparent 62%),
    radial-gradient(900px 720px at -8% 105%, rgba(23,58,106,.45), transparent 58%),
    linear-gradient(165deg,var(--dg-navy-900),var(--dg-navy-800) 55%,#0f2038 100%);
}
.dash h1,.dash h2,.dash h3,.dash .logo,.dash .stat .n,.dash .today-card h2,.dash .price .amount{
  font-family:'Archivo Expanded','Manrope',sans-serif;letter-spacing:-.02em;
}
.dash .badge,.dash .detail b,.dash .stat .l,.dash .dayname,.dash .today-head>span,.dash .eyebrow{
  font-family:'JetBrains Mono',monospace;letter-spacing:.06em;
}
.side{
  background:
    radial-gradient(340px 260px at 15% 92%, rgba(255,107,53,.16), transparent 65%),
    linear-gradient(170deg,rgba(7,16,33,.92),rgba(13,34,68,.88));
  backdrop-filter:blur(26px) saturate(160%);
  -webkit-backdrop-filter:blur(26px) saturate(160%);
  border-right:1px solid rgba(255,255,255,.08);
  box-shadow:10px 0 40px rgba(3,10,20,.35);
}
.side .userbox{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);backdrop-filter:blur(6px)}
.side button{position:relative}
.side button.active{background:rgba(255,107,53,.16);box-shadow:inset 0 0 0 1px rgba(255,107,53,.28)}
.side button.active::before{content:"";position:absolute;left:-13px;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--dg-orange);box-shadow:0 0 10px rgba(255,107,53,.7)}
.side button:hover{background:rgba(255,107,53,.09)}
.workspace{background:transparent;color:rgba(255,255,255,.86)}
.dash .workspace h1{color:#fff}
.dash .sub{color:rgba(255,255,255,.62)}
.dash .muted{color:rgba(255,255,255,.55)}
.dash .card,.dash .stat,.dash .today-card,.dash .plan,.dash .client,.dash .chooser,.dash .section-panel{
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 70px rgba(2,8,16,.45),inset 0 1px 0 rgba(255,255,255,.07);
}
.dash .card,.dash .stat,.dash .today-card,.dash .section-panel{position:relative;overflow:hidden}
.dash .card::before,.dash .stat::before,.dash .today-card::before,.dash .section-panel::before{
  content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-100px;top:-110px;pointer-events:none;
  background:radial-gradient(circle,rgba(255,107,53,.22),transparent 70%);
}
/* À l'essai (25/08, "que du bleu... je veux tester une case orange une bleue") : deux
   variantes de couleur pour les grilles de mini-cartes (accueil, records), en alternance,
   pour un rendu plus vivant/moderne que des cartes toutes identiques. Réversible d'un coup
   si le rendu ne convainc pas : il suffit de retirer .accent-orange/.accent-blue au JS. */
.dash .accent-orange{border-left:3px solid var(--dg-orange)}
.dash .accent-blue{border-left:3px solid var(--dg-blue)}
.dash .accent-orange::before{background:radial-gradient(circle at 25% 15%,rgba(255,107,53,.32),transparent 65%),radial-gradient(circle at 90% 95%,rgba(76,159,255,.14),transparent 60%)}
.dash .accent-blue::before{background:radial-gradient(circle at 25% 15%,rgba(76,159,255,.32),transparent 65%),radial-gradient(circle at 90% 95%,rgba(255,107,53,.14),transparent 60%)}
.dash .pr-card.accent-orange,.dash .league-record-block.accent-orange{border-left:3px solid var(--dg-orange);background:linear-gradient(160deg,rgba(255,107,53,.1),rgba(255,255,255,.045))}
.dash .pr-card.accent-blue,.dash .league-record-block.accent-blue{border-left:3px solid var(--dg-blue);background:linear-gradient(160deg,rgba(76,159,255,.1),rgba(255,255,255,.045))}
.dash .pr-card.accent-orange .pr-time,.dash .accent-orange .stat-chip-value{color:var(--dg-amber);background:linear-gradient(135deg,var(--dg-orange),var(--dg-amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dash .pr-card.accent-blue .pr-time,.dash .accent-blue .stat-chip-value{color:var(--dg-blue-light);background:linear-gradient(135deg,var(--dg-blue),var(--dg-blue-light));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* "Version 1" (25/08) : extension de l'alternance orange/bleu à tout l'espace coureur ET
   coach, via :nth-child plutôt que des classes ajoutées au JS partout — un seul endroit à
   modifier (ou retirer) pour tout annuler d'un coup si on revient en arrière. Repère de
   retour en arrière : tag git "version-1-orange-bleu". */
.dash .stat-strip .stat-chip:nth-child(odd){box-shadow:inset 3px 0 0 var(--dg-orange)}
.dash .stat-strip .stat-chip:nth-child(even){box-shadow:inset 3px 0 0 var(--dg-blue)}
.dash .stat-strip .stat-chip:nth-child(odd) .stat-chip-value{color:var(--dg-amber);background:linear-gradient(135deg,var(--dg-orange),var(--dg-amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dash .stat-strip .stat-chip:nth-child(even) .stat-chip-value{color:var(--dg-blue-light);background:linear-gradient(135deg,var(--dg-blue),var(--dg-blue-light));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dash .grid.g4 .stat:nth-child(odd){border-left:3px solid var(--dg-orange)}
.dash .grid.g4 .stat:nth-child(even){border-left:3px solid var(--dg-blue)}
.dash .grid.g4 .stat:nth-child(odd) .n{color:var(--dg-amber);background:linear-gradient(135deg,var(--dg-orange),var(--dg-amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dash .grid.g4 .stat:nth-child(even) .n{color:var(--dg-blue-light);background:linear-gradient(135deg,var(--dg-blue),var(--dg-blue-light));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dash .race-import-grid .race-import-card:nth-child(odd){border-left:3px solid var(--dg-orange)}
.dash .race-import-grid .race-import-card:nth-child(even){border-left:3px solid var(--dg-blue)}
.dash .client:nth-child(odd){border-left:3px solid var(--dg-orange)}
.dash .client:nth-child(even){border-left:3px solid var(--dg-blue)}
/* .league-progression-row/.league-challenge : ni l'un ni l'autre n'a de conteneur dédié
   n'accueillant que ce type d'élément (un <h2 class="section-title"> voisin fausserait le
   comptage :nth-child) — accent posé explicitement en JS via .accent-orange/.accent-blue,
   qui réutilisent les mêmes règles génériques définies plus haut. */
.dash .card h3,.dash .stat .n,.dash .today-card h2,.dash .session b,.dash .client b,.dash .table th{color:#fff}
.dash .stat .l{color:rgba(255,255,255,.5);text-transform:uppercase;font-size:10.5px}
/* Titres de section pour les pages qui empilent plusieurs blocs sur un seul écran plutôt
   que de les séparer par onglets (Mes courses, Ma ligue — cf. demande du 25/08
   "structurer"/"plus moderne"). Simple étiquette en majuscules + filet horizontal, pour
   marquer la coupure sans rivaliser visuellement avec le <h1> de la page. Partagé entre
   les deux pages (auparavant .race-section-title, propre à "Mes courses" uniquement). */
.dash .section-title{margin:32px 0 12px;display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.dash .section-title::before{content:"";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--dg-orange),var(--dg-blue));flex-shrink:0}
.dash .section-title::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.14)}
.dash .section-title:first-of-type{margin-top:22px}
/* ===== Un seul langage visuel pour les six pages =====
   L'accueil était composé en cartes — surface élevée, coins arrondis, halo, accent coloré —
   tandis que « Mes progrès », « Mon profil », « Mes courses » et « Ma ligue » posaient leur
   contenu à plat sur le fond. Mesuré avant correction : 9 cartes sur l'accueil, 0 sur les
   trois pages citées. En naviguant, on quittait une application pour entrer dans un
   formulaire.

   Plutôt que de réécrire le gabarit de chaque vue — quinze endroits à modifier, et autant
   d'occasions de diverger à la prochaine page ajoutée —, chaque titre de section et le
   contenu qui le suit sont regroupés à l'exécution dans un .section-panel (voir
   regrouperSections() dans member-app.js). Le panneau reçoit ci-dessus EXACTEMENT la même
   surface que .card : une seule définition, donc aucune dérive possible entre les deux.
   L'accueil n'a pas de titre de section : il garde ses cartes telles quelles. */
.dash .section-panel{border-radius:var(--r);padding:20px 22px;margin:0 0 18px}
.dash .section-panel>:first-child{margin-top:0}
.dash .section-panel>:last-child{margin-bottom:0}
/* Le titre devient l'étiquette de SON panneau : il se rapproche, et son filet horizontal
   n'a plus lieu d'être puisque le panneau marque déjà la coupure. */
.dash .section-title{margin:26px 0 10px}
.dash .section-title:first-of-type{margin-top:6px}
.dash .section-title::after{display:none}
/* L'alternance orange/bleu des cartes de l'accueil s'étend aux panneaux, pour que la
   couleur classe l'information de la même façon partout. Elle est posée en JS (classes
   .accent-orange/.accent-blue déjà définies plus haut) et NON par :nth-of-type : ce
   sélecteur compte tous les <div> voisins — en-tête de page, compte à rebours, bandeau de
   statistiques — pas seulement les panneaux. L'alternance en paraissait aléatoire, deux
   panneaux orange pouvant se suivre. Repéré en comparant le rendu à l'intention. */
/* Un bloc déjà posé dans un panneau ne doit pas empiler une deuxième surface : une carte
   dans une carte crée une profondeur que rien ne justifie. */
.dash .section-panel>.card{box-shadow:none;border-color:rgba(255,255,255,.10)}
/* Les deux classements de « Ma ligue » sur une même ligne : celui de la ligue répond à « où
   j'en suis parmi mes amis », celui entre ligues à « où en est mon groupe ». Empilés, il
   fallait faire défiler entre les deux pour comparer. align-items:start pour que la colonne
   la plus courte ne s'étire pas jusqu'à la hauteur de l'autre. */
.dash .league-duo{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;align-items:start}
.dash .league-duo>div{min-width:0}
/* Sous 1100px, les deux colonnes deviendraient trop étroites pour un nom de ligue suivi
   d'un effectif et d'une moyenne : elles repassent l'une sous l'autre. */
@media(max-width:1100px){.dash .league-duo{grid-template-columns:1fr}}
/* Le réglage de visibilité, montré au seul créateur, sous le classement entre ligues. */
.dash .league-visibilite{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12)}
.dash .league-visibilite b{color:#fff}
.dash .league-visibilite .btn{flex:none}
.dash .section-panel>.card::before{display:none}
/* De nombreux titres de carte (Ta progression, Réponse à l'entraînement, Adaptation
   automatique, Contrôle avant publication…) sont générés par member-app.js avec un
   style inline color:var(--navy)/var(--blue), pensé pour l'ancien fond clair. Un style
   inline gagne toujours sur une règle de classe : on neutralise donc précisément ces
   deux cas avec !important, sans toucher au JS qui les génère. */
.dash [style*="color:var(--navy)"],#modalBack .modal [style*="color:var(--navy)"]{color:#fff !important}
.dash [style*="color:var(--blue)"],#modalBack .modal [style*="color:var(--blue)"]{color:var(--dg-amber) !important}
.dash .today-card.rest{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(24,134,83,.10))}
.dash .today-card.done{background:linear-gradient(160deg,rgba(24,134,83,.14),rgba(255,255,255,.05))}
.dash .today-sub{color:rgba(255,255,255,.62)}
.dash .today-pace{background:rgba(255,107,53,.16);border:1px solid rgba(255,107,53,.4);color:var(--dg-amber)}
.dash .today-pace-explain{color:rgba(255,255,255,.6)}
.dash .week-head{background:linear-gradient(120deg,rgba(7,16,33,.96),rgba(23,58,106,.88));backdrop-filter:blur(10px);color:#fff}
.dash .day{border-right-color:rgba(255,255,255,.08)}
.dash .session{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.12);border-left:4px solid var(--dg-orange);backdrop-filter:blur(4px)}
/* Code couleur par type de séance, variante sombre (mêmes teintes que le thème clair mais
   éclaircies pour rester lisibles sur fond sombre) — voir le bloc équivalent en thème clair
   plus haut dans ce fichier pour le contexte complet. */
.dash .session.k-green,.dash .today-card.k-green{border-left-color:#4ADE80}
.dash .session.k-blue,.dash .today-card.k-blue{border-left-color:#60A5FA}
.dash .session.k-orange,.dash .today-card.k-orange{border-left-color:#FB923C}
.dash .session.k-red,.dash .today-card.k-red{border-left-color:#F87171}
.dash .session.k-purple,.dash .today-card.k-purple{border-left-color:#C084FC}
.dash .session.k-teal,.dash .today-card.k-teal{border-left-color:#2DD4BF}
.dash .session.k-pink,.dash .today-card.k-pink{border-left-color:#F472B6}
.dash .session.k-grey,.dash .today-card.k-grey{border-left-color:#9CA3AF}
/* .dash .card/.today-card plus haut redéfinit "border" en raccourci (donc border-left-width
   aussi) après la règle générique .today-card.k-*{border-left-width:4px} du thème clair :
   on la réaffirme ici, dans le thème sombre, pour que l'accent couleur reste visible. */
.dash .today-card.k-green,.dash .today-card.k-blue,.dash .today-card.k-orange,.dash .today-card.k-red,.dash .today-card.k-purple,.dash .today-card.k-teal,.dash .today-card.k-pink,.dash .today-card.k-grey{border-left-width:4px}
.dash .kind-dot.k-green{background:#4ADE80}
.dash .kind-dot.k-blue{background:#60A5FA}
.dash .kind-dot.k-orange{background:#FB923C}
.dash .kind-dot.k-red{background:#F87171}
.dash .kind-dot.k-purple{background:#C084FC}
.dash .kind-dot.k-teal{background:#2DD4BF}
.dash .kind-dot.k-pink{background:#F472B6}
.dash .kind-dot.k-grey{background:#9CA3AF}
.dash .kind-legend{color:rgba(255,255,255,.6)}
.dash .session.rest{background:rgba(255,255,255,.02);border-left-color:rgba(255,255,255,.18)}
.dash .session small{color:rgba(255,255,255,.55)}
.dash .session.done{background:rgba(24,134,83,.14);border-left-color:#39C17E}
.dash .session.done:after{color:#4ADE80}
.dash .session-del{color:rgba(255,255,255,.6)}
.dash .session-del:hover,.dash .session-del:focus-visible{background:rgba(255,138,122,.16);color:#ff8a7a;outline-color:#ff8a7a}
.dash .detail{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px);color:rgba(255,255,255,.82)}
.dash .detail b{color:var(--dg-amber);font-size:9.5px;text-transform:uppercase}
.dash .today-detail-grid .detail{background:rgba(255,255,255,.045)}
.dash .avatar{background:rgba(255,255,255,.1);color:#fff}
.dash .badge{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85);font-size:10.5px;text-transform:uppercase}
.dash .badge.green{background:rgba(24,134,83,.16);border-color:rgba(24,134,83,.42);color:#7CE7B4}
.dash .badge.orange{background:rgba(255,107,53,.16);border-color:rgba(255,107,53,.42);color:var(--dg-amber)}
.dash .badge.red{background:rgba(180,35,24,.18);border-color:rgba(180,35,24,.42);color:#FF9C90}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle;flex:none}
.status-dot.green{background:var(--green)}
.status-dot.yellow{background:var(--yellow)}
.status-dot.orange{background:var(--orange)}
.status-dot.red{background:var(--red)}
.rank-badge{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.85);font-size:10.5px;font-weight:700;flex:none}
.rank-badge.r1{background:rgba(255,193,7,.18);border-color:rgba(255,193,7,.45);color:#FFD966}
.rank-badge.r2{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4);color:#fff}
.rank-badge.r3{background:rgba(255,107,53,.16);border-color:rgba(255,107,53,.42);color:var(--dg-amber)}
.dash .notice{background:rgba(255,163,81,.12);border:1px solid rgba(255,163,81,.32);color:var(--dg-amber);backdrop-filter:blur(6px)}
.dash .notice.red{background:rgba(180,35,24,.14);border-color:rgba(180,35,24,.36);color:#FF9C90}
.dash .notice.green{background:rgba(24,134,83,.14);border-color:rgba(24,134,83,.36);color:#7CE7B4}
.dash .field label{color:rgba(255,255,255,.72);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.dash .field input,.dash .field select,.dash .field textarea,.dash .filters input,.dash .filters select,.dash .msg-composer textarea{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  backdrop-filter:blur(6px);
  transition:border-color .15s ease,box-shadow .15s ease;
}
.dash .field input::placeholder,.dash .field textarea::placeholder,.dash .msg-composer textarea::placeholder{color:rgba(255,255,255,.35)}
.dash .field input:focus,.dash .field select:focus,.dash .field textarea:focus,.dash .filters input:focus,.dash .filters select:focus,.dash .msg-composer textarea:focus{
  outline:none;border-color:var(--dg-orange);box-shadow:0 0 0 3px rgba(255,107,53,.2);
}
.dash .field select option{color:#0A1B33}
/* Cases à cocher "Surfaces disponibles"/"Matériel disponible" (Mon profil) et "Jours
   d'entraînement" (Gestion du programme) : .choice-grid/.check-pill étaient déjà
   référencées par endroits (checkedList(), commentaire "Gestion du programme" plus bas)
   mais jamais réellement stylées — de simples cases à cocher natives du navigateur,
   minuscules et sans rapport avec le thème (retour utilisateur "pas beau, trop petit").
   Cases tactiles larges, cochées via un pictogramme plutôt qu'un carré natif. */
.dash .choice-grid{display:flex;flex-wrap:wrap;gap:11px}
.dash .check-pill{
  position:relative;display:flex;align-items:center;gap:10px;
  padding:13px 20px 13px 16px;border-radius:14px;
  background:rgba(255,255,255,.045);border:1.5px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.8);font-size:14px;font-weight:750;
  cursor:pointer;user-select:none;transition:background .18s ease,border-color .18s ease,transform .15s ease;
}
.dash .check-pill:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);transform:translateY(-1px)}
.dash .check-pill input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.dash .check-pill::before{
  content:"";width:22px;height:22px;flex:none;border-radius:7px;
  border:1.5px solid rgba(255,255,255,.32);background:rgba(255,255,255,.04);
  background-repeat:no-repeat;background-position:center;background-size:14px;
  transition:background-color .18s ease,border-color .18s ease;
}
.dash .check-pill:has(input:checked){
  background:rgba(255,107,53,.16);border-color:rgba(255,107,53,.55);color:#fff;
}
.dash .check-pill:has(input:checked)::before{
  background-color:var(--dg-orange);border-color:var(--dg-orange);
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>');
}
.dash .check-pill:has(input:focus-visible){outline:2px solid var(--dg-orange);outline-offset:2px}
@media(max-width:700px){.dash .check-pill{padding:12px 16px 12px 13px;font-size:13.5px}}
/* Fenêtre "Cette semaine" (accueil coureur) : mêmes classes qu'en clair, recolorées
   pour le thème sombre "verre liquide" du tableau de bord — sinon var(--navy) (texte
   pensé pour fond clair) devient quasi illisible sur les cartes translucides sombres. */
.dash .week-stats-head b{color:#fff}
.dash .week-stats-count{color:#fff}
.dash .week-stats-count small{color:rgba(255,255,255,.5)}
.dash .week-stats-foot{color:rgba(255,255,255,.6)}
.dash .week-stats-next{color:rgba(255,255,255,.82);border-top-color:rgba(255,255,255,.12)}
.dash .hero-stat{background:rgba(255,255,255,.07)}
.dash .hero-stat span{color:rgba(255,255,255,.55)}
.dash .hero-stat b{color:#fff}
.dash .race-import-card{background:rgba(255,255,255,.06)}
.dash .race-import-card:hover{background:rgba(255,255,255,.09)}
.dash .ric-name{color:#fff}
.dash .ric-date,.dash .ric-stats span,.dash .race-pace-labels span{color:rgba(255,255,255,.55)}
.dash .ric-stats b{color:#fff}
.dash .ric-source{background:rgba(255,255,255,.08);color:rgba(255,255,255,.6)}
.dash .coach-today-label{color:rgba(255,255,255,.5)}
.dash .coach-today-stat b{color:#fff}
.dash .coach-today-stat span{color:rgba(255,255,255,.6)}
.dash .coach-today-stat.alert b{color:#FF9C90}
.dash .wd{background:rgba(255,255,255,.06);color:rgba(255,255,255,.5)}
.dash .wd.rest{background:rgba(255,255,255,.03);color:rgba(255,255,255,.28)}
.dash .wd.done{background:rgba(24,134,83,.2);color:#7CE7B4}
.dash .wd.today{background:rgba(255,107,53,.18);color:var(--dg-amber);box-shadow:inset 0 0 0 2px var(--dg-orange)}
.dash .wd.missed{background:rgba(180,35,24,.2);color:#FF9C90}
.dash .wd.upcoming{background:rgba(255,255,255,.045);color:rgba(255,255,255,.4)}
/* Vignette "Vue d'ensemble" (compte à rebours course + RPE moyen + retours) : même logique
   que .week-stats ci-dessus, var(--navy)/var(--muted) recolorés pour le fond sombre. */
.dash .orow{color:rgba(255,255,255,.6)}
.dash .orow b{color:#fff}
/* .checkbox-row (case "gêne ou douleur" du check-in) était déjà utilisée dans le thème
   sombre sans surcharge dédiée (texte gris clair pensé pour fond blanc) ; corrigé au passage
   pour rester lisible, aussi bien dans la vignette check-in que dans la modale. */
.dash .checkbox-row{color:rgba(255,255,255,.65)}
/* Champ obligatoire manquant ou invalide dans l'espace coureur (ex. date de début, « Mon profil ») */
.dash .field input.input-invalid{border-color:#ff8074;box-shadow:0 0 0 3px rgba(255,128,116,.2)}
.dash .form-error{margin:8px 0 0;color:#ffb3aa;font-size:12px;font-weight:700;line-height:1.4}
.dash .form-error[hidden]{display:none}
#modalBack .modal .field input.input-invalid{border-color:#ff8074;box-shadow:0 0 0 3px rgba(255,128,116,.2)}
#modalBack .modal .form-error{margin:8px 0 0;color:#ffb3aa;font-size:12px;font-weight:700;line-height:1.4}
#modalBack .modal .form-error[hidden]{display:none}
/* Fiche coureur côté coach : cartes claires dans la modale sombre. Le rose pâle et le blanc
   translucide y étaient illisibles ; rouge foncé (6,6:1 sur blanc) et gris ardoise ici. */
#modalBack .modal .card .form-error{color:#b42318}
#modalBack .modal .card .field .muted{color:#5b6b7f}
#modalBack .modal .card .field input.input-invalid{border-color:#b42318;box-shadow:0 0 0 3px rgba(180,35,24,.14)}
.dash .table{background:transparent}
.dash .table th{background:rgba(255,255,255,.05);border-bottom-color:rgba(255,255,255,.1)}
.dash .table td{border-bottom-color:rgba(255,255,255,.08);color:rgba(255,255,255,.82)}
.dash .table tbody tr:hover{background:rgba(255,255,255,.04)}
.dash .empty{color:rgba(255,255,255,.5)}
.dash .progress{background:rgba(255,255,255,.1)}
.dash .progress>span{background:linear-gradient(90deg,var(--dg-orange),var(--dg-amber))}
.dash .btn.outline{background:rgba(255,255,255,.06);backdrop-filter:blur(6px);border-color:rgba(255,255,255,.22);color:#fff}
.dash .btn.soft{background:rgba(255,255,255,.09);backdrop-filter:blur(6px);color:#fff}
.dash .btn.primary{background:var(--dg-orange);box-shadow:0 12px 28px rgba(255,107,53,.32)}
.dash .btn.primary:hover{background:var(--dg-orange-600)}
.dash .pill-radio{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18);color:#fff}
.dash .pill-radio.active{background:var(--dg-orange);border-color:var(--dg-orange);color:#fff}
.dash .anchor-slider{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}
.dash .anchor-slider-value b{color:#fff}
.dash .anchor-slider-value span{color:rgba(255,255,255,.5)}
.dash .anchor-slider-label{color:var(--dg-orange)}
.dash .anchor-slider input[type="range"]{accent-color:var(--dg-orange)}
.dash .rpe-scale-labels{color:rgba(255,255,255,.45)}
.dash .toast{background:rgba(7,16,33,.92);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12)}
.msg-card{display:flex;flex-direction:column;gap:14px}
.msg-thread{display:flex;flex-direction:column;gap:10px;max-height:440px;min-height:160px;overflow-y:auto;padding:4px 2px}
.msg-row{display:flex}
.msg-row.mine{justify-content:flex-end}
.msg-row.theirs{justify-content:flex-start}
.msg-bubble{max-width:78%;padding:10px 13px;border-radius:14px}
.msg-row.theirs .msg-bubble{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-bottom-left-radius:4px}
.msg-row.mine .msg-bubble{background:var(--dg-orange);border-bottom-right-radius:4px}
.msg-meta{font-size:10px;text-transform:uppercase;letter-spacing:.04em;opacity:.7;margin-bottom:3px}
.msg-body{font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.msg-composer{display:flex;gap:10px;align-items:flex-end}
.msg-composer textarea{flex:1;resize:vertical;min-height:44px;padding:11px;border:1px solid #d5dde2;border-radius:10px;background:#fff;font:inherit;color:inherit}
.msg-composer .btn{flex-shrink:0}
.checkin-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.checkin-head h3{margin:0;color:#fff;font-size:16px}
.checkin-sliders{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 20px}
.checkin-field{display:flex;align-items:center;gap:10px}
.checkin-field label{flex:0 0 92px;font-size:12px;font-weight:800;color:rgba(255,255,255,.72);text-transform:uppercase;letter-spacing:.03em}
.checkin-field input[type="range"]{flex:1;accent-color:var(--dg-orange)}
.checkin-val{flex:0 0 18px;text-align:center;font-weight:800;color:#fff;font-size:13px}
.checkin-actions{display:flex;gap:10px}
@media(max-width:480px){.checkin-sliders{grid-template-columns:1fr}}
.readiness-badge{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);margin-top:10px}
.readiness-badge b{font-size:20px;color:#fff}
.readiness-badge span{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:rgba(255,255,255,.7)}
.readiness-badge.green b,.readiness-badge.green span{color:#7CE7B4}
.readiness-badge.orange b,.readiness-badge.orange span{color:var(--dg-amber)}
.readiness-badge.red b,.readiness-badge.red span{color:#FF9C90}
.race-countdown{display:inline-flex;align-items:center;gap:12px;padding:10px 16px;border-radius:13px;background:rgba(255,107,53,.14);border:1px solid rgba(255,107,53,.35);margin-top:14px}
.race-countdown .rc-flag{display:flex;color:var(--dg-orange)}
.race-countdown .rc-text{display:flex;flex-direction:column}
.race-countdown .rc-text b{font-size:15px;color:#fff;font-weight:900;letter-spacing:-.01em}
.race-countdown .rc-text span{font-size:11px;font-weight:750;color:rgba(255,255,255,.68)}
/* Accueil coureur : la séance du jour est l'élément principal (.hero-session, pleine
   largeur), puis 3 cartes secondaires côte à côte (Cette semaine / Check-in / Vue
   d'ensemble) — jamais 4 cases de poids égal, pour que la hiérarchie visuelle reflète
   ce qui compte vraiment ("qu'est-ce que je dois faire aujourd'hui ?"). Réutilise
   autant que possible les classes existantes (.card,.today-card,.badge,.muted...) déjà
   prises en charge par le thème sombre ci-dessous ; seules les classes réellement
   nouvelles ont besoin de leurs propres règles ici. */
.hero-session{margin-top:18px;padding:30px 32px;border:1px solid var(--line);position:relative}
.hero-session h2{margin:10px 0 6px;color:var(--navy);font-size:30px;letter-spacing:-.8px;line-height:1.12}
.hero-stats{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 22px}
.hero-stat{padding:12px 18px;border-radius:14px;background:#f2f5f7;min-width:104px;max-width:100%;flex:0 1 auto}
.hero-stat span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;margin-bottom:4px}
.hero-stat b{display:block;font-size:19px;color:var(--navy);font-weight:950;letter-spacing:-.3px;line-height:1.25;overflow-wrap:break-word}
.hero-stat.wide{flex-basis:100%}
.hero-stat.wide b{font-size:14.5px;font-weight:800}
.hero-cta{padding:18px 26px;font-size:16.5px;border-radius:15px}
/* Import de course réelle (retours utilisateurs §8) : cartes de résultats + graphique
   d'évolution d'allure, dans le même langage visuel premium que le reste de l'app. */
.race-import-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.race-import-card{padding:16px 18px;border-radius:14px;background:#f2f5f7;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.race-import-card:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(10,27,51,.1)}
.ric-name{font-weight:900;color:var(--navy);font-size:15px}
.ric-date{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:2px}
.ric-stats{display:flex;gap:14px;margin-top:10px;flex-wrap:wrap}
.ric-stats span{font-size:11px;color:var(--muted);font-weight:700}
.ric-stats b{font-size:15px;color:var(--navy);font-weight:900}
.ric-source{display:inline-block;margin-top:10px;font-size:10.5px;font-weight:800;padding:3px 9px;border-radius:99px;background:#eef2f4;color:var(--muted)}
.race-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.race-stats-grid .hero-stat{min-width:0}
.race-chart-card{margin-top:16px;padding:18px 20px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.16)}
.race-chart-card h3{margin:0 0 12px;font-size:14px;color:#fff}
.race-pace-chart{width:100%;height:130px;display:block}
.race-pace-chart path{stroke:var(--dg-orange)}
.race-pace-chart circle{fill:var(--dg-orange)}
.race-pace-labels{display:flex;gap:14px;overflow-x:auto;margin-top:10px;padding-bottom:4px}
.race-pace-labels span{font-size:11px;color:rgba(255,255,255,.55);font-weight:700;white-space:nowrap}
/* Bandeau "Aujourd'hui" du tableau de bord coach : remplace l'accumulation de
   statistiques cumulatives par ce qui compte à l'instant T (mission "amélioration UX"). */
.coach-today{margin-top:18px;padding:26px 30px}
.coach-today-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--muted);margin-bottom:16px}
.coach-today-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.coach-today-stat{display:flex;flex-direction:column;gap:4px}
.coach-today-stat b{font-size:38px;font-weight:950;color:var(--navy);letter-spacing:-1px;line-height:1}
.coach-today-stat span{font-size:12.5px;font-weight:750;color:var(--muted)}
.coach-today-stat.alert b{color:var(--red)}
@media(max-width:700px){.coach-today-grid{grid-template-columns:repeat(2,1fr);gap:18px 14px}.coach-today{padding:20px}.coach-today-stat b{font-size:30px}}
.week-stats-next{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;font-weight:750;color:var(--navy)}
.home-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.dash .home-tiles>.card:nth-child(1),.dash .home-tiles>.card:nth-child(3){border-left:3px solid var(--dg-orange)}
.dash .home-tiles>.card:nth-child(2){border-left:3px solid var(--dg-blue)}
.dash .home-tiles>.card:nth-child(2)::before{background:radial-gradient(circle,rgba(76,159,255,.22),transparent 70%)}
.tile{margin-top:0;padding:20px;display:flex;flex-direction:column}
.tile h2,.tile h3{margin:4px 0 6px;font-size:17px}
.tile .today-sub{margin:0 0 10px}
.tile-btn{margin-top:auto;align-self:flex-start}
.overview-rows{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.orow{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12.5px;font-weight:750;color:var(--muted)}
.orow b{font-size:16px;color:var(--navy);font-weight:900}
.checkin-tile .readiness-badge{margin-top:auto;align-self:flex-start}
.overview-tile .race-countdown{margin-top:0;align-self:flex-start}
@media(max-width:1000px){.home-tiles{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.home-tiles{grid-template-columns:1fr}.hero-session{padding:22px 20px}.hero-session h2{font-size:24px}.hero-stat{min-width:0;flex:1;padding:10px 12px}.hero-cta{width:100%}}

/* ===== Refonte design espace coureur — Phase 1 : sidebar + accueil (mission dédiée) =====
   Objectif : app de compétition premium (sombre, hiérarchie forte, effets lumineux
   discrets) plutôt qu'une succession de cartes de même poids. Aucune nouvelle donnée :
   uniquement une présentation différente de ce que .hero-session/.week-stats/.checkin-tile/
   .overview-tile calculent déjà (voir member-app.js, section accueil coureur). */

/* Bas de sidebar : avatar/prénom/niveau, sur le .side-foot déjà prévu dans le CSS mais
   jusqu'ici inutilisé. Masqué en layout mobile horizontal comme le reste de .side-foot. */
.side-user{display:flex;align-items:center;gap:11px;padding:12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.side-user-avatar{width:38px;height:38px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-weight:950;font-size:14px;color:#fff;background:linear-gradient(155deg,var(--dg-orange),var(--dg-orange-600));box-shadow:0 0 0 2px rgba(255,255,255,.12),0 4px 14px rgba(255,107,53,.35)}
.side-user-info{min-width:0;flex:1}
.side-user-name{font-weight:850;font-size:12.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-user-level{display:block;font-size:10.5px;font-weight:750;color:rgba(255,255,255,.55);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Accueil : dashboard dense façon appli de compétition (réf. moodboard du 24/08) — hiérarchie
   par la DENSITÉ et les composants (badge circulaire, anneau de statut, mini-graphique),
   pas par une seule mega-carte. Toujours zéro donnée inventée : chaque composant vient d'un
   calcul déjà fait ailleurs dans le code, un "—" remplace toute valeur non disponible. */
.ath-dash h1,.ath-dash h2,.ath-dash h3,.ath-dash .logo,.ath-dash .stat .n,.ath-dash .today-card h2{
  font-family:'Poppins',Manrope,sans-serif;letter-spacing:-.015em;
}
.ath-dash{font-family:'Inter',Manrope,ui-sans-serif,system-ui,sans-serif}

.home-headline{margin-bottom:2px;display:flex;align-items:flex-start;gap:14px}
/* 29px comme .workspace h1 : l'accueil était la seule page à ne pas suivre la règle
   commune — écart invisible isolément, mais qui se voit en navigant. */
.home-headline h1{font-size:29px}
.home-headline .sub{font-size:13.5px}
.home-head-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.countdown-badge{width:64px;height:64px;border-radius:50%;border:2px solid rgba(255,107,53,.55);background:radial-gradient(circle at 30% 25%,rgba(255,107,53,.22),rgba(255,255,255,.03));display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;box-shadow:0 0 18px rgba(255,107,53,.18)}
.countdown-badge b{font-size:19px;font-weight:950;color:#fff;line-height:1}
.countdown-badge span{font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.6)}

.hero-session.premium{margin-top:18px;overflow:hidden}
.hero-session.premium::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--dg-orange),var(--dg-amber),transparent 85%)}
.hero-session.premium .today-head{margin-bottom:14px}
.hero-session.premium h2{font-size:32px}
.hero-session.compact{padding:22px 24px;margin-top:0}
.hero-session.compact h2{font-size:22px;margin:8px 0 6px}
.hero-session.compact .hero-stats{margin:6px 0 16px}
.hero-session.compact .hero-stat{padding:9px 14px}
.hero-session.compact .hero-cta{padding:13px 20px;font-size:14px;border-radius:12px}
@media(max-width:700px){.hero-session.premium h2{font-size:23px}}

.home-focus-row{display:grid;grid-template-columns:1fr 210px;gap:16px;margin-top:16px;align-items:stretch}
@media(max-width:900px){.home-focus-row{grid-template-columns:1fr}}
.weekly-ring-card{padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px}
.weekly-ring-card .today-head{margin:0}
.weekly-ring-card h3{font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.55)}
.ring-wrap{position:relative;width:104px;height:104px;display:flex;align-items:center;justify-content:center}
.progress-ring{width:104px;height:104px;transform:rotate(0deg)}
.progress-ring .ring-track{stroke:rgba(255,255,255,.12)}
.progress-ring .ring-fill{stroke:var(--dg-orange);stroke-linecap:round;transition:stroke-dashoffset .6s cubic-bezier(.2,.7,.3,1)}
.ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring-center b{font-size:21px;font-weight:950;color:#fff;line-height:1.1}
.ring-center span{font-size:10px;font-weight:750;color:rgba(255,255,255,.55);margin-top:2px}

.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:16px;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.1)}
.stat-chip{background:rgba(255,255,255,.045);padding:16px 14px;display:flex;flex-direction:column;gap:5px;min-width:0}
.stat-chip-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:rgba(255,255,255,.5);display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-chip-value{font-size:22px;font-weight:950;color:#fff;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.stat-chip-value small{font-size:12px;font-weight:750;color:rgba(255,255,255,.5);margin-left:2px}
.stat-chip-bar{height:4px;border-radius:99px;background:rgba(255,255,255,.12);margin-top:2px;overflow:hidden}
.stat-chip-bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--dg-orange),var(--dg-amber));width:0;animation:statFillIn .8s cubic-bezier(.2,.7,.3,1) .1s forwards}
@keyframes statFillIn{from{width:0}to{width:var(--fill,0%)}}
@media(prefers-reduced-motion:reduce){.stat-chip-bar-fill{animation:none;width:var(--fill,0%)}}
@media(max-width:900px){.stat-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.stat-strip{grid-template-columns:repeat(2,1fr);gap:1px;border-radius:14px}.stat-chip{padding:13px 12px}.stat-chip-value{font-size:19px}}

/* ===== Passe de polish "grande marque" — espace coureur uniquement (.ath-dash) =====
   Quatre détails qui manquaient encore malgré le thème premium déjà en place : une
   élévation au survol pensée pour un fond sombre (.card:hover plus haut vient du site
   public, son ombre claire à 11% d'opacité reste quasi invisible sur fond navy), un
   anneau de focus visible au clavier (absent partout), un ascenseur fin assorti à la
   marque au lieu de l'ascenseur système, et une entrée en fondu du contenu à chaque
   changement de vue plutôt qu'un remplacement brut du DOM. Scopé à .ath-dash pour ne
   rien changer côté coach (demande explicite : "la version coureur"). */
.ath-dash .card:hover,.ath-dash .stat:hover,.ath-dash .today-card:hover,.ath-dash .pr-card:hover,.ath-dash .league-record-block:hover{
  transform:translateY(-3px);
  border-color:rgba(255,107,53,.32);
  box-shadow:0 18px 44px rgba(0,0,0,.38),0 0 0 1px rgba(255,107,53,.06);
}
.ath-dash button:focus-visible,.ath-dash a:focus-visible,.ath-dash input:focus-visible,.ath-dash select:focus-visible,.ath-dash textarea:focus-visible{
  outline:2px solid var(--dg-orange);outline-offset:2px;border-radius:8px;
}
.ath-dash ::-webkit-scrollbar{width:9px;height:9px}
.ath-dash ::-webkit-scrollbar-track{background:transparent}
.ath-dash ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:99px;border:2px solid transparent;background-clip:padding-box}
.ath-dash ::-webkit-scrollbar-thumb:hover{background:rgba(255,107,53,.5);background-clip:padding-box}
.ath-dash *{scrollbar-color:rgba(255,255,255,.16) transparent}
@keyframes athViewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ath-dash .workspace>*{animation:athViewIn .4s cubic-bezier(.2,.7,.3,1) backwards}
.ath-dash .workspace>*:nth-child(1){animation-delay:0s}
.ath-dash .workspace>*:nth-child(2){animation-delay:.04s}
.ath-dash .workspace>*:nth-child(3){animation-delay:.08s}
.ath-dash .workspace>*:nth-child(4){animation-delay:.12s}
.ath-dash .workspace>*:nth-child(n+5){animation-delay:.16s}
@media(prefers-reduced-motion:reduce){.ath-dash .workspace>*{animation:none}}
.ath-dash .btn.primary{box-shadow:0 8px 22px rgba(255,107,53,.28)}
.ath-dash .btn.primary:hover{box-shadow:0 10px 28px rgba(255,107,53,.4)}

/* Accueil — 4 cases Défis/Classement/Volume/RPE (retour utilisateur du 25/08), à la place de
   l'ancienne rangée de raccourcis (redondante avec la sidebar). Cartes plus compactes que les
   cartes principales (.home-mini-card), mini-graphiques SVG sans axes ni légende — une seule
   série par graphique, le titre de la carte la nomme déjà (cf. skill dataviz). */
.home-mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px;align-items:start}
.home-mini-card{padding:16px 18px}
.home-mini-card .today-head{margin-bottom:10px}
.home-mini-card h3{font-size:13px}
.mini-chart-value{font-size:21px;font-weight:950;color:#fff;letter-spacing:-.02em;margin:2px 0 8px;font-variant-numeric:tabular-nums}
.mini-chart-value small{font-size:11px;font-weight:750;color:rgba(255,255,255,.5);margin-left:3px}
.vol-chart-svg{width:100%;height:88px;display:block}
.vol-bar{fill:rgba(255,107,53,.5)}
.vol-bar.current{fill:var(--dg-orange)}
.vol-bar-label{font-size:8px;fill:rgba(255,255,255,.45);font-weight:700}
.rpe-chart-svg{width:100%;height:76px;display:block}
.rpe-chart-area{fill:rgba(255,107,53,.14)}
.rpe-chart-line{stroke:var(--dg-orange);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.rpe-chart-dot{fill:var(--dg-orange);stroke:rgba(7,11,24,.9);stroke-width:2}
@media(max-width:1100px){.home-mini-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.home-mini-grid{grid-template-columns:1fr;gap:10px}}

/* Nouvelles fenêtres (Records/RP, Mes progrès, Analyse, Paramètres) — mission refonte design.
   Même langage visuel que le reste de l'espace coureur (glassmorphism, orange, sans bordures
   lourdes). .pr-* = "personal record" (record personnel, distinct des records de ligue). */
.pr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.pr-card{padding:18px 16px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column;gap:6px;text-align:center}
.pr-card.empty{opacity:.7}
.pr-distance{font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:rgba(255,255,255,.55)}
.pr-time{font-size:26px;font-weight:950;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pr-meta{font-size:11.5px;color:rgba(255,255,255,.5);font-weight:700}
@media(max-width:900px){.pr-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.pr-grid{grid-template-columns:repeat(2,1fr);gap:10px}.pr-time{font-size:21px}}

.week-progress-list{display:flex;flex-direction:column;gap:0}
.week-progress-row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:13px}
.week-progress-row:last-child{border-bottom:0}
.week-progress-row>span:first-child{width:100px;flex:none;font-weight:800;color:#fff}
.week-progress-row .muted{flex:1}

/* Bulle de messagerie flottante (retour utilisateur du 25/08) : icône fixe en bas à droite,
   visible sur toutes les vues de l'espace coureur (montée une seule fois hors de #athMain).
   z-index sous .modalback (100) pour qu'une modale ouverte passe naturellement au-dessus. */
.float-msg-btn{position:fixed;right:24px;bottom:24px;z-index:90;width:58px;height:58px;border-radius:50%;border:0;background:linear-gradient(155deg,var(--dg-orange),var(--dg-orange-600));color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(255,107,53,.4),0 0 0 4px rgba(7,11,24,.35);cursor:pointer;transition:transform .15s ease}
.float-msg-btn:hover{transform:scale(1.06)}
.float-msg-btn.active{background:var(--dg-navy-800)}
.float-msg-panel{position:fixed;right:24px;bottom:92px;z-index:89;width:min(360px,calc(100vw - 32px));max-height:min(520px,calc(100vh - 140px));display:flex;flex-direction:column;border-radius:18px;background:linear-gradient(170deg,rgba(13,34,68,.97),rgba(7,16,33,.97));backdrop-filter:blur(20px) saturate(160%);border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 70px rgba(2,8,16,.5);overflow:hidden}
.float-msg-panel.hidden{display:none}
.float-msg-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
.float-msg-head b{color:#fff;font-size:14px}
.float-msg-close{border:0;border-radius:50%;width:26px;height:26px;background:rgba(255,255,255,.1);color:#fff;font-size:14px;cursor:pointer;flex:none}
.float-msg-panel .msg-thread{flex:1;padding:14px 16px 0;max-height:none}
.float-msg-panel .msg-composer{padding:12px 16px 16px}
@media(max-width:700px){
  .float-msg-btn{right:16px;bottom:16px;width:52px;height:52px;font-size:21px}
  .float-msg-panel{right:16px;left:16px;width:auto;bottom:80px}
}

/* Ligne secondaire (check-in + vue d'ensemble) : volontairement plus discrète que le hero
   et le stat-strip, sans perdre les boutons/actions existants (openCheckinModal etc.). */
.home-secondary-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
@media(max-width:700px){.home-secondary-row{grid-template-columns:1fr}}
.home-secondary-row .tile{padding:16px 18px}
.home-secondary-row .tile h3{font-size:14.5px}
.modalback{background:rgba(3,9,18,.6);backdrop-filter:blur(8px)}
#modalBack .modal{
  background:linear-gradient(165deg,rgba(13,34,68,.88),rgba(7,16,33,.92));
  backdrop-filter:blur(30px) saturate(170%);
  -webkit-backdrop-filter:blur(30px) saturate(170%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 80px rgba(2,8,16,.5);
  color:rgba(255,255,255,.85);
}
#modalBack .modal #mtitle{color:#fff;font-family:'Archivo Expanded','Manrope',sans-serif}
#modalBack .modal #mmeta{color:rgba(255,255,255,.6)}
#modalBack .modal .close,#modalBack .modal .modal-close{background:rgba(255,255,255,.1);color:#fff}
/* La modale (#modalBack) est un frère de #appView dans le DOM, pas un descendant
   de .dash : les règles ".dash X" ci-dessus ne s'y appliquent donc pas. On reprend
   ici les mêmes teintes pour les composants réellement utilisés dans la modale
   (détail de séance, formulaire de retour, badges, notices, boutons). */
#modalBack .modal .detail{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.85)}
#modalBack .modal .detail b{color:var(--dg-amber);font-size:9.5px;text-transform:uppercase;font-family:'JetBrains Mono',monospace;letter-spacing:.06em}
#modalBack .modal .badge{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85);font-family:'JetBrains Mono',monospace;font-size:10.5px;text-transform:uppercase}
#modalBack .modal .badge.green{background:rgba(24,134,83,.18);border-color:rgba(24,134,83,.45);color:#7CE7B4}
#modalBack .modal .badge.orange{background:rgba(255,107,53,.18);border-color:rgba(255,107,53,.45);color:var(--dg-amber)}
#modalBack .modal .badge.red{background:rgba(180,35,24,.2);border-color:rgba(180,35,24,.45);color:#FF9C90}
#modalBack .modal .notice{background:rgba(255,163,81,.14);border:1px solid rgba(255,163,81,.34);color:var(--dg-amber)}
#modalBack .modal .checkbox-row{color:rgba(255,255,255,.65)}
#modalBack .modal .field label{color:rgba(255,255,255,.72);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
#modalBack .modal .field input,#modalBack .modal .field select,#modalBack .modal .field textarea{
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.2);color:#fff;
}
#modalBack .modal .field input::placeholder,#modalBack .modal .field textarea::placeholder{color:rgba(255,255,255,.35)}
#modalBack .modal .field input:focus,#modalBack .modal .field select:focus,#modalBack .modal .field textarea:focus{
  outline:none;border-color:var(--dg-orange);box-shadow:0 0 0 3px rgba(255,107,53,.2);
}
#modalBack .modal .field select option{color:#0A1B33}
/* ===== Présentation d'une séance : bandeau résumé (chiffres clés) + déroulé
   en étapes, pour rester lisible au premier coup d'œil (cf. sessionDetailHTML). */
.sess-summary{margin-bottom:12px}
.sess-summary-row{display:flex;flex-wrap:wrap;gap:8px}
.sess-chip{display:inline-flex;align-items:center;padding:8px 14px;border-radius:11px;font-weight:850;font-size:13px;background:#edf4f8;color:var(--blue)}
.sess-summary-explain{margin-top:8px;font-size:12.5px;font-weight:650;color:var(--muted)}
.sess-steps{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.sess-step{border:1px solid var(--line);background:#fbfcfd;border-radius:11px;padding:10px 12px}
.sess-step-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.sess-step-num{flex:none;width:19px;height:19px;border-radius:50%;background:var(--navy);color:#fff;font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center}
.sess-step-tag{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:850;color:var(--navy)}
.sess-step p{margin:0;line-height:1.45;color:#33424a}
.sess-step.main{border-left:3px solid var(--orange)}
#modalBack .modal .sess-chip{background:rgba(255,107,53,.16);border:1px solid rgba(255,107,53,.4);color:#fff}
#modalBack .modal .hero-stat{background:rgba(255,255,255,.07)}
#modalBack .modal .hero-stat span{color:rgba(255,255,255,.55)}
#modalBack .modal .hero-stat b{color:#fff}
#modalBack .modal .sess-summary-explain{color:rgba(255,255,255,.68)}
#modalBack .modal .sess-step{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14)}
#modalBack .modal .sess-step p{color:rgba(255,255,255,.85)}
#modalBack .modal .sess-step-tag{color:var(--dg-amber);font-family:'JetBrains Mono',monospace}
#modalBack .modal .sess-step-num{background:var(--dg-orange)}
#modalBack .modal .sess-step.main{border-left:3px solid var(--dg-orange);background:rgba(255,107,53,.07)}
/* Espace coureur simplifié : badge d'intensité à 4 niveaux (mission "affichage des
   séances coureur" §12), phrase d'objectif, et repli "Pourquoi ?" / "Alternative" —
   réutilise .sess-chip/.detail existants, n'ajoute que les variantes de couleur. */
.sess-chip.chip-green{background:var(--greenbg);color:var(--green)}
.sess-chip.chip-yellow{background:var(--yellowbg);color:var(--yellow)}
.sess-chip.chip-orange{background:#fff1e6;color:var(--orange)}
.sess-chip.chip-red{background:var(--redbg);color:var(--red)}
.ath-obj{font-weight:800;color:var(--navy);margin-bottom:10px;font-size:14px}
.ath-toggle{cursor:pointer;font-weight:850;color:var(--blue);font-size:13px;list-style:none}
.ath-toggle::-webkit-details-marker{display:none}
#modalBack .modal .sess-chip.chip-green{background:rgba(24,134,83,.18);border:1px solid rgba(24,134,83,.45);color:#7CE7B4}
#modalBack .modal .sess-chip.chip-yellow{background:rgba(255,193,7,.16);border:1px solid rgba(255,193,7,.4);color:#FFD966}
#modalBack .modal .sess-chip.chip-orange{background:rgba(255,163,81,.16);border:1px solid rgba(255,163,81,.4);color:var(--dg-amber)}
#modalBack .modal .sess-chip.chip-red{background:rgba(180,35,24,.2);border:1px solid rgba(180,35,24,.45);color:#FF9C90}
#modalBack .modal .ath-obj{color:#fff}
#modalBack .modal .ath-toggle{color:var(--dg-amber)}
/* Le modal "Profil coureur" du coach (editCoachProfile) imbrique ses champs dans des
   .card à fond blanc (comme le reste de l'app), contrairement aux autres modals qui
   posent leurs champs directement sur le fond sombre. Sans cette surcharge, les règles
   ci-dessus (texte blanc) rendaient les libellés et champs illisibles sur fond blanc. */
#modalBack .modal .card .field label{color:var(--navy);font-size:12px;font-weight:850;text-transform:none;letter-spacing:normal}
#modalBack .modal .card .field input,#modalBack .modal .card .field select,#modalBack .modal .card .field textarea{
  background:#fff;border:1px solid #d5dde2;color:#12253f;
}
#modalBack .modal .card .field input::placeholder,#modalBack .modal .card .field textarea::placeholder{color:#8a97a6}
#modalBack .modal .card .field input:focus,#modalBack .modal .card .field select:focus,#modalBack .modal .card .field textarea:focus{
  outline:none;border-color:var(--dg-orange);box-shadow:0 0 0 3px rgba(255,107,53,.15);
}
#modalBack .modal .card .field select option{color:#0A1B33}
#modalBack .modal .pill-radio{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.2);color:#fff}
#modalBack .modal .pill-radio.active{background:var(--dg-orange);border-color:var(--dg-orange);color:#fff}
#modalBack .modal .anchor-slider{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.2)}
#modalBack .modal .rpe-scale-labels{color:rgba(255,255,255,.45)}
#modalBack .modal .btn.outline{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.25);color:#fff}
#modalBack .modal .btn.soft{background:rgba(255,255,255,.1);color:#fff}
#modalBack .modal .btn.primary{background:var(--dg-orange);box-shadow:0 12px 28px rgba(255,107,53,.32)}
#modalBack .modal .btn.primary:hover{background:var(--dg-orange-600)}
#modalBack .modal .chooser{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#fff}
#modalBack .modal .chooser:hover{background:rgba(255,255,255,.08)}
#modalBack .modal .chooser b{color:#fff}
#modalBack .modal .muted{color:rgba(255,255,255,.55)}
#modalBack .modal .table th{background:rgba(255,255,255,.05);color:#fff;border-bottom-color:rgba(255,255,255,.1)}
#modalBack .modal .table td{border-bottom-color:rgba(255,255,255,.08);color:rgba(255,255,255,.82)}
#modalBack .modal .stat{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.14)}
#modalBack .modal .stat .n{color:#fff;font-family:'Archivo Expanded','Manrope',sans-serif}
#modalBack .modal .stat .l{color:rgba(255,255,255,.5)}
/* ===== LIQUID GLASS — page de connexion / inscription =====
   Même traitement sombre que le tableau de bord (mêmes tokens --dg-*
   définis plus haut), scopé sous .login pour ne toucher ni la page
   d'accueil publique (.hero/.price/.faq) ni les autres pages. */
.login{
  min-height:100vh;
  font-family:'Manrope',Inter,ui-sans-serif,system-ui,sans-serif;
  background:
    radial-gradient(1100px 640px at 90% -8%, rgba(255,107,53,.20), transparent 60%),
    radial-gradient(900px 720px at -8% 105%, rgba(23,58,106,.55), transparent 58%),
    linear-gradient(165deg,var(--dg-navy-900),var(--dg-navy-800) 55%,#0f2038 100%);
}
.login .logo{font-family:'Archivo Expanded','Manrope',sans-serif;letter-spacing:-.02em;color:#fff}
.login .logo span{color:var(--dg-orange)}
.login-card{
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(26px) saturate(160%);
  -webkit-backdrop-filter:blur(26px) saturate(160%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 70px rgba(2,8,16,.45),inset 0 1px 0 rgba(255,255,255,.07);
  position:relative;overflow:hidden;
}
.login-card::before{
  content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-110px;top:-120px;pointer-events:none;
  background:radial-gradient(circle,rgba(255,107,53,.22),transparent 70%);
}
.login-card h2{color:#fff;font-family:'Archivo Expanded','Manrope',sans-serif}
.login-card .muted{color:rgba(255,255,255,.62)}
.login-card [style*="color:var(--navy)"]{color:#fff !important}
.login-card .role-tabs{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.login-card .role-tabs button{color:rgba(255,255,255,.7)}
.login-card .role-tabs button.active{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.login-card .field label{color:rgba(255,255,255,.72);font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.login-card .field input,.login-card .field select,.login-card .field textarea{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(6px);
  transition:border-color .15s ease,box-shadow .15s ease;
}
.login-card .field input::placeholder,.login-card .field textarea::placeholder{color:rgba(255,255,255,.4)}
.login-card .field input:focus,.login-card .field select:focus,.login-card .field textarea:focus{
  outline:none;border-color:var(--dg-orange);box-shadow:0 0 0 3px rgba(255,107,53,.2);
}
.login-card .field select option{color:#0A1B33}
.login-card .btn.outline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);color:#fff}
.login-card .btn.primary{background:var(--dg-orange);box-shadow:0 12px 28px rgba(255,107,53,.32)}
.login-card .btn.primary:hover{background:var(--dg-orange-600)}
.login-card .form-note{color:rgba(255,255,255,.55)}
.login-card .flow-note{color:rgba(255,255,255,.55)}
.login-card .checkbox-row{color:rgba(255,255,255,.68)}
/* Création de compte : liste de ce qu'il reste à compléter (#sFormError) et champs entourés */
.login-card .form-error{margin-top:14px;padding:12px 14px;border-radius:12px;background:rgba(240,72,60,.14);border:1px solid rgba(255,128,116,.5);color:#ffd6d0;font-size:13px;line-height:1.5}
.login-card .form-error ul{margin:6px 0 0 18px;padding:0}
.login-card .form-error[hidden]{display:none}
.login-card .field input.input-invalid{border-color:#ff8074;box-shadow:0 0 0 3px rgba(255,128,116,.2)}
.login-card .checkbox-row input.input-invalid{outline:2px solid #ff8074;outline-offset:2px}
@media(max-width:700px){
  /* Indice de défilement (audit UX, mobile uniquement) : la nav .side est une bande
     horizontale défilante (voir la règle .side{overflow:auto} plus haut) sans aucun signe
     qu'il y a d'autres onglets à droite. Technique CSS pure (aucun JS, donc aucun risque sur
     le clic/le scroll tactile/le clavier) : deux couches de dégradé en plus du fond existant.
     La couche "cache" (background-attachment:local) défile avec le contenu et vient recouvrir
     la couche "ombre" (background-attachment:scroll, fixe par rapport à la bande) dès que la
     fin réelle du contenu atteint le bord droit — l'ombre disparaît alors automatiquement,
     y compris si tous les onglets tiennent déjà à l'écran (rien à cacher depuis le début).
     Se recalcule à chaque peinture : fonctionne après resize ou changement de page sans code
     supplémentaire. */
  .side{
    background-repeat:no-repeat;
    background-attachment:local,scroll,scroll;
    background-image:
      linear-gradient(to left,#0a1a34 0,rgba(10,26,52,0) 26px),
      linear-gradient(to left,rgba(0,0,0,.3),rgba(0,0,0,0) 16px),
      linear-gradient(130deg,rgba(7,16,33,.95),rgba(13,34,68,.92));
    background-position:right top,right top,left top;
    background-size:26px 100%,16px 100%,100% 100%;
  }
  .login{padding:20px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .dash{background:var(--dg-navy-900)}
  .side{background:var(--dg-navy-900)}
  .dash .card,.dash .stat,.dash .today-card,.dash .plan,.dash .client,.dash .chooser,.dash .section-panel{background:#0D2244}
  #modalBack .modal{background:#0D2244}
  .login{background:var(--dg-navy-900)}
  .login-card{background:#0D2244}
}
/* ===== "Gestion du programme" (évolution UX 14/08/26) — calendrier réel, jours
   d'entraînement, indisponibilités, séances impossibles. Réutilise au maximum les
   classes existantes (.card,.badge,.form-grid,.table,.notice,.choice-grid...) déjà
   présentes ci-dessus ; les règles ci-dessous ne couvrent que les éléments propres à
   ce nouvel onglet. Mobile-first : la disposition en onglets passe en lignes empilées
   sous 700px, comme le reste de l'espace coureur. */
.gestion-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.gestion-tab{border:1px solid var(--line);background:#fff;color:var(--navy);border-radius:11px;padding:9px 13px;font-weight:800;font-size:13px}
.gestion-tab.active{background:var(--navy);border-color:var(--navy);color:#fff}
.gestion-body{display:flex;flex-direction:column;gap:0}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:11px;padding:3px;margin-bottom:14px;background:#fff}
.seg button{border:0;background:transparent;padding:8px 14px;border-radius:8px;font-weight:800;color:var(--muted);font-size:12.5px}
.seg button.active{background:var(--navy);color:#fff}
.month-weeks{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.month-week-row{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;font-size:12.5px}
.month-week-row b{color:var(--navy);min-width:34px}
.month-week-row .muted{flex:1}
.impact-list{margin:10px 0;padding-left:18px;line-height:1.7;font-size:13px;color:var(--text)}
.impact-list li{margin-bottom:4px}
.impossible-opt{border:1px solid var(--line);border-radius:13px;padding:13px;margin:10px 0}
.impossible-opt b{display:flex;align-items:center;gap:8px;color:var(--navy);font-size:13.5px}
.impossible-opt .btn{margin-top:8px}
.session.rest.skipped{border-left-color:var(--red);background:var(--redbg)}
.session.rest.skipped b{color:var(--red)}
.session.rest.moved{border-left-color:var(--blue);background:#eaf3fa}
.session.rest.moved b{color:var(--blue)}
@media(max-width:700px){
  .gestion-tabs{gap:6px}
  .gestion-tab{flex:1 1 calc(50% - 6px);text-align:center;font-size:12px;padding:9px 8px}
  .month-week-row{flex-wrap:wrap}
}
.dash .gestion-tab{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#d9e6ed}
.dash .gestion-tab.active{background:var(--dg-orange);border-color:var(--dg-orange);color:#fff}
.dash .seg{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}
.dash .seg button{color:rgba(255,255,255,.6)}
.dash .seg button.active{background:var(--dg-orange);color:#fff}
.dash .month-week-row{border-color:rgba(255,255,255,.14)}
.dash .month-week-row b{color:#fff}
.dash .impact-list{color:rgba(255,255,255,.85)}
.dash .impossible-opt{border-color:rgba(255,255,255,.16)}
.dash .impossible-opt b{color:#fff}
.dash .session.rest.skipped{background:rgba(180,35,24,.14);border-left-color:#FF9C90}
.dash .session.rest.skipped b{color:#FF9C90}
.dash .session.rest.moved{background:rgba(23,97,142,.18);border-left-color:#7CC3F0}
.dash .session.rest.moved b{color:#7CC3F0}
#modalBack .modal .impossible-opt{border-color:rgba(255,255,255,.16)}
#modalBack .modal .impossible-opt b{color:#fff}
#modalBack .modal .impact-list{color:rgba(255,255,255,.85)}

/* ===== Visite guidée de l'espace coureur (tutoriel) : projecteur sur l'élément réel
   de l'interface (technique du "trou" positionné en position:fixed, indépendant des
   conteneurs à défilement comme .scroll, pour ne jamais être rogné) + carte flottante
   avec navigation. ===== */
.tour-backdrop{position:fixed;inset:0;z-index:9998;pointer-events:auto;background:transparent;transition:background .2s ease}
.tour-backdrop.dim{background:rgba(5,16,28,.74)}
.tour-hole{position:absolute;border-radius:14px;box-shadow:0 0 0 9999px rgba(5,16,28,.74);transition:top .22s ease,left .22s ease,width .22s ease,height .22s ease;pointer-events:none}
.tour-card{position:fixed;z-index:9999;background:var(--dg-navy-800);color:#fff;border-radius:16px;padding:18px 20px;width:min(320px,calc(100vw - 32px));box-shadow:0 24px 60px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.1)}
.tour-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.tour-step-label{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--dg-amber);text-transform:uppercase}
.tour-close{border:0;background:rgba(255,255,255,.1);color:#fff;border-radius:50%;width:26px;height:26px;font-size:15px;cursor:pointer;flex:none}
.tour-card h3{color:#fff;font-size:16px;margin:0 0 6px}
.tour-card p{color:rgba(255,255,255,.82);font-size:13px;line-height:1.5;margin:0}
.tour-actions{display:flex;gap:8px;margin-top:14px}
.tour-actions button{flex:1;padding:9px 10px;font-size:13px}
.tour-dots{display:flex;gap:4px;margin-top:12px;justify-content:center}
.tour-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.25)}
.tour-dots span.active{background:var(--dg-orange);width:16px;border-radius:4px}
@media(max-width:700px){.tour-card{width:calc(100vw - 32px)}}


/* ===== Ligues entre amis (mission dédiée) =====
   Correctif (retour utilisateur du 24/08) : l'espace coureur/coach (.dash) est un thème
   sombre glassmorphism (cartes translucides sur fond navy dégradé, voir .dash .card plus
   haut dans ce fichier) — PAS le thème clair de l'ancienne page marketing. Les couleurs
   ci-dessous supposent donc du texte clair sur fond sombre (comme .dash .card h3{color:#fff}
   et .dash .muted/.dash .sub déjà définis plus haut), jamais var(--navy)/var(--muted) qui
   ne s'appliquent qu'au thème clair et rendaient plusieurs textes quasi invisibles
   (navy sur navy). .muted/.sub à l'intérieur de "Ma ligue" utilisent maintenant les
   réglages sombres déjà existants et déjà éprouvés ailleurs dans l'appli — aucune
   surcharge locale n'est plus nécessaire. */
.league-hero{text-align:center;padding:44px 28px;max-width:560px;margin:0 auto}
.league-hero-icon{width:64px;height:64px;margin:0 auto;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,107,53,.14);border:1px solid rgba(255,107,53,.32);color:var(--dg-orange)}
.league-hero h2{color:#fff;margin:12px 0 8px;font-size:26px}
.league-hero-actions{display:flex;gap:10px;justify-content:center;margin-top:20px;flex-wrap:wrap}

.league-rank-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;margin-bottom:4px;transition:background .15s ease}
.league-rank-row:hover{background:rgba(255,255,255,.04)}
.league-rank-medal{font-size:18px;width:26px;text-align:center;flex:none}
.league-rank-name{flex:1;font-weight:800;color:#fff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.league-rank-pts{font-weight:950;color:#fff;white-space:nowrap;font-variant-numeric:tabular-nums}
.league-trend{font-size:11px;font-weight:850;padding:2px 7px;border-radius:99px;white-space:nowrap}
.league-trend.up{background:rgba(24,134,83,.24);color:#7CE7B4}
.league-trend.down{background:rgba(180,35,24,.24);color:#FF9C90}
.league-trend.flat{background:rgba(255,255,255,.08);color:rgba(255,255,255,.55)}
/* Ligne du coureur connecté, mise en évidence dans le classement — l'app ne montrait
   auparavant aucun repère visuel pour se retrouver soi-même dans la liste. */
.league-rank-row.me{background:rgba(255,107,53,.12);border:1px solid rgba(255,107,53,.4);box-shadow:inset 0 0 0 1px rgba(255,107,53,.06)}
.league-rank-row.me:hover{background:rgba(255,107,53,.16)}
.league-rank-you-tag{font-size:10px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:var(--dg-orange);flex:none}
/* Classement entre ligues : séparateur entre le top 10 et la ligue du lecteur quand
   celle-ci se trouve plus bas — il doit se lire comme « des lignes ont été sautées », pas
   comme une place vide dans le classement. */
.league-rank-gap{text-align:center;color:rgba(255,255,255,.35);letter-spacing:.3em;font-size:14px;padding:2px 0 4px}

.league-challenge{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);margin-bottom:10px}
.league-challenge:last-child{margin-bottom:0}
.league-challenge-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.league-challenge-head b{color:#fff}
.league-progress{height:9px;border-radius:99px;background:rgba(255,255,255,.12);margin-top:10px;overflow:hidden}
.league-progress-bar{height:100%;background:linear-gradient(90deg,var(--dg-orange),var(--dg-amber));border-radius:99px;transition:width .3s}
.league-challenge-foot{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px}
.league-challenge-resolved{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:13px;border-radius:10px;background:rgba(255,255,255,.03)}
.league-challenge-resolved:not(:last-child){margin-bottom:6px}
.league-challenge-resolved span:first-of-type{flex:1;color:#fff;font-weight:700}
.league-resolved-list{margin-top:10px}

/* Records de la ligue : grille de mini-cartes (une par distance), même langage visuel que
   les records personnels (.pr-grid/.pr-card) plutôt qu'une simple liste de blocs empilés. */
.league-record-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:4px}
.league-record-block{padding:16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.league-record-block>b{display:block;color:#fff;font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px}
.league-record-row{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px}
.league-record-row span:first-child{width:22px;text-align:center;flex:none}
.league-record-name{flex:1;font-weight:800;color:#fff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.league-record-time{font-weight:850;color:#fff;font-variant-numeric:tabular-nums}
@media(max-width:640px){.league-record-grid{grid-template-columns:1fr}}

.league-progression-row{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);margin-bottom:8px}
.league-progression-row:last-child{margin-bottom:0}
.league-progression-row b{width:110px;flex:none;color:#fff}
.league-progression-row span:nth-child(2){flex:1;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.7)}

.league-challenge-choices{display:grid;gap:8px}
@media(max-width:640px){.league-progression-row b{width:auto}}

.league-discrete-link{display:flex;align-items:center;gap:8px;width:100%;margin-top:14px;padding:13px 16px;border-radius:13px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#fff;font-weight:800;font-size:13px;cursor:pointer;text-align:left;transition:background .15s ease}
.league-discrete-link:hover{background:rgba(255,255,255,.09)}

.league-palmares-compact{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:12px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);cursor:pointer;text-align:left;transition:background .15s ease}
.league-palmares-compact:hover{background:rgba(255,255,255,.09)}
.league-palmares-compact.empty-state{cursor:default}
.league-palmares-compact .lpc-head{font-weight:900;color:#fff;font-size:14px}
.league-palmares-compact .lpc-lines{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13px;font-weight:700;color:rgba(255,255,255,.65)}
.league-palmares-compact .lpc-more{font-size:11.5px;color:var(--dg-orange);font-weight:800}
@media(max-width:640px){
  .league-discrete-link,.league-palmares-compact{padding:12px 14px}
}

/* ===== Marque UNYWAYS — la même que sur la page d'accueil =====
   L'espace coureur affichait « UNY » + « WAYS » en orange, la page d'accueil « UN » + un Y
   orange agrandi + « WAYS » : deux marques différentes pour le même produit. C'est celle de
   la page d'accueil qui fait foi, on l'aligne ici. Les règles reprennent exactement
   index.html (.brand / .brand-y) : même famille, même graisse, même approche, même
   proportion pour le Y.
   Limite connue : si un logo IMAGE est activé un jour depuis l'éditeur du site, la page
   d'accueil l'affichera et l'espace coureur restera sur la marque texte — les deux pages ne
   partagent pas cet état. À câbler le jour où un logo image sera réellement utilisé.
   Le sélecteur nomme .ath-dash et .dash explicitement, et ce n'est pas de la redondance :
   `.ath-dash .logo` impose Poppins à tous les titres de l'espace coureur (ligne ~575), et un
   simple `.logo` perdait contre lui. Mesuré : la marque calculait en Poppins, pas en Archivo
   Expanded — donc pas la même que la page d'accueil, ce qui était précisément le défaut. */
.logo,.dash .logo,.ath-dash .logo{font-family:'Archivo Expanded','Manrope',system-ui,sans-serif;font-weight:800;letter-spacing:-.02em}
/* Le logo est désormais l'image de la page d'accueil (voir logoHTML() dans member-app.js).
   Le nom composé ne s'affiche qu'en repli, si l'image ne charge pas — d'où la mise en forme
   conservée au-dessus. max-width:100% : le volet latéral ne fait que 235px, moins ses marges. */
.logo .brand-logo{width:150px;max-width:100%;height:auto;display:block;object-fit:contain}
.login .logo .brand-logo{width:170px;margin:0 auto 2px}
.logo .brand-y{color:var(--dg-orange,var(--orange));font-size:1.3em;line-height:1;margin:0 .01em}

/* Ligne « Prochaine séance » des cartes de repos et d'avant-départ : un jour sans séance ne
   doit pas être un écran sans horizon. Discrète — c'est un repère, pas l'action du jour. */
.today-next{margin:10px 0 2px;font-size:13px;color:rgba(255,255,255,.62)}
.today-next b{color:rgba(255,255,255,.88);font-weight:800}

/* Marches du tutoriel GPX : une liste numérotée qui doit rester lisible dans la modale
   sombre, où les <ol> par défaut collent au bord et perdent leurs numéros. */
.gpx-steps{margin:4px 0 0;padding-left:20px;line-height:1.65;font-size:13.5px;color:rgba(255,255,255,.78)}
.gpx-steps li{margin-bottom:5px}
.gpx-steps li::marker{color:var(--dg-orange,var(--orange));font-weight:900}

/* Invitation reçue : posée tout en haut de l'espace ligue, avant le classement. Une
   invitation qui attend est la seule chose à traiter en arrivant — elle ne doit pas se
   noyer dans le reste de la page. Le liseré orange la distingue d'une carte ordinaire. */
.league-invit{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-left:3px solid var(--dg-orange,var(--orange));margin-bottom:14px}
.league-invit-texte{min-width:0}
.league-invit-texte b{display:block;color:#fff;font-size:15px;margin-bottom:2px}
.league-invit-texte span{font-size:12.5px}
.league-invit-actions{display:flex;gap:8px;flex:none}
@media(max-width:620px){
  .league-invit{flex-direction:column;align-items:stretch}
  .league-invit-actions{display:grid;grid-template-columns:1fr 1fr}
}

/* Avertissement d'impayé : posé au-dessus du contenu, visible sur toutes les pages pendant
   la semaine de tolérance. Rouge sobre plutôt qu'alarmiste — la personne garde son accès,
   on l'informe, on ne la punit pas. Il disparaît dès que le paiement est rétabli. */
.ath-main-wrap{display:flex;flex-direction:column;min-width:0}
.impaye-bandeau{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  margin:18px 28px -6px;padding:14px 18px;border-radius:14px;
  background:rgba(214,64,52,.13);border:1px solid rgba(214,64,52,.42)}
.impaye-texte{min-width:0;flex:1}
.impaye-texte b{display:block;color:#fff;font-size:14.5px;margin-bottom:3px}
.impaye-texte span{color:rgba(255,255,255,.72);font-size:13px;line-height:1.45}
.impaye-bandeau .btn{flex:none}
@media(max-width:780px){
  .impaye-bandeau{margin:14px 17px -4px;flex-direction:column;align-items:stretch}
  .impaye-bandeau .btn{width:100%}
}