:root{--p-orange: #f59e0b;--p-orange-deep: #d97706;--p-yellow: #fbbf24;--p-azure: #1587e5;--p-azure-soft: #5ab0ff;--p-gold: #c98a1c;--p-gold-soft: #e7b93e;--p-green: #16a34a;--p-red: #dc2626;--p-white: #ffffff;--p-lane-blue: #4a6fa5;--p-lane-clay: #b0764a;--p-lane-green: #5b8c6a;--p-lane-plum: #9a6da8;--p-lane-teal: #4f83a3;--p-lane-rose: #a86d8f;--p-dup-1: #c2536b;--p-dup-2: #3e7cb1;--p-dup-3: #5e9a63;--p-dup-4: #b07a2e;--p-dup-5: #8a6bb0;--p-dup-6: #2f8f8f;--surface: #fff8e7;--surface-raised: #ffffff;--surface-sunk: #ffffff;--seg-track: #f3e6c7;--seg-thumb: #ffffff;--seg-thumb-ink: #4a3418;--seg-thumb-border: transparent;--avatar-bg: #fff3d1;--text: #4a3418;--text-soft: #8a6d3b;--heading: var(--p-orange-deep);--primary: var(--p-orange);--primary-deep: var(--p-orange-deep);--on-primary: var(--p-white);--accent-line: #fbbf24;--selection: #f59e0b;--on-selection: #6b3f00;--highlight: #fbbf24;--on-highlight: #6b3f00;--good: var(--p-green);--bad: var(--p-red);--good-soft: #e8f7ec;--bad-soft: #fdeeee;--locked: #d6cdb8;--on-locked: #6b5a34;--hairline: rgba(122, 74, 0, .12);--field-border: #eadfc4;--track: #f3e8c8;--shadow: 0 2px 10px rgba(122, 74, 0, .08);--shadow-strong: 0 12px 34px rgba(122, 74, 0, .18);--apphead-shadow: 0 6px 10px -8px rgba(122, 74, 0, .35);--pulse-soft: rgba(245, 158, 11, .16);--out-bg: #241a0c;--out-fg: #ffe9b3;--out-err: #ffb4a8;--edge: #a99a83;--node-stroke-locked: #dad2c4;--node-fill-locked: #efeae1;--lane-empty: #b8b0a2;--bubble-outer: #8a93a6;--cap-fill: #fbf3dc;--cap-fill-locked: #f1e8cf;--cap-border: #d9a62e;--card-cap-fill: #fdf6e3;--cap-shadow: 0 2px 10px rgba(201, 138, 28, .18);--cap-star: #c98a1c;--cap-locked-line: #cdbb8e;--cap-star-locked-fill: #dacda8;--cap-star-locked-stroke: #b7a578;--graph-glow: rgba(245, 158, 11, .06);--node-shadow-avail: drop-shadow(0 3px 6px rgba(122, 74, 0, .16));--node-shadow-mastered: drop-shadow(0 1px 3px rgba(122, 74, 0, .14));--chip-mastered-bg: rgba(245, 158, 11, .16);--chip-avail-bg: rgba(74, 111, 165, .14);--chip-avail-fg: #3d6098;--chip-cap-bg: rgba(201, 138, 28, .16);--chip-cap-fg: #8a5e12;--on-node-check: #3a2400;--code-bg: #ffffff;--code-active-line: rgba(122, 74, 0, .04);--code-active-line-gutter: rgba(122, 74, 0, .06);--code-fg: #4a3418;--code-gutter-bg: #faf3e2;--code-gutter-fg: #b09a6e;--code-selection: rgba(245, 158, 11, .2);--code-bracket: rgba(245, 158, 11, .22);--code-keyword: #c2410c;--code-string: #4d7c0f;--code-number: #b45309;--code-comment: #a1876a;--code-function: #2563eb;--code-operator: #8a6d3b;--code-variable: #4a3418;--radius: 16px}:root[data-theme=moonlight]{--surface: #eaf1f8;--surface-raised: #ffffff;--surface-sunk: #f3f7fc;--seg-track: #dbe6f2;--seg-thumb: #ffffff;--seg-thumb-ink: #1e2c3d;--seg-thumb-border: var(--field-border);--avatar-bg: #e8eef6;--text: #1e2c3d;--text-soft: #4f6076;--accent-line: #1587e5;--selection: #0f6fbf;--on-selection: #ffffff;--highlight: #e4dcc0;--on-highlight: #4a3a12;--good-soft: #e4f3ea;--bad-soft: #fbe9ea;--locked: #cdd8e4;--on-locked: #445468;--hairline: rgba(40, 70, 110, .14);--field-border: #d2deec;--track: #d9e5f1;--shadow: 0 2px 12px rgba(40, 70, 110, .12);--shadow-strong: 0 12px 34px rgba(40, 70, 110, .2);--apphead-shadow: 0 6px 10px -8px rgba(40, 70, 110, .35);--out-bg: #1f2732;--out-fg: #dfe8f2;--edge: #9fb1c6;--node-stroke-locked: #c4d0dd;--node-fill-locked: #e8eef5;--lane-empty: #b4c0cf;--bubble-outer: #9fb1c6;--cap-fill: #eef4fb;--cap-fill-locked: #e6edf5;--cap-border: #c9a24a;--card-cap-fill: #eef4fb;--cap-shadow: 0 2px 12px rgba(40, 70, 110, .16);--cap-locked-line: #c9c3ae;--cap-star-locked-fill: #d3d8c6;--cap-star-locked-stroke: #b2b19a;--graph-glow: rgba(21, 135, 229, .06);--node-shadow-avail: drop-shadow(0 3px 6px rgba(40, 70, 110, .18));--node-shadow-mastered: drop-shadow(0 1px 3px rgba(40, 70, 110, .16));--code-bg: #f3f7fc;--code-active-line: rgba(40, 70, 110, .05);--code-active-line-gutter: rgba(40, 70, 110, .07);--code-fg: #1e2c3d;--code-gutter-bg: #e9f0f8;--code-gutter-fg: #93a3b8;--code-selection: rgba(21, 135, 229, .18);--code-bracket: rgba(21, 135, 229, .2);--code-keyword: #1d4ed8;--code-string: #3f6212;--code-number: #a16207;--code-comment: #7c8ba0;--code-function: #2563eb;--code-operator: #5c7085;--code-variable: #1e2c3d}:root[data-theme=night]{--p-gold: #b8963f;--p-gold-soft: #cdb264;--p-lane-blue: #6e8fbe;--p-lane-clay: #c68f63;--p-lane-green: #7ba98a;--p-lane-plum: #b78bc4;--p-lane-teal: #6fa0be;--p-lane-rose: #c58bab;--surface: #17120a;--surface-raised: #241d12;--surface-sunk: #1f1810;--seg-track: #2c2313;--seg-thumb: #4a3d27;--seg-thumb-ink: #f6ecd6;--seg-thumb-border: var(--field-border);--avatar-bg: #2c2313;--text: #f6ecd6;--text-soft: #b9a888;--accent-line: #c9a24a;--selection: #f59e0b;--on-selection: #6b3f00;--highlight: #a8863a;--on-highlight: #2a2113;--good-soft: rgba(22, 163, 74, .16);--bad-soft: rgba(220, 38, 38, .18);--locked: #3c3422;--on-locked: #b9a888;--hairline: rgba(255, 255, 255, .1);--field-border: #3c3422;--track: #2e2717;--shadow: 0 2px 12px rgba(0, 0, 0, .5);--shadow-strong: 0 12px 34px rgba(0, 0, 0, .6);--apphead-shadow: 0 6px 10px -8px rgba(0, 0, 0, .6);--edge: #7a6f52;--node-stroke-locked: #4a4230;--node-fill-locked: #2a2416;--lane-empty: #5a5340;--bubble-outer: #5a6474;--cap-fill: #2e2717;--cap-fill-locked: #2a2415;--cap-border: #8f7434;--card-cap-fill: #2a2113;--cap-shadow: 0 2px 12px rgba(0, 0, 0, .5);--cap-star: #a8863a;--cap-locked-line: #6a5f40;--cap-star-locked-fill: #6a5f40;--cap-star-locked-stroke: #554c33;--graph-glow: rgba(245, 158, 11, .05);--node-shadow-avail: drop-shadow(0 3px 6px rgba(0, 0, 0, .5));--node-shadow-mastered: drop-shadow(0 1px 3px rgba(0, 0, 0, .45));--chip-mastered-bg: rgba(245, 158, 11, .2);--chip-avail-bg: rgba(110, 143, 190, .2);--chip-avail-fg: #9fb6d6;--chip-cap-bg: rgba(184, 150, 63, .2);--chip-cap-fg: #cdb264;--code-bg: #1f1810;--code-active-line: rgba(255, 255, 255, .04);--code-active-line-gutter: rgba(255, 255, 255, .05);--code-fg: #f6ecd6;--code-gutter-bg: #241d12;--code-gutter-fg: #8f8266;--code-selection: rgba(245, 158, 11, .28);--code-bracket: rgba(245, 158, 11, .22);--code-keyword: #f0a35e;--code-string: #b6d986;--code-number: #ffcb6b;--code-comment: #8f8266;--code-function: #82aaff;--code-operator: #b9a888;--code-variable: #f6ecd6}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;background:var(--surface);color:var(--text);font-family:-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;font-size:16px;line-height:1.5}.app{max-width:640px;margin:0 auto;padding:0 14px 90px;min-height:100%;overflow-x:clip}.apphead{position:sticky;top:0;z-index:10;background:var(--surface);box-shadow:var(--apphead-shadow)}.topbar{display:flex;align-items:center;gap:6px 8px;flex-wrap:wrap;padding:8px 0 6px}.topbar .comps{flex:1;display:flex;justify-content:center;gap:6px;min-width:0}.topbar .comp{min-height:34px;padding:5px 12px;font-size:12.5px;gap:5px;border-radius:999px;white-space:nowrap}.topbar .comp.ghost{border-width:1.5px}.langbar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:8px;max-width:640px;margin:0 auto;padding:8px 14px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,var(--surface) 45%);pointer-events:none}.langbar>*{pointer-events:auto}.langbar-slide{flex:1;min-width:0;overflow:hidden;transition:max-width .32s cubic-bezier(.34,1.05,.4,1),opacity .22s,transform .32s;max-width:100%}.langbar.closed .langbar-slide{max-width:0;opacity:0;transform:translate(24px)}.langbar-toggle{flex:none;width:46px;height:46px;min-height:46px;padding:0;border-radius:50%;font-size:17px;background:var(--surface-raised);color:var(--text-soft);box-shadow:var(--shadow);border:2px solid var(--field-border)}.langbar.closed .langbar-toggle{background:var(--primary);border-color:var(--primary)}@media(prefers-reduced-motion:reduce){.langbar-slide{transition:none}}.langsel{position:relative;display:grid;touch-action:pan-y;grid-template-columns:repeat(var(--count),1fr);align-items:stretch;background:var(--seg-track);border-radius:999px;padding:4px;box-shadow:inset 0 1px 2px var(--hairline)}.langsel-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--count));background:var(--selection);border-radius:999px;box-shadow:var(--shadow);transform:translate(calc(var(--active) * 100%));transition:transform .28s cubic-bezier(.34,1.2,.4,1)}.langsel-opt{position:relative;z-index:1;background:transparent;min-width:0;color:var(--text-soft);border:none;min-height:38px;padding:6px 8px;font-size:12.5px;font-weight:800;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:color .2s}.langsel-opt.on{color:var(--on-selection)}.langsel.dragging .langsel-thumb{transition:none}.langsel.dragging{cursor:grabbing}.viewpick{position:relative;display:grid;grid-template-columns:repeat(var(--count),1fr);background:var(--seg-track);border-radius:12px;padding:3px;margin:12px 0 8px;touch-action:pan-y}.viewpick-thumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px) / var(--count));background:var(--seg-thumb);border:1px solid var(--seg-thumb-border);border-radius:9px;box-shadow:var(--shadow);transform:translate(calc(var(--active) * 100%));transition:transform .28s cubic-bezier(.34,1.2,.4,1)}.viewpick button{position:relative;z-index:1;border:none;background:transparent;color:var(--text-soft);font-size:13px;font-weight:800;padding:8px 6px;border-radius:9px;cursor:pointer;transition:color .15s}.viewpick button.on{color:var(--seg-thumb-ink)}.viewpick.dragging .viewpick-thumb{transition:none}.viewpick.dragging{cursor:grabbing}.topbar .logo{font-size:22px;font-weight:800;color:var(--heading);text-decoration:none}.topbar .spacer{flex:1}.pill{background:var(--highlight);color:var(--on-highlight);border-radius:999px;padding:4px 12px;font-weight:800;font-size:14px}.dot{width:10px;height:10px;border-radius:50%;display:inline-block}.dot.on{background:var(--good)}.dot.off{background:var(--locked)}.card{background:var(--surface-raised);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin:10px 0}.card.locked{opacity:.55}.card.done{border:2px solid var(--good)}.card.cap{border:2px solid var(--cap-border);background:linear-gradient(180deg,var(--card-cap-fill),var(--surface-raised));box-shadow:var(--cap-shadow)}.card.cap .capstar{color:var(--cap-star);font-size:18px}h1{font-size:24px;margin:14px 0 6px}h2{font-size:18px;margin:16px 0 6px;color:var(--heading)}h3{font-size:16px;margin:10px 0 4px}p{margin:8px 0}.muted{color:var(--text-soft);font-size:14px}button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--primary);color:var(--on-primary);border:none;border-radius:14px;padding:13px 20px;font-size:16px;font-weight:800;cursor:pointer;min-height:48px;text-decoration:none}button:disabled{background:var(--locked);cursor:default}button.ghost,.btn.ghost{background:transparent;color:var(--primary-deep);border:2px solid var(--accent-line)}button.small{padding:8px 14px;min-height:40px;font-size:14px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grow{flex:1}input,select{width:100%;padding:13px 14px;font-size:17px;border-radius:12px;border:2px solid var(--field-border);background:var(--surface-sunk);color:var(--text);min-height:48px}input:focus{outline:none;border-color:var(--accent-line)}label{font-weight:700;font-size:14px;display:block;margin:10px 0 4px}.output{background:var(--out-bg);color:var(--out-fg);border-radius:12px;padding:12px 14px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;white-space:pre-wrap;word-break:break-word;min-height:44px;margin-top:10px}.output.error{color:var(--out-err)}.output-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--text-soft);margin:12px 0 -2px}.output-label span{font-weight:600;text-transform:none;letter-spacing:0;opacity:.8}@keyframes bpulse{0%,to{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 6px var(--pulse-soft)}}.pulse{animation:bpulse 1.7s ease-in-out infinite}.pulse-strong{animation:bpulse .95s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.pulse,.pulse-strong{animation:none}}.editor-wrap{border:2px solid var(--field-border);border-radius:12px;overflow:hidden;margin-top:8px}.cm-editor{font-size:16px;color-scheme:light}:root[data-theme=night] .cm-editor{color-scheme:dark}.cm-editor .cm-content{font-family:ui-monospace,Menlo,Consolas,monospace;padding:10px 0}.cm-editor.cm-focused{outline:none}.feedback{border-radius:12px;padding:12px 14px;margin-top:10px;font-weight:700}.feedback.good{background:var(--good-soft);color:var(--good)}.feedback.bad{background:var(--bad-soft);color:var(--bad)}.progressbar{height:10px;background:var(--track);border-radius:999px;overflow:hidden;margin:8px 0}.progressbar>div{height:100%;background:var(--primary);border-radius:999px;transition:width .4s}.bigcode{font-size:44px;font-weight:900;letter-spacing:8px;color:var(--primary-deep);text-align:center;margin:8px 0}.timerbar{height:14px;background:var(--track);border-radius:999px;overflow:hidden}.timerbar>div{height:100%;background:linear-gradient(90deg,var(--good),var(--primary))}.podium{display:flex;gap:8px;align-items:flex-end;justify-content:center;margin:20px 0}.podium .place{text-align:center;flex:1;max-width:130px}.podium .bar{background:var(--highlight);border-radius:12px 12px 0 0;display:flex;align-items:center;justify-content:center;font-size:34px}.scoreboard{width:100%;border-collapse:collapse}.scoreboard td,.scoreboard th{padding:10px 8px;text-align:left;border-bottom:1px solid var(--track)}.scoreboard .rank{font-weight:900;color:var(--primary-deep);width:40px}.scoreboard .score{text-align:right;font-weight:800}.avatar{font-size:26px}.avatar-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.avatar-grid button{background:var(--avatar-bg);min-height:52px;font-size:26px;padding:4px}.avatar-grid button.sel{background:var(--highlight)}.daynight{position:relative;width:30px;height:30px;flex:none;padding:0;min-height:0;background:transparent;border:none;box-shadow:none;border-radius:50%;cursor:pointer}.daynight:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.dn-ico{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:24px;line-height:1;transition:opacity .45s ease,transform .55s cubic-bezier(.34,1.35,.5,1)}.dn-day{opacity:1;transform:rotate(0) scale(1)}.dn-moonlight,.dn-night{opacity:0;transform:rotate(-140deg) scale(.35)}:root[data-theme=moonlight] .dn-day{opacity:0;transform:rotate(140deg) scale(.35)}:root[data-theme=moonlight] .dn-moonlight{opacity:1;transform:rotate(0) scale(1)}:root[data-theme=night] .dn-day{opacity:0;transform:rotate(140deg) scale(.35)}:root[data-theme=night] .dn-night{opacity:1;transform:rotate(0) scale(1)}@media(prefers-reduced-motion:reduce){.dn-ico{transition:opacity .2s ease}}body{transition:background-color .5s ease,color .5s ease}.apphead,.card,.topbar,.viewpick,.langsel,.langbar-toggle,.pill,input,select,textarea{transition:background-color .5s ease,color .5s ease,border-color .5s ease,box-shadow .5s ease}.center{text-align:center}.mt{margin-top:16px}.confetti{font-size:60px;text-align:center;animation:pop .6s ease}@keyframes pop{0%{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}.host-screen h1{font-size:34px}.host-screen .bigcode{font-size:72px}.host-screen .scoreboard td{font-size:22px;padding:14px 10px}.host-screen .prompt-display{font-size:24px}