:root{--bg:#0a0a0a;--bg-elev:#131313;--bg-hover:#1a1a1a;--border:#262626;--text:#ededed;--text-dim:#888;--text-faint:#555;--accent:#ededed;--row-h:52px;--player-h:76px;--max-w:760px;--radius:10px}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;padding:0;font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;font-size:14px;line-height:1.45}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}input{font:inherit;color:inherit;background:0 0;border:none;outline:none}.app{max-width:var(--max-w);padding:32px 20px calc(var(--player-h) + 32px);margin:0 auto}.header{justify-content:space-between;align-items:baseline;margin-bottom:20px;display:flex}.brand{letter-spacing:.02em;color:var(--text);font-family:Geist Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:500}.count{color:var(--text-faint);font-family:Geist Mono,ui-monospace,monospace;font-size:12px}.search{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);width:100%;height:40px;color:var(--text);margin-bottom:16px;padding:0 12px;font-size:14px;transition:border-color .15s,background .15s}.search:focus{background:#161616;border-color:#3a3a3a}.search::placeholder{color:var(--text-faint)}.tabs{gap:4px;margin-bottom:12px;display:flex}.tab{height:28px;color:var(--text-dim);border-radius:6px;align-items:center;gap:6px;padding:0 10px;font-size:12.5px;font-weight:500;transition:color .15s,background .15s;display:inline-flex}.tab:hover{color:var(--text)}.tab.active{color:var(--text);background:var(--bg-elev)}.tab .badge{color:var(--text-faint);font-family:Geist Mono,monospace;font-size:11px}.list{flex-direction:column;display:flex}.row{height:var(--row-h);-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:12px;padding:0 4px 0 8px;transition:background .12s;display:flex;position:relative}.row:hover,.row.playing{background:var(--bg-elev)}.row.dragging{background:var(--bg-hover);opacity:.85}.row .play-btn{width:28px;height:28px;color:var(--text-dim);border-radius:999px;flex:0 0 28px;justify-content:center;align-items:center;transition:color .15s,background .15s;display:inline-flex}.row:hover .play-btn,.row.playing .play-btn{color:var(--text)}.row.playing .play-btn{background:var(--text);color:var(--bg)}.row .meta{flex-direction:column;flex:1;justify-content:center;min-width:0;display:flex}.row .title{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:500;overflow:hidden}.row .artist{color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.row .actions{opacity:0;align-items:center;gap:2px;transition:opacity .15s;display:flex}.row:hover .actions,.row.playing .actions,.row:focus-within .actions{opacity:1}.icon-btn{width:32px;height:32px;color:var(--text-dim);border-radius:6px;justify-content:center;align-items:center;transition:color .15s,background .15s;display:inline-flex}.icon-btn:hover{color:var(--text);background:var(--bg-hover)}.drag-handle{cursor:grab}.drag-handle:active{cursor:grabbing}.empty{text-align:center;color:var(--text-faint);padding:40px 0;font-size:13px}.player{-webkit-backdrop-filter:saturate(180%)blur(20px);border-top:1px solid var(--border);height:var(--player-h);z-index:10;background:#0d0d0dd9;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.player-inner{max-width:var(--max-w);align-items:center;gap:14px;width:100%;margin:0 auto;padding:0 20px;display:flex}.player .now{flex:1;min-width:0}.player .now .title{white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:500;overflow:hidden}.player .now .artist{color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.player .controls{align-items:center;gap:4px;display:flex}.player .big{background:var(--text);width:40px;height:40px;color:var(--bg);border-radius:999px;justify-content:center;align-items:center;transition:transform .12s;display:inline-flex}.player .big:hover{transform:scale(1.04)}.progress{background:0 0;height:2px;position:absolute;top:0;left:0;right:0}.progress-fill{background:var(--text);height:100%;transition:width .2s linear}.progress-input{opacity:0;cursor:pointer;width:100%;height:16px;position:absolute;top:-8px;left:0;right:0}@media (width<=540px){.app{padding:20px 14px calc(var(--player-h) + 20px)}.player-inner{padding:0 14px}:root{--row-h:56px}}