:root{color-scheme:dark;--bg:#090d16;--card:#111827;--line:#263247;--text:#edf2f7;--muted:#94a3b8;--accent:#49d6a5}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% 0,#17304a 0,transparent 35%),var(--bg);color:var(--text);font:15px system-ui,-apple-system,sans-serif}.player-shell{max-width:1180px;margin:auto;padding:42px 20px 80px}.hero{margin-bottom:30px}.eyebrow{color:var(--accent);letter-spacing:.16em;font-size:12px;font-weight:700}.hero h1{font-size:clamp(2.2rem,5vw,4.5rem);margin:8px 0}.hero p{color:var(--muted)}.toolbar,.card{background:rgba(17,24,39,.88);border:1px solid var(--line);border-radius:16px}.toolbar{display:flex;gap:10px;padding:14px;margin-bottom:20px}.toolbar input,.toolbar select{background:#0b1220;border:1px solid var(--line);border-radius:9px;color:var(--text);padding:12px;min-width:0}.toolbar input{flex:1}.toolbar select{width:190px}.button{border:0;border-radius:9px;padding:10px 14px;cursor:pointer;color:#06120f;font-weight:700}.primary{background:var(--accent)}.add{background:#d7e6e1;font-size:12px}.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:20px}.card{padding:20px}.side-column{display:grid;gap:20px;align-content:start}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.section-heading h2,.card h2{font-size:17px;margin:0 0 16px}.track-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}.track-row:last-child{border:0}.track-row strong,.track-row span{display:block}.track-row span,.muted,.queue-item small,.saved-item small{color:var(--muted);font-size:13px;margin-top:4px}.now-title{font-size:20px;font-weight:700}.now-playing audio{width:100%;margin-top:20px}.queue-item,.saved-item{display:block;width:100%;text-align:left;background:transparent;color:var(--text);border:0;border-bottom:1px solid var(--line);padding:11px 0;cursor:pointer}.queue-item.active,.saved-item:hover{color:var(--accent)}.queue-item small,.saved-item small{display:block}.full{width:100%;margin-top:16px}.text-button{background:transparent;border:0;color:var(--muted);cursor:pointer}.error{color:#fb7185}@media(max-width:760px){.layout{grid-template-columns:1fr}.toolbar{flex-wrap:wrap}.toolbar input,.toolbar select,.toolbar .button{width:100%}}
