:root{color-scheme:dark;font-family:'Courier New',monospace;color:#8b949a;background:#030408;font-synthesis:none;--cyan:#54d4ff;--red:#ec492a;--rail:92px;--chin:66px}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit}button:focus-visible{outline:1px solid var(--cyan);outline-offset:6px}button:disabled{opacity:.3;cursor:default!important}button[hidden],div[hidden]{display:none!important}.television{height:100svh;min-height:360px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 0 30%,#061423 0,transparent 50%),radial-gradient(ellipse at 100% 70%,#210907 0,transparent 50%),#020307}
.cabinet{position:absolute;inset:16px 18px 14px;border-radius:15px;background:linear-gradient(112deg,#161c22 0%,#0b0e12 28%,#0d0f12 64%,#170c0e 100%);border:1px solid #29292b;box-shadow:inset 1px 1px 1px #74808b44,inset -2px -2px 3px #000,0 0 0 3px #030408,2px 0 15px #f23c1c20,-3px 0 18px #006ecb20}
.cabinet:before{content:'';position:absolute;inset:2px;pointer-events:none;z-index:5;opacity:.16;border-radius:12px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.35' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.screen-surround{position:absolute;top:18px;bottom:var(--chin);left:18px;right:var(--rail);padding:13px;border-radius:5.4% / 6.8%;background:linear-gradient(142deg,#122a39 0%,#090c13 14%,#03050a 45%,#191316 84%,#572b25 100%);box-shadow:inset 3px 3px 5px #000,0 1px 1px #737b8333,-1px -1px 1px #398eb155,3px 2px 6px #ed46181a}
.crt-glass{height:100%;width:100%;position:relative;overflow:hidden;border-radius:4.6% / 6%;background:#020713;box-shadow:0 0 20px #0085db1f,inset 0 0 8px #040507;isolation:isolate;transition:box-shadow .5s}
.crt-glass:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:4;box-shadow:inset 0 0 12px 5px #000,inset 0 0 75px 12px #0008;border:1px solid #3899be38}
#scene{position:absolute;inset:0;touch-action:none;cursor:grab;outline:none}#scene:active{cursor:grabbing}#scene canvas{display:block;width:100%;height:100%}.glass-reflection{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(117deg,#9edfff07,transparent 26%,transparent 67%,#ed392509 100%),radial-gradient(ellipse at 11% 0%,#8acffc13,transparent 38%);border-radius:inherit}
.osd{position:absolute;z-index:3;left:4.5%;right:4.5%;display:flex;justify-content:space-between;pointer-events:none;color:#79cdffad;font-size:12px;letter-spacing:2px;text-shadow:0 0 8px #008dff,2px 0 #0c244c;transition:opacity .4s;opacity:.7}.osd-top{top:6.5%}.osd-bottom{bottom:6.5%;font-size:9px;letter-spacing:1.8px;opacity:.4}.stereo{font-size:10px;letter-spacing:3px}.transmission{font-size:8px;letter-spacing:2px}.loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#72dbff;font-size:10px;letter-spacing:2px;display:flex;align-items:center;gap:12px;transition:opacity .5s;pointer-events:none}.loading span{width:4px;height:8px;background:#6be4ff;box-shadow:0 0 10px #1ebcff}.loading.done{opacity:0}
.hardware{position:absolute;right:16px;top:30px;bottom:78px;width:60px;display:flex;flex-direction:column;align-items:center;gap:27px}.frequency{width:100%;display:flex;flex-direction:column;align-items:center;gap:9px}.hardware-label{font-size:6px;letter-spacing:1.4px;color:#747577;text-align:center;white-space:nowrap}.channel-id{width:52px;text-align:center;font-family:'Courier New',monospace;line-height:1.2;font-size:31px;letter-spacing:2px;color:#ec4f29;padding:6px 3px 4px 5px;border:2px solid #030406;border-radius:3px;background:#160a09;box-shadow:inset 0 2px 5px #000,0 1px #ffffff0a;text-shadow:0 0 5px #ff431f,0 0 14px #ff431f75}.dial-control{display:flex;flex-direction:column;align-items:center;gap:13px}.dial{width:53px;height:53px;border-radius:50%;position:relative;padding:5px;border:1px solid #06080b;background:repeating-conic-gradient(from 0deg,#1b1f24 0deg 5deg,#07090d 6deg 10deg);box-shadow:0 5px 5px #0009,-1px -1px 1px #687a8e4d,1px 1px 1px #d4462933;cursor:pointer;touch-action:manipulation}.dial-face{height:100%;width:100%;display:block;position:relative;border-radius:50%;background:radial-gradient(circle at 33% 20%,#323a42 0%,#20242b 30%,#0c0e13 75%);box-shadow:inset 0 1px 1px #77808c44,inset 1px -1px 3px #000;transform:rotate(var(--dial-angle,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}.dial-face i{position:absolute;top:3px;left:calc(50% - 1px);height:10px;width:2px;background:#838b8f;border-radius:1px;box-shadow:0 0 2px #a0e8ff55}.power-dial{height:45px;width:45px;--dial-angle:-30deg}.power-dial .dial-face i{background:#ad6352}.dial:hover .dial-face{filter:brightness(1.3)}.side-vents{width:43px;flex:1;min-height:30px;max-height:240px;margin-top:6px;background:repeating-linear-gradient(0deg,#020307 0 3px,#252124 4px,#0d1014 5px 8px);border-radius:3px;opacity:.85}.model-number{font-size:5px;line-height:1.8;letter-spacing:1px;color:#595258;text-align:center;margin-top:auto}
.console{position:absolute;left:37px;right:var(--rail);bottom:16px;height:34px;display:flex;align-items:center;gap:26px}.lower-vents{height:13px;width:200px;max-width:25%;margin:0 auto 0 150px;background:repeating-linear-gradient(90deg,#030509 0 2px,#25232a 3px,#0b0d13 4px 7px);opacity:.65}.signal{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:6px;letter-spacing:1.2px;color:#987d72}.signal-dot{width:4px;height:4px;background:#ec542b;border-radius:50%;box-shadow:0 0 5px #ff3a1e,0 0 11px #ff471960}.signal-dot.off{background:#42251e;box-shadow:none}.controls{display:flex;align-items:center;gap:17px}.controls button{display:flex;align-items:center;gap:7px;padding:4px 0;min-height:32px;border:0;background:none;cursor:pointer;font-size:7px;letter-spacing:1px;white-space:nowrap;color:#75818c}.controls button:hover{color:#9de7ff}.controls svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.screw{position:absolute;width:5px;height:5px;border-radius:50%;background:linear-gradient(45deg,#292c31 43%,#020307 44% 58%,#34353b 59%);box-shadow:0 0 0 1px #050609,inset 0 0 2px #000}.screw-tl{top:8px;left:8px}.screw-tr{top:8px;right:8px}.screw-bl{bottom:8px;left:8px}.screw-br{bottom:8px;right:8px}.antenna{position:absolute;top:-40px;width:2px;height:110px;z-index:-1;transform-origin:bottom;background:linear-gradient(90deg,#020409,#366077,#0c1420)}.antenna-left{left:34%;transform:rotate(-54deg)}.antenna-right{right:33%;transform:rotate(38deg);background:linear-gradient(90deg,#050509,#87433a,#0c1420)}
.television.off .osd{opacity:0}.television.off .crt-glass{box-shadow:none}.television.off .channel-id{color:#44241e;text-shadow:none}.fallback{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at 30% 45%,#0e6490,#031530 55%,#02040b);}.fallback img{width:90%;filter:invert(1);mix-blend-mode:screen}.television.off .fallback img{visibility:hidden}.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}
@media(max-width:700px){:root{--rail:20px;--chin:98px}.cabinet{inset:8px;border-radius:11px}.screen-surround{top:12px;left:11px;right:11px;bottom:var(--chin);padding:9px;border-radius:6% / 3%}.crt-glass{border-radius:5% / 2.5%}.hardware{right:17px;top:auto;bottom:13px;height:66px;width:auto;flex-direction:row;gap:18px;align-items:center}.frequency{width:31px;gap:4px}.channel-id{font-size:21px;width:32px;padding:3px 0 2px 2px}.frequency>.hardware-label:first-child,.channel-caption,.side-vents,.model-number{display:none}.dial-control{gap:7px}.dial{width:41px;height:41px;padding:4px}.power-dial{width:35px;height:35px}.hardware-label{font-size:5px;letter-spacing:1px}.dial-face i{height:8px;top:2px}.console{left:23px;right:auto;bottom:22px;height:40px;gap:15px;display:flex}.lower-vents{display:none}.signal{font-size:5px;gap:5px;letter-spacing:.7px}.controls{gap:4px}.controls button{min-width:32px;min-height:40px;padding:6px 1px;justify-content:center}.controls button span{display:none}.controls svg{width:12px;height:12px}.osd{font-size:9px;left:8%;right:8%;letter-spacing:1px}.osd-top{top:5%}.stereo{font-size:7px;letter-spacing:2px}.osd-bottom{bottom:5%;font-size:6px;letter-spacing:1px}.transmission{display:none}.crt-glass:after{box-shadow:inset 0 0 10px 3px #000,inset 0 0 70px 6px #0006}.antenna{display:none}}
@media(max-height:480px) and (min-width:701px){:root{--chin:54px;--rail:76px}.cabinet{inset:9px}.hardware{top:24px;right:12px;width:50px;gap:18px;bottom:65px}.frequency{gap:4px}.channel-id{font-size:22px;width:40px}.side-vents,.model-number{display:none}.dial{width:42px;height:42px}.power-dial{width:35px;height:35px}.console{bottom:10px}.osd{font-size:9px}.osd-bottom{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
