:root{--ink:#f6f3ee;--muted:#f6f3eeb3;--panel:#11131eb8;--panel-solid:#161825;--line:#ffffff1f;--accent:#fb923c;--accent-2:#e11d48;--radius:6px;--gutter:max(16px, env(safe-area-inset-left));--display:"JetBrains Mono", ui-monospace, Menlo, monospace;--green:#4ade80;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--ink);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{background:#e7a47c;height:100%;margin:0;overflow:hidden}body.no-webgl{background:var(--panel-solid)}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}#app{position:fixed;inset:0}#scene{touch-action:none;opacity:0;width:100%;height:100%;transition:opacity 1.2s;display:block}.ready #scene{opacity:1}.labels{pointer-events:none;opacity:0;transition:opacity .8s .4s;position:absolute;inset:0;overflow:hidden}.playing .labels{opacity:1}#ui{pointer-events:none;position:absolute;inset:0}#ui>*{pointer-events:auto}.world-label{pointer-events:auto;border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);font:600 13px/1 var(--display);letter-spacing:.02em;white-space:nowrap;background:#0e101ab3;border-radius:4px;align-items:center;gap:8px;padding:7px 13px 7px 9px;transition:border-color .2s,background .2s,opacity .3s;display:inline-flex}.world-label:hover,.world-label:focus-visible{border-color:var(--c);background:#0e101ae0;outline:none}.wl-dot{background:var(--c);width:10px;height:10px;box-shadow:0 0 0 0 var(--c);color:#0b0d14;border-radius:50%;place-items:center;font-size:9px;animation:1.8s ease-out infinite ping;display:grid}.world-label.done .wl-dot{width:15px;height:15px;animation:none}.world-label.done .wl-dot:after{content:"✓";font-weight:800}@keyframes ping{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--c) 70%, transparent)}to{box-shadow:0 0 0 9px #0000}}.intro{padding:24px var(--gutter);z-index:30;background:linear-gradient(100deg,#0c0d1699 0%,#0c0d1640 45%,#0c0d1600 75%);align-items:center;transition:opacity .7s,visibility .7s;display:flex;position:absolute;inset:0;overflow-y:auto}.playing .intro{opacity:0;visibility:hidden}.intro-inner{margin-block:auto;width:min(520px,100%);margin-left:clamp(0px,6vw,96px);animation:.9s cubic-bezier(.2,.8,.2,1) both rise}.term{border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);font:400 14px/1.6 var(--display);background:#0a0c12d1;border-radius:10px;overflow:hidden;box-shadow:0 30px 80px -20px #000000b3}.term-bar{border-bottom:1px solid var(--line);background:#ffffff0d;align-items:center;gap:7px;padding:10px 14px;display:flex}.term-bar i,.ed-dots i{background:#f87171;border-radius:50%;width:11px;height:11px}.term-bar i:nth-child(2),.ed-dots i:nth-child(2){background:#facc15}.term-bar i:nth-child(3),.ed-dots i:nth-child(3){background:var(--green)}.term-bar span{text-align:center;color:var(--muted);flex:1;margin-right:46px;font-size:12px}.term-body{padding:18px 20px 20px}.cmd{color:var(--muted);margin:14px 0 4px}.cmd:first-child{margin-top:0}.cmd:before{content:"$ ";color:var(--green)}.comment{color:#f6f3ee66}.intro h1{font:700 clamp(30px, 6vw, 44px) / 1.1 var(--display);letter-spacing:-.02em;color:var(--accent);margin:0}.out{color:var(--ink);margin:0}.out strong{color:#c4b5fd;font-weight:700}.term-links{flex-wrap:wrap;gap:4px 18px;display:flex}.term-links .link{color:#7dd3fc;text-underline-offset:3px;background:0 0;border:0;padding:0;font-size:14px;-webkit-text-decoration:underline #7dd3fc59;text-decoration:underline #7dd3fc59}.term-links .link:hover{background:0 0;text-decoration-color:currentColor}.term-links .link svg{width:14px;height:14px}.cursor{vertical-align:text-bottom;background:var(--ink);width:8px;height:1.1em;animation:1.1s step-end infinite blink;display:inline-block}.cmd.idle{margin-bottom:0}@keyframes blink{50%{opacity:0}}.intro-actions{flex-wrap:wrap;gap:10px;margin-top:8px;display:flex}.btn{font:700 14px/1 var(--display);border:1px solid #0000;border-radius:4px;align-items:center;gap:10px;padding:11px 16px;transition:transform .15s,box-shadow .2s,background .2s;display:inline-flex}.btn svg{width:18px;height:18px}.btn.primary{background:var(--green);color:#06210f;box-shadow:0 0 24px -6px #4ade80b3}.btn.primary:hover{transform:translateY(-1px);box-shadow:0 0 32px -4px #4ade80e6}.btn.primary:focus-visible{outline:2px solid var(--green);outline-offset:3px}.btn.ghost{border-color:var(--line);background:#ffffff0f}.btn.ghost:hover{background:#ffffff1f}.keys{color:var(--muted);margin:14px 0 0;font-size:12px;line-height:2}kbd{border:1px solid var(--line);min-width:22px;font:700 11px/1.4 var(--display);text-align:center;background:#ffffff0f;border-bottom-width:2px;border-radius:3px;margin-right:3px;padding:2px 6px;display:inline-block}@keyframes rise{0%{opacity:0;transform:translateY(24px)}}.hud{opacity:0;visibility:hidden;transition:opacity .6s .3s,visibility .6s}.playing .hud{opacity:1;visibility:visible}.hud-top{top:max(16px, env(safe-area-inset-top));left:var(--gutter);right:var(--gutter);pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.hud-top>*{pointer-events:auto}.brand{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);border-radius:6px;flex-direction:column;gap:4px;padding:10px 16px;display:flex}.brand-name{font:700 17px/1 var(--display)}.brand-sub{color:var(--muted);font-size:12px}.hud-actions{gap:8px;display:flex}.chip{border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(10px);font:600 13px/1 var(--display);white-space:nowrap;border-radius:4px;padding:10px 14px;transition:background .2s}.chip:hover{background:#1e2132e6}.progress{bottom:max(18px, env(safe-area-inset-bottom));background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);white-space:nowrap;border-radius:4px;align-items:center;gap:14px;padding:10px 16px;display:flex;position:absolute;left:50%;translate:-50%}.dots{gap:7px;display:flex}.dot{border:2px solid var(--c);background:0 0;border-radius:50%;width:14px;height:14px;padding:0;transition:background .3s,transform .2s}.dot:hover{transform:scale(1.25)}.dot.done{background:var(--c);box-shadow:0 0 10px var(--c)}.progress-text{font:600 13px/1 var(--display);color:var(--muted)}.hint{bottom:calc(max(18px, env(safe-area-inset-bottom)) + 58px);padding:0 var(--gutter);text-align:center;color:#fff;text-shadow:0 1px 6px #0009;margin:0;font-size:13px;position:absolute;left:0;right:0;pointer-events:none!important}.hint.gone{transition:opacity 1s;opacity:0!important}.hop{right:var(--gutter);bottom:calc(max(18px, env(safe-area-inset-bottom)) + 64px);border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(10px);width:64px;height:64px;font:700 14px/1 var(--display);border-radius:50%;position:absolute}.card{top:50%;right:var(--gutter);border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--c);-webkit-backdrop-filter:blur(14px);opacity:0;visibility:hidden;z-index:20;width:min(390px,100vw - 32px);max-height:calc(100vh - 180px);padding:24px 24px 22px;transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1),visibility .3s;position:absolute;overflow-y:auto;transform:translate(24px,-50%);box-shadow:0 30px 60px -20px #0009}.card.show{opacity:1;visibility:visible;transform:translateY(-50%)}.card-close{background:#ffffff12;border:0;border-radius:50%;place-items:center;width:34px;height:34px;display:grid;position:absolute;top:14px;right:14px}.card-close:hover{background:#ffffff26}.card-close svg{width:16px;height:16px}.tag{font:600 12px/1 var(--display);letter-spacing:.04em;color:var(--c);align-items:center;gap:8px;margin:0;display:flex}.tag-dot{background:var(--c);border-radius:50%;width:8px;height:8px}.tag-count{color:var(--muted);letter-spacing:.05em}.card h2{font:700 22px/1.2 var(--display);letter-spacing:-.01em;margin:12px 40px 0 0}.blurb{color:#f6f3eee0;margin:16px 0 0;font-size:15px;line-height:1.6}.card .blurb{animation:.5s cubic-bezier(.2,.8,.2,1) both rise}.links{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.link{border:1px solid var(--line);font-family:var(--display);background:#ffffff12;border-radius:4px;align-items:center;gap:8px;padding:9px 13px;font-size:14px;font-weight:500;text-decoration:none;transition:background .2s,border-color .2s;display:inline-flex}.link:hover{border-color:var(--c,var(--accent));background:#ffffff21}.link svg{flex:none;width:17px;height:17px}.next{border:1px solid color-mix(in srgb, var(--c) 50%, transparent);background:color-mix(in srgb, var(--c) 16%, transparent);width:100%;font:600 14px/1 var(--display);border-radius:12px;justify-content:space-between;align-items:center;margin-top:20px;padding:13px 16px;transition:background .2s;display:flex}.next:hover{background:color-mix(in srgb, var(--c) 28%, transparent)}.next svg{width:17px;height:17px}.toast{top:calc(max(16px, env(safe-area-inset-top)) + 70px);background:var(--panel-solid);border:1px solid var(--line);opacity:0;visibility:hidden;z-index:40;border-radius:14px;align-items:center;gap:12px;max-width:calc(100vw - 32px);padding:12px 14px 12px 18px;font-size:14px;transition:opacity .3s,translate .3s,visibility .3s;display:flex;position:absolute;left:50%;translate:-50% -12px;box-shadow:0 20px 40px -12px #00000080}.toast.show{opacity:1;visibility:visible;translate:-50%}.toast-btn{background:linear-gradient(135deg, var(--accent), var(--accent-2));font:600 13px/1 var(--display);border:0;border-radius:4px;flex:none;padding:8px 12px}.confetti{z-index:35;position:absolute;inset:0;overflow:hidden;pointer-events:none!important}.confetti i{border-radius:2px;width:9px;height:14px;animation:linear forwards fall;position:absolute;top:-20px}@keyframes fall{to{transform:translate(var(--drift), 110vh) rotate(var(--spin))}}@property --lh{syntax:"<length>";inherits:true;initial-value:0}.classic{font:400 15px/1.75 var(--display);font-variant-ligatures:none;--num:56px;--measure:760px;z-index:50;background:#0d0f16;flex-direction:column;display:flex;position:absolute;inset:0}.classic[hidden]{display:none}.ed-bar,.ed-status{padding:0 var(--gutter);white-space:nowrap;background:#12141d;flex:none;align-items:center;gap:14px;font-size:12px;display:flex}.ed-bar{padding-top:env(safe-area-inset-top);border-bottom:1px solid var(--line)}.ed-dots{gap:7px;display:flex}.ed-tab{border-top:2px solid var(--accent);border-inline:1px solid var(--line);background:#0d0f16;align-self:stretch;align-items:center;margin-bottom:-1px;padding:11px 16px;display:flex}.ed-quit{border:1px solid var(--line);font:700 12px/1 var(--display);background:#ffffff0a;border-radius:4px;margin-left:auto;padding:6px 10px}.ed-quit:hover{border-color:var(--green)}.ed-quit-sub{color:var(--muted);font-weight:400}.ed-quit[hidden]{display:none}.buffer{-webkit-overflow-scrolling:touch;padding:20px var(--gutter) 40px env(safe-area-inset-left);counter-reset:ln;flex:1;overflow-y:auto}.ln{max-width:calc(var(--measure) + var(--num));min-height:1lh;padding-left:var(--num);--lh:1lh;counter-increment:ln;color:#f6f3eedb;overflow-wrap:anywhere;margin:0 auto;position:relative}.ln:before{content:counter(ln);width:calc(var(--num) - 20px);height:var(--lh);color:#f6f3ee38;justify-content:flex-end;align-items:center;font-size:13px;font-weight:400;line-height:1;display:flex;position:absolute;top:0;left:0}.ln:hover:before{color:var(--muted)}.mk{color:#f6f3ee59}.k{color:#7dd3fc}.str{color:#fcd34d}.cm{color:#f6f3ee59;font-style:italic}.cm:before{font-style:normal}.url{color:#f6f3ee73}.buffer a{color:#86efac;text-underline-offset:3px;-webkit-text-decoration:underline #86efac59;text-decoration:underline #86efac59}.buffer a:hover{text-decoration-color:currentColor}.md-h1{font:700 clamp(26px, 5vw, 36px) / 1.3 var(--display);letter-spacing:-.02em;color:var(--accent)}.md-h2{font:700 19px/1.75 var(--display);color:var(--c)}.md-h2 .mk{color:color-mix(in srgb, var(--c) 45%, transparent)}.classic .cursor{background:var(--green);height:1.2em}.tildes{max-width:calc(var(--measure) + var(--num));padding-left:calc(var(--num) - 34px);color:#60a5fa;opacity:.5;margin:0 auto}.ed-status{padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--line);color:var(--muted)}.ed-status .mode{margin-left:calc(-1 * var(--gutter));padding:5px 12px 5px var(--gutter);background:var(--green);color:#06210f;align-self:stretch;align-items:center;font-weight:700;display:flex}.ed-status-r{margin-left:auto}@media (width<=640px){.intro{padding-bottom:max(32px, env(safe-area-inset-bottom));background:linear-gradient(#0c0d1600 30%,#0c0d1699 100%);align-items:flex-end}.intro-inner{margin-bottom:0;margin-left:0}.term{font-size:13px}.term-body{padding:14px 16px 16px}.brand{padding:8px 12px}.brand-sub{display:none}.chip{padding:9px 11px;font-size:12px}.progress{gap:10px;padding:9px 13px}.dots{gap:5px}.dot{width:12px;height:12px}.card{width:auto;max-height:62vh;padding:20px var(--gutter) max(20px, env(safe-area-inset-bottom));background:#11131ee6;border-radius:10px 10px 0 0;inset:auto 0 0;transform:translateY(40px)}.card.show{transform:translateY(0)}.card-open .progress,.card-open .hop,.card-open .hint{opacity:0;visibility:hidden;transition-delay:0s}.card h2{font-size:22px}.classic{--num:38px;font-size:13.5px}.ln:before{width:calc(var(--num) - 14px);font-size:11px}.ed-dots,.ed-quit-sub,.ed-status-r{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}