:root{color-scheme:light;--cream: #fbf4e9;--cream-deep: #f3e7d3;--cream-0: rgba(251, 244, 233, 0);--card: #ffffff;--ink: #2a2320;--ink-soft: #5c5049;--ink-faint: #6e6154;--saffron-500: #f59e0b;--saffron-600: #d97706;--saffron-700: #b45309;--saffron-800: #92400e;--halo: #fde8c4;--halo-ring: #f5c877;--skin: #e6b184;--hair: #3a2a20;--good: #15803d;--good-bg: #dcfce7;--retry: #9a3412;--retry-bg: #ffedd5;--locked: #e7dccb;--locked-ink: #8a7d6f;--line: #e7dccb;--shadow: 0 2px 0 rgba(120, 80, 20, .18);--shadow-lift: 0 6px 20px rgba(120, 80, 20, .14);--radius: 16px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;--mono: "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}:root[data-theme=dark]{color-scheme:dark;--cream: #17130f;--cream-deep: #221c16;--cream-0: rgba(23, 19, 15, 0);--card: #241d17;--ink: #f6ecdd;--ink-soft: #d3c3ad;--ink-faint: #a2917c;--saffron-500: #f9b53d;--saffron-600: #f59e0b;--saffron-700: #c76e0b;--saffron-800: #f8c877;--halo: #2f2413;--halo-ring: #6b5220;--skin: #e6b184;--hair: #5a4531;--good: #4ade80;--good-bg: #143121;--retry: #fb9a5b;--retry-bg: #3a2413;--locked: #2b241d;--locked-ink: #9a8b78;--line: #3a3128;--shadow: 0 1px 0 rgba(0, 0, 0, .5);--shadow-lift: 0 8px 24px rgba(0, 0, 0, .55)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);font-size:18px;line-height:1.5;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}.app-shell{max-width:560px;margin:0 auto;min-height:100%;padding:0 20px calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0 12px;background:linear-gradient(var(--cream) 78%,var(--cream-0))}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.01em}.stat-group{display:flex;gap:8px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 12px;border-radius:999px;font-weight:700;font-size:16px;color:var(--ink);background:var(--card);border:2px solid var(--line)}button.pill{cursor:pointer;font-family:inherit}.pill-icon{padding:8px;min-width:44px}.pill:focus-visible{outline:3px solid var(--saffron-500);outline-offset:2px}.pill .icon{font-size:18px}.pill-streak{color:var(--saffron-800)}.pill-streak.dim{color:var(--ink-faint)}button{font-family:inherit}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;font-weight:800;font-size:18px;min-height:56px;padding:0 24px;border-radius:var(--radius);transition:transform .06s ease,filter .12s ease;color:#fff;background:var(--saffron-700);box-shadow:var(--shadow)}.btn:hover{filter:brightness(1.05)}.btn:active{transform:translateY(2px);box-shadow:none}.btn:focus-visible{outline:3px solid var(--saffron-500);outline-offset:3px}.btn:disabled{cursor:not-allowed;background:var(--locked);color:var(--locked-ink);box-shadow:none}.btn-block{width:100%}.btn-ghost{background:transparent;color:var(--saffron-800);box-shadow:none;border:2px solid var(--line)}.btn-ghost:disabled{background:transparent}.btn-lg{min-height:62px;font-size:20px}.welcome{flex:1;display:flex;flex-direction:column;justify-content:center;gap:20px;text-align:center;padding:32px 0}.welcome h1{font-size:34px;margin:4px 0 0;letter-spacing:-.02em}.welcome .tagline{font-size:20px;color:var(--ink-soft);margin:0}.welcome .promise{color:var(--ink-soft);margin:0 auto;max-width:30ch}.name-field{display:flex;flex-direction:column;gap:8px;text-align:left}.name-field label{font-weight:700}.name-field input{font-family:inherit;font-size:18px;min-height:56px;padding:0 16px;border-radius:var(--radius);border:2px solid var(--line);background:var(--card);color:var(--ink)}.name-field input:focus-visible{outline:3px solid var(--saffron-500);outline-offset:2px;border-color:var(--saffron-500)}.welcome .actions{display:flex;flex-direction:column;gap:12px;margin-top:8px}.onboard-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none;padding:0;margin:0}.chip{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;font-size:15px;font-weight:700;color:var(--ink-soft);background:var(--cream-deep);border:2px solid var(--line)}.onboard-taste{display:flex;flex-direction:column;gap:6px;width:100%;text-align:left}.onboard-code{font-family:var(--mono);font-size:18px;font-weight:700;margin:0 0 4px;padding:14px 16px;border-radius:var(--radius);background:var(--cream-deep);border:2px solid var(--line);color:var(--ink);overflow-x:auto}.name-note{font-size:14px;color:var(--ink-faint);margin:2px 0 0}.onboard-dots{display:flex;justify-content:center;gap:8px;list-style:none;padding:0;margin:8px 0 0}.onboard-dot{width:9px;height:9px;border-radius:50%;background:var(--line)}.onboard-dot.on{background:var(--saffron-600)}.guruji{display:block;flex:none}@keyframes guruji-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes guruji-pop{0%{transform:scale(.9)}60%{transform:scale(1.06)}to{transform:scale(1)}}.guruji-idle,.guruji-happy{animation:guruji-bob 3.4s ease-in-out infinite}.guruji-celebrating{animation:guruji-pop .5s ease-out}.guruji-sparkles{animation:guruji-bob 1.6s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.guruji-idle,.guruji-happy,.guruji-celebrating,.guruji-sparkles{animation:none}}.guruji-says{display:flex;align-items:flex-start;gap:12px}.guruji-bubble{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin:6px 0 0;font-size:19px;box-shadow:var(--shadow);flex:1}.home-head{text-align:center;margin:8px 0 4px}.home-head h2{margin:8px 0 2px;font-size:24px}.home-head .unit-progress{color:var(--ink-soft);margin:0;font-weight:700}.nudge{display:flex;gap:12px;align-items:center;border-radius:var(--radius);padding:14px 16px;margin:14px 0 6px;font-weight:600;border:2px solid transparent}.nudge .nudge-icon{font-size:24px}.nudge-atRisk,.nudge-repairable{background:var(--retry-bg);border-color:#f6c79a;color:var(--retry)}.nudge-safe{background:var(--good-bg);border-color:#a7e0bd;color:var(--good)}.nudge-new{background:var(--card);border-color:var(--line);color:var(--ink-soft)}.path{list-style:none;padding:8px 0 0;margin:8px 0 0;display:flex;flex-direction:column;align-items:center;gap:4px}.path-item{display:flex;flex-direction:column;align-items:center;width:100%}.path-connector{width:4px;height:22px;background:var(--line);border-radius:2px}.path-connector.done{background:var(--saffron-500)}.node{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;width:100%;max-width:420px;display:flex;align-items:center;gap:16px;padding:14px 18px;border-radius:var(--radius);background:var(--card);border:2px solid var(--line);text-align:left;color:var(--ink);box-shadow:var(--shadow);transition:transform .06s ease}.node:active{transform:translateY(2px)}.node:focus-visible{outline:3px solid var(--saffron-500);outline-offset:3px}.node-current{border-color:var(--saffron-600);box-shadow:var(--shadow-lift)}.node-locked{cursor:not-allowed;background:var(--cream-deep);color:var(--locked-ink);box-shadow:none}.node-badge{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:22px;font-weight:800;background:var(--cream-deep);color:var(--ink-soft)}.node-done .node-badge{background:var(--saffron-500);color:var(--ink)}.node-current .node-badge{background:var(--saffron-700);color:#fff}.node-main{flex:1;display:flex;flex-direction:column;gap:2px}.node-title{display:block;font-weight:800;font-size:19px}.node-sub{display:block;font-size:15px;color:var(--ink-soft)}.node-current .node-sub{color:var(--saffron-800);font-weight:700}.home-foot{margin-top:22px;text-align:center}.text-link{background:none;border:none;cursor:pointer;color:var(--ink-faint);font-size:15px;text-decoration:underline;padding:8px;min-height:44px}.runner{flex:1;display:flex;flex-direction:column;padding-top:8px}.progress-track{height:14px;background:var(--cream-deep);border-radius:999px;overflow:hidden;margin:6px 0 4px}.progress-fill{height:100%;background:var(--saffron-500);border-radius:999px;transition:width .3s ease}.runner-quit{align-self:flex-start;margin-bottom:10px}.runner-body{flex:1;display:flex;flex-direction:column;gap:18px}.prompt{font-size:22px;font-weight:800;margin:6px 0;letter-spacing:-.01em}.teach-example{margin:4px 0}.preview-frame{width:100%;min-height:150px;border:2px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.preview-label,.editor-label{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint);margin:4px 0}.assemble{display:flex;flex-direction:column;gap:14px}.assemble-tray{min-height:64px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;padding:12px;border-radius:var(--radius);border:2px dashed var(--halo-ring);background:var(--card)}.assemble-tray:empty:before{content:"Tap the pieces below in order";color:var(--ink-faint);font-size:16px}.assemble-pool{display:flex;flex-wrap:wrap;gap:8px}.tile{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;font-family:var(--mono);font-size:17px;font-weight:700;min-height:48px;padding:10px 14px;border-radius:12px;background:var(--card);border:2px solid var(--line);color:var(--ink);box-shadow:var(--shadow)}.tile:active{transform:translateY(2px);box-shadow:none}.tile:focus-visible{outline:3px solid var(--saffron-500);outline-offset:2px}.tile-used{opacity:.32;cursor:default;box-shadow:none}.tile-placed{background:var(--halo);border-color:var(--halo-ring)}.code-area{display:flex;flex-direction:column;gap:10px}.editor{font-family:var(--mono);font-size:17px;line-height:1.5;width:100%;min-height:130px;padding:14px;border-radius:var(--radius);border:2px solid var(--line);background:var(--card);color:var(--ink);resize:vertical}.editor:focus-visible{outline:3px solid var(--saffron-500);outline-offset:2px;border-color:var(--saffron-500)}.options{display:flex;flex-direction:column;gap:10px}.option{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;text-align:left;font-size:18px;font-weight:600;min-height:56px;padding:14px 16px;border-radius:var(--radius);background:var(--card);border:2px solid var(--line);color:var(--ink);box-shadow:var(--shadow)}.option:active{transform:translateY(2px);box-shadow:none}.option:focus-visible{outline:3px solid var(--saffron-500);outline-offset:2px}.option-selected{border-color:var(--saffron-600);background:var(--halo)}.option-correct{border-color:var(--good);background:var(--good-bg);color:var(--good)}.option-wrong{border-color:var(--retry);background:var(--retry-bg);color:var(--retry)}.feedback{border-radius:var(--radius);padding:14px 16px;font-weight:700;font-size:18px}.feedback-ok{background:var(--good-bg);color:var(--good)}.feedback-retry{background:var(--retry-bg);color:var(--retry)}.runner-footer{position:sticky;bottom:0;padding:14px 0 calc(8px + env(safe-area-inset-bottom));background:linear-gradient(var(--cream-0),var(--cream) 32%);display:flex;flex-direction:column;gap:10px}.win{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:32px 0}.win h2{font-size:30px;margin:4px 0 0}.win-reward{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:6px 0}.reward-card{min-width:120px;padding:16px 20px;border-radius:var(--radius);background:var(--card);border:2px solid var(--line);box-shadow:var(--shadow)}.reward-card .big{font-size:30px;font-weight:800;color:var(--saffron-800)}.reward-card .cap{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint)}.win-sub{color:var(--ink-soft);max-width:34ch;margin:0 auto}.win .actions{width:100%;max-width:360px;display:flex;flex-direction:column;gap:12px;margin-top:8px}.stats{padding:8px 0 24px}.stats h2{font-size:24px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.stat-cell{padding:16px;border-radius:var(--radius);background:var(--card);border:2px solid var(--line)}.stat-cell .num{font-size:26px;font-weight:800;color:var(--saffron-800)}.stat-cell .cap{font-size:14px;color:var(--ink-soft);font-weight:700}.stat-note{color:var(--ink-soft);font-size:15px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.playground{padding:8px 0 24px;display:flex;flex-direction:column;gap:14px}.pg-snippets{display:flex;flex-wrap:wrap;gap:8px}.pg-snippets .tile{font-size:15px}.pg-preview{min-height:200px}.pg-foot{margin-top:2px}.badge-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 16px}.badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:16px 12px;border-radius:var(--radius);background:var(--card);border:2px solid var(--line)}.badge.earned{border-color:var(--saffron-500);box-shadow:var(--shadow)}.badge:not(.earned){opacity:.55;filter:grayscale(1)}.badge-emoji{font-size:34px;line-height:1}.badge-title{font-weight:800;font-size:16px}.badge-desc{font-size:13px;color:var(--ink-soft)}.win-badges{width:100%;max-width:360px;display:flex;flex-direction:column;gap:8px;margin:6px 0}.win-badges-label{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--saffron-800);margin:0}.win-badge{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;border-radius:var(--radius);background:var(--halo);border:2px solid var(--saffron-500)}.win-badge-emoji{font-size:30px;line-height:1}.win-badge-desc{display:block;font-size:14px;color:var(--ink-soft)}