*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:#1a1a2e;color:#eee;min-height:100vh}nav{width:100%;background:#16213e;display:flex;justify-content:center;gap:0;position:sticky;top:0;z-index:20}nav a{color:#aaa;text-decoration:none;padding:1rem 2rem;font-weight:700;transition:color .2s,border-color .2s;border-bottom:3px solid transparent}nav a:hover{color:#fff}nav a.active{color:#e94560;border-bottom-color:#e94560}.content{padding:2rem;display:flex;flex-direction:column;align-items:center}h1{margin-bottom:1.5rem;color:#e94560}.player-bar{position:sticky;top:52px;z-index:10;background:#16213e;padding:1rem;border-radius:8px;margin-bottom:1.5rem;width:100%;max-width:900px;text-align:center}.player-bar .now-playing{margin-bottom:.5rem;font-weight:700}.player-bar audio{width:100%}.station-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;width:100%;max-width:900px;list-style:none}.station-grid li{background:#16213e;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1;padding:.75rem;text-align:center;transition:background .2s,transform .2s}.station-grid li:hover{background:#0f3460;transform:scale(1.05)}.station-grid li.active{outline:3px solid #e94560}.station-grid img{width:164px;height:164px;border-radius:8px;object-fit:cover;background:#333;margin-bottom:.5rem}.station-grid .placeholder{width:164px;height:164px;border-radius:8px;background:#333;margin-bottom:.5rem;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.station-grid span{font-size:.75rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.loading{color:#aaa;grid-column:span 4;text-align:center;padding:2rem}