/* Thème sombre (par défaut) : variables de la maquette v3 */
:root{
  --page:#050505; --fond:#0b0b0a; --carte:#141413; --carte2:#1b1b19; --bord:#262624;
  --texte:#f2f2ee; --doux:#8d8d86;
  --vert:#00c46a; --vert-t:#00c46a; --vert-fonce:#0b3b27; --sur-vert:#04170e;
  --violet:#a755f6; --violet-t:#a755f6; --violet-teinte:#2a1c47; --sur-violet:#150628;
  --orange:#f59e0b; --orange-t:#f59e0b; --rouge-t:#ef4444;
  --stats:linear-gradient(#0f2a1e,#0c1f17); --stats-bord:#17432f;
  --circuit:linear-gradient(#1a1230,#120d22); --circuit-bord:#3a2766;
  --serie:linear-gradient(#2a1c0a,#1a1208); --serie-bord:#5a3a10;
  --cour:#0d2a1d; --nav:#10100f; --coche:#3a3a37; --piste:#222;
  --tiret-v:#1a6b47; --tiret-vio:#6c3aa6;
  --ico-bg:#22304a; --ico:#7aa7ff; --ico-o-bg:#3a2d12;
  --ombre:0 20px 60px #000a; --hors-mois:#555;
  --mannequin:#d6d6cf; --decor:#4a4a45; --tuile:#1f1f1d;
  --voile:#000a; /* ajout hors maquette : voile derrière la feuille du bas */
  color-scheme:dark;
}
/* Thème clair : variables de la maquette v3 */
:root[data-theme="clair"]{
  --page:#e7e5dd; --fond:#f6f5f0; --carte:#ffffff; --carte2:#efeee8; --bord:#dcdad1;
  --texte:#171715; --doux:#66655e;
  --vert:#00c46a; --vert-t:#007a43; --vert-fonce:#d6f3e3; --sur-vert:#04170e;
  --violet:#a755f6; --violet-t:#7630d6; --violet-teinte:#efe5fe; --sur-violet:#150628;
  --orange:#f59e0b; --orange-t:#a25a00; --rouge-t:#cf2a2a;
  --stats:linear-gradient(#e2f6ec,#d8f1e4); --stats-bord:#b4e2ca;
  --circuit:linear-gradient(#f4ecff,#ece0fd); --circuit-bord:#d2bcf5;
  --serie:linear-gradient(#fdf2dd,#fbe9c6); --serie-bord:#edcd92;
  --cour:#e2f6ec; --nav:#ffffff; --coche:#c6c4bb; --piste:#e4e2da;
  --tiret-v:#6fcfa2; --tiret-vio:#b991f2;
  --ico-bg:#dfe9fb; --ico:#2f62c9; --ico-o-bg:#fbe9c6;
  --ombre:0 18px 44px #5a55401f; --hors-mois:#b7b5ac;
  --mannequin:#2e2e2b; --decor:#b9b7ad; --tuile:#eceae3;
  --voile:#17171566;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
html,body{background:var(--fond);color:var(--texte);font:16px/1.4 system-ui,'DM Sans',sans-serif}
body{padding:env(safe-area-inset-top) 0 0}
#app{max-width:560px;margin:0 auto;padding:18px 16px 120px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea{font:inherit;color:inherit}
h1{font:700 40px/1 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:.3px}
.etiq{font:500 11px ui-monospace,monospace;color:var(--vert-t);letter-spacing:1.5px;display:flex;align-items:center;gap:6px;margin-bottom:4px}
.etiq:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--vert)}
.doux{color:var(--doux);font-size:13px}
.mono{font-family:ui-monospace,monospace}
.rangee{display:flex;gap:10px;align-items:center}
.espace{justify-content:space-between}
.btn{display:block;width:100%;border-radius:16px;padding:14px;font-weight:700;text-align:center}
.btn.vert{background:var(--vert);color:var(--sur-vert)}
.btn.neutre{background:var(--carte);border:1px solid var(--bord)}
.btn.danger{color:var(--rouge-t)}
.btn[disabled]{opacity:.35}
.carte{background:var(--carte);border:1px solid var(--bord);border-radius:18px;padding:14px;margin-top:10px}
.carte.serie{background:var(--serie);border-color:var(--serie-bord)}
.titre-carte{font:700 22px/1.1 'Barlow Condensed','Arial Narrow',sans-serif}
.pointill{border:2px dashed var(--tiret-v);color:var(--vert-t);border-radius:16px;padding:12px;text-align:center;font-weight:700;width:100%}
.pointill.v{border-color:var(--tiret-vio);color:var(--violet-t)}
.pastille{display:inline-block;border-radius:8px;padding:2px 8px;font:500 11px ui-monospace,monospace;background:var(--violet-teinte);color:var(--violet-t)}
.pastille.n{background:var(--carte2);color:var(--doux)}
#nav{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));display:flex;gap:6px;background:var(--nav);border:1px solid var(--bord);border-radius:26px;padding:6px;z-index:5;box-shadow:var(--ombre)}
#nav button{padding:10px 18px;border-radius:20px;font-size:14px;color:var(--doux)}
#nav button.on{background:var(--vert-fonce);color:var(--vert-t);font-weight:700}
body.plein #nav{display:none}
/* séances */
.ligne{display:flex;gap:10px;margin-top:14px}
.ligne>*{flex:1}
.seance .exos{color:var(--doux);font-size:14px;margin:6px 0 12px}
/* direct */
.stats{display:grid;grid-template-columns:repeat(3,1fr);background:var(--stats);border:1px solid var(--stats-bord);border-radius:16px;margin-top:12px}
.stats div{padding:10px 6px;text-align:center}
.stats b{display:block;font:700 28px/1.1 'Barlow Condensed','Arial Narrow',sans-serif}
.stats b span{font-size:14px;color:var(--doux)}
.stats small{font:500 10px ui-monospace,monospace;color:var(--doux);letter-spacing:1px}
table{width:100%;border-collapse:collapse;margin-top:8px}
th{font:500 10px ui-monospace,monospace;color:var(--doux);letter-spacing:1px;padding:6px 4px;text-align:left}
td{padding:6px 4px;border-top:1px solid var(--bord)}
tr.fait td{opacity:.55}
td input{width:100%;background:var(--carte2);border:1px solid var(--bord);border-radius:10px;padding:8px;text-align:center;font-size:16px}
.coche{width:34px;height:34px;border:2px solid var(--coche);border-radius:10px;display:grid;place-items:center}
.coche.ok{background:var(--vert);border-color:var(--vert);color:var(--sur-vert);font-weight:700}
.repos{position:sticky;top:8px;z-index:4;background:var(--serie);border:1px solid var(--serie-bord);border-radius:16px;padding:10px 14px;margin-top:10px}
.repos b{font:700 28px 'Barlow Condensed','Arial Narrow',sans-serif;color:var(--orange-t)}
.mini{background:var(--carte2);border:1px solid var(--bord);border-radius:10px;padding:6px 12px;font-size:13px}
/* calendrier */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;margin-top:10px}
.cal button,.cal span{padding:9px 0;border-radius:10px}
.cal .ent{font:500 11px ui-monospace,monospace;color:var(--doux)}
.cal .j{background:var(--vert-fonce);color:var(--vert-t);font-weight:700}
.cal .auj{border:1px solid var(--vert-t)}
.cal .sel{outline:2px solid var(--violet)}
.cal .gris{color:var(--hors-mois)}
.compt{flex:1;text-align:center}
.compt b{font:700 30px 'Barlow Condensed','Arial Narrow',sans-serif;display:block}
.barre{height:8px;border-radius:5px;background:var(--piste);margin-top:10px;overflow:hidden}
.barre b{display:block;height:100%;background:var(--orange)}
.trace{stroke:var(--vert-t);fill:none;stroke-width:3}
.points{fill:var(--vert-t)}
/* réglages */
.bascule{display:inline-flex;gap:4px;background:var(--carte2);border:1px solid var(--bord);border-radius:14px;padding:4px}
.bascule button{font-weight:700;font-size:13px;border-radius:10px;padding:8px 12px;color:var(--doux)}
.bascule button.on{background:var(--vert);color:var(--sur-vert)}
/* feuille */
#feuille{position:fixed;inset:0;background:var(--voile);z-index:20;display:flex;align-items:flex-end;justify-content:center}
#feuille[hidden]{display:none}
.panneau{background:var(--fond);border:1px solid var(--bord);border-radius:26px 26px 0 0;width:100%;max-width:560px;max-height:88vh;overflow:auto;padding:16px}
.panneau input[type=search],.panneau input[type=text]{width:100%;background:var(--carte);border:1px solid var(--bord);border-radius:14px;padding:12px;margin:10px 0}
.choix{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--bord);border-radius:14px;margin-top:8px;background:var(--carte);width:100%;text-align:left}
.choix.on{border-color:var(--vert)}
.vide{text-align:center;color:var(--doux);padding:30px 10px}
/* bibliothèque d'exercices */
.champ-rech{width:100%;background:var(--carte);border:1px solid var(--bord);border-radius:14px;padding:11px 14px;margin-top:12px}
.champ-rech::placeholder,.note-perso::placeholder{color:var(--doux)}
.puces{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.puce{border:1px solid var(--bord);background:var(--carte);border-radius:12px;padding:7px 11px;font-size:13px;font-weight:500;white-space:nowrap}
.puce.on{background:var(--vert-fonce);border-color:var(--vert-fonce);color:var(--vert-t);font-weight:700}
.ligne-exo{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--bord);width:100%;text-align:left}
.ligne-exo:first-child{border-top:0}
.ligne-exo b{display:block;font-size:14.5px;line-height:1.2}
.tuile{flex:none;width:42px;height:42px;border-radius:12px;background:var(--tuile);color:var(--doux);display:grid;place-items:center;font:700 17px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:.5px}
.tuile.grande{width:72px;height:72px;border-radius:18px;font-size:30px}
.marques{display:flex;gap:5px;margin-top:4px;flex-wrap:wrap}
.etoile{color:var(--orange-t)}
/* fiche d'exercice */
.haut-fiche button{font-size:22px;padding:2px 6px}
.illus{background:var(--carte);border:1px solid var(--bord);border-radius:18px;display:grid;place-items:center;height:210px;margin-top:10px}
/* mannequin (mannequin.js) : le moteur ne met aucune couleur, tout vient des variables du thème */
.reel .p{fill:var(--mannequin);stroke:var(--carte);stroke-width:1.6;stroke-linejoin:round}
.reel .m{fill:var(--vert);stroke:var(--carte);stroke-width:1.2}
.reel .d{fill:var(--decor)}
.reel .c{fill:var(--doux);stroke:var(--carte);stroke-width:1.6}
.illus .reel{display:block}
.tuile{--carte:var(--tuile);overflow:hidden}
.tuile .reel{width:100%;height:100%;display:block}
.nom-fiche{font:700 25px/1.05 'Barlow Condensed','Arial Narrow',sans-serif;margin-top:12px}
.onglets{display:flex;gap:6px;margin-top:12px}
.onglets button{flex:1;text-align:center;padding:9px 6px;border-radius:12px;background:var(--carte);border:1px solid var(--bord);font-weight:600;font-size:14px}
.onglets button.on{background:var(--vert);color:var(--sur-vert);border-color:var(--vert)}
.lab{font:500 10px ui-monospace,monospace;color:var(--doux);letter-spacing:1.4px;margin-top:14px}
.carre-vert{width:12px;height:12px;border-radius:4px;background:var(--vert)}
.note-perso{display:block;width:100%;min-height:90px;resize:vertical;background:var(--carte);border:1px solid var(--bord);border-radius:14px;padding:12px;margin-top:6px;font-size:14px;line-height:1.5}
.passage{padding:10px 0;border-top:1px solid var(--bord)}
.passage:first-child{border-top:0}
.pied{position:fixed;left:0;right:0;bottom:0;z-index:5;background:var(--fond);border-top:1px solid var(--bord);padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
.pied .rangee{max-width:528px;margin:0 auto}
.pied .btn.neutre{flex:1}
.pied .btn.vert{flex:2}
/* silhouette du muscle ciblé (silhouette.js) */
.silh .corps-n{fill:var(--bord)}
.silh [data-m]{fill:var(--coche);stroke:var(--carte);stroke-width:1.3;stroke-linejoin:round}
.silh [data-m].on{fill:var(--vert)}
.duo{display:flex;justify-content:space-around;background:var(--carte);border:1px solid var(--bord);border-radius:18px;padding:12px 6px 8px;margin-top:8px}
.duo figure{margin:0;text-align:center}
.duo figcaption{font:500 10px ui-monospace,monospace;color:var(--doux);letter-spacing:1.4px;margin-top:2px}
.coeur{color:var(--rouge-t);font-size:15px;line-height:1}
/* records par répétitions */
.prs{margin-top:0}
.prs td{padding:7px 2px;font-size:14px}
.prs tr:first-child td{border-top:0}
.prs td:first-child{font:500 12px ui-monospace,monospace;color:var(--doux);width:54px}
.prs td:nth-child(2){font:700 18px 'Barlow Condensed','Arial Narrow',sans-serif}
.prs td:last-child{text-align:right;color:var(--doux);font-size:12px}
/* Repère : des variantes de composants existants, aucun nouveau */
/* l'étiquette à point (.etiq) dans trois autres couleurs du thème */
.etiq.o{color:var(--orange-t)}
.etiq.o:before{background:var(--orange)}
.etiq.r{color:var(--rouge-t)}
.etiq.r:before{background:var(--rouge-t)}
.etiq.n{color:var(--doux)}
.etiq.n:before{background:var(--coche)}
.rangee>.etiq{margin:0;flex:none}
/* le champ de la recherche (.champ-rech), sur le fond des cases KG / REPS parce qu'il est posé dans une carte */
.champ{display:block;width:100%;background:var(--carte2);border:1px solid var(--bord);border-radius:14px;padding:11px 14px;margin-top:6px}
.champ::placeholder{color:var(--doux);font-family:system-ui,'DM Sans',sans-serif}
/* la petite ligne d'état du bilan : texte .doux précédé du point de .etiq (vert envoyé, orange en attente, rouge refusé, gris envoi en route) */
.envoi{display:flex;align-items:center;gap:6px;color:var(--doux);font-size:13px;margin-top:5px}
.envoi:before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--vert)}
.envoi.o:before{background:var(--orange)}
.envoi.o b{color:var(--orange-t);font-weight:500}
.envoi.r:before{background:var(--rouge-t)}
.envoi.r b{color:var(--rouge-t);font-weight:500}
.envoi.n:before{background:var(--coche)}