/* Diagnóstikos: aventuras de aprendizaje. Colores suaves y controles claros. */
:root{--ink:#24385b;--muted:#52617a;--paper:#f3f9ff;--cream:#fff4d9;--line:#d5e4f5;--gold:#ffcf59;--good:#17623d;--bad:#9c3036;--shadow:0 8px 0 #dce8f5,0 16px 32px #254c7610;font-family:"Trebuchet MS","Segoe UI",sans-serif;--accent:#6542bd;--tint:#f2edff;--edge:#d8c9ff}
body{background:radial-gradient(circle at 5% 6%,#ffedaf 0,transparent 22%),radial-gradient(circle at 96% 18%,#d9f6f1 0,transparent 25%),#f3f9ff}
[data-theme="math"],[data-filter="math"]{--accent:#245db5;--tint:#eaf3ff;--edge:#b6d5fc}
[data-theme="brain"],[data-filter="brain"]{--accent:#7140b4;--tint:#f4edff;--edge:#dbc5fa}
[data-theme="science"],[data-filter="science"]{--accent:#14715c;--tint:#e5f8ee;--edge:#ace1cc}
[data-theme="creative"],[data-filter="creative"]{--accent:#ad386f;--tint:#fff0f6;--edge:#f3bfd7}
[data-theme="adventure"],[data-filter="adventure"]{--accent:#925009;--tint:#fff4d9;--edge:#f3d48d}
.top{max-width:none;background:#ffffffeb;border-bottom:4px solid #d8eafa;padding:19px max(24px,calc((100vw - 1144px)/2));box-shadow:0 4px 0 #fff;gap:15px}.brand{color:#265ca1;letter-spacing:-1px}.brand img{background:#e4f5ff;border-radius:17px;padding:4px;width:56px;height:56px}.brand small{color:#576689;letter-spacing:1.5px}.stars{background:#fff0ad;color:#775007;border:2px solid #f3ce5a;box-shadow:0 3px 0 #edd17d}.nav-help{font-weight:700;color:#435a80}
.hero{padding:46px 0;gap:30px}.hero h1,.section-title h2,.card h3,.game-head h1,.help h2,.result h2,.guide h1{font-family:"Trebuchet MS","Segoe UI",sans-serif;font-weight:900;letter-spacing:-.8px}.hero h1{font-size:clamp(38px,4.5vw,58px);line-height:1.13;color:#274d86}.hero h1 em{font-style:normal;font-weight:900;color:#8247bd}.eyebrow{color:var(--accent);font-size:11px;letter-spacing:1px;background:var(--tint);display:inline-block;padding:9px 13px;border-radius:12px}.lead{font-size:17px;line-height:1.7}.hero-art{border:4px solid white;background:#bde7f5;border-radius:30px;box-shadow:0 9px 0 #a5d4e7,0 18px 36px #30547716;padding:9px 9px 48px}.hero-note{background:#fff0b7;color:#694b14;border:2px solid #ffe38b;border-radius:14px}
.primary,.play{background:#6542bd;color:white;border-radius:15px;box-shadow:0 4px 0 #452b86;font-size:15px;padding:13px 21px;transition:transform .15s,box-shadow .15s}.primary:hover,.play:hover{transform:translateY(-2px);box-shadow:0 6px 0 #452b86}.primary:active,.play:active{transform:translateY(2px);box-shadow:0 2px 0 #452b86}.secondary{border:2px solid #c4d7ee;border-radius:14px;background:#f2f7ff;color:#36537c;min-height:44px}
.section-title h2{font-size:32px;color:#2b4d80}.section-title p{font-size:14px}.filters{gap:10px;margin-bottom:28px}.filter{color:var(--accent);background:var(--tint);border:2px solid var(--edge);font-weight:800;padding:12px 17px;min-height:46px;box-shadow:0 3px 0 var(--edge)}.filter.active{color:#fff;background:var(--accent);border-color:var(--accent);box-shadow:0 3px 0 #26385730}.filter:hover{outline:2px solid var(--accent);outline-offset:2px}
.grid{gap:28px}.card{border:2px solid var(--edge);border-radius:25px;box-shadow:0 6px 0 var(--edge),0 14px 24px #2a467b0b;transition:transform .18s}.card:hover{transform:translateY(-3px)}.card-body{background:linear-gradient(var(--tint),#fff 85%);padding:21px}.card .category{align-self:flex-start;color:var(--accent);background:white;border:1px solid var(--edge);padding:7px 10px;border-radius:9px;font-size:10px;letter-spacing:.6px}.card h3{font-size:24px;line-height:1.2;color:#2c3e62;margin:13px 0 10px}.card p{font-size:14px}.card-bottom{font-size:12px}.card .play{background:var(--accent);box-shadow:0 4px 0 var(--edge);font-size:14px;min-height:44px;padding:11px 18px}
.help{background:#e9f4ff;border:2px solid #c4ddf7;border-radius:26px;padding:28px 30px;margin-top:46px}.help h2{font-size:27px;margin-top:0}.help ol{list-style:none;counter-reset:steps;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.help li{counter-increment:steps;background:white;border-radius:18px;padding:18px;font-size:15px}.help li:before{content:counter(steps);display:block;width:32px;height:32px;background:#6542bd;color:#fff;border-radius:50%;text-align:center;font-weight:800;margin-bottom:8px}.help>p{font-size:13px}
.back{background:white;border:2px solid #d5e4f5;padding:10px 15px;border-radius:14px;text-decoration:none;font-weight:700;min-height:44px}.game-head{background:var(--tint);border:2px solid var(--edge);border-radius:25px;padding:24px;grid-template-columns:1fr 280px}.game-head h1{color:var(--accent);font-size:clamp(28px,3.8vw,42px);line-height:1.12}.game-head img{width:100%;border:4px solid white;box-shadow:0 5px 0 var(--edge);border-radius:20px}.game-head p{margin-bottom:0;font-size:16px}.arena{border:3px solid var(--edge);border-top:9px solid var(--accent);border-radius:26px;background:#fff;box-shadow:0 8px 0 var(--edge),0 18px 32px #20345a0c}.status span{background:var(--tint);color:var(--accent);border-radius:12px;padding:9px 14px;font-size:14px}.bar{height:12px;background:#edf1f9;border:2px solid #e2e8f1}.bar i{background:#20a682;border-radius:10px}.question{color:#283f69;margin-top:26px}.choices .choice{background:#edf4ff;border-color:#b8d4f7;color:#274b7a;border-bottom-width:5px;border-radius:19px;font-size:20px}.choices .choice:nth-child(4n+2){background:#f5edff;border-color:#d7bef6;color:#64378f}.choices .choice:nth-child(4n+3){background:#fff5da;border-color:#efd58c;color:#79500e}.choices .choice:nth-child(4n+4){background:#e9f9f1;border-color:#abe0c8;color:#21654d}.choices .choice:hover:not(:disabled){outline:3px solid #536aa0;outline-offset:2px}.choices .choice.correct{background:#e7f4e8!important;color:var(--good)!important}.choices .choice.wrong{background:#ffeded!important;color:var(--bad)!important}.feedback:not(:empty){background:#f2f6ff;border:2px solid #d7e3fa;padding:16px;border-radius:16px}.result{background:radial-gradient(ellipse at top,#fff2bf,white 70%);border-radius:22px}
.memory button{background:linear-gradient(145deg,#895cda,#6542bd);border:3px solid #c2a7ee;border-bottom-width:6px;color:#fff;box-shadow:0 3px 0 #ede5f9;border-radius:19px}.memory button.open{background:#fff2be;border-color:#e3c766;color:#24385b}.memory button.matched{background:#dff5e8;border-color:#62ad85;color:#24385b}.number-grid button{background:#eef1ff;border:2px solid #bfc9f2;border-bottom-width:4px;color:#46428c;border-radius:13px}.number-grid button:hover{background:#e3eaff}.letters button{background:#ffe293;border:2px solid #dfb957;border-bottom-width:5px;color:#624815;border-radius:12px}.slots span{background:#eef5ff;border:2px dashed #8da9d0;border-bottom:4px solid #6488bb;border-radius:12px}.clue{background:#fff7df;border:2px solid #e8ce8f;border-bottom-width:5px;border-radius:17px;color:#654e20}.clue.inspected{background:#e8f7ee;border-color:#69a587}.story{background:#f3f6ff;border-radius:18px;padding:22px}.toolbar{padding:16px;background:#f4f0ff;border-radius:16px}.toolbar select{background:white;border:2px solid #c7bce5;color:#334565;min-height:44px}.cross-grid{background:#d7def1;border-radius:8px}.cross-block{background:#c5cfe9}.cross-cell input{border-color:#9caecc}.cross-cell input.active{background:#fff0af}.drawing{border:3px solid #cbbce9;border-radius:12px;overflow:hidden}footer{background:#e4effc;border-top:4px solid #c9def4;margin-top:20px;color:#52627f}footer strong{color:#2a5794}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #153b89;outline-offset:5px}
@media(max-width:850px){.game-head{grid-template-columns:1fr 190px;padding:20px}.hero h1{font-size:42px}.help ol{grid-template-columns:1fr}.top{padding:18px 24px}}
@media(max-width:580px){.top{padding:17px 18px}.hero{padding:30px 0;gap:25px}.hero h1{font-size:39px;letter-spacing:-1px}.hero-art{margin:0 3px 10px}.eyebrow{font-size:10px;letter-spacing:.3px}.section-title h2{font-size:28px}.filter{padding:11px 13px;font-size:12px}.game-head{grid-template-columns:1fr;padding:18px;gap:18px}.game-head img{display:block;width:100%;max-width:320px;justify-self:center}.game-head p{font-size:15px}.arena{padding:20px 12px}.choices .choice{font-size:18px;padding:16px 8px}.help{padding:23px 18px}.help h2{font-size:24px}.card h3{font-size:25px}.status{gap:8px}.status span{padding:8px 10px;font-size:12px}.story{padding:15px;font-size:17px}.result{padding:15px}.brand small{letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){.card,.primary,.play{transition:none}.card:hover,.primary:hover,.play:hover{transform:none}}

/* Marca original: cerebro multicolor sobre fondo blanco. */
.brand img{width:62px;height:66px;object-fit:contain;background:white;border:2px solid #d7e9f5;padding:5px;border-radius:18px;box-shadow:0 3px 0 #d9e8f7}