/* Mode Aventure : thème « espace » indépendant du thème fille/garçon */
.adv{--bg1:#def6ea;--bg2:#ffe3f0;--card:#fff;--card2:#fff1f7;--line:#f1cade;--ink:#4a3556;--mute:#8a7799;--gold:#d9488a;--gold2:#e0578f;--well:#fff0f7cc;--well2:#ff9ec433;--dash:#e6b0cb;--glass:#ffffffcc;--glass2:#ffffff99;--gborder:#f1cade;--panel1:#ffffff;--panel2:#fff1f7;--card1:#fff;--card2b:#fff1f7;--btn1:#ff9ec4;--btn2:#e0578f;--btnsh:#b83a70;--btnink:#fff;--go1:#ff9ec4;--go2:#e0578f;--gosh:#b83a70;--goink:#fff;--title:#d9488a;--tshadow:0 3px 0 #fff,0 0 22px #ffb3d1;--dot:#ffb3d1;--shadow:#d9488a33;--tilebg1:#fff;--tilebg2:#ffe3f0;--tilesh:#e6b0cb;--tileink:#4a3556;--bar:#fff;--spk1:#ffd1e6;--spk2:#ff9ec4;--spksh:#c24a82;--green:#38d39f;--blue:#4cc3ff;--red:#ff6b6b;--violet:#8b7bff;
  color:var(--ink);border-radius:30px;padding:clamp(14px,3vw,28px);position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;gap:18px;
  background:
   radial-gradient(1.6px 1.6px at 8% 18%,var(--dot),transparent),radial-gradient(1.2px 1.2px at 22% 62%,var(--dot),transparent),radial-gradient(1.8px 1.8px at 37% 14%,var(--dot),transparent),
   radial-gradient(1.2px 1.2px at 52% 78%,var(--dot),transparent),radial-gradient(1.6px 1.6px at 68% 30%,var(--dot),transparent),radial-gradient(1.2px 1.2px at 83% 70%,var(--dot),transparent),radial-gradient(1.8px 1.8px at 93% 12%,var(--dot),transparent),
   radial-gradient(900px 420px at 85% -10%,var(--well2),transparent),linear-gradient(180deg,var(--bg2),var(--bg1))}
.adv *{box-sizing:border-box}
.adv h1,.adv h2,.adv h3{margin:0}
.adv a{color:inherit;text-decoration:none}
.advhead{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.advhead .robot{font-size:3rem;filter:drop-shadow(0 6px 10px #0006);animation:float 3.2s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-6px) rotate(-3deg)}}
.advhead .ttl{flex:1;min-width:200px}
.advhead h1{font-size:clamp(1.5rem,3.6vw,2.3rem);font-weight:800;line-height:1.2;color:var(--title);text-shadow:var(--tshadow)}
.advhead .crown{font-size:1.4rem;display:block}
.advhead p{margin:4px 0 0;color:var(--mute)}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{background:var(--glass);border:1px solid var(--gborder);border-radius:99px;padding:6px 14px;font-weight:600}
.pill b{color:var(--gold)}
.panel{background:linear-gradient(180deg,var(--panel1),var(--panel2));border:1px solid var(--line);border-radius:24px;padding:clamp(14px,2.4vw,22px);box-shadow:0 10px 30px var(--shadow)}
.panel.center{text-align:center}
.panel h3{margin-bottom:10px;font-size:1.1rem}
.sub2{color:var(--mute);margin:6px 0 12px}
.hint{color:var(--mute);font-size:.88rem;text-align:center;margin:10px 0}
.advcols{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}
.side{display:flex;flex-direction:column;gap:18px}
.rewards ul,.powers ul{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:8px}
.rewards li,.powers li{background:var(--glass2);border-radius:12px;padding:8px 12px}
.startend{display:flex;justify-content:space-between;font-weight:800;color:var(--gold);margin-bottom:14px}
.isles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px;position:relative}
.isle{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:22px 12px 16px;border-radius:26px;color:#10163a!important;background:linear-gradient(160deg,color-mix(in srgb,var(--c) 85%,#fff),var(--c));box-shadow:0 8px 0 color-mix(in srgb,var(--c) 55%,#000),0 14px 24px #0006;transition:transform .2s}
.isle:nth-child(even){transform:translateY(14px)}
.isle:hover{transform:translateY(-4px)}
.isle:nth-child(even):hover{transform:translateY(10px)}
.isle .no{position:absolute;top:-12px;inset-inline-start:-8px;width:34px;height:34px;border-radius:50%;background:#10163a;color:#fff;display:grid;place-items:center;font-weight:800;border:3px solid #fff}
.isle .ico{font-size:2.4rem}
.isle b{font-size:1.1rem}
.isle small{opacity:.8}
.mini{display:block;width:80%;height:8px;border-radius:9px;background:#0003;overflow:hidden}
.mini i{display:block;height:100%;background:#fff;border-radius:9px}
.prog{margin-top:30px}
.bar2{position:relative;height:16px;border-radius:99px;background:var(--bar);border:2px solid var(--line)}
.bar2 i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold2),var(--gold));transition:width .6s}
.bar2 em{position:absolute;top:-8px;font-style:normal;filter:grayscale(1) opacity(.5);transform:translateX(50%)}
.bar2 em.on{filter:none}
.prog small{display:block;text-align:center;margin-top:8px;color:var(--mute)}

.go{display:inline-block;border:0;border-radius:16px;padding:12px 24px;font-weight:800;font-size:1.05rem;color:var(--goink)!important;background:linear-gradient(180deg,var(--go1),var(--go2));box-shadow:0 5px 0 var(--gosh),0 10px 18px var(--shadow);cursor:pointer;text-align:center;transition:transform .1s,box-shadow .1s}
.go:active{transform:translateY(3px);box-shadow:0 2px 0 var(--gosh)}
.go:disabled{opacity:.45;cursor:not-allowed}
.go.wide{display:block;width:100%}
.go.ghostbtn{background:var(--glass);color:var(--ink)!important;box-shadow:0 4px 0 var(--line)}
.back{display:inline-block;margin-bottom:12px;color:var(--mute)!important;font-weight:600}
.linkbtn{background:none;border:0;cursor:pointer;font-size:1rem}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px}

.ws,.gcards,.shop{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.wk,.gcard{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:16px 10px;border-radius:20px;background:linear-gradient(160deg,var(--card1),var(--card2b));border:2px solid var(--c,#4a63c4);position:relative}
.wk .ico,.gcard .ico{font-size:2.2rem}
.wk .st{letter-spacing:2px}
.wk.locked,.gcard.locked{opacity:.55;filter:grayscale(.6)}
.askrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ask{flex:1;min-width:180px;margin:0;font-weight:700;font-size:1.1rem}
.spk{width:54px;height:54px;border-radius:50%;border:0;font-size:1.5rem;cursor:pointer;background:linear-gradient(180deg,var(--spk1),var(--spk2));box-shadow:0 5px 0 var(--spksh),0 0 0 0 #ff9ec488;animation:ring 2.4s infinite}
@keyframes ring{70%{box-shadow:0 5px 0 var(--spksh),0 0 0 14px #ff9ec400}}
.rdots{display:flex;gap:6px}.rdots i{width:12px;height:12px;border-radius:50%;background:var(--dash)}.rdots i.on{background:var(--gold)}
.stage{min-height:260px}
.act{display:flex;flex-direction:column;align-items:center;gap:12px}
.target{font-size:clamp(2.4rem,7vw,4rem);font-weight:800;color:var(--gold);letter-spacing:.06em;text-shadow:0 4px 0 var(--line)}
.ops{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.op{background:var(--well);border-radius:16px;padding:10px 14px;min-width:110px;text-align:center}
.op .num{display:block;font-size:1.6rem;color:var(--gold)}
.plus{font-size:2rem;color:var(--gold)}
.opbeads{display:flex;gap:8px;justify-content:center;align-items:flex-end;min-height:30px}
.opcol{display:flex;flex-wrap:wrap;gap:3px;align-items:flex-end;justify-content:center;max-width:90px}

/* matériel */
.pc{--b:18px}
.pc.sm{--b:10px}
.pc-u{width:var(--b);height:var(--b);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7c2,#ffc83d 55%,#d98b00);box-shadow:0 1px 2px #0006}
.pc-t{width:var(--b);display:flex;flex-direction:column;gap:1px;padding:1px;background:#d98b0066;border-radius:6px}
.pc-t i{display:block;height:calc(var(--b)*.42);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7c2,#ffc83d 60%,#d98b00)}
.pc-h,.pc-k{display:grid;grid-template-columns:repeat(10,1fr);gap:1px;padding:2px;background:#d98b0088;border-radius:4px;width:calc(var(--b)*2.8)}
.pc-h i,.pc-k i{display:block;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7c2,#ffc83d 60%,#d98b00)}
.pc-k{width:calc(var(--b)*3.2);box-shadow:4px 4px 0 #c98a00,8px 8px 0 #a56f00}
.pc,.tile,.scard{cursor:grab;user-select:none;-webkit-user-select:none}
.board{display:flex;gap:10px;justify-content:center;width:100%;max-width:720px;min-height:200px;padding:14px;border-radius:20px;background:var(--well);border:3px dashed var(--dash);transition:.2s}
.board.over,.dz.over{border-color:var(--gold);background:#ffc83d22}
.board.win,.seqrow.win,.bins.win{box-shadow:0 0 0 3px var(--green),0 0 30px #38d39f88}
.col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:70px}
.cell{display:flex;flex-wrap:wrap;gap:4px;align-content:flex-start;justify-content:center;min-height:130px;width:100%}
.lbl{color:var(--mute);font-weight:600}
.ghost{border:2px dashed #ffc83d99;background:#ffc83d14}
.g-u{width:18px;height:18px;border-radius:50%}.g-t{width:18px;height:90px;border-radius:6px}.g-h{width:50px;height:50px;border-radius:4px}.g-k{width:58px;height:58px;border-radius:4px}
.pc.out{animation:out .7s forwards}
@keyframes out{to{opacity:0;transform:translateY(-24px) scale(.6)}}
.tray{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:flex-end;padding:12px;min-height:80px;width:100%}
.tray.beads{gap:26px}
.pilewrap{display:flex;flex-direction:column;align-items:center;gap:4px}
.pile{box-shadow:0 0 0 3px var(--gborder)}
.pile:hover{filter:brightness(1.15)}

.seqrow{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;padding:12px;border-radius:20px}
.slot{position:relative;min-width:64px;min-height:78px;border-radius:16px;background:var(--well);border:3px dashed var(--dash);display:flex;align-items:center;justify-content:center}
.slot .num{position:absolute;top:2px;inset-inline-start:8px;font-size:.75rem;color:var(--mute)}
.cardslot{min-width:150px;min-height:70px}
.letterslot{min-width:62px;min-height:78px}
.tile{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:8px 12px;font-weight:800;color:var(--tileink);background:linear-gradient(180deg,var(--tilebg1),var(--tilebg2));box-shadow:0 4px 0 var(--tilesh);transition:transform .2s}
.tile.letter{min-width:54px;min-height:62px;font-size:2rem}
.tile.card{flex-direction:column;min-width:110px;padding:10px 12px;font-size:1rem}
.tile .em{font-size:1.8rem}
.slot .tile{box-shadow:none;background:linear-gradient(180deg,#ffe07a,#ffc83d)}
.tile[data-lock="1"]{background:linear-gradient(180deg,#9af0cf,var(--green));cursor:default}
.tile.shape{background:none;box-shadow:none;padding:0;width:84px;height:84px}
.tile.shape svg{width:100%;height:100%}
.seqrow.shapes{gap:14px}
.sslot{flex-direction:column;width:100px;min-height:120px;border-radius:18px;padding:6px}
.sslot svg{width:84px;height:84px}
.sslot.filled{border-style:solid;border-color:var(--green)}
.pict{display:flex;align-items:center;gap:16px;justify-content:center;min-height:90px}
.bigem{font-size:4.5rem}
.word{font-size:2.6rem;font-weight:800;color:var(--green);min-width:2ch}
.grab{opacity:.92;filter:drop-shadow(0 12px 12px #0007);cursor:grabbing}
.ret{animation:ret .7s}
@keyframes ret{40%{background:var(--gold);transform:translateY(-10px) rotate(-6deg)}}
.shake{animation:shk .5s}
@keyframes shk{25%{transform:translateX(7px)}75%{transform:translateX(-7px)}}
/* Seguin : code couleur Montessori (unités vert, dizaines bleu, centaines rouge, milliers vert) */
.scard{min-width:70px;padding:14px 10px;border-radius:10px;text-align:center;font-weight:800;font-size:1.5rem;color:#fff;box-shadow:0 4px 0 #0005}
.sc-u,.sc-k{background:#2fb673}.sc-t{background:#3a7be8}.sc-h{background:#e4545a}
.slot.sg{min-width:100px;min-height:84px;flex-direction:column}
.slot.sg .scard{box-shadow:none}
.sg .lbl{position:absolute;bottom:2px;font-size:.7rem}

.bins{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;width:100%;border-radius:20px;padding:6px}
.bin{flex:1;min-width:160px;max-width:300px;min-height:170px;border-radius:20px;background:var(--well);border:3px dashed var(--dash);padding:10px;display:flex;flex-direction:column;gap:8px}
.bh{display:flex;align-items:center;gap:8px;justify-content:center;font-size:1.1rem}.bh .em{font-size:1.6rem}
.bl{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.bl .tile.card{min-width:90px;padding:6px 8px;font-size:.85rem}
.result{text-align:center;padding:20px 0}
.bigstars{font-size:3rem;display:flex;gap:8px;justify-content:center}.bigstars span{filter:grayscale(1) opacity(.35)}.bigstars span.on{filter:none;animation:pop .5s}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.result h2{margin:10px 0 6px}

/* jeux */
.gbox{display:flex;flex-direction:column;align-items:center;gap:10px;min-height:260px}
.mgrid{display:grid;grid-template-columns:repeat(4,minmax(60px,86px));gap:10px;justify-content:center}
.mcard{aspect-ratio:1;border-radius:16px;border:0;font-size:2rem;cursor:pointer;position:relative;background:linear-gradient(160deg,var(--btn1),var(--btn2));color:var(--btnink);box-shadow:0 4px 0 var(--btnsh)}
.mcard .bk{display:none}.mcard.up .bk,.mcard.ok .bk{display:inline}.mcard.up .f,.mcard.ok .f{display:none}
.mcard.ok{background:linear-gradient(160deg,#5de0a8,#2fb673);box-shadow:0 4px 0 #1b7a4b}
.arena{position:relative;width:100%;max-width:560px;height:320px;border-radius:20px;background:var(--well);border:3px solid var(--line);overflow:hidden}
.cstar{position:absolute;border:0;background:none;font-size:2.4rem;cursor:pointer;animation:pop .2s}.cstar.pop{transform:scale(1.6);opacity:0;transition:.16s}
.pgrid{display:grid;grid-template-columns:repeat(3,84px);gap:8px}
.ptile{width:84px;height:84px;border-radius:14px;border:0;font-size:2rem;font-weight:800;cursor:pointer;color:var(--btnink);background:linear-gradient(160deg,var(--btn1),var(--btn2));box-shadow:0 4px 0 var(--btnsh)}
.ptile.blank{background:var(--well);box-shadow:none}
.tgrid{display:grid;grid-template-columns:repeat(3,84px);gap:8px}
.tcell{width:84px;height:84px;border-radius:14px;border:0;font-size:2.2rem;cursor:pointer;background:var(--glass);color:var(--ink)}
.tcell:disabled{cursor:default}

@media (max-width:900px){.advcols{grid-template-columns:1fr}.isle:nth-child(even){transform:none}}
@media (max-width:480px){.mgrid{grid-template-columns:repeat(4,1fr)}.pgrid,.tgrid{grid-template-columns:repeat(3,1fr)}.ptile,.tcell{width:100%}.cardslot{min-width:120px}}
@media (prefers-reduced-motion:reduce){.advhead .robot,.spk{animation:none}}

/* Thème garçon : palette spatiale sombre */
html[data-skin="boy"] .adv{--bg1:#0b1437;--bg2:#1a2a66;--card:#1b2a63;--card2:#243884;--line:#3b52a3;--ink:#f4f7ff;--mute:#aebdf0;--gold:#ffc83d;--gold2:#ff9f1c;
--well:#0a1230aa;--well2:#3a54c066;--dash:#ffffff44;--glass:#ffffff1f;--glass2:#ffffff14;--gborder:#ffffff33;--panel1:#22357f;--panel2:#1b2a63;--card1:#2d46a5;--card2b:#223789;
--btn1:#4f6ee0;--btn2:#2c46b5;--btnsh:#1a2a78;--btnink:#fff;--go1:#ffe07a;--go2:#ff9f1c;--gosh:#b86a00;--goink:#3a2600;--title:#fff;--tshadow:0 3px 0 #1d3aa1,0 0 22px #4cc3ff66;--dot:#fff;--shadow:#0005;--tilebg1:#fff;--tilebg2:#dfe7ff;--tilesh:#8f9fd6;--tileink:#10163a;--bar:#0a1230;--spk1:#7be7ff;--spk2:#4cc3ff;--spksh:#1b78a8}
html[data-skin="boy"] .adv .spk{box-shadow:0 5px 0 #1b78a8}