:root{color-scheme:dark;--cream:#d6c3a0;--brass:#b49258;--ink:#16140f}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 25%,#383126 0,#191713 48%,#0c0d0c 100%);color:var(--cream);font-family:Georgia,'Times New Roman',serif;min-height:100svh}main{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:24px 20px 15px}.scene{width:min(1020px,100%);margin:0 auto;filter:drop-shadow(0 30px 25px #0009)}.radio{position:relative;width:100%;aspect-ratio:1.4;user-select:none;container-type:inline-size}.cabinet{position:absolute;width:100%;height:100%;object-fit:fill;pointer-events:none}.lamp{position:absolute;left:14%;top:54%;width:72%;height:23%;background:radial-gradient(ellipse,#e9a44345,#c27c161c 48%,transparent 75%);opacity:0;transition:opacity .7s;mix-blend-mode:screen;pointer-events:none}.on .lamp{opacity:1}.dial{position:absolute;left:29.5%;width:41%;top:56%;height:13%;color:#b49a62;filter:brightness(.58);transition:filter .7s;text-shadow:0 1px #000;font-family:Georgia,serif}.on .dial{filter:brightness(1.25);text-shadow:0 0 9px #eab35a55}.scale{position:absolute;left:7%;width:91%;height:38%;border-top:1px solid #927a4644;border-bottom:1px solid #927a4677}.scale:first-child{top:2%}.scale:nth-child(2){top:47%}.tick{position:absolute;top:0;width:1px;height:23%;background:#b99d66}.tick.major{height:33%}.tick b{position:absolute;top:120%;left:0;transform:translateX(-50%);font-size:1.02cqw;font-weight:normal;white-space:nowrap}.scale-name{position:absolute;left:-7%;font-size:.85cqw;letter-spacing:.08em}.fm-name{top:14%}.am-name{top:59%}.scale.inactive{opacity:.42}.needle{position:absolute;left:7%;top:-5%;height:92%;width:2px;background:#df873b;box-shadow:0 0 5px #ff9c3370;pointer-events:none}.dial-signature{position:absolute;top:98%;left:12%;width:85%;text-align:center;font-size:.55cqw;letter-spacing:.22em;white-space:nowrap;color:#a98b54}.engraving{position:absolute;color:#b8a06e;letter-spacing:.12em;font-size:.78cqw;text-align:center;pointer-events:none;text-shadow:0 1px 2px #000}.volume-label{left:15.1%;top:57%;width:14%}.tuning-label{left:71%;top:57%;width:14%}.tone-label{left:33%;top:72%;width:6%}.knob{position:absolute;border-radius:50%;cursor:ns-resize;touch-action:none;background:radial-gradient(circle at 40% 30%,#27231b,#080908 70%);box-shadow:2px 7px 7px #000d,-1px -1px 2px #f1c57c55;outline-offset:6px}.volume-knob{left:17.3%;top:61%;width:10.2%;aspect-ratio:1}.tuning-knob{left:73%;top:61%;width:10.2%;aspect-ratio:1}.knob-face{position:absolute;inset:5%;border-radius:50%;background:radial-gradient(circle at 35% 25%,#b89555aa,transparent 46%),radial-gradient(circle,#5a4328 0,#8a6b37 58%,#d4b06b 61%,#58462b 64%,transparent 65%),repeating-conic-gradient(#9d804a 0deg 2deg,#3a2d1a 2deg 5deg);box-shadow:inset 1px 2px 2px #f2cf8b66,inset -2px -3px 5px #000b;display:block;transform:rotate(var(--angle,0deg))}.knob-face:after{content:'';position:absolute;inset:14%;border-radius:50%;border:1px solid #d0ad6244;background:radial-gradient(ellipse at 35% 30%,#c7a76b33,transparent 70%)}.knob-face i{position:absolute;top:13%;left:48%;width:4%;height:14%;background:#ead6a2;border-radius:2px;box-shadow:0 1px 2px #000}.tone-knob{left:34%;top:75%;width:3.5%;aspect-ratio:1}.band-keys{position:absolute;left:44%;top:74%;width:13%;height:6%;display:flex;gap:3%}.band-key{width:50%;border:1px solid #bba77b;border-radius:3px 3px 5px 5px;background:linear-gradient(#e3dac3,#b6a88b 85%,#74664e);box-shadow:0 5px 3px #0009,inset 0 1px #fff9;color:#3d3322;font:bold .95cqw Georgia;cursor:pointer;transition:transform .12s,filter .12s}.band-key[aria-pressed=true]{transform:translateY(4px);filter:brightness(.78);box-shadow:0 1px 3px #0009,inset 0 2px 3px #0004}.badge{position:absolute;left:40%;top:86%;width:20%;height:6%;border:2px solid #806132;border-radius:5px;background:linear-gradient(130deg,#c2a166,#59462a 45%,#997c46);color:#e3d1a0;text-shadow:0 1px 2px #000;box-shadow:0 2px 5px #0008,inset 0 0 0 3px #181b1888;font-family:Georgia;cursor:default}.badge span{display:block;font-size:1.35cqw;letter-spacing:.1em}.badge small{font-size:.48cqw;letter-spacing:.28em;display:block;margin-top:2%}.utility{display:flex;gap:14px;align-items:center;justify-content:center;margin-top:24px;font:11px system-ui;letter-spacing:.12em;text-transform:uppercase;color:#9a8f7c}.utility button{font:inherit;text-transform:inherit;letter-spacing:inherit;background:none;border:0;color:inherit;cursor:pointer;padding:10px}.utility button:hover{color:#f5d99c}.utility-dot{opacity:.3}.notice{min-height:20px;text-align:center;font:12px system-ui;color:#ae9b7b;margin:4px 0}.zoomed .scene{overflow:hidden;max-width:900px;aspect-ratio:1.35}.zoomed .radio{width:170%;margin-left:-35%;margin-top:-63%}.zoomed main{justify-content:center}.zoomed .scene{filter:none}.zoomed .tone-knob{min-width:44px;min-height:44px}.zoomed .band-key{min-height:44px}.zoomed .engraving{font-size:.85cqw}
button,input,select{font:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button:focus-visible,[tabindex]:focus-visible,a:focus-visible{outline:2px solid #e2c38a;outline-offset:4px}dialog{background:#211e18;color:#e3d7bd;border:1px solid #6c5a38;border-radius:10px;padding:32px;max-width:600px;width:calc(100% - 32px);box-shadow:0 30px 100px #000c;max-height:90svh;overflow:auto}dialog::backdrop{background:#080806cc;backdrop-filter:blur(5px)}dialog h1{font-weight:normal;font-size:36px;margin:10px 0 22px}dialog h2{font-weight:normal}dialog p,dialog dd{line-height:1.65;font-size:15px}dialog dt{margin-top:16px;font-weight:bold;color:#d3b77f}dialog dd{margin:5px 0;color:#c2b7a0}.eyebrow{font:10px system-ui!important;letter-spacing:.23em;color:#b39863}.muted{color:#ad9f86;font:13px/1.6 system-ui!important}.close{float:right;border:0;background:none;color:#caba98;font:26px system-ui;cursor:pointer}dialog button,.file-button,dialog a{border:1px solid #6b5b3e;background:#332d21;color:#decda9;border-radius:5px;padding:10px 14px;cursor:pointer;font:13px system-ui;text-decoration:none}dialog .primary{background:#b69a63;color:#19160e;border-color:#b69a63;font-weight:600}dialog label{display:flex;flex-direction:column;gap:7px;font:12px system-ui;color:#c2b18e}dialog input:not([type=checkbox]),dialog select{width:100%;background:#16140f;color:#e3d7bd;border:1px solid #60543c;padding:10px;border-radius:4px;min-width:0}dialog input[type=checkbox]{accent-color:#b69a63}dialog .check{display:flex;flex-direction:row;align-items:center;margin-top:15px}.error{color:#f0a18c;font:13px/1.6 system-ui;white-space:pre-line}#admin{max-width:1150px}#admin h1{font-size:32px;margin-bottom:0}.admin-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.file-button input{display:none}.global-fields,.station-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;border:1px solid #57482f;padding:18px;border-radius:6px}.global-fields{grid-template-columns:repeat(6,minmax(0,1fr))}.station-card{border:1px solid #57482f;background:#1b1914;border-radius:7px;margin:16px 0;padding:18px}.station-card header{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px}.station-card h2{font:19px Georgia;margin:0}.station-fields{border:0;padding:0}.station-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.station-id{font:10px monospace;color:#847964}.station-result{font:12px/1.5 system-ui;color:#c8b78f}.station-fields .wide{grid-column:span 2}details{margin-top:22px;font:13px/1.7 system-ui}summary{cursor:pointer;color:#bda475}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.6 monospace}#adminStatus{font:13px system-ui;color:#d4bb87}.changed{color:#e6b766!important}.packager{max-width:760px;margin:70px auto;padding:25px;font:15px/1.7 system-ui}.packager h1{font:40px Georgia}.packager button{padding:14px;background:#b39863;border:0;color:#16140f;border-radius:5px;cursor:pointer}.packager input{display:block;margin:24px 0}.packager a{color:#d4bb87}
@media(max-width:650px){main{padding:14px 8px}.scene{width:100%}.utility{gap:4px;letter-spacing:.06em}.utility button{padding:10px 7px}.global-fields,.station-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.station-fields .wide{grid-column:span 2}dialog{padding:22px}dialog h1{font-size:30px}.radio .knob{min-width:44px;min-height:44px}.tone-knob{left:31%;top:74%;width:8%}.band-keys{left:45%;width:25%;height:8%;top:74%}.band-key{font-size:10px;min-height:44px}.volume-knob{left:16%;top:62%}.tuning-knob{left:72%;top:62%}.badge{min-height:30px;top:87%}.tone-label{top:72%;left:31%;width:8%}.tuning-label,.volume-label{font-size:1.2cqw}.zoomed .band-keys{left:44%;width:18%;height:6%}.zoomed .tone-knob{left:33%;width:5%}.zoomed .radio{width:190%;margin-left:-45%;margin-top:-70%}.zoomed .scene{aspect-ratio:1.2}.zoomed .tick b{font-size:1.2cqw}.badge span{font-size:1.7cqw}.station-card header{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Control view preserves both outer knobs instead of cropping them off-screen. */
.audio-settings{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.zoomed .scene{aspect-ratio:1.9}
.zoomed .radio{width:130%;margin-left:-15%;margin-top:-50%}
.zoomed .dial .tick b{font-size:max(9px,1.02cqw)}
.zoomed .scale-name{font-size:max(7px,.85cqw)}
.zoomed .badge{top:92%}
.dial:after{content:'';position:absolute;inset:-12% -10% -16%;background:linear-gradient(112deg,transparent 15%,#ffffff05 18%,#ffffff0a 20%,transparent 34%);pointer-events:none;z-index:2}
@media(max-width:650px){.zoomed .scene{aspect-ratio:1.7}.zoomed .radio{width:130%;margin-left:-15%;margin-top:-50%}.zoomed .band-keys{left:45%;width:19%;top:75%;height:7%}.zoomed .tone-knob{left:33%;width:5%;top:75%}.zoomed .engraving{font-size:7px}.zoomed .tone-label{left:33%;top:71%;width:5%}.audio-settings{grid-template-columns:1fr}.zoomed .tuning-knob{left:73%}.zoomed .volume-knob{left:17.3%}.zoomed .badge{top:92%;min-height:27px}}

/* B008: internal dial bulbs, engraved divisions and a recessed valve tuning eye. */
.lamp{left:28%;top:54.7%;width:44%;height:16.7%;border-radius:12%;background:radial-gradient(ellipse at 12% 48%,#ffc77752,transparent 38%),radial-gradient(ellipse at 87% 49%,#ffba6059,transparent 39%);filter:blur(5px);transition:opacity 1.3s ease-in}
.dial{isolation:isolate;color:#c3a971;filter:brightness(.52);transition:filter 1.3s ease-in}
.dial:before{content:'';position:absolute;inset:-9% -4% -15%;z-index:-1;border-radius:10%;background:radial-gradient(ellipse at 8% 42%,#ffd89a66 0,#e9a64d35 12%,#bb6b2122 30%,transparent 52%),radial-gradient(ellipse at 92% 44%,#ffda9c6b 0,#eda8483b 13%,#bb6b2120 32%,transparent 54%),linear-gradient(#321d081c,#b476252e 52%,#2f170518);box-shadow:inset 0 5px 12px #0009,inset 0 -3px 6px #0008;opacity:0;transition:opacity 1.4s ease-in;filter:blur(3px);pointer-events:none}
.on .dial{filter:brightness(1.3);color:#e4cc91;text-shadow:0 0 4px #f8c36d65,0 1px 1px #160b00}
.on .dial:before{opacity:1}
.dial:after{inset:-12% -8% -16%;border-radius:10%;background:linear-gradient(112deg,transparent 8%,#fff2ce04 16%,#fff8e415 19%,transparent 28%,transparent 73%,#fff1ce08 81%,transparent 87%);box-shadow:inset 0 1px 1px #f7ddb819,inset 0 -2px 3px #0007}
#scaleAM .tick.minor{height:17%;opacity:.65}#scaleAM .tick.medium{height:32%;opacity:.9}#scaleAM .tick.major{height:43%}#scaleAM .tick b{top:110%;font-size:.92cqw;letter-spacing:-.025em}.on .tick{background:#dfc38b;box-shadow:0 0 3px #f7b95f44}.needle{width:max(1px,.17cqw);background:linear-gradient(90deg,#793217,#f0ae68 50%,#913e1c);box-shadow:0 0 3px #f9a95288,1px 0 2px #140900}
.tuning-eye{--signal:0;--eye-hue:34;position:absolute;left:77%;top:16%;width:7.3%;aspect-ratio:1;border-radius:50%;padding:0;background:conic-gradient(from 30deg,#b79557,#4b351e 18%,#bc9856 37%,#46301b 61%,#93723e 80%,#d7b978);box-shadow:0 .45cqw .6cqw #000c,inset 0 .12cqw .14cqw #f3d79a88,0 0 0 .18cqw #21180d,0 0 .45cqw .22cqw #0009;pointer-events:none}
.eye-glass{position:absolute;inset:12%;overflow:hidden;border-radius:50%;background:radial-gradient(circle at 40% 37%,#20241c,#050705 72%);box-shadow:inset 0 .3cqw .5cqw #000,inset 0 0 0 .1cqw #050703}
.eye-phosphor{position:absolute;inset:9%;border-radius:50%;background:repeating-conic-gradient(from -90deg,#0000 0deg 2deg,#0002 2deg 3deg),conic-gradient(from 0deg,transparent 0deg calc(66deg - var(--signal)*62deg),hsl(var(--eye-hue) 75% 61%) calc(69deg - var(--signal)*62deg) calc(291deg + var(--signal)*62deg),transparent calc(294deg + var(--signal)*62deg));filter:blur(.04cqw) drop-shadow(0 0 .22cqw hsl(var(--eye-hue) 80% 48%));opacity:0;transition:opacity 1.2s ease-in,background .16s}
.on .eye-phosphor{opacity:.87}.eye-cathode{position:absolute;inset:36%;border-radius:50%;background:radial-gradient(circle at 37% 30%,#252921,#090d08 65%);box-shadow:0 0 .2cqw #000a}
.eye-glass:after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse at 30% 22%,#ffffff35,transparent 29%),linear-gradient(130deg,#ffffff08,transparent 42%,#0005 90%);box-shadow:inset 0 -.15cqw .35cqw #0008}
.eye-legend{position:absolute;top:116%;left:-20%;width:140%;text-align:center;font-size:.57cqw;letter-spacing:.19em;color:#c4ac77;text-shadow:0 1px 2px #000}
/* Bakelite grips with machined brass rims. Lighting stays fixed; the grip and wear rotate. */
.knob{background:radial-gradient(circle at 32% 19%,#927646 0,#30251a 45%,#100e0b 69%);box-shadow:.25cqw .65cqw .65cqw #000c,-.1cqw -.12cqw .18cqw #e8c59055,inset 0 0 0 .18cqw #251b11}
.knob:before{content:'';position:absolute;inset:-4%;border-radius:50%;background:conic-gradient(from 15deg,#d4b775,#5e4324 19%,#bea16a 32%,#352718 54%,#806039 73%,#ead19a 91%,#d4b775);box-shadow:0 .15cqw .25cqw #000b;z-index:-1}
.knob-face{inset:4%;background:radial-gradient(circle at 50% 50%,#3b2d1e 0,#372819 49%,#a18652 50%,#d3b77b 52%,#654a2c 55%,transparent 57%),repeating-conic-gradient(#8d7043 0deg 1.5deg,#261c11 2deg 4deg,#60482b 4.5deg 6deg);box-shadow:inset .1cqw .1cqw .12cqw #e8c48a66,inset -.15cqw -.2cqw .28cqw #000c;transition:transform .045s linear}
.knob-face:after{inset:17%;border:1px solid #b3955b55;background:repeating-linear-gradient(112deg,transparent 0 7px,#e1c28a08 8px,transparent 9px 18px),radial-gradient(ellipse at 43% 36%,#8e70452b,transparent 64%);box-shadow:inset 0 0 .5cqw #0008}
.knob:after{content:'';position:absolute;inset:7%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 32% 18%,#ffe2a83b,transparent 42%),linear-gradient(125deg,transparent 45%,#0006 100%);box-shadow:inset .1cqw .12cqw .2cqw #f2d5a03b,inset -.15cqw -.25cqw .25cqw #0008}
.knob-face i{z-index:1;top:14%;left:48.7%;width:2.6%;height:14%;background:#cbb887;box-shadow:0 1px 2px #000b,inset 0 0 1px #fff9}
@media(max-width:650px){#scaleAM .tick b{font-size:1.02cqw}.zoomed #scaleAM .tick b{font-size:1.03cqw}.tuning-eye{width:8%;left:76.5%}.zoomed .tuning-eye{display:none}}
