@font-face{font-family:DM Sans;src:url(fonts/dm-sans.woff2) format('woff2');font-weight:100 1000;font-display:swap}
:root{color-scheme:dark;--bg:#141513;--panel:#222321;--text:#ddded4;--muted:#97998f;--accent:#d4bb72;--line:#353730;--green:#a0d648;--red:#ff2926;font-family:DM Sans,sans-serif;font-synthesis:none;font-size:14px}
*{box-sizing:border-box}body{margin:0;min-width:300px;background:var(--bg);color:var(--text)}button,input,summary{font:inherit}button{cursor:pointer}button,summary,input{touch-action:manipulation}button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button:disabled{opacity:.4;cursor:not-allowed}button svg,summary svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button{color:inherit}::selection{background:#d4bb72;color:#141513}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#55584e;border-radius:8px}[hidden]{display:none!important}
.studio{width:100%;min-height:100vh;min-height:100dvh;margin:0;padding:clamp(12px,1.5vw,32px);display:flex;flex-direction:column;justify-content:center}
.rack{display:flex;width:100%;position:relative;isolation:isolate;border-radius:5px;background:linear-gradient(180deg,#383a36,#20221f 70%,#292b27);box-shadow:0 27px 55px #0009,0 6px 9px #0009,inset 0 1px 1px #6a6d61,inset 0 -2px 2px #050605;overflow:hidden}.rack-ear{width:38px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;flex-direction:column;padding:28px 0 36px;background:linear-gradient(90deg,#262825,#343631 45%,#1e201c);border-right:1px solid #151712}.right-ear{border-left:1px solid #151712;border-right:0;background:linear-gradient(90deg,#1e201c,#343631 55%,#262825)}.screw{display:block;position:relative;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#5b5e56,#161814);box-shadow:0 1px 2px #000,inset 0 1px 1px #74766b}.screw:after{content:'';position:absolute;left:3px;right:3px;height:2px;top:6px;background:#0b0c09;transform:rotate(-35deg);box-shadow:0 1px 0 #65685d}.instrument{position:relative;flex:1;min-width:0;padding:14px 9px 0}.meter-unit{position:relative}.meter-pair{display:grid;grid-template-columns:1fr 1fr;gap:7px}.channel-name{display:flex;justify-content:space-between;padding:0 7px 8px;font-size:9px;color:#a4a79a;letter-spacing:.15em}.channel-name span:last-child{font-size:8px;color:#85897d}.bezel{padding:10px;background:linear-gradient(180deg,#7a7e7e,#4e5357 10%,#717576 95%,#333739);box-shadow:inset 0 1px 1px #c0c3bc,inset 0 -1px 1px #aeb2b1,0 2px 4px #000b;border:1px solid #111412}.bevel{padding:21px 23px 16px;border-style:solid;border-width:1px;border-color:#202426 #868b89 #8c9392 #202426;background:linear-gradient(145deg,#25292c 0%,#16191b 52%,#4d5357 100%);box-shadow:inset 10px 12px 15px #090b0c,inset -5px -5px 10px #62686a}.glass{background:#040605;position:relative;box-shadow:0 2px 6px #000,inset 0 1px 3px #000;aspect-ratio:560/210;overflow:hidden}.glass:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(163deg,#ffffff04,transparent 32%,transparent 80%,#ffffff02)}.glass svg{display:block;width:100%;height:100%;overflow:visible}.meter-number{font-size:9px;font-weight:600;fill:#b8b7a6}.range-text{font-size:8.5px;font-weight:600;letter-spacing:.2px;fill:#ac7b31}.face-label{font-size:15px;font-weight:450;fill:#91958c;letter-spacing:.3px}.face-brand{opacity:.83}.face-fine{font-size:9px;fill:#969b8f}.led{filter:none}
.led-housing{stroke:#1b201a;stroke-width:.55}
.led-lens{stroke:#000a;stroke-width:.65}
.led-emitter,.led-core,.led-bloom{opacity:0;transition:opacity 35ms linear;pointer-events:none}
.led-glint{opacity:.18;pointer-events:none}
.led.active .led-emitter{opacity:.94}
.led.active .led-core{opacity:.42}
.led.active .led-bloom{opacity:.34}
.led.active .led-glint{opacity:.28}
.led.peak .led-emitter{opacity:1;transition:none}
.led.peak .led-core{opacity:.85;transition:none}
.led.peak .led-bloom{opacity:.64}
.rack.off .led-emitter,.rack.off .led-core,.rack.off .led-bloom{opacity:0!important}
.hardware-controls{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(12px,1.5vw,26px);padding:27px 14px 26px}.brand-block{align-self:center;min-width:130px;width:18%;color:#a8ada1}.brand{width:100%;max-width:235px;height:auto;display:block;margin-bottom:2px}.brand-block>span{font-size:clamp(9px,1vw,13px);font-weight:500;letter-spacing:.13em;display:block;white-space:nowrap}.brand-block>small{font-size:6px;letter-spacing:.13em;display:block;margin-top:8px;color:#777e70}.switch-group{margin:0;padding:0;border:0;min-width:0}.switch-group legend{width:100%;text-align:center;margin-bottom:15px;letter-spacing:.1em;font-size:11px;color:#b4b9ac;font-weight:600}.switch-row{display:flex;gap:4px}.switch-row label{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;color:#b7bcaf;font-size:11px;line-height:1.3;min-width:0}.hardware-button{display:grid;place-items:center;width:clamp(36px,4.25vw,60px);height:clamp(36px,4.25vw,60px);border:2px solid #0b0d09;border-radius:5px;background:linear-gradient(130deg,#b9bcb3,#82867d 38%,#bdc1b7 53%,#d4d6cb 100%);box-shadow:0 3px 3px #000b,inset 0 1px 2px #f0f1e8,inset 0 -2px 2px #5a5f53;padding:0;position:relative}.hardware-button:before{content:'';position:absolute;inset:5px;border-radius:28% 28% 40% 40%;background:linear-gradient(180deg,#5d645966,#ebeee28a);box-shadow:inset 1px 2px 3px #242a2355}.hardware-button i{position:relative;width:12px;height:17px;border-radius:50%;background:#949b8a;box-shadow:inset 1px 2px 4px #3f463a,0 1px 1px #f0f2e6}.hardware-button.lit i{background:#ffe238;box-shadow:0 0 8px 4px #ffe62180,inset 0 0 4px #fff8a1}.hardware-button.lit:before{background:radial-gradient(ellipse,#e9d76680,transparent 75%),linear-gradient(180deg,#5d645966,#ebeee28a)}.hardware-button:active,.hardware-button.flash{transform:translateY(2px);box-shadow:0 1px 2px #000b,inset 0 2px 4px #4c5146}.hardware-button:hover{filter:brightness(1.1)}.indicators{align-self:center;display:flex;flex-direction:column;gap:16px;padding-bottom:9px}.indicators>div{display:flex;gap:9px;align-items:center;font-size:11px;color:#b0b6a7}.pilot{display:block;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#4b100b,#260501);border:2px solid #11160b;box-shadow:0 1px 2px #68725b55}.pilot.active{background:radial-gradient(circle at 40% 35%,#ff7b48,#ee0802 55%,#8b0a01);box-shadow:0 0 8px #f51a0c66,0 1px 2px #000}.power-block{align-self:center;text-align:center;padding-bottom:9px}.power-button{display:grid;place-items:center;border-radius:50%;width:34px;height:34px;background:linear-gradient(145deg,#42473c,#1a1e17);border:1px solid #13170f;box-shadow:0 2px 4px #000a,inset 0 1px 1px #727a66}.power-button svg{width:17px;height:17px;stroke:#676e5c}.power-button.on svg{stroke:#b0cc7f;filter:drop-shadow(0 0 3px #8da65f66)}.power-block>span{display:block;font-size:7px;letter-spacing:.08em;color:#aab29e;margin-top:12px}.rack.off .led{filter:none!important;fill:#141809!important}.rack.off .hardware-button.lit i{background:#949b8a;box-shadow:inset 1px 2px 4px #3f463a}

.utility-controls{display:flex;align-items:center;align-self:center;gap:clamp(12px,1.5vw,24px)}
.gain-knob-block{display:flex;flex-direction:column;align-items:center;gap:9px;flex-shrink:0;color:#b4b9ac}
.gain-knob-block>label{font-size:11px;font-weight:600;letter-spacing:.1em}
.gain-knob-block output{font-size:11px;font-variant-numeric:tabular-nums;min-width:48px;text-align:center;color:#d0d4c8}
.gain-knob{position:relative;width:48px;height:48px;border-radius:50%;background:linear-gradient(145deg,#10120e,#4b5044);box-shadow:0 3px 5px #000b,inset 0 1px 1px #666e5b;padding:4px;--angle:0deg}
.knob-cap{position:relative;width:100%;height:100%;border-radius:50%;border:2px solid #141711;background:radial-gradient(circle at 37% 28%,#555a50,#292d25 60%,#13170f 90%);box-shadow:inset 0 1px 2px #8b9182,inset 0 -2px 3px #000;transform:rotate(var(--angle))}
.knob-cap i{position:absolute;top:3px;left:calc(50% - 1.5px);width:3px;height:12px;border-radius:1px;background:#d3d7c5;box-shadow:0 1px 1px #000}
.gain-knob input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ns-resize;touch-action:none}
.gain-knob:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:5px}
.gain-knob:hover .knob-cap{filter:brightness(1.12)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mic-notice{position:absolute;z-index:3;left:50%;top:30px;transform:translateX(-50%);width:min(430px,calc(100% - 24px));display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 22px;background:#181b16f5;border:1px solid #646a59;box-shadow:0 5px 18px #000b;text-align:center;font-size:12px;line-height:1.5;color:#c6ccbc}
.mic-notice strong{font-weight:500;color:#e2e5d9}.mic-notice #message{color:#e5bd80}.mic-notice #message:empty{display:none}
.activation-button{padding:10px 16px;min-height:44px;border:1px solid #8b7d51;border-radius:4px;background:#2b291f;color:#e3ce91;font-size:13px}.activation-button:hover{background:#393526;border-color:#d4bb72}
.meter-pair.mono{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.meter-pair.mono .glass{aspect-ratio:560/180}
.meter-readouts{display:flex;flex-wrap:wrap;gap:10px 20px;padding:14px 12px 0}
.meter-readouts:not(:has(> :not([hidden]))){display:none}
.face-panel{display:flex;flex:1 1 240px;min-width:0;align-items:center;justify-content:center;gap:14px;padding:9px 12px;background:#040605;color:#b9c1ae;font-size:11px;min-height:38px}
.face-panel>span:first-child{font-size:9px;letter-spacing:.1em}.face-panel output,.face-panel b{font-variant-numeric:tabular-nums;color:#e4d5a7;font-weight:500}
.phase-scale{display:flex;gap:8px;align-items:center;flex:1;max-width:180px}.phase-track{height:3px;flex:1;position:relative;background:linear-gradient(90deg,#843c2b 0 49%,#6b7860 50%,#a3ba6f)}.phase-track:before{content:'';position:absolute;left:50%;top:-3px;height:9px;width:1px;background:#d1d7c4}.phase-track i{position:absolute;left:50%;top:-4px;width:2px;height:11px;background:#f5e3ad;transition:left 100ms}
@media(min-width:1101px){
 .instrument{padding:clamp(14px,1.1vw,28px) clamp(9px,.7vw,18px) 0}
 .rack-ear{width:clamp(30px,2.5vw,64px)}
 .channel-name{font-size:clamp(10px,.65vw,16px);padding-bottom:clamp(8px,.6vw,15px)}
 .channel-name span:last-child{font-size:clamp(9px,.55vw,14px)}
 .bezel{padding:clamp(10px,.7vw,18px)}
 .bevel{padding:clamp(16px,1.2vw,30px) clamp(20px,1.4vw,36px) clamp(14px,1vw,26px)}
 .hardware-controls{gap:clamp(20px,2.8vw,80px);padding:clamp(25px,1.8vw,46px) clamp(14px,1.2vw,30px)}
 .brand{max-width:320px}.brand-block>span{font-size:clamp(12px,.7vw,18px)}.brand-block>small{font-size:clamp(7px,.4vw,10px)}
 .switch-group legend{font-size:clamp(11px,.65vw,16px);margin-bottom:clamp(14px,.9vw,23px)}
 .switch-row{gap:clamp(4px,.3vw,8px)}.switch-row label{font-size:clamp(11px,.65vw,16px);gap:clamp(10px,.65vw,16px)}
 .hardware-button{width:clamp(48px,3.2vw,88px);height:clamp(48px,3.2vw,88px)}
 .hardware-button i{width:clamp(12px,.7vw,18px);height:clamp(17px,1vw,26px)}
 .utility-controls{gap:clamp(16px,1.6vw,40px)}
 .gain-knob{width:clamp(48px,2.8vw,72px);height:clamp(48px,2.8vw,72px)}
 .gain-knob-block>label,.gain-knob-block output,.indicators>div{font-size:clamp(11px,.65vw,16px)}
 .pilot{width:clamp(16px,1vw,24px);height:clamp(16px,1vw,24px)}
 .power-button{width:clamp(34px,2vw,50px);height:clamp(34px,2vw,50px)}.power-block>span{font-size:clamp(8px,.45vw,11px)}
}
@media(max-width:1100px){.rack-ear{width:25px}.instrument{padding:12px 6px 0}.bezel{padding:7px}.bevel{padding:15px 15px 11px}.hardware-controls{gap:13px;padding:22px 8px}.brand-block{min-width:110px;width:17%}.brand-block>small{font-size:5px}.hardware-button{width:40px;height:40px}.utility-controls{gap:12px}.indicators>div{font-size:9px;gap:5px}.pilot{width:14px;height:14px}.power-button{width:28px;height:28px}.gain-knob{width:44px;height:44px}}
@media(max-width:800px){.studio{padding-top:30px}.rack-ear{width:19px}.screw{width:10px;height:10px}.screw:after{left:2px;right:2px;top:4px}.brand-block{display:none}.hardware-controls{justify-content:space-around;gap:12px;padding:22px 6px}.hardware-button{width:36px;height:36px}.utility-controls{gap:8px}.face-panel{gap:8px;font-size:10px;padding:7px 9px;min-height:30px}}
@media(max-width:650px){.studio{padding:26px 14px 25px}.rack-ear{width:17px;padding:20px 0}.instrument{padding:12px 5px 0}.meter-pair{grid-template-columns:1fr;gap:16px}.channel-name{font-size:8px;padding-bottom:7px}.channel-name span:last-child{font-size:7px}.bezel{padding:7px}.bevel{padding:15px 16px 11px}.hardware-controls{display:grid;grid-template-columns:1fr 1fr;gap:22px 12px;padding:24px 9px 22px}.switch-group legend{font-size:9px;margin-bottom:12px}.switch-row{justify-content:center;gap:4px}.hardware-button{width:clamp(32px,11vw,41px);height:clamp(32px,11vw,41px)}.switch-row label{font-size:10px;gap:7px}.mode-group{grid-column:1}.utility-controls{display:grid;grid-template-columns:48px 1fr;gap:8px 10px;justify-self:center;align-self:start}.gain-knob-block{grid-column:1;grid-row:1 / 3;gap:7px}.gain-knob-block>label{font-size:9px}.gain-knob-block output{font-size:10px}.indicators{grid-column:2;grid-row:1;gap:8px;padding:0;margin-top:6px}.indicators>div{font-size:9px;gap:5px}.power-block{grid-column:2;grid-row:2;padding:0;justify-self:center}.power-button{width:28px;height:28px}.power-block>span{font-size:6px;margin-top:5px}.face-panel{font-size:11px}.mic-notice{top:35px;padding:14px}}
@media(prefers-reduced-motion:reduce){.led-emitter,.led-core,.led-bloom,.phase-track i{transition:none}*,*:before,*:after{scroll-behavior:auto!important}}

.screen-button{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#adb4a1}
.screen-button svg{width:16px;height:16px}.screen-button:hover{color:#e0e4d6;background:#ffffff08}

/* The chassis fills the dynamic viewport; the meter geometry keeps its proportions. */
@media(max-width:700px),(max-width:1100px) and (max-height:600px),(pointer:coarse) and (max-width:1400px),(display-mode:standalone){
 html{background:#222321;overscroll-behavior:none}
 body{min-width:320px;background:#222321}
 .studio{max-width:none;width:100%;height:100vh;height:100dvh;min-height:280px;margin:0;padding:0}
 .rack{width:100%;height:100%;border-radius:0;box-shadow:inset 0 1px 1px #6a6d61,inset 0 -2px 2px #050605;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
 .rack-ear{width:12px;padding:20px 0}
 .screw{width:9px;height:9px}.screw:after{left:2px;right:2px;top:3px}
 .instrument{display:flex;flex-direction:column;gap:14px;padding:12px 6px 0;min-height:0}
 .meter-pair{flex:1;min-height:0;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}
 .meter-unit{display:flex;flex-direction:column;min-width:0;min-height:0}
 .channel-name{flex-shrink:0;padding:0 6px 7px;font-size:9px}.channel-name span:last-child{font-size:8px}
 .bezel{flex:1;min-height:0;display:grid;padding:7px}
 .bevel{display:grid;min-height:0;padding:clamp(10px,2vh,18px) clamp(12px,2vw,20px)}
 .glass,.meter-pair.mono .glass{width:100%;height:100%;min-height:0;aspect-ratio:auto}
 .brand-block{display:none}
 .hardware-controls{display:flex;flex-shrink:0;align-items:center;justify-content:space-around;gap:12px;padding:0 8px 14px}
 .switch-group legend{font-size:11px;margin-bottom:10px}
 .switch-row{justify-content:center;gap:4px}.switch-row label{font-size:11px;gap:7px}
 .hardware-button{width:44px;height:44px;min-width:44px;min-height:44px}
 .utility-controls{display:flex;align-items:center;gap:12px;align-self:center}
 .gain-knob-block{gap:5px}.gain-knob-block>label{font-size:11px}.gain-knob-block output{font-size:11px}
 .gain-knob{width:44px;height:44px}
 .indicators{gap:12px;padding:0;margin:0;align-self:center}.indicators>div{font-size:10px;gap:6px}.pilot{width:14px;height:14px}
 .power-block{padding:0;align-self:center}.power-button{width:44px;height:44px}.power-block>span{font-size:8px;margin-top:7px}
 .screen-button{display:flex;margin-top:1px}
 .mic-notice{top:24px;max-height:calc(100% - 48px);overflow:auto;overscroll-behavior:contain}
 .meter-readouts{flex-shrink:0;padding:0 8px;gap:8px}.face-panel{min-height:32px;padding:7px 9px}
}
@media(max-width:700px) and (orientation:portrait),(pointer:coarse) and (max-width:1400px) and (orientation:portrait),(display-mode:standalone) and (orientation:portrait){
 .studio{min-height:520px}
 .meter-pair{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:14px}
 .hardware-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px;padding:2px 4px 14px}
 .mode-group{grid-column:1;align-self:center}
 .utility-controls{display:grid;grid-template-columns:48px auto;gap:10px 12px;justify-self:center;align-self:center}
 .gain-knob-block{grid-column:1;grid-row:1 / 3}
 .indicators{grid-column:2;grid-row:1;align-self:end}
 .power-block{grid-column:2;grid-row:2;justify-self:center;align-self:start}
}
@media(max-width:350px) and (orientation:portrait){
 .rack-ear{width:8px}.instrument{padding-left:4px;padding-right:4px;gap:10px}
 .hardware-controls{padding-left:0;padding-right:0;gap:14px 8px}
 .switch-group legend{font-size:10px}.switch-row label{font-size:10px}
 .utility-controls{gap:8px}
}
@media(max-width:650px) and (orientation:landscape){
 .instrument{gap:8px;padding-top:8px}.bevel{padding:8px 10px}
 .hardware-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 0 8px}
 .mode-group{grid-column:auto}
 .utility-controls{grid-column:1 / -1;display:flex;justify-self:stretch;justify-content:center;gap:24px}
 .gain-knob-block{display:grid;grid-template-columns:auto 44px 48px;gap:8px;align-items:center}
 .screen-button{margin:0}.indicators{flex-direction:row}
 .power-block{display:flex;align-items:center;gap:7px}.power-block>span{margin:0}
 .switch-group legend{font-size:10px;margin-bottom:5px}.switch-row label{font-size:10px;gap:4px}
}
