:root{--v-bg: #070708;--v-panel: #0e0e10;--v-panel-2: #131316;--v-bone: #e6e1d6;--v-dim: #8a867e;--v-faint: #5b5852;--v-line: rgba(230, 225, 214, .14);--v-line-soft: rgba(230, 225, 214, .06);--v-signal: #7fa8b4;--v-signal-soft: rgba(127, 168, 180, .16);--v-signal-glow: rgba(127, 168, 180, .55);--v-mono: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--v-ease: cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html,body{margin:0;padding:0}html{background:var(--v-bg)}body{min-height:100vh;background:radial-gradient(ellipse 140% 90% at 50% 40%,#101012 0%,var(--v-bg) 70%);color:var(--v-bone);font-family:var(--v-mono);-webkit-font-smoothing:antialiased}::selection{background:var(--v-signal);color:var(--v-bg)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.void{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:40px 24px;overflow:hidden}.void:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:40;background:radial-gradient(ellipse 120% 100% at 50% 45%,transparent 55%,rgba(0,0,0,.6) 100%)}.void:after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:41;opacity:.5;background-image:repeating-linear-gradient(to bottom,rgba(0,0,0,.16) 0px,rgba(0,0,0,.16) 1px,transparent 1px,transparent 3px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");animation:grain .6s steps(2) infinite}@keyframes grain{0%{transform:translate(0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,-1%)}to{transform:translate(2%,2%)}}.void-shell{position:relative;z-index:5;width:100%;max-width:1040px}.rig{--vu: 0;position:relative;padding:22px 30px 24px;border:1px solid var(--v-line);border-radius:6px;background:radial-gradient(circle at 16px 16px,rgba(230,225,214,.28) 0 1.5px,transparent 2.5px) no-repeat,radial-gradient(circle at calc(100% - 16px) 16px,rgba(230,225,214,.28) 0 1.5px,transparent 2.5px) no-repeat,linear-gradient(180deg,var(--v-panel-2),var(--v-panel));box-shadow:inset 0 1px #ffffff0a,0 30px 80px #0000008c;animation:flicker 7s infinite}.rig:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.05) 0%,transparent 26%,transparent 72%,rgba(255,255,255,.02) 100%)}@keyframes flicker{0%,97%,to{opacity:1}97.5%{opacity:.95}98%{opacity:1}98.4%{opacity:.92}}.rail{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:4px 0 16px;border-bottom:1px solid var(--v-line)}.brand{color:var(--v-bone);display:flex;align-items:center;text-shadow:0 0 14px var(--v-signal-glow)}.brand .void-logo{height:17px;width:auto;display:block}.rail-right{display:flex;align-items:center;gap:16px}.clock{font-size:.68rem;letter-spacing:.22em;color:var(--v-dim);font-variant-numeric:tabular-nums}.help-btn{font-family:inherit;font-size:.72rem;line-height:1;color:var(--v-dim);background:transparent;border:1px solid var(--v-line);border-radius:50%;width:28px;height:28px;cursor:pointer;transition:color .2s,border-color .2s}.help-btn:hover{color:var(--v-bone);border-color:var(--v-signal)}.help-btn[aria-expanded=true]{color:var(--v-bg);background:var(--v-signal);border-color:var(--v-signal)}.help-btn:focus-visible{outline:2px solid var(--v-signal);outline-offset:2px}.help-panel{position:absolute;top:66px;right:30px;z-index:60;width:min(340px,calc(100vw - 48px));background:var(--v-panel);border:1px solid var(--v-line);border-radius:3px;padding:18px 20px;box-shadow:0 18px 40px #00000080}.help-panel[hidden]{display:none}.help-panel ul{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:9px;font-size:.72rem;color:var(--v-dim)}.help-panel p{margin:0;font-size:.72rem;line-height:1.65;color:var(--v-faint)}.help-panel kbd{font-family:inherit;color:var(--v-bone);border:1px solid var(--v-line);border-radius:2px;padding:1px 6px;margin-right:2px}.notice{position:absolute;top:10px;left:50%;transform:translate(-50%);z-index:70;display:flex;align-items:center;gap:14px;background:var(--v-panel-2);border:1px solid var(--v-signal);border-radius:3px;padding:10px 12px 10px 16px;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--v-bone);box-shadow:0 12px 30px #00000080}.notice[hidden]{display:none}.notice button{font-family:inherit;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--v-bg);background:var(--v-signal);border:0;border-radius:2px;padding:6px 12px;cursor:pointer}.debug{position:absolute;right:30px;bottom:26px;z-index:65;width:min(370px,calc(100vw - 48px));background:var(--v-panel);border:1px solid var(--v-line);border-radius:3px;padding:12px 14px;box-shadow:0 18px 40px #00000080}.debug[hidden]{display:none}.debug-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--v-signal)}.debug-head>span{margin-right:auto}.debug-head button{font-family:inherit;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--v-dim);background:transparent;border:1px solid var(--v-line);border-radius:2px;padding:4px 8px;cursor:pointer}.debug-head button:hover{color:var(--v-bone);border-color:var(--v-signal)}.debug pre{margin:0;font-family:var(--v-mono);font-size:.62rem;line-height:1.5;color:var(--v-dim);white-space:pre;overflow-x:auto}.face{position:relative;z-index:5;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:44px;align-items:center;padding:34px 0 30px}.tuner{display:flex;flex-direction:column;gap:26px}.bands{display:inline-flex;align-self:flex-start;border:1px solid var(--v-line);border-radius:3px;overflow:hidden}.band{font-family:inherit;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--v-faint);background:transparent;border:0;border-right:1px solid var(--v-line);padding:9px 14px;min-height:34px;cursor:pointer;transition:color .2s,background .2s}.band:last-child{border-right:0}.band:hover{color:var(--v-bone)}.band.is-active{color:var(--v-bg);background:var(--v-signal)}.band:focus-visible{outline:2px solid var(--v-signal);outline-offset:-2px}.dial{position:relative;height:150px;border-top:1px solid var(--v-line);border-bottom:1px solid var(--v-line);cursor:grab;touch-action:none;box-shadow:0 0 calc(var(--vu) * 26px) rgba(127,168,180,calc(var(--vu) * .3));transition:box-shadow .2s linear}.dial.is-dragging{cursor:grabbing}.dial-ticks{position:absolute;inset:0}.dial-tick{position:absolute;bottom:0;width:1px;background:var(--v-line);transform:translate(-50%)}.dial-tick.major{height:30px;background:#e6e1d647}.dial-tick.minor{height:14px}.station{position:absolute;top:12px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:0;padding:2px 6px;font-family:inherit;cursor:pointer;color:var(--v-dim);transition:color .2s;animation:vf-fade-station .45s var(--v-ease) both}.station b{font-size:.66rem;letter-spacing:.12em;color:var(--v-signal)}.station span{font-size:.64rem;letter-spacing:.06em;white-space:nowrap}.station:hover,.station.is-active{color:var(--v-bone)}.station.is-active b{text-shadow:0 0 10px var(--v-signal-glow)}.dial-needle{position:absolute;top:-6px;bottom:-6px;left:0;width:2px;background:var(--v-signal);box-shadow:0 0 12px var(--v-signal-glow),0 0 2px var(--v-signal);pointer-events:none}.dial-needle:before{content:"";position:absolute;top:-6px;left:50%;transform:translate(-50%);border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--v-signal)}.dial-needle .needle-base{position:absolute;bottom:-7px;left:50%;transform:translate(-50%);width:9px;height:3px;background:var(--v-signal)}.readout{display:flex;flex-direction:column;gap:8px}.readout-name{margin:0;font-size:clamp(1.9rem,5vw,3.2rem);font-weight:400;letter-spacing:.04em;text-transform:uppercase;line-height:1;text-shadow:0 0 calc(10px + var(--vu) * 22px) rgba(230,225,214,calc(.12 + var(--vu) * .2))}.readout-pos{font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--v-faint)}.readout-name.is-band-fade,.readout-pos.is-band-fade{animation:vf-fade .45s var(--v-ease) both}@keyframes vf-fade{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes vf-fade-station{0%{opacity:0;transform:translate(-50%) translateY(3px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.meters{display:flex;flex-direction:column;justify-content:center;gap:20px}.spectrum{width:100%;height:132px;display:block;opacity:.92}.scope{width:100%;height:104px;display:block;opacity:.92}.vu{position:relative;height:6px;background:var(--v-line-soft);overflow:hidden}.vu-fill{position:absolute;inset:0 auto 0 0;width:0%;background:linear-gradient(90deg,var(--v-signal) 0%,var(--v-signal) 70%,var(--v-bone) 100%);box-shadow:0 0 12px var(--v-signal-glow);transition:width .08s linear}.vu-peak{position:absolute;top:-2px;bottom:-2px;left:0;width:2px;background:var(--v-bone);opacity:0;transition:opacity .4s}.console{position:relative;z-index:5;border-top:1px solid var(--v-line);padding-top:18px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px 30px}.group{display:flex;align-items:center;gap:12px}.group-label{font-size:.56rem;letter-spacing:.26em;text-transform:uppercase;color:var(--v-faint)}.ctrl{font-family:inherit;font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--v-dim);background:linear-gradient(180deg,var(--v-panel-2),var(--v-panel));border:1px solid var(--v-line);border-radius:3px;padding:11px 15px;min-height:42px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;transition:color .2s,border-color .2s,box-shadow .2s,background .2s}.ctrl:hover{color:var(--v-bone);border-color:#e6e1d64d}.ctrl:focus-visible{outline:2px solid var(--v-signal);outline-offset:2px}.ctrl.is-on{color:var(--v-bone);border-color:#7fa8b480;background:var(--v-signal-soft);box-shadow:0 0 12px #7fa8b42e inset}.ctrl.is-hinting{color:var(--v-bone);animation:hint-pulse 1.7s ease-in-out infinite}@keyframes hint-pulse{0%,to{border-color:var(--v-line);box-shadow:0 0 #7fa8b400}50%{border-color:var(--v-signal);box-shadow:0 0 16px var(--v-signal-glow)}}.knob{display:flex;align-items:center;gap:10px}.knob input[type=range]{-webkit-appearance:none;appearance:none;width:118px;height:2px;background:var(--v-line);cursor:pointer}.knob input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:20px;background:var(--v-bone);border-radius:2px;box-shadow:0 0 10px #e6e1d659}.knob input[type=range]::-moz-range-thumb{width:10px;height:20px;border:0;background:var(--v-bone);border-radius:2px}.knob output{font-size:.62rem;letter-spacing:.14em;color:var(--v-dim);width:3ch;text-align:right;font-variant-numeric:tabular-nums}@media(max-width:860px){.face{grid-template-columns:1fr;gap:26px;padding:26px 0 24px}.meters{order:2}}@media(max-width:620px){.void{padding:20px 14px}.rig{padding:18px 18px 20px}.dial{height:120px}.station span{display:none}.readout-name{font-size:clamp(1.7rem,8vw,2.4rem)}.console{justify-content:flex-start}.knob input[type=range]{width:90px}}@media(prefers-reduced-motion:reduce){.void:after{animation:none;transform:none}.rig,.ctrl.is-hinting,.station,.readout-name.is-band-fade,.readout-pos.is-band-fade{animation:none}.dial-needle,.dial{transition:none}}
