@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Archivo:ital,wght@0,400..800;1,400..700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root{
  /* ============ POWERHEALTH — RAMPES DE BASE ============
     Système de design Power Health : Ink (encre chaude presque noire),
     Bone (neutres papier), Ember (accent principal, action), Moss
     (secondaire, nutrition & réussite), Clay (tertiaire, effort &
     protéines), plus une poignée de signaux (ambre, rouille, ardoise). */
  --ink-900:#141209; --ink-800:#1F1B12; --ink-700:#2B271E; --ink-600:#3D382C; --ink-500:#57503F;
  --ink-400:#7A7160; --ink-300:#A39A87; --ink-200:#C9C0AC; --ink-100:#E7DFCD;

  --bone-50:#FFFDF8; --bone-100:#FAF7F0; --bone-200:#F4EFE4; --bone-300:#EDE6D6; --bone-400:#E2D9C5;

  --ember-50:#FFF3E8; --ember-100:#FFE3CB; --ember-200:#FDC79A; --ember-300:#FBA463;
  --ember-400:#F97316; --ember-500:#E45F07; --ember-600:#C2560B; --ember-700:#933F08;

  --moss-50:#EDF1E8; --moss-100:#DCE4D3; --moss-200:#B3C2A6; --moss-300:#7E9470;
  --moss-400:#4A6642; --moss-500:#3A5234; --moss-600:#2A3C26;

  --clay-100:#F6E2DB; --clay-300:#D98063; --clay-400:#C0563A; --clay-500:#9C4028;

  --amber-100:#FBEBCC; --amber-400:#D98C1F;
  --rust-100:#F8DED9; --rust-400:#B4321E;
  --slate-100:#DFE8ED; --slate-400:#3F5A6B;

  /* Polices — Instrument Serif pour les accents éditoriaux, Archivo comme
     grotesque structurel, IBM Plex Mono pour tout ce qui est mesuré. */
  --font-display:"Instrument Serif",Georgia,"Times New Roman",serif;
  --font-sans:"Archivo","Helvetica Neue",Helvetica,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;

  /* Effets — ombres chaudes à faible étalement, la marque s'appuie plus
     sur les bordures fil-de-fer que sur l'ombre. */
  --shadow-hairline:0 1px 0 rgba(20,18,9,.05);
  --shadow-sm:0 1px 2px rgba(20,18,9,.06),0 1px 1px rgba(20,18,9,.04);
  --shadow-md:0 6px 16px -6px rgba(20,18,9,.14),0 2px 4px rgba(20,18,9,.05);
  --shadow-lg:0 22px 44px -20px rgba(20,18,9,.24),0 4px 10px rgba(20,18,9,.06);
  --shadow-ember:0 10px 26px -12px rgba(228,95,7,.48);
  --texture-grain:radial-gradient(rgba(87,80,63,.09) 1px,transparent 1px);
  --texture-grain-size:3px 3px;

  /* ============ NOMS HISTORIQUES DE L'APPLI — REPOINTÉS ============
     On conserve tous les noms de variables déjà utilisés dans le JS
     (beaucoup sont référencés directement en inline via var(--xxx)) et on
     ne change que leur valeur, pour habiller l'appli entière avec la
     palette Power Health sans reprendre chaque fichier .js.

     THÈME — encre sombre partout : l'appli entière (mobile ET desktop)
     utilise les surfaces encre ; seules ces valeurs changent ci-dessous
     (dont --bone-50..400, réattribuées plus bas pour rester des surfaces
     encre plutôt que la rampe papier claire d'origine), tous les
     composants suivent puisqu'ils sont pilotés par ces variables plutôt
     que des couleurs en dur. */
  --bg:#141209;
  --card:rgba(255,255,255,.055);
  --ink:#FFFDF8;
  --ink2:rgba(250,247,240,.74);
  --ink3:rgba(250,247,240,.52);
  --line:rgba(255,255,255,.12);
  --line2:rgba(255,255,255,.08);
  --dark:#2B271E;
  --dark2:var(--ink-700);
  --lime:var(--ember-400);        /* accent vif — CTA & surfaces sombres */
  --lime-soft:rgba(74,102,66,.22);     /* pastel de réussite */
  --lime-line:rgba(126,148,112,.42);
  --lime-deep:#B3C2A6;            /* texte de réussite */
  --amber:var(--amber-400);
  --teal:#3F7A6E;
  --cyan:#1F7A8C;
  --violet:var(--clay-400);
  --red:var(--rust-400);
  --blue:#2E5C99;
  --rose:#A94D6B;
  --slate:var(--slate-400);
  --radius:18px;

  --bone-50:rgba(255,255,255,.05); --bone-100:rgba(255,255,255,.04); --bone-200:rgba(255,255,255,.06);
  --bone-300:rgba(255,255,255,.09); --bone-400:rgba(255,255,255,.12);
  --moss-50:rgba(74,102,66,.22); --moss-100:rgba(126,148,112,.42); --moss-500:#DCE4D3;
  --amber-100:rgba(217,140,31,.20);
  --rust-100:rgba(180,50,30,.22);
  --slate-100:rgba(63,90,107,.24);
  --clay-100:rgba(192,86,58,.20); --clay-500:#D98063;

  /* Couleurs de données — macros & calories, utilisées par le générateur
     de menu (semainier, barres macro, anneaux). */
  --data-protein:var(--clay-400);
  --data-carbs:var(--amber-400);
  --data-fat:var(--moss-400);
  --data-calories:var(--ember-400);
  --data-track:rgba(255,255,255,.12);

  /* Texte sur surfaces sombres (encre) — teintes chaudes plutôt que gris froid. */
  --text-muted-dark:rgba(250,247,240,.46);
  --text-body-dark:rgba(250,247,240,.68);
  --text-soft-dark:rgba(250,247,240,.82);
}

*{ box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }

html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font-sans);
  background:var(--bg); color:var(--ink);
  padding:20px 16px 70px; -webkit-font-smoothing:antialiased;
  position:relative;
}
/* Grain encre + halo chaud + hachure discrète — fond « habillé » plutôt que plat,
   identique à toutes les tailles d'écran (l'appli entière est en surfaces encre). */
.ph-grain{
  background-color:var(--bg);
  background-image:
    radial-gradient(ellipse 620px 460px at 92% -14%, rgba(249,115,22,.26), transparent 62%),
    repeating-linear-gradient(128deg, rgba(255,255,255,.045) 0 1px, transparent 1px 11px),
    radial-gradient(ellipse 560px 420px at -14% 106%, rgba(74,102,66,.20), transparent 62%);
  background-repeat:no-repeat, repeat, no-repeat;
}
/* Version sombre du grain, pour les surfaces encre (hero, lecteur, login). */
.ph-grain-dark{
  background-color:var(--dark);
  background-image:
    radial-gradient(ellipse 640px 380px at 100% -10%, rgba(249,115,22,.20), transparent 62%),
    radial-gradient(ellipse 520px 340px at -10% 110%, rgba(74,102,66,.16), transparent 60%),
    radial-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:auto, auto, 3px 3px;
  background-repeat:no-repeat, no-repeat, repeat;
}
/* Chiffres et mesures : toujours en IBM Plex Mono, jamais le texte autour. */
.mono, .stat-mini .v, .motiv-num, .rest-count, .complete-stats .s .v,
.kcal-live .n, .mini-stat .val, .macro-legend b, .stat .val, .day-total b, .meal-kcal,
.shop-line b, .sec-num, .set-pill, .up-card .dn, .player-target .t .v,
.notif-badge, .thread-badge, .feed-card .borg-num, .msg-time,
.day-total .macros, .borg-btn{
  font-family:var(--font-mono);
  font-feature-settings:'tnum' 1, 'zero' 1;
  font-variant-numeric:tabular-nums;
}

/* ============ EN-TÊTE APPLI ============ */
.appbar{ max-width:900px; margin:0 auto 18px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:12px; }
.logo{ width:42px; height:42px; border-radius:12px; background:var(--dark); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.logo span{ color:var(--lime); font-size:18px; font-weight:900; letter-spacing:-1px; }

/* Badge du monogramme Power Health — décliné nutrition / sport, posé devant
   le titre d'un écran ou d'un onglet pour signaler sa spécificité en un
   coup d'œil (voir coachTabHead() et les écrans « Suivi sportif » /
   « Semainier nutrition »). */
.ph-badge{ width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ph-badge--nutrition{ background:var(--dark); }
.ph-badge--sport{ background:var(--ember-400); }
.brand h1{ font-size:18px; font-weight:800; letter-spacing:-.4px; line-height:1.15; }
.brand h1 em{ font-family:var(--font-display); font-style:italic; font-weight:400; color:var(--ember-400); }
.brand p{ font-size:12px; color:var(--ink2); margin-top:2px; font-weight:500; }

.seg{ display:inline-flex; flex-wrap:wrap; background:var(--bone-200); border:1.5px solid var(--line); border-radius:11px; padding:3px; gap:3px; }
.seg button{ border:none; background:transparent; padding:8px 16px; border-radius:8px; font-size:11.5px; font-weight:750; text-transform:uppercase; letter-spacing:.04em; color:var(--ink2); cursor:pointer; font-family:inherit; }
.seg button.on{ background:var(--dark); color:#fff; }

.appbar-actions{ display:flex; align-items:center; gap:12px; }
.who-badge{ display:flex; align-items:center; gap:9px; }
.who-badge .avatar{ width:32px; height:32px; border-radius:10px; font-size:11px; }
.who-badge .name{ font-size:12.5px; font-weight:750; color:var(--ink); line-height:1.25; }
.who-badge .role{ font-size:10px; color:var(--ink3); font-weight:600; }

/* ============ ÉCRAN DE CONNEXION — carte verre sur fond encre ============ */
@keyframes cxRise{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.cx-shell{
  min-height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:stretch;
  padding:34px 24px 40px; color:#fff;
  background-color:var(--dark);
  background-image:
    radial-gradient(ellipse 620px 460px at 92% -14%, rgba(249,115,22,.26), transparent 62%),
    repeating-linear-gradient(128deg, rgba(255,255,255,.045) 0 1px, transparent 1px 11px),
    radial-gradient(ellipse 560px 420px at -14% 106%, rgba(74,102,66,.20), transparent 62%);
  background-repeat:no-repeat, repeat, no-repeat;
}
.cx-card{ width:100%; max-width:400px; margin:0 auto; text-align:center; animation:cxRise .4s cubic-bezier(.22,.9,.3,1) both; }
.cx-logo{ width:46px; height:46px; border-radius:14px; background:var(--lime); display:flex; align-items:center; justify-content:center; margin:0 auto; }
.cx-logo span{ color:var(--dark); font-size:18px; font-weight:900; letter-spacing:-1px; }
.cx-word{ font-size:22px; font-weight:800; letter-spacing:-.5px; margin-top:9px; }
.cx-word em{ font-family:var(--font-display); font-style:italic; font-weight:400; color:var(--lime); }
.cx-lead{ font-family:var(--font-display); font-style:italic; font-size:20px; line-height:1.35; color:var(--text-soft-dark); margin-top:10px; }
.cx-form{ margin-top:26px; text-align:left; background:rgba(255,253,248,.05); border:1px solid rgba(255,255,255,.14); border-radius:20px; padding:22px 20px; }
.cx-title{ font-size:22px; font-weight:850; letter-spacing:-.5px; margin-bottom:4px; }
.cx-sub{ font-size:12.5px; color:var(--text-muted-dark); font-weight:600; margin-bottom:20px; }
.cx-field + .cx-field{ margin-top:14px; }
.cx-lbl{ display:block; font-size:9.5px; text-transform:uppercase; letter-spacing:1.1px; color:var(--text-muted-dark); font-weight:800; margin-bottom:7px; }
.cx-in{ width:100%; padding:13px 14px; border-radius:12px; border:1.5px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:#fff; font-family:inherit; font-size:16px; font-weight:600; transition:border-color .14s, box-shadow .14s; }
.cx-in::placeholder{ color:var(--text-muted-dark); font-weight:500; }
.cx-in:focus{ outline:none; border-color:var(--lime); box-shadow:0 0 0 3px rgba(249,115,22,.32); }
.cx-forgot{ font-size:11.5px; font-weight:700; color:var(--ember-300); cursor:pointer; margin-top:12px; display:inline-block; }
.cx-note{ font-size:11.5px; line-height:1.6; color:var(--text-muted-dark); font-weight:500; margin-top:18px; }
.cx-error{ background:rgba(180,50,30,.22); border:1.5px solid rgba(180,50,30,.4); color:#FBC7BC; border-radius:12px; padding:10px 13px; font-size:12px; font-weight:650; margin-bottom:16px; }
.cx-strength{ display:flex; gap:5px; margin-top:9px; }
.cx-strength i{ flex:1; height:4px; border-radius:99px; background:rgba(255,255,255,.14); }
.cx-strength i.ok{ background:var(--lime); }
.cx-foot{ text-align:center; font-size:10.5px; color:var(--text-muted-dark); font-weight:600; padding:30px 24px 0; }
@media (min-width:761px){
  .cx-shell{ padding:56px; }
  .cx-card{ max-width:432px; }
  .cx-word{ font-size:26px; margin-top:12px; }
  .cx-lead{ font-size:21px; max-width:340px; margin:8px auto 0; }
  .cx-form{ text-align:left; margin-top:28px; background:rgba(255,253,248,.07); backdrop-filter:blur(16px) saturate(1.4); border-color:rgba(255,255,255,.16); box-shadow:0 34px 74px -34px rgba(0,0,0,.75); padding:28px 26px; }
  .cx-title{ font-size:27px; font-weight:850; letter-spacing:-.6px; }
  .cx-foot{ padding:26px 0 0; }
}

/* ============ CLOCHE DE NOTIFICATIONS ============ */
.notif-wrap{ position:relative; }
.notif-bell{ position:relative; width:38px; height:38px; border-radius:11px; background:var(--bone-200); border:1.5px solid var(--line); font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.notif-bell:hover{ background:var(--bone-300); }
.notif-badge{ position:absolute; top:-5px; right:-5px; min-width:17px; height:17px; border-radius:99px; background:var(--red); color:#fff; font-size:9.5px; font-weight:800; display:flex; align-items:center; justify-content:center; padding:0 4px; border:2px solid var(--bg); }
.notif-panel{ position:absolute; top:46px; right:0; width:330px; max-width:90vw; background:var(--card); border:1.5px solid var(--line); border-radius:16px; box-shadow:0 20px 50px -12px rgba(16,24,40,.25); z-index:70; display:none; overflow:hidden; }
.notif-panel.open{ display:block; }
.notif-panel .np-head{ padding:14px 16px; border-bottom:1px solid var(--line2); font-size:12.5px; font-weight:800; display:flex; justify-content:space-between; align-items:center; }
.notif-panel .np-head a{ font-size:11px; font-weight:700; color:var(--lime-deep); cursor:pointer; }
.notif-list{ max-height:360px; overflow-y:auto; }
.notif-item{ display:flex; gap:10px; padding:12px 16px; border-bottom:1px solid var(--line2); cursor:pointer; }
.notif-item:last-child{ border-bottom:none; }
.notif-item:hover{ background:var(--bone-100); }
.notif-item.unread{ background:var(--moss-50); }
.notif-item .ic{ width:30px; height:30px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; background:var(--bone-200); }
.notif-item .body{ flex:1; min-width:0; }
.notif-item .txt{ font-size:12px; color:var(--ink); font-weight:600; line-height:1.4; }
.notif-item .time{ font-size:10.5px; color:var(--ink3); margin-top:3px; font-weight:600; }
.notif-empty{ padding:26px 16px; text-align:center; font-size:12px; color:var(--ink3); font-weight:500; }

/* ============ RESSENTIS : ÉCHELLE DE BORG & DIFFICULTÉ ============ */
.borg-row{ display:flex; gap:5px; flex-wrap:wrap; }
.borg-btn{ width:34px; height:34px; border-radius:10px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:#fff; font-size:13px; font-weight:800; cursor:pointer; font-family:inherit; }
.borg-btn.on{ border-color:transparent; color:var(--ink); }
.borg-indic{ margin-top:12px; min-height:36px; }
.borg-indic .lbl{ font-size:13px; font-weight:800; }
.borg-indic .txt{ font-size:11.5px; color:var(--text-body-dark); margin-top:2px; font-weight:500; }
.fb-comment{ width:100%; margin-top:12px; padding:10px 12px; border-radius:12px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:#fff; font-family:inherit; font-size:12.5px; font-weight:500; resize:vertical; min-height:56px; }
.fb-comment::placeholder{ color:var(--text-muted-dark); }
.fb-comment:focus{ outline:none; border-color:var(--lime); }
.fb-actions{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.fb-sent{ display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; color:var(--lime); margin-top:10px; }

.diff-row{ display:flex; gap:6px; flex-wrap:wrap; }
.diff-chip{ display:flex; flex-direction:column; align-items:center; gap:4px; width:60px; padding:9px 4px; border-radius:12px; border:1.5px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); color:var(--text-soft-dark); cursor:pointer; font-family:inherit; }
.diff-chip .em{ font-size:16px; }
.diff-chip .lb{ font-size:9px; font-weight:750; text-align:center; line-height:1.2; }
.diff-chip.on{ background:rgba(249,115,22,.16); border-color:var(--lime); color:#fff; }
.fb-toggle-comment{ font-size:11px; font-weight:700; color:var(--lime); cursor:pointer; margin-top:10px; display:inline-block; }
.ex-fb-box{ margin-top:18px; background:rgba(255,255,255,.04); border-radius:14px; padding:14px 16px; }
.ex-fb-box .fb-h{ font-size:10px; text-transform:uppercase; letter-spacing:.4px; color:var(--text-muted-dark); font-weight:800; margin-bottom:10px; }

/* ============ MESSAGERIE ============ */
.chat-btn{ position:relative; }
.chat-thread{ display:flex; flex-direction:column; gap:10px; padding:4px 2px 14px; }
.msg-bubble{ max-width:78%; padding:10px 14px; border-radius:16px; font-size:13px; line-height:1.5; font-weight:500; }
.msg-bubble.from-client{ align-self:flex-end; background:var(--dark); color:#fff; border-bottom-right-radius:5px; }
.msg-bubble.from-coach{ align-self:flex-start; background:var(--bone-200); color:var(--ink); border-bottom-left-radius:5px; }
.msg-time-row{ display:flex; align-items:center; gap:8px; margin-top:5px; }
.msg-time{ font-size:9.5px; opacity:.6; font-weight:600; }
.msg-del{ cursor:pointer; font-size:11px; opacity:.45; }
.msg-del:hover{ opacity:1; }
.chat-input-row{ display:flex; gap:8px; padding-top:12px; border-top:1px solid var(--line2); }
.chat-input-row textarea{ flex:1; resize:none; padding:10px 13px; border:1.5px solid var(--line); border-radius:12px; font-family:inherit; font-size:13px; font-weight:500; min-height:44px; max-height:110px; }
.chat-input-row textarea:focus{ outline:none; border-color:var(--dark); }
.chat-empty{ text-align:center; padding:30px 10px; font-size:12.5px; color:var(--ink3); font-weight:500; }

.thread-row{ display:flex; align-items:center; gap:13px; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:13px 16px; margin-bottom:10px; cursor:pointer; }
.thread-row:hover{ border-color:var(--ink3); }
.thread-row .info{ flex:1; min-width:0; }
.thread-row .last{ font-size:12px; color:var(--ink3); margin-top:2px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.thread-badge{ min-width:20px; height:20px; border-radius:99px; background:var(--red); color:#fff; font-size:10.5px; font-weight:800; display:flex; align-items:center; justify-content:center; padding:0 5px; flex-shrink:0; }

.feed-card{ position:relative; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:15px 44px 15px 18px; margin-bottom:10px; cursor:pointer; transition:.12s; }
.feed-card:hover{ border-color:var(--ink3); }
.feed-del{ position:absolute; top:12px; right:12px; width:26px; height:26px; border-radius:8px; border:1.5px solid var(--line); background:var(--card); color:var(--ink3); font-size:12px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.feed-del:hover{ background:var(--red); color:#fff; border-color:var(--red); }
.feed-card .top{ display:flex; align-items:center; gap:10px; }
.feed-card .who{ flex:1; font-size:12.5px; font-weight:750; }
.feed-card .when{ font-size:11px; color:var(--ink3); font-weight:600; }
.feed-card .kind-badge{ font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:4px 9px; border-radius:99px; }
.feed-card .value-row{ display:flex; align-items:center; gap:10px; margin-top:11px; }
.feed-card .borg-num{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:850; color:#fff; flex-shrink:0; }
.feed-card .value-label{ font-size:12.5px; font-weight:700; }
.feed-card .value-sub{ font-size:11px; color:var(--ink3); font-weight:600; }
.feed-card .comment{ margin-top:10px; font-size:12.5px; color:var(--ink2); line-height:1.5; font-weight:500; background:var(--bone-200); border-radius:10px; padding:9px 12px; }
.feed-card .exname{ font-size:11.5px; color:var(--ink3); font-weight:600; margin-top:2px; }

button{ font-family:inherit; }
.btn{ border:none; border-radius:999px; padding:12px 22px; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; font-family:var(--font-sans); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:7px; transition:.12s; white-space:nowrap; }
.btn-primary{ background:var(--dark); color:#fff; box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--ink-800); }
.btn-lime{ background:var(--lime); color:#fff; box-shadow:var(--shadow-ember); }
.btn-lime:hover{ background:var(--ember-500); }
.btn-soft{ background:var(--bone-200); color:var(--ink2); border:1.5px solid var(--line); }
.btn-soft:hover{ background:var(--bone-300); }
.btn-danger{ background:var(--rust-100); color:var(--red); border:1.5px solid var(--rust-100); }
.btn-danger:hover{ background:var(--red); color:#fff; }
.btn-block{ width:100%; }
.btn-sm{ padding:9px 15px; font-size:10.5px; }
.btn:disabled{ opacity:.45; cursor:not-allowed; }

.hub-wrap{ max-width:900px; margin:0 auto; }

/* ============ HERO DU JOUR ============ */
.hero-today{
  background-color:var(--dark); color:#fff;
  background-image:
    radial-gradient(ellipse 460px 300px at 106% -12%, rgba(249,115,22,.30), transparent 65%),
    radial-gradient(ellipse 360px 260px at -8% 118%, rgba(74,102,66,.22), transparent 62%),
    radial-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:auto, auto, 3px 3px; background-repeat:no-repeat, no-repeat, repeat;
  border-radius:22px; margin-bottom:14px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.hero-today::after{ content:""; position:absolute; right:-60px; top:-60px; width:250px; height:250px; border-radius:50%; background:radial-gradient(circle, rgba(249,115,22,.26), transparent 70%); }
.hero-today.rest{ background:var(--card); color:var(--ink); border:1.5px solid var(--line); box-shadow:none; }
.hero-today.rest::after{ display:none; }
/* Séance du jour déjà réalisée : même carte claire que .rest, teintée lime pour
   signaler "terminée" sans réafficher un CTA de démarrage — voir renderClientHome. */
.hero-today.done{ background:var(--lime-soft); color:var(--ink); border:1.5px solid var(--lime-line); box-shadow:none; }
.hero-today.done::after{ display:none; }
.hero-in{ padding:24px 24px 26px; position:relative; }
.hero-today .eyebrow{ font-size:10.5px; letter-spacing:1.6px; text-transform:uppercase; color:var(--lime); font-weight:800; position:relative; }
.hero-today.rest .eyebrow, .hero-today.done .eyebrow{ color:var(--ink3); }
.hero-today h2{ font-size:26px; font-weight:850; margin-top:7px; letter-spacing:-.7px; position:relative; }
.hero-today h2.hero-open{ cursor:pointer; }
.hero-today h2.hero-open:hover{ color:var(--ember-300); }
/* Accent "display" (Instrument Serif italique) sur un mot fixe du titre — même
   convention que Power<em>Health</em> dans l'appbar (styles.css .brand h1 em) —
   pour amener la typo éditoriale de la marque jusque dans le hero du jour. */
.hero-today h2 em{ font-family:var(--font-display); font-style:italic; font-weight:400; color:var(--ember-400); }
.hero-today.rest h2 em, .hero-today.done h2 em{ color:var(--ember-500); }
.hero-today p.sub{ font-size:13px; color:var(--text-body-dark); margin-top:6px; font-weight:500; position:relative; line-height:1.5; }
.hero-today.rest p.sub, .hero-today.done p.sub{ color:var(--ink2); }
.hero-link{ font-size:11.5px; font-weight:700; color:var(--ember-300); margin-top:6px; cursor:pointer; position:relative; display:inline-block; }
.hero-tiles{ display:flex; gap:8px; margin-top:16px; position:relative; }
.hero-tile{ flex:1; background:rgba(255,255,255,.08); border-radius:14px; padding:11px 8px; text-align:center; }
.hero-tile .l{ font-size:9px; text-transform:uppercase; letter-spacing:.4px; color:var(--text-muted-dark); font-weight:800; }
.hero-tile .v{ font-size:18px; font-weight:800; margin-top:3px; }
.hero-cta{ margin-top:20px; position:relative; }
.hero-exlist{ padding:4px 24px 18px; background:rgba(0,0,0,.18); position:relative; }
.hero-ex{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.hero-ex:last-child{ border-bottom:none; }
.hero-ex .n{ font-size:12.5px; font-weight:750; }
.hero-ex .p{ font-size:11px; color:var(--text-muted-dark); margin-top:3px; font-weight:600; }
.hero-vid, .hero-kcal{ font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:4px 8px; border-radius:99px; background:rgba(249,115,22,.16); color:var(--ember-300); flex-shrink:0; white-space:nowrap; }
.hero-vid.off{ background:rgba(255,255,255,.07); color:var(--text-muted-dark); }

/* ============ SECTIONS ============ */
.sect-head{ display:flex; justify-content:space-between; align-items:center; margin:26px 2px 12px; }
.sect-head h3{ font-size:15px; font-weight:800; letter-spacing:-.2px; }
.sect-head .hint{ font-size:11.5px; color:var(--ink3); font-weight:500; }
/* Titres de section en Instrument Serif italique — accueil client uniquement
   (classe posée à la main dans renderClientHome, js/client-view.js), pour amener
   la typo éditoriale de la marque au niveau des sections, pas seulement du logo. */
.sect-head h3.sect-title-em{ font-family:var(--font-display); font-style:italic; font-weight:400; font-size:19px; letter-spacing:0; }
.empty-note{ font-size:12.5px; color:var(--ink3); font-weight:500; padding:16px 2px; }

/* en-tête des écrans racine de l'espace coach — repère de section + grand titre */
.coach-tab-head{ align-items:flex-start; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.tab-eyebrow{ font-size:10px; letter-spacing:1.6px; text-transform:uppercase; color:var(--lime); font-weight:800; }
.tab-title{ font-size:22px; font-weight:850; letter-spacing:-.5px; margin-top:5px; }
.tab-sub{ font-size:12.5px; color:var(--ink3); font-weight:500; margin-top:6px; line-height:1.55; max-width:60ch; }

/* mise en page à deux colonnes (liste + détail) réutilisée par Messages et Abonnements —
   une seule colonne visible à la fois sur mobile, côte à côte à partir de 900px. */
.split-pane{ display:flex; flex-direction:column; gap:14px; align-items:start; }
.split-list{ width:100%; }
.split-detail{ width:100%; background:var(--card); border:1.5px solid var(--line); border-radius:18px; padding:18px 20px; min-width:0; }
@media (max-width:899.98px){
  .split-pane.has-detail .split-list{ display:none; }
  .split-pane:not(.has-detail) .split-detail{ display:none; }
}
@media (min-width:900px){
  .split-pane{ display:grid; grid-template-columns:320px minmax(0,1fr); gap:20px; }
  .split-detail .only-mobile{ display:none; }
}
.chat-panel-head{ display:flex; align-items:center; gap:11px; padding-bottom:14px; border-bottom:1px solid var(--line2); margin-bottom:2px; }
.chat-panel-head .avatar{ width:34px; height:34px; border-radius:11px; font-size:11.5px; }
.chat-panel-head h5{ font-size:13px; font-weight:750; }
.chat-panel-body{ max-height:420px; overflow-y:auto; padding:2px 2px 6px; }

.upcoming-row{ display:flex; gap:10px; overflow-x:auto; padding:2px 2px 8px; }
.up-card{ position:relative; flex:0 0 148px; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:14px; transition:.12s; }
.up-card:hover{ border-color:var(--ink3); transform:translateY(-1px); }
.up-card .d{ font-size:10px; text-transform:uppercase; color:var(--ink3); font-weight:800; letter-spacing:.4px; }
.up-card .dn{ font-size:19px; font-weight:850; margin-top:2px; letter-spacing:-.3px; }
.up-card .nm{ font-size:12px; font-weight:750; margin-top:9px; color:var(--ink); line-height:1.35; min-height:32px; }
.up-card .tag{ display:inline-block; margin-top:9px; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:3px 8px; border-radius:99px; }
.up-card .cnt{ font-size:10.5px; color:var(--ink3); font-weight:600; margin-top:6px; }
.up-card .clickzone{ cursor:pointer; }
.up-move-btn{ position:absolute; top:9px; right:9px; width:24px; height:24px; border-radius:8px; border:1.5px solid var(--line); background:var(--card); color:var(--ink2); font-size:12px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.up-move-btn:hover{ background:var(--dark); color:var(--lime); border-color:var(--dark); }
.up-card.rest-cal{ background:var(--bone-200); }
.up-card.done{ cursor:pointer; background:var(--lime-soft); border-color:var(--lime-line); }
.up-card.done:hover{ border-color:var(--lime-deep); }
.up-card.done .nm{ color:var(--moss-500); }
.done-badge{ display:inline-block; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:3px 8px; border-radius:99px; background:var(--lime-deep); color:#fff; }
.up-card.done .cnt{ color:var(--lime-deep); font-weight:700; }
/* Case du jour dans "Mon calendrier" (accueil) — liseré ember (signature du
   hero et du CTA) plutôt que neutre, pour repérer aujourd'hui même quand la
   séance est marquée "Terminée" (les deux classes peuvent se combiner). */
.up-card.today{ border-color:var(--lime); box-shadow:0 0 0 1.5px var(--lime) inset; }
.up-card.today.done{ border-color:var(--lime-deep); box-shadow:0 0 0 1.5px var(--lime-deep) inset; }

/* ============ CARTE NUTRITION DU JOUR (accueil client) ============ */
.nutri-kcal{ font-family:var(--font-mono); font-size:26px; font-weight:850; color:var(--ember-500); margin-top:12px; letter-spacing:-.5px; }
.nutri-kcal small{ font-size:13px; font-weight:700; color:var(--ink3); margin-left:3px; }
.nutri-card .macro-bar{ margin-top:10px; }
.nutri-macro-legend{ display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; font-size:11px; font-weight:600; color:var(--ink2); }
.nutri-macro-legend i{ display:inline-block; width:8px; height:8px; border-radius:99px; margin-right:6px; }
.nutri-macro-legend b{ color:var(--ink); font-weight:750; }

/* ============ COMPTEUR DE MOTIVATION (client) ============ */
.motiv-card{ display:flex; align-items:center; gap:14px; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:16px 20px; margin-top:12px; }
.motiv-num{ font-size:28px; font-weight:900; color:var(--lime-deep); letter-spacing:-1px; flex-shrink:0; min-width:44px; text-align:center; }
.motiv-txt{ font-size:12.5px; font-weight:700; color:var(--ink); line-height:1.4; }
.motiv-txt span{ display:inline-block; margin-top:3px; font-size:11px; color:var(--ink3); font-weight:600; }

/* ============ PROGRAMMES (carte) ============ */
.prog-card{ background:var(--card); border:1.5px solid var(--line); border-radius:18px; padding:18px 20px; margin-bottom:12px; cursor:pointer; transition:.12s; }
.prog-card:hover{ border-color:var(--ink3); }
.prog-card .top{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.prog-card h4{ font-size:15px; font-weight:800; letter-spacing:-.2px; }
.prog-card .weeks{ font-size:11.5px; color:var(--ink3); font-weight:600; margin-top:3px; }
.status{ font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:4px 9px; border-radius:99px; flex-shrink:0; display:inline-block; }
.status.actif{ background:var(--lime-soft); color:var(--lime-deep); }
.status.termine{ background:var(--bone-200); color:var(--ink3); }
.status.avenir{ background:var(--slate-100); color:var(--blue); }
.status.pause{ background:var(--amber-100); color:var(--amber); }
.status.annule{ background:var(--rust-100); color:var(--red); }
.prog-progress{ height:6px; border-radius:99px; background:var(--line); margin-top:13px; overflow:hidden; }
.prog-progress i{ display:block; height:100%; background:var(--lime); border-radius:99px; }
.prog-days{ display:flex; gap:6px; margin-top:13px; flex-wrap:wrap; }
.prog-day-chip{ font-size:10px; font-weight:750; padding:5px 9px; border-radius:8px; background:var(--bone-200); color:var(--ink3); }
.prog-day-chip.active{ background:var(--dark); color:var(--lime); }

/* ============ MES REPAS DU JOUR (jours de repos) ============ */
/* même carte que .prog-card, mais pas cliquable : liste de repas (.hero-ex,
   partagé avec l'aperçu d'exercices du hero) plutôt qu'un résumé + statut. */
.prog-card.meals-card{ cursor:default; }
.prog-card.meals-card:hover{ border-color:var(--line); }
.meals-card .hero-ex:first-child{ padding-top:0; }

/* ============ ÉCRAN PROGRAMME / SÉANCE ============ */
.screen-head{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.back-btn{ width:36px; height:36px; border-radius:11px; background:var(--card); border:1.5px solid var(--line); font-size:16px; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:var(--ink2); }
.back-btn:hover{ background:var(--bone-200); }
.screen-head h2{ font-size:19px; font-weight:850; letter-spacing:-.3px; }
.screen-head p{ font-size:12px; color:var(--ink3); font-weight:500; margin-top:2px; }

.week-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-bottom:24px; }
.week-day-col{ background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:12px 10px; min-height:120px; cursor:pointer; transition:.12s; display:flex; flex-direction:column; }
.week-day-col:hover{ border-color:var(--ink3); }
.week-day-col.rest{ background:var(--bone-200); }
.week-day-col.today{ border-color:var(--dark); box-shadow:0 0 0 1.5px var(--dark) inset; }
.week-day-col h6{ font-size:9.5px; text-transform:uppercase; font-weight:800; color:var(--ink3); letter-spacing:.4px; }
.week-day-col .sess-name{ font-size:12px; font-weight:750; margin-top:9px; line-height:1.3; flex:1; }
.week-day-col .rest-lbl{ font-size:11px; color:var(--ink3); font-style:italic; margin-top:9px; font-weight:500; }
.week-day-col .cnt{ font-size:10px; color:var(--ink3); margin-top:auto; padding-top:8px; font-weight:600; }

.sess-list{ display:flex; flex-direction:column; }
.sess-card{ background:var(--card); border:1.5px solid var(--line); border-radius:18px; padding:4px 14px; }
.sess-item{ display:flex; gap:12px; align-items:center; padding:14px 2px; border-bottom:1px solid var(--line2); cursor:pointer; transition:.12s; }
.sess-item:last-child{ border-bottom:none; }
.sess-item:hover{ background:var(--bone-100); }
.sess-item .idx{ width:28px; height:28px; border-radius:9px; background:var(--bone-200); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; color:var(--ink2); flex-shrink:0; }
.sess-item .info{ flex:1; min-width:0; }
.sess-item .info h5{ font-size:13px; font-weight:750; }
.sess-item .info .meta{ font-size:11px; color:var(--ink3); margin-top:2px; font-weight:600; }
.sess-item .vid-badge{ font-size:9px; font-weight:800; text-transform:uppercase; padding:3px 7px; border-radius:99px; background:var(--lime-soft); color:var(--lime-deep); flex-shrink:0; white-space:nowrap; }
.sess-item .vid-badge.none{ background:var(--bone-200); color:var(--ink3); }

.coach-note{ background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:16px 18px; margin-top:16px; }
.coach-note .l{ font-size:9.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--lime-deep); font-weight:800; margin-bottom:8px; }
.coach-note p{ font-size:12.5px; line-height:1.6; color:var(--ink2); font-weight:500; }

.sticky-cta{ position:sticky; bottom:14px; margin-top:22px; }

/* ============ MODALES ============ */
.overlay{ position:fixed; inset:0; background:rgba(10,20,16,.55); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; z-index:60; padding:16px; }
.overlay.open{ display:flex; }
.modal{ background:#fff; border-radius:20px; width:640px; max-width:96vw; max-height:92vh; display:flex; flex-direction:column; box-shadow:0 30px 80px rgba(0,0,0,.35); overflow:hidden; }
.modal-head{ padding:20px 24px 16px; border-bottom:1px solid var(--line2); }
.modal-head .eyebrow{ font-size:9.5px; letter-spacing:1.3px; text-transform:uppercase; color:var(--lime-deep); font-weight:800; }
.modal-head h3{ font-size:17px; font-weight:800; letter-spacing:-.3px; margin-top:3px; }
.modal-head p{ font-size:12px; color:var(--ink2); margin-top:5px; line-height:1.5; font-weight:500; }
.modal-body{ padding:18px 24px; overflow-y:auto; flex:1; }
.modal-foot{ padding:15px 24px; border-top:1px solid var(--line2); display:flex; gap:8px; flex-wrap:wrap; align-items:center; background:var(--bone-50); }

.grid{ display:grid; gap:12px; }
.g2{ grid-template-columns:repeat(2,1fr); }
.g3{ grid-template-columns:repeat(3,1fr); }
.g4{ grid-template-columns:repeat(4,1fr); }
.field label{ display:block; font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--ink3); margin-bottom:6px; font-weight:700; }
.field input, .field select, .field textarea{ width:100%; padding:9px 11px; border:1.5px solid var(--line); border-radius:10px; font-size:13px; font-weight:600; color:var(--ink); background:var(--bone-50); font-family:inherit; }
.field textarea{ font-weight:500; resize:vertical; min-height:70px; line-height:1.5; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--dark); background:#fff; }
.field select{ cursor:pointer; }
.field.chk{ display:flex; align-items:center; gap:8px; flex-direction:row; }
.field.chk label{ margin:0; }
.field.chk input{ width:auto; accent-color:var(--dark); }

/* ============ CONNEXION ============ */
.login-shell{ min-height:82vh; display:flex; align-items:center; justify-content:center; }
.login-card{ width:380px; max-width:100%; background:var(--card); border-radius:22px; padding:34px 30px; box-shadow:0 1px 2px rgba(16,24,40,.04), 0 20px 50px -20px rgba(16,24,40,.16); }
.login-brand{ text-align:center; margin-bottom:22px; }
.login-brand .logo{ margin:0 auto 12px; }
.login-brand h2{ font-size:19px; font-weight:850; letter-spacing:-.3px; }
.login-brand p{ font-size:12.5px; color:var(--ink3); margin-top:4px; font-weight:500; }
.login-field{ margin-bottom:14px; }
.login-field label{ display:block; font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--ink3); margin-bottom:6px; font-weight:700; }
.login-field input{ width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:11px; font-size:13.5px; font-weight:600; color:var(--ink); background:var(--bone-50); font-family:inherit; }
.login-field input:focus{ outline:none; border-color:var(--dark); background:#fff; }
.login-error{ background:var(--rust-100); border:1.5px solid var(--rust-100); color:var(--red); border-radius:10px; padding:9px 12px; font-size:12px; font-weight:650; margin-bottom:14px; }
.login-note{ font-size:10.5px; color:var(--ink3); line-height:1.5; margin-top:10px; font-weight:500; }

/* ============ VIDÉO ============ */
.video-frame{ position:relative; width:100%; aspect-ratio:4/3; background:var(--dark); border-radius:20px; overflow:hidden; display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.10); }
.video-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-frame video{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#000; }
.video-frame-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
input[type="file"]{ width:100%; font-size:12px; font-weight:600; color:var(--ink2); padding:8px 0; }
.video-frame-empty{ background:radial-gradient(ellipse at 50% 40%, rgba(249,115,22,.16), transparent 62%), var(--dark); }
.video-empty{ color:var(--text-muted-dark); text-align:center; padding:20px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.video-play-ic{ width:54px; height:54px; border-radius:999px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; color:var(--ember-400); flex-shrink:0; }
.video-empty p{ font-size:11.5px; line-height:1.55; max-width:280px; }
.video-link{ display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; color:var(--lime); margin-top:10px; }
.video-link a{ color:inherit; text-decoration:none; }
.video-link a:hover{ text-decoration:underline; }
.stat-mini-row{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.stat-mini{ background:var(--bone-200); border:1.5px solid var(--line); border-radius:12px; padding:10px 8px; flex:1; text-align:center; }
.stat-mini .l{ font-size:9px; text-transform:uppercase; letter-spacing:.4px; color:var(--ink3); font-weight:800; }
.stat-mini .v{ font-size:15px; font-weight:850; margin-top:3px; color:var(--ink); }
.expl-box{ background:var(--bone-200); border:1.5px solid var(--line); border-radius:14px; padding:14px 16px; margin-top:14px; font-size:12.5px; line-height:1.6; color:var(--ink2); font-weight:500; }
.expl-box b{ color:var(--ink); }
.tips-box{ background:var(--lime-soft); border:1.5px solid var(--lime-line); border-radius:14px; padding:12px 16px; margin-top:10px; font-size:12px; line-height:1.55; color:var(--moss-500); font-weight:500; }

/* ============ RÉORDONNANCEMENT LIGNES (éditeur séance) ============ */
.ex-row{ display:grid; grid-template-columns:auto 1fr 58px 90px 78px 78px 66px auto; gap:8px; align-items:center; margin-bottom:8px; background:var(--bone-100); border:1.5px solid var(--line); border-radius:12px; padding:9px 10px; transition:box-shadow .3s, border-color .3s, background .3s; }
.ex-row.ex-row-highlight{ border-color:var(--lime-deep); background:var(--moss-50); box-shadow:0 0 0 2px var(--lime-line); }
.ex-row .order-btns{ display:flex; flex-direction:column; gap:2px; }
.ex-row .order-btns button{ width:20px; height:16px; border:none; background:var(--bone-300); border-radius:4px; font-size:9px; cursor:pointer; color:var(--ink2); line-height:1; }
.ex-row .order-btns button:hover{ background:var(--dark); color:var(--lime); }
.ex-row select{ width:100%; padding:7px 8px; border:1.5px solid var(--line); border-radius:8px; font-size:12px; font-weight:600; font-family:inherit; background:#fff; }
.ex-row input{ width:100%; padding:7px 6px; border:1.5px solid var(--line); border-radius:8px; font-size:12px; font-weight:600; font-family:inherit; text-align:center; background:#fff; }
.ex-row .lbl{ font-size:8.5px; text-transform:uppercase; color:var(--ink3); font-weight:800; text-align:center; margin-bottom:3px; letter-spacing:.3px; }
.ex-row .del{ background:var(--rust-100); color:var(--red); border:none; border-radius:8px; width:30px; height:30px; cursor:pointer; font-size:14px; font-weight:700; }
.ex-row .del:hover{ background:var(--red); color:#fff; }
.ex-row-comment{ margin:-4px 0 8px; }
.ex-row-comment input{ width:100%; padding:7px 10px; border:1.5px dashed var(--line); border-radius:8px; font-size:11.5px; font-weight:500; font-family:inherit; background:var(--bone-50); color:var(--ink2); }
.ex-row-comment input:focus{ outline:none; border-color:var(--lime-deep); border-style:solid; background:#fff; }
.add-ex-row{ display:grid; grid-template-columns:1fr auto; gap:9px; align-items:center; margin-top:12px; padding-top:14px; border-top:1px dashed var(--line); }

/* ============ ÉDITEUR DE SÉANCE — GLISSER-DÉPOSER ============
   La modale reste une surface blanche (voir .modal) : on définit ici un
   petit jeu de jetons locaux au lieu de réutiliser --ink/--bone-* qui sont
   calibrés pour les surfaces sombres du reste de l'appli. */
.modal-wide{ width:960px; }

.dd-builder{
  --dd-ink:var(--ink-900); --dd-ink2:var(--ink-500); --dd-ink3:var(--ink-300);
  --dd-line:var(--ink-100); --dd-surface:#FAF7F0; --dd-surface2:#F4EFE4; --dd-surface3:#EDE6D6;
  display:grid; grid-template-columns:280px 1fr; gap:16px; align-items:start; margin-top:2px;
}
@media (max-width:760px){
  .dd-builder{ grid-template-columns:1fr; }
  .dd-builder.show-sess #dd-bank-panel{ display:none; }
  .dd-builder:not(.show-sess) #dd-sess-panel{ display:none; }
}

.dd-tabs{ display:none; margin-bottom:12px; }
.dd-tabs .seg{ width:100%; }
.dd-tabs .seg button{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px; }
@media (max-width:760px){ .dd-tabs{ display:block; } }

.dd-panel{ background:var(--dd-surface); border:1.5px solid var(--dd-line); border-radius:14px; padding:14px; }
.dd-panel-title{ font-size:13px; font-weight:800; color:var(--dd-ink); margin-bottom:2px; }
.dd-panel-sub{ font-size:10.5px; color:var(--dd-ink2); font-weight:600; }

.dd-scroll{ max-height:420px; overflow-y:auto; margin:0 -4px; padding:0 4px; }

.dd-mgroup{ font-size:9px; text-transform:uppercase; letter-spacing:.5px; color:var(--dd-ink3); font-weight:800; margin:12px 0 6px; }
.dd-mgroup:first-child{ margin-top:0; }

.dd-bank-card{ display:flex; align-items:center; gap:8px; background:#fff; border:1.5px solid var(--dd-line); border-radius:10px; padding:8px 9px; margin-bottom:6px; cursor:grab; touch-action:none; user-select:none; transition:border-color .12s, transform .12s; }
.dd-bank-card:hover{ border-color:var(--dd-ink3); transform:translateX(2px); }
.dd-bank-card:active{ cursor:grabbing; }
.dd-bank-card .grip{ color:var(--dd-ink3); font-size:12px; letter-spacing:-1px; flex-shrink:0; }
.dd-bank-card .bc-info{ min-width:0; flex:1; }
.dd-bank-card .bc-name{ font-size:11.5px; font-weight:750; color:var(--dd-ink); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dd-bank-card .bc-meta{ display:flex; align-items:center; gap:6px; margin-top:3px; }
.dd-bank-card .bc-tag{ font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:2px 6px; border-radius:99px; color:#fff; }
.dd-bank-card .bc-equip{ font-size:9px; color:var(--dd-ink2); font-weight:600; }
.dd-bank-card .add-plus{ flex-shrink:0; width:21px; height:21px; border-radius:7px; background:var(--dd-surface2); border:1.5px solid var(--dd-line); color:var(--dd-ink2); font-size:13px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.dd-bank-card:hover .add-plus{ background:var(--lime); color:#fff; border-color:var(--lime); }
.dd-bank-card.tap-pulse{ animation:ddTapPulse .35s ease; }
@keyframes ddTapPulse{ 0%{ transform:scale(1); } 45%{ transform:scale(.95); border-color:var(--lime); } 100%{ transform:scale(1); } }
.dd-bank-card.ghost-dragging{ opacity:.3; }

.dd-chip{ display:inline-flex; align-items:center; gap:5px; border:1.5px solid var(--dd-line); border-radius:99px; padding:5px 10px; font-size:10px; font-weight:700; color:var(--dd-ink2); cursor:pointer; user-select:none; background:#fff; transition:.12s; }
.dd-chip:hover{ border-color:var(--dd-ink3); }
.dd-chip .dot{ width:6px; height:6px; border-radius:99px; }
.dd-chip.on{ background:var(--dark); border-color:var(--dark); color:#fff; }

.dd-stats-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:4px; }
.dd-stat-pill{ display:flex; align-items:center; gap:5px; background:var(--dd-surface); border:1.5px solid var(--dd-line); border-radius:99px; padding:5px 11px; font-size:10.5px; font-weight:700; color:var(--dd-ink2); }
.dd-stat-pill b{ color:var(--dd-ink); font-family:var(--font-mono); font-weight:600; }
.dd-collapse-all{ margin-left:auto; background:#fff; border:1.5px solid var(--dd-line); border-radius:99px; padding:5px 11px; font-size:10px; font-weight:700; color:var(--dd-ink2); cursor:pointer; font-family:inherit; }
.dd-collapse-all:hover{ border-color:var(--dd-ink3); color:var(--dd-ink); }

.dd-dropzone{ min-height:100px; margin-top:10px; }
.dd-dropzone.empty{ display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; border:1.5px dashed var(--dd-line); border-radius:12px; padding:30px 16px; text-align:center; }
.dd-dropzone.empty .ic{ font-size:20px; opacity:.5; }
.dd-dropzone.empty p{ font-size:11.5px; color:var(--dd-ink2); font-weight:600; max-width:30ch; line-height:1.6; margin:0; }

.dd-placeholder-slot{ height:40px; border-radius:10px; border:1.5px dashed var(--lime-deep); background:var(--moss-50); margin-bottom:8px; }

/* Ligne d'exercice de la séance, dans l'esprit d'.ex-row existant, avec la
   poignée de glisser, le repère couleur muscle et les états repliés. */
.dd-row{ display:flex; gap:6px; align-items:stretch; background:var(--dd-surface); border:1.5px solid var(--dd-line); border-left:4px solid var(--dd-line); border-radius:12px; padding:8px 9px; margin-bottom:8px; transition:opacity .12s, border-color .12s; }
.dd-row.row-dragging{ opacity:.3; }
.dd-row.dd-row-highlight{ border-color:var(--lime-deep); background:var(--moss-50); box-shadow:0 0 0 2px var(--lime-line); }
.dd-row.row-enter{ animation:ddRowEnter .35s ease; }
@keyframes ddRowEnter{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }
.dd-row .grip{ display:flex; align-items:center; color:var(--dd-ink3); font-size:13px; cursor:grab; padding:0 1px; letter-spacing:-1px; touch-action:none; flex-shrink:0; }
.dd-row .grip:active{ cursor:grabbing; }
.dd-row .order-btns{ display:flex; flex-direction:column; gap:2px; justify-content:center; flex-shrink:0; }
.dd-row .order-btns button{ width:17px; height:14px; border:none; background:var(--dd-surface3); border-radius:4px; font-size:7.5px; cursor:pointer; color:var(--dd-ink2); line-height:1; }
.dd-row .order-btns button:disabled{ opacity:.3; cursor:default; }
.dd-row .order-btns button:not(:disabled):hover{ background:var(--dark); color:var(--lime); }
.dd-row .row-main{ flex:1; min-width:0; }
.dd-row .row-top{ display:flex; align-items:center; gap:7px; margin-bottom:7px; flex-wrap:wrap; }
.dd-row .ex-name{ font-size:12px; font-weight:750; color:var(--dd-ink); cursor:pointer; }
.dd-row .ex-tag{ font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:2px 6px; border-radius:99px; color:#fff; flex-shrink:0; }
.dd-row .row-summary{ font-size:10.5px; color:var(--dd-ink2); font-weight:600; font-family:var(--font-mono); }
.dd-row .row-actions{ margin-left:auto; display:flex; gap:5px; flex-shrink:0; }
.dd-row .icon-btn{ background:var(--dd-surface2); color:var(--dd-ink2); border:none; border-radius:7px; width:24px; height:24px; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; }
.dd-row .icon-btn:hover{ background:var(--dd-surface3); }
.dd-row .icon-btn.del{ background:var(--rust-100); color:var(--red); }
.dd-row .icon-btn.del:hover{ background:var(--red); color:#fff; }

.dd-fields{ display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
@media (max-width:520px){ .dd-fields{ grid-template-columns:repeat(2,1fr); } }
.dd-fields .f-lbl{ font-size:8px; text-transform:uppercase; color:var(--dd-ink3); font-weight:800; text-align:center; margin-bottom:3px; letter-spacing:.3px; }
.dd-fields input{ width:100%; padding:6px 4px; border:1.5px solid var(--dd-line); border-radius:7px; font-size:11.5px; font-weight:600; font-family:inherit; text-align:center; background:#fff; color:var(--dd-ink); }
.dd-fields input:focus{ outline:none; border-color:var(--lime); }
.dd-fields input:disabled{ opacity:.35; }

.dd-row-comment{ margin-top:7px; }
.dd-row-comment input{ width:100%; padding:6px 9px; border:1.5px dashed var(--dd-line); border-radius:7px; font-size:11px; font-weight:500; font-family:inherit; background:#fff; color:var(--dd-ink2); }
.dd-row-comment input:focus{ outline:none; border-color:var(--lime-deep); border-style:solid; }

.dd-fallback{ display:flex; gap:8px; align-items:center; margin-top:12px; padding-top:12px; border-top:1px dashed var(--dd-line); font-size:10.5px; color:var(--dd-ink2); font-weight:600; flex-wrap:wrap; }
.dd-fallback select{ flex:1; min-width:160px; padding:7px 9px; border:1.5px solid var(--dd-line); border-radius:8px; font-size:11.5px; font-family:inherit; background:#fff; color:var(--dd-ink); }

.dd-ghost{ position:fixed; z-index:999; pointer-events:none; left:0; top:0; background:var(--dark); border:1.5px solid var(--lime); border-radius:10px; padding:8px 13px; font-size:11.5px; font-weight:750; color:#fff; box-shadow:0 14px 30px -10px rgba(0,0,0,.4); }

.dd-toast{ position:fixed; left:50%; bottom:22px; transform:translateX(-50%) translateY(16px); opacity:0; background:var(--dark); border-radius:99px; padding:9px 9px 9px 15px; display:flex; align-items:center; gap:11px; font-size:11.5px; font-weight:700; color:#fff; box-shadow:0 14px 30px -10px rgba(0,0,0,.45); transition:opacity .2s, transform .2s; pointer-events:none; z-index:998; }
.dd-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; }
.dd-toast button{ background:var(--lime); border:none; color:#fff; font-size:10.5px; font-weight:800; border-radius:99px; padding:6px 12px; cursor:pointer; font-family:inherit; }

.dd-badge{ background:var(--lime); color:#fff; font-size:9px; font-weight:800; border-radius:99px; min-width:15px; height:15px; display:inline-flex; align-items:center; justify-content:center; padding:0 4px; }

/* ============ BANQUE D'EXERCICES (coach) ============ */
.toolbar{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:16px; }
.search-box{ flex:1; min-width:180px; }
.search-box input{ width:100%; padding:10px 13px; border:1.5px solid var(--line); border-radius:11px; font-size:13px; font-family:inherit; background:var(--card); }
.search-box input:focus{ outline:none; border-color:var(--dark); }
.chips{ display:flex; flex-wrap:wrap; gap:7px; }
.chip{ display:flex; align-items:center; gap:6px; border:1.5px solid var(--line); border-radius:99px; padding:6px 12px; font-size:11.5px; font-weight:700; color:var(--ink2); cursor:pointer; user-select:none; transition:.12s; background:var(--card); }
.chip:hover{ border-color:var(--ink3); }
.chip.checked{ background:var(--dark); border-color:var(--dark); color:#fff; }
.chip .dot{ width:7px; height:7px; border-radius:99px; flex-shrink:0; }

.ex-bank-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.ex-card{ background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:14px; cursor:pointer; transition:.12s; }
.ex-card:hover{ border-color:var(--ink3); transform:translateY(-1px); }
.ex-card .tag{ display:inline-block; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; padding:3px 8px; border-radius:99px; }
.ex-card h5{ font-size:12.5px; font-weight:750; margin-top:9px; line-height:1.35; }
.ex-card .meta{ font-size:10.5px; color:var(--ink3); margin-top:5px; font-weight:600; }
.ex-card .vflag{ font-size:9.5px; font-weight:700; margin-top:8px; color:var(--lime-deep); }
.ex-card .vflag.off{ color:var(--ink3); }
.add-ex-card{ display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; border:1.5px dashed var(--ink3); border-radius:14px; cursor:pointer; min-height:120px; color:var(--ink2); font-size:12px; font-weight:700; }
.add-ex-card:hover{ border-color:var(--dark); color:var(--dark); background:var(--bone-100); }
.add-ex-card .plus{ font-size:22px; font-weight:400; line-height:1; }

/* ============ CLIENTS (coach) ============ */
.client-row{ display:flex; align-items:center; gap:13px; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:14px 16px; margin-bottom:10px; cursor:pointer; transition:.12s; }
.client-row:hover{ border-color:var(--ink3); }
.avatar{ width:40px; height:40px; border-radius:12px; background:var(--dark); color:var(--lime); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; flex-shrink:0; }
.client-row .info{ flex:1; min-width:0; }
.client-row h5{ font-size:13.5px; font-weight:750; }
.client-row .meta{ font-size:11.5px; color:var(--ink3); margin-top:2px; font-weight:600; }
.client-row .arrow{ color:var(--ink3); font-size:16px; flex-shrink:0; }
.client-row.on, .thread-row.on{ border-color:var(--lime); }

/* --- Fiche client unifiée (onglet Clients — clic sur un client) : accès + cartes
   récapitulatives programme/nutrition/suivi/abonnement, pour tout gérer sans quitter
   cet onglet. Voir renderClientHub() (coach-programs.js). --- */
.access-toggle{ display:flex; align-items:center; gap:12px; background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:13px 15px; cursor:pointer; transition:.12s; }
.access-toggle:hover{ border-color:var(--ink3); }
.access-toggle.on{ border-color:var(--lime); }
.access-toggle input{ width:17px; height:17px; accent-color:var(--lime-deep); flex-shrink:0; cursor:pointer; }
.at-info{ flex:1; min-width:0; }
.at-label{ font-size:12.5px; font-weight:750; }
.at-sub{ font-size:11px; color:var(--ink3); font-weight:600; margin-top:2px; }
.at-state{ font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; color:var(--ink3); flex-shrink:0; }
.access-toggle.on .at-state{ color:var(--lime-deep); }

.hub-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin:22px 0 26px; }
.hub-card{ background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:16px 18px; display:flex; flex-direction:column; gap:10px; }
.hub-card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.hub-card-head h4{ font-size:12.5px; font-weight:800; letter-spacing:-.1px; }
.hub-card-body .nm{ font-size:13.5px; font-weight:750; }
.hub-card-body .meta{ font-size:11.5px; color:var(--ink3); font-weight:600; margin-top:2px; }
.hub-card .empty-note{ padding:0; margin:2px 0 4px; }
.hub-card .btn{ align-self:flex-start; }

.adhr-bar{ height:5px; border-radius:99px; background:var(--bone-300); overflow:hidden; margin-top:9px; }
.adhr-bar i{ display:block; height:100%; background:var(--lime); border-radius:99px; }
.adhr-pct{ text-align:right; flex-shrink:0; }
.adhr-pct .n{ font-size:16px; font-weight:850; color:var(--ink); }
.adhr-pct .l{ font-size:9px; text-transform:uppercase; letter-spacing:.4px; color:var(--ink3); font-weight:800; margin-top:2px; }

/* réutilisées hors des cartes de ressenti (.feed-card) — carte "Ressentis moyens" du suivi coach */
.value-row{ display:flex; align-items:center; gap:10px; }
.borg-num{ display:flex; align-items:center; justify-content:center; border-radius:11px; color:#fff; font-weight:850; flex-shrink:0; }
.value-label{ font-size:12.5px; font-weight:700; }
.value-sub{ font-size:11px; color:var(--ink3); font-weight:600; margin-top:2px; }
.msg-bubble.me{ align-self:flex-end; background:var(--dark); color:#fff; border-bottom-right-radius:5px; }
.msg-bubble.you{ align-self:flex-start; background:var(--bone-200); color:var(--ink); border-bottom-left-radius:5px; }

.client-select{ padding:8px 12px; border-radius:10px; border:1.5px solid var(--line); font-size:12.5px; font-weight:700; font-family:inherit; background:var(--card); color:var(--ink); cursor:pointer; }

/* ============ LECTEUR DE SÉANCE ============ */
.player-overlay{
  position:fixed; inset:0; z-index:80; display:none; flex-direction:column; color:#fff;
  background-color:var(--dark);
  background-image:
    radial-gradient(ellipse 900px 560px at 100% 0%, rgba(249,115,22,.16), transparent 60%),
    radial-gradient(ellipse 700px 480px at 0% 100%, rgba(74,102,66,.14), transparent 60%),
    radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:auto, auto, 3px 3px; background-repeat:no-repeat, no-repeat, repeat;
}
.player-overlay.open{ display:flex; }
.player-top{ padding:16px 18px 10px; display:flex; align-items:center; gap:12px; flex-shrink:0; }
.player-dots{ flex:1; display:flex; gap:4px; }
.player-dots i{ flex:1; height:4px; border-radius:99px; background:rgba(255,255,255,.16); overflow:hidden; }
.player-dots i b{ display:block; height:100%; background:var(--lime); width:0%; transition:width .25s; }
.player-close{ width:34px; height:34px; border-radius:10px; background:rgba(255,255,255,.08); border:none; color:#fff; font-size:17px; cursor:pointer; flex-shrink:0; }
.player-close:hover{ background:rgba(255,255,255,.16); }
.player-body{ flex:1; overflow-y:auto; padding:6px 20px 20px; max-width:640px; margin:0 auto; width:100%; }
.fade-swap{ animation:fadeSwap .3s ease; }
@keyframes fadeSwap{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } }

.player-ex-head{ padding:14px 0 4px; }
.player-ex-head .pl-eyebrow{ font-size:10px; letter-spacing:1.6px; text-transform:uppercase; font-weight:800; }
.player-ex-head h2{ font-size:24px; font-weight:850; margin-top:10px; letter-spacing:-.4px; line-height:1.2; }

.player-target{ display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.player-target .t{ background:rgba(255,255,255,.06); border-radius:12px; padding:11px 8px; flex:1; text-align:center; }
.player-target .t .l{ font-size:9px; text-transform:uppercase; color:var(--text-muted-dark); font-weight:800; letter-spacing:.4px; }
.player-target .t .v{ font-size:16px; font-weight:850; margin-top:3px; }

.player-coach-note{ background:rgba(249,115,22,.14); border:1.5px solid rgba(249,115,22,.3); border-radius:14px; padding:13px 16px; margin-bottom:14px; }
.player-coach-note .l{ font-size:9.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--ember-400,#F97316); font-weight:800; margin-bottom:6px; }
.player-coach-note p{ font-size:12.5px; line-height:1.6; color:#fff; font-weight:500; }

.player-weight-box{ margin-top:12px; background:rgba(255,255,255,.06); border-radius:12px; padding:11px 14px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.player-weight-box label{ font-size:11px; text-transform:uppercase; letter-spacing:.3px; color:var(--text-muted-dark); font-weight:800; }
.player-weight-box input{ width:100px; background:rgba(255,255,255,.08); border:1.5px solid rgba(255,255,255,.16); border-radius:9px; padding:8px 10px; color:#fff; font-size:14px; font-weight:700; font-family:var(--font-mono); text-align:center; }
.player-weight-box input:focus{ outline:none; border-color:var(--lime); }

.player-expl{ margin-top:18px; background:rgba(255,255,255,.05); border-radius:14px; padding:14px 16px; font-size:12.5px; line-height:1.65; color:var(--text-soft-dark); font-weight:500; }
.player-expl b{ color:#fff; }

.player-sets{ display:flex; gap:8px; margin-top:18px; flex-wrap:wrap; align-items:center; }
.player-sets .lbl{ font-size:10px; text-transform:uppercase; color:var(--text-muted-dark); font-weight:800; letter-spacing:.4px; width:100%; margin-bottom:2px; }
.set-pill{ width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.06); border:1.5px solid rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:800; color:var(--text-soft-dark); }
.set-pill.done{ background:var(--lime); color:var(--dark); border-color:var(--lime); }
.set-pill.now{ border-color:var(--lime); color:#fff; }

.player-foot{ padding:14px 20px 20px; display:flex; gap:10px; flex-shrink:0; max-width:640px; margin:0 auto; width:100%; }
.player-foot button{ flex:1; }
.player-foot .nav-btn{ flex:0 0 44px; background:rgba(255,255,255,.08); color:#fff; border:none; border-radius:11px; font-size:15px; }
.player-foot .nav-btn:hover{ background:rgba(255,255,255,.16); }
.player-foot .nav-btn:disabled{ opacity:.3; }

.rest-screen{ text-align:center; padding-top:14vh; }
.rest-screen .eyebrow{ font-size:11px; letter-spacing:1.4px; text-transform:uppercase; color:var(--lime); font-weight:800; }
.rest-count{ font-size:76px; font-weight:900; margin-top:14px; letter-spacing:-2px; font-variant-numeric:tabular-nums; }
.rest-bar{ height:8px; border-radius:99px; background:rgba(255,255,255,.12); margin:22px auto 0; max-width:280px; overflow:hidden; }
.rest-bar i{ display:block; height:100%; background:var(--lime); border-radius:99px; transition:width 1s linear; }
.rest-next{ margin-top:22px; font-size:13px; color:var(--text-soft-dark); font-weight:600; }
.rest-next b{ color:#fff; }

.complete-screen{ text-align:center; padding-top:12vh; }
.big-check{ width:70px; height:70px; border-radius:50%; background:var(--lime); color:var(--dark); font-size:30px; display:flex; align-items:center; justify-content:center; margin:0 auto; font-weight:900; }
.complete-screen h2{ font-size:22px; font-weight:850; margin-top:20px; }
.complete-screen p{ font-size:13px; color:var(--text-body-dark); margin-top:8px; font-weight:500; }
.complete-stats{ display:flex; gap:10px; margin-top:24px; justify-content:center; }
.complete-stats .s{ background:rgba(255,255,255,.06); border-radius:14px; padding:14px 18px; min-width:88px; }
.complete-stats .s .v{ font-size:20px; font-weight:850; }
.complete-stats .s .l{ font-size:9.5px; text-transform:uppercase; color:var(--text-muted-dark); font-weight:800; margin-top:3px; letter-spacing:.3px; }

.no-print{ }

/* ==================================================================
   MOBILE — tout ce qui suit ne s'applique qu'en dessous des largeurs
   indiquées ; l'affichage PC (styles ci-dessus) n'est jamais modifié.
   ================================================================== */
@media (max-width:760px){
  .g2,.g3,.g4{ grid-template-columns:repeat(2,1fr); }
  .week-grid{ grid-template-columns:repeat(4,1fr); }

  /* Empêche le zoom automatique d'iOS/Safari à la mise au point d'un champ
     (déclenché par tout input sous 16px) — confort de saisie sur mobile. */
  .field input, .field select, .field textarea,
  .login-field input,
  .search-box input,
  .chat-input-row textarea,
  .ex-row input, .ex-row select{ font-size:16px; }

  .login-card{ padding:26px 20px; }

  /* En-tête appli : on empile marque et actions plutôt que de les laisser
     se replier au milieu d'une ligne trop étroite. */
  .appbar{ flex-direction:column; align-items:flex-start; gap:12px; }
  .appbar-actions{ width:100%; flex-wrap:wrap; row-gap:10px; }
  #view-seg{ width:100%; }
  #view-seg button{ flex:1; }

  /* Modales : marges internes resserrées, pied de modale empilé en pleine
     largeur (plus simple à toucher que plusieurs boutons côte à côte). */
  .modal-head{ padding:16px 18px 12px; }
  .modal-body{ padding:14px 18px; }
  .modal-foot{ padding:12px 18px; flex-direction:column; align-items:stretch; }
  .modal-foot .btn{ width:100%; }

  /* Éditeur de séance (ligne d'exercice) : le menu déroulant prend toute
     la largeur, séries/répétitions/temps/repos passent sur une deuxième
     ligne à 4 colonnes égales plutôt que de s'écraser sur une seule. */
  .ex-row{ grid-template-columns:repeat(4,1fr); row-gap:8px; }
  .ex-row > :nth-child(1){ grid-column:3; grid-row:1; } /* flèches ↑↓ */
  .ex-row > :nth-child(2){ grid-column:1 / 3; grid-row:1; } /* exercice */
  .ex-row > :nth-child(3){ grid-column:1; grid-row:2; } /* séries */
  .ex-row > :nth-child(4){ grid-column:2; grid-row:2; } /* répétitions */
  .ex-row > :nth-child(5){ grid-column:3; grid-row:2; } /* poids / distance */
  .ex-row > :nth-child(6){ grid-column:4; grid-row:2; } /* temps */
  .ex-row > :nth-child(7){ grid-column:1; grid-row:3; } /* repos */
  .ex-row > :nth-child(8){ grid-column:4; grid-row:1; } /* supprimer */

  /* Zone iPhone/Android avec encoche ou barre de geste, sous le bouton
     « Démarrer la séance » qui reste collé en bas de l'écran séance. */
  body{ padding-bottom:calc(70px + env(safe-area-inset-bottom, 0px)); }
  .sticky-cta{ padding-bottom:env(safe-area-inset-bottom, 0px); }
}

@media (max-width:480px){
  .week-grid{ grid-template-columns:repeat(3,1fr); }

  /* Cibles séries/répétitions/temps/repos du lecteur : deux par ligne au
     lieu de quatre écrasées, plus lisible pendant l'effort. */
  .player-target .t{ flex:1 1 40%; }

  /* Messagerie : le bouton Envoyer passe sous le champ de texte plutôt
     que de le comprimer sur les très petits écrans. */
  .chat-input-row{ flex-direction:column; }
  .chat-input-row .btn{ width:100%; }

  /* Formulaire « Nouvel exercice » : ajouter un exercice depuis la
     banque passe en pleine largeur sous le menu déroulant. */
  .add-ex-row{ grid-template-columns:1fr; }
  .add-ex-row button{ width:100%; }

  /* Cibles tactiles un peu plus généreuses pour les boutons ronds. */
  .back-btn{ width:40px; height:40px; }
  .notif-bell{ width:40px; height:40px; }

  .cx-form{ padding:18px 16px; }
}


/* ==================================================================
   13. NUTRITION — GÉNÉRATEUR DE MENU (semainier, panneau coach, fiches)
   Ported from the standalone menu generator. Same variable names as the
   rest of the app, so the Power Health palette applies automatically —
   only genuinely new component classes are defined below.
   ================================================================== */

/* ---- panneau de réglages (coach) ---- */
.panel{ max-width:100%; margin:0 auto 26px; background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; box-shadow:var(--shadow-md); }
.panel-sec{ padding:20px 26px; border-bottom:1px solid var(--line2); }
.panel-sec:last-child{ border-bottom:none; }
.sec-head{ display:flex; align-items:center; gap:9px; margin-bottom:15px; }
.sec-num{ width:22px; height:22px; border-radius:7px; background:var(--ember-50); border:1px solid var(--ember-100); color:var(--ember-600); font-size:10.5px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.sec-head h2{ font-size:13px; font-weight:750; letter-spacing:-.2px; }
.sec-head .sec-hint{ font-size:11.5px; color:var(--ink3); font-weight:500; margin-left:2px; }
.hint{ font-size:11px; color:var(--ink3); line-height:1.55; font-weight:500; }

/* Sur la largeur du hub (≈850px, toujours plus étroite que les 1123px de
   la fiche imprimable), les grilles à 4/5/6 colonnes du panneau respirent
   mieux en 2 colonnes — on ne touche pas .g3/.g4 ailleurs dans l'appli. */
.panel .grid.g4, .panel .grid.g5, .panel .grid.g6{ grid-template-columns:repeat(2,1fr); }
.panel .grid.g3{ grid-template-columns:1fr; }

/* curseur déficit calorique */
.deficit-wrap{ display:grid; grid-template-columns:1fr; gap:14px; align-items:center; }
.slider-top{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:7px; }
.slider-top .lbl{ font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--ink3); font-weight:700; }
.slider-top .val{ font-size:15px; font-weight:800; color:var(--ink); font-family:var(--font-mono); }
input[type="range"]{ -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:99px; background:linear-gradient(90deg,var(--lime) 0%,var(--lime) var(--fill,40%),var(--line) var(--fill,40%),var(--line) 100%); cursor:pointer; }
input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; width:19px; height:19px; border-radius:50%; background:var(--dark); border:3px solid #fff; box-shadow:0 1px 5px rgba(20,18,9,.28); cursor:pointer; }
input[type="range"]::-moz-range-thumb{ width:15px; height:15px; border-radius:50%; background:var(--dark); border:3px solid #fff; cursor:pointer; }
.mini-stat{ background:var(--bone-200); border:1px solid var(--line); border-radius:12px; padding:9px 12px; }
.mini-stat .lbl{ font-size:9.5px; text-transform:uppercase; letter-spacing:.45px; color:var(--ink3); font-weight:700; }
.mini-stat .val{ font-size:16px; font-weight:800; margin-top:2px; letter-spacing:-.4px; }
.mini-stat .sub{ font-size:10px; color:var(--ink3); font-weight:500; }
.mini-stat.accent{ background:var(--ember-50); border-color:var(--ember-100); }
.mini-stat.accent .val{ color:var(--ember-600); }
.warn{ font-size:11.5px; color:var(--red); font-weight:700; margin-top:10px; display:flex; align-items:center; gap:6px; }

/* sélecteur d'aliments (intolérances / picker) */
.picker-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:11px; }
.picker-cat{ background:var(--bone-100); border:1.5px solid var(--line); border-radius:13px; padding:10px 12px; }
.picker-cat summary{ cursor:pointer; font-size:12px; font-weight:750; display:flex; justify-content:space-between; align-items:center; list-style:none; gap:8px; }
.picker-cat summary::-webkit-details-marker{ display:none; }
.picker-cat summary::after{ content:"⌄"; color:var(--ink3); font-size:13px; line-height:1; margin-top:-5px; }
.picker-cat[open] summary::after{ content:"⌃"; margin-top:3px; }
.picker-cat.wide{ grid-column:span 2; }
.picker-actions{ font-size:10px; font-weight:600; color:var(--lime-deep); display:flex; gap:8px; margin-left:auto; margin-right:4px; }
.picker-actions a{ cursor:pointer; }
.picker-actions a:hover{ text-decoration:underline; }
.picker-items{ display:flex; flex-direction:column; gap:1px; margin-top:9px; max-height:220px; overflow-y:auto; }
.picker-item{ display:flex; align-items:center; gap:8px; font-size:11px; color:var(--ink2); padding:4px 6px; border-radius:7px; cursor:pointer; font-weight:500; }
.picker-item:hover{ background:var(--bone-200); }
.picker-item input{ accent-color:var(--lime-deep); flex-shrink:0; }
.picker-item .food-name{ flex:1; }
.picker-item .food-kcal{ color:var(--ink3); font-size:9.5px; white-space:nowrap; font-weight:600; font-family:var(--font-mono); }
.picker-item.unchecked .food-name{ color:var(--ink3); text-decoration:line-through; }
.picker-item.locked{ opacity:.4; cursor:not-allowed; }
.picker-item.locked .food-name{ text-decoration:line-through; }

/* ---- fiches semainier / liste de courses (A4 paysage) ---- */
.sheet-wrap{ max-width:100%; margin:0 auto 22px; overflow-x:auto; padding-bottom:4px; }
.sheet{ width:1123px; height:794px; background:var(--bone-50); border-radius:10px; box-shadow:0 2px 6px rgba(20,18,9,.08), 0 20px 50px -20px rgba(20,18,9,.26);
        padding:24px 28px; display:flex; flex-direction:column; gap:12px; overflow:hidden;
        background-image:repeating-linear-gradient(128deg, rgba(87,80,63,.04) 0 1px, transparent 1px 11px); }

.sheet-head{ background:var(--dark); border-radius:14px; padding:0 24px; color:#fff; height:64px; display:flex; justify-content:space-between; align-items:center; flex-shrink:0;
             background-image:radial-gradient(ellipse 260px 160px at 100% 0%, rgba(249,115,22,.30), transparent 70%),
                              repeating-linear-gradient(128deg, rgba(255,255,255,.05) 0 1px, transparent 1px 11px); }
.sheet-head .eyebrow{ font-size:9.5px; letter-spacing:1.6px; text-transform:uppercase; color:var(--lime); font-weight:800; }
.sheet-head h2{ font-size:19px; font-weight:800; letter-spacing:-.4px; margin-top:2px; }
.sheet-head .who{ font-size:11px; color:var(--text-body-dark); font-weight:500; margin-top:2px; }
.sheet-head .badge{ background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); border-radius:11px; padding:8px 16px; text-align:right; }
.sheet-head .badge .t{ font-size:9px; letter-spacing:.8px; text-transform:uppercase; color:var(--text-muted-dark); font-weight:700; }
.sheet-head .badge strong{ display:block; font-size:14px; font-weight:800; margin-top:1px; font-family:var(--font-mono); }
.sheet-head.slim{ height:48px; }
.sheet-head.slim h2{ font-size:15px; }

.summary-bar{ display:flex; gap:11px; flex-shrink:0; }
.stat{ background:var(--bone-200); border:1.5px solid var(--line); border-radius:13px; padding:10px 15px; flex:1; }
.stat .lbl{ font-size:9px; text-transform:uppercase; letter-spacing:.55px; color:var(--ink3); font-weight:800; }
.stat .val{ font-size:21px; font-weight:850; margin-top:3px; letter-spacing:-.8px; line-height:1; }
.stat .sub{ font-size:9.5px; color:var(--ink3); margin-top:3px; font-weight:500; }
.stat.hero{ background:var(--dark); border-color:var(--dark); }
.stat.hero .lbl{ color:var(--text-muted-dark); }
.stat.hero .val{ color:var(--lime); }
.stat.hero .sub{ color:var(--text-muted-dark); }
.macro{ background:var(--bone-200); border:1.5px solid var(--line); border-radius:13px; padding:10px 15px; flex:1.9; }
.macro .lbl{ font-size:9px; text-transform:uppercase; letter-spacing:.55px; color:var(--ink3); font-weight:800; margin-bottom:7px; }
.macro-bar{ height:9px; border-radius:99px; overflow:hidden; display:flex; margin-bottom:8px; background:var(--data-track); }
.macro-seg{ height:100%; }
.macro-legend{ display:flex; gap:16px; flex-wrap:wrap; }
.macro-legend .item{ display:flex; align-items:center; gap:6px; font-size:10.5px; color:var(--ink2); font-weight:600; }
.macro-legend .dot{ width:8px; height:8px; border-radius:99px; flex-shrink:0; }
.macro-legend b{ color:var(--ink); font-weight:800; }
.excl{ background:var(--amber-100); border:1.5px solid #EAD3A0; border-radius:13px; padding:10px 15px; flex:1.15; }
.excl .lbl{ font-size:9px; text-transform:uppercase; letter-spacing:.55px; color:var(--amber); font-weight:800; margin-bottom:5px; }
.excl .list{ font-size:11px; color:#8A5A11; line-height:1.45; font-weight:650; }

/* jours & repas */
.week{ display:flex; gap:10px; flex:1; min-height:0; }
.week.dense .meal{ margin-bottom:5px; }
.week.dense .meal-items{ line-height:1.36; }
.week.dense .day-tip{ font-size:9px; line-height:1.4; padding:6px 2px 0; }
.week.dense .day-body{ padding-top:7px; }
.week.denser .meal{ margin-bottom:4px; }
.week.denser .meal-items{ font-size:9.7px; line-height:1.3; }
.week.denser .meal-kcal{ font-size:8.5px; }
.week.denser .meal-title{ font-size:8.5px; }
.week.denser .day-tip{ display:none; }
.shop.tight .shop-line{ font-size:9.2px; padding:1px 0; }
.shop.tight .shop-cat{ padding:8px 10px; margin-bottom:7px; }
.day{ flex:1; background:var(--bone-50); border:1.5px solid var(--line); border-radius:14px; padding:0 0 9px; display:flex; flex-direction:column; min-width:0; overflow:hidden; }
.day h4{ font-size:11px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:#fff; background:var(--dark); padding:7px 10px; text-align:center; flex-shrink:0; }
.day-body{ padding:9px 10px 0; display:flex; flex-direction:column; flex:1; min-height:0; }
.meal{ padding-left:8px; border-left:2.5px solid var(--line); margin-bottom:8px; }
.meal-head{ display:flex; justify-content:space-between; align-items:center; gap:5px; }
.meal-title{ font-size:9px; text-transform:uppercase; font-weight:850; letter-spacing:.5px; }
.meal-items{ font-size:10.5px; color:var(--ink2); line-height:1.42; margin-top:3px; font-weight:500; }
.meal-items b{ color:var(--ink); font-weight:750; }
.meal-items .eq{ color:var(--ink3); font-weight:500; }
.meal-kcal{ font-size:9px; color:var(--ink3); font-weight:700; margin-top:2px; }
.btn-swap{ background:var(--bone-300); color:var(--ink2); border-radius:6px; font-size:8.5px; font-weight:800; padding:2.5px 7px; cursor:pointer; border:none; line-height:1.3; letter-spacing:.2px; text-transform:uppercase; flex-shrink:0; }
.btn-swap:hover{ background:var(--dark); color:var(--lime); }
.meal.edited .meal-title::after{ content:" ●"; color:var(--lime-deep); font-size:8px; }
.cheat{ background:var(--clay-100); border:1.5px dashed var(--clay-300); border-radius:10px; padding:7px 9px; margin-bottom:8px; }
.cheat .meal-title{ color:var(--clay-500); }
.cheat p{ font-size:9.5px; color:var(--clay-500); line-height:1.4; margin-top:3px; font-weight:500; }
.day-tip{ margin-top:auto; font-size:9.5px; color:var(--ink3); line-height:1.45; font-weight:500; font-style:italic; padding:8px 2px 0; }
.day-total{ padding:8px 10px 0; border-top:1.5px dashed var(--line); font-size:10px; color:var(--ink2); text-align:center; flex-shrink:0; font-weight:600; }
.day-total b{ color:var(--ink); font-size:14px; font-weight:850; letter-spacing:-.3px; }
.day-total .macros{ font-size:9.5px; color:var(--ink3); margin-top:1px; font-weight:600; }
.day-total .gap{ color:var(--red); font-weight:700; font-size:9px; margin-top:1px; }
.day-total .excl-note{ font-size:9px; color:var(--ink3); font-weight:600; }
.day-total .macros .ok{ color:var(--lime-deep); font-weight:800; }
.day-total .macros .off{ color:var(--red); font-weight:800; }

.note{ background:var(--lime-soft); border:1.5px solid var(--lime-line); border-radius:12px; padding:10px 16px; flex-shrink:0; }
.note p{ font-size:10.5px; color:var(--moss-500); line-height:1.5; font-weight:500; }
.note b{ font-weight:800; }
.foot{ text-align:center; font-size:9px; color:var(--ink3); border-top:1px solid var(--line); padding-top:8px; flex-shrink:0; font-weight:500; }

/* liste de courses */
.shop{ column-count:5; column-gap:10px; flex:1; min-height:0; overflow:hidden; }
.shop-cat{ background:var(--bone-50); border:1.5px solid var(--line); border-radius:12px; padding:9px 11px; margin-bottom:9px; break-inside:avoid; -webkit-column-break-inside:avoid; display:inline-block; width:100%; }
.shop-cat h5{ font-size:9px; text-transform:uppercase; letter-spacing:.5px; font-weight:850; color:var(--lime-deep); margin-bottom:6px; padding-bottom:4px; line-height:1.3; border-bottom:1.5px solid var(--lime-line); }
.shop-line{ display:flex; justify-content:space-between; gap:6px; font-size:10px; padding:1.5px 0; line-height:1.35; color:var(--ink2); font-weight:500; }
.shop-line b{ color:var(--ink); font-weight:750; white-space:nowrap; }
.shop-line .raw{ color:var(--lime-deep); }
.shop-line .qty-sub{ font-family:var(--font-sans); font-weight:600; color:var(--ink3); font-size:8.6px; margin-left:1px; }

/* ---- éditeur repas / collation (modales) ---- */
.row{ display:grid; grid-template-columns:78px 1fr 96px 30px; gap:9px; align-items:center; margin-bottom:9px; }
.row .role{ font-size:9px; text-transform:uppercase; letter-spacing:.45px; color:var(--ink3); font-weight:800; }
.row select, .row input{ width:100%; padding:9px 10px; border:1.5px solid var(--line); border-radius:10px; font-size:12.5px; font-weight:600; color:var(--ink); background:var(--bone-50); font-family:inherit; }
.row select:focus, .row input:focus{ outline:none; border-color:var(--dark); }
.row .del{ background:var(--rust-100); color:var(--red); border:none; border-radius:8px; height:32px; cursor:pointer; font-size:14px; font-weight:700; line-height:1; }
.row .del:hover{ background:var(--red); color:#fff; }
.row .unit{ font-size:10.5px; color:var(--ink3); font-weight:600; }
.add-row{ display:grid; grid-template-columns:78px 1fr auto; gap:9px; align-items:center; margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); }
.add-row .role{ font-size:9px; text-transform:uppercase; letter-spacing:.45px; color:var(--ink3); font-weight:800; }
.add-row select{ width:100%; padding:9px 10px; border:1.5px solid var(--line); border-radius:10px; font-size:12.5px; font-weight:600; color:var(--ink); background:var(--bone-50); font-family:inherit; }
.qty{ position:relative; }
.qty input{ padding-right:24px; text-align:right; }
.qty .g{ position:absolute; right:9px; top:50%; transform:translateY(-50%); font-size:11px; color:var(--ink3); font-weight:700; pointer-events:none; }
.kcal-live{ background:var(--dark); color:#fff; border-radius:13px; padding:12px 16px; display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.kcal-live .l{ font-size:10px; text-transform:uppercase; letter-spacing:.6px; color:var(--text-muted-dark); font-weight:800; }
.kcal-live .n{ font-size:22px; font-weight:850; color:var(--lime); letter-spacing:-.6px; line-height:1.1; }
.kcal-live .target{ text-align:right; }
.kcal-live .target .n{ color:#fff; font-size:15px; }
.snack-list{ display:flex; flex-direction:column; gap:6px; }
.snack-opt{ display:flex; align-items:center; gap:11px; padding:11px 13px; border:1.5px solid var(--line); border-radius:12px; cursor:pointer; transition:.12s; }
.snack-opt:hover{ border-color:var(--ink3); background:var(--bone-100); }
.snack-opt.on{ border-color:var(--dark); background:var(--lime-soft); }
.snack-opt input{ accent-color:var(--dark); flex-shrink:0; }
.snack-opt .nm{ flex:1; font-size:12.5px; font-weight:650; }
.snack-opt .dt{ font-size:10.5px; color:var(--ink3); font-weight:600; white-space:nowrap; font-family:var(--font-mono); }
.snack-opt.none .nm{ color:var(--ink2); font-style:italic; }

@media (max-width:760px){
  .panel .grid.g4, .panel .grid.g5, .panel .grid.g6{ grid-template-columns:repeat(2,1fr); }
  .picker-grid{ grid-template-columns:1fr; }
  .picker-cat.wide{ grid-column:span 1; }
  .summary-bar{ flex-wrap:wrap; }
  .row{ grid-template-columns:1fr 1fr; row-gap:6px; }
  .row .role{ grid-column:1 / -1; }
  .add-row{ grid-template-columns:1fr; row-gap:8px; }
}

/* ============ IMPRESSION DES FICHES NUTRITION ============ */
@media print{
  body{ background:#fff; padding:0; }
  .panel, .appbar, .overlay, .no-print, .hub-wrap > .screen-head, .sect-head{ display:none !important; }
  .sheet-wrap{ max-width:none; margin:0; page-break-after:always; overflow:visible; }
  .sheet-wrap:last-child{ page-break-after:auto; }
  .sheet{ box-shadow:none; border-radius:0; margin:0; width:100%; height:100vh; }
  @page{ size:A4 landscape; margin:0; }
}

/* ==================================================================
   15. SUIVI SPORTIF (client) — tuiles chiffrées & graphique d'évolution
   ================================================================== */
.kpi-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(146px,1fr)); gap:10px; margin-bottom:20px; }
.kpi-tile{ background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:16px 15px; }
.kpi-tile .l{ font-size:9.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--ink3); font-weight:800; }
.kpi-tile .v{ font-size:23px; font-weight:850; color:var(--ink); margin-top:7px; letter-spacing:-.5px; line-height:1; }
.kpi-tile .v small{ font-size:12px; font-weight:700; color:var(--ink3); margin-left:2px; }
.kpi-tile .kpi-sub-note{ font-size:10.5px; color:var(--ink3); font-weight:600; margin-top:5px; }
.kpi-tile.accent{ background:var(--dark); border-color:var(--dark); }
.kpi-tile.accent .l{ color:var(--text-muted-dark); }
.kpi-tile.accent .v{ color:var(--lime); }
.kpi-tile.accent .v small{ color:var(--text-muted-dark); }
.kpi-tile.accent .kpi-sub-note{ color:var(--text-soft-dark); }
.kpi-tile.clickable{ cursor:pointer; transition:.12s; }
.kpi-tile.clickable:hover{ border-color:var(--ink3); transform:translateY(-1px); }
.kpi-tile.accent.clickable:hover{ border-color:var(--lime); }

.weighin-card{ cursor:default; }
.weighin-card:hover{ border-color:var(--line); }
.weighin-row{ display:flex; gap:10px; align-items:center; }
.weighin-row input{ flex:1; max-width:140px; padding:10px 12px; border:1.5px solid var(--line); border-radius:10px; font-size:15px; font-weight:700; font-family:var(--font-mono); text-align:center; background:var(--bone-50); }
.weighin-row input:focus{ outline:none; border-color:var(--lime-deep); }

.stats-chart-card{ background:var(--card); border:1.5px solid var(--line); border-radius:20px; padding:20px 22px; margin-bottom:20px; }
.stats-chart-card h4{ font-size:14.5px; font-weight:800; letter-spacing:-.2px; }
.stats-chart-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:6px; flex-wrap:wrap; }
.stats-chart-head .hint{ margin-top:4px; max-width:360px; }
.stats-chart-head select{ padding:8px 12px; border-radius:10px; border:1.5px solid var(--line); font-size:12px; font-weight:700; font-family:inherit; background:var(--bone-50); color:var(--ink); cursor:pointer; flex-shrink:0; }
.chart-wrap{ position:relative; margin-top:14px; }
.chart-tooltip{ position:absolute; pointer-events:none; background:var(--dark); color:#fff; padding:7px 11px; border-radius:10px; font-size:11px; font-weight:650; box-shadow:var(--shadow-md); transform:translate(-50%,-125%); white-space:nowrap; display:none; z-index:5; }
.chart-tooltip span{ display:block; color:var(--text-muted-dark); font-size:9.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; }
.chart-tooltip b{ display:block; font-family:var(--font-mono); font-variant-numeric:tabular-nums; font-size:13px; margin-top:1px; }
.chart-table-toggle{ font-size:11px; font-weight:700; color:var(--lime-deep); cursor:pointer; margin-top:12px; display:inline-block; }
.chart-table{ width:100%; border-collapse:collapse; margin-top:10px; font-size:11.5px; }
.chart-table th{ text-align:left; font-size:9.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--ink3); font-weight:800; padding:6px 4px; border-bottom:1.5px solid var(--line2); }
.chart-table td{ padding:7px 4px; border-bottom:1px solid var(--line2); color:var(--ink2); font-weight:600; }
.chart-table td:last-child{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; color:var(--ink); font-weight:750; }

@media (max-width:480px){
  .kpi-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ============ RECORDS PERSONNELS (client & coach) ============ */
.rec-group{ margin-bottom:22px; }
.rec-group h4{ font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.4px; margin-bottom:8px; }
.rec-row{ display:flex; align-items:center; gap:12px; background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:11px 14px; margin-bottom:7px; transition:.12s; }
.rec-row.clickable{ cursor:pointer; }
.rec-row.clickable:hover{ border-color:var(--ink3); transform:translateY(-1px); }
.rec-dot{ width:9px; height:9px; border-radius:99px; flex-shrink:0; }
.rec-info{ flex:1; min-width:0; }
.rec-name{ font-size:12.5px; font-weight:750; color:var(--ink); }
.rec-meta{ font-size:10.5px; color:var(--ink3); font-weight:600; margin-top:2px; }
.rec-v{ font-size:16px; font-weight:850; color:var(--ink); font-family:var(--font-mono); text-align:right; flex-shrink:0; }
.rec-v small{ font-size:10px; font-weight:700; color:var(--ink3); }
.rec-v.muted{ color:var(--ink3); }
.rec-sub{ font-size:9.5px; color:var(--ink3); font-weight:600; text-align:right; margin-top:1px; flex-shrink:0; white-space:nowrap; }

/* ============ HISTORIQUE DES SÉANCES (client & coach) ============ */
.hist-list{ display:flex; flex-direction:column; gap:8px; }
.hist-row{ display:flex; align-items:center; gap:14px; background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:12px 16px; cursor:pointer; transition:.12s; }
.hist-row:hover{ border-color:var(--ink3); transform:translateY(-1px); }
.hist-date{ width:42px; text-align:center; flex-shrink:0; }
.hist-date .dn{ font-size:17px; font-weight:850; font-family:var(--font-mono); line-height:1; }
.hist-date .mo{ font-size:9.5px; text-transform:uppercase; color:var(--ink3); font-weight:800; margin-top:2px; }
.hist-info{ flex:1; min-width:0; }
.hist-info .nm{ font-size:13px; font-weight:750; }
.hist-info .meta{ font-size:11px; color:var(--ink3); font-weight:600; margin-top:2px; }
.hist-row .chev{ font-size:18px; color:var(--ink3); flex-shrink:0; }

/* ============ COMPTE RENDU DE SÉANCE (client & coach) ============ */
.report-section{ margin-bottom:22px; }
.report-section h4{ font-size:13px; font-weight:850; margin-bottom:10px; }
.report-borg{ display:flex; align-items:center; gap:14px; background:var(--card); border:1.5px solid var(--line); border-left-width:4px; border-radius:14px; padding:14px 16px; }
.report-borg .v{ font-size:26px; font-weight:900; font-family:var(--font-mono); flex-shrink:0; min-width:36px; text-align:center; }
.report-borg .l{ font-size:13px; font-weight:800; color:var(--ink); }
.report-borg .c{ font-size:12px; color:var(--ink3); font-weight:500; margin-top:3px; font-style:italic; }
.report-ex-row{ display:flex; align-items:flex-start; gap:12px; background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:12px 14px; margin-bottom:7px; }
.report-ex-row .rec-dot{ margin-top:5px; }
.report-fb{ font-size:11.5px; color:var(--ink2); font-weight:600; margin-top:5px; }