/* Version 2.2: defined studio deck and full-width, audio-driven VU-style meters. */
.receiver{background:linear-gradient(140deg,#202c35 0%,#131e27 48%,#0b151d 100%);border-color:#4b5a66;border-top-color:#d79d46;box-shadow:0 16px 40px #0006,inset 0 1px #ffffff12}
.brand{padding-bottom:15px}.brand h1{color:#eff4f7;letter-spacing:.2px}.brand .eyebrow{color:#bba17b;letter-spacing:2px}
.audio-panel{padding-top:14px}
.station-line{display:block;padding:12px;background:linear-gradient(180deg,#081018,#101c25);border:1px solid #52606b;border-radius:6px;box-shadow:inset 0 2px 7px #0009,0 1px #ffffff0b;min-width:0}
.station-copy{display:grid;grid-template-columns:64px minmax(0,1fr);gap:5px 14px;min-width:0;align-items:center}
.show-art{width:64px;height:64px;border:1px solid #67717a;border-radius:3px;box-shadow:0 3px 8px #0008;grid-column:1;grid-row:1/3}
.badge{font-size:12px;letter-spacing:1.8px;align-self:end;color:#a6b6c3;grid-column:2;grid-row:1;line-height:1.3}
.station-copy p{font-size:17px;color:#d4e4ee;line-height:1.35;max-width:none;margin:0;align-self:start;grid-column:2;grid-row:2;overflow-wrap:anywhere}
.meters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:13px;width:100%;margin:16px 0 0;flex:none}
.meter-unit{min-width:0}.meter-bezel{padding:5px;border-radius:8px;background:linear-gradient(135deg,#697680 0%,#303c46 22%,#111a22 56%,#495560 100%);border:1px solid #61707b;box-shadow:0 5px 9px #0006,inset 0 1px #ffffff24}
.meter{display:block;width:100%;height:auto;aspect-ratio:320/190;border:1px solid #010305;border-radius:5px;box-shadow:inset 0 2px 10px #000;background:#060a0d;overflow:hidden}
.meter .meter-face{stroke:#2c3a45;stroke-width:1}.meter .scale-rail{fill:none;stroke:#d5dee4;stroke-width:1.9}
.meter .scale-red{fill:none;stroke:#eb574d;stroke-width:4.3}
.meter .scale-tick{fill:none;stroke:#c4d0d9;stroke-width:1.3}.meter .scale-tick.major{stroke:#f0f4f7;stroke-width:2}.meter .scale-tick.hot{stroke:#f0695f}
.meter text{text-anchor:middle;dominant-baseline:middle;font-family:Barlow,Arial,sans-serif}
.meter .scale-number{fill:#f2f6f8;font-size:15px;font-weight:600;letter-spacing:0}.meter .scale-number.hot{fill:#f7786d}
.meter .vu-word{fill:#d7e3ec;font-size:24px;font-weight:600;letter-spacing:3px}.meter .meter-calibration{fill:#8fabbc;font-size:10px;letter-spacing:1.8px}
.meter .needle,.meter .needle-shadow{fill:none;transform-origin:160px 176px;transform-box:view-box;transition:transform .15s ease-out;stroke-linecap:round}
.meter .needle{stroke:#fcfeff;stroke-width:2.4;filter:drop-shadow(0 0 2px #9bd2f057)}
.meter .needle-shadow{stroke:#000;stroke-width:4;opacity:.8}
.meter .needle-hub-outer{fill:#202c35;stroke:#738390;stroke-width:1}.meter .needle-hub{fill:#d1dbe1}.meter .glass-sheen{pointer-events:none}
.meter-caption{display:flex;justify-content:space-between;gap:6px;margin-top:7px;color:#a0b5c3;font-size:11px;font-weight:600;letter-spacing:1.2px}
.meter-caption output{color:#c5d5df;letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:12px;font-weight:400}
.transport{display:grid;grid-template-columns:145px minmax(0,1fr);gap:16px;align-items:center;margin-top:15px;padding:12px;background:linear-gradient(180deg,#23303b,#131f28);border:1px solid #44525e;border-radius:6px;box-shadow:inset 0 1px #ffffff10,0 3px 8px #0003}
button.primary{display:flex;align-items:center;justify-content:center;gap:11px;min-width:0;min-height:53px;padding:10px 12px;font-size:16px;border-radius:5px;color:#151c20;background:linear-gradient(#ffc56a,#dfa14b);border:1px solid #e3b56f;box-shadow:0 2px 0 #73572e,0 3px 6px #0007,inset 0 1px #ffeac1}
button.primary:hover:not(:disabled){background:linear-gradient(#ffd693,#efb55b);border-color:#ffdda1}.play-symbol{font-size:23px;line-height:1}button.primary:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px #73572e}
.listening-controls{min-width:0}.volume-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.volume-heading label{font-size:11px;letter-spacing:1.5px;color:#b8c9d4;font-weight:600}.volume-heading #volumeValue{width:auto;color:#e7bf80;font-size:13px;font-variant-numeric:tabular-nums}
.volume-controls{display:flex;align-items:center;gap:10px;min-width:0}.volume-controls #volume{appearance:none;-webkit-appearance:none;width:100%;height:6px;margin:0;border:1px solid #4b5a64;border-radius:4px;background:linear-gradient(#02070a,#111b23);box-shadow:inset 0 1px 2px #000;cursor:pointer;min-width:0}
#volume::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:22px;border:1px solid #8b9ba6;border-radius:3px;background:linear-gradient(90deg,#5b6b77,#e3e9ee 47%,#8899a5);box-shadow:0 2px 4px #0009;cursor:pointer}
#volume::-moz-range-thumb{width:13px;height:20px;border:1px solid #8b9ba6;border-radius:3px;background:linear-gradient(90deg,#5b6b77,#e3e9ee 47%,#8899a5);box-shadow:0 2px 4px #0009;cursor:pointer}
.volume-controls #mute{padding:6px;display:grid;place-items:center;flex:none;width:35px;height:34px;min-height:34px;color:#bed2df;border:1px solid #495a66;border-radius:4px;background:#0b1720;box-shadow:inset 0 1px #ffffff08}
#mute svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}#mute .speaker-cross{display:none}#mute[aria-pressed=true]{color:#efb36e;border-color:#ad7f44}#mute[aria-pressed=true] .speaker-cross{display:block}#mute[aria-pressed=true] .speaker-waves{display:none}
.stream-buttons{gap:10px;margin-top:12px}.stream-buttons button{display:flex;align-items:center;justify-content:center;gap:8px;border-color:#485967;background:linear-gradient(#172630,#0d1922);box-shadow:inset 0 1px #ffffff0a;font-size:14px;min-height:36px;border-radius:4px}
.stream-buttons button:before{content:'';width:5px;height:5px;border-radius:50%;background:#63727d;box-shadow:inset 0 1px 2px #0008}.stream-buttons button[aria-pressed=true]{color:#f4c47e;background:#47382250;border-color:#a77d45}.stream-buttons button[aria-pressed=true]:before{background:#edb764;box-shadow:0 0 6px #e9a34860}
.status{margin:11px 2px 10px;color:#9eb4c3;font-size:14px;line-height:1.4}.status.error{color:#efb971}.audio-panel .alternate-player{margin-left:2px}
@media(min-width:720px){.receiver{gap:0 24px;grid-template-columns:minmax(0,1fr) minmax(280px,38%);padding:20px}.brand{padding:7px 5px 15px;gap:20px}.station-logo{width:176px}.brand h1{font-size:25px}.audio-panel{padding:14px 5px 0}.station-copy{grid-template-columns:64px minmax(0,1fr);gap:5px 14px}.station-copy p{font-size:19px}.badge{font-size:12px}.meters{margin-top:15px}.meter{width:100%;height:auto}.picture-panel{align-self:stretch;display:flex;flex-direction:column;justify-content:center}.picture-panel .screen{max-height:none;flex:none;width:100%;aspect-ratio:4/3}.picture-panel .section-head{margin-bottom:12px}.picture-panel .picture-actions{margin-top:3px}footer{padding:8px 5px 2px}}
@media(max-width:719px){.audio-panel{padding:12px 14px 0}.brand{gap:14px}.live-identity{margin-left:auto}.station-logo{width:156px}.meters{gap:10px;margin-top:14px}.meter-caption{font-size:10px;letter-spacing:.5px}.meter-caption output{font-size:11px}.transport{grid-template-columns:130px minmax(0,1fr);gap:12px;padding:10px;margin-bottom:0}.picture-panel{margin-top:8px}}
@media(max-width:400px){.brand{padding:14px 12px}.station-logo{width:135px}.live-identity{margin-left:0}.brand h1{font-size:18px}.brand .eyebrow{font-size:10px;letter-spacing:1.5px}.audio-panel{padding:11px 10px 0}.station-line{padding:9px}.station-copy{grid-template-columns:52px minmax(0,1fr);gap:5px 11px}.show-art{width:52px;height:52px}.station-copy p{font-size:15px}.badge{font-size:11px}.meters{gap:8px}.meter-bezel{padding:3px;border-radius:5px}.meter-caption{font-size:9px;gap:2px;letter-spacing:.3px}.meter-caption output{font-size:10px}.transport{grid-template-columns:1fr;gap:14px;padding:10px}button.primary{min-height:47px;font-size:16px}.listening-controls{padding:0 2px 3px}.volume-heading label{font-size:11px}.stream-buttons{gap:7px}.stream-buttons button{font-size:13px}.status{font-size:13px}}
@media(prefers-reduced-motion:reduce){.meter .needle,.meter .needle-shadow{transition:none}}
