:root{--bg:#f7f7f8;--fg:#18181b;--muted:#52525b;--card:#fff;--border:#e4e4e7;--accent:#1db954;--accent-fg:#fff;--error:#b91c1c}@media (prefers-color-scheme:dark){:root{--bg:#111113;--fg:#f4f4f5;--muted:#a1a1aa;--card:#1c1c1f;--border:#2e2e33;--error:#f87171}}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;font-family:system-ui,-apple-system,Segoe UI,Hiragino Sans,Yu Gothic UI,sans-serif;line-height:1.6}.container{max-width:640px;margin:0 auto;padding:32px 16px}h1{margin:0 0 8px;font-size:1.6rem}.lead{color:var(--muted);margin:0 0 24px}.auth{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:16px;display:flex}.badge{border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:.9rem}.badge.on{border-color:var(--accent)}.badge.off{color:var(--muted)}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px}form{gap:8px;display:grid}label{font-weight:600}input{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--fg);border-radius:8px;padding:10px 12px;font-size:1rem}.button{cursor:pointer;border:1px solid #0000;border-radius:999px;padding:10px 16px;font-size:1rem;font-weight:600;text-decoration:none;display:inline-block}.button.primary,.button.spotify{background:var(--accent);color:var(--accent-fg)}.button.secondary{color:var(--fg);border-color:var(--border);background:0 0}.button:disabled{opacity:.5;cursor:not-allowed}.hint{color:var(--muted);margin:0;font-size:.9rem}.error{color:var(--error)}.result{border-top:1px solid var(--border);margin-top:16px;padding-top:12px}.result ul{color:var(--muted);margin:0;padding-left:20px}