:root{--bg:#14151a;--panel:#1d1f26;--panel-2:#262932;--border:#33363f;--text:#ecedf0;--muted:#9a9ea8;--accent:#f0a04b;--spotify:#1db954;--bandcamp:#4fa3c7;--danger:#e5646e;color-scheme:dark}*{box-sizing:border-box}body,html{margin:0;background:var(--bg);color:var(--text)}body{font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;padding-bottom:110px}a{color:var(--accent)}h1,h2{margin:0}h2{font-size:1.05rem}main{padding:16px}.topbar,main{max-width:860px;margin:0 auto}.topbar{display:flex;align-items:center;gap:12px;padding:12px 16px}.topbar .logo{margin-right:auto}.logo{font-weight:800;letter-spacing:-.02em;color:var(--text);text-decoration:none;font-size:1.2rem}.logo.big{font-size:2.2rem}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px}.stack{flex-direction:column;gap:12px}.row,.stack{display:flex}.row{align-items:center;gap:8px;flex-wrap:wrap}.spread{justify-content:space-between}.wide{width:100%}.muted{color:var(--muted)}.small{font-size:.85rem}.error{color:var(--danger);margin:0}.warn{color:var(--accent)}ul.plain{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}input{flex:1 1;min-width:0;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font:inherit}input:focus{outline:2px solid var(--accent);outline-offset:-1px}label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--muted)}.button,button{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:7px 12px;font:inherit;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}.button:hover,button:hover:not(:disabled){border-color:var(--muted)}button:disabled{opacity:.4;cursor:default}.primary{background:var(--accent);border-color:var(--accent);color:#1a1205;font-weight:600}button.link{background:none;border:none;color:var(--accent);padding:0}button.link.danger{color:var(--danger)}.round{border-radius:50%;width:42px;height:42px;justify-content:center}.auth{max-width:360px;margin:10vh auto 0;display:flex;flex-direction:column;gap:12px}.playlist-link{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:8px;background:var(--panel-2);color:var(--text);text-decoration:none}.playlist-link:hover{outline:1px solid var(--border)}.title-input{font-size:1.5rem;font-weight:700;background:none;border-color:transparent;padding-left:0}.title-input:hover{border-color:var(--border)}.badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:1px 6px;border-radius:4px;margin-right:6px;vertical-align:1px}.badge.spotify{background:color-mix(in srgb,var(--spotify) 22%,transparent);color:var(--spotify)}.badge.bandcamp{background:color-mix(in srgb,var(--bandcamp) 22%,transparent);color:var(--bandcamp)}.art{width:48px;height:48px;border-radius:6px;object-fit:cover;background:var(--panel-2);flex:none;display:inline-block}.art.small{width:36px;height:36px}ol.tracks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}.track{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;grid-gap:12px;gap:12px;padding:8px;border-radius:10px}.track.playing,.track:hover{background:var(--panel)}.track.playing{outline:1px solid var(--accent)}.track-info{min-width:0;display:flex;flex-direction:column;gap:2px}.track-info strong{overflow-wrap:anywhere}.track-actions{display:flex;gap:4px}.track-actions button{padding:4px 8px}.play-btn{position:relative;padding:0;border:none;background:none}.play-btn .overlay{position:absolute;inset:0;display:grid;place-items:center;background:#0008;border-radius:6px;opacity:0;transition:opacity .1s}.play-btn:focus-visible .overlay,.play-btn:hover .overlay{opacity:1}.buy{font-weight:600;color:var(--bandcamp)}.tabs{display:flex;gap:4px;margin-left:auto}.tabs button.active{border-color:var(--accent);color:var(--accent)}.player-bar{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--panel);border-top:1px solid var(--border)}.player-main{flex:1 1;min-width:0;display:flex;flex-direction:column;gap:4px}.player-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-progress{display:flex;align-items:center;gap:8px;font-size:.8rem}.player-progress input{flex:1 1;padding:0;accent-color:var(--accent)}.player-controls{display:flex;align-items:center;gap:6px}@media (max-width:600px){.track{grid-template-columns:auto 1fr auto}.track .duration{display:none}.tabs{margin-left:0}.player-bar .art{display:none}}