:root{--accent-rgb:61, 255, 143;--accent:#3dff8f;--accent-hover:#7dffb8;--accent-glow:rgba(var(--accent-rgb), .6);--accent-ink:#04180d;--neon-light:#d6ffe8;--neon-dark:#12a35e;--neon:#35f0ff;--neon-glow:#35f0ff8c;--text:#fffffff2;--text-dim:#e9d6ff9e;--glass:#080a0f9e;--stroke:#ffffff1f;--track:#ffffff2e;--radius:24px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body{height:100%}body{color:var(--text);-webkit-font-smoothing:antialiased;background:#0b0d12;margin:0;font-family:ui-sans-serif,-apple-system,SF Pro Text,Segoe UI,system-ui,sans-serif}.backdrop{z-index:-1;background:linear-gradient(160deg,#101427,#06070c 60%,#06202e);position:fixed;inset:0}.backdrop-layer{opacity:0;filter:saturate(112%)contrast(102%);background-position:50%;background-repeat:no-repeat;background-size:cover;transition:opacity .8s;position:absolute;inset:0}.backdrop-layer.is-active{opacity:1}.backdrop:after{content:"";background:radial-gradient(125% 95% at 50% 42%,#0000 34%,#00000080 100%),linear-gradient(#00000052,#0000 26% 60%,#00000070);position:absolute;inset:0}.visualizer{z-index:0;pointer-events:none;opacity:0;width:100%;height:min(28vh,200px);transition:opacity .6s;position:fixed;bottom:0;left:0;-webkit-mask-image:linear-gradient(#0000,#000 70%);mask-image:linear-gradient(#0000,#000 70%)}.visualizer.active{opacity:1}.stage{z-index:1;justify-content:center;align-items:center;gap:clamp(20px,5vw,72px);min-height:100dvh;padding:24px;display:flex;position:relative}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.wordmark{letter-spacing:-.04em;white-space:nowrap;-webkit-user-select:none;user-select:none;color:#0000;filter:drop-shadow(0 2px 5px #0000008c)drop-shadow(0 10px 32px #000000b3);background-image:linear-gradient(170deg,#fff,#ffffffdb);-webkit-background-clip:text;background-clip:text;flex:0 auto;font-size:clamp(2.75rem,7vw,6rem);font-weight:800;line-height:.9}.wordmark-left{text-align:right}.wordmark-right{text-align:left}.wordmark-compact{letter-spacing:-.035em;color:#0000;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 2px 5px #0000008c)drop-shadow(0 10px 32px #000000b3);background-image:linear-gradient(170deg,#fff,#ffffffdb);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(1.9rem,9vw,2.6rem);font-weight:800;display:none}.card{border:1px solid rgba(var(--accent-rgb), .55);background:linear-gradient(180deg, rgba(var(--accent-rgb), .12), #0000001a 55%, #0003), radial-gradient(120% 80% at 50% 0%, #35f0ff24, transparent 62%), linear-gradient(165deg, #0c0e1480, #07080d8a 55%, #03040794);-webkit-backdrop-filter:blur(26px)saturate(165%);width:min(400px,100%);box-shadow:inset 0 1px 0 rgba(var(--accent-rgb), .42), inset 0 0 34px #35f0ff17, 0 0 24px rgba(var(--accent-rgb), .3), 0 0 64px #35f0ff24, 0 30px 80px #0009;border-radius:22px;flex:none;padding:16px 18px 14px;transition:border-color .55s,box-shadow .55s}.dial-window{background:linear-gradient(#06070c80,#0c0e165c);border:1px solid #35f0ff59;border-radius:12px;padding:8px 10px 6px;box-shadow:inset 0 1px #35f0ff33,inset 0 -2px 8px #0009,0 0 16px #35f0ff29}.dial-glass{background:radial-gradient(120% 170% at 50% 135%,#35f0ff80,#7850ff2e 52%,#0000 78%),linear-gradient(#080a10d1,#030408db);border:1px solid #000000b3;border-radius:7px;height:42px;position:relative;overflow:hidden;box-shadow:inset 0 2px 8px #000000bf,inset 0 0 26px #35f0ff3d,0 0 22px #35f0ff33}.dial-ticks{background-image:repeating-linear-gradient(90deg,#35f0ff99 0 1px,#0000 1px 5%);height:9px;position:absolute;top:0;left:0;right:0}.dial-marks{position:absolute;inset:0}.dial-mark{letter-spacing:.04em;white-space:nowrap;color:#35f0ffbf;text-shadow:0 0 8px #35f0ff8c;font-family:ui-monospace,SF Mono,JetBrains Mono,monospace;font-size:.62rem;position:absolute;top:15px;transform:translate(-50%)}.dial-mark:before{content:"";background:#35f0fff2;width:1px;height:12px;position:absolute;top:-14px;left:50%;box-shadow:0 0 6px #35f0ffcc}.dial-mark.current{color:var(--neon-light);text-shadow:0 0 10px var(--accent-glow)}.dial-mark.current:before{background:var(--accent);box-shadow:0 0 8px var(--accent-glow)}.dial-needle{top:2px;bottom:2px;left:var(--needle,50%);background:linear-gradient(180deg, var(--neon-light), var(--accent));width:2px;box-shadow:0 0 10px rgba(var(--accent-rgb), .95), 0 0 26px rgba(var(--accent-rgb), .6);border-radius:2px;margin-left:-1px;transition:left .55s cubic-bezier(.4,0,.2,1),background .55s,box-shadow .55s;position:absolute}.speaker{align-items:stretch;gap:10px;margin:12px 0;display:flex}.grille{background:repeating-linear-gradient(#0009 0 2px,#35f0ff29 2px 5px);border-radius:8px;flex:1;box-shadow:inset 0 1px #35f0ff38,inset 0 -1px 3px #0009}.art{aspect-ratio:1;width:min(190px,52%);box-shadow:0 0 0 2px rgba(var(--accent-rgb), .7), 0 0 0 4px #0009, 0 0 18px rgba(var(--accent-rgb), .35), 0 0 34px #35f0ff33, 0 10px 26px #0000008c;background:#ffffff0f;border-radius:10px;flex:none;place-items:center;transition:box-shadow .55s;display:grid;position:relative;overflow:hidden}.art-image{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.channel-art{object-fit:cover;border-radius:8px;flex-shrink:0;width:40px;height:40px}.meta{text-align:center;margin:0 0 10px}.track-title{letter-spacing:-.01em;margin:0;font-size:1.2rem;font-weight:620}.track-artist{color:var(--text-dim);min-height:1.2em;margin:5px 0 0;font-size:.875rem}.track-title,.track-artist{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dial{justify-content:center;align-items:baseline;gap:10px;margin-top:7px;display:flex}.dial-frequency{letter-spacing:.02em;color:var(--accent);text-shadow:0 0 22px var(--accent-glow);font-family:ui-monospace,SF Mono,JetBrains Mono,monospace;font-size:1.55rem;font-weight:600}.dial-name{color:var(--text-dim);font-size:.9rem;font-weight:550}.onair{letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);justify-content:center;align-items:center;gap:6px;margin:0 0 6px;font-size:.66rem;font-weight:600;display:flex}.live-dot{background:#f87171;border-radius:50%;width:6px;height:6px;box-shadow:0 0 8px #f87171e6}.is-playing .live-dot{animation:1.8s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.25}}.wave{opacity:.55;width:100%;height:36px;transition:opacity .4s;display:block}.wave.active{opacity:1}.slider{appearance:none;cursor:pointer;background:linear-gradient(to right, var(--accent) var(--p,0%), var(--track) var(--p,0%));border-radius:999px;width:100%;height:5px;margin:0}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:none;border-radius:50%;width:13px;height:13px;transition:transform .15s;box-shadow:0 2px 8px #00000080}.slider::-moz-range-thumb{background:#fff;border:none;border-radius:50%;width:13px;height:13px;box-shadow:0 2px 8px #00000080}.radio .slider::-webkit-slider-thumb{background:var(--neon-light);box-shadow:0 0 10px rgba(var(--accent-rgb), .9), 0 1px 4px #00000080}.radio .slider::-moz-range-thumb{background:var(--neon-light);box-shadow:0 0 10px rgba(var(--accent-rgb), .9), 0 1px 4px #00000080}.slider:hover::-webkit-slider-thumb{transform:scale(1.25)}.slider:focus-visible::-webkit-slider-thumb{transform:scale(1.25)}.slider:disabled{cursor:default;opacity:.5}.times{font-variant-numeric:tabular-nums;color:var(--text-dim);justify-content:space-between;margin-top:7px;font-size:.75rem;display:flex}.controls{justify-content:center;align-items:center;gap:20px;margin:12px 0 6px;display:flex}.controls .btn{color:#d2fafff2;background:radial-gradient(circle at 50% 30%,#35f0ff29,#0000 62%),conic-gradient(from 205deg,#0f1118,#1e2230 24%,#0a0c12 50%,#1e2230 76%,#0f1118);border:1px solid #35f0ff66;transition:filter .18s,transform .18s;box-shadow:inset 0 1px #35f0ff4d,inset 0 -3px 7px #000000b3,0 0 12px #35f0ff40,0 4px 12px #0000008c}.controls .btn:hover{filter:brightness(1.3);background:radial-gradient(circle at 50% 30%,#35f0ff29,#0000 62%),conic-gradient(from 205deg,#0f1118,#1e2230 24%,#0a0c12 50%,#1e2230 76%,#0f1118)}.controls .btn-primary{width:54px;height:54px;color:var(--accent-ink);border-color:rgba(var(--accent-rgb), .75);background:radial-gradient(circle at 50% 28%, var(--neon-light), var(--accent) 48%, var(--neon-dark) 84%);box-shadow:inset 0 1px 0 #ffe8fad9, inset 0 -4px 10px #00000073, 0 0 18px rgba(var(--accent-rgb), .6), 0 0 42px rgba(var(--accent-rgb), .3), 0 6px 18px #00000080}.controls .btn-primary:hover:not(:disabled){filter:brightness(1.14);transform:scale(1.04)}.btn{width:44px;height:44px;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:50%;place-items:center;padding:0;transition:background .18s,transform .18s,color .18s;display:grid}.btn svg{fill:currentColor;width:24px;height:24px}svg[hidden]{display:none}.btn:hover{background:#ffffff1a}.btn:active{transform:scale(.92)}.btn:disabled{opacity:.35;cursor:default;background:0 0}.btn-primary{background:var(--accent);width:62px;height:62px;color:var(--accent-ink);box-shadow:0 8px 24px rgba(var(--accent-rgb), .35)}.btn-primary svg{width:28px;height:28px}.btn-primary:hover:not(:disabled){background:var(--accent-hover);transform:scale(1.05)}.btn-ghost{width:auto;height:38px;color:var(--text-dim);border-radius:999px;padding:0 10px}.btn-ghost svg{width:20px;height:20px}.btn-ghost:hover{color:var(--text)}.btn-label{grid-auto-flow:column;gap:8px;font-family:inherit;font-size:.82rem;font-weight:550}.bottom{justify-content:space-between;align-items:center;gap:12px;margin-top:6px;display:flex}.volume{align-items:center;gap:10px;width:148px;display:flex}.volume-icon{width:20px;height:20px;fill:var(--text-dim);flex-shrink:0}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.hud{z-index:8;border:1px solid rgba(var(--accent-rgb), .28);-webkit-backdrop-filter:blur(18px)saturate(150%);font-variant-numeric:tabular-nums;color:var(--text);box-shadow:0 0 18px rgba(var(--accent-rgb), .14);-webkit-user-select:none;user-select:none;background:#080a0f80;border-radius:999px;align-items:center;gap:8px;padding:7px 13px;font-size:.78rem;transition:border-color .55s,box-shadow .55s;display:flex;position:fixed;top:20px}.hud-left{left:20px}.hud-right{right:20px}.hud-label{color:var(--text-dim)}.listener-dot{background:var(--accent);border-radius:50%;width:8px;height:8px;animation:3.4s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.55;box-shadow:0 0 5px rgba(var(--accent-rgb), .5);transform:scale(.8)}50%{opacity:1;box-shadow:0 0 13px rgba(var(--accent-rgb), .95), 0 0 26px rgba(var(--accent-rgb), .45);transform:scale(1.2)}}.clock{letter-spacing:.06em;color:var(--accent);text-shadow:0 0 10px var(--accent-glow);font-family:ui-monospace,SF Mono,JetBrains Mono,monospace;font-size:.82rem;font-weight:600}.scrim{z-index:5;opacity:0;background:#00000080;transition:opacity .28s;position:fixed;inset:0}.scrim.open{opacity:1}.panel{z-index:6;width:min(400px,100%);max-height:min(70dvh,460px);padding:4px 8px calc(10px + env(safe-area-inset-bottom));border:1px solid rgba(var(--accent-rgb), .4);border-radius:var(--radius) var(--radius) 0 0;background:linear-gradient(180deg, rgba(var(--accent-rgb), .1), #00000038), radial-gradient(120% 90% at 50% 0%, #35f0ff1f, transparent 62%), linear-gradient(165deg, #0c0e149e, #05060bad);-webkit-backdrop-filter:blur(24px)saturate(140%);box-shadow:inset 0 1px 0 rgba(var(--accent-rgb), .35), 0 0 26px rgba(var(--accent-rgb), .2), 0 -20px 60px #000000a6;border-bottom:none;flex-direction:column;transition:transform .32s cubic-bezier(.32,.72,0,1);display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%,100%)}.panel.open{transform:translate(-50%)}.scrim[hidden],.panel[hidden]{display:none}.panel-header{justify-content:space-between;align-items:center;padding:6px 6px 6px 10px;display:flex}.panel-header h2{margin:0;font-size:.95rem;font-weight:620}.count{color:var(--text-dim);margin-left:8px;font-weight:400}.tracklist{overscroll-behavior:contain;margin:0;padding:0 0 4px;list-style:none;overflow-y:auto}.channel-row{width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:12px;padding:9px 10px;font-family:inherit;font-size:.875rem;display:flex}.channel-row:hover{background:#ffffff14}.channel-dial{letter-spacing:.04em;color:var(--text-dim);text-align:right;flex-shrink:0;font-family:ui-monospace,SF Mono,JetBrains Mono,monospace;font-size:.74rem}.channel-names{flex:1;min-width:0}.channel-names strong,.channel-names span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.channel-names strong{font-weight:550}.channel-onair{color:var(--text-dim);margin-top:2px;font-size:.78rem}.channel-row.current{background:rgba(var(--accent-rgb), .18);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb), .35)}.channel-row.current .channel-dial,.channel-row.current .channel-names strong{color:var(--accent)}.empty-state{color:var(--text-dim);text-align:center;padding:18px 14px 26px;font-size:.86rem;line-height:1.6}.empty-state code{color:var(--text);background:#ffffff1a;border-radius:6px;padding:2px 6px;font-size:.82em}.toast{z-index:7;border:1px solid var(--stroke);-webkit-backdrop-filter:blur(20px);opacity:0;background:#10121be6;border-radius:999px;padding:10px 18px;font-size:.82rem;transition:opacity .25s,transform .25s;position:fixed;bottom:28px;left:50%;transform:translate(-50%,12px)}.toast.show{opacity:1;transform:translate(-50%)}.toast[hidden]{display:none}@media (max-width:900px){.stage{flex-direction:column;gap:20px}.wordmark{display:none}.wordmark-compact{display:block}}@media (max-width:480px){.stage{padding:16px}.card{border-radius:20px;padding:18px}.volume{width:120px}.hud{padding:6px 10px;font-size:.72rem;top:14px}.hud-left{left:12px}.hud-right{right:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}