:root{--ink: #181425;--ink-deep: #0e0b18;--night: #222034;--panel: #2e2a4a;--panel-head: #3f3f74;--text: #f4f4f4;--text-sub: #cbdbfc;--text-dim: #9badb7;--yellow: #fbf236;--green: #99e550;--orange: #df7126;--red: #ac3232;--plum: #45283c;--wood: #d9a066;--wood-dark: #8f563b;--wood-deep: #663931;--cream: #eec39a;--cream-shadow: #c28569;--lcd-bg: #1f2a17;--lcd-text: #99e550;--lcd-bright: #d6f5b0;color-scheme:dark}*{box-sizing:border-box}html{background:var(--night)}body{margin:0;min-height:100vh;background:var(--night);color:var(--text);font-family:DotGothic16,monospace;line-height:1.6;-webkit-font-smoothing:none}a{color:var(--yellow)}a:hover{color:var(--cream)}button{font-family:inherit}button:focus-visible,a:focus-visible{outline:4px solid var(--yellow);outline-offset:2px}svg{image-rendering:pixelated}@keyframes zr-blink{50%{opacity:0}}.site-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px;padding:16px 40px;background:var(--ink);border-bottom:4px solid var(--ink-deep)}.brand{display:flex;align-items:center;gap:12px}.brand-name{font-size:24px;letter-spacing:2px}.header-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;font-size:14px}.header-status{display:flex;align-items:center;gap:8px;color:var(--text-sub)}.dot-led{width:10px;height:10px;background:var(--green);animation:zr-blink 1.6s steps(2) infinite}.dot-led.is-orange{background:var(--orange);animation-duration:1.2s}.toggle{height:44px;display:flex;align-items:center;gap:8px;padding:0 14px;background:var(--panel);color:var(--text);border:4px solid var(--panel-head);font-size:14px;cursor:pointer}.toggle-value{padding:2px 6px;background:var(--plum);color:var(--text)}.toggle[aria-pressed=true] .toggle-value,.toggle-value.is-mode{background:var(--green);color:var(--ink)}.layout{width:100%;max-width:1280px;margin:0 auto;padding:40px;display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}.radio-column{flex:0 1 760px;min-width:0;display:flex;flex-direction:column;gap:16px}.panel{flex:1 1 320px;min-width:0;background:var(--panel);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink-deep)}.radio{width:100%;max-width:760px;padding:0 8px 8px 0;color:var(--ink);display:flex;flex-direction:column}.antenna{display:block;width:100%;height:72px}.radio-body{background:var(--wood);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink-deep);padding:20px 24px 24px;display:flex;flex-direction:column;gap:16px}.radio-band{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--wood-dark);border:4px solid var(--ink);padding:6px 12px;color:var(--cream)}.radio-brand{font-size:16px;letter-spacing:4px}.radio-led{display:flex;align-items:center;gap:8px;font-size:14px;letter-spacing:2px}.led{width:12px;height:12px;border:2px solid var(--ink);background:var(--plum)}.radio[data-mode=play] .led{background:var(--green);animation:zr-blink 1.6s steps(2) infinite}.radio[data-mode=tuning] .led{background:var(--yellow);animation:zr-blink .3s steps(2) infinite}.radio[data-mode=standby] .led,.radio[data-mode=ended] .led{background:var(--orange);animation:zr-blink 1.2s steps(2) infinite}.radio-main{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start}.radio-left{flex:1 1 472px;max-width:472px;min-width:0;display:flex;flex-direction:column;gap:12px}.monitor{background:#222034;border:4px solid var(--ink);padding:8px;box-shadow:inset 0 0 0 4px var(--panel-head)}.screen{position:relative;width:100%;aspect-ratio:16 / 9;min-height:200px;background:#0b0a12;overflow:hidden}.player-slot,.player-slot iframe,#player{position:absolute;inset:0;width:100%;height:100%;border:0}.screen-off,.screen-standby{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;color:var(--text-dim)}.radio[data-mode=off] .screen-off{display:flex;background:#050508;font-size:12px;letter-spacing:4px}.screen-off-line{width:96px;height:4px;background:var(--panel-head)}.radio[data-mode=standby] .screen-standby{display:flex;font-size:13px;background:repeating-linear-gradient(0deg,#11101c 0 2px,#0b0a12 2px 6px)}.screen-standby-title{font-size:20px;letter-spacing:6px;color:var(--orange);animation:zr-blink 1.2s steps(2) infinite}.dial{position:relative;height:44px;background:var(--cream);border:4px solid var(--ink);overflow:hidden}.dial-ticks{position:absolute;left:14px;right:14px;top:6px;height:14px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 16px)}.dial-labels{position:absolute;left:10px;right:10px;bottom:2px;display:flex;justify-content:space-between;font-size:11px}.dial-track{position:absolute;inset:0 14px}.needle{position:absolute;top:0;bottom:0;left:0;width:4px;margin-left:-2px;background:var(--red);transition:left .6s steps(6)}.lcd{background-color:var(--lcd-bg);border:4px solid var(--ink);box-shadow:inset 0 0 0 2px #2c3d20;padding:10px 14px;color:var(--lcd-text);font-size:14px;line-height:1.6;display:flex;flex-direction:column;gap:2px;min-height:76px}.radio[data-mode=tuning] .lcd{background-image:repeating-linear-gradient(0deg,rgba(153,229,80,.12) 0 2px,transparent 2px 5px),repeating-linear-gradient(90deg,rgba(153,229,80,.08) 0 3px,transparent 3px 7px)}.lcd-row{display:flex;justify-content:space-between;gap:12px}.lcd-line1,.lcd-line2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lcd-idx{flex:none}.lcd-line2{font-size:16px;color:var(--lcd-bright)}.lcd-line3{font-size:13px;color:#8fd14f}.lcd-ended{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:4px;font-size:13px}.lcd-ended a{color:var(--lcd-bright)}.lcd-button{min-height:32px;padding:0 10px;background:var(--lcd-text);color:var(--lcd-bg);border:2px solid var(--ink);font-size:13px;cursor:pointer}.radio-right{flex:1 1 180px;max-width:200px;display:flex;flex-direction:column;gap:16px}.speaker{height:228px;border:4px solid var(--ink);background-color:var(--ink);background-image:linear-gradient(90deg,transparent 4px,var(--wood-dark) 4px),linear-gradient(transparent 4px,var(--wood-dark) 4px);background-size:8px 8px}.knobs{display:flex;justify-content:space-around;align-items:center}.knob-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px}.knob{position:relative;width:36px;height:36px;background:var(--wood-deep);border:4px solid var(--ink)}.knob:after{content:"";position:absolute;top:2px;left:14px;width:4px;height:12px;background:var(--cream)}.knob.is-tune:after{left:20px;top:4px}.radio[data-mode=tuning] .knob.is-tune{animation:zr-turn .4s steps(4) infinite}@keyframes zr-turn{to{transform:rotate(90deg)}}.radio-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.radio-button,.power-button{display:flex;align-items:center;justify-content:center;gap:6px;border:4px solid var(--ink);font-size:14px;cursor:pointer}.radio-button{height:48px;background:var(--cream);color:var(--ink);box-shadow:inset -4px -4px 0 var(--cream-shadow)}.radio-button:active:not(:disabled),.power-button:active{box-shadow:inset 4px 4px 0 var(--cream-shadow)}.radio-button:disabled{cursor:default;opacity:.55}.power-button{height:44px;gap:8px;background:var(--wood-deep);color:var(--cream);box-shadow:inset -4px -4px 0 var(--plum)}.power-button[aria-pressed=true]{color:var(--green)}.radio-feet{display:flex;justify-content:space-between;padding:0 56px}.radio-feet div{width:40px;height:12px;background:var(--ink)}.intro{margin-top:72px;padding:28px;display:flex;flex-direction:column;gap:20px}.intro h1{margin:0;font-size:28px;font-weight:400;line-height:1.4}.intro-lead{margin:0;font-size:15px;line-height:1.8;color:var(--text-sub)}.start-button{display:flex;align-items:center;justify-content:center;gap:12px;height:64px;background:var(--yellow);color:var(--ink);border:4px solid var(--ink);box-shadow:inset -4px -4px 0 var(--wood),6px 6px 0 var(--ink-deep);font-size:22px;cursor:pointer}.start-button:active{box-shadow:inset 4px 4px 0 var(--wood),2px 2px 0 var(--ink-deep);transform:translate(4px,4px)}.note{margin:0;font-size:12px;line-height:1.7;color:var(--text-dim)}.shortcuts{display:flex;flex-direction:column;gap:8px;margin:0;padding-top:16px;border-top:2px dashed var(--panel-head);font-size:13px;color:var(--text-sub)}.shortcuts div{display:flex;justify-content:space-between;gap:12px}.shortcuts dt,.shortcuts dd{margin:0}.list-panel{display:flex;flex-direction:column}.panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 16px;background:var(--panel-head);border-bottom:4px solid var(--ink)}.panel-head h2{margin:0;font-size:18px;font-weight:400}.panel-head span{font-size:12px;color:var(--text-sub)}.list{list-style:none;margin:0;padding:0;max-height:640px;overflow-y:auto}.list-item{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;padding:12px 16px;border:0;border-bottom:2px solid var(--ink);background:var(--panel);color:var(--text);cursor:pointer}.list-item:hover{background:#36325a}.list-item.is-current{background:var(--yellow);color:var(--ink)}.list-no{flex:none;width:24px;font-size:14px}.list-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.list-channel,.list-meta{font-size:12px;color:var(--text-sub)}.list-item.is-current .list-channel,.list-item.is-current .list-meta{color:var(--plum)}.list-title{font-size:15px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.list-badge{flex:none;padding:2px 6px;font-size:12px;background:var(--ink);color:var(--yellow)}.list-empty{padding:48px 24px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.list-empty p{margin:0;font-size:14px;line-height:1.8;color:var(--text-sub)}.list-empty .list-empty-title{font-size:18px;color:var(--text)}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);max-width:calc(100% - 32px);padding:12px 16px;background:var(--ink);color:var(--text);border:4px solid var(--yellow);box-shadow:6px 6px 0 var(--ink-deep);font-size:14px;z-index:10}[hidden]{display:none!important}@media(max-width:760px){.site-header{padding:12px 16px}.layout{padding:24px 16px;gap:32px}.radio-body{padding:16px}.radio-right{max-width:none;flex-basis:100%}.speaker{height:56px}.intro{margin-top:0}.antenna{height:48px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}