:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#0a0908;color:#d4ccbf;--amber:#e8a35c}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 48%,#25201955,transparent 65%);min-height:100svh}button,input,summary{touch-action:manipulation}button{font:inherit;cursor:pointer}main{max-width:1320px;margin:auto;padding:32px 48px}.masthead{display:flex;justify-content:space-between;font-size:10px;letter-spacing:2.5px;color:#8b8276;border-bottom:1px solid #28231e;padding-bottom:23px}i{font-style:normal;color:#795538;margin:0 10px}.intro{text-align:center;margin:65px 0 38px}.eyebrow{font-size:9px;letter-spacing:3px;color:#ba8254}h1{font-family:Georgia,serif;font-weight:normal;font-size:clamp(26px,3.5vw,46px);letter-spacing:-1px;margin:17px 0}.intro>p:last-child{font-size:12px;color:#8d877e;letter-spacing:.8px}.radio{position:relative;width:100%;aspect-ratio:2067/761;container-type:inline-size;filter:drop-shadow(0 22px 20px #0009);user-select:none}.master{display:block;width:100%;height:100%;pointer-events:none}.dial{position:absolute;left:21.3%;top:27.2%;width:57.7%;height:27.7%;overflow:hidden;border-radius:1%;background:repeating-linear-gradient(0deg,#100c07 0px,#0b0906 2px,#0d0905 3px);box-shadow:inset 0 5px 14px #000,inset 0 1px 1px #9a542c55;color:#745335;text-shadow:0 0 3px #000;font-family:'Arial Narrow',Impact,sans-serif;font-stretch:condensed;transition:color .2s}.am,.fm{position:absolute;display:flex;align-items:center;justify-content:space-between;left:5%;right:9%;font-size:2.3cqw;line-height:1}.am{top:12%}.fm{bottom:12%;right:19%}.am b,.fm b{font-weight:normal;font-size:2.3cqw;margin-right:2%}.ticks{position:absolute;left:22%;right:12%;top:40%;height:16%;background:repeating-linear-gradient(90deg,#9f7952 0 1px,transparent 1px 1.5%)}.ticks:after{content:'';position:absolute;inset:-45% 0 0;background:repeating-linear-gradient(90deg,#ae8053 0 1.5px,transparent 1.5px 8.33%)}.dial-line{position:absolute;top:59%;left:1%;right:1%;height:1px;background:#8f542b;box-shadow:0 1px 1px #d08c5555}.needle{position:absolute;top:5%;height:94%;left:55%;width:.23cqw;background:#754026;opacity:.65;box-shadow:0 0 5px #753b18;transform:translateX(-50%)}.logo{position:absolute;right:1.5%;bottom:3%;font-size:.85cqw;letter-spacing:.15cqw;color:#45423d;opacity:.65}.scan-mark{display:none;position:absolute;right:1%;top:12%;font-size:.7cqw}.radio.on .dial{color:#f3b575;text-shadow:0 0 6px #ff8c3544}.radio.on .needle{background:#fff5ba;box-shadow:0 0 3px 2px #ffb03c,0 0 12px 3px #ff5b13;opacity:1}.radio.unlocked .scan-mark{display:block}.radio:not(.on) .master{filter:brightness(.6)}.knob{position:absolute;width:13.8%;aspect-ratio:1;top:30.4%;border-radius:50%}.volume-knob{left:2.9%}.tuning-knob{right:1.9%}.knob-picture{position:absolute;inset:0;border-radius:50%;background-image:url('assets/radio-master.png');background-size:724.64% auto;box-shadow:0 2px 6px #000;pointer-events:none}.volume-knob .knob-picture{background-position:3.36% 48.64%}.tuning-knob .knob-picture{background-position:97.8% 48.64%}.knob input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ns-resize;touch-action:none;margin:0}.knob:focus-within{outline:2px solid var(--amber);outline-offset:6px}.presets{position:absolute;left:26.2%;right:26.9%;top:65.5%;height:9.5%;display:flex;gap:3.2%}.presets button{width:17.44%;border:0;border-radius:4px;color:#6f6659;background:transparent;font-size:.7cqw;text-shadow:0 1px #000;min-width:0}.presets button:hover{background:#e7aa5b12;color:#e0c29d}.presets button:active,.presets button.active{box-shadow:inset 0 3px 6px #000;background:#0005;color:#d6a56d}.presets button.holding{box-shadow:inset 0 -3px #b67b41}.console{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #302820;margin:22px 3% 0;padding:0 0 23px}.power{background:#15120f;border:1px solid #473729;border-radius:4px;padding:15px;font-size:10px;letter-spacing:1.6px;color:#c5b9a8;display:flex;gap:12px;align-items:center;min-height:44px}.power-led{width:5px;height:5px;border-radius:50%;background:#6c4b2f}.power[aria-pressed=true] .power-led{background:#f0b16d;box-shadow:0 0 8px #f0a65c}.readout{text-align:center;display:flex;flex-direction:column;gap:8px;min-width:130px}#frequency{font:20px 'Courier New',monospace;color:#e6b47d}#station{font-size:9px;letter-spacing:2px;color:#a29581}.squelch{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:9px;letter-spacing:1.5px;color:#958773;width:160px}.squelch input{grid-row:2;grid-column:1/3;width:100%;accent-color:#af7b4e;height:24px;margin:0}.squelch output{font-variant-numeric:tabular-nums}.hint,.status{text-align:center;font-size:11px;color:#8b8173;line-height:1.6}.hint{margin-top:22px}.status{min-height:18px;color:#c79d70}.transmission{max-width:680px;margin:24px auto;background:#18140f;border-left:2px solid #b38352;padding:18px 22px}.transmission>span{font-size:9px;letter-spacing:2px;color:#bc8e5c}.transmission p{line-height:1.7;font-family:Georgia,serif;font-size:16px;margin-bottom:0}details{max-width:680px;margin:28px auto;font-size:12px;line-height:1.8;color:#a09586}summary{cursor:pointer;text-align:center;color:#c0ad94;padding:10px}footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#706457;padding:25px 0 10px}button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid #f1b46f;outline-offset:4px}button:hover{border-color:#a37a50}[hidden]{display:none!important}
@media(max-width:650px){main{padding:20px 12px}.masthead{font-size:8px;letter-spacing:1px}.intro{margin:45px 0 26px}.eyebrow{font-size:8px;letter-spacing:1.5px}.console{gap:10px;flex-wrap:wrap;margin:16px 2% 0}.power{padding:12px 10px;font-size:9px}.readout{min-width:100px}#frequency{font-size:17px}#station{font-size:8px;letter-spacing:1px}.squelch{width:100%;grid-template-columns:1fr auto}.hint{max-width:300px;margin:18px auto;font-size:10px}.presets{height:13%;top:63.5%}.presets button{font-size:1.1cqw;min-height:24px}.knob{min-height:44px}footer{font-size:7px;letter-spacing:1px}.radio{margin:0}.transmission{padding:15px}.transmission p{font-size:15px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
body.embed{background:transparent;min-height:0}body.embed main{max-width:1200px;padding:10px}body.embed .masthead,body.embed .intro,body.embed footer{display:none}body.embed details{margin:10px auto}body.embed .console{margin-top:10px}
/* Rotate only the inset knob faces; the chrome mounting rings remain fixed. */
.knob{width:10.5%;top:33.4%}.volume-knob{left:2.6%}.tuning-knob{right:2.2%}.knob-picture{background-size:952.381% auto}.volume-knob .knob-picture{background-position:2.905% 46.73%}.tuning-knob .knob-picture{background-position:97.542% 46.73%}
@media(max-width:650px){.knob{min-height:0}.knob input{inset:-12%;width:124%;height:124%}}
/* Keep the printed FM graduations mathematically aligned with the needle. */
.fm{left:0;right:0;height:22%;bottom:10%;display:block}.fm b,.fm span{position:absolute;top:0;transform:translateX(-50%) scaleX(.78);transform-origin:center}.fm b{left:8%}.fm span:nth-of-type(1){left:19%}.fm span:nth-of-type(2){left:30.8%}.fm span:nth-of-type(3){left:42.6%}.fm span:nth-of-type(4){left:54.4%}.fm span:nth-of-type(5){left:66.2%}.fm span:nth-of-type(6){left:78%}
@media(max-width:650px){.knob input{inset:auto;left:50%;top:50%;width:124%;height:124%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}.presets button{font-size:7px}}
/* Hardware-only embedding: crop the master to its bezel; no surrounding page UI. */
html.hardware-root,body.hardware{background:transparent;min-height:0;margin:0;overflow:hidden}
body.hardware main{max-width:none;padding:0;margin:0}
body.hardware .player{position:relative;overflow:hidden;padding:0;margin:0}
body.hardware .masthead,body.hardware .intro,body.hardware footer,body.hardware details{display:none}
body.hardware .radio{margin-top:-4.4%;margin-bottom:-5.0%;clip-path:inset(12% 0 13.6% round 1%);filter:none}
body.hardware .console,body.hardware .hint,body.hardware>.status,body.hardware .player>.status,body.hardware .transmission{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap;border:0!important}
body.hardware .power{position:absolute;left:4%;top:74%;min-height:24px;padding:2px 5px;font-size:clamp(6px,.9cqw,11px);letter-spacing:.05em;background:#080808;border:1px solid #41352a;gap:5px;z-index:3}
body.hardware .squelch{position:absolute;right:3%;top:72%;width:12%;gap:0;font-size:clamp(6px,.7cqw,10px);letter-spacing:0;z-index:3}
body.hardware .squelch input{height:24px}body.hardware .squelch output{display:none}
body.hardware .presets button{font-size:clamp(7px,.7cqw,11px)}
