:root{color-scheme:light;--ink: oklch(25% .026 286);--muted: oklch(50% .028 282);--paper: oklch(95% .018 86);--panel: oklch(98% .012 84);--panel-2: oklch(92% .018 83);--line: oklch(77% .023 79);--line-strong: oklch(39% .031 285);--coral: oklch(68% .078 38);--cyan: oklch(70% .055 220);--green: oklch(70% .052 150);--yellow: oklch(78% .07 88);--violet: oklch(67% .056 310);--pink: oklch(70% .065 358);--good: oklch(61% .07 151);--bad: oklch(61% .08 31);--shadow: 0 16px 0 oklch(25% .026 286 / .07);--radius: 8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html{min-height:100%;background:var(--paper)}body{min-width:320px;min-height:100vh;margin:0;color:var(--ink);background:linear-gradient(90deg,oklch(84% .018 88 / .48) 1px,transparent 1px),linear-gradient(180deg,oklch(84% .018 88 / .48) 1px,transparent 1px),linear-gradient(135deg,#f4eee1,#c5e6e3 44%,#f4dde9);background-size:34px 34px,34px 34px,auto}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid oklch(68% .075 214 / .55);outline-offset:3px}.app{display:grid;grid-template-columns:286px minmax(0,1fr);gap:18px;width:min(1500px,calc(100% - 28px));margin:0 auto;padding:18px 0 34px}.mission-rail{position:sticky;top:18px;align-self:start;display:grid;gap:14px;min-width:0}.rail-brand,.rail-note,.hero,.world,.deck-section,.lab-section,.challenge-section{border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow)}.rail-brand{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;padding:14px;background:linear-gradient(135deg,#d5c5a7,#a6bfaa 42%,#9dbec8 76%,#d4b4bf)}.brand-icon{display:grid;place-items:center;width:52px;aspect-ratio:1;border:2px solid var(--ink);border-radius:var(--radius);background:#fffcef99;background:oklch(99% .02 96 / .6)}.rail-brand p,.kicker{margin:0;color:var(--muted);font-size:.75rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.rail-brand strong{display:block;margin-top:3px;font-size:1.08rem;line-height:1.15}.mission-list{display:grid;gap:10px}.mission-tab{--accent: var(--coral);display:grid;grid-template-columns:42px minmax(0,1fr) 48px;gap:10px;align-items:center;min-height:66px;padding:9px;border:2px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);background:color-mix(in oklch,var(--accent) 12%,var(--panel));text-align:left;transition:transform .16s ease-out,background .16s ease-out,box-shadow .16s ease-out}.mission-tab:hover,.mission-tab.active{transform:translate(3px,-3px);box-shadow:-5px 5px 0 var(--line-strong)}.mission-tab.active{background:color-mix(in oklch,var(--accent) 36%,var(--panel))}.tab-coral,.hero-coral,.world-coral,.card-coral,.lab-coral{--accent: var(--coral)}.tab-cyan,.hero-cyan,.world-cyan,.card-cyan,.lab-cyan{--accent: var(--cyan)}.tab-green,.hero-green,.world-green,.card-green,.lab-green{--accent: var(--green)}.tab-yellow,.hero-yellow,.world-yellow,.card-yellow,.lab-yellow{--accent: var(--yellow)}.tab-violet,.hero-violet,.world-violet,.card-violet,.lab-violet{--accent: var(--violet)}.tab-pink,.hero-pink,.world-pink,.card-pink,.lab-pink{--accent: var(--pink)}.tab-index,.tab-score{display:grid;place-items:center;min-width:38px;height:38px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--accent);font-weight:950}.tab-score{min-width:46px;height:34px;background:#fefcf3;font-size:.78rem}.tab-text{min-width:0}.tab-text strong,.tab-text small{display:block}.tab-text strong{font-size:.94rem;line-height:1.2}.tab-text small{margin-top:3px;color:var(--muted);font-size:.78rem;line-height:1.2}.rail-note{display:flex;gap:10px;align-items:flex-start;padding:12px;color:var(--muted);font-size:.9rem;line-height:1.45}.stage{display:grid;gap:18px;min-width:0}.hero{display:grid;grid-template-columns:1fr;gap:16px;padding:16px;background:linear-gradient(110deg,color-mix(in oklch,var(--accent) 22%,var(--panel)),var(--panel) 68%),repeating-linear-gradient(135deg,transparent 0 16px,oklch(25% .026 286 / .045) 16px 18px)}.hero-copy{min-height:232px;padding:16px;border:2px solid var(--line-strong);border-radius:var(--radius);background:#fffcf1db}.hero-copy h1{max-width:18ch;margin:12px 0;font-size:3.25rem;line-height:1.14;padding-bottom:.04em;letter-spacing:0}.hero-copy p:not(.kicker){max-width:66ch;margin:0;color:var(--muted);font-size:1.03rem;line-height:1.7}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.hero-actions span{display:inline-flex;gap:7px;align-items:center;min-height:38px;padding:8px 11px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);font-weight:850}.tag-bank,.challenge-actions,.token-grid,.choice-grid{display:flex;flex-wrap:wrap;gap:8px}.tag-bank span{padding:7px 9px;border:1px solid currentColor;border-radius:var(--radius);color:#e8e5d6c2;font-size:.78rem;font-weight:850}.world{display:grid;gap:18px;padding:16px;background:linear-gradient(180deg,color-mix(in oklch,var(--accent) 16%,var(--panel)),var(--panel) 280px),var(--panel)}.world-header,.section-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.world-header h2,.section-heading h3{margin:6px 0;line-height:1.12;letter-spacing:0}.world-header h2{font-size:2.4rem}.world-header p:not(.kicker){max-width:70ch;margin:0;color:var(--muted);line-height:1.55}.score-orbit{display:grid;place-items:center;width:104px;aspect-ratio:1;border:2px solid var(--line-strong);border-radius:50%;background:conic-gradient(var(--accent) calc(var(--score) * 1%),oklch(89% .03 96) 0),var(--panel)}.score-orbit strong,.score-orbit span{grid-area:1 / 1}.score-orbit strong{transform:translateY(-8px);font-size:1.2rem}.score-orbit span{transform:translateY(15px);color:var(--muted);font-size:.75rem;font-weight:850}.deck-section,.lab-section,.challenge-section{display:grid;gap:14px;padding:16px}.section-heading h3{font-size:1.6rem}.section-heading>span,.best-score{padding:8px 10px;border:2px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 24%,var(--panel));font-weight:950}.knowledge-track{display:grid;grid-template-columns:repeat(6,minmax(220px,1fr));gap:10px;overflow-x:auto;padding-bottom:4px}.knowledge-card{display:grid;grid-template-rows:auto auto auto 1fr auto auto auto;gap:9px;min-height:262px;padding:13px;border:2px solid var(--line-strong);border-radius:var(--radius);background:linear-gradient(180deg,color-mix(in oklch,var(--accent) 26%,var(--panel)) 0 36px,var(--panel) 36px)}.knowledge-card.learned{background:linear-gradient(180deg,var(--accent) 0 36px,color-mix(in oklch,var(--accent) 14%,var(--panel)) 36px)}.knowledge-card.teaching{min-height:520px}.card-head{display:flex;justify-content:space-between;gap:10px;align-items:center}.card-number{justify-self:start;padding:4px 7px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);font-weight:950}.help-button{display:grid;place-items:center;width:32px;aspect-ratio:1;border:2px solid var(--line-strong);border-radius:50%;color:var(--ink);background:color-mix(in oklch,var(--accent) 24%,var(--panel));transition:transform .16s ease-out,box-shadow .16s ease-out,background .16s ease-out}.help-button:hover{transform:translate(2px,-2px);box-shadow:-4px 4px 0 var(--line-strong);background:color-mix(in oklch,var(--accent) 42%,var(--panel))}.knowledge-card h4{margin:0;font-size:1.05rem;line-height:1.18}.formula-strip{width:fit-content;max-width:100%;padding:8px 9px;border:2px solid var(--line-strong);border-radius:var(--radius);background:#fff5d7;color:#542f29;font-weight:950;overflow-wrap:anywhere}.knowledge-card p,.knowledge-card small{margin:0;color:var(--muted);line-height:1.45}.knowledge-card small{font-size:.83rem}.teaching-panel{display:grid;gap:10px;padding:10px;border:2px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 18%,var(--panel))}.teaching-title{display:flex;justify-content:space-between;gap:8px;align-items:center}.teaching-title span,.teaching-note span{width:fit-content;padding:3px 6px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);color:var(--muted);font-size:.7rem;font-weight:950;letter-spacing:.04em}.teaching-title strong{text-align:right;font-size:.9rem}.teaching-story{padding:8px;border:1px dashed var(--line-strong);border-radius:var(--radius);background:#f9f5ec}.teaching-panel ol{display:grid;gap:7px;margin:0;padding-left:18px}.teaching-panel li,.teaching-panel p,.teaching-note p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.45}.teaching-panel li::marker{color:var(--ink);font-weight:950}.teaching-note{display:grid;gap:5px;padding:8px;border:1px solid color-mix(in oklch,var(--line-strong) 56%,transparent);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 10%,var(--panel))}.teaching-note.warning{background:#f4d7ce}.teaching-note.check{background:#cde1d0}.icon-button{display:inline-flex;justify-content:center;align-items:center;gap:7px;width:fit-content;min-height:38px;padding:8px 11px;border:2px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);background:var(--panel);font-weight:900;transition:transform .16s ease-out,box-shadow .16s ease-out,background .16s ease-out}.icon-button:hover:not(:disabled){transform:translate(2px,-2px);box-shadow:-4px 4px 0 var(--line-strong)}.icon-button:disabled{color:#6c7086;background:#dbd8c9;opacity:.72;transform:none;box-shadow:none}.icon-button.primary{background:var(--accent)}.icon-button.primary:disabled{background:#dbd8c9}.icon-button.danger{background:#ffdbd5;background:oklch(92% .09 30)}.lab-shell{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px}.lab-controls,.lab-board,.question-panel,.challenge-gate{border:2px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 10%,var(--panel))}.lab-controls{display:grid;align-content:start;gap:11px;padding:13px}.field{display:grid;gap:6px}.field span{color:var(--muted);font-size:.82rem;font-weight:900}.field input,.field select{width:100%;min-height:42px;border:2px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);background:var(--panel);padding:8px 10px}.lab-board{display:grid;gap:12px;min-height:348px;padding:13px;background:linear-gradient(90deg,oklch(80% .05 88 / .32) 1px,transparent 1px),linear-gradient(180deg,oklch(80% .05 88 / .32) 1px,transparent 1px),#fffcf0;background-size:26px 26px}.shape-diagram{width:100%;max-height:238px}.shape-diagram polygon,.shape-diagram rect{fill:color-mix(in oklch,var(--accent) 70%,oklch(99% .02 96));stroke:var(--line-strong);stroke-width:5}.shape-diagram line{stroke:var(--line-strong);stroke-width:4;stroke-dasharray:8 7}.shape-diagram text{fill:var(--ink);font-size:14px;font-weight:900;text-anchor:middle}.lab-result{display:grid;gap:8px;align-self:end;padding:12px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel)}.lab-result span{width:fit-content;max-width:100%;padding:6px 8px;border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 28%,var(--panel));font-weight:950;overflow-wrap:anywhere}.lab-result strong{font-size:1.6rem;line-height:1.1;overflow-wrap:anywhere}.lab-result p{margin:0;color:var(--muted);line-height:1.45}.converter-art,.fraction-machine,.model-board,.scanner,.warning-radar{display:grid;place-items:center;min-height:170px;border:2px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 18%,var(--panel))}.converter-art{grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr);gap:12px}.converter-art>span,.fraction-machine span,.warning-radar strong{padding:9px 11px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);font-size:1.2rem;font-weight:950}.belt{width:90px;height:26px;border:2px solid var(--line-strong);border-radius:var(--radius);background:repeating-linear-gradient(90deg,var(--accent) 0 12px,var(--panel) 12px 20px)}.scanner svg{color:var(--accent);stroke-width:1.4}.scanner strong{margin-top:-70px;font-size:2.2rem}.fraction-machine{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);gap:10px}.fraction-machine small{color:var(--muted);font-weight:950}.model-board{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}.model-board span{display:grid;place-items:center;min-height:82px;width:100%;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);font-weight:950}.warning-radar{grid-template-columns:72px minmax(0,1fr);gap:12px;padding:12px}.warning-radar strong{display:grid;place-items:center;width:58px;aspect-ratio:1;background:var(--bad);color:#fcf9ea;font-size:2rem}.warning-radar span{font-size:1.25rem;font-weight:950}.tag-bank span{color:var(--ink);background:color-mix(in oklch,var(--accent) 18%,var(--panel))}.challenge-gate{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px}.challenge-gate>div{display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:11px;align-items:center}.challenge-gate svg{grid-row:span 2;color:var(--accent)}.challenge-gate strong{font-size:1.1rem}.challenge-gate p{margin:2px 0 0;color:var(--muted);line-height:1.45}.challenge-gate.open{background:color-mix(in oklch,var(--accent) 18%,var(--panel))}.question-panel{display:grid;gap:13px;padding:14px}.question-panel>p{margin:0;font-size:1.1rem;font-weight:850}.choice-grid button,.token-grid button,.formula-slot span,.formula-slot em{min-height:40px;padding:8px 11px;border:2px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);background:var(--panel);font-weight:900}.choice-grid button.selected,.token-grid button:not(:disabled):hover{background:var(--accent)}.builder{display:grid;gap:10px}.formula-slot{display:flex;flex-wrap:wrap;gap:8px;min-height:58px;padding:8px;border:2px dashed var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--accent) 10%,var(--panel))}.formula-slot em{color:var(--muted);font-style:normal}.token-grid button:disabled{opacity:.4}.challenge-feedback{min-height:48px;padding:11px;border:2px solid var(--line-strong);border-radius:var(--radius);background:var(--panel-2);color:var(--muted);line-height:1.45}.challenge-feedback.good{color:#1f3724;background:#bee2c5}.challenge-feedback.bad{color:#512c28;background:#fbcfc7}.answer-field{max-width:420px}.site-footer{padding:12px 14px;border:2px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklch,var(--panel) 86%,var(--cyan));box-shadow:var(--shadow);color:var(--muted);font-size:.85rem;font-weight:850;text-align:center}@media(max-width:1180px){.app{grid-template-columns:1fr}.mission-rail{position:static}.mission-list{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}}@media(max-width:760px){.app{width:min(100% - 18px,760px);padding-top:9px}.mission-list,.hero,.lab-shell,.challenge-gate{grid-template-columns:1fr}.hero-copy{min-height:auto}.hero-copy h1{font-size:2.35rem}.world-header,.section-heading{display:grid}.world-header h2{font-size:1.9rem}.score-orbit{width:88px}.knowledge-track{grid-template-columns:1fr;overflow-x:visible}.converter-art,.fraction-machine,.model-board{grid-template-columns:1fr}.challenge-gate>div{grid-template-columns:32px minmax(0,1fr)}}