:root{--bg: #0f1724;--card: #111827;--accent: #ff6b6b;--accent-2: #ffa07a;--muted: #94a3b8;--text: #e6eef8;--success: #22c55e;--warning: #f59e0b;--error: #ef4444;--border: rgba(255, 255, 255, .08);--hover: rgba(255, 255, 255, .05);--hover-card: rgba(255, 255, 255, .04);--player-bg: #0b1324;--player-accent-1: rgba(255, 107, 107, .18);--player-accent-2: rgba(255, 160, 122, .1);--player-border: rgba(255, 107, 107, .25);--status-bg: #08142a;--input-bg: #111827}[data-theme=midnight]{--bg: #000000;--card: #0d0d0d;--accent: #a855f7;--accent-2: #818cf8;--muted: #6b7280;--text: #f3f4f6;--border: rgba(168, 85, 247, .15);--hover: rgba(168, 85, 247, .07);--hover-card: rgba(168, 85, 247, .06);--player-bg: #000000;--player-accent-1: rgba(168, 85, 247, .2);--player-accent-2: rgba(99, 102, 241, .1);--player-border: rgba(168, 85, 247, .3);--status-bg: #0d0d0d;--input-bg: #0d0d0d}[data-theme=ocean]{--bg: #020d1a;--card: #041225;--accent: #06b6d4;--accent-2: #3b82f6;--muted: #64748b;--text: #e0f2fe;--border: rgba(6, 182, 212, .15);--hover: rgba(6, 182, 212, .07);--hover-card: rgba(6, 182, 212, .06);--player-bg: #020d1a;--player-accent-1: rgba(6, 182, 212, .2);--player-accent-2: rgba(59, 130, 246, .1);--player-border: rgba(6, 182, 212, .3);--status-bg: #041225;--input-bg: #041225}[data-theme=sunset]{--bg: #1a0f0a;--card: #1f1408;--accent: #f97316;--accent-2: #fbbf24;--muted: #9ca3af;--text: #fef3c7;--border: rgba(249, 115, 22, .15);--hover: rgba(249, 115, 22, .07);--hover-card: rgba(249, 115, 22, .06);--player-bg: #1a0f0a;--player-accent-1: rgba(249, 115, 22, .2);--player-accent-2: rgba(251, 191, 36, .1);--player-border: rgba(249, 115, 22, .3);--status-bg: #1f1408;--input-bg: #1f1408}[data-theme=forest]{--bg: #0a1a0f;--card: #0d1f12;--accent: #22c55e;--accent-2: #86efac;--muted: #6b7280;--text: #dcfce7;--border: rgba(34, 197, 94, .15);--hover: rgba(34, 197, 94, .07);--hover-card: rgba(34, 197, 94, .06);--player-bg: #0a1a0f;--player-accent-1: rgba(34, 197, 94, .2);--player-accent-2: rgba(134, 239, 172, .1);--player-border: rgba(34, 197, 94, .3);--status-bg: #0d1f12;--input-bg: #0d1f12}[data-theme=light]{--bg: #f1f5f9;--card: #ffffff;--accent: #e53e3e;--accent-2: #ff6b6b;--muted: #64748b;--text: #1e293b;--success: #16a34a;--error: #dc2626;--border: rgba(0, 0, 0, .1);--hover: rgba(0, 0, 0, .04);--hover-card: rgba(0, 0, 0, .03);--player-bg: #ffffff;--player-accent-1: rgba(229, 62, 62, .1);--player-accent-2: rgba(255, 107, 107, .06);--player-border: rgba(229, 62, 62, .2);--status-bg: #e2e8f0;--input-bg: #ffffff}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica Neue,Arial;background:var(--bg);color:var(--text);line-height:1.5}.app{max-width:960px;margin:16px auto;padding:16px}.app.has-player{padding-top:16px}.player-top{position:sticky;top:0;z-index:50;margin:-16px -16px 16px;padding:14px 16px calc(14px + env(safe-area-inset-top));padding-top:calc(14px + env(safe-area-inset-top));background:linear-gradient(135deg,var(--player-accent-1),var(--player-accent-2)),var(--player-bg);border-bottom:1px solid var(--player-border);backdrop-filter:saturate(140%) blur(12px);-webkit-backdrop-filter:saturate(140%) blur(12px);box-shadow:0 10px 30px -10px #00000080;transition:transform .3s ease,opacity .3s ease}.player-top--hidden{transform:translateY(-100%);opacity:0;pointer-events:none;position:absolute;left:0;right:0}.player-top__inner{max-width:960px;margin:0 auto;display:flex;align-items:center;gap:16px}.player-top__info{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.player-top__viz-wrap{flex-shrink:0;display:flex;align-items:flex-end;height:36px}.player-top__canvas{display:block;border-radius:4px;image-rendering:pixelated}.player-top__meta{min-width:0;flex:1}.player-top__label{font-size:10px;font-weight:700;letter-spacing:1.2px;color:var(--accent);margin-bottom:2px;transition:color .3s ease}.player-top__label--connecting{color:#fbbf24;animation:blink-label .9s ease-in-out infinite}.player-top__label--buffering{color:#fb923c;animation:blink-label 1.2s ease-in-out infinite}.player-top__label--playing{color:#4ade80}@keyframes blink-label{0%,to{opacity:1}50%{opacity:.45}}.player-top__name{font-size:16px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-top__sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-top__controls{display:flex;align-items:center;gap:12px;flex-shrink:0}.player-top__audio{height:36px;width:260px;border-radius:8px}.player-top__row{display:flex;align-items:center;gap:8px}.player-top__btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;color:var(--text);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.player-top__btn:hover{background:#ffffff1f;border-color:#ffffff2e}.player-top__btn--stop{background:var(--error);border-color:var(--error);color:#fff}.player-top__btn--stop:hover{background:#dc2626;border-color:#dc2626}.player-top__volume{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:90px;height:6px;border-radius:3px;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--vol, 100%),rgba(255,255,255,.18) var(--vol, 100%),rgba(255,255,255,.18) 100%);outline:none;cursor:pointer}.player-top__volume::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 1px 4px #0006}.player-top__volume::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent);border:none;cursor:pointer}.player-top__quality{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);padding:8px 10px;border-radius:8px;color:var(--text);font-size:13px;min-height:36px}.player-top__collapse{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:var(--text);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s ease}.player-top__collapse:hover{background:#ffffff24}.player-top--collapsed .player-top__controls{display:none}.player-top--collapsed .player-top__inner{gap:10px}.searchbar.searchbar--bottom{display:grid}.header-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;flex-wrap:wrap}.theme-picker{display:flex;align-items:center;gap:8px;flex-shrink:0}.theme-picker__label{font-size:11px;font-weight:600;letter-spacing:.8px;color:var(--muted);text-transform:uppercase}.theme-picker__swatches{display:flex;gap:6px;align-items:center}.theme-swatch{width:22px;height:22px;border-radius:50%;border:2px solid transparent;background:var(--swatch);cursor:pointer;transition:transform .15s ease,border-color .15s ease;padding:0}.theme-swatch:hover{transform:scale(1.18)}.theme-swatch--active{border-color:var(--text);transform:scale(1.15)}.type-filters{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}.type-filter-btn{padding:7px 16px;border-radius:20px;border:1px solid var(--border);background:var(--hover);color:var(--muted);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease}.type-filter-btn:hover{border-color:var(--accent);color:var(--text)}.type-filter-btn--active{border-color:var(--accent);background:var(--accent);color:#fff;font-weight:700}.header-brand{display:flex;align-items:center;gap:14px}.logo{width:48px;height:48px;flex-shrink:0}.header-text h1{margin:0 0 2px;font-size:28px;font-weight:800;letter-spacing:-.5px;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-text p{margin:0;color:var(--muted);font-size:13px}.header-text__badge{font-size:.45em;font-weight:800;letter-spacing:1.5px;vertical-align:super;margin-left:3px;padding:2px 6px;border-radius:5px;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:unset;background-clip:unset;-webkit-text-fill-color:#fff;color:#fff;line-height:1}.banner{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding:12px 16px;border-radius:10px;background:linear-gradient(135deg,var(--player-accent-1),var(--player-accent-2));border:1px solid var(--player-border);font-size:13px;color:var(--muted)}.banner-tag{background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;letter-spacing:.8px;flex-shrink:0}.stations{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:12px}.stations li{display:flex;justify-content:space-between;align-items:center;padding:14px;border-radius:12px;background:linear-gradient(180deg,#ffffff05,#00000005);border:1px solid var(--border);transition:all .2s ease}.stations li:hover{background:linear-gradient(180deg,#ffffff0d,#00000005);border-color:#ffffff24;transform:translateY(-1px);box-shadow:0 4px 12px -4px #0006}.stations li:active{transform:translateY(0)}.stations li.active{outline:2px solid var(--accent);border-color:var(--accent);background:linear-gradient(180deg,#ff6b6b14,#00000005)}.stations li .meta{min-width:0;flex:1}.now-playing-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--success);flex-shrink:0;animation:dot-pulse 1.2s ease-in-out infinite}@keyframes dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.75)}}.btn-fav{background:transparent!important;border:1px solid rgba(255,255,255,.1)!important;color:var(--muted)!important;font-size:16px!important;padding:0!important;display:flex;align-items:center;justify-content:center}.btn-fav--active{color:#fbbf24!important;border-color:#fbbf244d!important}.stations li .meta strong{font-size:15px;font-weight:600;margin-bottom:2px;display:block}.stations li .meta .small{font-size:12px;color:var(--muted);margin-bottom:4px}.actions button{margin-right:6px;padding:8px 14px;border-radius:8px;border:0;background:var(--accent);color:#fff;font-weight:600;font-size:13px;min-height:36px;min-width:60px}.actions .btn-stop{background:var(--error)}.actions a{color:var(--muted);font-size:13px;padding:8px 12px;border-radius:8px;background:var(--hover);text-decoration:none;min-height:36px;display:flex;align-items:center}.player{margin-top:16px;padding:16px;border-radius:14px;background:#081028;color:var(--muted);display:flex;flex-direction:column;gap:12px}.player .controls{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap}.player .controls button{padding:10px 14px;border-radius:8px;font-size:14px;min-height:40px}.player .quality{background:transparent;border:1px solid rgba(255,255,255,.06);padding:10px 12px;border-radius:8px;color:var(--muted);font-size:14px;min-height:40px}.player .volume{display:flex;align-items:center;gap:12px}.player .volume button{min-width:70px}.player .volume input{flex:1;height:6px;border-radius:3px}.player audio{width:100%;max-width:100%;height:40px;border-radius:8px}.now{margin-top:4px;font-size:14px}.status{padding:10px;background:var(--status-bg);border-radius:8px;color:var(--muted)}.status.error{color:#ffb4b4}.type-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}.type-tab{padding:10px 16px;border-radius:20px;border:1px solid var(--border);background:var(--hover);color:var(--muted);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;min-height:40px;display:flex;align-items:center}.type-tab:hover{border-color:var(--accent);color:var(--text);background:#ff6b6b0d}.type-tab.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.type-badge{font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;letter-spacing:.5px;flex-shrink:0}.type-badge--community{background:#22c55e26;color:#4ade80;border:1px solid rgba(34,197,94,.3)}.type-badge--commercial{background:#fb923c26;color:#fb923c;border:1px solid rgba(251,146,60,.3)}.type-badge--direct{background:#60a5fa26;color:#60a5fa;border:1px solid rgba(96,165,250,.3)}.filter-toggles{display:flex;gap:16px;align-items:center;margin-bottom:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}.filter-toggles label{display:flex;align-items:center;gap:6px;cursor:pointer}.searchbar--bottom{margin-top:24px;margin-bottom:0;padding:18px;border-radius:14px;background:linear-gradient(180deg,#ffffff05,#0000000d);border:1px solid var(--border);display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.searchbar__heading{grid-column:1 / -1;font-size:11px;font-weight:700;letter-spacing:1.2px;color:var(--muted);text-transform:uppercase;margin-bottom:2px}.searchbar__actions{grid-column:1 / -1;display:flex;gap:10px}.searchbar__actions button{flex:1;padding:10px 16px;border-radius:10px;background:var(--accent);color:#fff;border:0;font-weight:600;font-size:14px;min-height:42px;cursor:pointer}.searchbar__actions button:last-child{background:var(--hover);color:var(--muted);border:1px solid var(--border)}.searchbar{display:flex;gap:8px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.searchbar-input{padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);font-size:14px;min-height:40px}.searchbar-input:focus{outline:2px solid var(--accent);border-color:var(--accent)}.searchbar-input--flex{flex:1 1 200px}.searchbar>button{flex:1;padding:10px 16px;border-radius:10px;background:var(--accent);color:#fff;border:0;font-weight:600;font-size:14px;min-height:40px;min-width:80px}.searchbar>button:last-child{background:var(--hover);color:var(--muted)}@media (min-width: 960px){.stations{grid-template-columns:1fr 1fr;gap:10px}.stations li{flex-direction:column;align-items:stretch;gap:8px;padding:16px}.stations li .meta{flex:none;width:100%}.stations li .actions{display:flex;gap:6px;width:100%;justify-content:flex-start;flex-wrap:wrap}}@media (max-width: 959px) and (min-width: 601px){.app{margin:8px auto;padding:14px}.header-text h1{font-size:22px}.player-top__volume{width:70px}.player-top__favicon{display:none}}@media (max-width: 600px){html,body{overflow-x:hidden}.app{margin:0;width:100%;max-width:100%;overflow-x:hidden;padding:12px 12px 0;padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:calc(88px + env(safe-area-inset-bottom))}.player-top{display:none!important}header{margin-bottom:12px}.header-top{flex-wrap:nowrap;align-items:center;gap:8px;margin-bottom:0}.header-brand{flex:1;min-width:0;gap:8px;align-items:center}.logo{width:30px;height:30px;flex-shrink:0}.header-text{min-width:0}.header-text h1{font-size:18px;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-text p{display:none}.theme-picker{flex-shrink:0}.theme-picker__label{display:none}.theme-picker__swatches{gap:5px}.theme-swatch{width:20px;height:20px}.banner{display:none}.type-filters{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}.type-filter-btn{width:100%;padding:9px 6px;font-size:12px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:10px}.filter-toggles{gap:14px;font-size:12px;margin-bottom:10px;flex-wrap:wrap}.stations{gap:7px}.stations li{flex-direction:row;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;min-width:0;overflow:hidden}.stations li .meta{flex:1 1 0;min-width:0;overflow:hidden}.stations li .meta>div:first-child{display:flex;align-items:center;gap:5px;min-width:0}.stations li .meta strong{font-size:14px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.stations li .meta .small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.type-badge{font-size:9px;padding:1px 5px;flex-shrink:0}.stations li .actions{flex-shrink:0;display:flex;gap:6px;align-items:center}.stations li .actions button{width:42px;height:42px;min-width:42px;padding:0;border-radius:50%;font-size:13px;font-weight:700;margin-right:0;display:flex;align-items:center;justify-content:center}.stations li .actions a{display:none}.searchbar--bottom{grid-template-columns:1fr;padding:12px;gap:8px;margin-top:16px}.searchbar-input{width:100%;box-sizing:border-box;padding:12px;font-size:16px}.site-footer{margin-top:20px;padding:14px;padding-bottom:calc(14px + env(safe-area-inset-bottom));text-align:center;font-size:12px}}.site-footer{margin-top:24px;padding:14px;text-align:center;font-size:12px;color:var(--muted);border-top:1px solid rgba(255,255,255,.05)}.footer-handle{color:#ff6b6b;font-weight:600}.player-top__favicon{flex-shrink:0;width:32px;height:32px;border-radius:8px;object-fit:contain;background:#ffffff0f;border:1px solid var(--border)}.mini-player{display:none}@media (max-width: 600px){.mini-player{display:flex;align-items:center;gap:10px;position:fixed;bottom:0;left:0;right:0;z-index:100;padding:10px 16px;padding-bottom:calc(10px + env(safe-area-inset-bottom));background:linear-gradient(135deg,var(--player-accent-1),var(--player-accent-2)),var(--player-bg);border-top:1px solid var(--player-border);backdrop-filter:saturate(140%) blur(16px);-webkit-backdrop-filter:saturate(140%) blur(16px);box-shadow:0 -8px 24px -8px #00000080}.mini-player__favicon{flex-shrink:0;width:36px;height:36px;border-radius:8px;object-fit:contain;background:#ffffff0f;border:1px solid var(--border)}.mini-player__info{flex:1;min-width:0;display:flex;align-items:center;gap:8px}.mini-player__name{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player__eq{display:flex;align-items:flex-end;gap:2px;flex-shrink:0;height:18px}.mini-player__eq span{display:block;width:3px;border-radius:2px;background:var(--accent);animation:eq-bounce .8s ease-in-out infinite alternate}.mini-player__eq span:nth-child(1){height:60%;animation-delay:0s}.mini-player__eq span:nth-child(2){height:100%;animation-delay:.15s}.mini-player__eq span:nth-child(3){height:45%;animation-delay:.3s}.mini-player__eq span:nth-child(4){height:80%;animation-delay:.1s}@keyframes eq-bounce{0%{transform:scaleY(.35)}to{transform:scaleY(1)}}.mini-player__vol{display:flex;align-items:center;gap:6px;flex-shrink:0}.mini-player__mute{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:#ffffff12;color:var(--text);font-size:15px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;-webkit-tap-highlight-color:transparent}.mini-player__mute:active{background:#ffffff26}.mini-player__slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:72px;height:4px;border-radius:2px;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--vol, 100%),rgba(255,255,255,.18) var(--vol, 100%),rgba(255,255,255,.18) 100%);outline:none;cursor:pointer;touch-action:none}.mini-player__slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 1px 4px #0006}.mini-player__slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:none;cursor:pointer}.mini-player__stop{flex-shrink:0;width:44px;height:44px;border-radius:50%;border:2px solid var(--accent);background:#0000004d;color:var(--accent);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.mini-player__stop:active{background:var(--accent);color:#fff}}button,select,input[type=range]{touch-action:manipulation}