:root{--max-width: 720px;--accent: #6b5cff;--muted: #6b7280;--bg: #ffffff;--card: #f8f9fb;--text: #111827;--border: #e7eaf0;--panel: #ffffff;--progress-bg: #e6e9f3}.dark{--bg: #0b1220;--card: #0f1724;--panel: #0b1220;--text: #e6eef8;--muted: #9aa4b2;--border: #16202b;--progress-bg: #10202f}@media (prefers-color-scheme: dark){:root{--bg: #0b1220;--card: #0f1724;--panel: #0b1220;--text: #e6eef8;--muted: #9aa4b2;--border: #16202b;--progress-bg: #10202f}}*{box-sizing:border-box}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;color:var(--text);background:var(--bg);margin:0;padding:0}.app{max-width:var(--max-width);margin:32px auto;padding:20px}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.title{font-size:1.2rem;font-weight:700}.list{display:grid;grid-template-columns:1fr;gap:12px;padding:0;list-style:none}.song-item{background:var(--card);padding:12px;border-radius:10px;border:1px solid var(--border);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.song-item:hover{transform:translateY(-4px);box-shadow:0 6px 20px #6366f114}.song-meta{color:var(--muted);font-size:.9rem}.player{background:var(--card);padding:16px;border-radius:12px;border:1px solid var(--border)}.controls{display:flex;align-items:center;gap:12px;margin-bottom:12px}.play-btn{background:var(--accent);color:#fff;padding:10px 14px;border-radius:10px;border:none;cursor:pointer;font-weight:600}.secondary-btn{background:transparent;border:1px solid var(--border);padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--text)}.progress{height:8px;background:var(--progress-bg);border-radius:999px;position:relative;cursor:pointer}.progress-bar{height:100%;background:linear-gradient(90deg,var(--accent),#8b79ff);border-radius:999px;width:0}.time{font-size:.85rem;color:var(--muted)}.lyrics{white-space:pre-wrap;background:var(--panel);padding:12px;border-radius:8px;border:1px solid var(--border);margin-top:12px}.back-btn{background:var(--panel);border:1px solid var(--border);padding:8px 0;border-radius:10px;color:var(--text);cursor:pointer;font-weight:600;display:inline-flex;align-items:center;gap:8px;min-height:40px;box-shadow:0 1px #10182808;transition:transform .08s ease,box-shadow .12s ease}.back-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #6366f10f}.back-btn:active{transform:translateY(0)}.back-btn:focus{outline:3px solid rgba(107,92,255,.16);outline-offset:2px}.empty{color:var(--muted);text-align:center;padding:24px}.footer{margin-top:18px;font-size:.85rem;color:var(--muted);text-align:center}@media (max-width: 480px){.app{padding:12px}.back-btn{padding:10px 14px;min-height:48px;border-radius:12px}}