:root{--bg-base: #111;--bg-panel: #1a1a1a;--bg-surface: #232323;--bg-hover: #1f1f1f;--border-dim: #2e2e2e;--border: #3a3a3a;--text: #d6d6d6;--text-muted: #888;--text-dim: #5a5a5a;--accent: #00cc66;--accent-bright: #00ff88;--genre-bg: #0d1f0d;--genre-border: #1a4a1a;--genre-text: #4aaa5a}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;background:var(--bg-base);color:var(--text);font-family:Share Tech Mono,ui-monospace,monospace;font-size:13px;-webkit-font-smoothing:antialiased}button,input,select{font-family:inherit;color:inherit}button{background:var(--bg-surface);border:1px solid var(--border);color:var(--text);padding:4px 10px;cursor:pointer;border-radius:2px;font-size:11px;letter-spacing:1px}button:hover{background:var(--bg-hover);border-color:var(--accent)}button:disabled{opacity:.4;cursor:not-allowed}.label{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted)}.titlebar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--bg-panel);border-bottom:1px solid var(--border-dim)}.titlebar-brand{color:var(--accent-bright);font-size:14px;letter-spacing:2px}.titlebar-version{color:var(--text-dim);margin-left:6px;font-size:11px}.titlebar-dots{display:flex;gap:6px}.titlebar-dot{width:8px;height:8px;border-radius:50%;background:#2a2a2a}.titlebar-sync{font-size:10px;letter-spacing:1.5px}.titlebar-sync.active{color:var(--accent-bright);border-color:var(--accent)}.player-panel{display:flex;gap:12px;padding:12px;background:var(--bg-panel);border-bottom:1px solid var(--border-dim);align-items:center}.player-iframe-wrap{width:160px;height:90px;border:1px solid #2a2a2a;background:#000;flex-shrink:0;position:relative;overflow:hidden}.player-iframe-wrap iframe{width:100%;height:100%;display:block}.visualizer{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:space-between;gap:2px;padding:8px 8px 6px;background:#050a07}.vbar{flex:1;background:var(--accent);height:20%;border-top:1px solid var(--accent-bright);animation-name:bar-dance;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:ease-in-out}@keyframes bar-dance{0%{height:8%;opacity:.55}35%{height:65%;opacity:.9}70%{height:30%;opacity:.75}to{height:90%;opacity:1}}.player-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;overflow:hidden;padding:6px 10px;background:#050a07;border:1px solid var(--genre-border);align-self:stretch;justify-content:center}.player-title{color:var(--accent-bright);font-size:13px;letter-spacing:1.5px;white-space:nowrap;overflow:hidden}.player-album{color:var(--text-muted);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-readout{margin-top:auto;display:flex;align-items:center}.player-time{color:var(--accent-bright);font-size:14px;letter-spacing:3px;font-variant-numeric:tabular-nums}.ticker{display:inline-block;white-space:nowrap}.ticker.scrolling{padding-left:100%;animation:ticker 14s linear infinite}@keyframes ticker{0%{transform:translate(0)}to{transform:translate(-100%)}}.transport{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--bg-panel);border-bottom:1px solid var(--border-dim)}.transport-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--bg-surface);border:1px solid var(--border);border-radius:2px;padding:0}.transport-btn:hover{border-color:var(--accent)}.transport-btn.active{color:var(--accent-bright);border-color:var(--accent)}.progress-track{height:4px;background:#1f1f1f;border:1px solid var(--border-dim);position:relative;cursor:pointer;flex:1;min-width:80px}.progress-fill{height:100%;background:var(--accent);width:0;transition:width .15s linear}.volume{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:70px;height:4px;background:var(--bg-surface);border:1px solid var(--border-dim);accent-color:var(--accent)}.volume::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:10px;height:10px;background:var(--accent);border-radius:50%;cursor:pointer}.tabbar{display:flex;background:var(--bg-base);border-bottom:1px solid var(--border)}.tab{flex:1;background:none;border:0;border-bottom:1px solid transparent;padding:10px 8px;color:var(--text-muted);font-size:10px;letter-spacing:1.5px;cursor:pointer;text-transform:uppercase;border-radius:0}.tab:hover{color:var(--text)}.tab.active{color:var(--accent-bright);border-bottom-color:var(--accent)}.search-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-panel);border-bottom:1px solid var(--border-dim)}.search-input{flex:1;background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text);padding:6px 8px;font-size:12px;border-radius:2px}.search-input:focus{outline:none;border-color:var(--accent)}.genre-filters{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px;background:var(--bg-panel);border-bottom:1px solid var(--border-dim)}.genre-pill{background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text-muted);padding:3px 8px;font-size:10px;letter-spacing:1px;text-transform:uppercase;border-radius:2px;cursor:pointer}.genre-pill:hover{color:var(--text);border-color:var(--accent)}.genre-pill.active{background:var(--genre-bg);color:var(--accent-bright);border-color:var(--accent)}.col-headers,.track-row{display:grid;grid-template-columns:22px 24px 1.3fr 1fr 1fr 110px 48px;gap:8px;padding:6px 12px;align-items:center;font-size:12px}.col-headers .sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.col-headers .sortable:hover{color:var(--text)}.col-headers .sortable.sorted{color:var(--accent-bright)}.row-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;background:var(--bg-base);border:1px solid var(--border);border-radius:2px;cursor:pointer;margin:0;position:relative;flex-shrink:0}.row-checkbox:hover{border-color:var(--accent)}.row-checkbox:checked,.row-checkbox:indeterminate{background:var(--accent);border-color:var(--accent)}.row-checkbox:checked:after{content:"";position:absolute;top:1px;left:4px;width:3px;height:7px;border:solid var(--bg-base);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}.row-checkbox:indeterminate:after{content:"";position:absolute;top:5px;left:2px;width:7px;height:1.5px;background:var(--bg-base)}.track-row.selected{background:#00cc6614}.bulk-bar{display:flex;align-items:center;gap:8px;padding:6px 12px;background:#15201a;border-bottom:1px solid var(--accent);font-size:11px}.bulk-count{color:var(--accent-bright);letter-spacing:1px;text-transform:uppercase;margin-right:4px}.bulk-genre{background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text);padding:3px 8px;font-family:inherit;font-size:11px;border-radius:2px;cursor:pointer}.bulk-genre:focus{outline:none;border-color:var(--accent)}.col-headers{background:var(--bg-base);border-bottom:1px solid var(--border-dim);color:var(--text-muted);font-size:10px;letter-spacing:1.5px;text-transform:uppercase}.track-row{border-bottom:1px solid var(--border-dim);cursor:default}.track-row:hover{background:var(--bg-hover)}.track-row.playing{background:#15201a}.track-row .col-title{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.track-row.playing .col-title{color:var(--accent-bright)}.track-row .col-artist,.track-row .col-album,.track-row .col-genre{color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.track-row .col-time{color:var(--text-dim);text-align:right;font-size:11px}.star-btn{background:none;border:0;color:#333;font-size:14px;padding:0;cursor:pointer;width:20px;height:20px}.star-btn:hover{color:var(--text-muted);border:0;background:none}.star-btn.starred{color:var(--accent-bright)}.edit-input,.edit-select{width:100%;background:var(--bg-base);border:1px solid var(--accent);color:var(--text);padding:2px 4px;font-family:inherit;font-size:12px;border-radius:2px}.edit-input:focus,.edit-select:focus{outline:none}.override-dot{color:var(--accent);margin-left:4px;font-size:9px}.genre-tag{display:inline-block;background:var(--genre-bg);border:1px solid var(--genre-border);color:var(--genre-text);padding:1px 6px;border-radius:2px;font-size:10px;letter-spacing:.5px;text-transform:uppercase}.genre-tag.unknown{background:#181818;border-color:#2a2a2a;color:var(--text-dim)}.tracklist{background:var(--bg-panel)}.tracklist-scroll{max-height:360px;overflow-y:auto}.split{display:flex;min-height:360px;background:var(--bg-panel)}.split-side{width:180px;background:var(--bg-base);border-right:1px solid var(--border-dim);overflow-y:auto;max-height:420px}.split-main{flex:1;min-width:0}.side-item{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-left:2px solid transparent;color:var(--text-muted);font-size:11px;letter-spacing:1px;cursor:pointer}.side-item:hover{color:var(--text);background:var(--bg-hover)}.side-item.active{background:#15201a;color:var(--accent-bright);border-left-color:var(--accent)}.side-count{font-size:10px;color:var(--text-dim)}.side-item.active .side-count{color:var(--accent)}.responsive-side-select{display:none;width:calc(100% - 24px);margin:8px 12px;background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text);padding:6px;border-radius:2px;font-size:12px}.sync-bar{background:#161616;border-bottom:1px solid var(--border-dim);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:12px}.sync-block{display:flex;flex-direction:column;gap:6px}.sync-block label{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted)}.sync-input{background:var(--bg-base);border:1px solid var(--border-dim);color:var(--text);padding:5px 7px;font-size:12px;border-radius:2px}.sync-input:focus{outline:none;border-color:var(--accent)}.sync-row{display:flex;gap:6px;align-items:center}.playlist-list{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--text-muted)}.playlist-row{display:flex;justify-content:space-between;align-items:center;gap:8px}.status-bar{display:flex;justify-content:space-between;padding:6px 12px;background:var(--bg-base);border-top:1px solid var(--border-dim);color:var(--text-dim);font-size:10px;letter-spacing:1.5px;text-transform:uppercase}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:var(--bg-surface);border:1px solid var(--accent);color:var(--text);padding:8px 16px;font-size:12px;border-radius:2px;z-index:1000}.toast.error{border-color:#c33;color:#f88}.enrich-bar{display:flex;align-items:center;gap:10px;background:#161616;border-bottom:1px solid var(--border-dim);padding:6px 12px;font-size:11px;color:var(--text-muted)}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-muted);background:var(--bg-panel);text-align:center;padding:24px;gap:8px}.empty p{margin:0;font-size:12px}.empty a,.empty button{color:var(--accent-bright);cursor:pointer}.login-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-base);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px}.login-logo{font-size:64px;color:var(--accent-bright);letter-spacing:12px}.login-version{color:var(--text-dim);font-size:12px;letter-spacing:2px}.login-tagline{color:var(--text-dim);font-size:10px;letter-spacing:2px;margin-top:8px;text-transform:uppercase}.login-error{color:#f88;font-size:11px;letter-spacing:1px;margin-top:8px;text-align:center}.login-btn{background:transparent;border:1px solid var(--accent);color:var(--accent-bright);padding:12px 24px;font-size:12px;letter-spacing:2px;text-transform:uppercase;cursor:pointer;border-radius:2px}.login-btn:hover{background:var(--genre-bg)}@media (max-width: 899px){.split-side{display:none}.responsive-side-select{display:block}.col-headers,.track-row{grid-template-columns:20px 22px 1.2fr 1fr 1fr 70px 42px;gap:6px}}@media (max-width: 699px){.col-headers,.track-row{grid-template-columns:20px 22px 1.3fr 1fr 70px 42px;gap:6px}.col-headers .col-album,.track-row .col-album{display:none}}@media (max-width: 599px){.player-iframe-wrap{display:none}.player-panel{padding:8px}.genre-filters{overflow-x:auto;flex-wrap:nowrap}.col-headers,.track-row{grid-template-columns:22px 1fr 70px 42px;gap:6px}.col-headers .row-checkbox,.track-row .row-checkbox,.col-headers .col-genre,.track-row .col-genre,.col-headers .col-album,.track-row .col-album{display:none}}