:root{--bg:#f6f8ff;--fg:#1d2340;--accent:#4f6bed;--accent-soft:#dfe5ff;--chip:#fff;--line:#c3cbe6;--ok:#1f9d55;--bad:#d64545;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--fg);margin:0}#root{justify-content:center;display:flex}.app{flex-direction:column;width:100%;max-width:720px;min-height:100dvh;display:flex}.status{text-align:center;flex-direction:column;align-items:center;gap:1rem;padding:2rem 1rem;font-size:1.2rem;display:flex}.error-detail{opacity:.7;word-break:break-word;font-size:.9rem}.btn{min-height:3rem;font:inherit;color:#fff;background:var(--accent);cursor:pointer;touch-action:manipulation;border:0;border-radius:.9rem;justify-content:center;align-items:center;padding:.6rem 1.4rem;font-size:1.2rem;font-weight:700;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-secondary{color:var(--fg);border:2px solid var(--line);background:0 0}.btn-small{min-height:2.75rem;padding:.3rem .9rem;font-size:1rem}.list{text-align:center;padding:1.5rem 1rem}.list ul{flex-direction:column;gap:.8rem;margin:1rem 0 0;padding:0;list-style:none;display:flex}.list .btn{flex-direction:column;gap:.15rem;width:100%}.list-subtitle{opacity:.85;font-size:.85rem;font-weight:500}body:has(.home){background:radial-gradient(ellipse 70% 45% at 50% 0%, #ffffff80, transparent 70%), repeating-conic-gradient(from 0deg at 50% 0%, #ffffff0b 0 6deg, transparent 6deg 14deg), linear-gradient(#2b2fa5, #1a1470);background-attachment:fixed}.app-wide{max-width:900px}.home{z-index:1;padding:50px 0 3rem;position:relative}.home-hero{z-index:1;flex-direction:column;align-items:center;gap:28px;margin-bottom:44px;display:flex;position:relative}.home-bug{width:100px}.home-hero h1{width:min(350px,90%);margin:0}.home-hero h1 img{width:100%;display:block}.type-grid{z-index:1;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:center;gap:12px;margin:0;padding:0 10px;list-style:none;display:grid;position:relative}.type-card{touch-action:manipulation;background:#f6e6c4;border:4px solid #f6e6c4;border-radius:18px;display:block;overflow:hidden;box-shadow:0 0 0 2px #f6e6c459,0 8px 20px #0a083c80}.type-card img{width:100%;display:block}.type-title{color:#3b2a80;text-align:center;padding:1rem;font-weight:700;display:block}.home-decor{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.deco{display:none;position:absolute}.deco-star-1{width:11vw;display:block;top:80px;left:28vw}.deco-pencil{width:34vw;display:block;top:70px;left:1vw;rotate:-22deg}.deco-ruler{width:31vw;display:block;top:80px;left:66vw;rotate:20deg}.deco-star-2{width:8vw;display:block;top:300px;left:72vw}.deco-set-square{width:46vw;display:block;bottom:30px;left:-2vw;rotate:-10deg}.deco-letter-z{width:22vw;display:block;bottom:110px;left:43vw;rotate:-10deg}.deco-number-1{width:14vw;display:block;bottom:90px;left:82vw;rotate:12deg}@media (width>=720px){.home-hero{flex-direction:row;justify-content:center;gap:45px;margin-bottom:60px}.home-bug{width:148px}.home-hero h1{width:670px;max-width:670px}.type-grid{grid-template-columns:repeat(2,252px);gap:36px}.deco{display:block}.deco-book{width:240px;top:70%;left:33%;rotate:-6deg}.deco-apple{width:100px;top:55px;left:87%}.deco-star-1{width:38px;top:40px;left:24%}.deco-letter-a{width:75px;top:300px;left:5.5%;rotate:-8deg}.deco-letter-b{width:55px;top:90%;left:22%;rotate:8deg}.deco-pencil{width:340px;top:480px;left:2%;rotate:-28deg}.deco-number-3{width:60px;top:735px;left:14.5%;rotate:-5deg}.deco-set-square{width:170px;bottom:40px;left:3%;rotate:0deg}.deco-star-3{width:30px;top:690px;left:19%}.deco-number-2{width:60px;top:240px;left:91.5%;rotate:10deg}.deco-ruler{width:250px;top:320px;left:79%;rotate:25deg}.deco-star-2{width:30px;top:300px;left:76.5%}.deco-letter-s{width:90px;top:610px;left:84.5%;rotate:5deg}.deco-star-4{width:38px;top:730px;left:82%}.deco-letter-z{display:none}.deco-number-1{width:55px;top:835px;bottom:auto;left:91%;rotate:8deg}}.topbar{padding:max(.5rem, env(safe-area-inset-top)) max(.5rem, env(safe-area-inset-right)) 0 .5rem;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.icon-btn{width:3rem;height:3rem;color:var(--fg);border:2px solid var(--line);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:50%;justify-content:center;align-items:center;padding:0;text-decoration:none;display:inline-flex}.icon-btn svg{width:1.5rem;height:1.5rem}.topbar-title{text-align:center;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;margin:0;font-size:clamp(1rem,4vw,1.4rem);font-weight:700;overflow:hidden}.icon-btn-spacer{width:3rem;height:3rem}.mt{flex-direction:column;flex:1;gap:1rem;padding:1rem;display:flex}.mt-header{justify-content:center;margin-bottom:1rem;display:flex}.mt-progress{gap:.3rem;display:flex}.mt-progress i{background:var(--line);border-radius:50%;width:.7rem;height:.7rem}.mt-progress i.done{background:var(--ok)}.mt-progress i.current{background:var(--accent)}.mt-instruction{text-align:center;margin:0;font-size:clamp(1.1rem,4.5vw,1.6rem)}.mt-panel{--box:clamp(3.4rem, 17vw, 5rem);box-shadow:0 6px 0 var(--line);background:#fff;border:3px solid #0000;border-radius:1.2rem;justify-content:center;align-items:center;gap:clamp(.4rem,2.5vw,1rem);padding:1rem .6rem;display:flex}.mt-panel.correct{border-color:var(--ok)}.mt-panel.wrong{border-color:var(--bad)}.mt-box,.mt-slot{width:var(--box);height:var(--box);font:inherit;font-size:calc(var(--box) * .55);color:#fff;text-shadow:0 2px 3px #00000059;border-radius:22%;justify-content:center;align-items:center;padding:0;font-weight:800;display:inline-flex}.mt-box-a{background:linear-gradient(160deg,#ff6b5e,#c4281f);box-shadow:inset 0 3px #ffffff59}.mt-box-b{background:linear-gradient(160deg,#54b4ff,#1f62c9);box-shadow:inset 0 3px #ffffff59}.mt-sign{color:#f28a2e;font-size:calc(var(--box) * .6);font-weight:800;line-height:1}.mt-slot{color:#6b3fc9;text-shadow:none;cursor:pointer;touch-action:manipulation;background:#fff7e8;border:3px dashed #6b3fc9}.mt-slot.filled{border-style:solid}.mt-slot:disabled{cursor:default}.mt-choices{--choice:clamp(4.2rem, 23vw, 5.8rem);grid-template-columns:repeat(3, var(--choice));flex:1;place-content:center;gap:.9rem;display:grid}.mt-choice{width:var(--choice);height:var(--choice);font:inherit;font-size:calc(var(--choice) * .5);color:#fff;text-shadow:0 2px 3px #0006;background:var(--ball);cursor:pointer;touch-action:manipulation;border:0;border-radius:50%;padding:0;font-weight:800;box-shadow:inset 0 5px 8px #ffffff73,0 5px #00000038}.mt-choice:active:not(:disabled){transform:translateY(3px);box-shadow:inset 0 5px 8px #ffffff73,0 2px #00000038}.mt-choice.picked{outline:4px solid var(--fg);outline-offset:3px}.mt-choice:disabled:not(.picked){opacity:.5;cursor:default}.mt-c0{--ball:radial-gradient(circle at 35% 30%, #8be86a, #2fa05a)}.mt-c1{--ball:radial-gradient(circle at 35% 30%, #ffe27a, #e8a817)}.mt-c2{--ball:radial-gradient(circle at 35% 30%, #ff9ccb, #d93d86)}.mt-c3{--ball:radial-gradient(circle at 35% 30%, #ffb866, #e8701a)}.mt-c4{--ball:radial-gradient(circle at 35% 30%, #c39bff, #7a43d6)}.mt-c5{--ball:radial-gradient(circle at 35% 30%, #ff8a80, #d6342b)}.mt-c6{--ball:radial-gradient(circle at 35% 30%, #7cc8ff, #2a6fd6)}.mt-c7{--ball:radial-gradient(circle at 35% 30%, #6fe3d6, #19968a)}.mt-c8{--ball:radial-gradient(circle at 35% 30%, #d4f26a, #7fae1c)}.mt-footer{justify-content:space-between;align-items:center;gap:1rem;min-height:3.5rem;display:flex}.mt-feedback{margin:0;font-size:clamp(1.1rem,4.5vw,1.5rem);font-weight:700}.mt-feedback.correct{color:var(--ok)}.mt-feedback.wrong{color:var(--bad)}.mt-end{text-align:center;justify-content:center;align-items:center}.mt-end h2{margin:0;font-size:2.2rem}.mt-score{margin:0;font-size:1.5rem}.or{flex-direction:column;flex:1;gap:1rem;padding:1rem;display:flex}.or-header{justify-content:center;margin-bottom:1rem;display:flex}.or-progress{gap:.3rem;display:flex}.or-progress i{background:var(--line);border-radius:50%;width:.7rem;height:.7rem}.or-progress i.done{background:var(--ok)}.or-progress i.current{background:var(--accent)}.or-instruction{text-align:center;margin:0;font-size:clamp(1.1rem,4.5vw,1.6rem)}.or-anchor-icon{vertical-align:middle;width:1.8em;height:1.8em;margin-left:.4em;display:inline-block}.or-anchor-icon svg,.or-cell svg{width:100%;height:100%;display:block}.or-board{--cell:clamp(3.4rem, 17vw, 5.2rem);grid-template-columns:repeat(5, var(--cell));grid-template-rows:repeat(4, var(--cell));box-shadow:0 6px 0 var(--line);background:#fff;border:3px solid #0000;border-radius:1.2rem;flex:1;place-content:center;gap:.3rem;padding:.8rem .4rem;display:grid}.or-board.correct{border-color:var(--ok)}.or-board.wrong{border-color:var(--bad)}.or-cell{background:0 0;border:3px solid #0000;border-radius:1rem;padding:.25rem;position:relative}.or-shape{cursor:pointer;touch-action:manipulation}.or-shape:disabled{cursor:default}.or-shape.on{border-color:var(--fg);background:#fff7e8}.or-anchor{border:3px dashed var(--fg)}.or-badge{color:#fff;background:var(--accent);border-radius:50%;place-items:center;width:1.5rem;height:1.5rem;font-size:.9rem;font-weight:800;display:grid;position:absolute;top:-.5rem;right:-.5rem}.or-footer{justify-content:space-between;align-items:center;gap:1rem;min-height:3.5rem;display:flex}.or-feedback{margin:0;font-size:clamp(1.1rem,4.5vw,1.5rem);font-weight:700}.or-feedback.correct{color:var(--ok)}.or-feedback.wrong{color:var(--bad)}.or-end{text-align:center;justify-content:center;align-items:center}.or-end h2{margin:0;font-size:2.2rem}.or-score{margin:0;font-size:1.5rem}.pc{flex-direction:column;flex:1;gap:1rem;padding:1rem;display:flex}.pc-header{justify-content:center;margin-bottom:1rem;display:flex}.pc-progress{gap:.3rem;display:flex}.pc-progress i{background:var(--line);border-radius:50%;width:.7rem;height:.7rem}.pc-progress i.done{background:var(--ok)}.pc-progress i.current{background:var(--accent)}.pc-instruction{text-align:center;margin:0;font-size:clamp(1.1rem,4.5vw,1.6rem)}.pc-track{border:3px dashed var(--line);border-radius:1rem;padding:.8rem}.pc-track.correct{border-color:var(--ok);background:color-mix(in srgb, var(--ok) 12%, transparent)}.pc-track.wrong{border-color:var(--bad);background:color-mix(in srgb, var(--bad) 12%, transparent)}.pc-caterpillar{--cell:clamp(2.6rem, 11vw, 3.6rem);cursor:pointer;touch-action:manipulation;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.pc-head{width:calc(var(--cell) * 1.3);height:calc(var(--cell) * 1.3);display:flex}.pc-head svg{width:100%;height:100%}.pc-undo{margin:.6rem auto 0;display:flex}.pc-fill-wrap{width:100%;height:100%;display:flex}.pc-cell{width:var(--cell);height:var(--cell);border:3px solid var(--line);font-size:calc(var(--cell) * .5);border-radius:50%;font-weight:700;display:inline-flex}.pc-cell.empty,.pc-cell.next{border-style:dashed}.pc-cell.next{border-color:var(--accent)}.pc-cell.given{border-color:var(--fg)}.pc-cell.wrong{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad)}.pc-fill{color:#fff;text-shadow:0 0 2px #00000080;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:.55em;display:flex}.pc-text{color:var(--fg);text-shadow:none;background:var(--chip);font-size:1em}.pc-choices{grid-template-columns:repeat(3, var(--choice));--choice:clamp(4rem, 22vw, 5.5rem);flex:1;place-content:center;gap:.8rem;display:grid}.pc-choice{width:var(--choice);height:var(--choice);font-size:calc(var(--choice) * .45);border:3px solid var(--accent);box-shadow:0 3px 0 var(--accent);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:50%;padding:0;font-weight:700;overflow:hidden}.pc-choice:active:not(:disabled){box-shadow:0 1px 0 var(--accent);transform:translateY(2px)}.pc-choice:disabled{opacity:.5;cursor:default}.pc-footer{justify-content:space-between;align-items:center;gap:1rem;min-height:3.5rem;display:flex}.pc-feedback{margin:0;font-size:clamp(1.1rem,4.5vw,1.5rem);font-weight:700}.pc-feedback.correct{color:var(--ok)}.pc-feedback.wrong{color:var(--bad)}.pc-end{text-align:center;justify-content:center;align-items:center}.pc-end h2{margin:0;font-size:2.2rem}.pc-score{margin:0;font-size:1.5rem}.wo{flex-direction:column;flex:1;gap:1rem;padding:1rem;display:flex}.wo-header{justify-content:center;align-items:center;gap:.5rem;margin-bottom:2rem;display:flex}.wo-progress{gap:.3rem;display:flex}.wo-progress i{background:var(--line);border-radius:50%;width:.7rem;height:.7rem}.wo-progress i.done{background:var(--ok)}.wo-progress i.current{background:var(--accent)}.wo-instruction{text-align:center;margin:0;font-size:clamp(1.1rem,4.5vw,1.6rem)}.wo-answer{border:3px dashed var(--line);border-radius:1rem;flex-wrap:wrap;align-content:flex-start;gap:.6rem;min-height:7rem;padding:.8rem;display:flex}.wo-answer.correct{border-color:var(--ok);background:color-mix(in srgb, var(--ok) 12%, transparent)}.wo-answer.wrong{border-color:var(--bad);background:color-mix(in srgb, var(--bad) 12%, transparent)}.wo-slot{border-bottom:3px solid var(--line);width:3rem;min-height:3.2rem}.wo-bank{flex-wrap:wrap;flex:1;place-content:flex-start center;gap:.6rem;padding-top:.5rem;display:flex}.chip{min-width:3rem;min-height:3.2rem;font:inherit;color:var(--fg);background:var(--chip);border:2px solid var(--accent);box-shadow:0 3px 0 var(--accent);cursor:pointer;touch-action:manipulation;border-radius:.9rem;padding:.5rem 1.1rem;font-size:clamp(1.1rem,4.5vw,1.6rem);font-weight:600}.chip:active{box-shadow:0 1px 0 var(--accent);transform:translateY(2px)}.chip-placed{background:var(--accent-soft)}.wo-footer{justify-content:space-between;align-items:center;gap:1rem;min-height:3.5rem;display:flex}.wo-feedback{margin:0;font-size:clamp(1.1rem,4.5vw,1.5rem);font-weight:700}.wo-feedback.correct{color:var(--ok)}.wo-feedback.wrong{color:var(--bad)}.wo-end{text-align:center;justify-content:center;align-items:center}.wo-end h2{margin:0;font-size:2.2rem}.wo-score{margin:0;font-size:1.5rem}