:root{--text:#9aa4b2;--text-h:#f5f7fb;--bg:#0b0f12;--panel:#12181d;--muted:#20282f;--border:#28323a;--accent:#f03;--shadow:#00000059 0 18px 45px;--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;color:var(--text);background:var(--bg);font:16px/1.45 var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{min-width:320px;margin:0}h1,h2,p{margin:0}h1{color:var(--text-h);margin-top:8px;font-size:clamp(42px,7vw,88px);line-height:.95}h2{color:var(--text-h);font-size:21px}a{color:inherit}button,input{font:inherit}.app{flex-direction:column;gap:22px;min-height:100svh;padding:28px 28px 142px;display:flex}.topbar,.connect-panel,.workspace,.player{width:min(1180px,100%);margin:0 auto}.topbar,.connect-panel,.workspace{border:1px solid var(--border);background:var(--panel);border-radius:8px}.topbar{background:linear-gradient(135deg, #ff00333d, transparent 48%), var(--panel);justify-content:space-between;align-items:flex-start;min-height:180px;padding:28px;display:flex}.brand{align-items:center;gap:18px;display:flex}.brand-icon{filter:drop-shadow(0 12px 28px #00000052);flex:none;width:72px;height:72px}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;font-size:13px;font-weight:700}.status{border:1px solid var(--border);color:var(--text-h);background:var(--bg);border-radius:999px;align-items:center;gap:8px;padding:8px 12px;display:inline-flex}.dot{background:#8b949e;border-radius:50%;width:9px;height:9px}.dot.online{background:var(--accent)}.connect-panel{justify-content:space-between;align-items:center;gap:14px;padding:18px;display:flex}.panel-copy{color:var(--text);margin-top:6px}label{color:var(--text-h);margin-bottom:8px;font-size:14px;display:block}.input-row,.search{gap:10px;display:flex}input{border:1px solid var(--border);width:100%;min-width:0;color:var(--text-h);background:var(--bg);font:inherit;border-radius:8px;padding:12px 14px}button{color:#fff;background:var(--accent);font:inherit;cursor:pointer;border:0;border-radius:8px;padding:11px 16px;font-weight:700}button,.button-link{justify-content:center;align-items:center;gap:8px;display:inline-flex}.icon{flex:none;width:18px;height:18px}button:disabled{cursor:not-allowed;opacity:.55}.ghost,.track-actions button:last-child,.chips button,.playlist-list button,.mini-button{color:var(--text-h);background:var(--muted)}.workspace{grid-template-columns:300px 1fr;display:grid;overflow:hidden}.sidebar{border-right:1px solid var(--border);padding:22px}.sidebar h2{margin-top:0}.chips,.favorites,.playlist-list,.playlist-form,.playlist-tracks{flex-direction:column;gap:8px;margin-top:18px;display:flex}.chips{align-items:flex-start}.chips button{padding:7px 10px;font-size:14px}.favorites button{color:var(--text-h);text-align:left;background:0 0;grid-template-columns:40px 1fr;align-items:center;gap:10px;padding:8px;display:grid}.playlist-form{margin-top:12px}.playlist-list button{text-align:left;flex-direction:column;align-items:flex-start;gap:3px;display:flex}.playlist-list button.active{outline:2px solid var(--accent);background:#ff003329}.playlist-list small,.playlist-track small{color:var(--text)}.favorites img,.track-card img,.playlist-track img,.player img,.player iframe{object-fit:cover;background:var(--muted)}.favorites img{border-radius:6px;width:40px;height:40px}.content{padding:22px}.search{margin-bottom:20px}.search-status{border:1px solid var(--border);color:var(--text-h);background:var(--muted);text-align:left;border-radius:8px;margin-bottom:16px;padding:10px 12px}.playlist-panel{border:1px solid var(--border);background:var(--bg);border-radius:8px;grid-template-columns:1fr auto;gap:16px;margin-bottom:18px;padding:14px;display:grid}.playlist-panel h2{margin-bottom:4px}.playlist-panel p{color:var(--text)}.panel-actions{align-items:start;gap:8px;display:flex}.playlist-tracks{grid-column:1/-1;max-height:280px;margin-top:0;overflow:auto}.playlist-track{border:1px solid var(--border);border-radius:8px;grid-template-columns:44px minmax(0,1fr) minmax(90px,.5fr) auto auto;align-items:center;gap:10px;padding:8px;display:grid}.playlist-track.unavailable{opacity:.68}.playlist-track img{border-radius:6px;width:44px;height:44px}.playlist-track span,.playlist-track small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.playlist-track button,.mini-button{padding:7px 10px;font-size:13px}.track-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;display:grid}.track-card{border:1px solid var(--border);background:var(--bg);border-radius:8px;min-width:0;padding:12px}.track-card img{aspect-ratio:1;border-radius:6px;width:100%}.track-card h3{color:var(--text-h);margin:12px 0 4px;font-size:17px;line-height:1.25}.track-card p,.track-card span,.now-playing span,.time{color:var(--text);font-size:14px}.track-card span{white-space:nowrap;text-overflow:ellipsis;margin-top:4px;display:block;overflow:hidden}.track-actions{gap:8px;margin-top:14px;display:flex}.track-actions button{flex:1;padding:9px 10px}.player{z-index:5;border:1px solid var(--border);box-shadow:var(--shadow);background:#121212f0;border-radius:8px;grid-template-columns:112px minmax(220px,1fr) auto auto auto;align-items:center;gap:14px;padding:12px;display:grid;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.player img,.player iframe{border-radius:6px;width:112px;height:62px}.player iframe{background:#000;border:0}.now-playing{flex-direction:column;gap:4px;min-width:0;display:flex}.now-playing strong{color:#fff}progress{width:100%;height:6px;accent-color:var(--accent)}.seek-row{grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:10px;display:grid}.seek-row span{min-width:42px;color:var(--text);font-variant-numeric:tabular-nums;font-size:13px}.seek-row span:last-child{text-align:right}.seek-slider{height:6px;accent-color:var(--accent);cursor:pointer;padding:0}.seek-slider:disabled{cursor:not-allowed}.button-link{color:#fff;background:var(--accent);border-radius:8px;padding:11px 16px;font-weight:700;text-decoration:none}.player-actions{gap:8px;display:flex}.player-actions button{padding:9px 11px}@media (width<=820px){.app{padding:12px 12px 220px}.topbar,.connect-panel,.workspace,.player{flex-direction:column;display:flex}.topbar{min-height:auto}.brand{align-items:flex-start}.brand-icon{width:54px;height:54px}.connect-panel{align-items:stretch}.sidebar{border-right:0;border-bottom:1px solid var(--border)}.player{align-items:stretch}.playlist-panel,.playlist-track{grid-template-columns:1fr}.panel-actions,.player-actions{flex-wrap:wrap}}