@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Anton&family=Black+Ops+One&family=Bungee&family=Rubik+Glitch&family=Racing+Sans+One&family=Russo+One&family=Saira+Condensed:wght@900&family=Teko:wght@700&family=Space+Grotesk:wght@700&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{color-scheme:dark;--ink:#090909;--white:#f3f3ed;--muted:#888984;--accent:#e4f652}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--white);font-family:Arial,Helvetica,sans-serif}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.035;background:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 4px);z-index:10}header{height:100px;margin:0 4%;border-bottom:1px solid #292929;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{display:flex;align-items:center;gap:5px;text-decoration:none}.logo img{width:176px;filter:invert(1) grayscale(1);mix-blend-mode:screen}.logo span{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:700;font-size:30px;color:var(--accent)}.station,.onair,.eyebrow,.side-note,.controls,.youtube,footer{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1.4px}.station{color:var(--muted)}.onair{display:flex;align-items:center;gap:9px}.onair i{height:6px;width:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 12px #e4f64460}main{text-align:center;overflow:hidden;padding:37px 16px 38px}.eyebrow{color:var(--accent);font-size:13px;letter-spacing:3px}h1{font:900 clamp(66px,9vw,128px)/.96 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:-2px;margin:16px 0 14px}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--white)}.intro p{font-size:16px;color:#a7a7a2;margin:0}.broadcast{position:relative;max-width:840px;margin:24px auto 0;display:flex;justify-content:center;align-items:center}.tv{width:650px;max-width:100%;aspect-ratio:700/481;position:relative;overflow:hidden;filter:drop-shadow(0 18px 30px #000)}.tv-frame{position:absolute;width:100%;height:auto;left:0;top:-22%;filter:brightness(.68) contrast(1.25)}.screen{position:absolute;left:9.05%;top:12.25%;width:70.65%;height:76.9%;border-radius:9%/8%;overflow:hidden;background:#080d0b;box-shadow:inset 0 0 30px 12px #000;isolation:isolate}.poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.15) saturate(.6)}#player{position:absolute;inset:0;width:100%;height:100%}.screen iframe{width:133.34%!important;left:-16.67%!important;height:100%;border:0}.scanlines{position:absolute;inset:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(0deg,transparent 0 2px,#0006 2px 3px);box-shadow:inset 0 0 35px 12px #0009;animation:flicker 8s infinite}.tracking{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(transparent 46%,#ffffff12 49%,transparent 52%);animation:tracking 9s linear infinite}.osd{position:absolute;top:9%;left:7%;right:7%;display:flex;justify-content:space-between;z-index:5;pointer-events:none;color:#c3ffd4;font:500 clamp(10px,1.2vw,15px) 'IBM Plex Mono',monospace;text-shadow:1px 1px 4px #000;opacity:.8}.side-note{writing-mode:vertical-rl;transform:rotate(180deg);color:#666;position:absolute;left:18px}.side-note.right{right:18px;left:auto;transform:none}.start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #ffffff99;background:#0a0a0aca;color:white;border-radius:2px;z-index:6;padding:15px 20px;font:500 14px 'IBM Plex Mono',monospace;white-space:nowrap;cursor:pointer}.start[hidden]{display:none}.off-message{display:none;position:absolute;inset:0;align-items:center;justify-content:center;background:#080d0b;z-index:7;color:#86a68d;font:16px 'IBM Plex Mono',monospace}.screen.off .off-message{display:flex}.controls{display:flex;justify-content:center;align-items:center;gap:20px;margin:17px auto 28px}.controls button{border:0;background:transparent;color:#a5a5a0;font:inherit;font-size:12px;letter-spacing:1px;cursor:pointer;padding:10px 4px;min-height:40px}.controls button:hover,.controls button:focus-visible{color:var(--accent)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.controls button span{font-size:19px;color:var(--accent);vertical-align:-2px;margin-right:6px}.separator{width:1px;height:16px;background:#393939}.manifesto{font-family:'Barlow Condensed',Impact,sans-serif;font-size:25px;font-weight:700;letter-spacing:1.2px;margin:0 0 18px}.manifesto span{color:#92938f}.youtube{font-size:12px;color:var(--white);text-decoration:none;letter-spacing:1px;border-bottom:1px solid #555;padding:0 0 7px}.youtube span{margin-left:15px;color:var(--accent);font-size:18px}footer{margin:0 4%;border-top:1px solid #292929;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:25px 0;color:#787974;font-size:11px;letter-spacing:.8px}footer nav{display:flex;gap:28px}footer a{color:#aaa;text-decoration:none}footer a:hover{color:white}.no-fx .scanlines,.no-fx .tracking{animation:none}.no-fx .tracking{display:none}@keyframes flicker{0%,94%,97%,100%{opacity:.6}95%{opacity:.85}96%{opacity:.5}98%{opacity:.75}}@keyframes tracking{from{transform:translateY(-100%)}to{transform:translateY(100%)}}@media(prefers-reduced-motion:reduce){.scanlines,.tracking{animation:none}.tracking{display:none}}@media(min-width:1400px){main{padding-top:45px}.tv{width:700px}}@media(max-width:700px){header{height:78px}.logo img{width:145px}.logo span{font-size:26px}.station{display:none}.onair{font-size:10px}main{padding-top:36px}h1{font-size:clamp(65px,14vw,98px);letter-spacing:-1px}.broadcast{margin-top:35px}.side-note{display:none}.controls{gap:13px;margin-top:12px;margin-bottom:30px}.controls button{font-size:10px}.separator{display:none}.manifesto{font-size:21px}.youtube{font-size:10px}footer{flex-direction:column;gap:18px;text-align:center}.footer-label{display:none}.intro p{font-size:15px}.start{padding:10px 12px;font-size:12px}}
/* Wide CRT cabinet and physical tuning controls. */
.broadcast{max-width:960px}.tv{width:780px;aspect-ratio:700/390}.tv-frame{height:148.8%;object-fit:fill}.screen iframe{width:110%!important;left:-5%!important}.screen{border-radius:8%/10%}
.channel-guide{max-width:780px;margin:0 auto 32px;padding:22px 25px;display:flex;gap:28px;text-align:left;border:1px solid #353535;border-top-color:#4d4d49;border-radius:4px;background:linear-gradient(180deg,#292927,#1b1b1a 12%,#141414 95%,#0b0b0b);box-shadow:0 8px 18px #0008,inset 0 1px #ffffff10}
.tuner-knob{width:128px;flex-shrink:0;text-align:center}.dial-caption,.dial-instruction{font:10px 'IBM Plex Mono',monospace;letter-spacing:1.2px;color:#aaa}.dial-instruction{color:#74746f;font-size:9px}.dial-ring{width:124px;height:110px;margin:9px auto 3px;position:relative}.dial-tick{position:absolute;color:#a7a7a1;font:11px 'IBM Plex Mono',monospace}.tick-1{left:4px;top:76px}.tick-2{left:11px;top:23px}.tick-3{left:58px;top:0}.tick-4{right:11px;top:23px}.tick-5{right:4px;top:76px}
.dial{position:absolute;left:24px;top:26px;width:78px;height:78px;border-radius:50%;border:3px solid #111;background:repeating-conic-gradient(#343432 0deg 3deg,#181818 3deg 6deg);box-shadow:0 6px 8px #000c,0 -1px 2px #6b6b62;cursor:pointer;transform:rotate(var(--rotation,-120deg));transition:transform .18s steps(4);touch-action:manipulation}.dial:before{content:"";position:absolute;inset:5px;border-radius:50%;background:linear-gradient(100deg,#333331,#171717);box-shadow:inset 0 1px 2px #7775}.dial-grip{position:absolute;left:27px;top:8px;width:17px;height:53px;background:linear-gradient(90deg,#080808,#454540 45%,#181818 65%);border-radius:3px;box-shadow:2px 2px 5px #000}.dial-grip:before{content:"";position:absolute;left:7px;top:3px;height:13px;width:3px;background:#d3d2c4}
.tuner-stations{flex:1;min-width:0}.tuner-readout{display:flex;gap:18px;align-items:center;background:#090c09;border:1px solid #050505;box-shadow:inset 0 2px 6px #000,0 1px #5555;padding:10px 14px;margin-bottom:15px;border-radius:2px;color:#e9be71;font:12px 'IBM Plex Mono',monospace;letter-spacing:1px;text-shadow:0 0 8px #f0af4840}#tuner-number{font-size:21px;white-space:nowrap}#tuner-theme{flex:1}.tuner-band{font-size:9px;color:#6e745d;white-space:nowrap;text-shadow:none}
.channel-buttons{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.channel-buttons button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0;border:0;background:none;color:#a5a59b;font:12px 'IBM Plex Mono',monospace;letter-spacing:.1px;text-align:center;cursor:pointer}.channel-number{display:flex;align-items:center;justify-content:center;width:100%;height:28px;border:1px solid #080808;border-top-color:#55554d;border-radius:2px;background:linear-gradient(#353533,#242423);box-shadow:0 3px 0 #090909,0 4px 4px #0009;font-size:12px;color:#c8c8bd}.channel-buttons button:hover .channel-number{background:#41413b}.channel-buttons button[aria-pressed=true]{color:#e5c993}.channel-buttons button[aria-pressed=true] .channel-number{background:#181915;box-shadow:inset 0 2px 4px #000;color:#ecc57e;border-top-color:#090909;transform:translateY(2px)}.now-playing{margin:14px 0 0;color:#898985;font-size:12px;line-height:1.5;min-height:18px}
.channel-static{display:none;position:absolute;inset:0;z-index:6;background:repeating-linear-gradient(0deg,#c7c7b3b3 0 1px,#191919e6 1px 4px,#858579 4px 5px);opacity:.6}.tuning .channel-static{display:block;animation:channel-noise .12s steps(2) infinite}.no-fx .channel-static{display:none}@keyframes channel-noise{0%{transform:translateY(-3px);opacity:.5}100%{transform:translateY(3px);opacity:.8}}@media(prefers-reduced-motion:reduce){.channel-static{display:none!important}.dial{transition:none}}@media(max-width:700px){.channel-guide{padding:18px 14px;gap:13px;flex-wrap:wrap;align-items:center}.tuner-knob{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px}.dial-ring{margin:0;width:124px;flex-shrink:0}.dial-instruction{max-width:68px;line-height:1.7}.dial-caption{max-width:68px;line-height:1.7}.tuner-stations{flex-basis:100%}.tuner-readout{gap:10px;padding:10px}.tuner-band{display:none}.channel-buttons{gap:7px}.channel-buttons button{font-size:12px;line-height:1.4;overflow-wrap:anywhere}.channel-number{height:34px}.now-playing{font-size:12px}.controls{gap:12px}.tv{width:100%}}
/* Controls stay above the embedded player and expose their current state. */
.controls{position:relative;z-index:20;isolation:isolate;flex-wrap:wrap}.controls button{position:relative;pointer-events:auto;touch-action:manipulation;min-height:44px;padding:10px 9px;border:1px solid #35352f;border-radius:3px;background:linear-gradient(#252522,#131312);box-shadow:0 3px #050505}.controls button:active{transform:translateY(2px);box-shadow:0 1px #050505}.controls #power-label{font:inherit;color:inherit;margin:0;vertical-align:baseline}.controls button[aria-pressed=true]{color:#e4f652;border-color:#545840}.controls .separator{display:none}.tv-off .onair i{background:#65655f;box-shadow:none}.tv-off .tuner-readout{color:#535448;text-shadow:none}.screen.off iframe,.screen.off .poster,.screen.off .osd,.screen.off .start,.screen.off .tracking,.screen.off .scanlines{visibility:hidden}.screen.off .off-message{color:#555b52;background:#080a08;letter-spacing:3px}.slider-tuner{display:none}.logo{gap:9px}.footer-label{display:block!important}
.design-lab{position:relative;z-index:30;margin:16px 4% 0;padding:15px 18px;border:1px solid #4b4b3e;background:#171813;display:flex;align-items:center;gap:22px;font:12px 'IBM Plex Mono',monospace}.design-lab>div{flex:1}.design-lab strong{display:block;color:var(--accent);letter-spacing:2px;margin-bottom:7px}.design-lab span{color:#b1b2a8}.design-lab label{display:flex;flex-direction:column;gap:6px;color:#999;font-size:11px}.design-lab select{background:#262820;border:1px solid #4b4d40;color:#f1f1e9;padding:9px;font:12px 'IBM Plex Mono',monospace;border-radius:2px}.design-lab a{color:#ccc;font-size:12px}.comparison[data-tv=charcoal] .tv-frame{filter:brightness(.32) contrast(1.4) saturate(0)}.comparison[data-tv=charcoal] .tv{width:850px;aspect-ratio:700/360}.comparison[data-tv=charcoal] .screen{box-shadow:0 0 25px #9dd3f510,inset 0 0 30px #000}.comparison[data-tv=compact] .tv{width:620px;aspect-ratio:700/480}.comparison[data-tv=compact] .screen iframe{width:133.34%!important;left:-16.67%!important}.comparison[data-tv=compact] .tv-frame{filter:brightness(.78) contrast(1.15) saturate(.5)}.comparison[data-tv=compact] .channel-guide{max-width:620px}
.comparison[data-picker=slider] .tuner-knob{display:none}.comparison[data-picker=slider] .slider-tuner{display:block;margin:0 0 20px;padding:12px 16px;background:#080b08;border:1px solid #080808;box-shadow:inset 0 2px 5px #000;color:#b2b795}.slider-tuner label{font:12px 'IBM Plex Mono',monospace;letter-spacing:2px}.slider-tuner input{display:block;width:100%;margin:16px 0 3px;accent-color:#edbf6c;cursor:ew-resize;min-height:30px}.frequency-scale{display:flex;justify-content:space-between;font:12px 'IBM Plex Mono',monospace;border-top:1px solid #4d5540;padding-top:7px;background:repeating-linear-gradient(90deg,transparent 0 9px,#6e7553 9px 10px) top/100% 5px no-repeat}.comparison[data-picker=slider] .channel-guide{background:linear-gradient(#383831,#1d1e19)}
.comparison[data-picker=remote] .tuner-knob{display:none}.comparison[data-picker=remote] .channel-guide{max-width:440px;padding:26px 30px;border-radius:20px 20px 35px 35px;border:2px solid #3d3e37;background:linear-gradient(105deg,#282923,#11120f 40%,#24251f);box-shadow:inset 1px 0 #67685a,0 15px 25px #000b}.comparison[data-picker=remote] .channel-buttons{grid-template-columns:repeat(3,1fr);gap:20px 14px}.comparison[data-picker=remote] .channel-number{height:43px;width:60px;border-radius:9px;background:linear-gradient(#4b4d42,#25271f);font-size:18px;font-weight:bold}.comparison[data-picker=remote] .channel-buttons button[aria-pressed=true] .channel-number{background:#b1b748;color:#14170c}.comparison[data-picker=remote] .tuner-band{display:none}.comparison[data-picker=remote] .tuner-readout{margin-bottom:22px}.comparison[data-picker=remote] .now-playing{margin-top:22px}.comparison[data-picker=remote] #tuner-theme{font-size:11px}
@media(max-width:700px){.design-lab{flex-wrap:wrap;gap:14px}.design-lab>div{flex-basis:100%}.design-lab label{flex:1}.design-lab select{width:100%;min-width:0}.controls{gap:8px}.controls button{font-size:11px;padding:9px}.comparison[data-tv] .tv{max-width:100%}.comparison[data-picker=remote] .channel-guide{max-width:340px}}
/* Additional tactile tuner studies. */
.seek-controls{display:none}.comparison[data-picker=piano] .tuner-knob{display:none}.comparison[data-picker=piano] .channel-guide{max-width:690px;padding:24px 30px;background:#24231e;border-radius:3px 3px 14px 14px}.comparison[data-picker=piano] .channel-buttons{gap:4px}.comparison[data-picker=piano] .channel-buttons button{position:relative;gap:12px;color:#b6b3a5}.comparison[data-picker=piano] .channel-number{height:76px;background:linear-gradient(90deg,#9e9b88,#e9e5d3 14%,#c9c6b4 90%,#a6a391);color:#37382f;border:1px solid #181811;border-radius:2px 2px 6px 6px;box-shadow:0 7px 0 #777666,0 9px 8px #000;font-size:19px}.comparison[data-picker=piano] .channel-buttons button[aria-pressed=true] .channel-number{background:linear-gradient(#77795e,#a9b768);color:#1e2410;transform:translateY(6px);box-shadow:0 1px #444b31}.comparison[data-picker=piano] .tuner-readout{background:none;box-shadow:none;border:0;padding:0 0 14px;color:#d6d2bd;text-shadow:none}
.comparison[data-picker=deck] .tuner-knob{display:none}.comparison[data-picker=deck] .seek-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.seek-controls button{cursor:pointer;min-width:70px;min-height:45px;background:linear-gradient(#545850,#20241e);color:#c6dcb6;border:1px solid #060805;border-top-color:#798475;box-shadow:0 3px #090909;border-radius:4px;font-size:17px}.seek-controls button span{display:block;font:10px 'IBM Plex Mono',monospace;margin-top:5px}.seek-caption{color:#8a9985;font:11px 'IBM Plex Mono',monospace;letter-spacing:2px;text-align:center}.comparison[data-picker=deck] .channel-guide{max-width:720px;border:2px solid #444c40;background:linear-gradient(#3c4238,#1c211a);border-radius:7px}.comparison[data-picker=deck] .tuner-readout{color:#bdf596;background:#101c0e;border-color:#050b04;box-shadow:inset 0 0 12px #000;font-size:16px}.comparison[data-picker=deck] .channel-number{height:20px;max-width:64px;background:#353e2b;border-radius:8px}.comparison[data-picker=deck] .channel-buttons button[aria-pressed=true] .channel-number{background:#a9bb75;color:#111}
.comparison[data-picker=thumbwheel] .channel-guide{max-width:560px;background:linear-gradient(120deg,#555750,#242720);border-radius:7px;padding:22px}.comparison[data-picker=thumbwheel] .tuner-knob{width:78px}.comparison[data-picker=thumbwheel] .dial-ring{width:70px;height:120px;margin:14px auto}.comparison[data-picker=thumbwheel] .dial-tick{display:none}.comparison[data-picker=thumbwheel] .dial{left:7px;top:0;width:56px;height:116px;border-radius:8px;transform:none;background:repeating-linear-gradient(#090b08 0 3px,#666958 3px 5px,#2c3024 5px 10px);box-shadow:inset 0 0 13px #000,3px 2px 4px #000}.comparison[data-picker=thumbwheel] .dial:before{inset:0;border-radius:6px;background:linear-gradient(90deg,#000b,transparent 35%,transparent 60%,#000b)}.comparison[data-picker=thumbwheel] .dial-grip{height:2px;width:38px;left:6px;top:54px;background:#dedccb;box-shadow:0 0 3px #000}.comparison[data-picker=thumbwheel] .dial-grip:before{display:none}.comparison[data-picker=thumbwheel] .tuner-readout{background:#c9c4a2;color:#202b1b;text-shadow:none;box-shadow:inset 0 3px 8px #0006}.comparison[data-picker=thumbwheel] .tuner-band{display:none}.comparison[data-picker=thumbwheel] .channel-buttons{grid-template-columns:repeat(5,1fr);gap:6px}.comparison[data-picker=thumbwheel] .channel-buttons button{font-size:11px}.comparison[data-picker=thumbwheel] .channel-number{border-radius:50%;height:31px;width:31px;background:#24291f}
.comparison[data-picker=switchbank] .tuner-knob{display:none}.comparison[data-picker=switchbank] .channel-guide{max-width:580px;background:linear-gradient(100deg,#50524f,#282a28);padding:24px;border:2px solid #777971;border-radius:2px}.comparison[data-picker=switchbank] .channel-buttons{grid-template-columns:1fr;gap:0}.comparison[data-picker=switchbank] .channel-buttons button{flex-direction:row;justify-content:flex-start;gap:22px;padding:13px 8px;border-top:1px solid #ffffff19;text-align:left;letter-spacing:2px;color:#d3d5ca}.comparison[data-picker=switchbank] .channel-number{width:53px;height:22px;border-radius:12px;background:#151714;box-shadow:inset 0 2px 4px #000;border:1px solid #676b60;position:relative;font-size:0;flex-shrink:0}.comparison[data-picker=switchbank] .channel-number:after{content:'';position:absolute;left:3px;top:2px;width:24px;height:16px;border-radius:10px;background:linear-gradient(#b7b9ad,#696e60);box-shadow:1px 2px 3px #0008;transition:left .12s}.comparison[data-picker=switchbank] .channel-buttons button[aria-pressed=true] .channel-number{background:#484e1e;transform:none}.comparison[data-picker=switchbank] .channel-buttons button[aria-pressed=true] .channel-number:after{left:24px;background:linear-gradient(#e3ef9a,#8f9e43)}.comparison[data-picker=switchbank] .channel-buttons button[aria-pressed=true]{color:#e4f652}
@media(max-width:700px){.comparison[data-picker=piano] .channel-guide{padding:20px 12px}.comparison[data-picker=piano] .channel-number{height:65px}.comparison[data-picker=thumbwheel] .tuner-knob{width:65px;flex-direction:column}.comparison[data-picker=thumbwheel] .tuner-stations{flex-basis:0}.comparison[data-picker=thumbwheel] .channel-buttons{grid-template-columns:repeat(3,1fr);gap:12px 6px}.comparison[data-picker=thumbwheel] .tuner-readout{flex-wrap:wrap;gap:4px}.comparison[data-picker=thumbwheel] #tuner-theme{flex-basis:100%;font-size:11px}.seek-caption{font-size:9px}.seek-controls button{min-width:55px}.comparison[data-picker=deck] .channel-guide{padding:18px 12px}}
.comparison .tv.generated-tv{width:790px;aspect-ratio:3/2}.comparison .generated-tv .tv-frame{top:0;left:0;width:100%;height:100%;object-fit:contain;filter:none;mix-blend-mode:lighten}.comparison .generated-tv .screen{left:var(--screen-x);top:var(--screen-y);width:var(--screen-w);height:var(--screen-h);border-radius:10%/8%;box-shadow:inset 0 0 32px 12px #0009}.comparison .generated-tv .screen iframe{width:128%!important;left:-14%!important}.comparison[data-tv=ivory] .tv{width:740px}.comparison[data-tv=walnut] .tv{width:830px}.comparison[data-tv=broadcast] .tv{width:760px}.comparison[data-tv=broadcast] .screen{border-radius:6%/7%}.comparison[data-tv=translucent] .tv{width:760px}.comparison[data-tv=translucent] .screen{border-radius:11%/13%}.comparison[data-tv=translucent] .screen iframe{width:112%!important;left:-6%!important}@media(max-width:700px){.comparison .tv.generated-tv{max-width:100%}}
/* Live cabinet selection, without interrupting the current film. */
.tv-chooser{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin:28px auto 0;font:12px 'IBM Plex Mono',monospace}.tv-chooser>span{color:#8d8f81;letter-spacing:1.5px;margin-right:10px}.tv-chooser button{border:1px solid #373a30;border-radius:3px;background:#191b15;color:#b5b9a6;min-height:40px;padding:8px 12px;cursor:pointer;font:inherit}.tv-chooser button[aria-pressed=true]{color:#e4f652;border-color:#929d39;background:#262b14}.tv-chooser button:hover{border-color:#b0b88b}
body:not(.comparison) .tv.generated-tv{width:790px;aspect-ratio:3/2}body:not(.comparison) .generated-tv .tv-frame{top:0;left:0;width:100%;height:100%;object-fit:contain;filter:none;mix-blend-mode:lighten}body:not(.comparison) .generated-tv .screen{left:var(--screen-x);top:var(--screen-y);width:var(--screen-w);height:var(--screen-h);border-radius:10%/8%;box-shadow:inset 0 0 32px 12px #0009}body:not(.comparison) .generated-tv .screen iframe{width:128%!important;left:-14%!important}body:not(.comparison)[data-tv=broadcast] .screen{border-radius:6%/7%}
/* Three alternatives to the original rotary tuner. */
.comparison[data-picker=hifi] .channel-guide{background:linear-gradient(100deg,#787a75,#4b4e49 35%,#777a73);border-color:#94988f;box-shadow:inset 0 1px #c9cfc1,0 8px 18px #0009}.comparison[data-picker=hifi] .dial-caption,.comparison[data-picker=hifi] .dial-tick{color:#101710}.comparison[data-picker=hifi] .dial-instruction{color:#232b21}.comparison[data-picker=hifi] .dial{background:repeating-conic-gradient(#cbd0c3 0deg 3deg,#555e50 3deg 6deg);border-color:#323b2c}.comparison[data-picker=hifi] .dial:before{background:conic-gradient(#dadfd0,#6e7665,#e3e6d9,#77806d,#dadfd0)}.comparison[data-picker=hifi] .dial-grip{width:3px;height:23px;left:34px;top:9px;background:#20291a;box-shadow:none}.comparison[data-picker=hifi] .dial-grip:before{display:none}.comparison[data-picker=hifi] .channel-buttons button,.comparison[data-picker=hifi] .now-playing{color:#e3e7da}.comparison[data-picker=hifi] .tuner-readout{color:#c8edbd;background:#122216}
.comparison[data-picker=bakelite] .channel-guide{background:linear-gradient(#322c25,#191611);border:2px solid #55493a;border-radius:12px;max-width:710px}.comparison[data-picker=bakelite] .dial{border:5px solid #100d09;background:#382b1b;box-shadow:0 6px 7px #000,0 -1px 1px #ae8962}.comparison[data-picker=bakelite] .dial:before{inset:0;background:radial-gradient(ellipse at 35% 20%,#59442b,#20150d 70%);box-shadow:inset 0 1px 3px #92704a}.comparison[data-picker=bakelite] .dial-grip{left:7px;top:25px;width:53px;height:17px;background:linear-gradient(#826346,#322211 50%,#1b1008);box-shadow:0 3px 5px #000;transform:rotate(90deg)}.comparison[data-picker=bakelite] .dial-grip:before{left:3px;top:6px;width:10px;height:3px;background:#dec79e}.comparison[data-picker=bakelite] .tuner-readout{background:#2b2114;border-color:#100b05;color:#eac78b}.comparison[data-picker=bakelite] .channel-number{background:linear-gradient(#7b6447,#43321e);border-top-color:#ba9873;color:#e5d2ad}.comparison[data-picker=bakelite] .channel-buttons button[aria-pressed=true] .channel-number{background:#2f2415;color:#ffdaa0}.comparison[data-picker=bakelite] .dial-caption,.comparison[data-picker=bakelite] .dial-tick{color:#c7af8a}
.comparison[data-picker=vernier] .channel-guide{background:linear-gradient(110deg,#252c30,#101619);border:1px solid #46565b;max-width:800px}.comparison[data-picker=vernier] .tuner-knob{width:165px}.comparison[data-picker=vernier] .dial-ring{width:152px;height:138px;background:repeating-conic-gradient(from -125deg at 50% 57%,#a1b3b6 0deg 1deg,transparent 1deg 9deg);border-radius:50%;background-size:100% 100%}.comparison[data-picker=vernier] .dial-ring:before{content:'';position:absolute;inset:11px;border-radius:50%;background:#192125}.comparison[data-picker=vernier] .dial-tick{display:none}.comparison[data-picker=vernier] .dial{left:25px;top:25px;width:102px;height:102px;background:repeating-conic-gradient(#3b4547 0deg 2deg,#10191b 2deg 5deg);border:4px solid #0c1214}.comparison[data-picker=vernier] .dial:before{background:radial-gradient(circle at 35% 30%,#4b585a,#172225 70%);inset:8px}.comparison[data-picker=vernier] .dial-grip{left:44px;top:11px;width:3px;height:23px;background:#e5f39a;box-shadow:0 0 5px #c5e47b44}.comparison[data-picker=vernier] .dial-grip:before{display:none}.comparison[data-picker=vernier] .tuner-readout{color:#c1dee2;background:#101e22}.comparison[data-picker=vernier] .channel-buttons button[aria-pressed=true] .channel-number{color:#d8ecae;background:#22301d}
@media(max-width:700px){.tv-chooser>span{flex-basis:100%;margin:0 0 4px}.tv-chooser{gap:6px}.tv-chooser button{font-size:11px;padding:7px 9px}body:not(.comparison) .tv.generated-tv{max-width:100%}.comparison[data-picker=vernier] .tuner-knob{width:100%}.comparison[data-picker=vernier] .dial-ring{flex-shrink:0}}
/* Low-profile live-page customization; collapsed by default. */
.set-settings{max-width:780px;margin:-12px auto 30px;text-align:center;font:12px 'IBM Plex Mono',monospace;color:#888b80}.set-settings summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:10px 14px;min-height:40px;letter-spacing:.5px}.set-settings summary::-webkit-details-marker{display:none}.set-settings summary:after{content:'+';color:#bec4a0;font-size:16px}.set-settings[open] summary:after{content:'−'}.set-settings summary:hover{color:#e4f652}.set-settings summary:focus-visible{outline:2px solid #e4f652;outline-offset:3px}.set-settings-fields{display:flex;gap:18px;justify-content:center;padding:12px 16px 18px;border-top:1px solid #292c24;margin-top:3px}.set-settings label{display:flex;flex-direction:column;gap:8px;text-align:left;flex:1;max-width:250px;color:#999d8f}.set-settings select{font:12px 'IBM Plex Mono',monospace;background:#14160f;border:1px solid #34392a;border-radius:3px;color:#cccfc1;padding:11px;min-width:0;width:100%}.live-page .channel-guide{margin-bottom:24px}@media(max-width:480px){.set-settings-fields{gap:10px;padding:12px 0}.set-settings select{font-size:12px;padding:9px}.set-settings{margin-top:-8px}}
/* Coordinated cabinets and receivers, changed as a single set. */
.matched-set{position:relative;max-width:1000px;margin:0 auto;padding:0 52px}.matched-set .broadcast{margin-top:28px}.matched-set .side-note{display:none}.set-arrow{position:absolute;top:43%;z-index:21;width:44px;height:64px;display:flex;justify-content:center;align-items:center;border:0;border-radius:4px;background:transparent;color:#82877a;font:300 44px Arial,sans-serif;cursor:pointer;transition:color .15s,background .15s;touch-action:manipulation}.set-arrow:hover{color:#e4f652;background:#ffffff07}.set-prev{left:0}.set-next{right:0}.set-caption{font:11px 'IBM Plex Mono',monospace;color:#777e6d;letter-spacing:1.6px;margin:-6px auto 30px;text-align:center}.live-page[data-tv=ivory] .channel-guide{background:linear-gradient(110deg,#d9d5bb,#b5b298);border:2px solid #dad8c3;box-shadow:inset 0 1px #f1efdf,0 7px 20px #0009;border-radius:12px}.live-page[data-tv=ivory] .dial-caption,.live-page[data-tv=ivory] .dial-tick,.live-page[data-tv=ivory] .dial-instruction{color:#4a4b3e}.live-page[data-tv=ivory] .dial{border-color:#56594b;background:repeating-conic-gradient(#686d5b 0deg 3deg,#393e31 3deg 6deg)}.live-page[data-tv=ivory] .dial:before{background:linear-gradient(100deg,#6b705c,#3c4233)}.live-page[data-tv=ivory] .dial-grip{background:linear-gradient(90deg,#303526,#8a8f79,#404834)}.live-page[data-tv=ivory] .channel-buttons button,.live-page[data-tv=ivory] .now-playing{color:#43483a}.live-page[data-tv=ivory] .channel-number{background:linear-gradient(#ebe8d5,#c2c0a8);border-color:#8b8c74;color:#414832;box-shadow:0 3px #777963}.live-page[data-tv=ivory] .channel-buttons button[aria-pressed=true] .channel-number{background:#8d9974;color:#1b2512;box-shadow:inset 0 2px 4px #4b5338}.live-page[data-tv=ivory] .tuner-readout{color:#dae5ac;background:#26301d}.live-page[data-tv=walnut] .channel-guide{border-color:#785533;background:linear-gradient(100deg,#34271b,#1d1710);box-shadow:inset 0 0 0 4px #4a3321,0 8px 18px #0009}.live-page[data-tv=broadcast] .channel-guide{background:linear-gradient(110deg,#242729,#0f1112);border-color:#45494a}.live-page[data-tv=broadcast] .tuner-readout{color:#aee0bd;background:#0b160f}.live-page[data-tv=broadcast] .dial-ring:before{background:#1a1e20}.live-page[data-tv=silver] .channel-guide{max-width:780px}.live-page .channel-guide{max-width:780px!important}
@media(max-width:700px){.matched-set{padding:0 24px;margin:0 -8px}.set-arrow{width:30px;height:52px;font-size:34px;top:32%}.set-prev{left:-5px}.set-next{right:-5px}.matched-set .controls{gap:6px}.matched-set .controls button{padding:8px 6px;font-size:10px}.set-caption{font-size:10px;letter-spacing:1px}.matched-set .channel-guide{padding:16px 12px}}
/* FX adds visible analog instability; the base scanlines always remain. */
.screen .scanlines{opacity:.68;animation:crt-breathe 4.8s ease-in-out infinite}.screen .tracking{inset:-24% 0;height:148%;background:linear-gradient(transparent 39%,#0000 42%,#0005 45%,#dcf4dc38 48%,#ffffff48 49%,#0008 50%,#ffffff18 51%,transparent 54%);animation:crt-roll 4.2s linear infinite;mix-blend-mode:screen}.screen iframe{animation:crt-drift 6.8s linear infinite}.screen .osd{animation:crt-ghost 6.8s linear infinite}.no-fx .screen .scanlines{animation:none;opacity:.68}.no-fx .screen .tracking{display:none}.no-fx .screen iframe,.no-fx .screen .osd{animation:none;transform:none}.screen.off iframe,.screen.off .tracking,.screen.off .osd{animation:none}
@keyframes crt-roll{0%{transform:translateY(-65%)}100%{transform:translateY(65%)}}
@keyframes crt-breathe{0%,100%{opacity:.6}45%{opacity:.83}70%{opacity:.65}}
@keyframes crt-drift{0%,82%,87%,100%{transform:translate(0,0)}83%{transform:translate(2px,1px)}84%{transform:translate(-3px,-1px)}85%{transform:translate(1px,0)}}
@keyframes crt-ghost{0%,82%,87%,100%{text-shadow:1px 1px 4px #000}83%,86%{text-shadow:-2px 0 #ff516580,2px 0 #54d8ee80,1px 1px 4px #000}}
@media(prefers-reduced-motion:reduce){.screen .scanlines,.screen iframe,.screen .osd{animation:none}.screen .tracking{display:none}}
.set-swatches{display:flex;justify-content:center;gap:6px;margin:22px auto 0}.set-swatch{height:44px;width:44px;padding:10px;display:grid;place-items:center;background:transparent;border:1px solid transparent;border-radius:3px;cursor:pointer;touch-action:manipulation}.set-swatch span{display:block;width:22px;height:22px;border:1px solid #ffffff38;border-radius:2px;box-shadow:inset 0 1px #ffffff2b}.swatch-silver span{background:linear-gradient(120deg,#a6aaa9,#5e6364)}.swatch-walnut span{background:linear-gradient(120deg,#8a5732,#412a19)}.swatch-ivory span{background:linear-gradient(120deg,#e1dfc8,#aaa78f)}.swatch-broadcast span{background:linear-gradient(120deg,#363c3d,#131719)}.set-swatch[aria-pressed=true]{border-color:#cddd59;background:#cddd590c}.set-swatch:hover{background:#ffffff0a}.matched-set{padding:0 30px}.matched-set .broadcast{margin-top:12px}.live-page .channel-guide{margin-bottom:32px}@media(max-width:700px){.matched-set{padding:0 8px}.set-swatches{margin-top:18px}}

/* Decorative cabinet art must never intercept the appearance controls. */
.tv-frame{pointer-events:none}.set-swatches{position:relative;z-index:30}.set-swatch span{pointer-events:none}.set-swatch:focus-visible{outline:2px solid #e4f652;outline-offset:3px}
h1{font-family:"Space Grotesk",Arial,sans-serif;font-weight:700;font-size:clamp(44px,7.7vw,106px);line-height:1.04;letter-spacing:-.065em}h1 em{color:var(--white);-webkit-text-stroke:0}.comparison[data-tv=silver] .generated-tv .screen{border-radius:5%/7%}

/* Compact cabinet controls beside the live indicator. */
.header-controls{display:flex;align-items:center;gap:18px;flex-shrink:0}:is(header,footer) .set-swatches{margin:0;gap:2px}:is(header,footer) .set-swatch{width:30px;height:32px;padding:6px}:is(header,footer) .set-swatch span{width:16px;height:16px}header .onair{white-space:nowrap}
h1{font-family:var(--headline-font,"Rubik Glitch"),Impact,sans-serif;font-weight:var(--headline-weight,400);font-size:clamp(42px,7.8vw,102px);letter-spacing:-.025em;line-height:1.05}
#font-preview:not([hidden]){display:flex;justify-content:center;align-items:center;gap:12px;margin:20px 0 0;font:11px 'IBM Plex Mono',monospace;color:#a3a697}#headline-font{max-width:240px;background:#171a12;color:#e4f652;border:1px solid #535a38;border-radius:3px;padding:9px;font:12px 'IBM Plex Mono',monospace}
.live-page .channel-buttons button>span:last-child{white-space:nowrap;font-size:clamp(9px,1.02vw,12px);letter-spacing:0}
@media(max-width:700px){header{flex-wrap:wrap;gap:12px}.header-controls{gap:8px;margin-left:auto}:is(header,footer) .set-swatch{width:28px;height:32px;padding:5px}header .onair{font-size:9px}.live-page .channel-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 8px}.live-page .channel-buttons button>span:last-child{font-size:10px}h1{font-size:clamp(38px,10.8vw,76px)}#font-preview:not([hidden]){gap:8px;flex-wrap:wrap}}

/* Quiet, tactile finish samples with generous invisible click targets. */
:is(header,footer) .set-swatches{gap:0}:is(header,footer) .set-swatch{width:28px;height:32px;padding:7px;background:transparent;border:0;border-radius:50%;position:relative}:is(header,footer) .set-swatch span{width:14px;height:13px;border:0;border-radius:43% 57% 62% 38% / 56% 41% 59% 44%;box-shadow:none;opacity:.52;transform:rotate(-14deg);transition:opacity .18s,transform .18s}:is(header,footer) .swatch-walnut span{border-radius:61% 39% 43% 57% / 42% 59% 41% 58%;transform:rotate(19deg)}:is(header,footer) .swatch-ivory span{border-radius:39% 61% 54% 46% / 62% 47% 53% 38%;transform:rotate(-24deg)}:is(header,footer) .swatch-broadcast span{background:linear-gradient(120deg,#697172,#363d3e);transform:rotate(12deg)}:is(header,footer) .set-swatch[aria-pressed=true]{background:transparent;border:0}:is(header,footer) .set-swatch[aria-pressed=true] span{opacity:.9}:is(header,footer) .set-swatch[aria-pressed=true]:after{content:'';position:absolute;bottom:3px;left:13px;width:2px;height:2px;border-radius:50%;background:#bfc39b}:is(header,footer) .set-swatch:hover{background:transparent}:is(header,footer) .set-swatch:hover span,:is(header,footer) .set-swatch:focus-visible span{opacity:1;transform:scale(1.1)}

/* Mobile alignment and compact rectangular controls. */
@media(max-width:700px){
 .live-page header{height:auto;min-height:112px;padding:20px 0 12px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}
 .live-page header .logo{margin:0 auto;justify-content:center}
 .live-page header .header-controls{margin:0;justify-content:center;gap:14px}
 .live-page .matched-set .controls{gap:6px;flex-wrap:nowrap;width:100%;margin:12px auto 24px}
 .live-page .matched-set .controls button{height:36px;min-height:36px;padding:0 8px;border-radius:2px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-size:10px;letter-spacing:.5px}
 .live-page .controls button span{font-size:15px;vertical-align:baseline;margin-right:4px}
 .live-page .controls #power-label{font:inherit;margin:0}
 .live-page .controls #power{gap:3px}
}
@media(max-width:360px){.live-page .matched-set .controls{gap:4px}.live-page .matched-set .controls button{padding:0 5px;font-size:9px}}

/* A shallow receiver face on phones, with finishes tucked into the footer. */
@media(max-width:700px){
 .live-page footer .set-swatches{margin:0;gap:8px}
 .live-page footer .set-swatch{width:40px;height:40px}
 .live-page footer .set-swatch[aria-pressed=true]:after{left:19px}
 .live-page .matched-set .channel-guide{display:grid;grid-template-columns:82px minmax(0,1fr);gap:10px;padding:12px 10px;align-items:center}
 .live-page[data-picker] .tuner-knob{width:82px;display:flex;flex-direction:column;gap:0;min-width:0}
 .live-page .dial-caption{font-size:8px;letter-spacing:.3px;max-width:none;white-space:nowrap}
 .live-page .dial-instruction{display:none}
 .live-page .dial-ring{zoom:.62;margin:4px 0 0;flex-shrink:0}
 .live-page[data-picker=vernier] .dial-ring{zoom:.52}
 .live-page .tuner-stations{min-width:0;width:100%}
 .live-page .tuner-readout{display:flex;flex-wrap:wrap;gap:3px 8px;padding:7px 8px;margin-bottom:10px;min-height:44px}
 .live-page #tuner-number{font-size:17px;white-space:nowrap}
 .live-page #tuner-theme{font-size:9px;letter-spacing:.3px;white-space:nowrap}
 .live-page .channel-buttons{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
 .live-page .channel-buttons button{min-height:36px;justify-content:center;gap:0}
 .live-page .channel-number{height:25px;font-size:11px}
 .live-page .channel-buttons button>span:last-child{display:none}
 .live-page .now-playing{font-size:10px;line-height:1.35;margin:7px 0 0;min-height:0}
}

/* Quiet breathing light; stays still when off or reduced motion is enabled. */
body:not(.tv-off) .onair i{animation:onair-pulse 4s ease-in-out infinite}
@keyframes onair-pulse{0%,100%{opacity:.65;box-shadow:0 0 4px #e4f65218}50%{opacity:1;box-shadow:0 0 9px #e4f65250}}
@media(prefers-reduced-motion:reduce){body:not(.tv-off) .onair i{animation:none}}
