:root{--bg:#0a0a0a;--bg-elev:#141414;--bg-elev-2:#1c1c1c;--border:#262626;--text:#f5f5f5;--text-dim:#a3a3a3;--text-mute:#6b6b6b;--accent:#f5f5f5;--accent-fg:#0a0a0a;--bnm:#fde047;--ok:#4ade80;--err:#f87171;--radius:10px;--gap:14px;--maxw:760px;--font:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-size:16px;line-height:1.45}body{min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}.topbar{z-index:10;-webkit-backdrop-filter:saturate(140%)blur(12px);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top);background:#0a0a0ad9;position:sticky;top:0}.topbar-inner{max-width:var(--maxw);justify-content:space-between;align-items:center;gap:16px;margin:0 auto;padding:14px 18px;display:flex}.brand{letter-spacing:.02em;margin:0;font-size:18px;font-weight:700}.brand-sub{color:var(--text-mute);margin-left:6px;font-size:13px;font-weight:400}.status{align-items:center;gap:10px;display:flex}.status-text{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:12px}.ghost-btn{border:1px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:16px;transition:background .12s,transform .2s;display:inline-flex}.ghost-btn:hover{background:var(--bg-elev)}.ghost-btn[data-spinning=true]{pointer-events:none;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.feed{max-width:var(--maxw);gap:var(--gap);flex-direction:column;margin:0 auto;padding:16px 14px 80px;display:flex}.feed-empty,.feed-error{text-align:center;color:var(--text-dim);padding:40px 16px}.feed-error{color:var(--err)}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:96px 1fr;gap:14px;padding:12px;transition:border-color .16s;display:grid}.card:hover{border-color:#333}.card-cover{background:var(--bg-elev-2);border-radius:6px;flex-shrink:0;width:96px;height:96px;display:block;overflow:hidden}.card-cover img{object-fit:cover;width:100%;height:100%;display:block}.card-body{flex-direction:column;gap:8px;min-width:0;display:flex}.card-head{flex-direction:column;gap:4px;display:flex}.card-title{word-break:break-word;margin:0;font-size:16px;font-weight:600;line-height:1.3}.card-artist{color:var(--text)}.card-sep{color:var(--text-mute)}.card-album{color:var(--text-dim);font-weight:500}.card-meta{color:var(--text-mute);font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;display:flex}.card-score{color:var(--text);font-weight:700}.card-year:before{content:"· ";color:var(--text-mute)}.badge{letter-spacing:.05em;text-transform:uppercase;background:var(--bnm);color:#1a1a1a;border-radius:999px;padding:2px 6px;font-size:10px;font-weight:700;display:inline-block}.card-blurb{color:var(--text-dim);margin:0;font-size:13px;line-height:1.5}.card-actions{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.capture-btn{background:var(--accent);color:var(--accent-fg);cursor:pointer;border:none;border-radius:8px;align-items:center;gap:6px;padding:7px 12px;font-family:inherit;font-size:13px;font-weight:600;transition:opacity .12s,background .12s;display:inline-flex}.capture-btn:hover:not(:disabled){opacity:.85}.capture-btn:disabled{cursor:default}.capture-btn[data-state=pending]{opacity:.7}.capture-btn[data-state=saved]{background:var(--bg-elev-2);color:var(--ok);border:1px solid #1f3a1f}.capture-btn[data-state=error]{background:var(--bg-elev-2);color:var(--err);border:1px solid #3a1f1f}.auth-ui{flex-shrink:0;align-items:center;gap:10px;display:flex}.auth-user{color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;max-width:120px;font-size:12px;overflow:hidden}.auth-btn{white-space:nowrap;font-size:12px}.card-auth-hint{color:var(--text-mute);font-size:12px;font-style:italic}@media (width>=600px){.card{grid-template-columns:128px 1fr;gap:18px;padding:16px}.card-cover{width:128px;height:128px}.card-title{font-size:17px}}
