:root{color-scheme:dark;--ink: #221b3a;--panel: #2e2650;--panel2: #3a3163;--line: #4a4180;--deep: #191430;--console: #0f0c20;--locked: #28214a;--cream: #fff6e9;--text-strong: #efe8fd;--dim: #d3c9f2;--locked-text: #9a8fc4;--sunny: #ffc94d;--sunny-shadow: #c99527;--coral: #ff7a6e;--mint: #5de1a5;--mint-shadow: #35a972;--sky: #6ec1ff;--grape: #c58bff;--font-ui: "Fredoka", system-ui, sans-serif;--font-code: "JetBrains Mono", ui-monospace, monospace;--r: 18px;--r-sm: 12px;--r-md: 14px;--space-1: 6px;--space-2: 10px;--space-3: 14px;--space-4: 18px;--space-5: 22px;--duration-fast: .12s;--duration-normal: .3s;--ease-pop: cubic-bezier(.2, .9, .3, 1.2)}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--ink)}html,body{min-height:100%}body{background:var(--ink)!important;color:var(--cream);font-family:var(--font-ui);font-size:17px;line-height:1.5}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--ink) radial-gradient(circle at 15% 10%,var(--panel) 0%,var(--ink) 45%)}button{font-family:inherit;font-size:1rem;cursor:pointer;border:none;border-radius:var(--r-md)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--sunny);outline-offset:2px}textarea,input{font-family:var(--font-code)}.top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 16px;position:sticky;top:0;z-index:20;background:#221b3af0;backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}.logo{font-weight:700;font-size:1.25rem;letter-spacing:.5px;color:var(--cream);text-decoration:none;display:inline-block;padding:4px 8px;border-radius:var(--r-sm);transition:background var(--duration-fast)}.logo:hover{background:var(--panel2)}.logo span{color:var(--sunny)}.logo span[aria-hidden]{color:var(--dim);margin-right:6px}.logo:hover span[aria-hidden]{color:var(--cream)}.tab{background:transparent;color:var(--dim);padding:7px 12px;font-weight:600}.tab.on{background:var(--panel2);color:var(--cream)}.spacer{flex:1}.icobtn{background:var(--panel2);color:var(--cream);width:38px;height:38px;border-radius:50%;font-size:1.05rem}.icobtn.off{background:var(--locked);color:var(--locked-text)}.icobtn.armed{width:auto;padding:0 14px;border-radius:99px;background:var(--bad, #f9476a);color:#fff;font-size:.82rem;font-weight:700}.chip{display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:99px;padding:4px 12px 4px 6px;cursor:pointer;color:var(--cream)}.chip .av{font-size:1.3rem}.chip small{color:var(--dim);display:block;line-height:1.1;font-size:.7rem}.chip b{font-size:.85rem;line-height:1.1}.xpwrap{display:block;width:74px;height:7px;background:var(--ink);border-radius:99px;overflow:hidden;margin-top:2px}.xpbar{display:block;height:100%;background:linear-gradient(90deg,var(--sunny),var(--coral));transition:width .8s var(--ease-pop)}.wrap{max-width:880px;margin:0 auto;padding:var(--space-5) 16px 90px}.hero{margin:6px 0 20px}.hero h1{font-size:clamp(1.6rem,5vw,2.3rem);font-weight:700;line-height:1.15}.hero h1 em{font-style:normal;color:var(--sunny)}.hero p{color:#e4dbf8;margin-top:6px;max-width:52ch}.card{background:var(--panel);border:2px solid var(--line);border-radius:var(--r);padding:var(--space-4);margin-bottom:16px;animation:pop var(--duration-normal) ease-out}@keyframes pop{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}.card h2{font-size:1.3rem;margin-bottom:6px}.card .lead{color:var(--text-strong);font-weight:500;margin-bottom:var(--space-3)}.sect{font-weight:700;margin:22px 0 10px;color:var(--sunny);text-transform:uppercase;letter-spacing:.12em;font-size:.85rem}.path{display:flex;flex-direction:column;gap:12px}.lvl{display:flex;align-items:center;gap:var(--space-3);text-align:left;width:100%;background:var(--panel);border:2px solid var(--line);border-radius:var(--r);padding:13px 15px;color:var(--cream);transition:transform var(--duration-fast),border-color var(--duration-fast)}.lvl:not(.lock):hover{transform:translate(6px);border-color:var(--sunny)}.lvl.lock{cursor:not-allowed;background:var(--locked);border-color:var(--panel2)}.lvl.lock .meta b,.lvl.lock .meta small{color:var(--locked-text)}.lvl.lock .bub{background:var(--locked);color:var(--locked-text)}.lvl .bub{flex:0 0 50px;height:50px;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;background:var(--panel2);border:2px solid var(--line)}.lvl.done .bub{background:var(--mint);border-color:var(--mint)}.lvl .meta{min-width:0}.lvl .meta small{color:var(--dim);display:block;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lvl .meta b{font-size:1.05rem}.lvl .tag{margin-left:auto;font-size:.78rem;font-weight:600;color:var(--ink);background:var(--sunny);padding:3px 10px;border-radius:99px;white-space:nowrap}.lvl.done .tag{background:var(--mint)}.lvl.lock .tag{background:var(--line);color:var(--dim)}.starrow{color:var(--sunny);letter-spacing:2px;font-size:.9rem}.starrow .off{color:var(--locked-text)}.crumb{background:transparent;color:var(--dim);font-weight:600;margin-bottom:10px;padding:6px 2px}.crumb:hover{color:var(--cream)}.stepper{display:flex;gap:8px;margin:12px 0 var(--space-4);flex-wrap:wrap}.step{padding:6px 13px;border-radius:99px;font-weight:600;font-size:.86rem;background:var(--panel);color:var(--dim);border:2px solid var(--line)}.step.now{color:var(--ink);border-color:transparent;animation:pop var(--duration-normal)}.step.done{color:var(--cream)}.step.done:after{content:" ✓"}.s-predict.now{background:var(--sky)}.s-run.now{background:var(--mint)}.s-investigate.now{background:var(--sunny)}.s-modify.now{background:var(--grape)}.s-make.now{background:var(--coral)}.code{background:var(--deep);border-radius:var(--r-sm);padding:12px 14px;overflow-x:auto;font-family:var(--font-code);font-size:.95rem;line-height:1.7;border:1px solid var(--line)}.code .ln{display:block;white-space:pre;border-radius:8px;padding:1px 8px;margin:0 -8px;width:100%;text-align:left;background:transparent;color:inherit;font:inherit}.code button.ln{cursor:pointer}.code button.ln:hover{background:var(--panel2)}.code .ln.yes{background:#5de1a540}.code .ln.no{background:#ff7a6e40}.opts{display:grid;gap:10px;margin-top:var(--space-3)}.opt{background:var(--panel2);color:var(--cream);border:2px solid var(--line);border-radius:var(--r-md);padding:12px 14px;text-align:left;font-family:var(--font-code);font-size:.9rem;white-space:pre-wrap;transition:transform .1s}.opt:hover:not(:disabled){border-color:var(--sky);transform:translate(4px)}.opt.yes{border-color:var(--mint);background:#5de1a526}.opt.no{border-color:var(--coral);background:#ff7a6e1f}.big{background:var(--sunny);color:var(--ink);font-weight:700;font-size:1.02rem;padding:12px 20px;border-radius:var(--r-md);box-shadow:0 4px 0 var(--sunny-shadow);transition:transform .08s}.big:active{transform:translateY(3px);box-shadow:0 1px 0 var(--sunny-shadow)}.big.mint{background:var(--mint);box-shadow:0 4px 0 var(--mint-shadow)}.big.mint:active{box-shadow:0 1px 0 var(--mint-shadow)}.ghost{background:var(--panel2);color:var(--cream);font-weight:600;padding:11px 16px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:var(--space-3)}.fb{margin-top:var(--space-3);padding:12px 14px;border-radius:var(--r-sm);font-weight:600;animation:pop .25s}.fb.good{background:#5de1a526;border:2px solid var(--mint)}.fb.bad{background:#ffc94d1f;border:2px solid var(--sunny)}.fb.err{background:#ff7a6e1f;border:2px solid var(--coral);font-family:var(--font-code);font-weight:400;font-size:.88rem;white-space:pre-wrap}.editor{width:100%;min-height:150px;background:var(--deep);color:var(--cream);border:2px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-size:.95rem;line-height:1.6;resize:vertical}.editor:focus{outline:none;border-color:var(--sky)}label.small{display:block;color:var(--dim);font-weight:600;font-size:.85rem;margin:12px 0 4px}.inputsbox{width:100%;min-height:42px;background:var(--deep);color:var(--cream);border:2px dashed var(--line);border-radius:var(--r-sm);padding:8px 12px;font-size:.9rem;resize:vertical}.out{background:var(--console);border-radius:var(--r-sm);border:1px solid var(--line);font-family:var(--font-code);font-size:.92rem;line-height:1.6;padding:12px 14px;margin-top:12px;min-height:52px;white-space:pre-wrap;color:#d9fbe9}.out:empty:before{content:"▸ your program's output shows up here";color:#7d75b8}.gl3d{width:100%;aspect-ratio:16 / 9;border-radius:var(--r-md);border:2px solid var(--line);overflow:hidden;background:#171230}.gl3d canvas{width:100%!important;height:100%!important;display:block}.bigstars{font-size:2rem;letter-spacing:6px;text-align:center;margin:8px 0;min-height:2.4rem}.bigstars .pop{display:inline-block;animation:starpop .5s ease-out}.bigstars .dark{color:var(--locked-text)}@keyframes starpop{0%{transform:scale(0) rotate(-90deg)}70%{transform:scale(1.4)}to{transform:scale(1)}}.timerbar{height:9px;background:var(--ink);border-radius:99px;overflow:hidden;margin:10px 0}.timerbar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),var(--sunny),var(--coral));transition:width .2s linear}.scorebig{font-size:2.6rem;font-weight:700;text-align:center;color:var(--sunny)}.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.badge{background:var(--panel);border:2px solid var(--line);border-radius:var(--r);padding:16px 10px;text-align:center;animation:pop var(--duration-normal)}.badge .ico{font-size:2.2rem}.badge b{display:block;margin-top:6px;font-size:.92rem}.badge small{color:var(--dim);font-size:.78rem}.badge.off{background:var(--locked);border-color:var(--panel2)}.badge.off .ico{filter:grayscale(1)}.badge.off b,.badge.off small{color:var(--locked-text)}.lbrow{display:flex;align-items:center;gap:12px;background:var(--panel);border:2px solid var(--line);border-radius:var(--r-md);padding:10px 14px;margin-bottom:8px;animation:pop var(--duration-normal)}.lbrow.me{border-color:var(--sunny);background:#ffc94d14}.lbrow .pos{width:34px;text-align:center;font-weight:700;font-size:1.1rem}.lbrow .av{font-size:1.5rem}.lbrow .who{flex:1;min-width:0}.lbrow .who small{display:block;color:var(--dim);font-size:.75rem}.lbrow .pts{font-weight:700;color:var(--sunny)}.avgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:10px 0}.avpick{font-size:1.7rem;background:var(--panel2);border:2px solid var(--line);border-radius:var(--r-sm);padding:8px 0}.avpick.on{border-color:var(--sunny);background:#ffc94d26}.namein{width:100%;background:var(--deep);color:var(--cream);border:2px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-size:1.05rem}.playerbtn{display:flex;align-items:center;gap:10px;background:var(--panel2);color:var(--cream);border:2px solid var(--line);border-radius:var(--r-md);padding:10px 14px;font-weight:600;width:100%}.playerbtn:hover{border-color:var(--sunny)}.note{color:var(--dim);font-size:.85rem;margin-top:10px}#toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%) translateY(90px);background:var(--sunny);color:var(--ink);font-weight:700;padding:13px 22px;border-radius:99px;transition:transform .25s;z-index:60;box-shadow:0 6px 24px #0006;max-width:90vw;text-align:center}#toast.show{transform:translate(-50%) translateY(0)}.confetti{position:fixed;top:-40px;font-size:1.6rem;z-index:55;animation:fall linear forwards;pointer-events:none}@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}#loader{position:fixed;inset:0;background:#191430f0;z-index:70;display:grid;place-items:center;text-align:center}#loader .snake{font-size:3rem;display:inline-block;animation:wig 1s infinite}@keyframes wig{0%,to{transform:rotate(-12deg)}50%{transform:rotate(12deg)}}.hints{margin-top:var(--space-3);display:flex;flex-direction:column;gap:8px;align-items:flex-start}.hintbtn{font-size:.9rem;padding:8px 14px}.hint{width:100%;display:flex;gap:10px;align-items:baseline;background:var(--panel2);border-left:4px solid var(--sky);border-radius:var(--r-sm);padding:10px 14px;animation:pop .25s}.hint b{color:var(--sky);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}.hint.rung-2{border-left-color:var(--sunny)}.hint.rung-2 b{color:var(--sunny)}.hint.rung-3{border-left-color:var(--coral)}.hint.rung-3 b{color:var(--coral)}.hint.rung-3 span{font-family:var(--font-code);font-size:.9rem}.readaloud{background:var(--panel2);color:var(--cream);border:1px solid var(--line);border-radius:99px;padding:2px 10px;font-size:.95rem;margin-left:8px;vertical-align:middle}.readaloud[aria-pressed=true]{background:var(--sunny);color:var(--ink)}.canvasbox{width:100%;aspect-ratio:4 / 3;max-height:460px;background:var(--deep);border:2px solid var(--line);border-radius:var(--r-md);display:grid;place-items:center;overflow:hidden}.canvasbox canvas{max-width:100%;max-height:100%}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.frame{background:var(--panel);border:2px solid var(--line);border-radius:var(--r-md);padding:8px;text-align:center}.frame img{width:100%;border-radius:8px;background:var(--deep);display:block}.frame b{display:block;font-size:.85rem;margin:6px 0 4px}.frame button{background:transparent;color:var(--dim);font-size:.78rem;padding:2px 6px}.frame button:hover{color:var(--coral)}.streakwrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.streakbig{font-size:2.2rem;font-weight:700;color:var(--sunny);line-height:1}.calendar{display:grid;grid-template-columns:repeat(14,1fr);gap:4px;flex:1;min-width:220px}.calendar span{aspect-ratio:1;border-radius:4px;background:var(--locked);border:1px solid var(--panel2)}.calendar span.on{background:var(--mint);border-color:var(--mint)}.calendar span.today{outline:2px solid var(--sunny)}.steps{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}.steps span{flex:1;min-width:40px;height:8px;border-radius:99px;background:var(--locked)}.steps span.on{background:var(--mint)}.steps span.now{background:var(--sunny)}.codein{font-family:var(--font-code);letter-spacing:4px;text-transform:uppercase;font-size:1.25rem}.codebig{font-family:var(--font-code);font-size:1.05rem;letter-spacing:2px;font-weight:600;color:var(--sunny);background:var(--deep);border:1px solid var(--line);border-radius:8px;padding:2px 8px}tr.stuckrow td{background:#ff7a6e29}.matrixwrap{overflow-x:auto;border:2px solid var(--line);border-radius:var(--r-md);background:var(--panel)}table.matrix{border-collapse:collapse;font-size:.82rem;min-width:100%}table.matrix th,table.matrix td{padding:6px 8px;text-align:center;white-space:nowrap;border-bottom:1px solid var(--panel2)}table.matrix th{position:sticky;top:0;background:var(--panel2);color:var(--dim);font-weight:600}table.matrix td.kid,table.matrix th.kid{text-align:left;position:sticky;left:0;background:var(--panel);z-index:1}table.matrix th.kid{background:var(--panel2);z-index:2}td.cell-done{background:#5de1a538}td.cell-started{background:#ffc94d2e}td.cell-stuck{background:#ff7a6e47;font-weight:700}.stuckcard{border-left:4px solid var(--coral)}.projector{font-size:clamp(1.2rem,3.4vw,2rem)}.projector .code{font-size:clamp(1rem,2.6vw,1.6rem)}.projector .opt{font-size:clamp(.95rem,2.2vw,1.3rem)}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 600px){.wrap{padding:16px 12px 90px}.lvl .tag{display:none}.tab{padding:6px 9px;font-size:.9rem}.chip b{max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}