:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#07060c;height:100%;overflow:hidden}.room{height:100%;font-family:var(--pixel), ui-monospace, monospace;-webkit-font-smoothing:none;color:#e8e4f5;background:radial-gradient(120% 80% at 50% -10%,#241a44 0%,#0b0812 55%,#07060c 100%);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:14px;display:flex}.room:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:16px 16px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(70% 60% at 50% 40%,#000 0%,#0000 75%);mask-image:radial-gradient(70% 60% at 50% 40%,#000 0%,#0000 75%)}.console{clip-path:polygon(8px 0,calc(100% - 8px) 0,calc(100% - 8px) 4px,calc(100% - 4px) 4px,calc(100% - 4px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 4px) calc(100% - 8px),calc(100% - 4px) calc(100% - 4px),calc(100% - 8px) calc(100% - 4px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 4px),4px calc(100% - 4px),4px calc(100% - 8px),0 calc(100% - 8px),0 8px,4px 8px,4px 4px,8px 4px);background:linear-gradient(#3b2f5e 0%,#2a2145 40%,#201936 100%);border:3px solid #120e20;padding:10px 14px 12px;position:relative;box-shadow:inset 0 2px #6a58a8,inset 0 -3px #150f28,inset 3px 0 #4a3c78,inset -3px 0 #191233,0 10px #0c0917,0 22px 50px #000000bf}.brand{letter-spacing:2px;color:#ffd76a;text-shadow:2px 2px #6a3d00;align-items:center;gap:8px;padding:2px 2px 8px;font-size:9px;display:flex}.brand .model{letter-spacing:1px;color:#8a7fc0;text-shadow:none;margin-left:auto;font-size:7px}.led{background:#3a2f16;width:8px;height:8px;box-shadow:inset 0 0 0 2px #120e20}.led.on{background:#6bff8f;box-shadow:inset 0 0 0 2px #120e20,0 0 10px #6bff8faa}.screen{background:#0a0812;padding:8px;position:relative;box-shadow:inset 0 0 0 2px #000,inset 0 0 0 5px #171130,0 0 0 2px #4a3c78}canvas.stage{image-rendering:pixelated;image-rendering:crisp-edges;background:#0b0910;display:block}canvas.stage.pick{cursor:pointer}.scan{pointer-events:none;background:repeating-linear-gradient(#0003 0 1px,#0000 1px 3px),radial-gradient(120% 100%,#0000 55%,#00000073 100%);position:absolute;inset:8px}.deck{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:12px 2px 4px;font-size:8px;display:flex}.tag{color:#9a8fd0;letter-spacing:1px}.btn,.mini{font:inherit;letter-spacing:1px;color:#efe9ff;cursor:pointer;background:#4a3c78;border:2px solid #120e20;padding:6px 9px;font-size:8px;box-shadow:inset 0 2px #7a68b8,inset 0 -2px #2b2150,0 3px #17122c}.mini{padding:4px 6px}.btn:hover,.mini:hover{background:#5c4b92}.btn:active,.mini:active{transform:translateY(3px);box-shadow:inset 0 2px #7a68b8,inset 0 -2px #2b2150}.btn.on{background:#d0304a;box-shadow:inset 0 2px #ff7a86,inset 0 -2px #7a1526,0 3px #4a0c17}.knob{color:#8a7fc0;align-items:center;gap:6px;display:flex}.knob b{letter-spacing:1px;font-size:7px;font-weight:400}.knob i{color:#ffd76a;text-align:center;min-width:22px;font-style:normal}input[type=range]{appearance:none;background:#17122c;border:2px solid #120e20;width:88px;height:10px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#ffd76a;border:2px solid #120e20;width:10px;height:14px}input[type=range]::-moz-range-thumb{cursor:pointer;background:#ffd76a;border:2px solid #120e20;border-radius:0;width:10px;height:14px}.grille{opacity:.8;background-image:radial-gradient(#120e20 1.2px,#0000 1.4px);background-size:5px 5px;height:6px;margin:2px 2px 0}.note{color:#6f6a86;text-align:center;max-width:620px;padding:0 8px;font-size:8px;line-height:2.1}@media (max-height:640px){.note{display:none}}@media (max-width:760px){.room{gap:6px;padding:6px}.console{padding:8px}.brand{letter-spacing:1px;font-size:8px}.brand .model{display:none}.deck{flex-wrap:wrap;justify-content:center;gap:6px;padding:8px 0 2px}.knob input[type=range]{width:70px}.note{max-width:100%;font-size:7px;line-height:1.9}}@media (max-width:760px) and (max-height:720px){.note{display:none}}:where(button,[href],input,select,textarea,[tabindex]):focus-visible{outline-offset:2px;outline:3px solid #ffd76a}canvas.stage:focus-visible{outline-offset:4px;outline:3px solid #ffd76a}.sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.skip:focus{z-index:10;clip-path:none;color:#241710;background:#ffd76a;width:auto;height:auto;padding:8px 12px;position:fixed;top:8px;left:8px}@media (prefers-reduced-motion:reduce){.scan{display:none}.btn:active,.mini:active{transform:none}.led.on{box-shadow:inset 0 0 0 2px #120e20}}.deck{flex-wrap:nowrap;height:46px;overflow:visible}.knob.vol input[type=range]{width:56px}@media (max-width:900px){.deck{flex-wrap:wrap;height:auto;min-height:46px}}.sheet{z-index:2;text-align:left;background:#0a0812f9;flex-direction:column;justify-content:center;gap:10px;padding:18px 22px;display:flex;position:absolute;inset:8px;box-shadow:inset 0 0 0 2px #4a3c78}.sheet h2{letter-spacing:2px;color:#ffd76a;text-shadow:2px 2px #6a3d00;font-size:10px;font-weight:400}.sheet p{color:#cfc7ee;white-space:pre-line;max-width:46em;font-size:8px;line-height:2.1}.sheet-row{flex-wrap:wrap;gap:8px;margin-top:2px;display:flex}.mini.help{min-width:26px}.linky{font:inherit;color:#9a8fd0;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #4a3c78;padding:0;font-size:8px}.linky:hover{color:#ffd76a;border-bottom-color:#ffd76a}.note{min-height:2.6em}@media (max-width:760px){.sheet{gap:8px;padding:12px 14px}}