:root{--bg: #0f1724;--card: #0b1220;--muted: #9aa4b2;--accent: #7c5cff;--glass: rgba(255, 255, 255, .03)}*{box-sizing:border-box}html,body,#root{height:100%}#root{display:flex;justify-content:center;align-items:flex-start}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:linear-gradient(180deg,var(--bg),#071021);color:#e6eef8;-webkit-font-smoothing:antialiased}.app{height:100%;max-width:800px;min-width:500px;margin:0;padding:20px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.btn{background:var(--glass);border:1px solid rgba(255,255,255,.06);padding:10px 14px;border-radius:8px;color:var(--muted);cursor:pointer}.btn.primary{background:linear-gradient(90deg,var(--accent),#5ec8ff);color:#071021;border:none}.card{background:linear-gradient(180deg,#ffffff05,#ffffff03);padding:18px;border-radius:14px;box-shadow:0 6px 30px #02061799}.player{margin-bottom:14px}.player[aria-hidden]{position:relative}.player-controls{display:flex;gap:12px;align-items:center}.player-controls .btn{padding:8px 12px}.player-controls .volume{color:var(--muted);display:flex;gap:8px;align-items:center}.player-controls input[type=range]{width:160px}.spinner{width:48px;height:48px;border-radius:50%;border:6px solid rgba(255,255,255,.08);border-top-color:var(--accent);animation:spin 1s linear infinite;margin-bottom:12px}@keyframes spin{to{transform:rotate(360deg)}}.meta{display:flex;flex-direction:column;gap:12px}.hint{color:var(--muted)}.hidden{color:var(--muted);font-style:italic}.info .artist{font-weight:600;font-size:18px}.info .title{font-size:16px;color:#bcd5ff}.info .year{font-weight:700;color:var(--accent)}.actions{display:flex;gap:8px}.foot{margin-top:2rem;color:var(--muted);font-size:14px}@media (max-width: 600px){h1{font-size:20px}.app{min-width:0}}