:root{--bg: #f7f3ea;--surface: #ffffff;--surface-2: #efe9db;--text: #2a2a2e;--text-2: #6a6a72;--line: #e2dccb;--accent: #3bb3a9;--accent-ink: #ffffff;--gem: #4f8fe6;--star: #f5c542;--good: #5fbf6a;--bad: #e2574c;--words: #9b6be6;--math: #4f8fe6;--science: #5fbf6a;--fun: #f08a3c;--radius: 14px;--tap: 48px;--font: "Nunito", "Segoe UI", system-ui, -apple-system, sans-serif;--font-display: "Baloo 2", "Nunito", "Segoe UI", system-ui, sans-serif;--ink: #3b2a1e;--paper: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.25 0 0 0 0 0.15 0 0 0 0.05 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #1b1b20;--surface: #26262d;--surface-2: #30303a;--text: #f1eee6;--text-2: #a9a9b3;--line: #3a3a45}}:root[data-theme=dark]{--bg: #1b1b20;--surface: #26262d;--surface-2: #30303a;--text: #f1eee6;--text-2: #a9a9b3;--line: #3a3a45}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:17px;line-height:1.35;overscroll-behavior:none}body{min-height:100dvh;background-image:var(--paper);background-size:160px 160px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) body{background-image:none}}button,input,select{font:inherit;color:inherit}button{cursor:pointer}h1,h2,h3{margin:0;line-height:1.15}h1{font-size:26px;font-weight:800;font-family:var(--font-display)}h2{font-size:22px;font-weight:800;font-family:var(--font-display)}h3{font-size:18px;font-weight:700;font-family:var(--font-display)}.bar .title{font-family:var(--font-display);font-size:21px}p{margin:0}#app{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.bar{display:flex;align-items:center;gap:10px;padding:10px 12px;min-height:56px;position:sticky;top:0;background:var(--bg);z-index:5}.bar .title{flex:1;font-weight:800;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar .spacer{flex:1}.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--surface);border:2px solid var(--line);font-weight:800;font-size:15px;min-height:36px}.pill .dot{width:12px;height:12px;border-radius:50%;display:inline-block}.pill .dot.gem{background:var(--gem);transform:rotate(45deg);border-radius:3px}.pill .dot.star{background:var(--star);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);width:14px;height:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:10px 18px;border-radius:var(--radius);border:2px solid var(--line);background:var(--surface);font-weight:800;font-size:17px;transition:transform .08s;user-select:none}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.ghost{background:transparent}.btn.small{min-height:40px;padding:6px 12px;font-size:15px}.btn.icon{width:var(--tap);padding:0}.btn:disabled{opacity:.45}.btn.block{width:100%}.btn.good{background:var(--good);border-color:var(--good);color:#fff}.row{display:flex;gap:10px;align-items:center}.row.wrap{flex-wrap:wrap}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stack{display:flex;flex-direction:column;gap:10px}.pad{padding:12px 16px}.center{text-align:center}.muted{color:var(--text-2)}.small{font-size:14px}.card{background:var(--surface);border:2px solid var(--line);border-radius:var(--radius);padding:12px 14px;box-shadow:0 1px 0 var(--line)}.card.storybook{border-color:var(--ink);border-width:2px;border-radius:18px 18px 18px 6px}.card.tap{cursor:pointer}.card.tap:active{transform:scale(.985)}.card.locked{opacity:.55}.tabs{display:flex;gap:6px;padding:0 16px 10px;overflow-x:auto;scrollbar-width:none}.tabs .tab{flex:0 0 auto;min-height:40px;padding:6px 14px;border-radius:999px;border:2px solid var(--line);background:var(--surface);font-weight:800;font-size:15px}.tabs .tab.on{background:var(--text);color:var(--bg);border-color:var(--text)}.msg{min-height:26px;padding:6px 16px;font-weight:700;color:var(--text-2);text-align:center}.msg.good{color:var(--good)}.msg.bad{color:var(--bad)}.ring{width:14px;height:14px;border-radius:50%;border:3px solid currentColor;display:inline-block}.game{flex:1;display:flex;flex-direction:column;padding:0 12px 16px;gap:10px}.game canvas{border-radius:var(--radius)}.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{min-height:56px;border-radius:var(--radius);border:2px solid var(--line);background:var(--surface);font-weight:800;font-size:22px}.choice.good{background:var(--good);border-color:var(--good);color:#fff}.choice.bad{background:var(--bad);border-color:var(--bad);color:#fff}.prompt{font-size:24px;font-weight:800;text-align:center;padding:8px 0}.big{font-size:34px;font-weight:800}.keys{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}.keys .key{min-height:44px;border-radius:8px;border:2px solid var(--line);background:var(--surface);font-weight:800;font-size:18px;padding:0;text-transform:uppercase}.keys .key.wide{grid-column:span 2;font-size:14px}.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.numpad .key{min-height:52px;border-radius:10px;border:2px solid var(--line);background:var(--surface);font-weight:800;font-size:22px}.overlay{position:fixed;inset:0;background:#1414188c;display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}.sheet{background:var(--surface);border-radius:20px;padding:20px;width:100%;max-width:420px;display:flex;flex-direction:column;gap:12px}.stars{display:flex;justify-content:center;gap:8px}.stars .s{width:36px;height:36px;background:var(--line);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}.stars .s.on{background:var(--star)}.pop{animation:pop .35s ease-out}@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.shake{animation:shake .3s}@keyframes shake{25%{transform:translate(-6px)}75%{transform:translate(6px)}}input[type=range]{width:100%;accent-color:var(--accent);height:32px}input[type=text]{min-height:var(--tap);padding:8px 12px;border-radius:10px;border:2px solid var(--line);background:var(--surface);width:100%;font-size:18px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatch{width:40px;height:40px;border-radius:50%;border:3px solid transparent}.swatch.on{border-color:var(--text)}.opt{border:2px solid var(--line);border-radius:12px;background:var(--surface);padding:6px;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:64px;font-size:13px;font-weight:700}.opt.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}.opt.locked{opacity:.5}.opt svg{width:44px;height:56px}table.parent{width:100%;border-collapse:collapse;font-size:14px}table.parent td,table.parent th{padding:6px 4px;border-bottom:1px solid var(--line);text-align:left}