/* ===== apnée mode ===== */
.apnea-stage{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line2);box-shadow:var(--shadow);
 background:linear-gradient(180deg,#0f4254 0%,#0a2e3a 55%,#061d27 100%)}
.apnea-hud{display:flex;align-items:center;gap:12px;padding:12px 14px}
.o2wrap{flex:1}
.o2lab{display:flex;justify-content:space-between;font-size:.66rem;color:var(--soft);text-transform:uppercase;letter-spacing:.6px;margin-bottom:4px;font-weight:700}
.o2bar{height:12px;border-radius:7px;background:rgba(4,22,28,.6);overflow:hidden;border:1px solid rgba(0,0,0,.3)}
.o2fill{height:100%;border-radius:7px;background:linear-gradient(90deg,#7ad9cc,#3aa99d);transition:width .12s linear}
.o2fill.low{background:linear-gradient(90deg,#f0a35f,#ec6a4e)}
.depth{flex:0 0 auto;text-align:center;background:rgba(6,32,40,.5);border:1px solid var(--line);border-radius:12px;padding:7px 11px}
.depth .n{font-family:Fraunces,serif;font-size:1.2rem;color:var(--aqua);font-weight:600;line-height:1}
.depth .l{font-size:.58rem;color:var(--mut);text-transform:uppercase;letter-spacing:.5px}
.apnea-pic{height:150px;display:flex;align-items:center;justify-content:center}
.apnea-pic img{max-width:88%;max-height:140px;object-fit:contain;border-radius:12px;box-shadow:0 8px 18px rgba(0,0,0,.5)}
.apnea-over{text-align:center;padding:26px 18px}
.apnea-over .big{font-family:Fraunces,serif;font-size:2rem;font-weight:600;color:var(--aqua)}
.apnea-over .sub{color:var(--soft);font-size:.9rem;margin-top:6px}

/* ===== Palier 1 additions ===== */
/* niveau de rareté (sélecteur) */
.lvlseg{display:flex;align-items:center;gap:7px;margin:-4px 0 15px;flex-wrap:wrap}
.lvllab{font-size:.74rem;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--mut);margin-right:2px}
.lvlseg button{flex:1;min-width:84px;border:1px solid var(--line2);border-radius:12px;padding:9px 6px;font-weight:700;font-size:.82rem;cursor:pointer;
 color:var(--mut);background:rgba(8,38,46,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.lvlseg button.on{background:linear-gradient(180deg,rgba(232,180,92,.24),rgba(201,81,47,.12));color:var(--ink);border-color:rgba(232,180,92,.5)}
.lvlseg button:active{transform:translateY(2px)}

/* bannière législation zone (quiz) */
.qlegis{font-size:.82rem;line-height:1.4;color:var(--soft);background:rgba(116,211,198,.10);
 border:1px solid rgba(116,211,198,.22);border-radius:12px;padding:9px 12px;margin:0 0 13px}

/* filtre façade dans le carnet */
.cfac{margin-bottom:12px}
.cfac button{padding:9px 6px;font-size:.82rem}

/* bloc Prudence (fiche) */
.danger-block{border:1px solid rgba(236,106,78,.42)!important;background:rgba(236,106,78,.10)!important}
.danger-block h4{color:#ffb9a8!important}

/* carrousel multi-photos (fiche) */
.ph-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:34px;border-radius:50%;
 border:1px solid var(--line2);background:rgba(6,32,41,.6);color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer;
 display:flex;align-items:center;justify-content:center;backdrop-filter:blur(3px)}
.ph-nav:active{transform:translateY(-50%) scale(.92)}
.ph-nav.l{left:8px}.ph-nav.r{right:8px}
.ph-dots{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:6px}
.ph-dots span{width:7px;height:7px;border-radius:50%;background:rgba(243,236,220,.4)}
.ph-dots span.on{background:var(--aqua);box-shadow:0 0 0 2px rgba(116,211,198,.3)}

/* profondeur (apnée) – vignette qui s'assombrit en descendant */
.apnea-stage{position:relative}
.apnea-stage::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
 background:linear-gradient(180deg,rgba(2,14,22,0),rgba(2,14,22,calc(var(--dp,0)*0.55)));transition:background .4s}
.apnea-over{text-align:center;padding:22px 14px;animation:rise .4s}
.apnea-over .big{font-size:1.05rem;font-weight:700;color:var(--soft)}
.apnea-over .dp{font-family:Fraunces,serif;font-size:2.6rem;font-weight:600;color:var(--aqua);margin:4px 0}
.apnea-over .sub{font-size:.86rem;color:var(--gold);font-weight:700}
.detail-hero{position:relative}

/* ===== Palier 2 additions ===== */
/* bannière éthique (accueil) */
.ethos{font-size:.83rem;line-height:1.5;color:var(--soft);font-style:italic;font-family:Fraunces,serif;
 border-left:2px solid rgba(116,211,198,.5);padding:2px 0 2px 12px;margin:2px 4px 16px;opacity:.9}
.soul{font-family:Fraunces,serif;font-style:italic;font-size:.82rem;line-height:1.5;color:var(--soft);
 text-align:center;opacity:.62;margin:16px 6px 4px;padding-top:12px;border-top:1px solid var(--line2)}

/* échelle de profondeur : pas de classe dédiée (SVG inline) */
/* difficulté de chasse */
.diffrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.stars{font-size:1.05rem;letter-spacing:2px;color:rgba(160,205,210,.3)}
.stars span.on{color:var(--gold)}
.diff-lbl{font-size:.82rem;font-weight:700;color:var(--soft)}
.diff-prot{font-size:.85rem;font-weight:700;color:#ffb9a8;background:rgba(236,106,78,.12);border:1px solid rgba(236,106,78,.3);border-radius:10px;padding:6px 10px;display:inline-block}

/* puces discipline (titres) */
.dchip{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;font-size:.78rem;margin-right:8px;flex:0 0 auto}
.dchip.chasse{background:rgba(236,106,78,.16)}
.dchip.peche{background:rgba(116,211,198,.16)}
.dchip.ethic{background:rgba(232,180,92,.16)}
/* hauts faits teintés par discipline */
.bcell.d-chasse{border-color:rgba(236,106,78,.3)}
.bcell.d-peche{border-color:rgba(116,211,198,.32)}

/* écran sécurité */
.safety-head{font-family:Fraunces,serif;font-size:1.5rem;font-weight:600;color:#ffb9a8;text-align:center;margin:6px 0 14px}
#safetyBox{display:flex;flex-direction:column;gap:11px;margin-bottom:16px}
.sline{font-size:.92rem;line-height:1.5;color:var(--ink);background:rgba(236,106,78,.10);
 border:1px solid rgba(236,106,78,.28);border-radius:13px;padding:13px 15px}
.safety-foot{font-size:.8rem;color:var(--mut);line-height:1.45;text-align:center;margin-bottom:16px;font-style:italic}

/* ===== Palier 3 : avatar + journal + secrets ===== */
.avbox{display:flex;gap:14px;align-items:flex-start}
.avpreview{flex:0 0 116px;width:116px;height:146px;border-radius:16px;overflow:hidden;
 background:radial-gradient(85% 70% at 50% 22%,rgba(116,211,198,.16),rgba(8,38,46,.6));border:1px solid var(--line2)}
.avparts{flex:1;min-width:0;display:flex;flex-direction:column;gap:9px}
.avrow{display:flex;align-items:center;gap:9px}
.avlab{flex:0 0 78px;font-size:.74rem;font-weight:700;color:var(--mut)}
.avsws{display:flex;gap:6px;flex-wrap:wrap}
.avsw{width:24px;height:24px;border-radius:8px;cursor:pointer;position:relative;border:2px solid transparent;
 box-shadow:inset 0 0 0 1px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center}
.avsw.on{border-color:var(--foam);box-shadow:0 0 0 2px rgba(244,236,218,.25)}
.avsw.lock{cursor:default;filter:grayscale(.6) brightness(.6)}
.avsw .avlock{font-size:.6rem}
.avsw .avh{font-size:.72rem}
.avsw .avr{position:absolute;top:-1px;right:-1px;width:5px;height:5px;border-radius:50%;border:1px solid var(--abyss);opacity:.85}
.avsw .avstar{position:absolute;bottom:-3px;left:50%;transform:translateX(-50%);font-size:.52rem;color:#E8B45C;text-shadow:0 0 3px rgba(0,0,0,.6);line-height:1}

@keyframes legpulse{0%,100%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),0 0 0 1.5px #E8B45C}50%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),0 0 0 2.5px #E8B45C,0 0 6px rgba(232,180,92,.6)}}


.journal{display:flex;flex-direction:column;gap:7px;max-height:340px;overflow-y:auto}
.jcount{font-size:.72rem;font-weight:700;color:var(--aqua);margin-left:6px}
.jrow{display:flex;align-items:center;gap:11px;padding:7px 9px;border-radius:12px;cursor:pointer;
 background:rgba(8,40,50,.4);border:1px solid var(--line)}
.jrow:active{transform:scale(.99)}
.jph{flex:0 0 44px;width:44px;height:34px;border-radius:8px;overflow:hidden;background:rgba(6,32,40,.6);display:flex;align-items:center;justify-content:center}
.jph img{width:100%;height:100%;object-fit:contain}
.jph svg{width:100%;height:100%}
.jmid{flex:1;min-width:0}
.jn{font-weight:600;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jf{font-size:.72rem;color:var(--mut)}
.jd{flex:0 0 auto;font-size:.74rem;color:var(--gold);font-weight:700}
.jempty{font-size:.84rem;color:var(--mut);text-align:center;padding:16px;line-height:1.4}

.secrets{display:flex;flex-direction:column;gap:8px}
.secret{font-size:.86rem;line-height:1.45;color:var(--ink);background:rgba(232,180,92,.08);
 border:1px solid rgba(232,180,92,.22);border-left:3px solid var(--gold);border-radius:11px;padding:10px 12px}
.secret.lock{color:var(--mut);background:rgba(160,205,210,.05);border-left-color:rgba(160,205,210,.25);font-style:italic}

/* ===== ajustements : boutons mobile + carnet ===== */
.disc-seg button,.facade button,.lvlseg button{white-space:nowrap;min-width:0;font-size:clamp(.7rem,3.2vw,.86rem);padding-left:6px;padding-right:6px;overflow:hidden;text-overflow:ellipsis}
.cell{display:flex;flex-direction:column}
.cell .ph-wrap{flex:0 0 auto}
.cell .nm{min-height:40px;padding:7px 6px;font-size:.71rem;line-height:1.18;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;overflow:hidden}

/* ===== avatar sub-tabs + choice swatches + carnet view ===== */
.avtabs{display:flex;gap:6px;margin-bottom:11px;flex-wrap:wrap}
.avtab{flex:1;min-width:60px;border:1px solid var(--line2);border-radius:10px;padding:7px 4px;font-size:.74rem;font-weight:700;cursor:pointer;color:var(--mut);background:rgba(8,38,46,.5);white-space:nowrap}
.avtab.on{background:linear-gradient(180deg,rgba(116,211,198,.2),rgba(63,184,147,.14));color:var(--ink);border-color:var(--aqua)}
.avsw.choice{display:flex;align-items:center;justify-content:center}
.avsw .avic{font-size:.8rem;line-height:1}
.avsw.choice.on{background:linear-gradient(180deg,rgba(116,211,198,.28),rgba(63,184,147,.16))!important}
.avrow{align-items:flex-start}
.avsws{flex-wrap:wrap}

.cviewseg{display:flex;gap:8px;margin-bottom:13px}
.cviewseg button{flex:1;border:1px solid var(--line2);border-radius:13px;padding:10px 8px;font-weight:700;font-size:.86rem;cursor:pointer;color:var(--mut);background:rgba(8,38,46,.5);white-space:nowrap}
.cviewseg button.on{background:linear-gradient(180deg,rgba(116,211,198,.2),rgba(63,184,147,.14));color:var(--ink);border-color:var(--aqua)}
.jhead{font-size:.82rem;color:var(--mut);margin-bottom:11px;line-height:1.4}

/* ===== P1 : explications d'erreur + photo verrouillée ===== */
.learn{margin-top:10px;background:rgba(116,211,198,.08);border:1px solid rgba(116,211,198,.22);border-left:3px solid var(--aqua);border-radius:11px;padding:10px 12px}
.learn-h{font-size:.74rem;font-weight:800;letter-spacing:.3px;color:var(--aqua);text-transform:uppercase;margin-bottom:5px}
.learn-p{font-size:.86rem;line-height:1.45;color:var(--ink);margin-top:4px}
.lockhint{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-size:.74rem;color:var(--foam);background:rgba(6,28,34,.55);padding:6px 8px;backdrop-filter:blur(2px)}

/* ===== P2 : carte des zones ===== */
.mapwrap{border:1px solid var(--line2);border-radius:16px;overflow:hidden;background:#06222b;margin-bottom:14px}
.maphint{font-size:.86rem;color:var(--mut);text-align:center;padding:14px;line-height:1.4}
.mapcard{background:rgba(8,40,50,.5);border:1px solid var(--line2);border-radius:16px;padding:14px 15px}
.mapcard h3{font-family:Fraunces,serif;font-size:1.18rem;margin:0 0 7px}
.mapdesc{font-size:.9rem;line-height:1.45;color:var(--soft);margin-bottom:8px}
.maplegis{font-size:.84rem;line-height:1.4;color:var(--gold);background:rgba(232,180,92,.08);border:1px solid rgba(232,180,92,.2);border-radius:10px;padding:8px 10px;margin-bottom:11px}
.mapcount{font-size:.8rem;color:var(--mut);margin-bottom:11px}
.mapacts{display:flex;gap:9px;margin-bottom:6px}
.mapbtn{flex:1;border:none;border-radius:13px;padding:12px 8px;font-weight:800;font-size:.9rem;cursor:pointer;color:#06222b;background:linear-gradient(180deg,#86e0d2,#3FB893);white-space:nowrap}
.mapbtn.alt{background:linear-gradient(180deg,#ff9d83,#EC6A4E)}
.mapsp{margin-top:6px}
.mapsp summary{cursor:pointer;font-size:.84rem;color:var(--aqua);font-weight:700;padding:6px 0}
.mapchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.mchip{font-size:.76rem;padding:5px 9px;border-radius:20px;background:rgba(116,211,198,.1);border:1px solid var(--line2);color:var(--ink);cursor:pointer}
.mchip:active{background:rgba(116,211,198,.22)}

/* ===== P3 : lexique ===== */
.lexintro{font-size:.86rem;color:var(--mut);margin:0 0 14px;line-height:1.4}
.lexsec{margin-bottom:18px}
.lexh{font-family:Fraunces,serif;font-size:1.1rem;font-weight:600;margin-bottom:9px;padding-bottom:6px;border-bottom:1px solid var(--line2)}
.lexsec.ch .lexh{color:#ff9d83}
.lexsec.pe .lexh{color:var(--aqua)}
.lexitem{margin-bottom:10px}
.lext{font-weight:800;font-size:.92rem;color:var(--ink)}
.lexd{font-size:.85rem;line-height:1.45;color:var(--soft);margin-top:2px}

/* ===== carte : zoom + marqueur sélectionné ===== */
.mapwrap{aspect-ratio:auto}
.mpin .mhalo{opacity:0;transition:opacity .35s}
.mpin.sel .mhalo{opacity:.85}
.maptop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}
.maptop h3{margin:0}
.mapreset{flex:0 0 auto;border:1px solid var(--line2);background:rgba(8,40,50,.6);color:var(--aqua);font-weight:700;font-size:.74rem;border-radius:10px;padding:6px 9px;cursor:pointer;white-space:nowrap}
.mapreset:active{background:rgba(116,211,198,.18)}

#mapZoomG text{transition:opacity .3s}
#mapZoomG.zoomed text{opacity:0}

/* marqueurs carte : pulsation */
.mpulse{transform-box:fill-box;transform-origin:center;animation:mp 2.6s ease-out infinite}
@keyframes mp{0%{transform:scale(.45);opacity:.55}75%{transform:scale(2.1);opacity:0}100%{opacity:0}}
.mpin.sel .mpulse{display:none}

/* ===== Règles : entonnoir ===== */
.reg-ess{display:flex;flex-direction:column;gap:9px;margin-bottom:15px}
.reg-essitem{background:rgba(8,40,50,.5);border:1px solid var(--line2);border-radius:13px;padding:11px 13px}
.reg-essh{font-weight:800;font-size:.86rem;margin-bottom:4px}
.reg-essp{font-size:.82rem;line-height:1.45;color:var(--soft)}
.reg-zonelist{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.reg-zcard{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;
 background:rgba(8,40,50,.5);border:1px solid var(--line2);border-radius:13px;padding:13px 14px;cursor:pointer;color:var(--ink)}
.reg-zcard:active{background:rgba(116,211,198,.12)}
.rz-n{font-weight:700;font-size:.95rem}
.rz-c{font-size:.78rem;color:var(--aqua);font-weight:700;flex:0 0 auto}
.rz-sec{margin-top:11px}
.rz-h{font-size:.78rem;font-weight:800;color:var(--soft);margin-bottom:6px}

/* ===== Vie marine ===== */
.vm-intro{color:var(--soft);font-size:.86rem;line-height:1.5;margin:0 0 12px}
.vmtabs{display:flex;gap:7px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px;-webkit-overflow-scrolling:touch}
.vmtabs::-webkit-scrollbar{display:none}
.vmtab{flex:0 0 auto;border:1px solid var(--line2);background:rgba(8,40,50,.5);color:var(--soft);font-weight:700;font-size:.78rem;border-radius:20px;padding:8px 13px;cursor:pointer;white-space:nowrap}
.vmtab.on{background:var(--aqua);color:#06222b;border-color:var(--aqua)}
.vmgrid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.vmcard{text-align:left;padding:0;border:1px solid var(--line2);border-radius:15px;overflow:hidden;background:rgba(8,40,50,.45);cursor:pointer;color:var(--ink)}
.vmcard:active{transform:scale(.985)}
.vmthumb{position:relative;aspect-ratio:4/3;background:#0a2630;overflow:hidden}
.vmthumb img{width:100%;height:100%;object-fit:contain;display:block}
.vmbadge{position:absolute;left:6px;top:6px;font-size:.6rem;font-weight:800;padding:3px 6px;border-radius:8px;background:rgba(236,106,78,.92);color:#fff}
.vmcname{font-weight:700;font-size:.86rem;padding:8px 10px 0;line-height:1.2}
.vmcsci{font-style:italic;color:var(--mut);font-size:.7rem;padding:1px 10px 10px}
.vm-hero{aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:#0a2630;margin-bottom:13px}
.vm-hero img{width:100%;height:100%;object-fit:contain;display:block}
.vm-head h2{font-family:Fraunces,serif;font-size:1.4rem;margin:0}
.vm-sci{font-style:italic;color:var(--mut);font-size:.82rem;margin-top:2px}
.vm-statut{display:inline-block;margin:10px 0;padding:5px 11px;border-radius:20px;background:rgba(116,211,198,.14);border:1px solid var(--line2);color:var(--aqua);font-weight:700;font-size:.76rem}
.vm-facts{display:flex;gap:10px;margin-bottom:6px}
.vm-fact{flex:1;background:rgba(8,40,50,.5);border:1px solid var(--line2);border-radius:12px;padding:9px 11px}
.vm-fact span{display:block;color:var(--mut);font-size:.68rem;text-transform:uppercase;letter-spacing:.5px}
.vm-fact b{font-size:.9rem}
.vm-block{margin-top:13px}
.vm-h{font-weight:800;font-size:.82rem;margin-bottom:4px}
.vm-block p{margin:0;color:var(--soft);font-size:.88rem;line-height:1.5}
.vm-danger{margin-top:13px;padding:10px 12px;border-radius:12px;background:rgba(236,106,78,.12);border:1px solid rgba(236,106,78,.4);color:#ffb9a6;font-size:.84rem;font-weight:600}
.vm-inv{margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(232,180,92,.1);border:1px solid rgba(232,180,92,.35);color:#f0d6a0;font-size:.82rem;line-height:1.45}
.vm-foot{margin:18px 0 6px;text-align:center;color:var(--mut);font-size:.74rem;font-style:italic}

/* ===== carnet : espèce verrouillée = photo floutée ===== */
.cell .ph-wrap{position:relative;overflow:hidden}
.blurlock{filter:blur(11px) brightness(.72) saturate(.8);transform:scale(1.15);width:100%;height:100%;object-fit:cover}
.cell.locked .lockico{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.35rem;opacity:.92;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.cell.locked .nm{opacity:.7}
#detHero .img{position:relative;overflow:hidden}
#detHero .img .blurlock{transform:scale(1.18)}
#detHero .lockhint{position:absolute;left:0;right:0;bottom:0;padding:10px;text-align:center;font-size:.82rem;font-weight:700;color:#eaf2ee;background:linear-gradient(to top,rgba(4,18,24,.85),transparent)}

.vm-hero{position:relative}
.vm-hero .ph-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2}
.vm-hero .ph-dots{position:absolute;left:0;right:0;bottom:8px}

/* ===== carte : aires de zones + villes ===== */
.zarea{fill-opacity:.14;stroke-width:1;stroke-opacity:.55;cursor:pointer;transition:fill-opacity .35s,stroke-opacity .35s,stroke-width .35s}
.zarea.sel{fill-opacity:.4;stroke-opacity:.98;stroke-width:2}
.mcity circle{opacity:.85}
.mcity text{pointer-events:none}
#mapZoomG.zoomed .mcity text{opacity:0}
/* ===== apnée — entraînement ===== */
.apnsafe{background:rgba(236,106,78,.12);border:1px solid rgba(236,106,78,.4);color:#ffd9cd;font-size:.82rem;line-height:1.45;border-radius:14px;padding:12px 14px;margin-bottom:14px}
.apnmax{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.04);border:1px solid #1f4a52;border-radius:14px;padding:10px 14px;margin-bottom:16px;font-size:.9rem;color:#bcd}
.apnmaxctl{display:flex;align-items:center;gap:10px}
.apnmaxctl b{font-size:1.1rem;min-width:54px;text-align:center;color:#fff}
.apnmaxctl button{width:54px;height:34px;border-radius:10px;border:1px solid #2a6b74;background:#0c3a44;color:#cdeef2;font-weight:700;cursor:pointer}
.apnmaxctl button:active{transform:translateY(1px)}
.apncards{display:flex;flex-direction:column;gap:10px}
.apncard{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:linear-gradient(180deg,#0b323b,#082730);border:1px solid #1c4953;border-radius:16px;padding:14px 16px;cursor:pointer;color:#eaf6f8}
.apncard:active{transform:translateY(1px)}
.apncard .ai{font-size:1.6rem;flex:0 0 auto}
.apncard h4{margin:0 0 2px;font-size:1.02rem;font-weight:700}
.apncard p{margin:0;font-size:.8rem;color:#9fc0c7;line-height:1.35}
.apncard .go{margin-left:auto;color:#74D3C6;font-size:1.2rem;flex:0 0 auto}
.apnback2{background:none;border:none;color:#74D3C6;font-size:.9rem;cursor:pointer;padding:4px 0;margin-bottom:6px}
.apntit{font-family:Fraunces,serif;font-weight:600;font-size:1.3rem;margin:0 0 14px}
.apnphase{font-size:.86rem;color:#aecace;line-height:1.5;margin-bottom:16px}
.apnbig{background:radial-gradient(120% 120% at 50% 0,#0e3d47,#071f27);border:1px solid #1c4953;border-radius:18px;padding:26px 16px;text-align:center;transition:background .4s,border-color .4s}
.apnbig.hold{border-color:#EC6A4E;background:radial-gradient(120% 120% at 50% 0,#3a1c18,#1a0f0c)}
.apnbig.rest{border-color:#74D3C6;background:radial-gradient(120% 120% at 50% 0,#0e3d47,#071f27)}
.apnbig.done{border-color:#5fcf8a}
.apnbiglab{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:#9fc0c7;font-weight:700}
.apnbignum{font-family:Fraunces,serif;font-size:3.4rem;line-height:1.1;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.apnsub2{font-size:.82rem;color:#74D3C6;margin-top:4px;min-height:1em}
.apnbtns{display:flex;gap:10px;margin:16px 0}
.apnbtn{flex:1;border:none;border-radius:13px;padding:14px;font-size:1rem;font-weight:700;cursor:pointer;background:linear-gradient(180deg,#1aa39a,#0c7a73);color:#fff}
.apnbtn.alt{background:#0c3a44;border:1px solid #2a6b74;color:#cdeef2}
.apnbtn:disabled{opacity:.4;cursor:default}
.apnbtn:active{transform:translateY(1px)}
.apnrows{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.apnrow{display:flex;align-items:center;gap:12px;padding:9px 13px;border-radius:11px;background:rgba(255,255,255,.03);border:1px solid #163b43;font-size:.86rem;color:#cfe6ea;transition:.25s}
.apnrow .rn{width:20px;height:20px;border-radius:50%;background:#0c3a44;color:#9fc0c7;font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.apnrow .rh{font-weight:700;color:#fff}
.apnrow .rr{margin-left:auto;color:#9fc0c7;font-size:.8rem}
.apnrow.cur{border-color:#74D3C6;background:rgba(116,211,198,.12)}
.apnrow.cur .rn{background:#74D3C6;color:#063}
.apnrow.done{opacity:.45}
.apnrow.done .rn{background:#2a6b4a;color:#bff5d6}
.apnpacerwrap{display:flex;justify-content:center;align-items:center;height:230px}
.apnpacer{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle at 50% 38%,#1f7a8a,#0a3640);border:2px solid #74D3C6;display:flex;align-items:center;justify-content:center;color:#eafdff;font-weight:700;font-size:.95rem;transform:scale(1);box-shadow:0 0 30px rgba(116,211,198,.25)}
.apnpacer.in{transform:scale(1.75);transition:transform 4s ease-in-out}
.apnpacer.out{transform:scale(1);transition:transform 6s ease-in-out}
.apnpacer.idle{transform:scale(1.12);transition:transform .4s}
.apntech{display:flex;flex-direction:column;gap:10px}
.apntcard{background:linear-gradient(180deg,#0b323b,#082730);border:1px solid #1c4953;border-left:3px solid #74D3C6;border-radius:13px;padding:12px 14px}
.apntcard h4{margin:0 0 5px;font-size:.96rem;color:#eaf6f8}
.apntcard p{margin:0;font-size:.83rem;line-height:1.5;color:#aecace}

/* ===== accueil : carte en tête + sections ===== */
.maphero{position:relative;border:1px solid var(--line2);border-radius:18px;overflow:hidden;margin-bottom:16px;cursor:pointer;background:#06222b;box-shadow:0 10px 26px rgba(0,0,0,.35)}
.maphero .maphero-map{line-height:0}
.maphero .maphero-map svg{pointer-events:none}
.maphero-cap{display:flex;align-items:center;gap:10px;padding:11px 14px;background:linear-gradient(to top,rgba(6,28,34,.96),rgba(6,28,34,.62))}
.maphero-cap h3{font-family:Fraunces,serif;font-weight:600;font-size:1.02rem;margin:0}
.maphero-cap p{font-size:.76rem;color:var(--soft);margin:2px 0 0}
.maphero-cap .go{margin-left:auto;font-size:1.2rem;color:var(--aqua);flex:0 0 auto}
.maphero:active{transform:translateY(1px)}
.tsec{font-size:.7rem;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--aqua);margin:2px 2px 9px;opacity:.85}

/* ===== avatar : sélecteur genre ===== */
.avsex{display:flex;gap:8px;margin-bottom:10px}
.avsex button{flex:1;padding:8px;border-radius:10px;border:1px solid var(--line2);background:rgba(8,40,50,.4);color:var(--soft);font-size:.84rem;font-weight:600;cursor:pointer;transition:.2s}
.avsex button.on{background:linear-gradient(160deg,var(--aqua),#3FB893);color:#062028;border-color:transparent}

/* ===== carnet : regroupement générique ===== */
.gencell{position:relative}
.gencell .ph-wrap{box-shadow:inset 0 0 0 2px var(--gold)}
.genbadge{position:absolute;top:5px;right:5px;background:var(--gold);color:#241803;font-size:.62rem;font-weight:800;padding:2px 6px;border-radius:9px}
.gensub{font-size:.62rem;color:var(--gold);text-align:center;margin-top:1px}
.genhead{grid-column:1/-1;display:flex;align-items:center;gap:11px;margin-bottom:4px}
.genback{background:rgba(8,40,50,.5);border:1px solid var(--line2);color:var(--soft);border-radius:10px;padding:7px 11px;font-size:.82rem;font-weight:600;cursor:pointer;flex:0 0 auto}
.gh-t{font-family:Fraunces,serif;font-weight:600;font-size:1.05rem;color:var(--gold)}
.gh-s{font-size:.74rem;color:var(--soft);margin-top:1px}

/* --- accueil : tuiles catégories + sous-menus --- */
.tile.cat{background:linear-gradient(135deg,rgba(116,211,198,.10),rgba(91,200,232,.06));border-color:rgba(116,211,198,.28)}
.tile.cat h3{font-size:1.18rem}
.submenu-intro{color:var(--mut);font-size:.95rem;margin:2px 2px 14px;line-height:1.4}
/* --- écran scope (façade quiz) --- */
.scope-opts{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.scopebtn{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px 18px;color:var(--ink);cursor:pointer;transition:.15s}
.scopebtn:hover,.scopebtn:active{border-color:rgba(116,211,198,.5);transform:translateY(-1px)}
.scopebtn .em{font-size:1.7rem;line-height:1}
.scopebtn .t{font-weight:700;font-size:1.05rem}
.scopebtn .s{color:var(--mut);font-size:.85rem;margin-top:2px}
.scope-gran{margin:4px 0 16px}

/* --- accueil : tuiles catégories empilées format long --- */
.catstack{display:flex;flex-direction:column;gap:13px}
.catstack .tile.cat.full{min-height:0;padding:18px 18px}
.tile.full .go{bottom:auto;top:50%;transform:translateY(-50%)}
.tile.cat.full .ic{width:34px;height:34px;flex:0 0 auto}
.tile.cat.full>div{padding-right:18px}
.tile.cat.full h3{font-size:1.16rem;margin:0}
.tile.cat.full p{margin-top:4px}