:root{--bg: #0e0e12;--card: #1b1b22;--card-2: #24242e;--text: #f4f4f7;--muted: #8b8b97;--accent: #b06ab3;--accent-2: #9b59d0;--line: rgba(255, 255, 255, .06);--tick: rgba(255, 255, 255, .22);--tick-strong: rgba(255, 255, 255, .5);--logo-bg: rgba(255, 255, 255, .05);--dot-idle: #3a3a44}:root[data-theme=light]{--bg: #eef0f5;--card: #ffffff;--card-2: #e4e7ee;--text: #1a1b22;--muted: #6b6e7a;--accent: #7a4fd0;--accent-2: #9b59d0;--line: rgba(0, 0, 0, .1);--tick: rgba(0, 0, 0, .28);--tick-strong: rgba(0, 0, 0, .55);--logo-bg: rgba(0, 0, 0, .05);--dot-idle: #c2c5cf}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-user-select:none;user-select:none;overscroll-behavior:none}.loading{display:grid;place-items:center;height:100%;color:var(--muted)}.app{position:relative;max-width:440px;margin:0 auto;min-height:100%;padding:22px 22px 34px;display:flex;flex-direction:column}.player{flex:1;display:flex;flex-direction:column;justify-content:center;gap:24px;min-height:0}.topbar{display:flex;align-items:center;justify-content:space-between;padding-top:8px}.brand{letter-spacing:4px;font-weight:700;font-size:14px;color:var(--muted)}.game-pill{background:var(--card-2);color:var(--text);border:none;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer}.top-right{display:flex;align-items:center;gap:12px}.icon-btn{width:36px;height:36px;border-radius:50%;background:var(--card-2);border:none;color:var(--text);display:grid;place-items:center;cursor:pointer;opacity:.85;transition:opacity .15s,transform .1s}.icon-btn:hover{opacity:1}.icon-btn:active{transform:scale(.92)}.status-dot{width:12px;height:12px;border-radius:50%;background:var(--dot-idle)}.status-dot[data-status=playing]{background:#57d977;box-shadow:0 0 10px #57d97799}.status-dot[data-status=loading]{background:#e0b94a}.status-dot[data-status=static]{background:#6a6a76}.status-dot[data-status=error]{background:#e0584a}.hero{display:flex;flex-direction:column;align-items:center;text-align:center}.hero.off{opacity:.7}.hero-name{font-size:26px;font-weight:800;margin-top:22px}.hero-np{font-size:11px;letter-spacing:2.5px;color:var(--accent);margin-top:12px;min-height:13px;transition:color .3s}.hero-track{font-size:15px;color:var(--muted);margin-top:5px;max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.freq-chip{margin-top:18px;font-size:12px;letter-spacing:1px;color:var(--muted);border:1px solid var(--tick);padding:6px 15px;border-radius:999px}.logo{width:52px;height:52px;border-radius:12px;flex:0 0 auto;display:grid;place-items:center;overflow:hidden}.logo.badge{font-weight:800;font-size:16px;color:#fff}.logo.placeholder{background:var(--card-2);color:var(--muted);font-size:16px}.logo.img{background:var(--logo-bg);padding:5px}.logo.img img{width:100%;height:100%;object-fit:contain}.hero-logo .logo{width:150px;height:150px;border-radius:28px;box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent),0 0 38px color-mix(in srgb,var(--accent) 45%,transparent);transition:box-shadow .3s}.hero-logo .logo.badge{font-size:42px;font-style:italic}.hero-logo .logo.placeholder{font-size:34px}.hero-logo .logo.img{padding:12px}.viz{display:flex;align-items:center;justify-content:center;gap:3px;height:44px}.viz span{width:4px;height:5px;border-radius:2px;background:var(--accent);opacity:.28;transition:opacity .3s}.viz.live span{opacity:1}.dial{position:relative;height:120px;overflow:hidden;touch-action:none;cursor:grab;border-top:1px solid var(--line);border-bottom:1px solid var(--line);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}.dial:active{cursor:grabbing}.dial-strip{position:absolute;left:50%;top:0;height:100%}.tick{position:absolute;top:30px;width:2px;height:18px;background:var(--tick)}.tick.major{top:26px;height:26px;background:var(--tick-strong)}.tick-label{position:absolute;top:32px;left:50%;transform:translate(-50%);font-size:13px;color:var(--muted)}.station-mark{position:absolute;top:66px;background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;padding:0}.station-mark .dot{width:9px;height:9px;border-radius:50%;background:var(--c)}.station-mark.near .dot{width:11px;height:11px;box-shadow:0 0 8px var(--c)}.mark-name{font-size:12px;font-weight:600;color:var(--text);white-space:nowrap}.needle{position:absolute;left:50%;top:6px;bottom:6px;width:2px;margin-left:-1px;background:var(--accent);box-shadow:0 0 14px var(--accent);border-radius:2px;transition:background .25s,box-shadow .25s}.needle:before{content:"";position:absolute;top:-3px;left:50%;transform:translate(-50%);width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}.controls{display:flex;align-items:center;justify-content:center;gap:36px;margin-top:6px}.ctl{background:none;border:none;color:var(--text);cursor:pointer;opacity:.8;transition:opacity .15s,transform .1s;display:grid;place-items:center}.ctl svg{display:block}.ctl:not(.play):hover{opacity:1}.ctl:not(.play):active{transform:scale(.9)}.ctl.play{width:78px;height:78px;border-radius:50%;background:var(--card-2);font-size:28px;display:grid;place-items:center;transition:background .25s,box-shadow .25s,transform .1s}.ctl.play.on{background:var(--accent);color:#fff;box-shadow:0 0 30px color-mix(in srgb,var(--accent) 50%,transparent)}.ctl.play:active{transform:scale(.95)}.debug{margin-top:12px;font-family:ui-monospace,monospace;font-size:12px;color:var(--accent);opacity:.9}.error-hint{text-align:center;color:#e0584a;font-size:13px}@media (max-width: 480px){.player{gap:16px;justify-content:flex-start;padding-top:7vh}.hero-name{margin-top:14px}.hero-np{margin-top:8px}.hero-track{margin-top:4px}.freq-chip{margin-top:12px}}