@font-face{font-family:Outfit;font-weight:100 900;src:url(./Outfit-Variable-B6lQlNBM.ttf)format("truetype-variations")}@font-face{font-family:Inter;font-weight:100 900;src:url(./Inter-Variable-c8O0ljhh.ttf)format("truetype-variations")}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0a0c0e;--fg:#efefef;--dim:#8a9099;--rule:#23272c;--accent:#00a8e8;background:radial-gradient(ellipse at 50% 30%, #161a1f 0%, var(--bg) 65%) fixed var(--bg);color:var(--fg);font-family:Inter,system-ui,sans-serif}body{box-sizing:border-box;flex-direction:column;align-items:center;min-height:100vh;margin:0;padding:32px 16px;display:flex}header{align-items:center;gap:16px;width:min(1080px,100%);display:flex}header img{border-radius:11px;flex:none}h1{letter-spacing:-.01em;margin:0;font-family:Outfit,sans-serif;font-size:28px;font-weight:600}header p{color:var(--dim);margin:2px 0 0;font-size:15px}main{flex-direction:column;align-items:center;width:min(1080px,100%);display:flex}.stage{width:100%;margin-top:44px;container-type:inline-size}.labels{height:0;position:relative}.labels span{bottom:calc(4px - 3.50877cqw);left:calc(100cqw * var(--x) / 2394);white-space:nowrap;color:var(--dim);font:500 clamp(10px,1.25cqw,13px)/1 ui-monospace,SF Mono,Menlo,monospace;position:absolute;transform:translate(-50%)}.labels i{font-style:normal}@container (width<=640px){.labels i{display:none}}.device{aspect-ratio:2394/1329;width:100%;position:relative}.device svg{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.device iframe{transform-origin:0 0;background:#0a0c0e;border:0;border-radius:11px;width:800px;height:480px;position:absolute}.device .hit,.device #dial,.device #back{pointer-events:auto;cursor:pointer}.device [id^=preset-],.device #mode,.device #back,.device #dial>g{transform-box:fill-box;transform-origin:50%;transition:transform .12s,filter .12s}.device .hover,.device #dial:hover>g,.device #back:hover{filter:brightness(1.25)}.device [id^=preset-].down,.device #mode.down{filter:brightness(1.6);transform:translateY(10px)}.device #back.down,.device #dial.down>g{filter:brightness(1.3);transform:scale(.97)}.device .ticks{stroke:#fff;stroke-opacity:.07;stroke-width:4px;transform-box:view-box;transform-origin:1988px 511px;transition:transform .2s ease-out}.caption{text-align:center;max-width:720px;min-height:3em;margin:28px 0 8px;font-family:Outfit,sans-serif;font-size:20px;line-height:1.4}.controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.controls .sep{background:var(--rule);width:1px;height:24px;margin:0 8px}@media (max-width:640px){.controls .sep{display:none}}.controls .label{color:var(--dim);font-size:13px}button{color:var(--fg);border:1px solid var(--rule);cursor:pointer;white-space:nowrap;background:#15191d;border-radius:8px;padding:8px 14px;font:500 14px Inter,system-ui,sans-serif}button:hover{background:#1c2126}button.primary{background:var(--accent);border-color:var(--accent);color:#001018;min-width:108px}.keys{text-align:center;max-width:720px;color:var(--dim);margin-top:20px;font-size:14px;line-height:1.7}kbd{border:1px solid var(--rule);color:var(--fg);border-bottom-width:2px;border-radius:5px;padding:1px 6px;font:12px ui-monospace,Menlo,monospace}footer{text-align:center;color:#5d636b;max-width:720px;margin-top:auto;padding-top:40px;font-size:12px;line-height:1.6}