:root{--bg:#0b0620;--panel:#140c33;--panel2:#1b1240;--cyan:#39f3ff;--pink:#ff3ea5;--yellow:#ffe14d;--green:#7dff9a;--red:#ff8a8a;--text:#e8e6ff;--muted:#a9a3d6;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,sans-serif}code{background:#1d1446;border-radius:4px;padding:0 4px;font-family:ui-monospace,Consolas,monospace;font-weight:400}button{color:var(--cyan);border:2px solid var(--cyan);font:inherit;cursor:pointer;box-shadow:0 0 6px var(--cyan);background:0 0;border-radius:8px;padding:8px 16px}button:hover:not(:disabled){background:#39f3ff1f}button:disabled{opacity:.4;cursor:default;box-shadow:none}button.primary{color:var(--yellow);border-color:var(--yellow);box-shadow:0 0 8px var(--yellow);font-weight:700}.screen{grid-template:"top top""talk machine""work machine"minmax(0,1fr)"actions machine"/minmax(0,55fr) minmax(0,45fr);gap:12px 26px;height:100vh;padding:10px 22px 16px;display:grid}.top{grid-area:top;align-items:center;gap:20px;min-height:36px;display:flex}.brand{letter-spacing:3px;color:var(--pink);text-shadow:0 0 8px var(--pink);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:18px;font-weight:900;overflow:hidden}.brand span{color:var(--muted);letter-spacing:1px;text-shadow:none;font-weight:500}.lights{flex:none;gap:6px;display:flex}.light{border:2px solid #4a4370;border-radius:50%;width:12px;height:12px}.light.done{background:var(--green);border-color:var(--green);box-shadow:0 0 8px var(--green)}.light.now{background:var(--yellow);border-color:var(--yellow);box-shadow:0 0 10px var(--yellow);animation:1.2s ease-in-out infinite pulse}.top .total{color:var(--yellow);flex:none;margin-left:auto;font-weight:700}.talk{grid-area:talk;align-items:flex-start;gap:14px;display:flex;position:relative}.talk>.bit-face{flex:none}.talk .bubble{flex:1;min-width:0}.ticket{display:none}.bubble{background:var(--panel2);border:2px solid var(--pink);box-shadow:0 0 10px var(--pink);border-radius:14px;padding:12px 16px;font-size:clamp(15px,.55vw + 8px,20px);line-height:1.5}.bubble p{margin:4px 0}.bubble code{white-space:nowrap}.mission{border:2px solid var(--yellow);color:var(--yellow);background:#ffe14d14;border-radius:10px;margin-top:8px;padding:8px 12px;font-weight:600}.mission small{color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:11px;font-weight:500;display:block}.answer{margin-top:8px;animation:.3s ease-out both fade-up}.hint,.almost{color:var(--yellow)}.almost{border-left:3px solid var(--yellow);padding-left:8px}.error{color:var(--red)}.success{color:var(--green);font-weight:600}.stars{gap:6px;margin:4px 0 0;font-size:28px;display:flex}.star{filter:grayscale()brightness(.8);opacity:.3;animation:.4s ease-out both star-slot;display:inline-block}.star.earned{filter:none;opacity:1;animation:.7s cubic-bezier(.3,1.8,.5,1) both star-pop,1.2s ease-out both star-shine}.bit-face .head{fill:#2a1d5e;stroke:var(--cyan);stroke-width:3px}.bit-face .eye{fill:var(--cyan);transform-box:fill-box;transform-origin:50%;animation:4.5s infinite blink-eye}.bit-face .feature{fill:none;stroke:var(--cyan);stroke-width:3px;stroke-linecap:round}.bit-face .antenna{stroke:var(--cyan);stroke-width:3px}.bit-face .bulb{fill:var(--pink);filter:drop-shadow(0 0 4px var(--pink));animation:1.4s ease-in-out infinite pulse}.bit-face{filter:drop-shadow(0 0 8px #39f3ff80)}.bit-face.jump{animation:.8s ease-out bit-jump}.say{cursor:pointer;display:grid}.say>.sizer,.say>.typed{grid-area:1/1}.say>.sizer{visibility:hidden;display:grid}.say>.sizer>span{grid-area:1/1}.caret{color:var(--pink);margin-left:1px;animation:.8s step-end infinite blink}.caret.hidden{visibility:hidden}.pager{align-items:center;gap:6px;margin-top:2px;display:flex}.pager .dot{border:1px solid var(--muted);width:9px;height:9px;box-shadow:none;background:0 0;border-radius:50%;padding:0}.pager .dot.on{background:var(--pink);border-color:var(--pink);box-shadow:0 0 6px var(--pink)}.pager .replay{box-shadow:none;color:var(--muted);background:0 0;border:none;margin-left:auto;padding:0 2px;font-size:20px;line-height:1}.pager .replay:hover{color:var(--cyan);text-shadow:0 0 6px var(--cyan);background:0 0}.work{flex-direction:column;grid-area:work;min-height:0;display:flex;position:relative}.code-pane{border:2px solid #3a3358;border-radius:10px;min-height:0;max-height:100%;display:flex;overflow:hidden}.code-pane .cm-editor{flex:1;max-height:100%;font-size:clamp(14px,.5vw + 8px,19px)}.code-pane.blocked .cm-zone{animation:.7s ease-out zone-flash}.code-pane .cm-zone{box-shadow:inset 4px 0 0 var(--yellow);background:#ffe14d38}.code-pane .cm-error-line{-webkit-text-decoration:underline wavy var(--red);text-decoration:underline wavy var(--red);background:#ff505040}.code-pane .cm-param-hint{color:#8f88bd;margin-right:2px;font-size:.8em;font-style:italic}.code-pane .cm-ghost{color:#8f88bd;opacity:.85;pointer-events:none;font-style:italic}.code-pane .cm-lesson-fold{color:var(--muted);cursor:pointer;background:#1d1446;border-radius:4px;padding:0 8px}.actions{flex-wrap:wrap;grid-area:actions;align-items:center;gap:12px;display:flex}.actions .run,.actions .next{padding:10px 28px;font-size:20px;font-weight:700}.actions .run{box-shadow:0 0 12px var(--cyan)}.actions .run.secondary{box-shadow:none;color:var(--muted);border-color:#3a3358;padding:8px 14px;font-size:15px;font-weight:500}.actions .next{animation:.6s cubic-bezier(.3,1.6,.5,1) both next-in,1.6s ease-in-out .6s infinite next-glow}.actions .next.wait{animation-delay:3s,3.6s}.actions .hint-btn{box-shadow:none;color:var(--text);border-color:#3a3358}.actions .reset{box-shadow:none;color:var(--muted);border:none;padding:4px 8px;font-size:22px}.actions .reset.armed{color:var(--red);border:2px solid var(--red);box-shadow:0 0 8px var(--red);font-size:15px}.actions .done{color:var(--green);font-weight:700}@media (height>=1000px){.screen{grid-template-rows:auto auto minmax(0,max-content) auto 1fr;grid-template-areas:"top top""talk machine""work machine""actions machine"".machine"}}.keys-toggle{box-shadow:none;padding:8px 10px;font-size:20px;line-height:1;display:none}.keys-toggle.on{box-shadow:0 0 10px var(--cyan);background:#39f3ff2e}@media (pointer:coarse){.keys-toggle{display:inline-block}}.symbols{z-index:20;background:var(--panel2);border:2px solid var(--cyan);box-shadow:0 0 14px var(--cyan);border-radius:10px;grid-template-columns:repeat(6,1fr);gap:6px;padding:8px;display:grid;position:absolute;bottom:6px;right:6px}.symbols button{min-width:38px;box-shadow:none;padding:6px 0;font:600 16px ui-monospace,Consolas,monospace}.machine-area{grid-area:machine;align-self:start;min-height:0}.cabinet{border:3px solid var(--pink);box-shadow:0 0 18px var(--pink);background:linear-gradient(#1b1240,#120b2c);border-radius:18px 18px 8px 8px;flex-direction:column;gap:10px;padding:12px 14px 14px;display:flex}.marquee{text-align:center;white-space:nowrap;letter-spacing:10px;color:var(--yellow);text-shadow:0 0 10px var(--yellow), 0 0 22px var(--pink);font-size:26px;font-weight:900}.machine{background:#000;border:3px solid #2a2056;border-radius:8px;position:relative;overflow:hidden}.machine:after{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#ffffff0a 0 2px,#0000 2px 4px);position:absolute;inset:0}.machine.power{animation:.9s ease-out crt-on}.machine canvas{background:#000;outline:none;width:100%;height:auto;display:block}.machine canvas:focus-visible{box-shadow:inset 0 0 0 2px var(--yellow)}.coords{z-index:2;color:var(--yellow);pointer-events:none;background:#000000b3;border-radius:4px;padding:2px 8px;font-family:ui-monospace,monospace;position:absolute;bottom:8px;right:8px}.tv-static,.intro .noise{z-index:1;filter:contrast(2.2)brightness(1.25);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:260px;animation:.28s steps(4,end) infinite snow;position:absolute;inset:0}.tv-static:after,.intro .noise:after{content:"";background:linear-gradient(#0000,#ffffff2e,#0000);height:30%;animation:2.2s linear infinite roll;position:absolute;left:0;right:0}.machine-row{align-items:center;gap:10px;display:flex}.machine-row .vars{flex:1;min-width:0}.slow-btn{border-color:var(--cyan);box-shadow:none;white-space:nowrap;flex:none;padding:6px 12px;font-size:20px;line-height:1}.slow-btn .slow-label{font-size:15px;font-weight:700}.slow-btn.on,.slow-btn.on:hover:not(:disabled){border-color:var(--green);color:var(--bg);background:var(--green);box-shadow:0 0 14px var(--green)}.play-hint{z-index:3;white-space:nowrap;background:#000000bf;font-size:clamp(12px,1.2vw,16px);position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.pad{display:none}@media (pointer:coarse){.play-hint{display:none}.pad{z-index:3;pointer-events:none;display:block;position:absolute;inset:0}.pad-key{pointer-events:auto;opacity:.5;width:52px;height:52px;box-shadow:none;touch-action:none;-webkit-user-select:none;user-select:none;background:0 0;border-radius:50%;padding:0;font:900 18px ui-monospace,monospace;position:absolute}.pad-key:active{opacity:1;background:#39f3ff59}.pad-key_w{top:8px;left:12%}.pad-key_s{bottom:8px;left:12%}.pad-key_up{top:8px;right:12%}.pad-key_down{bottom:8px;right:12%}.pad-key_space{border-radius:26px;width:auto;padding:0 14px;font-size:13px;bottom:8px;left:50%;transform:translate(-50%)}}.ball-lost{z-index:3;max-width:90%;color:var(--yellow);border-color:var(--yellow);box-shadow:0 0 10px var(--yellow);background:#000000bf;font-size:clamp(12px,1.3vw,18px);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.frame-no{z-index:2;color:var(--green);pointer-events:none;background:#000000b3;border-radius:4px;padding:2px 8px;font:700 14px ui-monospace,monospace;position:absolute;top:8px;left:8px}.vars{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.vars h3{color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin:0;font-size:12px;font-weight:500}.boxes{flex-wrap:wrap;gap:8px;display:flex}.box{border:2px solid var(--cyan);box-shadow:0 0 6px var(--cyan);border-radius:8px;align-items:baseline;gap:8px;padding:2px 10px;transition:border-color .2s,box-shadow .2s;display:flex}.box.flash{border-color:var(--yellow);box-shadow:0 0 16px var(--yellow)}.box .name{color:var(--text);font-family:ui-monospace,monospace;font-size:13px}.box .value{color:var(--yellow);font-family:ui-monospace,monospace;font-size:18px;font-weight:700}.box .type{color:var(--muted);font-size:11px}.explain{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.explain svg{width:100%;height:100%;max-height:100%}.grid-card .grid{stroke:#2a2056;stroke-width:1px}.grid-card .frame{fill:none;stroke:var(--cyan);stroke-width:2px}.grid-card .axis{stroke:var(--yellow);stroke-width:3px}.grid-card .arrowhead{fill:var(--yellow)}.grid-card .axis-label{fill:var(--yellow);font-size:28px;font-weight:700}.grid-card .origin{fill:var(--muted);font-size:18px}.grid-card .grid-guide{stroke:var(--pink);stroke-dasharray:6 6}.grid-card .point{animation:.2s ease-out both point-in}.grid-card .dot{fill:var(--pink)}.grid-card .coord{fill:var(--text);font-family:ui-monospace,monospace;font-size:26px}.box-card .var-box{fill:#1d1446;stroke:var(--cyan);stroke-width:4px}.box-card .lid{fill:#2a1d5e;stroke:var(--cyan);stroke-width:3px}.box-card .box-name{fill:var(--muted);text-anchor:middle;font-family:ui-monospace,monospace;font-size:26px}.box-card .box-value{fill:var(--yellow);text-anchor:middle;transform-box:fill-box;transform-origin:50%;font-family:ui-monospace,monospace;font-size:64px;animation:.4s pop}.box-card .link{stroke:var(--pink);stroke-dasharray:8 8;transition:all .6s}.box-card .paddle{fill:#fff;transition:y .6s}.box-card .paddle-label{fill:var(--text);font-family:ui-monospace,monospace;font-size:22px;transition:y .6s}.frames-card .var-box{fill:#1d1446;stroke:var(--cyan);stroke-width:4px}.frames-card .lid{fill:#2a1d5e;stroke:var(--cyan);stroke-width:3px}.frames-card .box-name{fill:var(--muted);text-anchor:middle;font-family:ui-monospace,monospace;font-size:24px}.frames-card .box-value{fill:var(--yellow);text-anchor:middle;transform-box:fill-box;transform-origin:50%;font-family:ui-monospace,monospace;font-size:58px;animation:.4s pop}.frames-card .film-frame{fill:#000;stroke:#3a3358;stroke-width:3px}.frames-card .film.now .film-frame{stroke:var(--pink);filter:drop-shadow(0 0 6px var(--pink))}.frames-card .film-ball{fill:#fdf900}.frames-card .film-label{fill:var(--muted);text-anchor:middle;font-family:ui-monospace,monospace;font-size:18px}.frames-card .film.now .film-label{fill:var(--pink)}.frames-card .frames-code{fill:var(--text);font-family:ui-monospace,monospace;font-size:30px}.frames-card .beat{fill:#5a5380;font-family:ui-monospace,monospace;font-size:22px;transition:fill .2s}.frames-card .beat.on{fill:var(--yellow)}.top .home{box-shadow:none;border-color:#3a3358;flex:none;padding:4px 8px;font-size:18px;line-height:1}.actions .to-hall{box-shadow:none;color:var(--text);border-color:#3a3358}.hall{box-sizing:border-box;flex-direction:column;align-items:center;gap:10px;min-height:100vh;padding:10px 28px 14px;display:flex}.hall-sign{letter-spacing:8px;color:var(--pink);text-shadow:0 0 10px var(--pink), 0 0 26px var(--pink);margin:0;font-size:clamp(26px,3.4vw,46px);font-weight:900}.hall-floor{justify-content:center;align-items:flex-start;gap:clamp(16px,3vw,40px);width:100%;max-width:1200px;display:flex}.hall-pong{flex:0 560px;min-width:0}.hall-pong.fixed{border-color:var(--green);box-shadow:0 0 22px var(--green), 0 0 40px var(--yellow)}.lesson-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.lesson-item{text-align:left;width:100%;min-height:44px;box-shadow:none;color:var(--text);border-color:#3a3358;align-items:center;gap:12px;padding:5px 12px;display:flex}.lesson-item .lesson-no{border:2px solid;border-radius:50%;flex:none;place-items:center;width:30px;height:30px;font-weight:900;display:grid}.lesson-item .lesson-title{flex:1;min-width:0;font-weight:600}.lesson-item .lesson-state{color:var(--yellow);white-space:nowrap;flex:none;font-weight:700}.lesson-item.done{border-color:var(--green)}.lesson-item.done .lesson-no{color:var(--green)}.lesson-item.open{border-color:var(--cyan);box-shadow:0 0 10px var(--cyan)}.lesson-item.open .lesson-no{color:var(--cyan)}.lesson-item.soon{opacity:.4}.lesson-item.soon .lesson-state{color:var(--muted);font-style:italic;font-weight:500}.lesson-item.locked{color:var(--muted)}.lesson-item.locked .lock{filter:drop-shadow(0 0 4px var(--yellow));font-size:18px}.lesson-item.target .lesson-no{animation:1.2s ease-in-out infinite pulse;box-shadow:0 0 10px}.lesson-item.shake{animation:.45s ease-in-out shake}.lesson-item .done-badge{background:var(--green);width:20px;height:20px;color:var(--bg);border-radius:50%;place-items:center;margin-left:6px;font-size:13px;display:inline-grid}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.hall-others{flex-direction:column;flex:none;gap:14px;display:flex}.mini-cab{background:linear-gradient(#1b1240,#120b2c);border:2px solid #4a4370;border-radius:12px 12px 4px 4px;width:clamp(110px,12vw,160px);padding:6px}.mini-roof{text-align:center;letter-spacing:3px;color:var(--muted);font-size:13px;font-weight:900}.mini-screen{aspect-ratio:16/10;background:#000;border-radius:4px;margin-top:6px;position:relative;overflow:hidden}.mini-soon{text-align:center;color:var(--muted);margin-top:4px;font-size:12px}.hall-bit{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;display:flex}.hall-say{margin:0}.hall-continue{padding:10px 26px;font-size:20px}.hall-reset{box-shadow:none;color:var(--muted);border:none;font-size:13px;text-decoration:underline}.hall-reset.armed{color:var(--red);border:2px solid var(--red);text-decoration:none}@media (height<=560px){.hall{gap:6px;padding:6px 12px 8px}.hall .lang-picker{top:6px;left:auto;right:12px}.mini-soon{white-space:normal;overflow-wrap:anywhere;font-size:10px}.hall-sign{letter-spacing:5px;font-size:20px}.hall-floor{gap:10px}.hall-pong{flex:auto}.hall-pong .lesson-list{max-height:calc(100vh - 150px);overflow-y:auto}.lesson-item{padding:4px 8px;font-size:13px}.hall-others{flex-direction:row}.mini-cab{width:84px}.hall-say{padding:6px 10px;font-size:13px}.hall-continue{min-height:44px;padding:8px 16px;font-size:15px}.hall-bit .bit-face{display:none}}.if-card .key-cap{fill:#1d1446;stroke:var(--cyan);stroke-width:4px;transition:all .15s}.if-card .key.down .key-cap{fill:var(--cyan);transform:translateY(6px)}.if-card .key-label{fill:var(--text);text-anchor:middle;font:900 44px ui-monospace,monospace}.if-card .key.down .key-label{fill:var(--bg)}.if-card .caption{fill:var(--muted);text-anchor:middle;font-size:20px}.if-card .diamond{fill:#1d1446;stroke:var(--yellow);stroke-width:4px}.if-card .question{fill:var(--yellow);text-anchor:middle;font:700 19px ui-monospace,monospace}.if-card .road{fill:none;stroke:#3a3358;stroke-width:6px;transition:stroke .2s}.if-card .road.on{stroke:var(--green);filter:drop-shadow(0 0 6px var(--green))}.if-card .road-label{fill:#5a5380;font-size:20px}.if-card .road-label.on{fill:var(--green)}.if-card .action{fill:#120b2c;stroke:#3a3358;stroke-width:3px}.if-card .action.on{stroke:var(--green)}.if-card .action-text{fill:var(--text);text-anchor:middle;font:18px ui-monospace,monospace}.if-card .paddle{fill:#fff;transition:y .1s linear}.compare-card .card-screen{fill:#000;stroke:var(--cyan);stroke-width:3px}.compare-card .limit{stroke:var(--yellow);stroke-width:3px;stroke-dasharray:8 6}.compare-card .limit-label{fill:var(--yellow);font:700 20px ui-monospace,monospace}.compare-card .paddle{fill:#fff;transition:y .5s ease-in-out}.compare-card .y-label{fill:var(--muted);font:16px ui-monospace,monospace;transition:y .5s ease-in-out}.compare-card .question{fill:var(--text);font:700 34px ui-monospace,monospace}.compare-card .answer{fill:#5a5380;font:700 26px ui-monospace,monospace}.compare-card .answer.yes{fill:var(--green)}.compare-card .op{fill:var(--yellow);font:700 24px ui-monospace,monospace}.compare-card .op-text{fill:var(--text);font-size:21px}.bounce-card .card-screen{fill:#000;stroke:var(--cyan);stroke-width:3px}.bounce-card .ball{fill:#fdf900}.bounce-card .arrow{fill:var(--yellow);text-anchor:middle;font:900 40px ui-monospace,monospace}.bounce-card .var-box{fill:#1d1446;stroke:var(--cyan);stroke-width:4px}.bounce-card .box-name{fill:var(--muted);text-anchor:middle;font:24px ui-monospace,monospace}.bounce-card .box-value{fill:var(--yellow);text-anchor:middle;transform-box:fill-box;transform-origin:50%;font:58px ui-monospace,monospace;animation:.4s pop}.bounce-card .code{fill:var(--text);font:34px ui-monospace,monospace;transition:fill .2s}.bounce-card .code.on{fill:var(--green)}.and-card .card-screen{fill:#000;stroke:var(--cyan);stroke-width:3px}.and-card .paddle{fill:#fff}.and-card .ball{fill:#fdf900;transition:cx .5s,cy .5s}.and-card .lamp{fill:#2a2056;stroke:#5a5380;stroke-width:3px;transition:fill .2s}.and-card .lamp.on{fill:var(--green);stroke:var(--green);filter:drop-shadow(0 0 6px var(--green))}.and-card .cond{fill:var(--text);font:22px ui-monospace,monospace}.and-card .amp{fill:var(--yellow);font:700 20px ui-monospace,monospace}.and-card .result{fill:#5a5380;font:700 26px system-ui,sans-serif}.and-card .result.on{fill:var(--green)}.and-card .rule{fill:var(--muted);font-size:20px}.counter-card .card-screen{fill:#000;stroke:var(--cyan);stroke-width:3px}.counter-card .goal{stroke:var(--pink);stroke-width:4px;stroke-dasharray:10 8}.counter-card .ball{fill:#fdf900}.counter-card .var-box{fill:#1d1446;stroke:var(--cyan);stroke-width:4px}.counter-card .box-name{fill:var(--muted);text-anchor:middle;font:22px ui-monospace,monospace}.counter-card .box-value{fill:var(--yellow);text-anchor:middle;transform-box:fill-box;transform-origin:50%;font:64px ui-monospace,monospace;animation:.4s pop}.counter-card .code{fill:var(--green);font:32px ui-monospace,monospace}.fixed-card .marquee-text{fill:var(--yellow);letter-spacing:14px;text-anchor:middle;filter:drop-shadow(0 0 10px var(--yellow)) drop-shadow(0 0 22px var(--pink));font:900 64px system-ui,sans-serif}.fixed-card .title{fill:var(--green);text-anchor:middle;filter:drop-shadow(0 0 8px var(--green)) drop-shadow(0 0 18px var(--green));font:900 48px system-ui,sans-serif}.fixed-card .trophy{text-anchor:middle;font-size:96px}.fixed-card .sub{fill:var(--text);text-anchor:middle;font-size:24px}.lang-picker{z-index:5;gap:4px;display:flex;position:absolute;top:10px;left:12px}.lang-picker button{min-height:30px;box-shadow:none;color:var(--muted);border-color:#3a3358;padding:4px 7px;font:700 12px ui-monospace,monospace}.lang-picker button.on{color:var(--bg);background:var(--cyan);border-color:var(--cyan)}.hall{position:relative}.confetti{pointer-events:none;z-index:50;position:fixed;inset:0}.rotate{display:none}@media (orientation:portrait) and (pointer:coarse){.screen,.confetti,.intro{display:none!important}.rotate{z-index:100;background:var(--bg);color:var(--yellow);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;font-size:22px;font-weight:700;display:flex;position:fixed;inset:0}.rotate-phone{filter:drop-shadow(0 0 12px var(--cyan));font-size:84px;animation:2s ease-in-out infinite rotate-phone}}@media (height<=560px){.screen{grid-template:"top top""talk machine""work machine"minmax(0,1fr)"work actions"/minmax(0,58fr) minmax(0,42fr);gap:6px 10px;padding:4px 10px 6px}.top{gap:10px;min-height:20px}.brand{letter-spacing:2px;font-size:12px}.light{width:9px;height:9px}.top .total{font-size:13px}.talk>.bit-face{display:none}.ticket{border:2px solid var(--yellow);width:100%;color:var(--yellow);box-shadow:none;text-align:left;background:#ffe14d14;border-radius:10px;align-items:center;gap:8px;padding:3px 10px;font-size:13px;font-weight:600;display:flex}.ticket-text{-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:1;min-width:0;line-height:1.3;display:-webkit-box;overflow:hidden}.ticket-more{color:var(--muted)}.talk .bubble{z-index:30;width:calc(42vw - 20px);max-height:calc(100vh - 40px);padding:8px 12px;font-size:13px;line-height:1.4;display:none;position:fixed;top:28px;right:10px;overflow:auto}.talk.open .bubble{display:block}.talk .bubble .mission{display:none}.talk.answering .bubble{max-height:45vh;top:auto;bottom:58px}.talk.answering .bubble .say,.talk.answering .bubble .pager{display:none}.talk.answering .bubble .answer{margin-top:0}.ticket-mark{width:20px;height:20px;color:var(--bg);background:var(--yellow);border-radius:50%;flex:none;place-items:center;font-size:13px;font-weight:900;display:grid}.talk[data-answer=ok] .ticket{border-color:var(--green);color:var(--green);background:#50ff8c14}.talk[data-answer=ok] .ticket-mark{background:var(--green)}.mission{padding:4px 10px}.stars{font-size:20px}.code-pane{max-height:100%}.code-pane .cm-editor{font-size:12px}.code-pane .cm-param-hint{display:none}.code-pane .cm-param-hint[data-label=x\:],.code-pane .cm-param-hint[data-label=y\:]{display:inline}.code-pane .cm-lesson-fold{white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom;max-width:100%;display:inline-block;overflow:hidden}.cabinet{border-width:2px;gap:5px;padding:5px 8px 8px}.marquee{letter-spacing:6px;font-size:13px}.actions{flex-wrap:nowrap;justify-content:flex-end;gap:6px}.actions button{white-space:nowrap;min-height:44px}.actions .run.secondary .run-label,.actions.solved .hint-btn{display:none}.actions .run,.actions .next{padding:6px 14px;font-size:15px}.actions .run.secondary,.actions .hint-btn{padding:5px 8px;font-size:13px}.actions .done{text-align:right;flex-basis:100%;order:-1;font-size:12px}.actions{flex-wrap:wrap}.actions .to-hall .to-hall-label,.actions .done .all-done{display:none}.keys-toggle{padding:5px 7px;font-size:17px}.slow-btn{min-height:44px;padding:4px 8px;font-size:18px}.frame-no{font-size:13px}.slow-btn .slow-label{display:none}.machine-row .boxes{flex-wrap:nowrap;overflow-x:auto}.machine-row .vars{flex-wrap:nowrap}.machine-row .vars h3{display:none}.machine-row .boxes{padding-right:24px;-webkit-mask-image:linear-gradient(90deg,#000 85%,#0000);mask-image:linear-gradient(90deg,#000 85%,#0000)}.ball-lost .lost-what{color:var(--muted);font-size:10px;display:block}.screen:has(.talk.open) .ball-lost{display:none}.box .name{font-size:11px}.box .type{display:none}.box{padding:0 6px}.box .value{font-size:14px}.symbols button{min-width:32px;padding:4px 0;font-size:15px}}.intro{z-index:80;cursor:pointer;-webkit-user-select:none;user-select:none;background:radial-gradient(at 50% 110%,#1b1240,#05030f 70%);position:fixed;inset:0;overflow:hidden}.intro .skip{z-index:5;color:var(--muted);box-shadow:none;border:1px solid #3a3358;border-radius:999px;padding:4px 14px;font-size:15px;position:absolute;top:14px;right:18px}.intro .beat{animation:.6s ease-out both beat-in;position:absolute;inset:0}.intro .sign{text-align:center;letter-spacing:.25em;color:#2a2056;font:900 clamp(32px,7vw,64px) system-ui;position:absolute;top:6vh;left:0;right:0}.intro.lit .sign span{color:var(--pink);text-shadow:0 0 12px var(--pink), 0 0 30px var(--pink);animation:1.4s both ignite,4s 1.4s infinite flick}.intro.lit .sign span:nth-child(2){animation-delay:.12s,1.5s}.intro.lit .sign span:nth-child(3){animation-delay:.24s,2.2s}.intro.lit .sign span:nth-child(5){animation-delay:.36s,1.7s}.intro.lit .sign span:nth-child(6){animation-delay:.48s,2.6s}.intro.lit .sign span:nth-child(7){animation-delay:.6s,1.9s}.intro.lit .sign span:nth-child(8){animation-delay:.72s,3s}.intro.lit .sign span:nth-child(9){animation-delay:.84s,2.4s}.intro.lit .sign span:nth-child(10){animation-delay:.96s,2.1s}.intro .row{justify-content:center;gap:clamp(16px,4vw,46px);display:flex;position:absolute;bottom:14vh;left:0;right:0}.intro .cab{aspect-ratio:130/230;width:clamp(80px,11vw,130px);position:relative}.intro .cab .roof{letter-spacing:3px;color:#3a3358;border:3px solid #3a3358;border-radius:10px 10px 0 0;place-items:center;height:17%;font:800 clamp(9px,1.1vw,14px) system-ui;display:grid;position:absolute;top:0;left:0;right:0}.intro .cab .body{border:3px solid #3a3358;border-top:none;position:absolute;inset:17% 6% 0}.intro .cab .scr{background:#000;border:2px solid #3a3358;height:34%;position:absolute;top:24%;left:14%;right:14%;overflow:hidden}.intro.lit .cab .roof,.intro.lit .cab .body,.intro.lit .cab .scr{border-color:var(--cyan);box-shadow:0 0 10px var(--cyan)}.intro.lit .cab .roof{color:var(--yellow);text-shadow:0 0 8px var(--yellow)}.intro .noise.dim{opacity:.35}.intro .broken{color:#fff;text-align:center;letter-spacing:2px;background:#c0213a;padding:2px 0;font:800 clamp(9px,1vw,12px) system-ui;position:absolute;top:40%;left:-6px;right:-6px;transform:rotate(-8deg);box-shadow:0 0 10px #ff4b6a}.intro .press.soft{opacity:.85;font-size:15px;animation:none}.intro .row.ghost{opacity:.22}.intro .press{text-align:center;color:var(--yellow);font-size:clamp(15px,2vw,20px);font-weight:700;animation:1.2s infinite pulse;position:absolute;bottom:4vh;left:0;right:0}.intro .say-line{align-items:center;gap:18px;display:flex;position:absolute;left:6vw;right:6vw}.intro .say-line .bubble{flex:1;font-size:clamp(15px,2vw,21px)}.intro .roll{animation:1.6s ease-out both roll-in}.intro .demo{grid-template-columns:1.5fr auto 1fr;align-items:center;gap:3vw;display:grid;position:absolute;top:12vh;left:6vw;right:6vw}.intro .demo .line{white-space:nowrap;background:#1e1b2e;border:2px solid #3a3358;border-radius:10px;padding:12px 14px;font:clamp(13px,1.6vw,20px) ui-monospace,Consolas,monospace;overflow:hidden}.intro .demo .line .zone{box-shadow:inset 4px 0 0 var(--yellow);background:#ffe14d38;padding:2px 8px;display:block}.intro .fn{color:#61afef}.intro .num{color:#d19a66}.intro .k{color:#e06c75}.intro .swap{display:inline-grid}.intro .swap>*{grid-area:1/1}.intro .swap .a{animation:4s infinite swap-a}.intro .swap .b{animation:4s infinite swap-b}.intro .run-glow{padding:10px 18px;font-size:26px;animation:4s infinite run-glow}.intro .mini{aspect-ratio:16/9;border:3px solid var(--cyan);box-shadow:0 0 12px var(--cyan);background:#000;border-radius:8px;position:relative;overflow:hidden}.intro .mini .p{background:#fff;width:3%;height:22%;position:absolute}.intro .mini .p.l{left:4%}.intro .mini .p.r{top:40%;right:4%}.intro .mini .p.up{animation:4s infinite paddle-up}.intro .scr .mini{aspect-ratio:auto;height:100%}.intro .mini-pong{width:100%;height:100%;display:block}.intro .promise-row{justify-content:center;align-items:center;gap:4vw;padding:0 6vw;display:flex;position:absolute;inset:0}.intro .big-cab{flex:none;width:min(38vw,440px)}.intro .promise-row .say-line{flex:0 520px;position:static}.intro .big-cab .mini{border-color:var(--green);box-shadow:0 0 18px var(--green)}.intro .go{text-align:center;position:absolute;bottom:6vh;left:0;right:0}.intro .go button{padding:12px 34px;font-size:24px}.intro .zoomer{animation:1s ease-in both zoom-in}.intro .go-row{bottom:22vh}.intro .go-row .cab{width:clamp(140px,18vw,220px)}.intro .go-say{justify-content:center;top:8vh}.intro .go-say .bubble{flex:none}@media (height<=560px){.intro .row{bottom:12vh}.intro .cab{width:clamp(56px,9vw,96px)}.intro .go-row{bottom:20vh}.intro .go-row .cab{width:92px}.intro .go-say{top:3vh}.intro .go{bottom:3vh}.intro .go button{padding:8px 22px;font-size:17px}.intro .say-line .bubble{font-size:14px}.intro .row.ghost{display:none}.intro .big-cab{width:min(34vw,260px)}}@keyframes pulse{50%{opacity:.5}}@keyframes zone-flash{30%{box-shadow:inset 4px 0 0 var(--yellow), inset 0 0 0 2px var(--yellow), 0 0 12px var(--yellow)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes point-in{0%{opacity:.4}to{opacity:1}}@keyframes blink{50%{opacity:0}}@keyframes blink-eye{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}@keyframes fade-up{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes star-pop{0%{opacity:0;transform:scale(0)rotate(-180deg)}70%{opacity:1;transform:scale(1.35)rotate(15deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes star-shine{0%,40%{filter:drop-shadow(0 0 #0000)}60%{filter:drop-shadow(0 0 14px var(--yellow)) brightness(1.4)}to{filter:drop-shadow(0 0 4px var(--yellow))}}@keyframes star-slot{0%{opacity:0;transform:scale(.6)}to{opacity:.3;transform:scale(1)}}@keyframes bit-jump{0%,to{transform:none}30%{transform:translateY(-18px)rotate(-10deg)}60%{transform:translateY(0)rotate(8deg)}}@keyframes next-in{0%{opacity:0;transform:scale(.3)translateY(20px)}to{opacity:1;transform:none}}@keyframes next-glow{50%{box-shadow:0 0 22px var(--yellow), 0 0 4px var(--yellow) inset}}@keyframes crt-on{0%{filter:brightness(4);transform:scaleY(.01)}50%{filter:brightness(2);transform:scaleY(1)}to{filter:none;transform:none}}@keyframes snow{0%{background-position:0 0}25%{background-position:37px -23px}50%{background-position:-29px 41px}75%{background-position:53px 17px}to{background-position:-11px -37px}}@keyframes roll{0%{top:-30%}to{top:100%}}@keyframes rotate-phone{0%,20%{transform:rotate(0)}50%,80%{transform:rotate(-90deg)}to{transform:rotate(0)}}@keyframes beat-in{0%{opacity:0}to{opacity:1}}@keyframes ignite{0%{color:#2a2056;text-shadow:none}40%{color:var(--pink)}55%{color:#2a2056;text-shadow:none}to{color:var(--pink)}}@keyframes flick{0%,6%,10%,to{opacity:1}8%{opacity:.25}}@keyframes roll-in{0%{transform:translate(70vw)rotate(360deg)}to{transform:none}}@keyframes swap-a{0%,35%{opacity:1}40%,to{opacity:0}}@keyframes swap-b{0%,35%{opacity:0}40%,to{opacity:1}}@keyframes run-glow{0%,45%{box-shadow:0 0 6px var(--cyan)}50%,60%{box-shadow:0 0 30px var(--cyan);background:#39f3ff33}to{box-shadow:0 0 6px var(--cyan)}}@keyframes paddle-up{0%,55%{top:39%}70%,to{top:9%}}@keyframes zoom-in{to{opacity:0;transform:scale(4)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
