:root{--void:#0a0a0b;--pcb:#10301f;--pcb-hi:#1b4a30;--pcb-bright:#276b45;--pcb-bright-hi:#327d53;--panel-gradient:linear-gradient(180deg, var(--pcb-hi), var(--pcb) 40%);--key-size:56px;--ember:#f43;--key:#5c9c7f;--key-hi:#6fb492;--fn-key:#d98a35;--fn-key-hi:#e59a45;--paper:#ece9e4;--slate:#98959c;--good:#52c26b;--warn:#e2a23c;--font-display:"IBM Plex Sans", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}body{background:var(--void);min-height:100vh;color:var(--paper);font-family:var(--font-display);background-image:radial-gradient(900px 500px at 50% 0,#ff44330d,#0000 65%);justify-content:center;margin:0;padding:56px 20px 40px;display:flex}.page{flex-direction:column;gap:28px;width:100%;max-width:620px;display:flex}.masthead{text-align:center;flex-direction:column;gap:6px;display:flex}.eyebrow{font-family:var(--font-mono);letter-spacing:.14em;color:var(--slate);margin:0;font-size:12px}.tagline{color:var(--slate);margin:4px 0 0;max-width:46ch;margin-inline:auto;font-size:14.5px;line-height:1.5}#app>h1{flex-wrap:wrap;justify-content:center;align-items:baseline;gap:10px;margin:0 0 18px;display:flex}#app>h1 .wordmark{font-family:"Michroma", var(--font-display);letter-spacing:.09em;text-transform:uppercase;color:var(--paper);font-size:21px;line-height:1}#app>h1 .tag{font-family:"Michroma", var(--font-display);letter-spacing:.09em;text-transform:uppercase;color:var(--slate);font-size:12px}.case{background:var(--panel-gradient);border-radius:14px;padding:22px;box-shadow:0 24px 48px -16px #000000a6,inset 0 1px #ffffff0f,inset 0 -1px #00000059}.display{background:var(--pcb-bright);border-radius:8px;justify-content:flex-end;align-items:center;gap:18px;margin-bottom:18px;padding:18px 22px;display:flex;box-shadow:inset 0 2px 6px #00000080}.digits{gap:4px;display:flex}.digits.group-gap{border-right:1px solid #ffffff14;margin-right:16px;padding-right:16px}.digit{width:26px;height:46px;position:relative}.seg{background:var(--pcb-hi);position:absolute}@media (prefers-reduced-motion:no-preference){.seg{transition:background 60ms linear,box-shadow 60ms linear}}.seg.on{background:var(--ember);box-shadow:0 0 7px #ff4433bf}.seg-a,.seg-d,.seg-g{clip-path:polygon(10% 0,90% 0,100% 50%,90% 100%,10% 100%,0 50%);width:18px;height:5px;left:4px}.seg-a{top:0}.seg-g{top:20.5px}.seg-d{top:41px}.seg-b,.seg-c,.seg-e,.seg-f{clip-path:polygon(0 10%,50% 0,100% 10%,100% 90%,50% 100%,0 90%);width:5px;height:18px}.seg-f{top:3px;left:0}.seg-b{top:3px;left:21px}.seg-e{top:24px;left:0}.seg-c{top:24px;left:21px}.status{font-family:var(--font-mono);letter-spacing:.04em;color:var(--slate);min-width:92px;font-size:12px}.status .running{color:var(--good)}.status .halted{color:var(--warn)}.keygrid{grid-template-columns:repeat(5, var(--key-size));grid-auto-rows:var(--key-size);justify-content:center;gap:8px;margin-bottom:18px;display:grid}.reset-btn{position:relative}.stop-note{color:var(--ember);white-space:nowrap;pointer-events:none;text-shadow:0 1px 1px #00000080;font-family:Permanent Marker,cursive;font-size:10px;line-height:1;position:absolute;bottom:9px;right:3px;transform:rotate(-6deg)}.keygrid button.mode{background:var(--pcb-bright);color:var(--slate);grid-column:5}.keygrid button.mode:hover{background:var(--pcb-bright-hi);color:var(--paper)}button{font:inherit;background:var(--key);color:var(--paper);cursor:pointer;touch-action:manipulation;border:none;border-radius:7px;padding:12px 14px;font-size:15px;box-shadow:inset 0 1px #ffffff14,0 1px 2px #0006}.keygrid button{width:var(--key-size);height:var(--key-size);text-align:center;justify-content:center;align-items:center;padding:0;display:flex}.keygrid button:not(.fn){font-size:24px;font-weight:700}@media (prefers-reduced-motion:no-preference){button{transition:background .1s,transform 60ms}}button:hover{background:var(--key-hi)}button:active{transform:translateY(1px);box-shadow:inset 0 1px 1px #00000059}button:focus-visible{outline:2px solid var(--ember);outline-offset:2px}button.fn{background:var(--fn-key);font-size:11.5px;font-family:var(--font-mono);letter-spacing:.03em;line-height:1.35}button.fn:hover{background:var(--fn-key-hi)}.loader{font-family:var(--font-mono);flex-direction:column;gap:8px;font-size:12.5px;display:flex}.loader-row{align-items:center;gap:8px;display:flex}.loader label{color:var(--slate);white-space:nowrap}.loader-row:first-child input[type=text]{width:90px}.loader input[type=text]{font:inherit;background:var(--pcb-bright);color:var(--paper);border:1px solid #ffffff1f;border-radius:5px;flex:1;padding:7px 9px}.loader input[type=text]:focus-visible{outline:2px solid var(--ember);outline-offset:1px}.sample-picker{flex:1;display:flex;position:relative}.sample-picker input[type=text]{border-radius:5px 0 0 5px}.sample-picker-btn{width:26px;font-size:10px;font-family:var(--font-mono);background:var(--pcb-bright);color:var(--slate);box-shadow:none;cursor:pointer;border:1px solid #ffffff1f;border-left:none;border-radius:0 5px 5px 0;flex-shrink:0;padding:0}.sample-picker-btn:hover{background:var(--pcb-bright-hi);color:var(--paper)}.sample-picker-menu{z-index:10;background:var(--pcb-hi);border:1px solid #ffffff24;border-radius:6px;flex-direction:column;gap:2px;padding:4px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;box-shadow:0 12px 24px -8px #0009}.sample-picker-menu button{text-align:left;width:100%;font:inherit;color:var(--paper);box-shadow:none;background:0 0;border-radius:4px;padding:7px 9px;font-size:11px;display:block}.sample-picker-menu button:hover{background:var(--pcb-bright)}.tutorial-intro{color:var(--paper);margin:0 0 12px;font-size:13.5px;line-height:1.6}.tutorial-toc{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.tutorial-toc button{text-align:left;width:100%;padding:10px 14px;font-size:13px;display:block}.tutorial-progress{font-family:var(--font-mono);color:var(--slate);margin-bottom:6px;font-size:11px}.tutorial-body h3{color:var(--paper);margin:0 0 10px;font-size:15px}.tutorial-body p{color:var(--paper);margin:0 0 12px;font-size:13.5px;line-height:1.6}.tutorial-body strong{font-family:var(--font-mono);color:var(--ember);font-weight:500}.tutorial-body code{font-family:var(--font-mono);background:#0003;border-radius:3px;padding:1px 5px}.tutorial-subhead{font-family:var(--font-mono);letter-spacing:.04em;color:var(--slate);font-size:11px;font-weight:600;margin:0 0 8px!important}.tutorial-copy-row{color:var(--paper);flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px;font-size:13px;display:flex}.tutorial-copy-text{font-family:var(--font-mono);font-size:12.5px}.tutorial-copy-btn{font:inherit;font-family:var(--font-mono);letter-spacing:.03em;background:var(--pcb-bright);color:var(--paper);cursor:pointer;border:none;border-radius:5px;min-width:4.5em;padding:4px 10px;font-size:11px}.tutorial-copy-btn:hover{background:var(--pcb-bright-hi)}.tutorial-actions{flex-direction:column;gap:6px;margin:0 0 14px;padding:0;list-style:none;display:flex}.tutorial-actions li{background:#00000026;border-radius:6px;flex-direction:column;gap:2px;padding:8px 10px;display:flex}.tutorial-key{font-family:var(--font-mono);color:var(--ember);font-size:12.5px;font-weight:500}.tutorial-fn{font-family:var(--font-mono);color:var(--slate);font-size:11px}.tutorial-result{color:var(--paper);font-size:13px}.tutorial-note{font-family:var(--font-mono);color:var(--slate);border-top:1px solid #ffffff14;margin:0;padding-top:12px;font-size:11.5px;line-height:1.6}.tutorial-nav{justify-content:flex-end;gap:8px;margin-top:4px;display:flex}.tutorial-nav button{width:auto}.manual{background:var(--panel-gradient);border-radius:10px;padding:20px 22px;box-shadow:inset 0 1px #ffffff0d}.manual-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.manual-head-actions{gap:8px;display:flex}.manual h2{letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:0;font-size:11px;font-weight:600}.lang-toggle{font:inherit;font-family:var(--font-mono);letter-spacing:.05em;background:var(--pcb-bright);color:var(--paper);cursor:pointer;border:none;border-radius:5px;padding:5px 10px;font-size:11px}.lang-toggle:hover{background:var(--pcb-bright-hi)}.lang-toggle:focus-visible{outline:2px solid var(--ember);outline-offset:2px}.manual ol{color:var(--paper);flex-direction:column;gap:6px;margin:0;padding-left:1.3em;font-size:13.5px;display:flex}.manual strong{font-family:var(--font-mono);color:var(--ember);font-weight:500}.manual .note{font-family:var(--font-mono);color:var(--slate);border-top:1px solid #ffffff14;margin:16px 0 0;padding-top:14px;font-size:11.5px;line-height:1.6}.credit{font-family:var(--font-mono);color:var(--slate);margin:10px 0 0;font-size:11.5px}.manual a{color:var(--paper);text-underline-offset:2px;-webkit-text-decoration:underline #ece9e459;text-decoration:underline #ece9e459}.manual a:hover{-webkit-text-decoration-color:var(--paper);text-decoration-color:var(--paper)}