/* ═══════════════════════════════════════════════════════════════════
   game-ui.css — GAL GANGUI REUBBI V113 EXCELLENCE
   Non-critical UI styles — loaded async after first paint
   NIAKS TECH · Sénégal 🇸🇳 · 2026
   ═══════════════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-touch-callout:none}
html,body{width:100%;height:100%;height:100dvh;background:#030810;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;font-family:system-ui,-apple-system,'SF Pro Display','Helvetica Neue',sans-serif;-webkit-text-size-adjust:100%}
canvas{position:fixed;top:0;left:0;width:100%;height:100%;image-rendering:auto;touch-action:none}
canvas{will-change:contents}
.defs-svg{position:absolute;pointer-events:none}
.sp-cauris-container{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.pm-skip{background:transparent;border:none;color:rgba(212,175,55,.38);font-size:clamp(10px,2.8vw,12px);font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:8px 0;cursor:pointer;margin-top:-2px;text-decoration:underline;text-decoration-style:dotted}
.tt-life{font-size:clamp(7px,2vw,9px);font-weight:700;letter-spacing:1.5px;color:rgba(212,175,55,.28);text-transform:uppercase;margin-top:6px;line-height:1.8}
#RANKUP{display:none}
.go-pseudo-display{margin-top:4px;font-size:9px;font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.38);text-transform:uppercase;text-align:center;pointer-events:none}

/* ── HUD ── */
#U{position:fixed;top:0;left:0;right:0;z-index:10;pointer-events:none;padding:max(env(safe-area-inset-top,12px),12px) 16px 0;display:flex;justify-content:space-between;align-items:flex-start}
#S{font-size:clamp(38px,10vw,60px);font-weight:900;color:#fff;letter-spacing:-2px;line-height:1;transition:color .08s,text-shadow .12s;font-variant-numeric:tabular-nums}
#S.g{color:#FFD700;text-shadow:0 0 24px rgba(255,215,0,.9)}
#S.f{color:#FF5500;text-shadow:0 0 24px rgba(255,85,0,.9)}
#S.gf{color:#E8C840;text-shadow:0 0 36px rgba(232,200,64,1),0 0 70px rgba(180,80,255,.5)}
#S.js{color:#FF6B00;text-shadow:0 0 50px rgba(255,107,0,1),0 0 100px rgba(255,200,0,.4)}
.hr{text-align:right}
.hi{font-size:clamp(9px,2.4vw,11px);font-weight:700;letter-spacing:1.5px;line-height:1.7}
#B{color:rgba(212,175,55,.55)}
#DB{color:rgba(0,210,110,.45)}
#R{color:rgba(212,175,55,.38);letter-spacing:2px;text-transform:uppercase}
#CH{color:rgba(240,208,96,.5)}

/* ── STREAK ── */
#SK{position:fixed;bottom:clamp(60px,15vh,82px);right:16px;z-index:11;font-size:clamp(8px,2.2vw,11px);font-weight:800;letter-spacing:2px;color:rgba(212,175,55,.45);text-transform:uppercase;pointer-events:none;text-align:right;transition:all .25s}
#SK.gf{color:#E8C840;text-shadow:0 0 14px rgba(232,200,64,.6)}
#SK.js{color:#FF8800;text-shadow:0 0 14px rgba(255,136,0,.7)}

/* ── NEAR MISS POP ── */
#NM{position:fixed;top:28%;left:50%;transform:translate(-50%,-50%) scale(.75);z-index:14;font-size:clamp(28px,8.5vw,52px);font-weight:900;letter-spacing:6px;color:#FFD700;text-shadow:0 0 50px rgba(255,215,0,1),0 0 100px rgba(212,175,55,.6);opacity:0;pointer-events:none;text-transform:uppercase;transition:opacity .05s,transform .15s cubic-bezier(.19,1,.22,1)}
#NM.v{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ── JAMBAR SUPRÊME ── */
#JSP{position:fixed;inset:0;z-index:17;pointer-events:none;opacity:0;transition:opacity .25s;display:flex;flex-direction:column;align-items:center;justify-content:center;background:transparent}
#JSP.v{opacity:1}
#JSP .jt{font-size:clamp(32px,10vw,58px);font-weight:900;letter-spacing:6px;background:linear-gradient(135deg,#FF6B00,#FFD700,#FF6B00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;filter:drop-shadow(0 0 30px rgba(255,180,0,.8))}
#JSP .js2{font-size:clamp(9px,2.6vw,13px);font-weight:800;letter-spacing:5px;color:rgba(255,180,0,.65);text-transform:uppercase;margin-top:6px}

/* ── FURY ── */
#FM{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:0;transition:opacity .18s}
#FM.v{opacity:1}
#FT{position:fixed;top:17%;left:50%;transform:translate(-50%,-50%) scale(.65);z-index:15;font-size:clamp(28px,9vw,52px);font-weight:900;letter-spacing:5px;color:#FF5500;text-shadow:0 0 60px rgba(255,85,0,1),0 0 120px rgba(255,180,0,.5);opacity:0;pointer-events:none;text-transform:uppercase;transition:opacity .12s,transform .22s cubic-bezier(.19,1,.22,1)}
#FT.v{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ── GOD FLOW ── */
#GF{position:fixed;inset:0;z-index:7;pointer-events:none;opacity:0;transition:opacity .5s}
#GF.v{opacity:1}
#GFT{position:fixed;top:16%;left:50%;transform:translate(-50%,-50%) scale(.55);z-index:15;font-size:clamp(20px,6.5vw,38px);font-weight:900;letter-spacing:8px;background:linear-gradient(135deg,#D4AF37,#E8D080,#9040FF,#D4AF37);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;opacity:0;pointer-events:none;text-transform:uppercase;transition:opacity .18s,transform .32s cubic-bezier(.19,1,.22,1);filter:drop-shadow(0 0 22px rgba(212,175,55,.7))}
#GFT.v{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ── LEGEND ── */
#LGM{position:fixed;inset:0;z-index:18;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}
#LGM.v{opacity:1}
#LGM .lt{font-size:clamp(40px,14vw,70px);font-weight:900;letter-spacing:10px;color:rgba(255,215,0,.97);text-shadow:0 0 70px rgba(255,215,0,.9),0 0 140px rgba(255,180,0,.45);text-transform:uppercase;animation:lgp .38s ease-in-out infinite alternate}
#LGM .ls{font-size:clamp(10px,3vw,14px);font-weight:700;letter-spacing:6px;color:rgba(255,215,0,.55);text-transform:uppercase;margin-top:10px}
@keyframes lgp{0%{transform:scale(.96) translateY(0)}100%{transform:scale(1.04) translateY(-4px)}}

/* ── RECORD BEAT ── */
#RB{position:fixed;top:25%;left:50%;transform:translate(-50%,-50%) scale(.82);z-index:15;font-size:clamp(13px,4vw,20px);font-weight:900;letter-spacing:5px;color:#FFD700;text-shadow:0 0 40px rgba(255,215,0,.8);pointer-events:none;opacity:0;transition:opacity .12s,transform .18s;text-transform:uppercase;white-space:nowrap}
#RB.v{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ── PHASE NAME ── */
#PN{position:fixed;top:18%;left:50%;transform:translateX(-50%);z-index:11;font-size:clamp(10px,2.8vw,14px);font-weight:700;letter-spacing:4px;color:rgba(212,175,55,.38);text-transform:uppercase;pointer-events:none;opacity:0;transition:opacity .35s}
#PN.v{opacity:1}

/* ── MISSION NOTIFY ── */
#MN{position:fixed;top:43%;left:50%;transform:translateX(-50%);z-index:19;font-size:clamp(10px,2.8vw,12px);font-weight:900;letter-spacing:3px;color:#FFD700;text-shadow:0 0 28px rgba(255,215,0,.8);pointer-events:none;opacity:0;transition:opacity .18s;text-align:center;text-transform:uppercase;white-space:nowrap}

/* ── TAP HINT ── */
#TH{position:fixed;bottom:22%;left:50%;transform:translateX(-50%);z-index:7;pointer-events:none;text-align:center;opacity:0;animation:tp 1.6s ease-in-out infinite .4s}
#TH .t1{font-size:clamp(32px,10vw,52px);display:block;filter:drop-shadow(0 0 12px rgba(212,175,55,.4))}
#TH .t2{font-size:clamp(8px,2.2vw,10px);font-weight:700;letter-spacing:4px;color:rgba(212,175,55,.32);text-transform:uppercase;margin-top:6px;display:block}
@keyframes tp{0%,100%{opacity:.28;transform:translateX(-50%) translateY(0)}50%{opacity:.7;transform:translateX(-50%) translateY(-6px)}}

/* ── TITLE SCREEN ── */
#TITLE{position:fixed;inset:0;z-index:6;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;opacity:0;transition:opacity .6s}
#TITLE.v{opacity:1}
#TITLE .tn{font-size:clamp(22px,7vw,36px);font-weight:900;letter-spacing:8px;color:rgba(212,175,55,.85);text-shadow:0 0 40px rgba(212,175,55,.4);text-transform:uppercase}
#TITLE .ts{font-size:clamp(9px,2.5vw,12px);font-weight:700;letter-spacing:3px;color:rgba(212,175,55,.32);text-transform:uppercase}

/* ── FLASH + MF ── */
#DF{position:fixed;inset:0;z-index:22;background:#fff;opacity:0;pointer-events:none}
#MF{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:0;transition:opacity .08s}

/* ── GHOST LINE ── */
#GL{position:fixed;left:0;right:0;height:1px;z-index:6;pointer-events:none;opacity:0;transition:opacity .4s}
#GL.v{opacity:1}
#GL i{display:block;height:1px;background:linear-gradient(90deg,transparent 8%,rgba(227,27,35,.4) 50%,transparent 92%)}
#GL span{position:absolute;right:12px;top:-12px;font-size:7px;font-weight:700;letter-spacing:1px;color:rgba(227,27,35,.5);text-transform:uppercase}

/* ── CLUTCH REVIVE ── */
#CC{position:fixed;bottom:clamp(160px,36vh,220px);left:50%;transform:translateX(-50%) translateY(16px);z-index:22;background:linear-gradient(160deg,rgba(4,10,22,.97),rgba(8,18,36,.99));border:1px solid rgba(212,175,55,.25);padding:14px 20px;min-width:clamp(210px,64vw,290px);text-align:center;opacity:0;pointer-events:none;transition:opacity .28s,transform .28s;box-shadow:0 0 40px rgba(212,175,55,.06)}
#CC.v{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}
.ct{font-size:clamp(10px,2.8vw,12px);font-weight:800;letter-spacing:2px;color:#F5F0E8;text-transform:uppercase;margin-bottom:5px}
.cm{font-size:8px;font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.38);margin-bottom:8px}
.cm span{color:#D4AF37;font-weight:900}
.cb{display:block;width:100%;background:transparent;border:1px solid rgba(0,210,100,.4);color:rgba(0,210,100,.9);font-size:10px;font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:12px 0;cursor:pointer;margin-bottom:5px;transition:all .12s}
.cb:active{background:rgba(0,133,67,.18)}
.cr{display:block;width:100%;background:none;border:none;color:rgba(245,240,232,.18);font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px;cursor:pointer}

/* ── GAME OVER ── */
/* V91 : gap adaptatif petit écran (iPhone SE 568px height) */
#GO{position:fixed;inset:0;z-index:20;background:linear-gradient(160deg,rgba(2,6,16,.96) 0%,rgba(3,10,22,.97) 60%,rgba(0,15,10,.95) 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(2px,0.8vh,5px);opacity:0;pointer-events:none;transition:opacity .32s cubic-bezier(.19,1,.22,1);overflow-y:auto;padding:max(env(safe-area-inset-top,8px),8px) 0 max(env(safe-area-inset-bottom,8px),8px)}
#GO.v{opacity:1;pointer-events:all}
#NR{font-size:clamp(11px,3.2vw,15px);font-weight:900;letter-spacing:4px;color:#FFD700;text-shadow:0 0 28px rgba(255,215,0,.6);text-transform:uppercase;opacity:0;transform:scale(.8);transition:opacity .18s,transform .18s}
#NR.v{opacity:1;transform:scale(1)}
#OM{font-size:clamp(9px,2.5vw,11px);font-weight:700;letter-spacing:3px;color:rgba(212,175,55,.45);text-transform:uppercase}
#OS{font-size:clamp(52px,15vw,96px);font-weight:900;color:#F5F0E8;letter-spacing:-3px;line-height:1;font-variant-numeric:tabular-nums}
#OB{font-size:clamp(10px,2.8vw,13px);font-weight:700;color:rgba(212,175,55,.45);letter-spacing:1px}
#OR{font-size:clamp(9px,2.6vw,12px);font-weight:700;letter-spacing:2px;color:rgba(0,210,110,.6);text-transform:uppercase;margin-top:2px}
#OT{font-size:clamp(9px,2.5vw,11px);font-weight:700;color:rgba(255,180,0,.65);letter-spacing:2px;text-transform:uppercase;margin-top:6px;opacity:0;transition:opacity .35s .28s}
#OT.v{opacity:1}
#MSO{margin-top:8px;text-align:center;opacity:0;transition:opacity .45s .35s;min-height:28px}
#MSO.v{opacity:1}
#MSO .ml{font-size:clamp(8px,2.2vw,10px);font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.35);text-transform:uppercase;margin-bottom:3px}
#MSO .mw{font-size:clamp(8px,2vw,9px);font-weight:700;letter-spacing:1px;color:rgba(0,200,100,.55)}

/* ── BUTTONS ── */
/* V91 : Bouton principal REJOUER — Gold glow pulse subtil (3s, doux) */
.ob{background:linear-gradient(135deg,rgba(0,107,63,.25),rgba(0,160,80,.15));border:2px solid rgba(0,210,100,.7);color:rgba(0,220,100,.95);font-size:clamp(15px,4.2vw,19px);font-weight:900;letter-spacing:5px;text-transform:uppercase;padding:clamp(14px,3.5vh,20px) 0;width:clamp(220px,74vw,340px);cursor:pointer;margin-top:clamp(8px,2vh,16px);transition:all .14s;pointer-events:all;box-shadow:0 0 28px rgba(0,210,100,.16),0 0 55px rgba(212,175,55,.06),inset 0 1px 0 rgba(255,255,255,.06);animation:replayPulse 3s ease-in-out infinite}
.ob:active{background:rgba(0,133,67,.4);transform:scale(.96);box-shadow:0 0 50px rgba(0,210,100,.35),0 0 90px rgba(212,175,55,.15)}
@keyframes replayPulse{0%,100%{box-shadow:0 0 28px rgba(0,210,100,.16),0 0 55px rgba(212,175,55,.06)}50%{box-shadow:0 0 36px rgba(0,210,100,.24),0 0 70px rgba(212,175,55,.12)}}
/* V91 : Bouton WhatsApp — responsive margins */
.ob-wa{background:linear-gradient(135deg,rgba(37,211,102,.22),rgba(0,180,80,.14));border:2px solid rgba(37,211,102,.75);color:rgba(37,211,102,.95);font-size:clamp(13px,3.8vw,17px);font-weight:900;letter-spacing:4px;text-transform:uppercase;padding:clamp(12px,3vh,17px) 0;width:clamp(220px,74vw,340px);cursor:pointer;margin-top:clamp(6px,1.5vh,10px);transition:all .14s;pointer-events:all;box-shadow:0 0 24px rgba(37,211,102,.1)}
.ob-wa:active{background:rgba(37,150,80,.32);transform:scale(.97)}
/* V90 : Bouton leaderboard — bleu profond */
.ob-ldb{background:linear-gradient(135deg,rgba(30,80,180,.22),rgba(50,120,220,.12));border:2px solid rgba(80,160,255,.55);color:rgba(120,190,255,.9);font-size:clamp(13px,3.5vw,16px);font-weight:800;letter-spacing:4px;text-transform:uppercase;padding:16px 0;width:clamp(220px,74vw,340px);cursor:pointer;margin-top:10px;transition:all .14s;pointer-events:all;box-shadow:0 0 18px rgba(80,160,255,.08)}
.ob-ldb:active{background:rgba(30,80,180,.25);transform:scale(.97)}
/* V90 : Bouton ghost — cyan subtil, caché par défaut */
.ob-ghost{background:linear-gradient(135deg,rgba(0,80,140,.18),rgba(40,160,255,.1));border:2px solid rgba(60,160,255,.45);color:rgba(140,210,255,.85);font-size:clamp(11px,3.2vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:14px 0;width:clamp(220px,74vw,340px);cursor:pointer;margin-top:10px;transition:all .14s;pointer-events:all;display:none}
.ob-ghost.v{display:block}
.ob-ghost:active{background:rgba(40,140,220,.2);transform:scale(.97)}
/* ── ANCIEN bouton secondaire conservé pour compatibilité */
.oc{background:transparent;border:2px solid rgba(255,68,0,.4);color:rgba(255,110,0,.9);font-size:clamp(11px,3.2vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:14px 0;width:clamp(210px,64vw,310px);cursor:pointer;margin-top:6px;transition:all .12s;pointer-events:all}
.oc:active{background:rgba(255,68,0,.12);transform:scale(.97)}
.og{background:transparent;border:2px solid rgba(212,175,55,.32);color:rgba(212,175,55,.78);font-size:clamp(11px,3.2vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:14px 0;width:clamp(210px,64vw,310px);cursor:pointer;margin-top:4px;transition:all .12s;pointer-events:all}
.og:active{background:rgba(212,175,55,.08);transform:scale(.97)}
.os{background:transparent;border:1px solid rgba(212,175,55,.18);color:rgba(212,175,55,.48);font-size:clamp(9px,2.4vw,11px);font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:10px 18px;cursor:pointer;margin-top:4px;transition:all .12s;pointer-events:all}
.os:active{border-color:rgba(212,175,55,.5)}

/* ── V90 : Bouton Revoir Run — violet/cyan ghost ── */
.ob-replay{background:linear-gradient(135deg,rgba(40,20,80,.22),rgba(80,40,160,.12));border:2px solid rgba(120,80,255,.55);color:rgba(170,140,255,.9);font-size:clamp(11px,3.2vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:15px 0;cursor:pointer;transition:all .14s;pointer-events:all;box-shadow:0 0 16px rgba(120,80,255,.07)}
.ob-replay:active{background:rgba(80,40,180,.22);transform:scale(.96);box-shadow:0 0 28px rgba(120,80,255,.18)}

/* ── V90 : Bouton Sauvegarde Image — or/ambre ── */
.ob-save{background:linear-gradient(135deg,rgba(80,50,0,.22),rgba(160,110,0,.12));border:2px solid rgba(212,175,55,.55);color:rgba(240,208,96,.9);font-size:clamp(11px,3.2vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:15px 0;cursor:pointer;transition:all .14s;pointer-events:all;box-shadow:0 0 16px rgba(212,175,55,.07)}
.ob-save:active{background:rgba(140,100,0,.22);transform:scale(.96);box-shadow:0 0 28px rgba(212,175,55,.18)}

/* ── V91 : Grille 2 colonnes pour boutons secondaires GO — auto 1-col si ghost caché ── */
.go-btn-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,1.5vh,10px);width:clamp(220px,74vw,340px);margin-top:clamp(6px,1.5vh,10px)}
.go-btn-grid .ob-ldb,.go-btn-grid .ob-replay,.go-btn-grid .ob-save{width:100%;margin-top:0;font-size:clamp(9px,2.7vw,12px);padding:clamp(10px,2.5vh,15px) 6px;letter-spacing:2px}
.go-btn-grid .ob-ghost{width:100%;margin-top:0;font-size:clamp(9px,2.5vw,12px);padding:clamp(10px,2.5vh,14px) 6px;letter-spacing:2px}
/* V91 : Quand ghost est caché, la grille save passe en 1 colonne (SAVE pleine largeur) */
.go-btn-grid .ob-ghost:not(.v)~*,.go-btn-grid:has(.ob-ghost:not(.v)){grid-template-columns:1fr}
.go-btn-grid-auto{grid-template-columns:1fr!important}

/* ── V90 : Tap feedback animation sur boutons GO ── */
@keyframes btnTap{0%{transform:scale(1)}40%{transform:scale(.93)}100%{transform:scale(1)}}
.go-tap{animation:btnTap .18s cubic-bezier(.19,1,.22,1)}

/* ── V90 : Replay overlay header label ── */
#RPOV .rp-header{font-size:clamp(9px,2.5vw,11px);font-weight:800;letter-spacing:3px;color:rgba(212,175,55,.55);text-transform:uppercase;text-align:center;margin-bottom:4px}
#RPOV .rp-label{font-size:clamp(8px,2.2vw,10px);font-weight:700;letter-spacing:2px;color:rgba(140,230,255,.5);text-transform:uppercase;text-align:center;margin-bottom:2px}
/* ── V91 : Replay progress bar — plus épaisse + gradient marqué ── */
#RPOV .rp-progress-wrap{position:absolute;bottom:max(50px,env(safe-area-inset-bottom,50px));left:16px;right:16px;height:22px;display:flex;align-items:center;gap:10px}
#RPOV .rp-progress-track{flex:1;height:6px;background:rgba(212,175,55,.15);overflow:hidden;border-radius:3px;box-shadow:inset 0 1px 2px rgba(0,0,0,.3)}
#RPOV .rp-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,rgba(0,210,100,.85),rgba(212,175,55,.95),rgba(255,180,0,.8));border-radius:3px;transition:width .08s linear;box-shadow:0 0 8px rgba(0,210,100,.3)}
#RPOV .rp-progress-txt{font-size:clamp(8px,2.2vw,10px);font-weight:800;letter-spacing:1px;color:rgba(212,175,55,.55);min-width:80px;text-align:right;white-space:nowrap}

/* ── V90 : Image sauvée overlay (feedback) ── */
#SAVE_IMG_OVERLAY{position:fixed;inset:0;z-index:95;background:rgba(2,6,14,.96);display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px}
#SAVE_IMG_OVERLAY.v{display:flex}
#SAVE_IMG_OVERLAY img{max-width:280px;max-height:460px;border:1px solid rgba(212,175,55,.4);box-shadow:0 0 50px rgba(212,175,55,.18),0 0 100px rgba(0,210,100,.06)}
#SAVE_IMG_OVERLAY .sio-msg{font-size:clamp(10px,2.8vw,13px);font-weight:900;letter-spacing:3px;color:rgba(0,210,100,.9);text-transform:uppercase;text-align:center;text-shadow:0 0 18px rgba(0,210,100,.3)}
#SAVE_IMG_OVERLAY .sio-hint{font-size:clamp(9px,2.3vw,11px);font-weight:700;letter-spacing:1px;color:rgba(212,175,55,.5);text-transform:uppercase;text-align:center;max-width:280px;line-height:1.5}
#SAVE_IMG_OVERLAY .sio-close{background:transparent;border:1px solid rgba(212,175,55,.3);color:rgba(212,175,55,.7);font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:12px 26px;cursor:pointer;margin-top:8px;transition:all .12s}
#SAVE_IMG_OVERLAY .sio-close:active{background:rgba(212,175,55,.1)}
/* V91 : WhatsApp share button in save overlay */
#SAVE_IMG_OVERLAY .sio-wa{background:linear-gradient(135deg,rgba(37,211,102,.25),rgba(0,180,80,.18));border:2px solid rgba(37,211,102,.7);color:rgba(37,211,102,.95);font-size:clamp(12px,3.5vw,15px);font-weight:900;letter-spacing:3px;text-transform:uppercase;padding:14px 28px;cursor:pointer;transition:all .14s;box-shadow:0 0 20px rgba(37,211,102,.12);width:clamp(220px,68vw,300px)}
#SAVE_IMG_OVERLAY .sio-wa:active{background:rgba(37,150,80,.3);transform:scale(.97)}

/* ── TOAST ── */
#TO{position:fixed;bottom:max(70px,env(safe-area-inset-bottom,70px));left:50%;transform:translateX(-50%) translateY(14px);background:rgba(0,133,67,.9);border:1px solid rgba(0,210,100,.4);color:#fff;font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:8px 18px;z-index:30;opacity:0;pointer-events:none;transition:all .28s;white-space:nowrap}
#TO.v{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── SCORE POPUP ── */
.sp{position:fixed;pointer-events:none;z-index:12;font-size:clamp(14px,3.8vw,18px);font-weight:900;color:rgba(240,208,96,.9);text-shadow:0 0 8px rgba(212,175,55,.35);letter-spacing:1px}

/* ── SENEGAL FLAG LINES ── */
.fl{position:fixed;z-index:1;pointer-events:none}
.fl.l{left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#006B3F 33%,#D4AF37 33% 66%,#E31B23 66%);opacity:.28}
.fl.r{right:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,#006B3F 33%,#D4AF37 33% 66%,#E31B23 66%);opacity:.12}
.fl.t{top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#006B3F 33%,#D4AF37 33% 66%,#E31B23 66%);opacity:.22}

/* ── SPRINT 1 — BURST CAURI PARTICLES ── */
.bc-burst{position:fixed;pointer-events:none;z-index:16;border-radius:50%;background:radial-gradient(circle,#FFD700,#FF8C00);animation:bc-fly .6s ease-out forwards}
@keyframes bc-fly{0%{opacity:1;transform:scale(1) translate(0,0)}100%{opacity:0;transform:scale(.3) translate(var(--bx),var(--by))}}
/* ── SPRINT 1 — SLOW MO OVERLAY ── */
#SLOWMO_OVERLAY{position:fixed;inset:0;z-index:13;pointer-events:none;opacity:0;transition:opacity .08s;background:radial-gradient(ellipse at center,rgba(0,20,60,.18) 0%,rgba(0,0,0,.28) 100%)}
#SLOWMO_OVERLAY.v{opacity:1}
/* ── SPRINT 2 — PSEUDO SHARE ── */
#SHARE_MOMENT{background:linear-gradient(135deg,rgba(0,150,80,.18),rgba(0,200,100,.08));border:2px solid rgba(0,210,100,.6)!important}

/* ── V87 : Ghost line améliorée (glow bleu + opacité 0.65 + décalage +8px) ── */
#GL_GHOST{position:fixed;left:0;right:0;z-index:6;pointer-events:none;opacity:0;transition:top .6s cubic-bezier(.19,1,.22,1),opacity .4s}
#GL_GHOST.v{opacity:1}
#GL_GHOST .gh-line{display:block;height:2px;background:linear-gradient(90deg,transparent 2%,rgba(60,160,255,.65) 25%,rgba(140,230,255,.95) 50%,rgba(60,160,255,.65) 75%,transparent 98%);box-shadow:0 0 14px rgba(80,200,255,.7),0 0 28px rgba(60,160,255,.35)}
#GL_GHOST .gh-lbl{position:absolute;left:12px;top:-16px;font-size:8px;font-weight:800;letter-spacing:2px;color:rgba(140,230,255,.9);text-transform:uppercase;white-space:nowrap;text-shadow:0 0 12px rgba(100,200,255,.8),0 0 22px rgba(60,160,255,.5)}

/* ── V87 : Ghost Challenge Overlay (quand ?ref= détecté) ── */
#GHOST_CHALLENGE{position:fixed;top:0;left:0;right:0;z-index:16;pointer-events:none;opacity:0;transition:opacity .35s;padding:max(env(safe-area-inset-top,50px),50px) 0 0}
#GHOST_CHALLENGE.v{opacity:1}
#GHOST_CHALLENGE .gc-inner{margin:0 auto;max-width:340px;background:linear-gradient(160deg,rgba(0,10,30,.92),rgba(0,20,50,.96));border:1px solid rgba(60,160,255,.35);padding:10px 16px;text-align:center;box-shadow:0 0 30px rgba(60,160,255,.12)}
#GHOST_CHALLENGE .gc-label{font-size:clamp(7px,2vw,9px);font-weight:800;letter-spacing:3px;color:rgba(140,230,255,.6);text-transform:uppercase;margin-bottom:2px}
#GHOST_CHALLENGE .gc-pseudo{font-size:clamp(13px,3.8vw,18px);font-weight:900;color:#fff;letter-spacing:2px}
#GHOST_CHALLENGE .gc-score{font-size:clamp(10px,2.8vw,13px);font-weight:700;color:rgba(140,230,255,.8);margin-top:2px;letter-spacing:1px}

/* ── V87 : Mini streak counter en jeu ── */
#STREAK_LIVE{position:fixed;bottom:clamp(105px,22vh,130px);left:16px;z-index:11;font-size:clamp(7px,2vw,9px);font-weight:900;letter-spacing:2px;color:rgba(212,175,55,.4);text-transform:uppercase;pointer-events:none;opacity:0;transition:opacity .25s,transform .2s;transform:scale(.9)}
#STREAK_LIVE.v{opacity:1;transform:scale(1)}
#STREAK_LIVE.hot{color:#FFD700;text-shadow:0 0 12px rgba(255,215,0,.6);animation:slPop .22s ease-out}
@keyframes slPop{0%{transform:scale(1.35)}100%{transform:scale(1)}}

/* ── V87 : WhatsApp CTA flottant (Game Over) ── */
#WA_CTA{background:linear-gradient(135deg,rgba(0,170,80,.22),rgba(0,220,100,.12));border:2px solid rgba(0,210,100,.7)!important;font-size:clamp(14px,4vw,18px)!important;letter-spacing:3px!important}
#WA_CTA:active{background:rgba(0,133,67,.35)!important}

/* ── V87 : Splash cauris animation ── */
#SPLASH .sp-cauris{position:absolute;font-size:16px;animation:spCauriFloat 1.8s ease-in-out forwards;opacity:0}
@keyframes spCauriFloat{0%{opacity:0;transform:translateY(0) scale(.5)}40%{opacity:.8;transform:translateY(-24px) scale(1.1)}100%{opacity:0;transform:translateY(-52px) scale(.6)}}

/* ── V87 : Supabase démo mode badge ── */
#SUPA_DEMO_BADGE{position:fixed;bottom:max(18px,env(safe-area-inset-bottom,18px));left:50%;transform:translateX(-50%);z-index:26;font-size:7px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;background:rgba(3,8,16,.8);border:1px solid rgba(212,175,55,.18);color:rgba(212,175,55,.35);pointer-events:none;opacity:0;transition:opacity .3s;white-space:nowrap;display:none}
#SUPA_DEMO_BADGE.v{opacity:1}

/* ── V86 : Slow-mo vignette canvas overlay ── */
#SLOWMO_OVERLAY{background:radial-gradient(ellipse at center,transparent 35%,rgba(0,10,40,.55) 100%);transition:opacity .12s}
/* ── V86 : In-game share button ── */
#INGAME_SHARE{position:fixed;top:max(env(safe-area-inset-top,12px),12px);left:50%;transform:translateX(-50%);z-index:25;height:32px;padding:0 14px;background:rgba(0,133,67,.7);border:1px solid rgba(0,210,100,.5);color:rgba(245,240,232,.9);font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s;border-radius:2px}
#INGAME_SHARE.v{opacity:0;pointer-events:none}/* V92: remplacé par bouton GO */
/* ── V86 : Ghost test button ── */
#GHOST_TEST_BTN{position:fixed;bottom:max(70px,env(safe-area-inset-bottom,70px));right:max(70px,env(safe-area-inset-right,70px));z-index:25;height:40px;padding:0 12px;background:rgba(3,8,16,.7);border:1px solid rgba(100,200,255,.3);color:rgba(100,200,255,.7);font-size:8px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;display:none;bottom:max(18px,env(safe-area-inset-bottom,18px));left:50%;transform:translateX(-50%);z-index:26;font-size:7px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;background:rgba(3,8,16,.8);border:1px solid rgba(0,200,100,.2);color:rgba(0,200,100,.45);pointer-events:none;opacity:0;transition:opacity .3s;white-space:nowrap}
#SUPA_STATUS.v{opacity:1}
/* ── V86 : burst cauri v2 ── */
.bc-burst{position:fixed;pointer-events:none;z-index:16;border-radius:50%;animation:bc-fly .72s cubic-bezier(.19,1,.22,1) forwards;will-change:transform,opacity}
@keyframes bc-fly{0%{opacity:1;transform:scale(1.4) translate(0,0)}30%{opacity:1;transform:scale(1) translate(calc(var(--bx)*.5),calc(var(--by)*.5))}100%{opacity:0;transform:scale(.2) translate(var(--bx),var(--by))}}

/* V113 : GPU will-change complet */
#S,#NM,#FT,#GFT,#JSP,#RB,#LGM .lt,
#VIGN,#MF,#DF,#FM,#GF,#SLOWMO_OVERLAY,
#GL_GHOST,#STREAK_LIVE,#COMBO,#PN,
.bc-burst,.sp{will-change:transform,opacity}
canvas{will-change:contents}

/* ── V88 : Aberration chromatique pendant le slow-mo ── */
#SLOWMO_OVERLAY{background:radial-gradient(ellipse at center,transparent 35%,rgba(0,10,40,.55) 100%);transition:opacity .12s}
#SLOWMO_OVERLAY.v.chroma::before{content:'';position:fixed;inset:0;z-index:-1;
  background:radial-gradient(ellipse at center,transparent 35%,rgba(0,10,40,.55) 100%);
  mix-blend-mode:screen;pointer-events:none;opacity:.7}
body.slowmo-active canvas{filter:url(#chroma-filter)}

/* ── V88 : SVG Chromatic Aberration Filter (inline) ── */


/* ══════════════════════════════════════════════════════════════════
   V111 : PSEUDO MODAL — 1er Game Over (copy score-aware)
   ══════════════════════════════════════════════════════════════════ */
#PSEUDO_MODAL{position:fixed;inset:0;z-index:99998;background:rgba(2,6,14,.98);
  display:flex;align-items:center;justify-content:center;padding:24px;
  opacity:0;pointer-events:none;transition:opacity .4s;}
#PSEUDO_MODAL.v{opacity:1;pointer-events:all}
.pm-wrap{width:100%;max-width:320px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.pm-pirogue{font-size:clamp(52px,15vw,72px);filter:drop-shadow(0 0 22px rgba(212,175,55,.4));animation:pmBob 1.8s ease-in-out infinite}
@keyframes pmBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.pm-title{font-size:clamp(17px,5vw,24px);font-weight:900;letter-spacing:5px;color:rgba(212,175,55,.92);text-transform:uppercase}
.pm-sub{font-size:clamp(9px,2.5vw,11px);font-weight:700;letter-spacing:2px;color:rgba(245,240,232,.32);text-transform:uppercase;line-height:1.5;max-width:270px}
#PSEUDO_INPUT{width:100%;max-width:290px;background:rgba(245,240,232,.03);border:1px solid rgba(212,175,55,.3);
  color:rgba(245,240,232,.9);font-size:clamp(16px,4.5vw,20px);font-weight:700;letter-spacing:2px;
  text-align:center;padding:15px 16px;outline:none;caret-color:#D4AF37;
  transition:border-color .2s,background .2s;font-family:system-ui,-apple-system,sans-serif;
  border-radius:0;-webkit-appearance:none;}
#PSEUDO_INPUT:focus{border-color:rgba(212,175,55,.75);background:rgba(212,175,55,.04)}
#PSEUDO_INPUT::placeholder{color:rgba(245,240,232,.18);font-size:14px;letter-spacing:1px}
.pm-error{font-size:9px;font-weight:700;letter-spacing:1px;color:rgba(255,80,80,.7);text-transform:uppercase;min-height:14px;transition:opacity .2s}
#PSEUDO_CONFIRM{background:linear-gradient(135deg,rgba(0,107,63,.3),rgba(0,160,80,.18));
  border:2px solid rgba(0,210,100,.6);color:rgba(0,220,100,.95);font-size:clamp(12px,3.5vw,15px);
  font-weight:900;letter-spacing:5px;text-transform:uppercase;padding:15px 0;width:100%;max-width:290px;
  cursor:pointer;transition:all .14s;margin-top:4px;box-shadow:0 0 18px rgba(0,210,100,.1);}
#PSEUDO_CONFIRM:active{background:rgba(0,133,67,.35);transform:scale(.97)}
#PSEUDO_CONFIRM:disabled{opacity:.35;cursor:default;transform:none}
.pm-flag{font-size:8px;font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.2);text-transform:uppercase;margin-top:8px}
.pm-chars{font-size:8px;font-weight:700;letter-spacing:1px;color:rgba(245,240,232,.2);text-align:right;width:100%;max-width:290px;margin-top:-8px}

/* ══════════════════════════════════════════════════════════════════
   V92 : COMPTEUR JOUEURS EN LIGNE
   ══════════════════════════════════════════════════════════════════ */
/* V111 : zéro backdrop-filter — fond opaque (GPU low-end Tecno/Infinix) */
#ONLINE_BADGE{position:fixed;top:max(env(safe-area-inset-top,10px),10px);left:50%;
  transform:translateX(-50%);z-index:12;display:flex;align-items:center;gap:5px;
  background:rgba(3,8,16,.94);border:1px solid rgba(0,200,100,.28);border-radius:20px;
  padding:5px 12px 5px 9px;cursor:pointer;pointer-events:all;
  transition:border-color .25s,background .25s;user-select:none;
  -webkit-tap-highlight-color:transparent;}
#ONLINE_BADGE:active{background:rgba(3,8,16,.8)}
#ONLINE_BADGE.open{border-color:rgba(212,175,55,.3);background:rgba(3,8,16,.88)}
.ob-dot{width:7px;height:7px;border-radius:50%;background:rgba(0,210,100,.8);flex-shrink:0;
  animation:obPulse 2.2s ease-in-out infinite;}
#ONLINE_BADGE.offline .ob-dot{background:rgba(200,60,60,.6);animation:none}
@keyframes obPulse{0%,100%{opacity:.4;transform:scale(.8)}55%{opacity:1;transform:scale(1)}}
#ONLINE_COUNT{font-size:clamp(8px,2.2vw,10px);font-weight:800;letter-spacing:1.5px;color:rgba(245,240,232,.65)}
.ob-lbl{font-size:clamp(6px,1.6vw,8px);font-weight:700;letter-spacing:1px;color:rgba(0,200,100,.45);text-transform:uppercase;display:none}
#ONLINE_PANEL{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);
  min-width:200px;max-width:260px;background:rgba(3,8,16,.97);
  border:1px solid rgba(212,175,55,.2);border-radius:6px;padding:12px 16px;
  box-shadow:0 8px 28px rgba(0,0,0,.55);display:none;pointer-events:all;z-index:1;}
#ONLINE_BADGE.open #ONLINE_PANEL{display:block}
.ob-panel-title{font-size:7px;font-weight:900;letter-spacing:2px;color:rgba(212,175,55,.45);text-transform:uppercase;margin-bottom:8px}
#ONLINE_NAMES{font-size:10px;font-weight:700;color:rgba(245,240,232,.5);line-height:2;word-break:break-word}
.ob-you{color:rgba(0,210,100,.8)!important}
/* Performance low-end hiding */
body.pl #MF,body.pl .fl,body.pl #GF,body.pl #FM{display:none!important}

/* ═══════════════════════════════════════════════════════════════════
   STORE-READY CSS — BLOCS 4, 6, 7, 10, 16, 17
   ═══════════════════════════════════════════════════════════════════ */

/* ── BLOC 4 : LANDSCAPE OVERLAY ── */
#LSOV{position:fixed;inset:0;z-index:9999;background:rgba(3,8,16,.97);display:none;align-items:center;justify-content:center;flex-direction:column;gap:14px}
@media(orientation:landscape){#LSOV{display:flex!important}}
@media(orientation:portrait){#LSOV{display:none!important}}
#LSOV .lo-icon{font-size:52px;animation:lrot 1.6s ease-in-out infinite}
#LSOV .lo-txt{font-size:clamp(11px,3vw,14px);font-weight:800;letter-spacing:3px;color:rgba(212,175,55,.7);text-transform:uppercase}
@keyframes lrot{0%,100%{transform:rotate(0deg)}50%{transform:rotate(90deg)}}

/* ── BLOC 6 : MUTE BUTTON ── */
/* V111 : bouton mute — fond solide */
#MBTN{position:fixed;bottom:max(18px,env(safe-area-inset-bottom,18px));left:max(16px,env(safe-area-inset-left,16px));z-index:25;width:44px;height:44px;border-radius:50%;background:rgba(3,8,16,.92);border:1px solid rgba(212,175,55,.22);color:rgba(245,240,232,.7);font-size:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s;pointer-events:all}
#MBTN:active{opacity:.6}

/* ── BLOC 7 : SETTINGS BUTTON ── */
#SBTN{position:fixed;bottom:max(18px,env(safe-area-inset-bottom,18px));right:max(16px,env(safe-area-inset-right,16px));z-index:25;width:44px;height:44px;border-radius:50%;background:rgba(3,8,16,.6);border:1px solid rgba(212,175,55,.18);color:rgba(245,240,232,.7);font-size:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s;pointer-events:all}
#SBTN:active{opacity:.6}

/* ── BLOC 7 : SETTINGS MODAL ── */
#SMOD{position:fixed;inset:0;z-index:100;background:rgba(2,6,14,.97);display:none;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(env(safe-area-inset-top,20px),20px) max(env(safe-area-inset-right,20px),20px) max(env(safe-area-inset-bottom,20px),20px) max(env(safe-area-inset-left,20px),20px)}
#SMOD.v{display:flex}
#SMOD .sm-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
#SMOD .sm-title{font-size:clamp(16px,4.5vw,22px);font-weight:900;letter-spacing:4px;color:rgba(212,175,55,.85);text-transform:uppercase}
#SMOD .sm-close{width:38px;height:38px;border-radius:50%;background:rgba(245,240,232,.06);border:1px solid rgba(245,240,232,.12);color:rgba(245,240,232,.6);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer}
#SMOD .sm-section{margin-bottom:16px}
#SMOD .sm-label{font-size:clamp(8px,2.2vw,10px);font-weight:800;letter-spacing:2px;color:rgba(212,175,55,.4);text-transform:uppercase;margin-bottom:8px}
#SMOD .sm-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(245,240,232,.04)}
#SMOD .sm-row-label{font-size:clamp(12px,3.2vw,15px);font-weight:700;color:rgba(245,240,232,.75)}
.sm-toggle{width:46px;height:26px;border-radius:13px;background:rgba(245,240,232,.1);border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}
.sm-toggle.on{background:rgba(0,180,90,.5)}
.sm-toggle::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#F5F0E8;transition:transform .2s}
.sm-toggle.on::after{transform:translateX(20px)}
.sm-quality{display:flex;gap:6px}
.sm-quality button{flex:1;padding:8px 0;border:1px solid rgba(212,175,55,.18);background:transparent;color:rgba(245,240,232,.5);font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .15s}
.sm-quality button.active{background:rgba(212,175,55,.15);color:rgba(212,175,55,.9);border-color:rgba(212,175,55,.4)}
#SMOD .sm-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:16px}
#SMOD .sm-stat{text-align:center;padding:10px 4px;background:rgba(245,240,232,.02);border:1px solid rgba(245,240,232,.04);border-radius:4px}
#SMOD .sm-stat-val{font-size:clamp(18px,5vw,26px);font-weight:900;color:rgba(212,175,55,.85)}
#SMOD .sm-stat-lbl{font-size:7px;font-weight:700;letter-spacing:1.5px;color:rgba(245,240,232,.28);text-transform:uppercase;margin-top:2px}
#SMOD .sm-reset{display:block;width:100%;padding:12px;background:transparent;border:1px solid rgba(227,27,35,.3);color:rgba(227,27,35,.6);font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;margin-bottom:18px;transition:all .12s}
#SMOD .sm-reset:active{background:rgba(227,27,35,.1)}
#SMOD .sm-legal{margin-top:8px}
#SMOD .sm-legal-title{font-size:clamp(10px,2.8vw,12px);font-weight:800;letter-spacing:2px;color:rgba(212,175,55,.5);text-transform:uppercase;margin-bottom:6px;cursor:pointer;padding:8px 0}
#SMOD .sm-legal-body{font-size:clamp(9px,2.4vw,11px);font-weight:500;color:rgba(245,240,232,.35);line-height:1.6;display:none;padding:0 0 12px}
#SMOD .sm-legal-body.v{display:block}
#SMOD .sm-brand{text-align:center;margin-top:20px;padding:14px 0}
#SMOD .sm-brand-name{font-size:10px;font-weight:800;letter-spacing:3px;color:rgba(212,175,55,.32);text-transform:uppercase}
#SMOD .sm-brand-ver{font-size:8px;font-weight:700;letter-spacing:1px;color:rgba(245,240,232,.15);margin-top:3px}

/* ── BLOC 10 : SAFE AREA HARDENED ── */
#SK{bottom:max(clamp(60px,15vh,82px),calc(env(safe-area-inset-bottom,0px) + 60px))}

/* ── BLOC 16 : REPLAY OVERLAY ── */
#RPOV{position:fixed;inset:0;z-index:21;background:rgba(2,6,16,.88);display:none;flex-direction:column;align-items:center;justify-content:center;gap:8px}
#RPOV.v{display:flex}
#RPOV .rp-tag{font-size:clamp(8px,2.2vw,10px);font-weight:900;letter-spacing:4px;color:rgba(227,27,35,.6);text-transform:uppercase;animation:rpblink 1s ease infinite}
@keyframes rpblink{0%,100%{opacity:.5}50%{opacity:1}}
#RPOV .rp-sc{font-size:clamp(42px,12vw,68px);font-weight:900;color:#F5F0E8;letter-spacing:-2px;font-variant-numeric:tabular-nums}
#RPOV .rp-bar{position:absolute;bottom:max(80px,env(safe-area-inset-bottom,80px));left:50%;transform:translateX(-50%);display:flex;gap:10px}
/* V91 : Replay speed button highlighted */
.rp-btn{background:transparent;border:1px solid rgba(212,175,55,.3);color:rgba(212,175,55,.7);font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:10px 18px;cursor:pointer;transition:all .12s;pointer-events:all}
.rp-btn:active{background:rgba(212,175,55,.1)}
.rp-btn-speed{background:rgba(212,175,55,.08);border:2px solid rgba(212,175,55,.45);color:rgba(255,215,0,.9);font-size:12px;font-weight:900;min-width:52px;text-align:center}

/* ── BLOC 13 : FPS BADGE (debug, caché par défaut) ── */
#FPSB{position:fixed;top:max(env(safe-area-inset-top,4px),4px);left:50%;transform:translateX(-50%);z-index:99;font-size:8px;font-weight:700;letter-spacing:1px;color:rgba(245,240,232,.12);pointer-events:none;display:none}

/* ══════════════════════════════════════════════════════════════════
   V84 PRODUCT LAYER — SHOP · TUTORIAL · LEADERBOARD · PROGRESSION
   ══════════════════════════════════════════════════════════════════ */

/* ── SHOP OVERLAY ── */
#SHOP{position:fixed;inset:0;z-index:50;background:rgba(2,6,14,.97);display:none;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(env(safe-area-inset-top,16px),16px) 16px max(env(safe-area-inset-bottom,16px),16px)}
#SHOP.v{display:flex}
.sh-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.sh-title{font-size:clamp(16px,4.5vw,22px);font-weight:900;letter-spacing:4px;color:rgba(212,175,55,.85);text-transform:uppercase}
.sh-cauris{font-size:clamp(12px,3.2vw,15px);font-weight:800;color:rgba(212,175,55,.7)}
.sh-close{width:38px;height:38px;border-radius:50%;background:rgba(245,240,232,.06);border:1px solid rgba(245,240,232,.12);color:rgba(245,240,232,.6);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.sh-section{margin-bottom:18px}
.sh-section-title{font-size:clamp(9px,2.4vw,11px);font-weight:800;letter-spacing:3px;color:rgba(212,175,55,.4);text-transform:uppercase;margin-bottom:10px}
.sh-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.sh-card{background:rgba(245,240,232,.03);border:1px solid rgba(212,175,55,.12);padding:14px 10px;text-align:center;cursor:pointer;transition:all .15s;position:relative;overflow:hidden}
.sh-card:active{background:rgba(212,175,55,.08)}
.sh-card.owned{border-color:rgba(0,210,100,.3)}
.sh-card.active{border-color:rgba(212,175,55,.55);background:rgba(212,175,55,.08)}
.sh-card.locked{opacity:.55}
.sh-card-icon{font-size:clamp(28px,8vw,42px);display:block;margin-bottom:6px;filter:drop-shadow(0 0 8px rgba(212,175,55,.2))}
.sh-card-name{font-size:clamp(9px,2.4vw,11px);font-weight:800;letter-spacing:2px;color:rgba(245,240,232,.7);text-transform:uppercase}
.sh-card-price{font-size:clamp(8px,2vw,10px);font-weight:700;letter-spacing:1px;color:rgba(212,175,55,.5);margin-top:4px}
.sh-card-badge{position:absolute;top:4px;right:4px;font-size:7px;font-weight:900;letter-spacing:1px;padding:2px 6px;text-transform:uppercase}
.sh-card-badge.eq{background:rgba(0,210,100,.2);color:rgba(0,210,100,.9)}
.sh-card-badge.new{background:rgba(255,68,0,.2);color:rgba(255,110,0,.9)}
.sh-env-card{background:rgba(245,240,232,.02);border:1px solid rgba(212,175,55,.1);padding:12px;cursor:pointer;transition:all .15s;margin-bottom:8px;display:flex;align-items:center;gap:12px}
.sh-env-card:active{background:rgba(212,175,55,.06)}
.sh-env-card.active{border-color:rgba(212,175,55,.45);background:rgba(212,175,55,.06)}
.sh-env-card.locked{opacity:.45}
.sh-env-icon{font-size:24px;flex-shrink:0}
.sh-env-info{flex:1}
.sh-env-name{font-size:clamp(11px,3vw,14px);font-weight:800;color:rgba(245,240,232,.75);letter-spacing:2px;text-transform:uppercase}
.sh-env-desc{font-size:clamp(8px,2.2vw,10px);font-weight:600;color:rgba(245,240,232,.32);margin-top:2px}
.sh-env-price{font-size:clamp(9px,2.4vw,11px);font-weight:700;color:rgba(212,175,55,.5);flex-shrink:0}

/* ── TUTORIAL OVERLAY ── */
#TUTO{position:fixed;inset:0;z-index:55;background:rgba(2,6,14,.96);display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:20px}
#TUTO.v{display:flex}
.tu-step{display:none;flex-direction:column;align-items:center;gap:12px;max-width:320px}
.tu-step.v{display:flex}
.tu-icon{font-size:clamp(48px,14vw,72px);filter:drop-shadow(0 0 18px rgba(212,175,55,.3))}
.tu-title{font-size:clamp(14px,4vw,20px);font-weight:900;letter-spacing:4px;color:rgba(212,175,55,.85);text-transform:uppercase}
.tu-desc{font-size:clamp(11px,3vw,14px);font-weight:600;color:rgba(245,240,232,.5);line-height:1.5}
.tu-desc em{color:rgba(212,175,55,.8);font-style:normal;font-weight:800}
.tu-dots{display:flex;gap:8px;margin-top:8px}
.tu-dot{width:8px;height:8px;border-radius:50%;background:rgba(245,240,232,.15);transition:all .2s}
.tu-dot.v{background:rgba(212,175,55,.7)}
.tu-btn{background:transparent;border:2px solid rgba(0,210,100,.5);color:rgba(0,210,100,.9);font-size:clamp(11px,3vw,14px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:14px 32px;cursor:pointer;transition:all .12s;margin-top:8px}
.tu-btn:active{background:rgba(0,133,67,.2)}
.tu-skip{background:none;border:none;color:rgba(245,240,232,.2);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:8px;cursor:pointer;margin-top:4px}

/* ── LEADERBOARD OVERLAY ── */
#LDB{position:fixed;inset:0;z-index:48;background:rgba(2,6,14,.97);display:none;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(env(safe-area-inset-top,16px),16px) 16px max(env(safe-area-inset-bottom,16px),16px)}
#LDB.v{display:flex}
.lb-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.lb-title{font-size:clamp(16px,4.5vw,22px);font-weight:900;letter-spacing:4px;color:rgba(212,175,55,.85);text-transform:uppercase}
.lb-close{width:38px;height:38px;border-radius:50%;background:rgba(245,240,232,.06);border:1px solid rgba(245,240,232,.12);color:rgba(245,240,232,.6);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.lb-tabs{display:flex;gap:0;margin-bottom:14px}
.lb-tab{flex:1;padding:10px 0;text-align:center;font-size:clamp(8px,2.2vw,10px);font-weight:800;letter-spacing:2px;color:rgba(245,240,232,.3);text-transform:uppercase;border-bottom:2px solid rgba(245,240,232,.06);cursor:pointer;transition:all .15s}
.lb-tab.v{color:rgba(212,175,55,.85);border-bottom-color:rgba(212,175,55,.6)}
.lb-you{background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);padding:12px;margin-bottom:14px;text-align:center}
.lb-you-rank{font-size:clamp(11px,3vw,14px);font-weight:800;color:rgba(212,175,55,.7);letter-spacing:2px}
.lb-you-msg{font-size:clamp(9px,2.4vw,11px);font-weight:600;color:rgba(245,240,232,.35);margin-top:4px}
.lb-row{display:flex;align-items:center;padding:10px 8px;border-bottom:1px solid rgba(245,240,232,.03);gap:10px}
.lb-row.me{background:rgba(212,175,55,.06)}
.lb-pos{font-size:clamp(14px,4vw,18px);font-weight:900;color:rgba(245,240,232,.5);width:32px;text-align:center}
.lb-pos.gold{color:#FFD700}
.lb-pos.silver{color:#C0C0C0}
.lb-pos.bronze{color:#CD7F32}
.lb-info{flex:1}
.lb-name{font-size:clamp(11px,3vw,13px);font-weight:700;color:rgba(245,240,232,.7)}
.lb-badge{font-size:clamp(8px,2.2vw,10px);font-weight:600;color:rgba(212,175,55,.4)}
.lb-score{font-size:clamp(14px,4vw,18px);font-weight:900;color:rgba(245,240,232,.85);font-variant-numeric:tabular-nums}

/* ── ENHANCED TITLE SCREEN ── */
#TITLE .tt-sub{font-size:clamp(7px,1.8vw,9px);font-weight:700;letter-spacing:3px;color:rgba(212,175,55,.2);text-transform:uppercase;margin-top:4px}
#TITLE .tt-btns{display:flex;gap:8px;margin-top:16px;pointer-events:all}
.tt-btn{background:transparent;border:1px solid rgba(212,175,55,.22);color:rgba(212,175,55,.55);font-size:clamp(8px,2.2vw,10px);font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:8px 14px;cursor:pointer;transition:all .12s}
.tt-btn:active{background:rgba(212,175,55,.1)}

/* ── ENHANCED GAME OVER ── */
.go-rank-up{font-size:clamp(9px,2.6vw,12px);font-weight:900;letter-spacing:3px;background:linear-gradient(135deg,#D4AF37,#FFD700);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;opacity:0;animation:goRankFade .5s .4s forwards}
@keyframes goRankFade{to{opacity:1}}
.go-xp-bar{width:clamp(180px,55vw,260px);height:4px;background:rgba(245,240,232,.06);margin:6px auto;overflow:hidden;position:relative}
.go-xp-fill{height:100%;background:linear-gradient(90deg,#D4AF37,#FFD700);width:0;transition:width .8s cubic-bezier(.19,1,.22,1) .5s}
.go-xp-txt{font-size:7px;font-weight:700;letter-spacing:1.5px;color:rgba(212,175,55,.3);text-transform:uppercase;text-align:center}

/* ── SHOP BUTTON (bottom center) ── */
#SHOPBTN{position:fixed;bottom:max(18px,env(safe-area-inset-bottom,18px));left:50%;transform:translateX(-50%);z-index:25;height:36px;background:rgba(3,8,16,.6);border:1px solid rgba(212,175,55,.18);color:rgba(212,175,55,.55);font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:0 16px;display:flex;align-items:center;gap:6px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s;pointer-events:all}
#SHOPBTN:active{opacity:.6}

/* ── DAILY REWARD POPUP ── */
#DREWARD{position:fixed;inset:0;z-index:60;background:rgba(2,6,14,.96);display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:20px}
#DREWARD.v{display:flex}
.dr-icon{font-size:clamp(52px,16vw,80px);animation:drBounce .6s ease-in-out infinite alternate}
@keyframes drBounce{0%{transform:scale(1) translateY(0)}100%{transform:scale(1.08) translateY(-6px)}}
.dr-title{font-size:clamp(16px,5vw,24px);font-weight:900;letter-spacing:5px;color:rgba(212,175,55,.9);text-transform:uppercase}
.dr-streak{font-size:clamp(11px,3vw,14px);font-weight:700;color:rgba(245,240,232,.4);letter-spacing:2px;text-transform:uppercase}
.dr-streak em{color:rgba(0,210,100,.8);font-style:normal;font-weight:900}
.dr-reward{font-size:clamp(28px,9vw,44px);font-weight:900;color:#FFD700;text-shadow:0 0 28px rgba(255,215,0,.5);margin:8px 0}
.dr-msg{font-size:clamp(9px,2.4vw,11px);font-weight:600;color:rgba(245,240,232,.3);max-width:280px}
.dr-btn{background:transparent;border:2px solid rgba(0,210,100,.5);color:rgba(0,210,100,.9);font-size:clamp(12px,3.5vw,16px);font-weight:800;letter-spacing:3px;text-transform:uppercase;padding:14px 32px;cursor:pointer;transition:all .12s;margin-top:12px}
.dr-btn:active{background:rgba(0,133,67,.2)}

/* ── V88 : Refresh leaderboard button ── */
.lb-refresh{display:block;width:100%;padding:10px 0;background:transparent;border:1px solid rgba(212,175,55,.2);color:rgba(212,175,55,.55);font-size:9px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;margin-bottom:10px;transition:all .15s}
.lb-refresh:active{background:rgba(212,175,55,.08);color:rgba(212,175,55,.85)}

/* ── V88 : Confetti cauris go screen ── */
.go-confetti{position:absolute;top:0;left:0;right:0;pointer-events:none;overflow:hidden;height:200px;z-index:1}
.go-confetti span{position:absolute;font-size:14px;animation:gcFall linear forwards;opacity:0}
@keyframes gcFall{0%{opacity:1;transform:translateY(0) rotate(0deg) scale(1)}100%{opacity:0;transform:translateY(160px) rotate(360deg) scale(.5)}}

/* ── V88 : Splash skip hint ── */
#SPLASH .sp-skip{font-size:clamp(7px,2vw,9px);font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.18);text-transform:uppercase;margin-top:4px;opacity:0;transition:opacity .4s;position:absolute;bottom:max(env(safe-area-inset-bottom,20px),20px)}
#SPLASH .sp-skip.v{opacity:1}

/* ── V88 : subtle river texture overlay on game over ── */
#GO::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(50,100,180,.015) 3px,rgba(50,100,180,.015) 4px);
  opacity:.4}
#GO>*{position:relative;z-index:1}

/* ── ENHANCED CLUTCH ── */
.cc-cauris{display:block;width:100%;background:transparent;border:1px solid rgba(212,175,55,.35);color:rgba(212,175,55,.85);font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:10px 0;cursor:pointer;margin-bottom:5px;transition:all .12s}
.cc-cauris:active{background:rgba(212,175,55,.12)}
.cc-or{font-size:7px;font-weight:700;letter-spacing:2px;color:rgba(245,240,232,.15);text-transform:uppercase;margin:3px 0}

/* ── IMPACT VIGNETTE (game feel) ── */
#VIGN{position:fixed;inset:0;z-index:6;pointer-events:none;opacity:0;transition:opacity .15s;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.35) 100%)}
#VIGN.v{opacity:1}

/* ── COMBO COUNTER ── */
#COMBO{position:fixed;bottom:clamp(42px,11vh,58px);left:50%;transform:translateX(-50%);z-index:11;pointer-events:none;text-align:center;opacity:0;transition:opacity .2s,transform .2s}
#COMBO.v{opacity:1}
#COMBO .cb-num{font-size:clamp(16px,5vw,24px);font-weight:900;color:rgba(212,175,55,.7);letter-spacing:3px;font-variant-numeric:tabular-nums}
#COMBO .cb-label{font-size:clamp(7px,1.8vw,9px);font-weight:800;letter-spacing:3px;color:rgba(212,175,55,.3);text-transform:uppercase}

/* ── BLOC 18 : SPLASH SCREEN NATIVE-LIKE ── */
#SPLASH{position:fixed;inset:0;background:#030810;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;transition:opacity .45s ease}
#SPLASH .sp-icon{font-size:clamp(52px,16vw,80px);filter:drop-shadow(0 0 28px rgba(212,175,55,.3));animation:spPulse 1.4s ease-in-out infinite}
#SPLASH .sp-name{font-size:clamp(14px,4.5vw,22px);font-weight:900;letter-spacing:6px;color:rgba(212,175,55,.8);text-transform:uppercase}
#SPLASH .sp-sub{font-size:clamp(8px,2.2vw,10px);font-weight:700;letter-spacing:3px;color:rgba(212,175,55,.28);text-transform:uppercase}
#SPLASH .sp-bar{width:clamp(80px,28vw,120px);height:2px;background:rgba(212,175,55,.1);border-radius:1px;margin-top:8px;overflow:hidden}
#SPLASH .sp-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,rgba(212,175,55,.6),rgba(0,210,100,.5));border-radius:1px;animation:spLoad 1.2s ease-in-out forwards}
@keyframes spPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.06);opacity:1}}
@keyframes spLoad{0%{width:0}60%{width:75%}100%{width:100%}}
/* V113 FIX-1 : Score micro-scale pulse on each point */
@keyframes scorePop{0%{transform:scale(1)}35%{transform:scale(1.14)}70%{transform:scale(.97)}100%{transform:scale(1)}}
#S.spk{animation:scorePop .18s cubic-bezier(.19,1,.22,1)}
.ob-line{display:block}
.ob-note{font-size:9px;color:rgba(245,240,232,.25)}

#SHARE_TARGET_MODAL{position:fixed;inset:0;z-index:215;background:rgba(3,8,16,.74);display:none;align-items:center;justify-content:center;padding:18px}
#SHARE_TARGET_MODAL.v{display:flex}
.stm-card{width:min(100%,420px);max-height:min(78vh,620px);overflow:auto;background:linear-gradient(180deg,rgba(3,8,16,.98),rgba(5,14,24,.98));border:1px solid rgba(212,175,55,.22);box-shadow:0 16px 80px rgba(0,0,0,.5);padding:18px 16px 16px;border-radius:20px}
.stm-kicker{font-size:8px;font-weight:900;letter-spacing:3px;color:rgba(0,210,100,.58);text-transform:uppercase;margin-bottom:8px}
.stm-title{font-size:clamp(14px,4vw,18px);font-weight:900;letter-spacing:1px;color:rgba(245,240,232,.96);line-height:1.2;margin-bottom:6px}
.stm-meta{font-size:9px;font-weight:700;letter-spacing:2px;color:rgba(212,175,55,.45);text-transform:uppercase;margin-bottom:14px}
.stm-field{border-top:1px solid rgba(245,240,232,.06);padding:10px 0}
.stm-label{font-size:8px;font-weight:800;letter-spacing:2px;color:rgba(212,175,55,.42);text-transform:uppercase;margin-bottom:6px}
.stm-value{font-size:12px;font-weight:700;color:rgba(245,240,232,.82);line-height:1.6;word-break:break-word}
.stm-message{white-space:pre-wrap}
.stm-actions{display:flex;gap:10px;margin-top:14px}
.stm-btn{flex:1;border:1px solid rgba(212,175,55,.22);background:rgba(245,240,232,.04);color:rgba(245,240,232,.88);font-size:10px;font-weight:900;letter-spacing:2px;text-transform:uppercase;padding:13px 10px;border-radius:14px;cursor:pointer}
.stm-btn:active{transform:scale(.98)}
.stm-btn-primary{background:linear-gradient(135deg,rgba(0,118,70,.52),rgba(0,178,96,.34));border-color:rgba(0,210,100,.55);color:rgba(245,240,232,.98)}
#STM_ACCEPT{display:none}
#STM_ACCEPT.v{display:block}