/* Monde des missions — univers « jeu de blocs » maison (monde à part du site) */
:root{--ciel1:#7cc8ff;--ciel2:#d4f0ff;--herbe:#5BC236;--herbe2:#3E9E2E;--terre:#8a5a35;--terre2:#6b4426;--bois:#b07a45;--bois2:#7d5229;
  --or:#FFC93C;--or2:#E09A00;--pierre:#8d97b0;--pierre2:#646f8c;--bleu:#2B5FD9;--bleu2:#1d3f99;--rouge:#E63B2E;--ink:#14151A;
  --pix:"Press Start 2P",monospace;--txt:"Nunito",system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--txt);color:var(--ink);background:linear-gradient(var(--ciel1),var(--ciel2) 70%);background-attachment:fixed;min-height:100vh;font-size:17px;font-weight:600}
a{color:inherit}
/* nuages pixel */
.nuages{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.nuage{position:absolute;width:96px;height:24px;background:#fff;box-shadow:24px -16px 0 #fff,48px -16px 0 #fff,72px 0 0 #fff,-24px 0 0 #fff;opacity:.9;animation:vent 60s linear infinite}
@keyframes vent{from{transform:translateX(-30vw)}to{transform:translateX(130vw)}}
/* barre du haut */
.hud{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:10px 16px;background:rgba(20,21,26,.82);color:#fff;backdrop-filter:blur(6px)}
.hud .logo{font-family:var(--pix);font-size:.7rem;text-decoration:none;color:#fff;margin-right:auto;line-height:1.4}.hud .logo b{color:var(--or)}
.hud .cpt{display:flex;align-items:center;gap:6px;font-weight:900;font-size:1rem}
.hud button{all:unset;cursor:pointer;display:flex;align-items:center;padding:4px;border-radius:6px}.hud button:hover{background:rgba(255,255,255,.12)}
main{position:relative;z-index:1;margin:0 auto;padding:18px 0 90px}
.titre-monde,.m-wrap{max-width:620px;margin-left:auto;margin-right:auto;padding:0 14px}
#app{max-width:620px;margin:0 auto;padding:18px 14px 110px;position:relative;z-index:1}
/* titre du monde */
.titre-monde{text-align:center;margin:8px 0 18px;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.25)}
.titre-monde h1{font-family:var(--pix);font-size:1.15rem;line-height:1.6;margin:0}
.titre-monde p{margin:6px 0 0;font-weight:800}
/* zones = thèmes */
.zone{position:relative;margin:26px 0 0;padding:0 0 30px;overflow:hidden;border-top:6px solid rgba(0,0,0,.18)}
.zin{position:relative;z-index:1;max-width:620px;margin:0 auto;padding:22px 14px 0}
.decor{position:absolute;inset:0;pointer-events:none}.dc{position:absolute;filter:drop-shadow(3px 4px 0 rgba(0,0,0,.18))}
.plaine{background-color:#6cc644;background-image:radial-gradient(#5bb236 18%,transparent 19%),radial-gradient(#7fd655 18%,transparent 19%);background-size:28px 28px,36px 36px;background-position:0 0,14px 18px}
.montagne{background-color:#dbe9f7;background-image:radial-gradient(#c3d6ec 20%,transparent 21%),radial-gradient(#fff 16%,transparent 17%);background-size:30px 30px,40px 40px;background-position:0 0,16px 20px}
.desert{background-color:#f2d37a;background-image:radial-gradient(#e3bf5e 18%,transparent 19%),radial-gradient(#f8e3a5 16%,transparent 17%);background-size:26px 26px,38px 38px;background-position:0 0,12px 20px}
.grotte{background-color:#3b2a5c;background-image:radial-gradient(#4a3772 20%,transparent 21%),radial-gradient(#2d1f48 18%,transparent 19%);background-size:30px 30px,42px 42px;background-position:0 0,15px 21px}
.grotte .panneau{background:#6c4a9e;border-color:#4a2f73;box-shadow:0 5px 0 #4a2f73}.grotte .sous{color:#e9dcff}
.zone-ban{position:relative;background:var(--zc,var(--herbe2));color:#fff;border:4px solid rgba(0,0,0,.25);box-shadow:0 6px 0 rgba(0,0,0,.25);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.zone-ban h2{font-family:var(--pix);font-size:.78rem;line-height:1.6;margin:0}.zone-ban .zp{display:flex;align-items:center;gap:6px;font-weight:900;white-space:nowrap}
.sous{font-family:var(--pix);font-size:.62rem;color:#fff;text-shadow:2px 2px 0 rgba(0,0,0,.3);text-align:center;margin:22px 0 6px;line-height:1.6}
/* panneau de chapitre (bois) */
.panneau{display:block;width:max-content;max-width:88%;margin:22px auto 10px;background:var(--bois);border:4px solid var(--bois2);box-shadow:0 5px 0 var(--bois2);color:#fff;padding:8px 14px;text-align:center;font-weight:900;font-size:.95rem;text-decoration:none;text-shadow:1px 1px 0 rgba(0,0,0,.35)}
/* chemin de blocs */
.chemin{display:flex;flex-direction:column;align-items:center;gap:18px;padding:6px 0}
.bloc{--dx:0px;position:relative;transform:translateX(var(--dx));display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit}
.cube{position:relative;width:74px;height:66px;cursor:pointer;image-rendering:pixelated;
  background:linear-gradient(var(--top1,var(--herbe)) 0 34%,var(--top2,var(--herbe2)) 34% 42%,transparent 42%),
    repeating-linear-gradient(90deg,var(--side1,var(--terre)) 0 9px,var(--side2,var(--terre2)) 9px 12px);
  border:4px solid rgba(0,0,0,.35);box-shadow:0 7px 0 rgba(0,0,0,.3);transition:transform .12s ease-out}
.bloc:active .cube{transform:translateY(4px);box-shadow:0 3px 0 rgba(0,0,0,.3)}
.cube .num{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--pix);font-size:.9rem;color:#fff;text-shadow:2px 2px 0 rgba(0,0,0,.45);padding-top:14px}
.bloc .nom{margin-top:9px;max-width:150px;text-align:center;font-size:.82rem;line-height:1.2;font-weight:900;color:#1b2b44;background:rgba(255,255,255,.85);padding:3px 8px;border-radius:6px}
.bloc .etoiles{display:flex;gap:2px;margin-top:4px}
.bloc.fait .cube{--top1:var(--or);--top2:var(--or2);--side1:#e0b02c;--side2:#c48a00}
.bloc.verrou .cube{opacity:.62;cursor:default}
.lock{position:absolute;right:-8px;top:-10px}
.bloc.verrou .nom{opacity:.75}.bloc.verrou .cube .num{opacity:.8}
.bloc.ici{margin-top:44px}.bloc.ici .cube{animation:rebond 1.4s ease-in-out infinite}
@keyframes rebond{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.bulle{position:absolute;top:-46px;left:50%;transform:translateX(-50%);background:#fff;border:3px solid var(--ink);padding:6px 10px;font-family:var(--pix);font-size:.55rem;white-space:nowrap;box-shadow:0 4px 0 rgba(0,0,0,.2)}
.bulle:after{content:"";position:absolute;bottom:-9px;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--ink)}
.bloc .heros{position:absolute;left:-46px;top:2px;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.25))}
.sol{height:40px;margin:0;background:linear-gradient(var(--herbe) 0 12px,var(--herbe2) 12px 16px,var(--terre) 16px);border-top:4px solid rgba(0,0,0,.2)}
@media (prefers-reduced-motion:reduce){.nuage,.bloc.ici .cube{animation:none}}
/* ---------- écran de mission & de jeu ---------- */
.carte{background:#fff;border:4px solid var(--ink);box-shadow:0 8px 0 rgba(0,0,0,.25);padding:16px 18px;margin:0 0 18px}
.carte h2{font-family:var(--pix);font-size:.72rem;line-height:1.6;margin:0 0 12px;color:var(--bleu2)}
.retour{display:inline-flex;align-items:center;gap:6px;font-weight:900;color:#fff;text-decoration:none;text-shadow:1px 1px 0 rgba(0,0,0,.3);margin:0 0 10px}
.m-titre{color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.25);margin:0 0 14px}.m-titre p{margin:0;font-weight:800}.m-titre h1{font-family:var(--pix);font-size:1rem;line-height:1.6;margin:4px 0 0}
.m-box{border:3px solid var(--bleu);background:#eaf0ff;padding:10px 14px;margin:0 0 10px}.m-box>b{display:block;color:var(--bleu2);margin-bottom:4px}.m-box p{margin:0 0 6px}.m-box p:last-child{margin:0}
.m-ex{border:3px dashed #c9b48e;background:#fffaf0;padding:9px 12px;margin:0 0 10px}
.m-att{border-left:5px solid var(--rouge);padding:2px 0 2px 12px;margin:10px 0 0}.m-att b{color:var(--rouge)}
.niveaux{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.niv{all:unset;box-sizing:border-box;cursor:pointer;text-align:center;background:#fff8e0;border:4px solid var(--or2);box-shadow:0 6px 0 var(--or2);padding:12px 6px}
.niv:active{transform:translateY(4px);box-shadow:0 2px 0 var(--or2)}
.niv b{display:block;font-family:var(--pix);font-size:.6rem;margin:8px 0 4px}.niv small{font-size:.78rem;color:#6b5a2a;font-weight:800}
.niv.ok{background:var(--or);border-color:var(--or2)}
.niv.verrou{background:#e3e7f0;border-color:var(--pierre2);box-shadow:0 6px 0 var(--pierre2);cursor:default}
@media(max-width:480px){.niveaux{grid-template-columns:1fr}}
/* jeu */
.jeu-top{display:flex;align-items:center;gap:12px;margin:4px 0 16px}
.jeu-top button{all:unset;cursor:pointer;font-family:var(--pix);color:#fff;font-size:.8rem;text-shadow:2px 2px 0 rgba(0,0,0,.3)}
.barre{flex:1;height:20px;background:rgba(255,255,255,.55);border:4px solid var(--ink)}
.barre i{display:block;height:100%;width:0;background:linear-gradient(var(--herbe) 0 50%,var(--herbe2) 50%);transition:width .35s cubic-bezier(.2,.8,.2,1)}
.combo{font-family:var(--pix);font-size:.6rem;color:#fff;background:var(--rouge);padding:5px 8px;border:3px solid var(--ink);display:flex;align-items:center;gap:4px}
.combo[hidden]{display:none}
.q-zone{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 0 14px;text-align:center}
.q-zone .heros{flex:none}
.q-carte{width:100%;position:relative;background:#fff;border:4px solid var(--ink);box-shadow:0 6px 0 rgba(0,0,0,.25);padding:14px 16px}
.q-carte:before{content:"";position:absolute;top:-14px;left:50%;margin-left:-7px;border:7px solid transparent;border-bottom-color:var(--ink)}
.q-meta{font-size:.78rem;color:#6b7280;margin:0 0 6px;font-weight:800}
.q{font-size:1.3rem;line-height:1.9;margin:0;font-weight:800}
.rep{width:130px;font:inherit;font-size:1.2rem;font-weight:900;text-align:center;padding:4px 8px;border:4px solid var(--ink);background:#fffbe8;outline:none}
.rep:focus{background:#fff;border-color:var(--bleu)}.rep.ok{background:#dff6d2;border-color:var(--herbe2)}.rep.ko{background:#ffe0dc;border-color:var(--rouge)}
.choix{display:grid;gap:10px;margin:0 auto 14px;max-width:460px}.opt{text-align:center}
#aide{display:block;margin:0 auto}.choix.two{grid-template-columns:1fr 1fr}
.opt{all:unset;box-sizing:border-box;cursor:pointer;background:#fff;border:4px solid var(--ink);box-shadow:0 5px 0 rgba(0,0,0,.25);padding:12px 14px;font-weight:900;font-size:1.05rem}
.opt:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.25)}.opt.sel{background:#eaf0ff;border-color:var(--bleu)}
.opt.ok{background:#dff6d2;border-color:var(--herbe2)}.opt.ko{background:#ffe0dc;border-color:var(--rouge);opacity:.75}.opt[disabled]{cursor:default}
.aide{all:unset;cursor:pointer;color:#fff;font-weight:900;text-decoration:underline;text-shadow:1px 1px 0 rgba(0,0,0,.3)}
.methode-pop{margin:12px 0}
/* bandeau du bas, façon appli */
.pied{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:14px 16px calc(14px + env(safe-area-inset-bottom));background:#fff;border-top:4px solid var(--ink);transition:background .2s}
.pied .in{max-width:620px;margin:0 auto;display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap}
.pied .msg{flex:1;min-width:200px}.pied .msg b{font-family:var(--pix);font-size:.7rem;line-height:1.6;display:block}.pied .msg div{margin-top:4px;line-height:1.55;font-weight:700}
.pied.ok{background:#dff6d2}.pied.ok .msg b{color:var(--herbe2)}.pied.mi{background:#fff3c4}.pied.ko{background:#ffe0dc}.pied.ko .msg b{color:var(--rouge)}
.gros{all:unset;cursor:pointer;font-family:var(--pix);font-size:.72rem;color:#fff;background:var(--herbe);border:4px solid var(--ink);box-shadow:0 6px 0 var(--herbe2);padding:14px 18px;text-align:center}
.gros:active{transform:translateY(4px);box-shadow:0 2px 0 var(--herbe2)}.gros.bleu{background:var(--bleu);box-shadow:0 6px 0 var(--bleu2)}
.gros[disabled]{opacity:.45;cursor:default}
.xp{font-family:var(--pix);font-size:.6rem;color:var(--bleu2);display:flex;align-items:center;gap:4px;margin-top:6px}
/* fin de niveau */
.fin{position:relative;text-align:center;background:#fff;border:4px solid var(--ink);box-shadow:0 8px 0 rgba(0,0,0,.25);padding:24px 16px;overflow:hidden}
.fin h2{font-family:var(--pix);font-size:.9rem;line-height:1.6;margin:10px 0}
.fin .score{font-family:var(--pix);font-size:1.4rem;margin:10px 0}
.fin .gains{display:flex;justify-content:center;gap:18px;font-weight:900;margin:8px 0 16px}.fin .gains span{display:flex;align-items:center;gap:6px}
.fin .acts{display:flex;flex-direction:column;gap:12px;align-items:center}
.coffre{display:inline-block;animation:ouvre .6s cubic-bezier(.2,.8,.2,1)}@keyframes ouvre{0%{transform:scale(.3) rotate(-12deg)}70%{transform:scale(1.15)}100%{transform:none}}
.px{position:absolute;top:-10px;width:9px;height:9px;animation:tombe 2s linear forwards}@keyframes tombe{to{transform:translateY(520px) rotate(360deg)}}
.heros.joie{animation:saut .5s ease-out}@keyframes saut{30%{transform:translateY(-14px)}100%{transform:none}}
.heros.triste{animation:non .4s}@keyframes non{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.pose-c{text-align:center;margin:8px 0}.pose{display:inline-grid;grid-template-columns:repeat(var(--w),1.05em);font-family:"Courier New",monospace;font-size:1.25rem;line-height:1.35;text-align:center;font-weight:700}
.pose span{display:block;height:1.35em}.pose .pad{opacity:.55}.pose .u{border-bottom:3px solid var(--ink)}.pose .box{border:2px dashed #ccc;margin:1px}
@media(max-width:640px){.q{font-size:1.12rem}.rep{width:110px;font-size:16px}.choix.two{grid-template-columns:1fr}.titre-monde h1{font-size:.9rem}}
@media (prefers-reduced-motion:reduce){.coffre,.heros.joie,.heros.triste,.px{animation:none}}

/* pages de mission : même décor de plaine que le monde */
body.scene{background-color:#6cc644;background-image:linear-gradient(var(--ciel1),var(--ciel2) 140px,transparent 140px),radial-gradient(#5bb236 18%,transparent 19%),radial-gradient(#7fd655 18%,transparent 19%);
  background-size:100% 100%,28px 28px,36px 36px;background-position:0 0,0 0,14px 18px;background-attachment:scroll}
body.scene .retour,body.scene .m-titre,body.scene .aide,body.scene .jeu-top button{text-shadow:2px 2px 0 rgba(0,0,0,.45)}
body.scene .m-titre h1,body.scene .m-titre p{background:rgba(20,21,26,.55);display:inline-block;padding:4px 8px}
.decor-fixe{position:fixed;inset:0;pointer-events:none;z-index:0}
body.scene .nuages{display:none}
@media(max-width:700px){.decor-fixe{display:none}}
/* ---------- monde compact (onglets + cartes) ---------- */
body.monde{background-color:#6cc644;background-image:radial-gradient(#5bb236 18%,transparent 19%),radial-gradient(#7fd655 18%,transparent 19%);background-size:28px 28px,36px 36px;background-position:0 0,14px 18px}
.mw{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:18px 14px 60px}
.suite{display:flex;align-items:center;gap:16px;background:#fff;border:4px solid var(--ink);box-shadow:0 8px 0 rgba(0,0,0,.25);padding:14px 18px;margin:0 0 18px}
.su-t{flex:1;display:flex;flex-direction:column}.su-t span{font-weight:800;color:#6b7280;font-size:.9rem}.su-t b{font-size:1.25rem;font-weight:900;line-height:1.25}.su-t small{color:#6b7280;font-weight:700}
.ogs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 14px}
.og{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:10px 12px;background:#fff;border:4px solid var(--ink);box-shadow:0 5px 0 rgba(0,0,0,.25);border-top:10px solid var(--zc)}
.og b{font-family:var(--pix);font-size:.55rem;color:var(--zc)}.og span{font-weight:900;font-size:.95rem;line-height:1.2}.og em{font-style:normal;display:flex;align-items:center;gap:4px;font-weight:800;font-size:.82rem;color:#6b5a2a;margin-top:2px}
.og.on{background:var(--zc);color:#fff}.og.on b,.og.on em{color:#fff}
.og:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.25)}
.pz{border:4px solid var(--ink);box-shadow:0 8px 0 rgba(0,0,0,.25);padding:14px}
.pz-in{background:rgba(255,255,255,.0)}
.sp{font-family:var(--pix);font-size:.62rem;line-height:1.6;color:#fff;background:var(--zc);display:inline-block;padding:6px 10px;margin:6px 0 10px;border:3px solid var(--ink)}
.grille{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 12px}
.cc{background:#fff;border:3px solid var(--ink);padding:10px 12px}
.cc-t{display:block;font-weight:900;font-size:1rem;color:var(--ink);text-decoration:none;margin:0 0 6px;padding-bottom:6px;border-bottom:3px dashed #e5dcc7}
a.cc-t:hover{color:var(--bleu)}
.cc ul{list-style:none;margin:0;padding:0}
.mi{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:6px 4px;text-decoration:none;color:inherit;border-radius:4px}
a.mi:hover{background:#f3f7ff}
.mb{width:30px;height:28px;display:grid;place-items:center;font-family:var(--pix);font-size:.55rem;color:#fff;text-shadow:1px 1px 0 rgba(0,0,0,.4);
  background:linear-gradient(var(--herbe) 0 38%,var(--herbe2) 38% 48%,var(--terre) 48%);border:3px solid rgba(0,0,0,.35)}
.mt{font-weight:800;font-size:.92rem;line-height:1.25}
.ms{display:flex;align-items:center;gap:2px;white-space:nowrap}.ms small{font-size:.72rem;color:#8a7f72;margin-left:4px;font-weight:800}
.mi.verrou{opacity:.55}.mi.verrou .mb{filter:saturate(.4)}
.mi.fait .mb{background:linear-gradient(var(--or) 0 38%,var(--or2) 38% 48%,#c48a00 48%)}
.mi.ici{background:#fff6cc;outline:3px solid var(--or2)}
@media(max-width:760px){.grille{grid-template-columns:1fr}.ogs{grid-template-columns:1fr 1fr}.suite{flex-wrap:wrap}.suite .gros{width:100%}}
/* jeu : centré au milieu de l'écran sur ordinateur */
@media(min-width:761px){body.scene #app.jeu{min-height:calc(100vh - 60px - 96px);display:flex;flex-direction:column;justify-content:center;padding-top:10px;padding-bottom:120px}}
@media(min-width:761px){body.scene #app.jeu .q{font-size:1.65rem}body.scene #app.jeu .q-carte{padding:22px 26px}body.scene #app.jeu .rep{width:150px;font-size:1.45rem}body.scene #app.jeu .opt{font-size:1.15rem;padding:14px 16px}}
/* décor discret (Ben 5/10 : le décor attire le regard) */
body.monde,body.scene{background-color:#8fd16b!important;background-image:radial-gradient(rgba(255,255,255,.07) 18%,transparent 19%)!important;background-size:34px 34px!important}
body.scene{background-image:linear-gradient(#bfe6ff,#e3f4ff 140px,transparent 140px),radial-gradient(rgba(255,255,255,.07) 18%,transparent 19%)!important;background-size:100% 100%,34px 34px!important}
.decor-fixe{opacity:.35;filter:saturate(.7)}
.decor-fixe .dc:nth-child(2n){display:none}
.pz{background:rgba(255,255,255,.35)}
/* police lisible (Ben 5/10) : Fredoka pour les titres et boutons, Nunito pour le texte ; plus de police pixel */
:root{--pix:"Fredoka","Nunito",system-ui,sans-serif}
body{font-size:18px}
.hud .logo{font-size:1rem;font-weight:700;line-height:1.1}
.og b{font-size:.85rem;font-weight:700;letter-spacing:.02em}.og span{font-size:1.02rem}
.sp{font-size:1rem;font-weight:700}
.carte h2{font-size:1.15rem;font-weight:700}
.m-titre h1{font-size:1.6rem;font-weight:700}
.niv b{font-size:1.05rem;font-weight:700}
.gros{font-size:1.1rem;font-weight:700;letter-spacing:.03em}
.pied .msg b{font-size:1.2rem;font-weight:700}
.fin h2{font-size:1.6rem;font-weight:700}.fin .score{font-size:2.2rem;font-weight:700}
.combo{font-size:.95rem;font-weight:700}.xp{font-size:.95rem;font-weight:700}
.mb{font-size:.85rem;font-weight:700}.bulle{font-size:.85rem;font-weight:700}
.q-meta{font-size:.9rem}.mt{font-size:1rem}.cc-t{font-size:1.08rem}.su-t b{font-size:1.35rem}
.jeu-top button{font-size:1.2rem;font-weight:700}
.pied .in{width:100%}.pied .msg{min-width:0}
.pied{display:block!important}
/* plus de bande de ciel en haut des pages de mission (Ben) */
body.scene{background-image:radial-gradient(rgba(255,255,255,.07) 18%,transparent 19%)!important;background-size:34px 34px!important}
body.scene .m-titre h1,body.scene .m-titre p{background:none;padding:0}
/* ---------- décors à tester (sélecteur temporaire) ---------- */
body.d-nuit{background:#1b2347!important;background-image:radial-gradient(#fff 1px,transparent 1.5px),radial-gradient(rgba(255,255,255,.5) 1px,transparent 1.5px)!important;background-size:90px 90px,50px 50px!important;background-position:0 0,25px 35px!important}
body.d-cahier{background:#fbfaf5!important;background-image:linear-gradient(rgba(43,95,217,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(43,95,217,.13) 1px,transparent 1px)!important;background-size:24px 24px!important}
body.d-ocean{background:#4fb8e8!important;background-image:radial-gradient(rgba(255,255,255,.18) 20%,transparent 21%)!important;background-size:46px 22px!important}
body.d-espace{background:#140c2e!important;background-image:radial-gradient(#ffd166 1.5px,transparent 2px),radial-gradient(#b9a7ff 1px,transparent 1.5px),radial-gradient(#fff 1px,transparent 1.5px)!important;background-size:140px 140px,70px 70px,40px 40px!important;background-position:0 0,30px 40px,10px 15px!important}
body.d-nuit .decor-fixe,body.d-cahier .decor-fixe,body.d-ocean .decor-fixe,body.d-espace .decor-fixe{display:none}
body.d-nuit .retour,body.d-espace .retour{color:#fff}
body.d-cahier .retour,body.d-cahier .m-titre,body.d-cahier .aide,body.d-cahier .jeu-top button{color:var(--ink);text-shadow:none!important}
body.d-cahier .hud{background:#2B5FD9}
.choixdecor{position:fixed;right:12px;bottom:12px;z-index:40;display:flex;gap:6px;flex-wrap:wrap;background:#fff;border:3px solid var(--ink);padding:6px 8px;font-size:.8rem;font-weight:800;align-items:center;box-shadow:0 4px 0 rgba(0,0,0,.25)}
.choixdecor button{all:unset;cursor:pointer;padding:4px 8px;border:2px solid var(--ink);background:#f3f3f3}.choixdecor button.on{background:var(--or)}
body.scene .choixdecor{bottom:auto;top:66px}

/* VÉRIFIER sous la question, plus en bas de l'écran (Ben 5/10) */
.pied{position:static!important;border:4px solid var(--ink);box-shadow:0 6px 0 rgba(0,0,0,.2);padding:12px 14px;margin:0 0 14px;background:#fff}
.pied .in{max-width:none;justify-content:center}.pied .msg:empty{display:none}.pied .msg{text-align:left}
body.scene #app.jeu{padding-bottom:40px}
.pied:not(.ok):not(.mi):not(.ko){border:none;box-shadow:none;background:transparent;padding:0}

.jeu-titre{font-family:var(--pix);font-size:1.5rem;font-weight:700;text-align:center;margin:0 0 10px;color:var(--ink)}
.chrono{font-family:var(--pix);font-weight:700;font-size:1rem;background:#fff;border:3px solid var(--ink);padding:3px 8px;min-width:58px;text-align:center}
.temps{margin:-4px 0 10px;font-weight:800}
@media(max-width:640px){.jeu-titre{font-size:1.15rem}}

.top10{max-width:340px;margin:0 auto 16px;text-align:left;border:3px solid var(--ink);padding:10px 12px;background:#fffbe8}
.top10 h3{font-family:var(--pix);font-size:1rem;margin:0 0 6px;display:flex;align-items:center;gap:6px}
.top10 ol{list-style:none;margin:0;padding:0}.top10 li{display:grid;grid-template-columns:24px 64px 1fr auto;gap:8px;padding:3px 4px;border-bottom:1px dashed #e5dcc7}
.top10 li span{font-weight:900;color:var(--bleu2)}.top10 li small{color:#8a7f72;font-weight:700}.top10 li.moi{background:var(--or);border-radius:4px}
.top10 p{margin:6px 0 0;font-size:.78rem;color:#8a7f72}
.top10 li em{font-style:normal;font-weight:800}

.btn-quit,.jeu-top .btn-quit{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:var(--pix);font-weight:700;font-size:1rem!important;color:var(--ink)!important;text-shadow:none!important;
  background:#fff;border:3px solid var(--ink);box-shadow:0 4px 0 rgba(0,0,0,.25);padding:6px 12px;white-space:nowrap}
.btn-quit:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.25)}
a.retour.btn-quit{margin:0 0 14px;text-decoration:none}
.conf-quit{position:absolute;z-index:5;margin-top:46px;background:#fff;border:3px solid var(--ink);box-shadow:0 4px 0 rgba(0,0,0,.25);padding:8px 10px;font-weight:800;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.conf-quit button{all:unset;cursor:pointer;border:2px solid var(--ink);padding:3px 10px;font-weight:900}.conf-quit #qOui{background:#ffe0dc}.conf-quit #qNon{background:#dff6d2}
.jeu-top{position:relative}
.conf-quit{top:100%;left:0;margin-top:10px!important}

.t-ong{display:flex;gap:6px;margin:0 0 8px}.t-ong button{all:unset;cursor:pointer;flex:1;text-align:center;font-weight:900;font-size:.85rem;padding:5px 6px;border:2px solid var(--ink);background:#fff}
.t-ong button.on{background:var(--bleu);color:#fff}
.t-ex{font-size:.75rem!important;color:#8a7f72;margin:0 0 6px!important;font-style:italic}
.t-cpt{font-size:.8rem!important;color:var(--ink)!important;background:#eaf0ff;padding:6px 8px;margin:8px 0 0!important}
.top10 li small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}
.top10{max-width:400px}
.top10 li{grid-template-columns:24px 56px 58px 1fr!important}.top10 li small{max-width:none!important;text-align:right}
/* numéros de mission dans le menu du monde : carré uni couleur du monde (plus d'herbe/terre) — Ben 5/10 */
.mb{background:var(--zc,var(--bleu))!important;border:3px solid var(--ink)!important;color:#fff;text-shadow:none!important;border-radius:6px}
.mi.fait .mb{background:var(--or)!important;color:var(--ink)}
.mi.verrou .mb{background:#fff!important;color:#8a7f72;border-style:dashed!important;filter:none!important}
/* ---------- 5 styles de numéros à comparer (sélecteur temporaire) ---------- */
.mi{grid-template-columns:38px minmax(0,1fr) auto!important}
.mb{width:34px!important;height:34px!important;font-size:1.05rem!important;font-weight:700}
body.n-a .mb{background:#fff!important;border:3.5px solid var(--zc)!important;color:var(--zc)!important;border-radius:50%}
body.n-a .mi.fait .mb{background:var(--or)!important;border-color:var(--or2)!important;color:var(--ink)!important}
body.n-b .mb{background:#1d2a6b!important;border:none!important;color:#fff!important;border-radius:50%}
body.n-b .mi.fait .mb{background:var(--or)!important;color:var(--ink)!important}
body.n-c .mb{background:none!important;border:none!important;color:var(--zc)!important;font-size:1.5rem!important}
body.n-c .mi.fait .mb{color:var(--or2)!important}
body.n-d .mb{width:auto!important;min-width:38px;padding:0 6px;background:var(--ink)!important;border:none!important;color:#fff!important;border-radius:4px;font-size:.9rem!important}
body.n-d .mb:before{content:"M"}
body.n-d .mi.fait .mb{background:var(--or)!important;color:var(--ink)!important}
body.n-e .mb{background:linear-gradient(#ffffff55 0 22%,transparent 22%),var(--zc)!important;border:3px solid var(--ink)!important;box-shadow:inset -4px -4px 0 rgba(0,0,0,.25);color:#fff!important;border-radius:0;text-shadow:2px 2px 0 rgba(0,0,0,.35)!important}
body.n-e .mi.fait .mb{background:linear-gradient(#ffffff66 0 22%,transparent 22%),var(--or)!important}
body.n-a .mi.verrou .mb,body.n-b .mi.verrou .mb,body.n-c .mi.verrou .mb,body.n-d .mi.verrou .mb,body.n-e .mi.verrou .mb{background:#fff!important;color:#a39885!important;border:2.5px dashed #b9ad95!important;box-shadow:none;text-shadow:none!important}
body.n-c .mi.verrou .mb{border:none!important;background:none!important}
.choixnum{position:fixed;right:12px;bottom:12px;z-index:40;display:flex;gap:6px;background:#fff;border:3px solid var(--ink);padding:6px 8px;font-weight:800;font-size:.85rem;align-items:center;box-shadow:0 4px 0 rgba(0,0,0,.25)}
.choixnum button{all:unset;cursor:pointer;padding:4px 9px;border:2px solid var(--ink);background:#f3f3f3;font-weight:900}.choixnum button.on{background:var(--or)}
/* retour : seul le titre est en bloc ; les nombres en gras restent dans la phrase */
.pied .msg b{display:inline;font-family:inherit;font-size:inherit;color:inherit}
.pied .msg>b{display:block;font-family:var(--pix);font-size:1.2rem}
.pied.ok .msg>b{color:var(--herbe2)}.pied.ko .msg>b{color:var(--rouge)}
@media(max-width:640px){.pied .in{flex-direction:column;align-items:stretch}.pied .gros{text-align:center}}
.pied .msg div b,.pied .msg .m-fix b{display:inline!important;font-family:var(--txt)!important;font-size:inherit!important;color:inherit!important;font-weight:900}
body.scene .m-titre h1,body.scene .m-titre p{display:block!important}
.pot{display:inline-flex;font-family:var(--f-mono);font-size:1.35rem;line-height:1.4;margin:8px auto;text-align:left} .pot pre{margin:0;font:inherit;padding-right:.5em;border-right:3px solid var(--ink)} .pot .ul{text-decoration:underline;text-decoration-thickness:2px} .pot-r{display:flex;flex-direction:column} .pot-r div{padding:0 .5em} .pot-d{border-bottom:3px solid var(--ink)} .pot{font-family:"Courier New",monospace!important;font-weight:700}

.q.multi{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 28px}
.q.multi .champ{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.q.multi .rep{width:120px}
.fig{width:100%;max-width:420px;height:auto;display:block;margin:6px auto;color:#14151A} .fig .ln{stroke:currentColor;stroke-width:3;stroke-linecap:round;fill:none} .fig .ln2{stroke:var(--sky);stroke-width:3;fill:none;stroke-linecap:round} .fig .ln3{stroke:var(--coral);stroke-width:3;fill:none;stroke-linecap:round} .fig .faint{stroke:#d5d9e2;stroke-width:2;stroke-dasharray:6 6;fill:none} .fig .pt path{stroke:currentColor;stroke-width:2.6;fill:none} .fig text{fill:currentColor;font-family:var(--f-body);font-size:19px;font-weight:700} .fig .lbl{font-size:16px} .fig .tick{stroke:currentColor;stroke-width:2} .fig .fill{fill:#FFC93C;stroke:var(--edge);stroke-width:2} .fig .empty{fill:#ffffff;stroke:var(--edge);stroke-width:2} .fig .ra{fill:none;stroke:#E63B2E;stroke-width:2} .fig .mk{stroke:#E63B2E;stroke-width:2.6} :root{--coral:#FF6B6B;--edge:#14151A;--f-body:"Nunito",system-ui,sans-serif;--sky:#2B5FD9}

/* choix alignés, même largeur ; fractions en gras ; temps du top 10 sur une ligne (Ben 5/10) */
.choix{grid-template-columns:1fr!important;max-width:420px}.choix.two{grid-template-columns:1fr 1fr!important;max-width:520px}
.opt{display:flex;align-items:center;justify-content:center;min-height:58px}
.q math,.opt math,.pied math{font-size:1.2em}
.q mn,.q mi,.q mo,.opt mn,.opt mi,.opt mo{font-weight:800}
.q mfrac,.opt mfrac{font-weight:800}
.top10 li{grid-template-columns:24px 56px auto 1fr!important}.top10 li em{white-space:nowrap}

.q.ligne-rep{white-space:nowrap}.q.ligne-rep .rep{width:84px;margin:0 6px}

/* réponses courtes : les 4 sur une ligne, VÉRIFIER dessous (Ben 5/10) */
.choix.ligne{grid-template-columns:repeat(4,1fr)!important;max-width:560px}.choix.ligne.two{grid-template-columns:repeat(2,1fr)!important;max-width:420px}
@media(max-width:420px){.choix.ligne{grid-template-columns:1fr 1fr!important}}
/* barre qui relie tous les mondes (classes + matières), 5/10 */
.mondes{margin:0 0 14px;display:grid;gap:8px}
.mondes .mo-cl,.mondes .mo-mat{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.mondes a{font:700 .82rem/1 Nunito,system-ui,sans-serif;text-decoration:none;color:#14151A;background:#fff;border:2px solid #14151A;border-radius:10px;padding:7px 11px;display:inline-flex;align-items:center;gap:6px;box-shadow:0 3px 0 #14151A}
.mondes .mo-cl a{font-size:.9rem;padding:7px 13px}
.mondes a.on{background:#2B3A8F;color:#fff;border-color:#2B3A8F;box-shadow:0 3px 0 #1A2560}
.mondes a.vide{opacity:.55;box-shadow:none;border-style:dashed}
.mondes a i{font-style:normal;font-size:.72rem;background:#E8A800;color:#14151A;border-radius:999px;padding:2px 6px}
.mondes a.on i{background:#fff}
@media(max-width:640px){.mondes a{font-size:.75rem;padding:6px 8px}.mondes .mo-mat{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}}
.niv{position:relative}.a-revoir{position:absolute;top:-10px;right:-8px;background:#FF8A1F;color:#fff;font:900 .62rem Nunito,sans-serif;padding:3px 7px;border:2px solid #14151A;border-radius:8px}
.revoir-jour{background:#fff;border:3px solid #FF8A1F;box-shadow:0 5px 0 rgba(0,0,0,.2);padding:10px 14px;margin:0 0 14px}.revoir-jour b{font-family:Nunito,sans-serif;font-weight:900;margin-right:10px}.revoir-jour span{font-weight:800;color:#C26A00;font-size:.85rem}.revoir-jour div{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.revoir-jour a{font-weight:800;font-size:.82rem;color:#14151A;background:#FFF1DD;border:2px solid #14151A;padding:4px 8px;text-decoration:none;text-transform:capitalize}
