:root{
  --bg:#EEE9E1; --card:#FFFDFA; --ink:#1C1A15; --muted:#958E83;
  --green:#2E6B4B; --green-soft:#E4EFE8; --clay:#DA6A45; --clay-soft:#FAE7DD;
  --gold:#C28A2A; --track:#ECE7DE; --shadow:0 16px 38px rgba(46,40,30,.09);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{background:var(--bg);overflow-x:hidden;overscroll-behavior:none}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  background:var(--bg);color:var(--ink);
  max-width:480px;margin:0 auto;position:relative;min-height:100vh;min-height:100dvh;
  overflow-x:hidden;overscroll-behavior-x:none;
}
/* le curseur "main" sur tout ce qui est cliquable */
.pp,[data-overlay],[data-route],[data-sortie-open],[data-back],[data-tour],[data-feedback],.chgcity,.chg,.sec a,.tagpill{cursor:pointer}

/* (les styles « ordinateur » sont placés tout en bas du fichier pour gagner dans la cascade CSS) */
.aura{position:fixed;top:-140px;left:50%;transform:translateX(-50%);width:min(520px,100%);max-width:100%;height:420px;z-index:0;filter:blur(64px);opacity:.8;pointer-events:none;
  background:radial-gradient(circle at 26% 46%,#BFE6C2,transparent 55%),radial-gradient(circle at 70% 32%,#FAD7BE,transparent 55%),radial-gradient(circle at 50% 66%,#F6E7B8,transparent 52%),radial-gradient(circle at 88% 60%,#F2C3A6,transparent 55%)}

.view{position:relative;z-index:1;padding:max(18px,env(safe-area-inset-top)) 20px calc(96px + env(safe-area-inset-bottom));min-height:100vh}

/* En-tête */
.head{display:flex;align-items:center;justify-content:space-between;padding-top:8px}
.wordmark{font-size:17.5px;font-weight:900;letter-spacing:.01em;color:var(--gold);line-height:1.1}
.pp{flex:none;width:46px;height:46px;border-radius:50%;background:linear-gradient(140deg,#3E8A5F,#E0895E);color:#fff;font-weight:850;font-size:16px;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 5px 12px rgba(0,0,0,.12);overflow:hidden;background-size:cover;background-position:center}
.pp.hasimg{color:transparent}
.greet{font-size:13px;color:#6f6a5f;font-weight:700;margin:16px 2px 18px}
.hi{font-size:13px;color:#6f6a5f;font-weight:700;line-height:1.2}
.hi b{display:block;font-size:23px;color:var(--ink);font-weight:850;margin-top:3px;letter-spacing:-.02em}
.greet b{display:block;font-size:24px;color:var(--ink);font-weight:850;letter-spacing:-.02em;margin-top:3px}
.ptitle{margin:8px 2px 4px}.ptitle .k{font-size:13px;color:#6f6a5f;font-weight:700}.ptitle h1{font-size:28px;font-weight:850;letter-spacing:-.025em;margin-top:2px}

.card{background:var(--card);border-radius:26px;padding:20px;box-shadow:var(--shadow);margin-bottom:16px}
.sec{display:flex;align-items:center;justify-content:space-between;margin:24px 4px 12px}
.sec h3{font-size:18px;font-weight:850;letter-spacing:-.02em}
.sec a{font-size:13px;color:var(--clay);font-weight:800;text-decoration:none;cursor:pointer}

/* Objectif / trajet */
.chip{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--green);background:var(--green-soft);padding:6px 12px;border-radius:99px}
.jtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.jdest{font-size:13px;color:var(--muted);font-weight:700}
.card h2{font-size:22px;font-weight:850;letter-spacing:-.02em;margin:8px 0 14px}
.trail{position:relative;height:74px;margin:2px 0 4px}
.trail svg{width:100%;height:100%;display:block}
.turtle-pos{position:absolute;top:34%;transform:translate(-50%,-50%);font-size:24px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.18));transition:left .4s}
.pts{display:flex;justify-content:space-between;align-items:center;margin:2px 2px 6px}
.pts span{font-size:12px;color:var(--muted);font-weight:800}
.pts .now{color:var(--clay);font-weight:850}
/* v233 : la bulle « on est ici » qui suit la tortue du défi (maquette B validée le 02/10) */
.turtle-bulle{position:absolute;top:50px;transform:translateX(-50%);font-size:10.5px;font-weight:850;color:#fff;background:var(--green);border-radius:8px;padding:2px 8px;white-space:nowrap;transition:left .4s}
.turtle-bulle:before{content:"";position:absolute;top:-4px;left:50%;margin-left:-4px;border:4px solid transparent;border-top:0;border-bottom-color:var(--green)}
.bar{height:9px;background:var(--track);border-radius:99px;position:relative;overflow:hidden}
.bar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#E6B083,var(--clay))}
.jnums{display:flex;align-items:baseline;gap:10px;margin-top:13px}
.jnums .big{font-size:34px;font-weight:850;letter-spacing:-.03em}.jnums .of{font-size:14px;color:var(--muted);font-weight:800}
.jnote{font-size:13.5px;color:var(--clay);font-weight:800;margin-top:6px}
.mine{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:13px 16px;background:var(--green-soft);border-radius:16px}
.mine .md{font-size:13px;color:var(--green);font-weight:800}.mine .mk{font-size:16px;font-weight:850}
/* v95 : rappel discret du mois précédent — le 1er du mois, le compteur repart à zéro et on
   avait l'impression d'avoir tout perdu. Volontairement plus petit et gris : c'est un souvenir,
   pas la ligne principale. */
.mine.prev{margin-top:6px;padding:9px 16px;background:#F4F1EA}
.mine.prev .md{font-size:12px;color:var(--muted);font-weight:750}
.mine.prev .mk{font-size:13.5px;font-weight:800;color:var(--muted)}

/* News */
.news{background:var(--card);border-radius:22px;padding:16px;box-shadow:var(--shadow);margin-bottom:13px}
.news-h{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.av{width:40px;height:40px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:850;color:#6E7A5E;background:#EDEBE2;border:1px solid #E4E1D6}
.av.coach{background:linear-gradient(140deg,#3E8A5F,#E0895E);color:#fff;border:none}
.news-who{font-size:14px;font-weight:850}.news-who span{display:block;font-size:11px;color:var(--muted);font-weight:700;margin-top:1px}
.tagpill{margin-left:auto;font-size:10px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:var(--green);background:var(--green-soft);padding:4px 9px;border-radius:99px}
.news-txt{font-size:14px;font-weight:600;line-height:1.45}
.news-foot{display:flex;gap:16px;margin-top:12px}.nf{font-size:12.5px;font-weight:800;color:var(--muted)}.nf.heart{color:var(--clay)}

/* Journal de ressenti */
.prompt{border:1.5px solid #F4D5C6;background:linear-gradient(160deg,#FFF6F0,#FCEDE4)}
.prompt .lab{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--clay)}
.prompt h3{font-size:18px;font-weight:850;letter-spacing:-.02em;margin:8px 0 3px}
.prompt .subp{font-size:12.5px;color:var(--muted);font-weight:700;margin-bottom:16px}
.moods{display:flex;gap:10px}
.mood{flex:1;text-align:center;background:#fff;border:1.5px solid var(--track);border-radius:16px;padding:13px 6px;cursor:pointer;transition:.12s}
.mood:active{transform:scale(.96)}
.mood.on{border-color:var(--clay);background:var(--clay-soft)}
.mood .e{font-size:26px}.mood .m{font-size:11px;font-weight:800;margin-top:6px;color:#5f5a51}
.ct2{font-size:12.5px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:13px}
.ring-row{display:flex;align-items:center;gap:20px}
.donut{width:120px;height:120px;border-radius:50%;flex:none;position:relative}
.donut:after{content:"";position:absolute;inset:21px;background:#fff;border-radius:50%}
.donut .c{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:36px;z-index:2}
.keys{flex:1}.key{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;padding:4px 0}
.key i{width:11px;height:11px;border-radius:3px}.key span{margin-left:auto;color:var(--muted)}
.ringnote{font-size:13px;font-weight:800;color:var(--green);margin-top:14px}
.jentry{display:flex;align-items:center;gap:14px;padding:14px 2px;border-bottom:1px solid #F0ECE4}
.jentry:last-child{border-bottom:none}
.jem{width:44px;height:44px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--green-soft)}
.jet{flex:1;min-width:0}.jet b{font-size:14.5px;font-weight:800;display:block}.jet .meta{font-size:11.5px;color:var(--muted);font-weight:700}.jet .note{font-size:12.5px;color:#6f6a5f;font-weight:600;font-style:italic;margin-top:3px}
.jkm{font-size:12px;color:var(--muted);font-weight:800;background:var(--track);padding:5px 10px;border-radius:99px;white-space:nowrap}
.empty{text-align:center;color:var(--muted);font-weight:700;font-size:13.5px;padding:24px 10px;line-height:1.5}

.soon{text-align:center;color:var(--muted);font-weight:700;font-size:15px;padding:60px 20px;line-height:1.6}
.soon .e{font-size:42px;display:block;margin-bottom:14px}

/* Team — stats */
.stats{display:flex;justify-content:space-around;text-align:center;padding:18px 12px}
.stat b{display:block;font-size:26px;font-weight:850;letter-spacing:-.02em}
.stat span{font-size:11.5px;color:var(--muted);font-weight:800;margin-top:2px}

/* Team — sorties collectives */
.ccard{background:var(--card);border-radius:22px;padding:18px;box-shadow:var(--shadow);margin-bottom:14px}
.cc-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:9px}
.cc-h h3{font-size:16.5px;font-weight:850;letter-spacing:-.02em;line-height:1.25}
.ins{flex:none;font-size:11px;font-weight:850;color:var(--green);background:var(--green-soft);padding:5px 10px;border-radius:99px}
.cc-meta{font-size:13px;color:#6f6a5f;font-weight:700;margin-top:3px}
.cc-pills{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 14px}
.pill{font-size:11.5px;font-weight:800;color:#5f5a51;background:var(--track);padding:6px 11px;border-radius:99px}
.pill.people{color:var(--clay);background:var(--clay-soft)}
.cempty{text-align:center;color:var(--muted);font-weight:700;font-size:13px;padding:16px}

/* Team — carte */
.mapcard{padding:0;overflow:hidden}
#map{height:300px;width:100%;background:#E8EDE6}
.mapoff{height:100%;display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:700;font-size:13.5px;text-align:center;padding:20px}

/* v207 : aucune tortue à moins de 7 km — l'encadré sous la carte */
.seulecarte{background:#FFF7E8;border:1.5px solid #EFD9A6;border-radius:14px;padding:13px 14px;margin:-4px 0 12px}
.seulecarte b{display:block;font-size:13.5px;font-weight:850;line-height:1.4}
.seulecarte span{display:block;font-size:12px;color:#8A7A55;font-weight:650;line-height:1.5;margin-top:4px}
.seulecarte button{width:100%;margin-top:11px;background:var(--green);color:#fff;border:none;border-radius:11px;padding:11px;font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.pin{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:17px;background:#fff;border-radius:50%;box-shadow:0 3px 8px rgba(0,0,0,.25);border:2px solid var(--green)}
.pin.coach{border-color:var(--clay);background:var(--clay-soft)}
.mchips{display:flex;flex-wrap:wrap;gap:7px;padding:14px}
.mchip{font-size:11.5px;font-weight:800;color:#5f5a51;background:var(--track);padding:6px 11px;border-radius:99px}
.mchip.coach{color:var(--clay);background:var(--clay-soft)}
.pin.water{border-color:#5BA3C9;background:#E4F0F6}

/* Hints communs */
.hint{font-size:12.5px;color:#6f6a5f;font-weight:700;margin:-4px 4px 12px;line-height:1.4}
.subk{font-size:13px;color:#6f6a5f;font-weight:700;margin:10px 2px 4px}

/* Défis collectifs */
.dcard .d-h{display:flex;align-items:center;gap:13px;margin-bottom:13px}
.d-em{font-size:30px;flex:none}
.d-t h3{font-size:16px;font-weight:850;letter-spacing:-.02em}
.d-t span{font-size:12.5px;color:var(--muted);font-weight:700}
.d-nums{font-size:13px;font-weight:800;color:#5f5a51;margin-top:10px}
.d-nums b{color:var(--ink);font-size:15px}
.d-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px;gap:10px}
.d-meta{font-size:12px;color:var(--muted);font-weight:700}
.defi-btn{flex:none;border:none;font-family:inherit;font-weight:850;font-size:13px;padding:10px 16px;border-radius:12px;cursor:pointer;background:var(--clay);color:#fff}
.defi-btn.on{background:var(--green-soft);color:var(--green)}

/* Défis perso */
.pcard .p-h{display:flex;align-items:center;gap:13px;margin-bottom:14px}
.p-em{font-size:26px;flex:none}
.p-t h3{font-size:15px;font-weight:850;letter-spacing:-.02em}
.p-t span{font-size:12px;color:var(--muted);font-weight:700}
.pcard.done{background:linear-gradient(160deg,#EAF4EC,#E0EFE5)}
.p-dots{display:flex;gap:8px;margin-bottom:14px}
.p-dots i{flex:1;height:9px;border-radius:99px;background:var(--track)}
.p-dots i.f{background:linear-gradient(90deg,#7FB894,var(--green))}
.p-foot{display:flex;align-items:center;justify-content:space-between}
.p-count{font-size:13px;font-weight:850;color:#5f5a51}
.p-acts{display:flex;gap:8px}
.perso-plus{border:none;font-family:inherit;font-weight:850;font-size:14px;width:46px;height:38px;border-radius:12px;cursor:pointer;background:var(--green);color:#fff}
.perso-plus:disabled{opacity:.4;cursor:default}
.perso-reset{border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:12.5px;padding:0 12px;border-radius:12px;cursor:pointer;color:var(--muted)}

/* Events */
.ecard .e-h{display:flex;align-items:center;gap:13px;margin-bottom:11px}
.e-em{font-size:30px;flex:none}
.e-t h3{font-size:16px;font-weight:850;letter-spacing:-.02em;line-height:1.25}
.e-prix{font-size:12.5px;font-weight:800;color:var(--clay)}
.e-prix.fem{color:#B5532F}
.e-desc{font-size:13.5px;font-weight:600;line-height:1.45;color:#4f4a42;margin-bottom:14px}
.e-lab{font-size:11.5px;font-weight:850;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:9px}
.days{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.day{text-align:left;border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:13.5px;padding:12px 14px;border-radius:13px;cursor:pointer;color:#5f5a51}
.day.on{border-color:var(--clay);background:var(--clay-soft);color:#B5532F}
.resa-btn{display:block;width:100%;text-align:center;text-decoration:none;border:none;font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:13px;cursor:pointer;background:var(--green);color:#fff}
.resa-btn.ext{background:var(--clay)}
.resa-cancel{display:block;width:100%;margin-top:9px;border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:13px;padding:11px;border-radius:13px;cursor:pointer;color:var(--muted)}
.e-ok{background:var(--green-soft);border-radius:14px;padding:13px 15px;font-size:13.5px;font-weight:800;color:#33614A}
.e-note{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:6px;line-height:1.4}

/* Moi — sous-onglets */
.seg{display:flex;gap:6px;background:var(--track);padding:5px;border-radius:14px;margin:14px 0 16px}
.segb{flex:1;border:none;font-family:inherit;font-weight:850;font-size:13.5px;padding:10px;border-radius:10px;cursor:pointer;background:none;color:#6f6a5f}
.segb.on{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.08)}

/* Moi — parcours */
.gen .g-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.gen .g-row>span{font-size:13.5px;font-weight:800;color:#5f5a51}
.g-km{display:flex;align-items:center;gap:10px}
.g-km b{font-size:20px;font-weight:850;min-width:26px;text-align:center}
.g-km>span{font-size:13px;color:var(--muted);font-weight:800}
.km-minus,.km-plus{border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:850;font-size:18px;width:36px;height:36px;border-radius:11px;cursor:pointer;color:var(--green);line-height:1}
.g-type{display:flex;gap:8px}
.typ{border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:13px;padding:9px 13px;border-radius:11px;cursor:pointer;color:#5f5a51}
.typ.on{border-color:var(--green);background:var(--green-soft);color:var(--green)}
.gen-btn{width:100%;border:none;font-family:inherit;font-weight:850;font-size:14.5px;padding:14px;border-radius:13px;cursor:pointer;background:var(--clay);color:#fff;margin-top:2px}
.resultcard{padding:16px}
.res-stats{display:flex;justify-content:space-around;text-align:center;margin-bottom:14px}
.res-stats .rs b{display:block;font-size:22px;font-weight:850}
.res-stats .rs span{font-size:11px;color:var(--muted);font-weight:800}
#loopmap{height:240px;width:100%;border-radius:16px;overflow:hidden;background:#E8EDE6}
.res-acts{display:flex;gap:9px;margin-top:13px}
.res-acts button{flex:1;border:none;font-family:inherit;font-weight:850;font-size:13.5px;padding:12px;border-radius:12px;cursor:pointer}
.parc-save{background:var(--green);color:#fff}
.gpx-now{background:var(--green-soft);color:var(--green)}
.res-note{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:11px;line-height:1.4}
.prow{display:flex;align-items:center;gap:12px;padding:14px 16px}
.pr-em{font-size:22px;flex:none}
.pr-t{flex:1;min-width:0}.pr-t b{font-size:14px;font-weight:850;display:block}.pr-t span{font-size:12px;color:var(--muted);font-weight:700}
.parc-gpx{border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:850;font-size:12px;padding:8px 11px;border-radius:10px;cursor:pointer;color:var(--green)}
.parc-del{border:none;background:var(--track);font-family:inherit;font-weight:850;font-size:13px;width:32px;height:32px;border-radius:10px;cursor:pointer;color:var(--muted)}

/* Moi — programme */
.tcard{text-align:center;padding:26px 20px}
.tcard .t-em{font-size:40px}
.tcard h3{font-size:19px;font-weight:850;letter-spacing:-.02em;margin:8px 0 8px}
.tcard p{font-size:13.5px;font-weight:600;line-height:1.5;color:#4f4a42;margin-bottom:18px}
.t-field{text-align:left;margin-bottom:16px}
.t-field label{font-size:11.5px;font-weight:850;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);display:block;margin-bottom:8px}
.t-inputs{display:flex;align-items:center;gap:10px}
.t-inputs input{flex:1;border:1.5px solid var(--track);border-radius:12px;background:#fff;padding:13px;font-family:inherit;font-size:16px;font-weight:800;text-align:center;color:var(--ink)}
.t-inputs span{font-size:20px;font-weight:850;color:var(--muted)}
.test-go{width:100%;border:none;font-family:inherit;font-weight:850;font-size:14.5px;padding:14px;border-radius:13px;cursor:pointer;background:var(--clay);color:#fff}
.allures{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:18px}
.allures .al{flex:1;min-width:80px;text-align:center}
.allures .al b{display:block;font-size:21px;font-weight:850;letter-spacing:-.02em}
.allures .al span{font-size:10.5px;color:var(--muted);font-weight:800}
.test-redo{flex-basis:100%;border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:12.5px;padding:10px;border-radius:11px;cursor:pointer;color:var(--muted);margin-top:4px}
.srow{display:flex;align-items:center;gap:13px;padding:15px 16px}
.s-day{flex:none;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.03em;color:var(--clay);background:var(--clay-soft);padding:7px 9px;border-radius:10px;width:62px;text-align:center}
.s-body{flex:1;min-width:0}.s-body b{font-size:14px;font-weight:850;display:block}.s-body span{font-size:12px;color:#6f6a5f;font-weight:600;line-height:1.35;display:block;margin-top:2px}
.seance-export{flex:none;border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:850;font-size:11.5px;padding:9px 10px;border-radius:11px;cursor:pointer;color:var(--green)}

/* ===== En-tête : icônes ===== */
.hactions{display:flex;align-items:center;gap:10px}
.iconbtn{width:40px;height:40px;border-radius:50%;border:none;background:var(--card);box-shadow:var(--shadow);cursor:pointer;display:flex;align-items:center;justify-content:center;text-decoration:none}
.iconbtn svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.iconbtn.shield svg{stroke:var(--green)} .iconbtn.bag svg{stroke:var(--clay)}

/* ===== Accueil : prochaine sortie (fidèle maquette) ===== */
.nextrun{background:var(--clay-soft);border:1px solid #F6DCCF;border-radius:24px;padding:18px;margin-bottom:16px}
.nr-label{font-size:11px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--clay);margin-bottom:11px}
.nr-top{display:flex;align-items:center;gap:13px;margin-bottom:11px}
.nr-ic{width:46px;height:46px;border-radius:14px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.nr-top b{font-size:15.5px;font-weight:850;display:block}.nr-top span{font-size:12px;color:#9a6a4a;font-weight:700}
.nr-when{font-size:12.5px;color:#8a5238;font-weight:750;line-height:1.5;margin-bottom:14px}
.nr-actions{display:flex;gap:10px}
.nr-cal{flex:1;background:var(--clay);color:#fff;border:none;font-family:inherit;font-weight:850;font-size:13.5px;padding:12px;border-radius:12px;cursor:pointer}
.nr-see{background:#fff;color:#B5532F;border:none;font-family:inherit;font-weight:850;font-size:13.5px;padding:12px 20px;border-radius:12px;cursor:pointer}

/* ===== Accueil : promo t-shirt ===== */
.promo{position:relative;background:linear-gradient(160deg,#FBEFE7,#F7E1D3);border:1.5px solid #F1D3C2;border-radius:22px;padding:16px;margin-bottom:16px}
.promo-x{position:absolute;top:12px;right:14px;font-size:14px;color:var(--muted);cursor:pointer;font-weight:800}
.promo-top{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.promo-ic{width:42px;height:42px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.promo-tx b{font-size:14.5px;font-weight:850;display:block}.promo-tx span{font-size:12px;color:#6f6a5f;font-weight:700}
.promo-actions{display:flex;align-items:center;gap:12px}
.pa-go{flex:1;text-align:center;text-decoration:none;background:var(--clay);color:#fff;font-weight:850;font-size:13.5px;padding:11px;border-radius:12px}
.pa-own{font-size:12.5px;font-weight:800;color:var(--muted);cursor:pointer}

/* ===== Accueil : stats + défi semaine ===== */
.hstats{display:flex;gap:10px;margin-bottom:6px}
.hstat{flex:1;background:var(--card);border-radius:18px;padding:14px 8px;text-align:center;box-shadow:var(--shadow)}
.hstat b{display:block;font-size:21px;font-weight:850}
.hstat span{font-size:10.5px;color:var(--muted);font-weight:800;line-height:1.2;display:block;margin-top:3px}
.dweek .d-h{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.pmeta{display:flex;justify-content:space-between;font-size:12.5px;font-weight:800;color:#5f5a51;margin-top:9px}
.pmeta span:last-child{color:var(--muted)}

/* ===== À écouter (aperçu + overlay) ===== */
.ep{display:flex;align-items:center;gap:13px;background:var(--card);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow);margin-bottom:11px;cursor:pointer;text-decoration:none}
.cover{width:46px;height:46px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--green-soft)}
.ep-tx{flex:1;min-width:0}.ep-t{font-size:14px;font-weight:850;color:var(--ink)}.ep-m{font-size:12px;color:var(--muted);font-weight:700;margin-top:2px}
.ep-play{width:34px;height:34px;border-radius:50%;background:var(--clay-soft);color:var(--clay);display:flex;align-items:center;justify-content:center;font-size:12px;flex:none}
.chips{display:flex;gap:8px;overflow-x:auto;margin-bottom:16px;padding-bottom:2px}
.chips .ch{flex:none;font-size:12.5px;font-weight:800;padding:8px 14px;border-radius:99px;background:var(--card);box-shadow:var(--shadow);color:#5f5a51}
.chips .ch.on{background:var(--ink);color:#fff}
.feat{background:linear-gradient(160deg,#2E6B4B,#3E8A5F);color:#fff;border-radius:22px;padding:20px;margin-bottom:8px}
.feat .lab{font-size:11.5px;font-weight:850;opacity:.9;letter-spacing:.03em}
.feat h2{font-size:21px;font-weight:850;letter-spacing:-.02em;margin:8px 0 6px}
.feat .meta{font-size:12.5px;opacity:.9;font-weight:700}
.playrow{display:flex;align-items:center;gap:12px;margin-top:16px;text-decoration:none}
.pbtn{width:42px;height:42px;border-radius:50%;background:#fff;color:var(--green);display:flex;align-items:center;justify-content:center;font-size:14px;flex:none}
.ptxt{font-size:14px;font-weight:850;color:#fff}
.spoti{display:flex;align-items:center;gap:13px;background:var(--card);border-radius:18px;padding:15px;box-shadow:var(--shadow);text-decoration:none}
.spoti .si{width:44px;height:44px;border-radius:50%;background:#1DB954;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.spoti .st{flex:1}.spoti .st b{font-size:14px;font-weight:850;display:block;color:var(--ink)}.spoti .st span{font-size:12px;color:var(--muted);font-weight:700}
.spoti .go{color:var(--muted);font-weight:850}

/* ===== Mur des tortues ===== */
.wall{display:flex;flex-direction:column;gap:11px}
.fi{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:18px;padding:14px;box-shadow:var(--shadow)}
.fi .av{flex:none}
.ftcol{flex:1;min-width:0}
.ftcol .tag{display:inline-block;font-size:10.5px;font-weight:850;text-transform:uppercase;letter-spacing:.03em;color:var(--clay);background:var(--clay-soft);padding:3px 8px;border-radius:99px;margin-bottom:5px}
.fi .ft{font-size:13.5px;font-weight:600;line-height:1.35}.fi .ft b{font-weight:850}
.fi .meta{font-size:11px;color:var(--muted);font-weight:700;margin-top:3px}
.fi .heart{flex:none;font-size:12px;font-weight:850;color:var(--clay)}

/* ===== Team : créer + go + contributions ===== */
.createbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:1.5px dashed #D7B9A8;background:var(--clay-soft);color:#B5532F;font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:15px;cursor:pointer;margin-bottom:14px}
.createbtn span{font-size:18px}
.gobtn{display:flex;align-items:center;gap:13px;background:var(--card);border-radius:18px;padding:15px 16px;box-shadow:var(--shadow);cursor:pointer;margin-bottom:11px}
.gi{width:44px;height:44px;border-radius:13px;background:var(--green-soft);display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.gt{flex:1;min-width:0}.gt b{font-size:14.5px;font-weight:850;display:block}.gt span{font-size:12px;color:var(--muted);font-weight:700}
.ga{color:var(--muted);font-weight:850;font-size:18px}
.member{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #F0ECE4}
.member:last-child{border-bottom:none}
.av.sm{width:34px;height:34px;font-size:12px}
.mname{font-size:13px;font-weight:800;width:84px;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mtrack{flex:1;height:8px;background:var(--track);border-radius:99px;overflow:hidden}
.mtrack i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#7FB894,var(--green))}
.mkm{font-size:12px;font-weight:850;color:#5f5a51;width:44px;text-align:right;flex:none}
.soon-defi{opacity:.85}

/* ===== Moi : progression ===== */
.big2{display:flex;align-items:baseline;gap:6px;margin:6px 0 2px}
.big2 .num{font-size:42px;font-weight:850;letter-spacing:-.03em}.big2 .unit{font-size:16px;color:var(--muted);font-weight:850}
.delta{font-size:13px;color:var(--green);font-weight:800;margin-bottom:16px}
.chart{display:flex;align-items:flex-end;gap:8px;height:90px;margin-bottom:24px}
.chart .cbar{flex:1;background:var(--track);border-radius:8px 8px 0 0;position:relative;min-height:8px}
.chart .cbar.on{background:linear-gradient(180deg,var(--clay),#E6B083)}
.chart .cbar span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);font-weight:800}
.streak{display:flex;align-items:center;gap:14px}
.streak .ic{font-size:30px;flex:none}
.streak .n{font-size:16px;font-weight:850}.streak .t{font-size:12.5px;color:#6f6a5f;font-weight:700;line-height:1.35}
.badges{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.badge{position:relative;flex:none;width:84px;text-align:center;background:var(--card);border-radius:16px;padding:14px 6px;box-shadow:var(--shadow);cursor:pointer}
.badge .e{font-size:28px}.badge .bt{font-size:10.5px;font-weight:800;color:#5f5a51;margin-top:6px;line-height:1.2}
.badge.locked{opacity:.42}
.badge.locked .e{filter:grayscale(1)}
.badge .bok{position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--green);color:#fff;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:center}
.first{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px solid #F0ECE4}
.first:last-child{border-bottom:none}
.first .e{font-size:22px;flex:none}.first .tx{flex:1;font-size:13.5px;font-weight:800}.first .dt{font-size:11.5px;color:var(--muted);font-weight:800}

/* ===== Overlays : infra ===== */
.overlay{position:fixed;inset:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;background:var(--bg);z-index:60;overflow-y:auto;display:none}
.overlay.show{display:block}
.opad{position:relative;z-index:1;padding:max(18px,env(safe-area-inset-top)) 20px calc(100px + env(safe-area-inset-bottom));min-height:100%}
.backbar{display:flex;align-items:center;gap:12px;margin:4px 0 16px}
.backbtn{flex:none;width:40px;height:40px;border-radius:50%;border:none;background:var(--card);box-shadow:var(--shadow);cursor:pointer;display:flex;align-items:center;justify-content:center}
.backbtn svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.backbar .ptitle{margin:0}

/* ===== Mode sécurité ===== */
.se-sect{font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:18px 4px 10px}
.se-follow,.se-shake{display:flex;align-items:center;gap:13px}
.se-ic{width:42px;height:42px;border-radius:12px;background:var(--green-soft);display:flex;align-items:center;justify-content:center;flex:none}
.se-ic svg{width:22px;height:22px;stroke:var(--green);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.se-ic.big{font-size:22px}
.se-follow .ft{flex:1}.se-follow .ft b,.se-shake .st b{font-size:14px;font-weight:850;display:block}.se-follow .ft span,.se-shake .st span{font-size:11.5px;color:var(--muted);font-weight:700}
.se-shake .st{flex:1}
.se-tog{flex:none;width:50px;height:30px;border-radius:99px;border:none;background:var(--track);position:relative;cursor:pointer}
.se-tog:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:.18s}
.se-tog.on{background:var(--green)}.se-tog.on:after{left:23px}
.se-contact{display:flex;align-items:center;gap:12px}
.se-contact b{font-size:14px;font-weight:850;display:block}.se-contact span{font-size:11.5px;color:var(--muted);font-weight:700}
.se-contact>div:nth-child(2){flex:1}
.se-change{flex:none;font-size:12.5px;font-weight:850;color:var(--clay);cursor:pointer}
.se-big{display:flex;gap:12px}
.se-bb{flex:1;border:none;font-family:inherit;border-radius:20px;padding:20px 12px;cursor:pointer;text-align:center;color:#fff}
.se-bb .e{font-size:26px;margin-bottom:8px}
.se-bb b{display:block;font-size:16px;font-weight:850}.se-bb span{font-size:11px;font-weight:700;opacity:.9;display:block;margin-top:3px}
.se-bb.sos{background:linear-gradient(160deg,#D9534F,#C0392B)}
.se-bb.alarm{background:linear-gradient(160deg,#E6883E,#D9772B)}
.se-htitle{font-size:13px;font-weight:850;margin-bottom:12px}
.se-happens{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:#4f4a42;padding:6px 0}
.se-happens .ee{font-size:16px}
.se-shake{margin-top:14px}
.se-tip{font-size:12.5px;font-weight:700;color:var(--green);background:var(--green-soft);padding:13px 15px;border-radius:14px;margin-top:14px;line-height:1.45}
.se-note{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:12px;line-height:1.4;text-align:center}
.se-intro{font-size:13px;font-weight:700;color:#4f4a42;background:var(--green-soft);padding:14px;border-radius:14px;margin-bottom:14px;line-height:1.45}
.se-ct{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #F0ECE4;cursor:pointer}
.se-ct:last-child{border-bottom:none}
.se-ci{flex:1}.se-ci b{font-size:14px;font-weight:800;display:block}.se-ci span{font-size:12px;color:var(--muted);font-weight:700}
.se-check{width:26px;height:26px;border-radius:50%;border:2px solid var(--track);display:flex;align-items:center;justify-content:center;font-size:13px;color:transparent;flex:none}
.se-ct.on .se-check{background:var(--green);border-color:var(--green);color:#fff}
.se-savebtn{display:block;width:100%;border:none;font-family:inherit;font-weight:850;font-size:14.5px;padding:14px;border-radius:14px;cursor:pointer;background:var(--green);color:#fff;margin-top:18px}

/* ===== FAQ ===== */
.faqitem{background:var(--card);border-radius:16px;box-shadow:var(--shadow);margin-bottom:10px;overflow:hidden}
.fq{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 16px;font-size:14px;font-weight:800;cursor:pointer}
.fq .qa{flex:none;width:24px;height:24px;border-radius:50%;background:#F4F0E9;color:var(--clay);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800}
.fa{padding:0 16px 16px;font-size:13.5px;font-weight:600;line-height:1.5;color:#4f4a42}
.fa b{font-weight:850;color:var(--ink)}
/* 🎨 v207 — LA FAQ REFAITE (retour n° 9 du test iPhone, maquette validée le 10/09).
   Les anciennes règles .faqitem / .fq / .fa restent : .fq sert aussi ailleurs. */
.faqintro{font-size:13.5px;color:var(--muted);font-weight:650;line-height:1.5;margin:-6px 2px 16px}
.faqbloc{background:var(--card);border-radius:22px;box-shadow:0 10px 26px rgba(46,40,30,.07);overflow:hidden}
.faqli{border-bottom:1px solid #F1ECE3}
.faqli:last-child{border-bottom:none}
.faqli .faqq{display:flex;align-items:center;gap:12px;padding:15px 17px;font-size:14px;font-weight:800;line-height:1.35;cursor:pointer}
.faqli .faqch{margin-left:auto;flex:none;color:#B9B2A6;font-size:15px;font-weight:800;transition:transform .18s ease,color .18s ease}
.faqli.on{background:#F3F8F3}
.faqli.on .faqq{color:var(--green)}
.faqli.on .faqch{color:var(--green);transform:rotate(90deg)}
.faqli .faqa{padding:0 17px 16px}
.faqli .faqin{border-left:3px solid #8FBFA0;padding-left:13px;font-size:13.5px;font-weight:600;line-height:1.6;color:#4f4a42}
.faqli .faqin b{font-weight:850;color:var(--ink)}
.faqdeux{display:flex;gap:11px;margin-top:16px}
.faqmini{flex:1;min-width:0;border-radius:18px;padding:15px 14px;text-align:left;cursor:pointer}
.faqmini .e{font-size:22px;line-height:1}
.faqmini b{display:block;font-size:13.5px;font-weight:850;margin-top:8px;line-height:1.3}
.faqmini span{display:block;font-size:11.5px;font-weight:700;line-height:1.45;margin-top:4px}
.faqmini.vert{background:var(--green-soft)}.faqmini.vert b{color:#33614A}.faqmini.vert span{color:#5f8a6f}
.faqmini.rose{background:#FDF1EE;border:1px solid #F1C6B6}.faqmini.rose b{color:#B5432F}.faqmini.rose span{color:#A8735F}

/* ⚑ v208 — L'ÉCRAN SIGNALEMENTS REFAIT (maquette validée le 10/09).
   Deux rôles écrits noir sur blanc, et les trois états toujours visibles. */
.sigcard{margin-bottom:12px}
.sigcard.neuf{background:#FDF1EE;border:1px solid #F1C6B6}
.sigtop{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:9px}
.sigbadge{border-radius:99px;padding:3px 10px;font-size:11px;font-weight:900}
.sigbadge.neuf{background:#B5432F;color:#fff}
.sigbadge.cours{background:#E8DFC8;color:#7A6428}
.sigbadge.ok{background:#EAF1E7;color:#2E6B4B}
.sigdate{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:700}
.sigmotif{font-size:12.5px;font-weight:850;color:#B5432F;margin-bottom:9px}
.sigctx{background:#FBF9F5;border-left:3px solid #B5432F;border-radius:0 11px 11px 0;padding:9px 12px;font-size:12.5px;line-height:1.5;margin-bottom:8px}
.sigmot{background:#FBF9F5;border-radius:11px;padding:10px 12px;font-size:13px;line-height:1.55;font-style:italic;margin-bottom:12px}
.sigqui{display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid #EFE7DC;border-radius:14px;padding:11px 12px;margin-bottom:8px}
.sigqui.rose{display:block;border-color:#F1C6B6}
.sigqh{display:flex;align-items:center;gap:11px}
.sigav{width:38px;height:38px;border-radius:50%;background:var(--green-soft);display:flex;align-items:center;justify-content:center;font-size:17px;flex:none}
.sigav.rose{background:#FAE0D8}
.sigqt{flex:1;min-width:0}
.sigqt span{display:block;font-size:10.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.sigqt b{display:block;font-size:14px;font-weight:850;line-height:1.3;margin-top:1px}
.sigbtn{flex:none;background:var(--green-soft);border:1.5px solid #C9DCC9;border-radius:11px;padding:8px 12px;font-family:inherit;font-size:12px;font-weight:850;color:var(--green);cursor:pointer}
.sigbloq{display:block;width:100%;margin-top:9px;background:#fff;border:1.5px solid #E8C4B8;border-radius:11px;padding:9px;font-family:inherit;font-size:12px;font-weight:850;color:#B5432F;cursor:pointer}
.sigbloq.debloq{border-color:#C9DCC9;color:var(--green);background:var(--green-soft)}
.sigstlab{font-size:10.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:14px 2px 7px}
.sigsts{display:flex;gap:7px}
.sigst{flex:1;text-align:center;border-radius:11px;padding:10px 4px;font-family:inherit;font-size:12.5px;font-weight:850;border:1.5px solid #E0D9CB;background:#fff;color:#6f6a5f;cursor:pointer}
.sigst.on.rouge{background:#B5432F;border-color:#B5432F;color:#fff}
.sigst.on.jaune{background:#E8DFC8;border-color:#D8C89C;color:#7A6428}
.sigst.on.vert{background:var(--green);border-color:var(--green);color:#fff}
.askcard{display:flex;align-items:center;gap:13px;background:var(--green-soft);border-radius:18px;padding:16px;cursor:pointer;margin-top:14px}
.ai{width:44px;height:44px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.askcard b{font-size:14.5px;font-weight:850;display:block;color:#33614A}.askcard span{font-size:12px;color:#5f8a6f;font-weight:700}

/* ===== Support chat ===== */
.supsub{font-size:12px;font-weight:850;color:var(--green);margin:-8px 2px 14px}
.thread{display:flex;flex-direction:column;gap:11px;margin-bottom:14px}
.msg{display:flex;gap:9px;max-width:86%}
.msg.self{margin-left:auto;flex-direction:row-reverse}
.mav{width:32px;height:32px;border-radius:50%;background:var(--green-soft);display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.bubble{background:var(--card);border-radius:16px;padding:10px 13px;box-shadow:var(--shadow)}
.msg.self .bubble{background:var(--green-soft);color:#33614A}
.bubble .nm{font-size:11.5px;font-weight:850;color:var(--green);margin-bottom:3px}
.bubble .tx{font-size:13.5px;font-weight:600;line-height:1.4}
/* v129 : « Écrire aux tortues » — les retours à la ligne de Laurane sont respectés,
   et son image s'affiche à l'endroit exact où elle a mis le repère [IMAGE].
   (limité au fil du support : le mur et le forum ne bougent pas) */
#supthread .bubble .tx{white-space:pre-wrap}

/* ===== v132 : la messagerie coach dans l'app (réservée à Laurane) ===== */
.cmgo .cmbadge{background:var(--clay);color:#fff;font-size:11.5px;font-weight:850;border-radius:99px;padding:2px 9px;margin-left:auto;flex:none}
.cmfilters{display:flex;gap:7px;margin:0 2px 14px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
.cmfilters.wrap{flex-wrap:wrap;overflow:visible}
.cmf{background:var(--card);border:1px solid var(--line);color:var(--muted);font-family:inherit;font-size:12.5px;font-weight:800;border-radius:99px;padding:8px 14px;cursor:pointer;white-space:nowrap;flex:none}
.cmf.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.cmf.envoi{color:var(--clay);border-color:#F1C6B6;margin-left:auto}
.cmrow{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:15px;padding:12px 14px;margin-bottom:9px;box-shadow:var(--shadow);cursor:pointer}
.cmav{width:42px;height:42px;border-radius:50%;background:var(--soft);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:850;font-size:13.5px;color:var(--green);flex:none;overflow:hidden}
.cmpic{display:block;width:100%;height:100%;background-size:cover;background-position:center}
.cmri{flex:1;min-width:0}
.cmri b{font-size:14.5px;font-weight:850;display:block}
.cmri span{font-size:12.5px;color:var(--muted);font-weight:650;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.cmri i{font-size:11px;color:var(--muted);font-weight:700;font-style:normal;display:block;margin-top:2px;opacity:.8}
.cmrep{background:#FBE7D8;color:#B5532F;font-size:10.5px;font-weight:850;border-radius:99px;padding:3px 9px;white-space:nowrap;flex:none}
.cmdot{width:10px;height:10px;border-radius:50%;background:var(--clay);flex:none}
.cmhead{display:flex;align-items:center;gap:11px;background:var(--card);border-radius:15px;padding:11px 13px;margin-bottom:12px;box-shadow:var(--shadow);flex-wrap:wrap}
.cmhi{flex:1;min-width:0}
.cmhi b{font-size:14.5px;font-weight:850;display:block}
.cmhi span{font-size:11.5px;color:var(--muted);font-weight:650;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmtag{background:var(--soft);border:1px solid var(--line);color:var(--muted);font-family:inherit;font-size:11.5px;font-weight:850;border-radius:10px;padding:7px 11px;cursor:pointer;flex:none}
.cmtag.off{background:var(--green-soft);color:var(--green);border-color:#C9DCC9}
.cmthread{background:var(--soft);border-radius:16px;padding:14px 12px;min-height:180px;display:flex;flex-direction:column}
.cmb{display:flex;margin-bottom:3px}
.cmb.me{justify-content:flex-end}
.cmbx{max-width:84%;padding:10px 13px;border-radius:15px;background:var(--card);font-size:13.5px;font-weight:600;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:var(--shadow);border-top-left-radius:5px}
.cmb.me .cmbx{background:var(--green-soft);color:#33614A;border-top-left-radius:15px;border-top-right-radius:5px}
.cmbx img{max-width:100%;height:auto;border-radius:11px;display:block;margin:8px 0}
.cmt{font-size:10.5px;color:var(--muted);font-weight:750;margin:0 4px 12px}
.cmt.me{text-align:right}
.cmt.me.ok{color:var(--green)}
.cmreply{flex:1}
.cecount{background:#FAE7DD;color:#B5532F;border-radius:12px;padding:10px 14px;font-size:13px;font-weight:850;margin:0 2px 12px}
.cechips{display:flex;gap:7px;flex-wrap:wrap;margin:0 2px 8px}
.cechip{background:var(--soft);border:1px solid var(--line);color:var(--clay);font-family:inherit;font-size:12px;font-weight:850;border-radius:9px;padding:7px 11px;cursor:pointer}
.cechip.mod{background:var(--ink);border-color:var(--ink);color:#fff}
.cechip.del{color:#B9433A}
.cequi{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.cequii{background:var(--card);border:1px solid var(--line);color:var(--ink);font-family:inherit;font-size:12.5px;font-weight:800;border-radius:10px;padding:8px 12px;cursor:pointer}
.cequii.on{background:var(--green);color:#fff;border-color:var(--green)}
/* v135 : joindre une photo dans la messagerie (tortue ET coach) */
.supphoto{background:var(--card);border:1px solid var(--line);border-radius:13px;width:44px;flex:none;font-size:18px;cursor:pointer;line-height:1}
.supphoto:active{background:var(--soft)}
.supjoint{background:var(--soft);border-radius:14px;padding:10px;margin-bottom:8px;text-align:center}
.supjoint img{max-height:150px;max-width:100%;border-radius:10px;display:block;margin:0 auto}
.supjointx{background:none;border:none;color:#B9433A;font-family:inherit;font-size:12.5px;font-weight:850;margin-top:8px;cursor:pointer}
/* v137 : le badge « la coach 💛 » — visible partout où le prénom de Laurane apparaît */
.coachtag{display:inline-block;background:#FFF0C9;color:#8A6100;border:1px solid #F3DFA8;font-size:10.5px;font-weight:850;border-radius:99px;padding:1px 8px;margin-left:6px;white-space:nowrap;vertical-align:1px}
/* v139 : l'invitation permanente à activer sa localisation (onglet Team, au-dessus de la carte) */
.locinvite{background:var(--card);border:2px solid #2E6B4B;border-radius:16px;padding:15px 16px;margin:18px 0 10px;box-shadow:var(--shadow)}
.locinvite .lihead{display:flex;align-items:flex-start;gap:11px;margin-bottom:11px}
.locinvite .liem{font-size:22px;line-height:1;flex:none}
.locinvite .litx{flex:1;min-width:0}
.locinvite .litx b{display:block;font-size:14.5px;font-weight:850;line-height:1.35}
.locinvite .litx span{display:block;font-size:12.5px;color:var(--muted);font-weight:650;line-height:1.5;margin-top:5px}
.locinvite .libtn{width:100%;background:var(--green);color:#fff;border:none;border-radius:12px;padding:12px;font-family:inherit;font-weight:850;font-size:13.5px;cursor:pointer}
.locinvite .linote{font-size:11px;color:var(--muted);font-weight:650;text-align:center;line-height:1.45;margin-top:9px}
/* 📍 v224 — le message quand la position échoue, et l'encadré du navigateur d'Instagram.
   Le premier est ambré (une information, pas une alerte), le second terre cuite (il parle
   d'autre chose que de l'app). Aucun des deux ne demande d'accepter quoi que ce soit. */
.locfail{background:#FFF7E8;border:1.5px solid #EFD9A6;border-radius:14px;padding:13px 14px;margin-top:11px}
.locfail b{display:block;font-size:13.5px;font-weight:850;line-height:1.4}
.locfail span{display:block;font-size:12px;color:#8A7A55;font-weight:650;line-height:1.55;margin-top:5px}
.locfailbtn{width:100%;margin-top:11px;background:var(--green);color:#fff;border:none;border-radius:11px;padding:11px;font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.locinsta{background:#FAE7DD;border:1.5px solid #E9BCA6;border-radius:14px;padding:13px 14px;margin:18px 0 0}
.locinsta b{display:block;font-size:13.5px;font-weight:850;line-height:1.4}
.locinsta span{display:block;font-size:12px;color:#9A5B3F;font-weight:650;line-height:1.55;margin-top:5px}
.locinstabtn{width:100%;margin-top:11px;background:#DA6A45;color:#fff;border:none;border-radius:11px;padding:11px;font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.locinstanote{background:#fff;border-radius:11px;padding:10px 12px;margin-top:9px;font-size:11.5px;color:#7A5340;font-weight:650;line-height:1.6}
/* v141 : pastille « groupe WhatsApp à créer » — visible par la coach uniquement */
.nowa{display:inline-block;background:#FBE7D8;color:#B5532F;font-size:10px;font-weight:850;border-radius:99px;padding:1px 8px;margin-left:7px;white-space:nowrap;vertical-align:1px}
/* v141 : la jauge d'engagement — CHACUNE voit la sienne, jamais celle des autres */
/* v144 : carte compacte — 8 lignes au repos au lieu de 20 (maquette validée par Laurane) */
.engjauge{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px 16px;margin-bottom:14px;box-shadow:var(--shadow)}
.engjauge .ejhd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:11px}
.engjauge .ejt{font-size:15px;font-weight:850}
.engjauge .ejpts{font-size:13.5px;font-weight:850;color:var(--green)}
.engjauge .ejbar{height:7px;border-radius:99px;background:var(--soft);overflow:hidden;margin-bottom:13px}
.engjauge .ejbar i{display:block;height:100%;background:linear-gradient(90deg,#3E8A5F,#2E6B4B);border-radius:99px;transition:width .6s ease}
.engjauge .ejg3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.engjauge .ejc{background:var(--soft);border-radius:11px;padding:10px 6px;text-align:center}
.engjauge .ejc b{display:block;font-size:20px;font-weight:850;line-height:1.1}
.engjauge .ejc span{display:block;font-size:10px;color:var(--muted);font-weight:700;line-height:1.3;margin-top:3px}
.engjauge .ejc.zero b{color:#B8B1A5}
.engjauge .ejtog{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--clay);cursor:pointer;margin-bottom:12px}
.engjauge .ejgestes{display:flex;flex-wrap:wrap;gap:6px;margin:-4px 0 12px}
.engjauge .ejg{background:var(--soft);border-radius:99px;padding:5px 10px;font-size:11px;font-weight:700;color:var(--muted)}
.engjauge .ejg b{color:var(--green);font-weight:850}
/* v143 : la réponse de la coach à une idée, et ses boutons de statut */
.idearep{background:#FFF7E6;border:1px solid #F3E3C0;border-radius:11px;padding:9px 11px;margin-top:8px;font-size:12.5px;font-weight:650;color:#8A6100;line-height:1.5}
.idearep b{display:block;font-weight:850;margin-bottom:2px}
.ideacoach{background:var(--soft);border-radius:11px;padding:9px;margin-top:8px}
.ists{background:var(--card);border:1px solid var(--line);color:var(--muted);font-family:inherit;font-size:11px;font-weight:800;border-radius:99px;padding:5px 10px;margin:0 4px 4px 0;cursor:pointer}
.ists.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.engjauge .ejcta{width:100%;background:var(--card);color:var(--ink);border:1px solid #D8D1C4;border-radius:11px;padding:11px;font-family:inherit;font-weight:850;font-size:12.5px;cursor:pointer}
.engjauge .ejcta:active{background:var(--soft)}
.engjauge .ejbravo{background:var(--green-soft);color:#2E6B4B;border-radius:11px;padding:10px 12px;font-size:11.5px;font-weight:750;line-height:1.45;text-align:center}
.engjauge .ejn{font-size:10.5px;color:var(--muted);font-weight:650;line-height:1.45;text-align:center;margin-top:9px}
/* v144 : la bannière t-shirt sur l'accueil — rattrapage doux après la pop-up */
/* v168 : les DEUX boutons passent SOUS la phrase (Laurane, d'après une capture d'Élodie :
   « on voit pas bien le bouton je le veux »). Avant, ils partageaient la ligne du texte en
   flex-wrap : sur un téléphone étroit, « Je le veux » retombait seul à la ligne, sans fond ni
   bordure, et ressemblait à une légende grise. Maintenant : texte en haut, deux boutons de
   même largeur en dessous, tous les deux visiblement cliquables. */
.teeban{background:var(--card);border:1px solid #F0DCC0;border-radius:15px;padding:14px 15px;margin-bottom:14px;box-shadow:var(--shadow)}
.teeban .tbhaut{display:flex;align-items:flex-start;gap:11px;margin-bottom:12px}
.teeban .tbi{font-size:22px;flex:none;line-height:1.2}
.teeban .tbt{flex:1;min-width:0}
.teeban .tbt b{display:block;font-size:13.5px;font-weight:850;line-height:1.3}
.teeban .tbt span{display:block;font-size:11.5px;color:var(--muted);font-weight:650;margin-top:2px;line-height:1.4}
.teeban .tbbtns{display:flex;gap:9px}
.teeban .tbo{flex:1;background:var(--green);color:#fff;border:1.5px solid var(--green);border-radius:11px;padding:12px 10px;font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.teeban .tbn{flex:1;background:var(--card);color:var(--green);border:1.5px solid var(--green);border-radius:11px;padding:12px 10px;font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.teeban .tbo:active,.teeban .tbn:active{opacity:.75}
/* ⚑ v170 : signaler. Le ⚑ sous un message, et le lien au bas d'une sortie.
   Volontairement DISCRETS : on ne veut pas transformer chaque discussion en tribunal.
   Mais lisibles et assez grands pour le pouce — un bouton de sécurité qu'on ne trouve pas
   ne sert à rien (voir la leçon du bouton « Je le veux » de la bannière t-shirt, v168). */
.chsig{color:#B5432F;font-weight:800;cursor:pointer;font-size:11.5px;padding:2px 0}
.chsig:active{opacity:.6}
.sigsortie{margin-top:14px;text-align:center;color:#B5432F;background:#FDF1EE;border:1px solid #F1C6B6;border-radius:12px;padding:11px 14px;font-weight:800;font-size:12.5px;cursor:pointer}
.sigsortie:active{opacity:.75}
/* v144 : les km jamais partagés, qui ne comptaient donc pas pour le défi */
.apartager{background:#F1F5EF;border:1px solid #DCE6D8;border-radius:12px;padding:10px 13px;margin-top:9px;font-size:12px;font-weight:700;color:#3E6B45;line-height:1.5;cursor:pointer}
.apartager u{text-decoration:underline;font-weight:850}
/* v148 : la case à cocher de la charte des sorties */
.chartecase{display:flex;align-items:flex-start;gap:11px;background:var(--soft);border-radius:12px;padding:12px 13px;margin-bottom:11px;cursor:pointer;text-align:left}
.chartecase input{width:21px;height:21px;flex:none;accent-color:var(--green);cursor:pointer;margin-top:1px}
.chartecase span{font-size:12.5px;font-weight:700;line-height:1.45;color:var(--ink)}
/* v149 : le point de rendez-vous ouvre l'itinéraire */
.lienmap{color:inherit;text-decoration:none;border-bottom:1px dashed currentColor;padding-bottom:1px}
.lienmap span{font-size:.85em;opacity:.7;border:none}
.itinbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--card);border:1px solid var(--ink);color:var(--ink);font-family:inherit;font-size:14.5px;font-weight:850;border-radius:12px;padding:13px;margin-top:8px;cursor:pointer;text-decoration:none}
.itinbtn.soft{border-color:var(--line);color:var(--muted);font-weight:800}
/* v149 : un bouton d'action posé dans un message privé */
.supbtn{display:block;width:100%;background:var(--ink);border:none;color:#fff;font-family:inherit;font-size:14px;font-weight:850;border-radius:11px;padding:12px 14px;margin:8px 0;cursor:pointer;text-align:center}
.mine.tap{cursor:pointer}
#supthread .bubble .tx .supimg{max-width:100%;height:auto;border-radius:11px;display:block;margin:8px 0;background:var(--soft)}
.bubble .tm{font-size:10px;color:var(--muted);font-weight:700;margin-top:4px;text-align:right}
.msg.self .bubble .tm{color:#7aa78c}
/* v82 : bulles de conversation unifiées (mur, forum, sorties, courses) + like */
.chat{display:flex;flex-direction:column;gap:13px;padding:2px}
.cb{display:flex;gap:9px;align-items:flex-start}
.cb.me{flex-direction:row-reverse}
.cbav{width:34px;height:34px;border-radius:50%;flex:none;background:#EDE7DC;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:850;color:#6E7A5E}
.cbcol{flex:1;min-width:0;display:flex;flex-direction:column}
.cb.me .cbcol{align-items:flex-end}
.cbmsg{max-width:90%;background:#fff;border:1px solid #EEE7DC;border-radius:15px;border-top-left-radius:5px;padding:10px 13px}
.cb.me .cbmsg{background:var(--green-soft);border-color:#CBE0D0;border-top-left-radius:15px;border-top-right-radius:5px}
.cbname{font-size:12px;font-weight:850;color:var(--green);margin-bottom:2px}
.cbtx{font-size:14.5px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere;word-break:break-word}
.cb.me .cbtx{color:#25543D}
.cbmeta{display:flex;align-items:center;gap:13px;margin-top:5px;padding:0 5px;font-size:11.5px;color:var(--muted)}
.cb.me .cbmeta{flex-direction:row-reverse}
.chlike{font-size:13px;font-weight:850;color:#C7BEB0;cursor:pointer;flex:none;user-select:none}
.chlike.on{color:var(--clay)}
.cbact{font-size:11.5px;font-weight:800;cursor:pointer}
.cbact.ed{color:var(--clay)}.cbact.dl{color:#B9433A}
.quick{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}
.qz{border:1.5px solid var(--track);background:#fff;font-family:inherit;font-weight:800;font-size:12.5px;padding:8px 12px;border-radius:99px;cursor:pointer;color:#5f5a51}
.inputbar{display:flex;gap:9px;position:sticky;bottom:0;background:var(--bg);padding:8px 0}
.supinput,.sinput{flex:1;border:1.5px solid var(--track);border-radius:14px;background:#fff;padding:12px 14px;font-family:inherit;font-size:14px;font-weight:600;outline:none}
.supinput:focus,.sinput:focus{border-color:var(--clay)}
.supsend,.ssend{width:50px;height:50px;flex:none;border:none;border-radius:15px;background:var(--clay);color:#fff;font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center}

/* ===== Boîte à idées ===== */
.ideacompose{background:var(--card);border-radius:18px;padding:16px;box-shadow:var(--shadow);margin-bottom:8px}
.ideainput{width:100%;border:1.5px solid var(--track);border-radius:13px;background:var(--bg);padding:13px;font-family:inherit;font-size:14px;font-weight:600;min-height:74px;resize:none;outline:none}
.ideainput:focus{border-color:var(--clay)}
.ideasend{border:none;font-family:inherit;font-weight:850;font-size:13.5px;padding:11px 18px;border-radius:12px;cursor:pointer;background:var(--clay);color:#fff}
.idea{display:flex;gap:13px;background:var(--card);border-radius:18px;padding:14px;box-shadow:var(--shadow);margin-bottom:11px;align-items:center}
.iv{flex:none;width:52px;border:1.5px solid var(--track);background:#fff;border-radius:13px;padding:9px 0;cursor:pointer;text-align:center;font-family:inherit}
.iv.on{border-color:var(--green);background:var(--green-soft)}
.iv .up{font-size:16px}.iv .cnt{font-size:13px;font-weight:850;margin-top:2px;color:#5f5a51}
.it{flex:1;min-width:0}.it b{font-size:14px;font-weight:800;line-height:1.3;display:block}
.im{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:5px}
.tagi{display:inline-block;font-size:10.5px;font-weight:850;padding:3px 9px;border-radius:99px}
.tagi.etude{color:var(--gold);background:#F6ECD6}.tagi.fait{color:var(--green);background:var(--green-soft)}

/* ===== Récap mensuel ===== */
.hero{background:linear-gradient(160deg,#DA6A45,#E6A24A);color:#fff;border-radius:24px;padding:24px;text-align:center;margin-bottom:14px}
.hero .lab{font-size:13px;font-weight:800;opacity:.92}
.bignum{font-size:60px;font-weight:850;letter-spacing:-.04em;line-height:1}.bignum small{font-size:22px;font-weight:850}
.hmini{display:flex;justify-content:space-around;margin-top:18px}
.hmini b{display:block;font-size:20px;font-weight:850}.hmini span{font-size:11px;opacity:.9;font-weight:700}
.two{display:flex;gap:12px;margin-bottom:14px}
.mc{flex:1;background:var(--card);border-radius:18px;padding:18px;text-align:center;box-shadow:var(--shadow)}
.mc .e{font-size:30px}.mc b{display:block;font-size:16px;font-weight:850;margin-top:6px}.mc span{font-size:11.5px;color:var(--muted);font-weight:700}
.rcjourney{display:flex;align-items:center;gap:14px}
.rcjourney .ic{font-size:30px;flex:none}
.rcjourney .jt b{font-size:14px;font-weight:850;display:block}.rcjourney .jt span{font-size:12.5px;color:#6f6a5f;font-weight:700;line-height:1.4}
.word{background:var(--green-soft);border-radius:20px;padding:22px;text-align:center;margin-bottom:14px}
.word .q{font-size:15px;font-weight:700;font-style:italic;line-height:1.5;color:#33614A}
.word .sig{font-size:13px;font-weight:850;color:var(--green);margin-top:12px}

/* ===== Programmes ===== */
.pgcard{display:flex;align-items:center;gap:14px;background:var(--card);border-radius:18px;padding:16px;box-shadow:var(--shadow);margin-bottom:11px;cursor:pointer}
.pgi{width:46px;height:46px;border-radius:14px;background:var(--green-soft);display:flex;align-items:center;justify-content:center;font-size:24px;flex:none}
.pgt{flex:1;min-width:0}.pgt b{font-size:14.5px;font-weight:850;display:flex;align-items:center;gap:7px;flex-wrap:wrap}.pgt span{font-size:12px;color:var(--muted);font-weight:700;display:block;margin-top:3px}
.pgfree{font-size:10px;font-weight:850;color:var(--green);background:var(--green-soft);padding:2px 8px;border-radius:99px}
.pgpremium{font-size:10px;font-weight:850;color:var(--gold);background:#F6ECD6;padding:2px 8px;border-radius:99px}
.pgchev{color:var(--muted);font-weight:850;font-size:18px}
/* Programme — évaluation du niveau */
.psub{font-size:14px;color:var(--muted);font-weight:600;margin:6px 2px 18px;line-height:1.45}
.opt{display:flex;align-items:center;gap:14px;background:var(--card);border:1.5px solid var(--track);border-radius:18px;padding:17px;box-shadow:var(--shadow);margin-bottom:12px;cursor:pointer}
.opt.reco{border-color:var(--clay)}
.opt .oic{width:46px;height:46px;border-radius:13px;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--green-soft)}
.opt .ot b{font-size:15.5px;font-weight:850;display:flex;align-items:center;gap:8px}
.opt .ot span{font-size:12.5px;color:var(--muted);font-weight:600;display:block;margin-top:3px;line-height:1.35}
.rb{font-size:9.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--clay);padding:3px 7px;border-radius:6px}
.resultchip{background:var(--green-soft);border-radius:16px;padding:16px;margin-top:8px}
.resultchip b{font-size:15px;font-weight:850;color:var(--green);display:block}
.resultchip span{font-size:12.5px;color:#5f7a67;font-weight:700}
.evaltip{font-size:12.5px;color:#8a5238;font-weight:700;margin-top:14px;line-height:1.45;background:var(--clay-soft);border-radius:13px;padding:13px 15px}
.pgcta{width:100%;border:none;font-family:inherit;font-weight:850;font-size:15px;padding:15px;border-radius:14px;cursor:pointer;background:var(--clay);color:#fff;margin-top:18px}
.evalback{display:block;width:100%;border:none;background:none;font-family:inherit;font-weight:800;font-size:13px;color:var(--muted);cursor:pointer;margin-top:10px;padding:8px}
/* Programme — en-tête dégradé (fidèle maquette) */
.phead{border-radius:24px;padding:22px;color:#fff;margin-bottom:16px;position:relative;overflow:hidden;background:linear-gradient(150deg,#2E6B4B,#3F8F62);box-shadow:0 16px 36px rgba(46,107,75,.3)}
.phead:after{content:"🐢";position:absolute;right:-8px;bottom:-14px;font-size:80px;opacity:.16}
.phead h2{font-size:21px;font-weight:850;letter-spacing:-.02em}
.phead .meta{font-size:13px;color:rgba(255,255,255,.88);font-weight:600;margin-top:6px}
.phead .pbar2{height:8px;background:rgba(255,255,255,.25);border-radius:99px;margin-top:14px;position:relative;overflow:hidden}
.phead .pbar2 i{position:absolute;left:0;top:0;bottom:0;background:#fff;border-radius:99px}
.phead .phasetxt{font-size:12px;color:rgba(255,255,255,.9);font-weight:700;margin-top:8px}
.pghead{background:var(--card);border-radius:20px;padding:18px;box-shadow:var(--shadow);margin-bottom:14px}
.pghead h2{font-size:19px;font-weight:850;letter-spacing:-.02em}
.pghead .meta{font-size:12.5px;color:var(--muted);font-weight:700;margin:4px 0 12px}
.pghead .hb{height:8px;background:var(--track);border-radius:99px;overflow:hidden}
.pghead .hb i{display:block;height:100%;background:linear-gradient(90deg,#E6B083,var(--clay))}
.pghead .hp{font-size:12.5px;font-weight:800;color:var(--clay);margin-top:8px}
.pgwk{background:var(--card);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);margin-bottom:11px}
.pgwk.cur{border:1.5px solid var(--clay-soft)}
.wh{display:flex;align-items:center;justify-content:space-between}
.wt{font-size:14.5px;font-weight:850}
.wb{font-size:11.5px;font-weight:850;padding:5px 10px;border-radius:99px}
.wb.ok{color:var(--green);background:var(--green-soft)}.wb.cur{color:#B5532F;background:var(--clay-soft)}.wb.soon{color:var(--muted);background:#F4F0E9}
.pgses{display:flex;align-items:center;gap:12px;margin-top:13px;padding-top:13px;border-top:1px solid #F0ECE4}
.pgses .ssi{font-size:20px;flex:none}
.sst{flex:1}.sst b{font-size:13.5px;font-weight:850;display:block}.sst span{font-size:11.5px;color:#6f6a5f;font-weight:600}
.ssg{font-size:11.5px;font-weight:850;color:var(--muted);flex:none}
.pgses.today{cursor:pointer}.pgses.today .ssg{color:var(--clay)}
.pgses.click{cursor:pointer}.pgses.click .ssg{color:var(--clay)}
.pgses.click:active{opacity:.6}
.pgses.isdone{opacity:.6}.pgses.isdone .ssg{color:var(--green)}
.planrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.planrow .cinput{max-width:190px}
.seance-done{width:100%;border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:13px;cursor:pointer;color:var(--green);margin-bottom:12px}
.seance-done.on{background:var(--green-soft);border-color:var(--green)}
.impstrava{width:100%;border:none;background:#FC4C02;color:#fff;font-family:inherit;font-weight:850;font-size:14.5px;padding:14px;border-radius:13px;cursor:pointer;margin-bottom:12px}
.fbcard{padding:18px}
.fb-q{font-size:14.5px;font-weight:850;margin-bottom:13px}
.fb-opts{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.fb{border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:800;font-size:13.5px;padding:13px 8px;border-radius:13px;cursor:pointer;color:#5f5a51}
.fb.on{border-color:var(--clay);background:var(--clay-soft);color:#B5532F}
.fb-note{font-size:12.5px;font-weight:800;color:var(--green);background:var(--green-soft);border-radius:12px;padding:11px 13px;margin-top:13px;line-height:1.4}
.fb-hint{font-size:12px;font-weight:700;color:var(--muted);margin-top:12px;line-height:1.4}
.validatebtn{width:100%;border:none;background:var(--green);color:#fff;font-family:inherit;font-weight:850;font-size:15px;padding:15px;border-radius:14px;cursor:pointer}
.valdone{text-align:center}
.valdone>b{font-size:15px;font-weight:850;color:var(--green)}
.fbedit{display:block;width:100%;border:1.5px solid var(--track);background:none;font-family:inherit;font-weight:800;font-size:13.5px;padding:11px;border-radius:12px;cursor:pointer;color:#5f5a51;margin-top:13px}
.mform{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:16px}
.mf label{font-size:11.5px;font-weight:850;color:var(--muted);display:block;margin-bottom:6px}
.mf input{width:100%;border:1.5px solid var(--track);border-radius:12px;background:var(--bg);padding:12px;font-family:inherit;font-size:15px;font-weight:700;text-align:center;color:var(--ink);outline:none}
.mf input:focus{border-color:var(--clay)}
.valstats{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin-top:12px}
.valstats span{font-size:13px;color:#5f5a51;font-weight:700}.valstats b{color:var(--ink);font-weight:850}
.pgtot{text-align:center;font-size:14px;font-weight:850;color:var(--green);background:var(--green-soft);padding:12px;border-radius:14px;margin-bottom:14px}
.pgblk{display:flex;align-items:center;gap:13px;background:var(--card);border-radius:16px;padding:15px;box-shadow:var(--shadow);margin-bottom:11px;border-left:4px solid var(--track)}
.pgblk.warm{border-left-color:#E6B083}.pgblk.run{border-left-color:var(--clay)}.pgblk.cool{border-left-color:var(--green)}
.pgblk .bn{font-size:22px;flex:none}
.pgblk .bt{flex:1}.pgblk .bt b{font-size:14px;font-weight:850;display:block}.pgblk .bt span{font-size:12px;color:#6f6a5f;font-weight:600}
.pgblk .bd{font-size:14px;font-weight:850;color:var(--clay);flex:none}
.pgwatch{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:none;font-family:inherit;font-weight:850;font-size:14.5px;padding:15px;border-radius:14px;cursor:pointer;background:var(--green);color:#fff;margin-top:6px}
.pgwatch.done{background:var(--green-soft);color:var(--green)}
.pgnote{font-size:12px;color:var(--muted);font-weight:700;margin-top:12px;line-height:1.45;text-align:center}

/* ===== Proposer une sortie ===== */
.cfield{margin-bottom:14px}
.cflabel{font-size:12px;font-weight:850;color:#5f5a51;margin-bottom:8px}
.cinput{width:100%;border:1.5px solid var(--track);border-radius:13px;background:var(--card);padding:13px 14px;font-family:inherit;font-size:14.5px;font-weight:600;color:var(--ink);outline:none}
.cinput:focus{border-color:var(--clay)}
.cinput.cta{min-height:80px;resize:none}
.ctwo{display:flex;gap:12px}.ctwo .cfield{flex:1;min-width:0}
.ctwo .cinput{min-width:0;width:100%}
.cinput[type=date],.cinput[type=time]{-webkit-appearance:none;appearance:none;min-width:0}
.cseg{display:flex;flex-wrap:wrap;gap:8px}
.cseg .s{border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:800;font-size:13px;padding:10px 14px;border-radius:12px;cursor:pointer;color:#5f5a51}
.cseg .s.on{border-color:var(--clay);background:var(--clay-soft);color:#B5532F}
.cpublish{width:100%;border:none;font-family:inherit;font-weight:850;font-size:15px;padding:15px;border-radius:14px;cursor:pointer;background:var(--clay);color:#fff;margin-top:6px}
.cc-by{font-size:12.5px;color:#6f6a5f;font-weight:700;margin:-4px 0 6px}.cc-by b{font-weight:850}
.cc-mot{font-size:13px;color:#6f6a5f;font-weight:600;font-style:italic;margin:8px 0 4px}

/* contacts de confiance : ajout */
.ct-pick{width:100%;border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:13px;cursor:pointer;color:var(--green);margin-bottom:14px}
.ct-or{text-align:center;font-size:11.5px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:12px}
.ct-add{width:100%;border:1.5px dashed #D7B9A8;background:var(--clay-soft);font-family:inherit;font-weight:850;font-size:13.5px;padding:12px;border-radius:13px;cursor:pointer;color:#B5532F;margin-top:2px}
.se-del{flex:none;border:none;background:var(--track);width:28px;height:28px;border-radius:50%;cursor:pointer;color:var(--muted);font-weight:850;margin-right:8px}

/* ===== Défis (fidèle maquette) ===== */
.crow{display:flex;align-items:center;gap:14px}
.thumb{width:54px;height:54px;border-radius:16px;flex:none;background:var(--clay-soft);display:flex;align-items:center;justify-content:center}
.thumb svg{width:26px;height:26px;stroke:var(--clay);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.thumb.g{background:var(--green-soft)}.thumb.g svg{stroke:var(--green)}
.crow .ct .l{font-size:12.5px;color:var(--muted);font-weight:700}
.crow .ct h4{font-size:18px;font-weight:850;letter-spacing:-.02em;margin-top:2px}
.pbar{height:8px;background:var(--track);border-radius:99px;position:relative;margin:18px 0 10px;overflow:hidden}
.pbar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#E6B083,#C98A5E)}
.pmeta{display:flex;justify-content:space-between;font-size:13px;font-weight:800}
.pmeta .r{color:var(--muted)}
.mini{display:flex;align-items:center;gap:14px;padding:15px 2px;border-bottom:1px solid #F0ECE4}
.mini:last-child{border-bottom:none}
.mini .mic{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--green-soft);font-size:20px}
.mini .info{flex:1}
.mini .mt2{font-size:14.5px;font-weight:800}
.mini .ms{font-size:12px;color:var(--muted);margin-top:2px;font-weight:600}
.mini .ring{font-size:13px;font-weight:850;color:var(--green)}

/* ===== Events (fidèle maquette) ===== */
.ev{background:var(--card);border-radius:24px;padding:18px;margin-bottom:14px;box-shadow:var(--shadow)}
.ev-head{display:flex;align-items:center;gap:11px;margin-bottom:13px}
.ev-ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--green-soft)}
.ev-ic svg{width:21px;height:21px;stroke:var(--green);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ev-ic.clay{background:var(--clay-soft)}.ev-ic.clay svg{stroke:var(--clay)}
.ev-cat{font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.ev h4{font-size:16.5px;font-weight:850;letter-spacing:-.01em;margin-top:3px}
.ev .when{font-size:12.5px;color:var(--muted);font-weight:700;display:flex;gap:14px;margin:9px 0 16px}
.ev .row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ev .places{font-size:11.5px;color:var(--muted);font-weight:700}
.btn{border:none;cursor:pointer;font-weight:850;font-size:13px;padding:11px 18px;border-radius:14px;color:#fff;background:var(--green);font-family:inherit;white-space:nowrap}
.btn:active{transform:scale(.96)}
.btn.joined{background:var(--green-soft);color:var(--green)}
.prog{display:flex;align-items:center;gap:14px;background:var(--card);border-radius:24px;padding:18px;box-shadow:var(--shadow);text-decoration:none;color:inherit}
.prog-ic{width:46px;height:46px;border-radius:13px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--clay-soft)}
.prog-ic svg{width:23px;height:23px;stroke:var(--clay);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.prog-tx{flex:1}
.prog-t{font-size:16px;font-weight:850;letter-spacing:-.01em}
.prog-s{font-size:12px;color:var(--muted);font-weight:600;margin-top:3px;line-height:1.35}
.prog-go{font-size:18px;color:var(--muted);font-weight:800}

/* ===== Team : Sorties près de toi (format maquette) ===== */
.loc{font-size:12.5px;font-weight:800;color:var(--muted);margin:0 4px 12px}
.run{background:var(--card);border-radius:22px;padding:18px;box-shadow:var(--shadow);margin-bottom:14px}
.run .rh{display:flex;align-items:center;gap:10px;margin-bottom:11px}
.run .rh .av{width:34px;height:34px;font-size:12px}
.run .rby{font-size:12.5px;color:#6f6a5f;font-weight:700}.run .rby b{font-weight:850;color:var(--ink)}
.refbadge{margin-left:auto;font-size:10px;font-weight:850;letter-spacing:.03em;text-transform:uppercase;color:var(--green);background:var(--green-soft);padding:4px 9px;border-radius:99px}
.run h4{font-size:16.5px;font-weight:850;letter-spacing:-.02em;margin-bottom:9px}
.run .when{font-size:12px;color:var(--muted);font-weight:700;display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:14px}
.card>.when{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:#6f6a5f;font-weight:700;line-height:1.5}
.rf{display:flex;align-items:center;justify-content:space-between;gap:12px}
.who{display:flex;align-items:center}
.who .a{width:30px;height:30px;border-radius:50%;background:#EDEBE2;border:2px solid var(--card);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:850;color:#6E7A5E;margin-left:-8px}
.who .a:first-child{margin-left:0}
.who .a.moi{background:linear-gradient(140deg,#3E8A5F,#E0895E);color:#fff}
.who .n{font-size:12px;font-weight:850;color:#5f5a51;margin-left:10px}
.join{flex:none;border:none;font-family:inherit;font-weight:850;font-size:13px;padding:11px 18px;border-radius:14px;cursor:pointer;color:#fff;background:var(--green)}
.join.in{background:var(--green-soft);color:var(--green)}
.join.leave{background:var(--clay-soft);color:#B5532F}
.join.big{display:block;width:100%;margin-top:4px;padding:14px;font-size:14.5px;border-radius:14px}
.inscstatus{text-align:center;font-size:13.5px;font-weight:800;color:var(--green);background:var(--green-soft);border-radius:14px;padding:13px;margin-top:4px}
.rundisc{margin-top:13px;padding-top:13px;border-top:1px solid #F0ECE4;font-size:13px;font-weight:800;color:var(--clay);cursor:pointer}
/* Sortie — détail (overlay) */
.depart{font-size:13px;font-weight:700;color:#33614A;background:var(--green-soft);line-height:1.45}
.depart b{font-weight:850}
.parts{display:flex;flex-wrap:wrap;gap:9px}
.parts .pa{width:42px;height:42px;border-radius:50%;background:#EDEBE2;border:1px solid #E4E1D6;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:850;color:#6E7A5E}
.parts .pa.more{background:var(--track);color:var(--muted)}
.sthread{max-height:none}
/* 🔕 v225 : la ligne « prévenue / en silence » sous le titre de la discussion d'une sortie */
.silence{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--track);border-radius:12px;padding:9px 12px;margin:0 0 10px;font-size:12.5px;font-weight:700;color:var(--muted)}
.silence.off{background:#FAE7DD;border-color:#F3D3C2;color:#8a5a45}
.silence-b{background:none;border:none;font-family:inherit;font-weight:850;font-size:12.5px;color:var(--green);text-decoration:underline;cursor:pointer;padding:0;white-space:nowrap}
.lockmsg{text-align:center;font-size:13.5px;font-weight:700;color:var(--muted);background:var(--card);border:1px dashed var(--track);border-radius:16px;padding:22px 18px;line-height:1.5}

/* ===== Parcours (overlay itinéraires, fidèle maquette) ===== */
.fl{font-size:12px;font-weight:850;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 2px 8px}
.fl.ptop{margin-top:15px}
.inp{width:100%;background:var(--card);border:1px solid var(--track);border-radius:14px;box-shadow:var(--shadow);padding:13px 15px;font-family:inherit;font-size:15px;font-weight:650;color:var(--ink);outline:none}
.inp:focus{border-color:var(--clay)}
.seg[data-pseg]{display:flex;gap:8px}
.seg[data-pseg] .s{flex:1;text-align:center;background:var(--card);border:1px solid var(--track);box-shadow:var(--shadow);border-radius:13px;padding:12px 6px;font-size:13.5px;font-weight:800;cursor:pointer;color:#6f6a5f}
.seg[data-pseg] .s.on{border-color:var(--clay);background:var(--clay-soft);color:#B5532F}
.two.ptop{margin-top:15px}.two .pfield{flex:1}
/* v96 : la durée en deux cases (heures + minutes). L'unité est POSÉE DANS la case, à droite :
   le clavier reste numérique et on lit « 1 h » / « 12 min » sans étiquette au-dessus. */
/* v99 : « un seul parcours à la fois » — le compteur + le bouton pour voir le suivant */
.pnav{display:flex;align-items:center;gap:10px;background:#F1F5EF;border:1px solid #DCE6D8;border-radius:14px;padding:10px 12px;margin-top:12px}
.pnavtx{font-size:12.5px;font-weight:750;color:var(--green)}
.pnavbtn{margin-left:auto;border:none;background:var(--green);color:#fff;font-family:inherit;font-weight:850;font-size:12.5px;padding:9px 13px;border-radius:12px;cursor:pointer}
.duree{display:flex;gap:7px}
.duree .dbox{flex:1;position:relative}
.duree .inp{padding-right:36px;text-align:center;font-weight:800}
.duree .du{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:800;color:var(--muted);pointer-events:none}
/* trois choix (dénivelé) : on resserre un peu le texte pour que ça tienne sur une ligne */
.seg[data-pseg="deniv"] .s{font-size:12.5px;padding:12px 3px}
.pos{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--track);box-shadow:var(--shadow);border-radius:14px;padding:13px 15px;font-size:14.5px;font-weight:700}
.pos .chg{margin-left:auto;font-size:12.5px;font-weight:800;color:var(--clay);cursor:pointer}
.estim{font-size:13px;font-weight:800;color:var(--green);background:var(--green-soft);border-radius:12px;padding:11px 14px;margin:15px 0 4px}
.gen{display:block;width:100%;text-align:center;background:var(--clay);color:#fff;border:none;font-family:inherit;font-weight:850;font-size:16px;padding:16px;border-radius:16px;cursor:pointer;margin:6px 0 4px;box-shadow:0 12px 26px rgba(218,106,69,.32)}
.result{margin-top:8px}
#pmap{height:280px;border-radius:18px;overflow:hidden;border:1px solid var(--track);box-shadow:var(--shadow);background:#E8EDE6}
.genwait{text-align:center;padding:22px;color:var(--muted);font-weight:700;font-size:13.5px}
.rstats{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.rstat{flex:1;min-width:70px;background:var(--card);border:1px solid var(--track);border-radius:14px;padding:12px;text-align:center;box-shadow:var(--shadow)}
.rstat b{font-size:17px;font-weight:850;display:block;letter-spacing:-.02em}.rstat span{font-size:10.5px;color:var(--muted);font-weight:700}
.surface{font-size:12.5px;color:var(--muted);font-weight:700;margin-bottom:14px}
.exp{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;background:var(--ink);color:#fff;border:none;font-family:inherit;font-weight:850;font-size:15px;padding:15px;border-radius:14px;cursor:pointer;margin-bottom:10px}
.exp svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.exp.light{background:var(--card);color:var(--ink);border:1px solid var(--track)}.exp.light svg{stroke:var(--ink)}
.pnote{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:2px;text-align:center;line-height:1.4}
.psec{font-size:13px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:24px 2px 12px}
.known{display:flex;align-items:center;gap:13px;background:var(--card);border:1px solid var(--track);border-radius:16px;padding:14px;box-shadow:var(--shadow);margin-bottom:11px;cursor:pointer}
.known .ki{width:44px;height:44px;border-radius:12px;background:var(--green-soft);display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.known .kt{flex:1}.known .kt b{font-size:14.5px;font-weight:800;display:block}.known .kt span{font-size:12px;color:var(--muted);font-weight:700}
.known .kg{color:var(--muted);font-size:18px;font-weight:800}
.startm{width:22px;height:22px;border-radius:50%;background:var(--green);border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.waterm{width:26px;height:26px;border-radius:50%;background:#3FA7D6;border:2.5px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;font-size:13px}

/* ===== Connexion / onboarding (gate) ===== */
.gate{position:fixed;inset:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;background:var(--bg);z-index:90;display:none;overflow-y:auto}
.gate.show{display:block}
.gate-inner{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:max(28px,env(safe-area-inset-top)) 24px calc(28px + env(safe-area-inset-bottom))}
.gate-logo{display:block;width:150px;height:150px;object-fit:contain;margin:0 auto 6px}
.gate-brand{font-size:30px;font-weight:900;letter-spacing:.02em;color:var(--gold);text-align:center}
.gate-tag{font-size:13.5px;font-weight:700;color:#6f6a5f;text-align:center;margin:8px 0 26px}
.gate-card{background:var(--card);border-radius:26px;padding:24px 20px;box-shadow:var(--shadow)}
.gate-card.center{text-align:center}
.gate-card h2{font-size:22px;font-weight:850;letter-spacing:-.02em}
.gate-p{font-size:13.5px;font-weight:600;color:#4f4a42;line-height:1.5;margin:8px 0 18px}
.gate-emoji{font-size:46px;margin-bottom:6px}
.gate-card .inp{margin-bottom:12px}
.gate-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:none;font-family:inherit;font-weight:850;font-size:15px;padding:15px;border-radius:14px;cursor:pointer;background:var(--clay);color:#fff;margin-bottom:10px}
.gate-btn.google{background:#fff;color:var(--ink);border:1.5px solid var(--track)}
.gate-btn.google b{color:#4285F4;font-size:17px}
.gate-btn.strava{background:#FC4C02}
.gate-or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;font-weight:800;margin:6px 0 12px}
.gate-or:before,.gate-or:after{content:"";flex:1;height:1px;background:var(--track)}
.gate-skip{display:block;width:100%;border:none;background:none;font-family:inherit;font-weight:800;font-size:13.5px;color:var(--muted);cursor:pointer;padding:10px;margin-top:2px}
.gbtn{display:flex;justify-content:center;min-height:44px;margin-bottom:10px}
.gate-note{font-size:11.5px;color:var(--muted);font-weight:700;text-align:center;margin-top:8px;line-height:1.4}

/* ===== Home tour (coachmarks) ===== */
.tour{position:fixed;inset:0;width:100%;z-index:88;display:none;pointer-events:none}
.tour.show{display:block}
.tour-spot{position:relative;z-index:90;box-shadow:0 0 0 9999px rgba(18,16,12,.62);border-radius:18px}
.tourcatch{position:fixed;inset:0;z-index:92;pointer-events:auto}
/* v95 : « fenêtre de démonstration ». Certaines étapes de la démo montrent une VRAIE fenêtre de
   l'app (celle qui propose de partager la sortie, celle qui propose les photos). Le modal vit
   normalement en z-index 80, donc SOUS le voile sombre de la démo : on le remonte au-dessus du
   voile, mais toujours sous la bulle d'explication (95). Ses boutons ne font qu'avancer la démo :
   rien n'est partagé, rien n'est envoyé. */
.modal.tourdemo{z-index:93}
/* v96 — CORRECTION du bug signalé par Laurane : « Suivant » était grisé et impossible à toucher.
   POURQUOI : `.tour` a un z-index (88) et une position fixe → il crée un CONTEXTE D'EMPILEMENT.
   Le z-index 95 de la bulle ne vaut donc QU'À L'INTÉRIEUR de `.tour` : vue de l'extérieur, toute
   la démo reste à 88, donc SOUS la fenêtre de démonstration (93). Le voile de la fenêtre passait
   par-dessus la bulle — d'où l'aspect grisé — et avalait le toucher sur « Suivant ».
   FIX : pendant une étape « fenêtre de démonstration », on remonte TOUT le bloc démo à 94.
   ⚠️ Règle à retenir : un z-index ne se compare jamais à travers deux contextes d'empilement. */
.tour.overdemo{z-index:94}
.tourtip{position:fixed;left:50%;transform:translateX(-50%);width:calc(100% - 32px);max-width:432px;bottom:calc(100px + env(safe-area-inset-bottom));z-index:95;background:var(--card);border-radius:22px;padding:20px;box-shadow:0 18px 40px rgba(0,0,0,.30);pointer-events:auto}
.tourtip.top{bottom:auto;top:calc(84px + env(safe-area-inset-top))}
.tourtab{display:inline-block;font-size:11px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--green);background:var(--green-soft);padding:5px 11px;border-radius:99px;margin-bottom:10px}
.tourtip h4{font-size:17px;font-weight:850;letter-spacing:-.01em}
.tourtip p{font-size:13.5px;color:#5f5a51;font-weight:600;line-height:1.45;margin-top:7px}
.tourdots{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}
.tourdots i{width:7px;height:7px;border-radius:50%;background:#D8D2C7}
.tourdots i.on{background:var(--clay);width:20px;border-radius:99px}
.tourbtns{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}
.tourskip2{border:none;background:none;font-family:inherit;font-weight:800;font-size:13px;color:var(--muted);cursor:pointer;padding:6px}
.tournext{background:var(--green);color:#fff;border:none;font-family:inherit;font-weight:850;font-size:14px;padding:11px 22px;border-radius:14px;cursor:pointer}
.tourarrow{position:fixed;z-index:97;width:38px;height:38px;border-radius:50%;background:var(--clay);box-shadow:0 6px 16px rgba(218,106,69,.55);display:flex;align-items:center;justify-content:center;pointer-events:none}
.tourarrow svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.tourarrow.down{animation:arrbobd 0.85s ease-in-out infinite}
.tourarrow.up{animation:arrbobu 0.85s ease-in-out infinite}
@keyframes arrbobd{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
@keyframes arrbobu{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* ===== Profil + déconnexion ===== */
.profhead{display:flex;align-items:center;gap:14px}
.nameedit{margin-left:auto;flex:none;border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:850;font-size:12.5px;padding:8px 13px;border-radius:11px;cursor:pointer;color:var(--clay)}
.photorow{display:flex;gap:10px;margin-bottom:4px}.photorow .subbtn{flex:1}
.photodel{flex:none;border:1.5px solid var(--track);background:none;font-family:inherit;font-weight:850;font-size:13px;padding:0 16px;border-radius:13px;cursor:pointer;color:var(--muted)}
.pp.big{width:60px;height:60px;font-size:21px}
.prof-id b{font-size:17px;font-weight:850;display:block}.prof-id span{font-size:12.5px;color:var(--muted);font-weight:700}
.subrow{display:flex;align-items:center;justify-content:space-between;gap:10px}
.subrow b{font-size:15px;font-weight:850;display:block}.subrow span{font-size:12.5px;color:var(--muted);font-weight:700}
.subtag{flex:none;font-size:11px;font-weight:850;color:var(--green);background:var(--green-soft);padding:5px 11px;border-radius:99px}
.subnote{font-size:12px;color:var(--muted);font-weight:700;line-height:1.45;margin:12px 0 14px}
.subbtn{width:100%;border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:13px;cursor:pointer;color:var(--ink)}
.connrow{display:flex;align-items:center;gap:13px}
.conn-ic{width:42px;height:42px;border-radius:12px;background:#FFE9DD;display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.conn-t{flex:1}.conn-t b{font-size:14.5px;font-weight:850;display:block}.conn-t span{font-size:12px;color:var(--muted);font-weight:700}
.conn-btn{flex:none;border:none;background:#FC4C02;color:#fff;font-family:inherit;font-weight:850;font-size:13px;padding:10px 16px;border-radius:12px;cursor:pointer}
.logoutbtn{width:100%;border:1.5px solid var(--track);background:none;font-family:inherit;font-weight:850;font-size:14px;padding:14px;border-radius:13px;cursor:pointer;color:#B5443A;margin-top:22px}
.welcome-tee{font-size:54px;text-align:center;margin:6px 0 4px}

/* ===== Modal (pop-ups) ===== */
.modal{position:fixed;inset:0;z-index:80;display:none;align-items:flex-end;justify-content:center}
.modal.show{display:flex}
.modal-back{position:absolute;inset:0;background:rgba(28,26,21,.45)}
/* v120 — LA FENÊTRE D'UNE COURSE ÉTAIT COUPÉE EN HAUT.
   Les fenêtres sont collées au BAS de l'écran (.modal{align-items:flex-end}). Quand le contenu
   dépassait la hauteur de l'écran — une course avec sa discussion, son groupe WhatsApp et le
   t-shirt — tout le début (le nom de la course, la date, « Je participe ») partait au-dessus du
   bord, sans aucun moyen d'y revenir. On plafonne la hauteur et on rend la fenêtre défilante. */
.modal-card{position:relative;z-index:1;width:100%;max-width:480px;background:var(--card);border-radius:26px 26px 0 0;padding:24px 20px calc(28px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.2);animation:slideup .22s ease;max-height:90vh;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.modal.center{align-items:center}
.modal.center .modal-card{width:auto;max-width:400px;margin:0 20px;border-radius:26px;padding:26px 22px;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:popin .22s ease}
@keyframes popin{from{transform:scale(.92);opacity:.4}to{transform:scale(1);opacity:1}}
@keyframes slideup{from{transform:translateY(40px);opacity:.6}to{transform:translateY(0);opacity:1}}
.modal-t{font-size:19px;font-weight:850;letter-spacing:-.02em;text-align:center}
.modal-sub{font-size:12.5px;color:var(--muted);font-weight:700;text-align:center;margin:6px 0 18px}
.agbtn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:850;font-size:14.5px;padding:14px;border-radius:14px;cursor:pointer;text-decoration:none;color:var(--ink);margin-bottom:10px}
.agbtn.g{border-color:#C9DCC9;background:#F0F6F0}.agbtn.o{border-color:#C9D6E8;background:#EEF3FA}.agbtn.a{border-color:var(--track)}
.modal-note{font-size:11.5px;color:var(--muted);font-weight:700;line-height:1.45;margin:6px 2px 16px;text-align:center}
.modal-note b{color:#5f5a51}
.modal-close{width:100%;border:none;font-family:inherit;font-weight:850;font-size:14px;padding:13px;border-radius:14px;cursor:pointer;background:var(--track);color:#5f5a51}

/* ===== Proposer une sortie : autocomplétion adresse ===== */
.csuggest{margin-top:8px;background:var(--card);border:1.5px solid var(--track);border-radius:13px;overflow:hidden;display:none}
.csuggest.show{display:block}
.csugg{display:block;width:100%;text-align:left;border:none;border-bottom:1px solid #F0ECE4;background:none;font-family:inherit;font-size:13.5px;font-weight:700;color:var(--ink);padding:12px 14px;cursor:pointer}
.csugg:last-child{border-bottom:none}
.csugg span{display:block;font-size:11.5px;color:var(--muted);font-weight:600;margin-top:2px}
.clocated{font-size:12.5px;font-weight:800;color:var(--green);margin-top:8px}
/* v180 : la petite phrase sous un champ (précision du rendez-vous, bouton éteint) */
.chint{font-size:11.5px;color:var(--muted);font-weight:650;margin-top:7px;line-height:1.5}
.cpublish[disabled]{background:#DCD5C9;cursor:default}
.cc-rdv{font-size:12.5px;color:#6f6a5f;font-weight:650;margin:8px 0 2px}
/* v181 : le lieu conservé dans « Modifier ma sortie », avec son lien « changer » */
.edlieu{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid var(--track);border-radius:13px;background:var(--card);padding:13px 14px;font-size:14.5px;font-weight:600;color:var(--ink)}
.edlieu span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.edchg{flex:none;border:none;background:none;font-family:inherit;font-size:13px;font-weight:850;color:var(--clay);cursor:pointer;padding:0}
/* v182 : la ou les distances d'une course, sur sa carte (idée de Gwenn) */
.cdistk{display:inline-block;background:var(--green-soft);color:var(--green);font-size:11px;font-weight:850;border-radius:99px;padding:2px 9px;margin-left:6px;vertical-align:middle;white-space:nowrap}
/* v182 : les cases à cocher des distances peuvent en avoir plusieurs d'allumées */
#crs-dist .s.on{border-color:var(--green);background:var(--green-soft);color:var(--green)}
/* v182 : les distances proposées quand une tortue ajoute celle qui manque à une course */
.sdist{border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:800;font-size:13px;padding:10px 14px;border-radius:12px;cursor:pointer;color:#5f5a51}
.sdist.on{border-color:var(--clay);background:var(--clay-soft);color:#B5532F}
/* v182 : chercher une course par distance (idée de Laurane) */
.csdist{border:1.5px solid var(--track);background:var(--card);font-family:inherit;font-weight:800;font-size:12.5px;padding:8px 13px;border-radius:11px;cursor:pointer;color:#5f5a51}
.csdist.on{border-color:var(--green);background:var(--green-soft);color:var(--green)}

/* Nav — TOUJOURS visible, même sur les sous-écrans (z-index au-dessus des overlays) */
.nav{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:480px;height:calc(74px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);
  background:rgba(238,233,225,.94);backdrop-filter:blur(16px);border-top:1px solid #E4DFD6;
  display:flex;justify-content:space-around;align-items:flex-start;padding-top:12px;z-index:70}
.nav button{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;font-weight:700;color:#B4ABA0;width:70px;font-family:inherit}
.nav button svg{width:24px;height:24px;stroke:#B4ABA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nav button.on{color:var(--ink)}.nav button.on svg{stroke:var(--green)}

/* ============================================================
   ÉCRAN MOYEN (520 à 699 px) : la colonne du téléphone, posée au milieu.
   🖥️ v229 : la tablette (700 à 1 023 px) et l'ordinateur (1 024 px et plus) sont
   tout en BAS du fichier, pour gagner dans la cascade. Sous 700 px, rien n'a bougé.
   ============================================================ */
@media(min-width:520px) and (max-width:699px){
  html{background:radial-gradient(circle at 30% 12%,#E7E1D6,#D2CBBF)}
  body{box-shadow:0 0 0 1px rgba(0,0,0,.04), 0 16px 60px rgba(46,40,30,.20)}
}

/* ===== Boutique (app) ===== */
.bq-item{display:flex;align-items:center;gap:14px;background:var(--card,#fff);border:1px solid var(--line,#ECE7DE);border-radius:16px;padding:13px 15px;box-shadow:0 8px 24px rgba(46,40,30,.06);margin-bottom:12px}
.bq-ic{width:54px;height:54px;border-radius:13px;flex:none;display:flex;align-items:center;justify-content:center;font-size:24px;background:linear-gradient(150deg,#FAE7DD,#F4CDBC)}
.bq-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bq-tx b{font-size:15px;font-weight:800;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bq-price{font-size:13px;color:var(--clay,#DA6A45);font-weight:850}
.bq-desc{font-size:12px;color:var(--muted,#8E877C);font-weight:600}
.bq-tag{font-size:9.5px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--clay,#DA6A45);padding:3px 8px;border-radius:6px}
.bq-go{flex:none;background:var(--green,#2E6B4B);color:#fff;font-weight:850;font-size:13px;padding:10px 15px;border-radius:11px;text-decoration:none}
.bq-go.off{background:#D8D2C7;color:#fff}

/* ===== #11 Format app verrouillé : aucun glissement horizontal ===== */
html,body{max-width:100%;overflow-x:hidden}
.view,.overlay,.gate,.modal{overflow-x:hidden}
.view{max-width:100%}
/* l'input du chat doit pouvoir rétrécir pour que "Envoyer" reste visible */
.supinput,.sinput,.ideainput,input,textarea{min-width:0;max-width:100%}
.inputbar,.replybar{width:100%;max-width:100%}
.inputbar>*{min-width:0}
/* sécurité : rien ne dépasse la largeur de l'écran */
img,canvas,.leaflet-container{max-width:100%}

/* ===== Profil : mise en page responsive (pas de débordement, texte tronqué proprement) ===== */
.profhead{flex-wrap:nowrap}
.pp.big{flex:none}
.prof-id{flex:1;min-width:0}
.prof-id b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.prof-id span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.nameedit{white-space:nowrap}
.photorow .subbtn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.connrow{flex-wrap:nowrap}
.conn-t{min-width:0}
.conn-t b,.conn-t span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.conn-btn,.nameedit,.photodel{white-space:nowrap}

/* ===== Profil : ligne Strava — bouton pleine largeur en dessous (pas de chevauchement mobile) ===== */
.connrow{flex-wrap:wrap;row-gap:10px}
.conn-t{flex:1 1 auto;min-width:0}
.conn-btn{flex:1 1 100%;width:100%;text-align:center}

/* ===== Photo de profil : petit crayon d'édition dans le rond ===== */
.pp-wrap{position:relative;flex:none;display:inline-flex}
.pp-edit{position:absolute;right:-3px;bottom:-3px;width:27px;height:27px;border-radius:50%;background:#fff;border:1.5px solid var(--line,#ECE7DE);box-shadow:0 2px 7px rgba(46,40,30,.18);display:flex;align-items:center;justify-content:center;font-size:13px;line-height:1;cursor:pointer;padding:0}
.pp-edit:active{transform:scale(.94)}

/* ===== Toast (notification intégrée, remplace les popups) ===== */
.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(16px);background:var(--ink,#1C1A15);color:#fff;font-weight:750;font-size:14px;line-height:1.4;padding:13px 18px;border-radius:15px;box-shadow:0 12px 34px rgba(46,40,30,.32);z-index:200;max-width:86%;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s, transform .25s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ===== Verrou anti-décalage horizontal (format app figé) ===== */
html{overflow-x:clip}
body{overflow-x:clip;max-width:100%;position:relative}
/* le doigt ne peut faire défiler que verticalement (aucun glissement gauche-droite) */
html,body,.view,.overlay,.gate{touch-action:pan-y}
.view>*,.opad>*{max-width:100%}

/* ===== VRAIE APP FIGÉE : la page ne bouge JAMAIS, seul le contenu défile =====
   La fenêtre (body) est verrouillée ; c'est l'écran (.view) qui devient la zone
   de défilement — comme une application native. Fini l'effet élastique iOS. */
html,body{height:100%;overflow:hidden;overscroll-behavior:none;position:fixed;inset:0;width:100%}
.view{
  position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:480px;overflow-y:auto;overflow-x:clip;
  -webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;
  min-height:0;
}
.overlay,.gate{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;overflow-x:clip}

/* ===== La barre d'écriture (chat) reste au-dessus du menu du bas ===== */
.overlay .inputbar{position:sticky;bottom:calc(74px + env(safe-area-inset-bottom));z-index:5;border-radius:14px}

/* ===== Chat : aucune bulle ne peut élargir le fil (mots très longs coupés proprement) ===== */
.thread{max-width:100%}
.msg{min-width:0}
.bubble{min-width:0;max-width:100%}
.bubble .tx,.bubble .nm{overflow-wrap:anywhere;word-break:break-word}

/* ===== Anti-zoom iPhone : Safari zoome tout seul si un champ fait moins de 16px ===== */
.supinput,.sinput,.cinput,.inp,.ideainput,.mf input,.t-inputs input{font-size:16px}

/* ===== Installation : doigt animé qui pointe le vrai bouton Partager ===== */
.instpoint{position:fixed;z-index:400;font-size:40px;pointer-events:none;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}
.instpoint.safari{left:50%;transform:translateX(-50%);bottom:calc(6px + env(safe-area-inset-bottom));animation:arrbobd .8s ease-in-out infinite}
.instpoint.chrome{right:14px;top:6px;animation:arrbobu .8s ease-in-out infinite}
/* v119 : Android n'avait AUCUNE flèche — juste une liste. Le menu ⋮ est en haut à droite. */
.instpoint.android{right:10px;top:4px;animation:arrbobu .8s ease-in-out infinite}
.instpoint.firefox{right:14px;bottom:calc(8px + env(safe-area-inset-bottom));animation:arrbobd .8s ease-in-out infinite}
.instswitch{margin-top:12px;font-size:13px;font-weight:600;color:var(--muted,#8E877C)}
.instswitch .ilink{color:var(--green,#2E6B4B);font-weight:800;text-decoration:underline;cursor:pointer}
.cancelnotif{cursor:pointer}
.se-depart{display:flex;align-items:center;gap:12px}
.se-depart.on{background:var(--green-soft,#E4EFE8)}
.se-depart .ft{flex:1}
.se-depart-btn{flex:0 0 auto;border:none;background:var(--green,#2E6B4B);color:#fff;font-weight:800;font-size:13.5px;padding:11px 16px;border-radius:12px;cursor:pointer}
.se-depart-btn.ret{background:var(--clay,#DA6A45)}
.jentry.tap{cursor:pointer}
.badgepop{font-size:62px;line-height:1;margin:4px 0 8px;display:inline-block;animation:badgepop .6s cubic-bezier(.2,1.5,.4,1)}
@keyframes badgepop{0%{transform:scale(0) rotate(-25deg);opacity:0}60%{transform:scale(1.25) rotate(10deg)}100%{transform:scale(1) rotate(0);opacity:1}}
.radius{background:var(--card);border-radius:16px;padding:12px 16px 8px;box-shadow:var(--shadow);margin:2px 0 12px}
.radius-top{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:var(--muted)}
.radius-top b{color:var(--green);font-weight:850}
.radius input[type=range]{width:100%;margin:8px 0 2px;accent-color:var(--green)}
.radius-scale{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:600}
.delrun{margin-left:auto;background:none;border:none;font-size:18px;cursor:pointer;opacity:.7;padding:4px}
.delrun:hover{opacity:1}
.heart.liked{color:var(--clay,#DA6A45);font-weight:800}

/* ===== Pastille de notification (réponse du support) ===== */
.nav button{position:relative}
.navdot{position:absolute;top:8px;right:16px;width:10px;height:10px;border-radius:50%;background:#D9534F;border:2px solid var(--bg);display:none}
.navdot.show{display:block}
.supnotif{display:flex;align-items:center;gap:12px;background:#FBE9E4;border:1.5px solid #F1C6B6;border-radius:18px;padding:14px 16px;margin-bottom:14px;cursor:pointer}
.supnotif .sni{width:40px;height:40px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:19px;flex:none}
.supnotif b{font-size:14px;font-weight:850;color:#B5532F;display:block}
.supnotif span{font-size:12px;color:#9a6a4a;font-weight:700}

/* ===== ALARME (plein écran, un seul bouton STOP) ===== */
.alarmscreen{position:fixed;inset:0;z-index:300;background:#C0392B;display:none;flex-direction:column;align-items:center;justify-content:center;gap:26px;text-align:center;padding:30px}
.alarmscreen.show{display:flex}
.alarmscreen .ae{font-size:74px;animation:alarmpulse .5s ease-in-out infinite}
.alarmscreen h2{color:#fff;font-size:26px;font-weight:900;letter-spacing:-.02em}
.alarmscreen p{color:rgba(255,255,255,.9);font-size:14px;font-weight:700;max-width:300px;line-height:1.5}
.alarmstop{border:none;background:#fff;color:#C0392B;font-family:inherit;font-weight:900;font-size:20px;padding:22px 54px;border-radius:99px;cursor:pointer;box-shadow:0 14px 40px rgba(0,0,0,.35)}
@keyframes alarmpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes alarmflash{0%,100%{background:#C0392B}50%{background:#8E2318}}
.alarmscreen.show{animation:alarmflash .6s linear infinite}

/* ===== Danger : écran d'action ===== */
.dangerbtns{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.dangerbtns a,.dangerbtns button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:none;font-family:inherit;font-weight:850;font-size:15.5px;padding:16px;border-radius:15px;cursor:pointer;text-decoration:none}
.dgr-call{background:#D9534F;color:#fff}
.dgr-sms{background:#fff;color:#B5532F;border:2px solid #F1C6B6!important}

/* ===== v84 : PARCOURS EN PLEIN ÉCRAN (idée de Magali — suivre son parcours en courant) ===== */
#pfullscreen{position:fixed;inset:0;z-index:120;background:#F6F3ED;display:none}
#pfullscreen.show{display:block}
#pfullmap{position:absolute;inset:0;z-index:1}
.pfull-top{position:absolute;top:0;left:0;right:0;z-index:1200;display:flex;align-items:center;gap:10px;
  padding:calc(env(safe-area-inset-top,0px) + 12px) 14px 12px;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.75) 70%,transparent)}
.pfull-top button{width:42px;height:42px;flex:none;border:none;border-radius:50%;background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.16);font-size:18px;font-family:inherit;cursor:pointer;color:var(--ink)}
.pfull-info{flex:1;text-align:center;line-height:1.15}
.pfull-info b{display:block;font-size:20px;font-weight:900;color:var(--ink)}
.pfull-info span{font-size:12.5px;color:var(--muted);font-weight:700}
.pfull-hint{position:absolute;left:14px;right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:1200;
  background:rgba(255,255,255,.96);border-radius:14px;padding:11px 14px;text-align:center;
  font-size:12.5px;font-weight:700;color:var(--muted);box-shadow:0 2px 12px rgba(0,0,0,.12)}
.mem{width:20px;height:20px;border-radius:50%;background:#2F6FE0;border:3px solid #fff;
  box-shadow:0 0 0 6px rgba(47,111,224,.22),0 2px 6px rgba(0,0,0,.3)}

/* v85 : la croix de fermeture reste TOUJOURS visible et cliquable par-dessus la carte
   (Leaflet monte ses calques jusqu'à z-index 800 : la barre passait dessous au bout d'une seconde) */
#pfullscreen .leaflet-container,#pfullscreen .leaflet-pane,#pfullscreen .leaflet-top,#pfullscreen .leaflet-bottom{z-index:1 !important}
.pfull-top button{position:relative;z-index:1201}

/* v89 : TOUS les champs où on échange (sortie, course, forum, mur, support, idées).
   ⚠️ v89 bis : le bouton ➤ avait perdu sa hauteur (aucune hauteur définie + alignement en bas)
   et le champ était trop court pour son texte d'aide, qui se retrouvait coupé. */
textarea.chatbox{resize:none;line-height:1.45;max-height:150px;overflow-y:auto;min-height:50px;
  padding:14px 15px;font-size:16px}
textarea.ideainput.chatbox{min-height:96px;max-height:210px}
.inputbar{align-items:flex-end;gap:10px}
.inputbar textarea.chatbox{flex:1}

/* ═══ v118 — L'ÉCRAN DE COURSE ═══════════════════════════════════════════════
   Sombre volontairement : l'écran doit rester allumé toute la sortie (le GPS
   d'une app web s'arrête dès que le téléphone se verrouille), donc on économise
   la batterie. Gros chiffres, lisibles d'un coup d'œil en courant. */
/* v119 — POURQUOI « TERMINER » NE FAISAIT RIEN.
   L'écran de course est en z-index 1300. La fenêtre de confirmation (.modal) est en 80 et les
   messages (.toast) en 200 : les deux s'ouvraient DERRIÈRE l'écran de course, donc invisibles.
   La tortue touchait « Terminer », la fenêtre s'ouvrait bel et bien… sous un mur noir. Même
   chose pour « Sortie trop courte ». On remonte la fenêtre et les messages au-dessus. */
#runscreen{position:fixed;inset:0;z-index:1300;display:none;background:#14150F;color:#F5F2EA}
/* On ne remonte la fenêtre QUE pendant une course (classe posée sur <body>) : ailleurs, rien
   ne bouge — surtout pas pendant l'inscription, où le voile de connexion doit rester devant. */
body.enrun .modal{z-index:1400}
body.enrun .toast{z-index:1500}
/* 🛡️ v233 — PENDANT UNE SORTIE, LE BOUCLIER ET L'ALARME PASSENT DEVANT L'ÉCRAN DE COURSE
   (validé par Laurane le 02/10). Avant : l'écran de course (1300) cachait le bouclier ouvert par le
   raccourci (60) et l'écran STOP de l'alarme (300) ; la sirène sonnait sans bouton pour l'arrêter.
   Ordre pendant une sortie : course 1300 < bouclier 1350 < fenêtres 1400 (Danger…) < alarme 1450 < messages 1500. */
body.enrun.bouclier-ouvert .overlay{z-index:1350;bottom:0}
body.enrun .alarmscreen{z-index:1450}
#runscreen.show{display:block}
#runscreen .runbox{display:flex;flex-direction:column;height:100%;padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom))}
#runscreen .runtop{display:flex;align-items:center;gap:10px;margin-bottom:14px}
#runscreen .runstats{display:flex;gap:9px;margin-top:20px}
#runscreen .rst{flex:1;background:#20221A;border-radius:15px;padding:13px 6px;text-align:center}
#runscreen .rst b{display:block;font-size:20px;font-weight:850;letter-spacing:-.01em}
#runscreen .rst span{display:block;font-size:9px;color:#8B8F80;font-weight:800;margin-top:3px;letter-spacing:.04em}
#runscreen .runsig{display:flex;align-items:center;gap:7px;background:#1B2B1F;border-radius:12px;padding:10px 12px;margin-top:14px;font-size:12px;color:#8FB996;font-weight:750}
#runscreen .runbtns{margin-top:auto;display:flex;gap:10px;padding-top:16px}
#runscreen .runb{flex:1;border:none;font-family:inherit;font-weight:850;font-size:15px;padding:17px;border-radius:16px;cursor:pointer}
#runscreen .runb.gris{background:#2A2D22;color:#F5F2EA}
#runscreen .runb.clay{background:#DA6A45;color:#fff}
/* le bouton « Je pars courir » de l'accueil */
.runstart{display:flex;align-items:center;gap:12px;width:100%;border:none;background:var(--clay);color:#fff;border-radius:18px;padding:15px 16px;font-family:inherit;cursor:pointer;text-align:left;box-shadow:0 10px 24px rgba(218,106,69,.28);margin-top:12px}
.runstart .re{font-size:23px}
.runstart b{display:block;font-size:15px;font-weight:850}
.runstart span{display:block;font-size:11.5px;opacity:.92;font-weight:650;margin-top:1px}

/* v119 ter — bandeau « complète ton profil » (accueil, tant que photo/prénom manquent) */
.profnudge{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#FFF3E6,#FDE8D6);border:1px solid #F3D9BE;border-radius:16px;padding:13px 14px;margin:0 0 12px;cursor:pointer}
.profnudge .pn-ic{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #F0DCC4;display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.profnudge .pn-pp{width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center}
.profnudge .pn-tx{flex:1;min-width:0}
.profnudge .pn-tx b{display:block;font-size:14px;font-weight:850;color:#8A4A1C}
.profnudge .pn-tx span{display:block;font-size:11.5px;font-weight:650;color:#A2683C;line-height:1.45;margin-top:2px}
.profnudge .pn-go{font-size:22px;color:#C98A55;font-weight:800;flex:none}

/* ── v122 — l'arrivée : confettis, drapeau, carte en mode « objectif atteint » ── */
.confettis{position:fixed;inset:0;z-index:1600;pointer-events:none;overflow:hidden}
.confettis .cf{position:absolute;top:-30px;width:9px;height:14px;opacity:0;border-radius:2px;animation-name:cfchute;animation-timing-function:linear;animation-fill-mode:forwards}
@keyframes cfchute{0%{opacity:0;transform:translateY(-40px) rotate(0deg)}8%{opacity:1}100%{opacity:.9;transform:translateY(105vh) rotate(720deg)}}
.card.journey.fini{background:linear-gradient(150deg,#F3F8F1,#FFF9EF);border-color:#CFE3CB}
.badge-fini{display:inline-flex;align-items:center;gap:6px;background:#2E6B4B;color:#fff;font-size:11px;font-weight:850;padding:5px 11px;border-radius:99px;letter-spacing:.03em}
.trail .drapeau{position:absolute;right:-2px;top:-6px;font-size:17px}
.jnote.fini{color:#2E6B4B;font-weight:850}

/* v125 — le décompte de la promo 24 h dans la fenêtre */
.chu{background:#2E3128;color:#fff;border-radius:11px;padding:7px 12px;min-width:56px;display:flex;flex-direction:column;align-items:center;line-height:1;font-variant-numeric:tabular-nums}
.chu b{font-size:21px;font-weight:900}
.chu span{font-size:8.5px;font-weight:800;letter-spacing:.06em;opacity:.75;margin-top:3px;text-transform:uppercase}

/* v127 — le « ⋯ » pour modifier ou supprimer une sortie */
.jentry{position:relative}
.jentry .jmore{position:absolute;right:-6px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);font-size:20px;font-weight:900;line-height:1;padding:6px 8px;cursor:pointer;border-radius:10px}
.jentry .jmore:active{background:var(--soft,#F5F1EA)}
.jentry .jkm{margin-right:22px}

/* ============================================================================
   🐢 v153 — L’ANNUAIRE DES TORTUES + LA FICHE D'UNE TORTUE (coach uniquement)
   ============================================================================ */
/* « pas de localisation » se repère d'un coup d'œil, avant même d'écrire */
.cmsansloc{color:#B9433A;font-weight:800}
/* une tortue à qui Laurane n'a encore jamais écrit */
.cmnew{background:#FFF3DA;color:#8A6100;font-size:10.5px;font-weight:850;border-radius:99px;padding:3px 9px;white-space:nowrap;flex:none}
/* les pastilles au-dessus de la zone de saisie, dans une conversation */
.cmchips{display:flex;gap:7px;flex-wrap:wrap;margin:0 2px 8px}
/* la liste des messages tout prêts, dépliée */
.cmmodeles{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;margin:0 2px 10px;box-shadow:var(--shadow)}
.cmmt{font-size:11.5px;color:var(--muted);font-weight:700;line-height:1.6;margin-bottom:9px}
.cmmod{display:block;width:100%;text-align:left;background:var(--soft);border:1px solid var(--line);color:var(--ink);font-family:inherit;font-size:13px;font-weight:800;border-radius:11px;padding:11px 13px;margin-bottom:7px;cursor:pointer}
.cmmod:last-child{margin-bottom:0}
.cmmod:active{background:#EFE9DF}
/* la petite fiche qui s'ouvre depuis le mur */
.fichepic{width:64px;height:64px;border-radius:50%;margin:0 auto 10px;background-size:cover;background-position:center;background-color:#EDEBE2;border:1px solid #E4E1D6}
.fichepic.vide{display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:850;color:#6E7A5E}
.fiche{margin:12px 0 4px;text-align:center}
.fichel{font-size:13.5px;font-weight:700;color:var(--muted);line-height:1.9}
.fichel b{color:var(--ink);font-weight:850}
/* le chiffre « N tortues actives » devient touchable — chez la coach seulement */
.stat.clic{cursor:pointer}
.stat.clic:active{opacity:.65}
/* v153 : les pastilles restent collées à la zone de saisie, en bas de l'écran.
   Sans ça, dans une longue conversation, il fallait remonter pour les retrouver.
   La règle ne s'applique QU'ICI : les autres écrans à barre de saisie (support,
   forum, sorties) ne bougent pas. */
.cmbarre{position:sticky;bottom:calc(74px + env(safe-area-inset-bottom));z-index:5;background:var(--bg);padding-top:6px}
.overlay .cmbarre .inputbar{position:static;bottom:auto}

/* ===== v160 — LA QUESTION DU FORUM, ENFIN LISIBLE =====
   Retour de Laurane (24 août) : « on lit mal la question de base ».
   La question était en 13 px gris clair (var(--muted)) alors que les réponses des tortues
   s'affichent en 14,5 px dans des bulles blanches : elle était donc PLUS FAIBLE que les
   réponses, et l'œil la sautait. Ici on l'écrit plus GROS que les réponses (15 px, 650),
   en noir, dans un encadré sable à barre orange.
   ⚠️ Ce bloc est posé HORS du fil qui défile (#forumfil) : c'est ce qui fait que la
   question reste visible même après 30 réponses. Ne le remets pas dans le fil. */
.fq{background:#FFF7EF;border:1px solid #F0DCC4;border-left:4px solid var(--clay);
    border-radius:12px;padding:12px 14px;margin:11px 0 12px;text-align:left}
.fq-k{font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
      color:var(--clay);margin-bottom:5px}
.fq-tx{font-size:15px;font-weight:650;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}
.fq-tx.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fq-more{margin-top:6px;background:none;border:none;padding:0;font-family:inherit;
         font-size:12.5px;font-weight:850;color:var(--clay);cursor:pointer}
.fq-sep{font-size:11.5px;font-weight:850;letter-spacing:.03em;color:var(--muted);
        margin:0 2px 6px;text-align:left}

/* ===== v160 — LE CURSEUR DE DISTANCE DES COURSES =====
   Même boîte que le périmètre des sorties (.radius), mais son propre réglage :
   state.courseRadius. Ne les fusionne pas : une tortue peut vouloir 5 km pour les
   courses et « toutes » pour les sorties. */
.cdist{display:inline-block;background:var(--green-soft);color:var(--green);font-size:11px;
       font-weight:850;padding:2px 8px;border-radius:99px;margin-left:6px;vertical-align:middle}

/* v160 : une photo de la messagerie s'agrandit au doigt, comme celles du mur */
.supimg{cursor:zoom-in}

/* ===== v161 — LA CARTE « À DÉCOUVRIR » (idée de Laurane, 26 août 2026) ==================
   Elle vit sous le défi, sur l'accueil. Volontairement PLUS DISCRÈTE qu'une carte normale :
   fond sable, pas de blanc, pas d'ombre — c'est une suggestion, pas une annonce. */
.decouv{background:#F3F6F1;border:1px solid #DCE6D8;border-radius:16px;padding:14px 15px;margin:0 0 14px}
.decouv-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.decouv-k{font-size:10.5px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#3E6B45;background:#E3EDE0;border-radius:99px;padding:4px 10px}
.decouv-x{background:none;border:0;font-size:16px;line-height:1;color:var(--muted);cursor:pointer;padding:2px 4px;font-family:inherit}
.decouv-t{font-size:15px;font-weight:900;color:var(--ink);margin-bottom:5px;line-height:1.3}
.decouv-d{font-size:13px;font-weight:650;color:#4A5A4C;line-height:1.55;margin-bottom:12px}
.decouv-b{width:100%;background:#fff;border:1px solid #CBDCC6;border-radius:12px;padding:10px;font-family:inherit;font-weight:850;font-size:13.5px;color:#3E6B45;cursor:pointer}
.decouv-b:active{transform:scale(.99)}

/* ===== v164 — « LES CONTRIBUTIONS DU MOIS » PAR PAGES DE 10 (demande Laurane, 28 août 2026)
   ⚠️ AUCUN NUMÉRO DE CLASSEMENT : la liste dit « qui a couru », pas « qui est devant qui ».
   Sa décision, et elle est cohérente avec « ici, l'allure on s'en fout ». */
.contribnb{font-size:12px;font-weight:750;color:var(--muted);padding:10px 0 4px;border-bottom:1px solid #F0ECE4}
.member.moi .mname{color:#3E6B45}
.member.moi .mtrack i{background:linear-gradient(90deg,#8FB996,#2E6B4B)}
/* ma ligne, épinglée en bas quand je ne suis pas sur la page affichée */
.contribmoi{margin-top:6px;padding-top:8px;border-top:1px dashed #DCE6D8;background:#F3F6F1;border-radius:12px;padding:2px 11px 8px;margin-bottom:2px}
.contribmoi .member{border-bottom:none}
.contribmoi-n{font-size:11.5px;font-weight:750;color:#3E6B45;text-align:center;padding-bottom:2px}
/* la barre de pages */
.cpages{display:flex;gap:5px;justify-content:center;align-items:center;flex-wrap:wrap;padding:13px 0 6px}
.cpg{min-width:32px;height:32px;padding:0 7px;background:#fff;border:1px solid #E4DDD1;border-radius:9px;font-family:inherit;font-weight:850;font-size:13px;color:var(--ink);cursor:pointer}
.cpg.on{background:#2E6B4B;border-color:#2E6B4B;color:#fff}
.cpg.fl{font-size:17px;line-height:1;color:var(--muted)}
.cpg[disabled]{opacity:.35;cursor:default}
.cpg-x{color:var(--muted);font-weight:850;font-size:13px;padding:0 1px}

/* ===== v189 — LA SEMAINE 1 ALLÉGÉE (bug remonté par Catherine, 1er septembre 2026)
   La mention « allégée » était en gris 12 px collée à la date : personne ne la voyait.
   Elle devient une vraie phrase, dans le même encadré sable que les questions du forum. */
.alleg{background:#FFF7EF;border:1px solid #F0DCC4;border-left:4px solid var(--clay);
  border-radius:12px;padding:11px 13px;margin:12px 0 2px;
  font-size:13.5px;font-weight:650;line-height:1.5;color:#4A443B}
.alleg span{display:block;margin-top:4px;font-size:12px;font-weight:800;color:var(--muted)}

/* ===== v189 — ÉCRIRE À UNE TORTUE DEPUIS LE FORUM (demande de Laurane)
   La photo devient la porte vers sa fiche, avec une enveloppe pour qu'on sache que ça se
   touche. Coach seulement, forum seulement : le verrou est dans chatBubblesHtml. */
.cbavw{position:relative;flex:none;cursor:pointer}
.cbavw:active{opacity:.6}
.avmail{position:absolute;right:-3px;bottom:-3px;width:16px;height:16px;border-radius:50%;
  background:var(--clay);color:#fff;font-size:9px;display:flex;align-items:center;
  justify-content:center;border:2px solid #FBF9F5;pointer-events:none}
.qmail{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:50%;background:var(--clay);color:#fff;font-size:10px;vertical-align:middle;
  margin-left:5px;cursor:pointer}
.qmail:active{opacity:.6}

/* ===== v190 — UNE PHOTO DANS LA DISCUSSION D'UNE SORTIE (demande de Laurane)
   « pouvoir envoyer une photo du lieu de rdv ». La photo vit DANS la bulle, avec le
   prénom, l'heure et les cœurs : c'est un message comme un autre. */
.cbimg{display:block;max-width:100%;height:auto;border-radius:11px;margin-top:8px;
  background:var(--soft);cursor:zoom-in}
.cbmsg .cbtx + .cbimg{margin-top:8px}
/* le bouton 📸, à gauche du champ, même hauteur que le bouton envoyer */
.sphoto{flex:none;width:40px;height:40px;border:1px solid var(--line,#E4DDD1);border-radius:12px;
  background:var(--card,#fff);font-size:17px;line-height:1;cursor:pointer;font-family:inherit}
.sphoto:active{opacity:.6}
/* l'aperçu, au-dessus de la barre, tant que la photo n'est pas partie */
.smprev{display:flex;align-items:center;gap:10px;background:var(--card,#fff);
  border:1px solid var(--line,#E4DDD1);border-radius:13px;padding:8px 10px;margin-top:10px}
.smprev img{width:46px;height:46px;border-radius:9px;object-fit:cover;flex:none;background:var(--soft)}
.smprevtx{flex:1;min-width:0}
.smprevtx b{display:block;font-size:13px;font-weight:850;color:var(--ink)}
.smprevtx span{font-size:11.5px;color:var(--muted);font-weight:650}
.smprevx{flex:none;width:30px;height:30px;border:0;border-radius:50%;background:var(--soft);
  color:var(--muted);font-size:14px;cursor:pointer;font-family:inherit}

/* ===== v191 — LE POINT DE RENDEZ-VOUS SUR LA CARTE (demande de Laurane)
   Deux onglets : « Une adresse » (l'écran d'avant, inchangé) et « Sur la carte ».
   L'épingle ne bouge jamais : c'est la carte qui glisse dessous. */
.gtabs{display:flex;gap:7px;margin-bottom:9px}
.gtab{flex:1;border:1px solid var(--line,#E4DDD1);background:var(--card,#fff);border-radius:11px;
  padding:10px 6px;font-family:inherit;font-weight:850;font-size:12.5px;color:#6f6a5f;cursor:pointer}
.gtab.on{background:var(--green);border-color:var(--green);color:#fff}
.gmapwrap{position:relative;border-radius:13px;overflow:hidden;border:1px solid var(--line,#E4DDD1)}
.gmap{height:230px;width:100%;background:#E8EDE6}
/* l'épingle est PAR-DESSUS la carte et ne reçoit aucun doigt : sinon on ne pourrait
   pas faire glisser la carte à l'endroit exact où on vise. */
.gpin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);font-size:30px;
  pointer-events:none;z-index:500;filter:drop-shadow(0 3px 4px rgba(0,0,0,.3))}
.gnow{width:100%;margin-top:9px;border:1px solid var(--line,#E4DDD1);background:var(--card,#fff);
  border-radius:12px;padding:12px;font-family:inherit;font-weight:850;font-size:13.5px;
  color:var(--green);cursor:pointer}
.gnow:active{opacity:.6}
.gfound{background:var(--green-soft);border:1px solid #C9DCC9;border-radius:11px;padding:9px 11px;
  margin-top:9px;font-size:12.5px;font-weight:750;color:#25543D;line-height:1.4}

/* ===== v195 — LES ALLURES AVEC LEUR CHIFFRE (idée de Laurane, 6 septembre 2026)
   « Allure tortue » ne dit rien tant qu'on ne connaît pas le club. Chaque ligne porte
   le nom en gras et l'allure en dessous. En COLONNE : les libellés sont bien trop longs
   pour tenir côte à côte sur un téléphone. */
.cseg.csegv{flex-direction:column;flex-wrap:nowrap;gap:7px}
.cseg.csegv .s{width:100%;text-align:left;padding:11px 13px;display:block}
.cseg.csegv .s b{display:block;font-size:13.5px;font-weight:850;color:var(--ink);line-height:1.25}
.cseg.csegv .s span{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-top:2px}
.cseg.csegv .s.on b{color:#B5532F}
.cseg.csegv .s.on span{color:#C07A5C}

/* ===== v197 — « À CHOISIR » (décision de Laurane, 6 septembre 2026)
   La durée et l'allure n'ont plus de réponse cochée d'avance : une valeur par défaut
   fausse est pire qu'un champ vide, parce qu'elle a l'air d'un choix. Ce petit mot
   rouge dit ce qu'il reste à faire, sans gronder. */
.achoisir{font-size:11.5px;font-weight:850;color:#B5432F;margin:7px 2px 0}

/* v199 — le détail des étapes sur la fiche de séance (question de Solenne : « quand est-ce
   que je passe de 10:43 à 9:23 ? »). Les étapes viennent de etapesSeance(), la même
   fonction que la voix de la séance guidée. */
.pgetapes{background:var(--card);border-radius:16px;padding:6px 15px 13px;box-shadow:var(--shadow);margin:-6px 0 11px;border-left:4px solid var(--clay)}
.pge{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid var(--track)}
.pge:last-of-type{border-bottom:0}
.pgen{flex:none;width:21px;height:21px;border-radius:50%;background:var(--track);color:#6f6a5f;font-size:11.5px;font-weight:850;display:flex;align-items:center;justify-content:center}
.pget{flex:1;min-width:0}
.pget b{font-size:13.5px;font-weight:850;display:block}
.pget span{font-size:11.5px;color:#6f6a5f;font-weight:650}
.pgea{flex:none;font-size:13px;font-weight:850;color:var(--clay)}
.pge.fort{background:#FDF3E7;border-radius:11px;padding:9px 10px;margin:3px -10px;border-bottom:0}
.pge.fort .pgen{background:var(--clay);color:#fff}
.pgenote{font-size:11px;color:var(--muted);font-weight:650;line-height:1.4;margin-top:9px}
/* v199 — le bouton facultatif « ＋ Ajouter ma fréquence cardiaque » */
.agbtn.petit{font-size:12.5px;padding:10px;font-weight:750;color:var(--muted)}
/* 🔔 v203 — la cloche (en-tête) et l'écran « Tes notifications » */
.iconbtn.bell{position:relative}.iconbtn.bell svg{stroke:var(--green)}
.bellnb{position:absolute;top:-3px;right:-3px;min-width:12px;height:16px;padding:0 3px;border-radius:99px;background:#E24B4A;color:#fff;font-size:10.5px;font-weight:850;line-height:16px;text-align:center;border:1.5px solid var(--bg);box-sizing:content-box}
/* Quatre ronds au lieu de trois : on resserre un peu l'en-tête pour que « Turtle Running Club »
   reste sur une ligne, même sur un petit iPhone (375 px). */
.hactions:has(.bell){gap:8px}.hactions:has(.bell) .iconbtn{width:36px;height:36px}.hactions:has(.bell) .iconbtn svg{width:19px;height:19px}.hactions:has(.bell) .pp{width:42px;height:42px;font-size:15px}
.head .wordmark{white-space:nowrap;font-size:clamp(13px,3.9vw,17.5px)}
.ntf-sec{font-size:11.5px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:14px 4px 6px}
.ntf{display:flex;align-items:flex-start;gap:10px;background:#F7F3EC;border-radius:16px;padding:11px 12px;margin-bottom:8px;cursor:pointer}
.ntf.neuve{background:var(--card);box-shadow:var(--shadow)}
.ntf-av{position:relative;flex:none}.ntf-em{position:absolute;right:-5px;bottom:-5px;font-size:13px;line-height:1;background:var(--card);border-radius:99px;padding:2px}
.ntf-tx{flex:1;min-width:0;font-size:13.5px;line-height:1.4;color:var(--ink)}.ntf-tx b{font-weight:850}
.ntf-q{font-size:11.5px;color:var(--muted);margin-top:2px}
.ntf-pt{flex:none;width:8px;height:8px;border-radius:50%;background:#E24B4A;margin-top:8px}

/* ⚑ v207 : les suggestions de prénom dans « Signaler quelqu'un » (+ champs en pleine largeur, texte à gauche) */
.mform.sigform{grid-template-columns:1fr;margin-bottom:12px}
.mform.sigform .mf input{text-align:left}
.sigsuggs{border:1px solid #E4DDD1;border-radius:12px;background:#fff;margin-top:6px;overflow:hidden}
.sigsugg{display:flex !important;justify-content:flex-start;text-align:left;width:100%;box-sizing:border-box;align-items:center;gap:9px;padding:9px 11px;border-top:1px solid #F1ECE4;cursor:pointer;font-size:13.5px}
.sigsugg:first-child{border-top:none}
.sigsugg img,.sigsugg .sp{width:28px;height:28px;border-radius:50%;object-fit:cover;background:#EFEBE4;display:inline-flex;align-items:center;justify-content:center;font-size:15px}
.sigsugg b{font-weight:850}
.sigsugg .vl{color:#8E877C;font-size:12.5px;margin-left:auto}
.sigsugg:active{background:#F6F2EB}

/* ⏳ v212 — LA BARRE DOUCE, à la place d'un chiffre qu'on ne connaît pas encore.
   Règle de Laurane (maquette « version A », 11 septembre 2026) : tant qu'on ne sait pas,
   on ne montre RIEN de chiffré. Un « 0 km » affiché n'est pas une absence de réponse,
   c'est une affirmation — et elle était fausse.
   ⚠️ Elle garde la HAUTEUR du texte qu'elle remplace : quand le vrai chiffre arrive,
   rien ne saute à l'écran. C'est le but de cette forme-là plutôt qu'un « … ». */
.attente{display:inline-block;height:13px;width:104px;border-radius:7px;vertical-align:middle;
  background:linear-gradient(90deg,#EDE8E0 25%,#F6F2EB 37%,#EDE8E0 63%);background-size:400% 100%;
  animation:attentegliss 1.4s ease-in-out infinite}
.attente.g{height:34px;width:118px;border-radius:11px;margin:6px 0 4px}
@keyframes attentegliss{0%{background-position:100% 0}100%{background-position:0 0}}
/* ⚠️ Un téléphone réglé sur « réduire les animations » ne doit pas voir ça bouger. */
@media (prefers-reduced-motion: reduce){ .attente{animation:none} }

/* 🔗 v217 — un lien écrit par une tortue, dans une conversation.
   Souligné et coloré : sur un téléphone, rien ne dit qu'un texte est touchable s'il ressemble
   au reste. `word-break` : une longue adresse ne doit pas élargir la bulle ni pousser la page. */
.lientx{color:var(--clay,#DA6A45);text-decoration:underline;font-weight:800;word-break:break-word;overflow-wrap:anywhere}

/* 🎁 v228 — LES BONS PLANS DU CLUB (maquette « Maquette codes promo partenaires », validée le 1er octobre 2026) */
.bp-onglets{display:flex;gap:6px;margin:0 0 14px}
.bp-onglet{flex:1;padding:10px 6px;border-radius:12px;border:1px solid var(--track);background:var(--card);color:var(--ink);font-family:inherit;font-weight:850;font-size:13px;cursor:pointer}
.bp-onglet.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.bp-intro{font-size:13.5px;color:#5f5a51;line-height:1.5;margin:0 2px 12px}
.bp-carte{background:var(--card);border-radius:18px;padding:15px;box-shadow:var(--shadow);margin-bottom:12px;display:flex;flex-direction:column;gap:11px}
.bp-haut{display:flex;align-items:center;gap:11px}
.bp-nom{flex:1;min-width:0}
.bp-nom b{display:block;font-size:15.5px;font-weight:850}
.bp-nom span{display:block;font-size:12px;color:var(--muted);font-weight:700;margin-top:1px}
.bp-offre{font-size:20px;font-weight:900;color:#B5532F;white-space:nowrap}
.bp-texte{font-size:13px;line-height:1.45;background:#F6F2EB;border-radius:12px;padding:9px 11px;color:#3d3a33}
.bp-code{display:flex;align-items:center;gap:8px;border:2px dashed var(--clay);border-radius:12px;padding:7px 7px 7px 12px;background:var(--clay-soft)}
.bp-c{flex:1;min-width:0;font-family:ui-monospace,Menlo,monospace;font-weight:800;font-size:16px;letter-spacing:.06em;color:#B5532F;overflow-wrap:anywhere}
.bp-copier{border:none;border-radius:9px;padding:9px 14px;font-family:inherit;font-weight:850;font-size:13px;background:var(--clay);color:#fff;cursor:pointer;flex:none}
.bp-copier.ok{background:var(--green)}
.bp-go{display:block;width:100%;text-align:center;border:none;border-radius:12px;padding:12px;font-family:inherit;font-weight:850;font-size:14px;background:var(--ink);color:#fff;cursor:pointer}
.bp-pied{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);font-weight:700}
.bp-mention{background:#F2EEE7;border-radius:6px;padding:1px 7px}
.bp-ligne{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:16px;padding:13px 16px;box-shadow:var(--shadow);margin:0 0 14px;cursor:pointer}
.bp-li{font-size:22px}
.bp-lt{flex:1;min-width:0}
.bp-lt b{display:block;font-size:14.5px;font-weight:850}
.bp-lt span{display:block;font-size:12px;color:var(--muted);font-weight:700;margin-top:1px}
.bp-lg{font-size:20px;color:var(--muted);font-weight:800}
.bp-accueil{position:relative;background:var(--card);border:2px solid var(--clay-soft);border-radius:18px;padding:14px 16px;margin:0 0 14px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--shadow)}
.bp-accueil b{font-size:15px;font-weight:850;padding-right:26px}
.bp-accueil>span{font-size:13px;color:#5f5a51}
.bp-logos{display:flex;gap:5px;flex-wrap:wrap}
.bp-voir{align-self:flex-start;border:none;background:none;padding:2px 0;font-family:inherit;font-weight:850;font-size:13.5px;color:#B5532F;cursor:pointer}
.bp-fermer{position:absolute;top:8px;right:10px;border:none;background:none;font-size:22px;line-height:1;color:var(--muted);cursor:pointer;padding:4px}

/* ═══ 🐢 v230 — LE SONDAGE TURTLE+ (maquette validée par Laurane, version 6) ═══════════
   Tout est préfixé « stp- » : rien ici ne touche une autre fenêtre de l'app. La fenêtre
   elle-même reste celle de l'app (modal-card, modal-t, agbtn…). */
.stp-pastille{display:table;margin:0 auto 9px;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;background:#FFF7E8;color:#8A6100;border-radius:99px;padding:4px 10px}
.stp-logo{display:block;width:46px;height:46px;margin:0 auto 10px;border-radius:50%}
.stp-boite{border-radius:13px;padding:10px 12px;font-size:12.5px;font-weight:750;line-height:1.45;margin-bottom:9px}
.stp-boite b{display:block;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.stp-boite ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}
.stp-boite li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:4px}
.stp-vert{background:#E4EFE8;border:1px solid #A9CDBA;color:#215139}
.stp-or{background:#FFF7E8;border:1px solid #EFD9A6;color:#8A6100}
.stp-gris{background:#F4F1EA;color:#5f5a51;text-align:center;margin-bottom:14px}
.stp .agbtn[disabled]{opacity:.45;cursor:default}
.stp-trois{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stp-trois .agbtn{padding:12px 4px;font-size:13.5px;margin-bottom:0}
.stp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.stp-chips.stp-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.stp-chip{font-family:inherit;font-weight:850;font-size:14.5px;border:1.5px solid var(--track);background:var(--card);color:var(--ink);border-radius:12px;padding:12px 10px;cursor:pointer;flex:1 1 auto;text-align:center}
.stp-chip[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}
.stp-chip[disabled]{opacity:.38;cursor:default}
.stp-chips.stp-liste .stp-chip{flex:1 1 100%;text-align:left;font-size:13.5px;padding:11px 13px}
.stp-lab{font-size:11.5px;font-weight:850;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:4px 0 8px}
.stp-ecrire{display:block;width:100%;min-height:70px;resize:vertical;border:1.5px solid var(--track);border-radius:12px;background:#F6F2EB;padding:10px 12px;font-family:inherit;font-size:16px;font-weight:600;color:var(--ink);margin:-4px 0 14px;-webkit-appearance:none}
.stp-oblig{font-size:11.5px;font-weight:750;color:#B4532F;text-align:center;margin:-4px 0 8px;min-height:1.2em}
.stp-relance{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.stp-relance div{background:#F4F1EA;border-radius:13px;padding:11px 13px;font-size:12.8px;font-weight:700;color:#3f3b34;line-height:1.55}
.stp-relance div b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:3px}
.stp-bouclier{display:block;margin:12px auto 0;background:none;border:0;font-family:inherit;font-size:12px;font-weight:750;color:var(--muted);cursor:pointer;padding:6px 10px;text-decoration:underline;text-underline-offset:3px}
.stp-secoue{animation:stpSecoue .38s ease}
@keyframes stpSecoue{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.stp-secoue{animation:none}}

/* ════════════════════════════════════════════════════════════════════════════
   🖥️ v229 — LA VRAIE VERSION GRAND ÉCRAN (maquette validée par Laurane le 1er octobre 2026)
   ════════════════════════════════════════════════════════════════════════════
   « aujourd'hui l'app n'est pas du tout en version web, si on l'ouvre sur ordinateur ça rend
   vraiment moche ». Mesuré : sur ordinateur, tout le contenu tenait dans une colonne de 344 px,
   plus étroite qu'un iPhone. LA CAUSE : la marge était écrite en pourcentage sur un écran fixé
   (`calc((100% - 600px)/2)`), et pour un élément fixé, 100 % = TOUTE la fenêtre, pas la place
   à côté du menu. 420 px de vide de chaque côté, quelle que soit la taille de l'écran.

   CE QUI EST VALIDÉ (maquette « Turtle sur ordinateur », v3) :
   · SOUS 700 px (téléphone, app du store sur iPhone, iPad d'Apple à 640 px) : RIEN NE BOUGE.
     Aucune règle ci-dessous ne s'y applique, et le rangement en colonnes (app.js,
     `rangeGrandEcran`) n'y tourne pas.
   · 700 à 1 023 px (iPad à la verticale) : « entre les deux ». Le menu reste en bas, le
     contenu passe de 480 à 680 px, les programmes et événements en grille de deux.
   · 1 024 px et plus (ordinateur, iPad à l'horizontale) : menu à gauche, deux colonnes.
   · Les pages qui s'ouvrent (boutique, FAQ, aide…) glissent EN PANNEAU depuis la droite.
     « quand on clique à côté ça fait rien, faut fermer tout simplement ! » : le voile derrière
     ARRÊTE le clic et ne ferme rien. On ferme avec le bouton du panneau.
   · « Je pars courir » est caché sur grand écran (personne ne court avec son ordinateur).
     ⚠️ La classe `.runstart` sert AUSSI au bouton « Lancer la séance » des programmes : on ne
     cache QUE le bouton de l'accueil, reconnaissable à son `data-run-start` VIDE.
   ⚠️ JAMAIS de pourcentage dans une marge d'élément fixé : c'était le bug. Toujours `vw`.
   ════════════════════════════════════════════════════════════════════════════ */
.voile{display:none}
.nav .nav-ajout{display:none}

@media(min-width:700px){
  [data-run-start=""]{display:none!important}
  /* le panneau : il glisse depuis la droite, la page reste visible derrière */
  .overlay{left:auto;right:0;transform:none;width:460px;max-width:100%;box-shadow:-24px 0 60px rgba(28,26,21,.22)}
  .overlay.show + .voile{display:block;position:fixed;left:0;right:0;top:0;background:rgba(28,26,21,.38);z-index:59}
  .overlay .inputbar{bottom:0}
  .cmbarre{bottom:0}
  /* les grilles posées par rangeGrandEcran() */
  .dk-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch;margin-bottom:16px}
  .dk-grille>*{margin:0!important;min-width:0}
  .dk-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
  .dk-duo>div{min-width:0}
  .dk-duo .gobtn{margin-bottom:0}
  #map{height:380px}
  /* les badges : tous visibles, plus de défilement de côté */
  .view .badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));overflow:visible}
  .view .badges .badge{width:auto}
}

/* ─────────────── TABLETTE : 700 à 1 023 px ─────────────── */
@media(min-width:700px) and (max-width:1023px){
  html{background:var(--bg)}
  body{max-width:none;box-shadow:none}
  .aura{width:min(720px,100%)}
  .view{max-width:720px}
  .nav{max-width:720px}
  /* le panneau s'arrête au-dessus du menu du bas, qui reste visible comme sur téléphone */
  .overlay{bottom:calc(74px + env(safe-area-inset-bottom))}
  .overlay.show + .voile{bottom:calc(74px + env(safe-area-inset-bottom))}
}

/* ─────────────── ORDINATEUR : 1 024 px et plus ─────────────── */
@media(min-width:1024px){
  :root{--cote:236px}
  html{background:var(--bg)}
  body{max-width:none;margin:0;min-height:100vh;background:var(--bg);box-shadow:none}
  .aura{display:none}
  .nav{
    position:fixed;left:0;right:auto;top:0;bottom:0;transform:none;
    width:var(--cote);max-width:var(--cote);height:100vh;z-index:58;
    display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:3px;
    padding:22px 14px;background:var(--card);border-top:none;border-right:1px solid #E4DFD6;backdrop-filter:none;
  }
  .nav::before{content:"Turtle\A Running Club";white-space:pre-line;display:flex;align-items:center;min-height:50px;margin:0 0 18px;padding-left:62px;
    background:url('logo-rond.png') no-repeat 4px center/48px 48px;font-size:15.5px;font-weight:900;color:var(--gold);line-height:1.15}
  .nav button{flex-direction:row;justify-content:flex-start;gap:14px;width:100%;height:auto;padding:12px 14px;border-radius:13px;font-size:14.5px;color:#A39A8E}
  .nav button svg{width:22px;height:22px}
  .nav button:hover:not(.on){background:#F6F2EB;color:var(--ink)}
  .nav button.on{background:var(--clay-soft);color:#B5532F}
  .nav button.on span{color:#B5532F}
  .navdot{top:50%;margin-top:-5px;right:14px}
  .nav .nav-ajout{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:16px;padding:12px;border:1.5px dashed #E8B7A3;border-radius:13px;
    background:#FCF2ED;color:#B5532F;font-weight:850;font-size:13.5px;line-height:1.3;text-align:center;cursor:pointer}
  .nav .nav-ajout:hover{background:var(--clay-soft)}
  .nav .nav-ajout:focus-visible,.nav button:focus-visible{outline:3px solid var(--clay);outline-offset:2px}
  /* le contenu : centré dans la place à côté du menu, 1 080 px au plus.
     ⚠️ 100vw et pas 100 % : c'est exactement le piège qui faisait la colonne de 344 px. */
  .view{left:var(--cote);right:0;top:0;bottom:0;transform:none;width:auto;max-width:none;margin-left:0;
    padding:26px max(34px,calc((100vw - var(--cote) - 1080px) / 2)) 56px}
  .overlay{top:0;bottom:0;width:480px}
  .overlay .opad{max-width:none}
  .overlay.show + .voile{bottom:0}
  .gate{left:var(--cote);right:0;top:0;bottom:0;width:auto;max-width:none;transform:none}
  .gate .gate-inner{max-width:640px;margin:0 auto}
  .modal{left:var(--cote);right:0;width:auto;transform:none}
  .tour{left:var(--cote);right:0;width:auto;transform:none}
  .toast{left:calc(50% + var(--cote) / 2);bottom:32px}

  /* le haut de page : le titre à gauche, les boutons ronds à droite */
  .view.dk .head{align-items:flex-end!important;margin-bottom:20px!important;padding-top:0}
  .view.dk .head .wordmark{display:none}
  .view.dk .head .greet{margin:0}
  .view.dk .head .greet b{font-size:30px}
  .view.dk .head .ptitle h1{font-size:30px}
  .view.dk .head .card.stats{flex:none;margin:0 14px 0 auto;padding:10px 22px;gap:26px;border-radius:20px}
  .view.dk .head .card.stats + .hactions{margin-left:0}

  /* deux colonnes (Accueil, Moi) : ce qu'on lit à gauche, ce qui te concerne à droite */
  .dk-cols{display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,25vw,330px);gap:24px;align-items:start}
  .dk-a,.dk-b{min-width:0}
  .dk-a>:first-child,.dk-b>:first-child{margin-top:0}
  .dk-a>*,.dk-b>*,.dk-bas>*{max-width:100%}
  /* Team : les sorties à gauche, la grande carte à droite (elle reste visible quand on descend) */
  .dk-cols.dk-team{grid-template-columns:clamp(340px,32vw,420px) minmax(0,1fr)}
  .dk-team .dk-b{position:sticky;top:0}
  .dk-team #map{height:520px}
  .dk-bas{margin-top:8px}
  /* une seule colonne, pas trop large (séances d'un programme en cours) */
  .dk-colonne{max-width:760px}
  /* les grilles à trois (événements, programmes bien-être) */
  .dk-grille.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
  #course-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  #course-list>*{margin:0!important;min-width:0}
  #course-list>.card{grid-column:1 / -1}
}
