:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--text:#1b1b1f;--muted:#6b6b75;--bg:#fff;--line:#e4e4ea;--accent:#2f5bd8;--danger:#c0392b;font-family:system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.4}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#ececf1;--muted:#9a9aa6;--bg:#131316;--line:#2a2a31;--accent:#7c9cff;--danger:#ff7b6b}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}main{max-width:40rem;padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));margin:0 auto}h1{margin:0;font-size:1.3rem}p{margin:0}button,input{font:inherit;color:inherit}.muted{color:var(--muted)}.error{color:var(--danger)}button.link{color:var(--accent);background:0 0;border:none;padding:0}.login form{flex-direction:column;gap:10px;margin-top:24px;display:flex}.login input{border:1px solid var(--line);background:0 0;border-radius:8px;padding:10px 12px}.login button[type=submit]{background:var(--accent);color:var(--bg);border:none;border-radius:8px;padding:10px 12px}.login button:disabled{opacity:.5}.login .row{justify-content:space-between;display:flex}header{border-bottom:1px solid var(--line);align-items:center;gap:16px;padding-bottom:12px;display:flex}header h1{flex:1}header label{color:var(--muted);align-items:center;gap:6px;display:flex}ol{margin:0;padding:0;list-style:none}li{border-bottom:1px solid var(--line);gap:12px;padding:12px 0;display:flex}li.dropped{opacity:.6}li time{color:var(--muted);font-size:.8rem}button.play{border:1px solid var(--line);width:44px;height:44px;color:var(--accent);background:0 0;border-radius:50%;flex:none}button.play:disabled{color:var(--muted)}