:root{--bg:#0f0f12;--panel:#17171c;--elev:#212128;--hover:#2a2a33;--line:#2c2c35;--text:#f4f4f6;--muted:#a3a3ad;--accent:#00c860;--accent-glow:#00c86059;--accent-ink:#03140a;--radius:10px;--player-h:84px;--sidebar-w:232px;--queue-w:340px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}h1,h2,h3{margin:0;line-height:1.15}code{background:var(--elev);border-radius:4px;padding:2px 6px}.muted{color:var(--muted)}.link:hover{text-decoration:underline}.strong{color:var(--text);font-weight:700}.splash{height:100%;color:var(--muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:24px;font-size:16px;display:flex}.splash img{filter:drop-shadow(0 0 24px var(--accent-glow))}.splash.loading img{animation:1.4s ease-in-out infinite pulse}.splash.error p{color:#ff8a8a}.app{grid-template-columns:var(--sidebar-w) minmax(0, 1fr) auto;grid-template-rows:minmax(0, 1fr) var(--player-h);gap:8px;height:100dvh;padding:8px 8px 0;display:grid}.sidebar{background:var(--panel);border-radius:var(--radius);flex-direction:column;grid-area:1/1;gap:18px;padding:20px 12px;display:flex}.logo{padding:0 8px}.brand{align-items:center;gap:10px;display:inline-flex}.brand img{filter:drop-shadow(0 0 10px var(--accent-glow))}.brand-text{letter-spacing:-.02em;font-size:22px;font-weight:800}.brand-text span{color:var(--accent)}.topbar-logo{display:none}.sidebar nav{flex-direction:column;gap:2px;display:flex}.sidebar nav a{color:var(--muted);border-radius:8px;align-items:center;gap:14px;padding:10px 12px;font-weight:600;transition:color .15s,background .15s;display:flex}.sidebar nav a:hover{color:var(--text)}.sidebar nav a.active{color:var(--text);background:var(--elev)}.lib-stats-wrap{flex-direction:column;gap:6px;margin-top:auto;display:flex}.lib-stats-toggle{width:100%;color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:12.5px;font-weight:600;transition:color .15s,background .15s;display:flex}.lib-stats-toggle:hover{color:var(--text);background:var(--elev)}.lib-stats-toggle .chev{margin-left:auto;transition:transform .2s;transform:rotate(180deg)}.lib-stats-toggle.open .chev{transform:none}.lib-stats{background:var(--elev);color:var(--muted);border-radius:8px;padding:14px;font-size:12px;animation:.18s ease-out stats-in}@keyframes stats-in{0%{opacity:0;transform:translateY(6px)}}.lib-stats-label{text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;font-size:11px;font-weight:700}.lib-stats-row{flex-wrap:wrap;gap:4px 12px;display:flex}.lib-stats-row b{color:var(--text);margin-right:3px;font-size:15px;font-weight:700}.lib-stats-updated{border-top:1px solid var(--line);margin-top:8px;padding-top:8px}.content{background:var(--panel);border-radius:var(--radius);flex-direction:column;grid-area:1/2;min-height:0;display:flex;overflow:hidden}main{flex:1;min-height:0;overflow-y:auto}.topbar{align-items:center;gap:10px;padding:14px 24px;display:flex}.topbar .search{flex:1}.search{background:var(--elev);max-width:440px;height:44px;color:var(--muted);border:1px solid #0000;border-radius:999px;align-items:center;gap:10px;padding:0 14px;transition:border-color .15s,background .15s;display:flex}.search:focus-within{border-color:var(--muted);background:var(--hover)}.search input{min-width:0;color:var(--text);font:inherit;background:0 0;border:0;outline:none;flex:1;font-size:15px}.page{padding:8px 24px 40px}.empty{text-align:center;padding:80px 24px}.empty h1{margin-bottom:12px;font-size:26px}.home-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin:12px 0 8px;display:flex}.home-head h1{letter-spacing:-.02em;margin-bottom:6px;font-size:30px}.btn-pill{background:var(--accent);color:var(--accent-ink);border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-weight:700;transition:transform .1s,filter .15s;display:inline-flex}.btn-pill:hover{filter:brightness(1.08);transform:scale(1.02)}.section{margin-top:28px}.section-head{justify-content:space-between;align-items:baseline;margin-bottom:14px;display:flex}.section-head h2{letter-spacing:-.01em;font-size:22px}.page-header{align-items:flex-end;gap:24px;padding:20px 0 24px;display:flex}.page-art{border-radius:8px;flex:none;width:220px;overflow:hidden;box-shadow:0 8px 40px #00000080}.page-art .round{border-radius:50%;overflow:hidden}:is(.page-art:has(.round),.page-art:has(.artist-placeholder)){border-radius:50%}.artist-placeholder{aspect-ratio:1;background:var(--elev);color:var(--muted);place-items:center;display:grid}.page-info{min-width:0}.page-label{font-size:13px;font-weight:600}.page-info h1{letter-spacing:-.03em;overflow-wrap:anywhere;margin:6px 0 12px;font-size:clamp(32px,5vw,64px);font-weight:900}.page-info h1.long{font-size:clamp(26px,3.4vw,44px)}.page-meta{color:var(--muted)}.play-buttons{align-items:center;gap:18px;margin-top:20px;display:flex}.btn-play{background:var(--accent);width:56px;height:56px;color:var(--accent-ink);border-radius:50%;place-items:center;transition:transform .1s,filter .15s;display:grid}.btn-play:hover{filter:brightness(1.08);transform:scale(1.05)}.btn-icon{color:var(--muted);place-items:center;width:40px;height:40px;display:grid}.btn-icon:hover{color:var(--text)}.toolbar{justify-content:flex-end;margin-bottom:8px;display:flex}.select{color:var(--muted);align-items:center;gap:8px;display:flex}.select select{background:var(--elev);color:var(--text);border:1px solid var(--line);font:inherit;border-radius:6px;padding:6px 8px}.grid{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:8px;display:grid}.card{border-radius:var(--radius);min-width:0;padding:12px;transition:background .2s}.card:hover{background:var(--elev)}.card-cover{border-radius:8px;margin-bottom:10px;position:relative;overflow:hidden;box-shadow:0 6px 20px #00000059}.card-cover.round{border-radius:50%}.card-play{background:var(--accent);width:46px;height:46px;color:var(--accent-ink);opacity:0;border-radius:50%;place-items:center;transition:opacity .2s,transform .2s;display:grid;position:absolute;bottom:8px;right:8px;transform:translateY(8px);box-shadow:0 6px 16px #0006}.card:hover .card-play,.card-play:focus-visible{opacity:1;transform:none}.card-title{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.card-sub{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:13px;overflow:hidden}.artist-card{text-align:center}.cover{aspect-ratio:1;object-fit:cover;background:var(--elev);width:100%;display:block}.cover-empty{color:#ffffff8c;place-items:center;display:grid}.tracks{flex-direction:column;display:flex}.track{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:6px;grid-template-columns:36px minmax(0,1fr) auto 52px;align-items:center;gap:12px;padding:6px 12px;display:grid}.tracks.with-album .track{grid-template-columns:36px minmax(0,3fr) minmax(0,2fr) auto 52px}.track:hover{background:var(--hover)}.track.current .track-title{color:var(--accent)}.track-num{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;place-items:center;display:grid}.track-num .p{color:var(--text);display:none}.track:hover .track-num .n{display:none}.track:hover .track-num .p{display:grid}.track-main{align-items:center;gap:12px;min-width:0;display:flex}.track-cover{border-radius:4px;flex:none}.track-text{min-width:0}.track-title,.track-artist,.track-album{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.track-title{font-size:15px}.track-artist,.track-album{color:var(--muted);font-size:13px}.track:hover .track-artist,.track:hover .track-album{color:var(--text)}.track-actions{opacity:0;gap:4px;transition:opacity .15s;display:flex}.track:hover .track-actions{opacity:1}.track-actions button{width:32px;height:32px;color:var(--muted);border-radius:50%;place-items:center;display:grid}.track-actions button:hover{color:var(--text);background:var(--elev)}.track-dur{color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.eq{align-items:flex-end;gap:2px;height:14px;display:inline-flex}.eq i{background:var(--accent);border-radius:1px;width:3px;animation:.9s ease-in-out infinite eq}.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}@keyframes eq{0%,to{height:4px}50%{height:14px}}.queue{width:var(--queue-w);background:var(--panel);border-radius:var(--radius);flex-direction:column;grid-area:1/3;min-height:0;display:flex}.queue-head{justify-content:space-between;align-items:center;padding:18px 16px 10px;display:flex}.queue-head h2{font-size:18px}.queue-body{padding:0 8px 16px;overflow-y:auto}.queue-body h3{padding:14px 8px 8px;font-size:14px}.queue-sub{justify-content:space-between;align-items:baseline;padding-right:8px;display:flex}.queue-sub .link{color:var(--muted);font-size:13px}.q-row{cursor:pointer;border-radius:6px;align-items:center;gap:12px;padding:6px 8px;display:flex}.q-row .cover{border-radius:4px;flex:none}.q-row:hover{background:var(--hover)}.q-row.current{cursor:default}.q-row.current .q-title{color:var(--accent)}.q-text{flex:1;min-width:0}.q-title,.q-artist{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.q-artist{color:var(--muted);font-size:13px}.q-remove{color:var(--muted);opacity:0;border-radius:50%;place-items:center;width:28px;height:28px;display:grid}.q-row:hover .q-remove{opacity:1}.q-remove:hover{color:var(--text);background:var(--elev)}.player{grid-area:2/1/auto/-1;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr);align-items:center;gap:16px;padding:0 8px;display:grid;position:relative}.mini-progress,.mobile-ctl{display:none}.now{align-items:center;gap:12px;min-width:0;display:flex}.now-cover .cover{border-radius:6px}.now-text{min-width:0}.now-title{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.now-artist{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.center{flex-direction:column;align-items:center;gap:4px;display:flex}.controls{align-items:center;gap:18px;display:flex}.ctl{color:var(--muted);border-radius:50%;place-items:center;width:34px;height:34px;transition:color .15s;display:grid;position:relative}.ctl:hover{color:var(--text)}.ctl.on{color:var(--accent)}.ctl.on:after{content:"";background:currentColor;border-radius:50%;width:4px;height:4px;position:absolute;bottom:0}.ctl-main{background:var(--text);color:#000;border-radius:50%;place-items:center;width:38px;height:38px;transition:transform .1s;display:grid}.ctl-main:hover{transform:scale(1.06)}.ctl-main.loading{animation:1s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.55}}.controls.big{justify-content:center;gap:22px}.controls.big .ctl-main{width:68px;height:68px}.controls.big .ctl{width:48px;height:48px}.seek{align-items:center;gap:8px;width:100%;max-width:620px;display:flex}.seek .slider{flex:1}.time{color:var(--muted);font-variant-numeric:tabular-nums;text-align:center;min-width:38px;font-size:12px}.right{justify-content:flex-end;align-items:center;gap:8px;display:flex}.volume{align-items:center;gap:4px;width:150px;display:flex}.volume .slider{flex:1}.slider{appearance:none;cursor:pointer;--fill:var(--text);background:0 0;height:14px;margin:0}.slider:hover{--fill:var(--accent)}.slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--fill) var(--p), #4a4a55 var(--p));border-radius:2px;height:4px}.slider::-moz-range-track{background:linear-gradient(to right, var(--fill) var(--p), #4a4a55 var(--p));border-radius:2px;height:4px}.slider::-webkit-slider-thumb{-webkit-appearance:none;opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;margin-top:-4px;transition:opacity .15s}.slider::-moz-range-thumb{opacity:0;background:#fff;border:0;border-radius:50%;width:12px;height:12px}.slider:hover::-webkit-slider-thumb{opacity:1}.slider:focus-visible::-webkit-slider-thumb{opacity:1}.slider:hover::-moz-range-thumb{opacity:1}.slider:focus-visible::-moz-range-thumb{opacity:1}.toast{left:50%;bottom:calc(var(--player-h) + 16px);color:#fff;z-index:50;background:#e5484d;border-radius:8px;max-width:calc(100vw - 32px);padding:10px 16px;font-weight:600;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #0006}.mobile-nav{display:none}.nowplaying{z-index:40;background:linear-gradient(180deg, #2b2b36 0%, var(--bg) 70%);padding:max(16px, env(safe-area-inset-top)) 24px max(28px, env(safe-area-inset-bottom));flex-direction:column;gap:20px;animation:.25s ease-out slideup;display:flex;position:fixed;inset:0}@keyframes slideup{0%{opacity:0;transform:translateY(40px)}}.np-top{justify-content:space-between;align-items:center;display:flex}.np-from{text-align:center;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;padding:0 8px;font-size:12px;font-weight:600;overflow:hidden}.np-cover{flex:1;place-items:center;min-height:0;display:grid}.np-cover .cover{border-radius:10px;width:min(100%,52vh,480px);box-shadow:0 16px 60px #0000008c}.np-title{letter-spacing:-.01em;font-size:24px;font-weight:800}.np-artist{color:var(--muted);margin-top:4px;font-size:16px}.np-seek{max-width:none}@media (width<=860px){:root{--player-h:64px}.app{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0, 1fr) var(--player-h) auto;gap:0;padding:0}.sidebar{display:none}.content{border-radius:0;grid-column:1}.topbar{padding:10px 16px}.topbar-logo{flex:none;display:block}.topbar-logo img{filter:drop-shadow(0 0 8px var(--accent-glow));display:block}.search{max-width:none}.page{padding:4px 16px 24px}.queue{inset:0 0 calc(var(--player-h) + 60px) 0;z-index:30;border-radius:0;width:auto;position:fixed}.player{background:#26262f;border-radius:8px;grid-column:1;grid-template-columns:minmax(0,1fr) auto;align-self:center;height:56px;margin:0 8px;padding:0 6px;overflow:hidden}.player .center,.player .right{display:none}.mini-progress{background:var(--text);height:2px;display:block;position:absolute;bottom:0;left:0}.now{cursor:pointer}.now-cover{pointer-events:none}.now-cover .cover{border-radius:4px;width:42px!important;height:42px!important}.mobile-ctl{align-items:center;display:flex}.mobile-ctl .ctl{color:var(--text);width:42px;height:42px}.mobile-nav{padding:6px 0 max(6px, env(safe-area-inset-bottom));background:linear-gradient(#000000d9,#000 60%);grid-template-columns:repeat(4,1fr);display:grid}.mobile-nav a,.mobile-nav button{color:var(--muted);flex-direction:column;align-items:center;gap:2px;padding:4px 0;font-size:11px;display:flex}.mobile-nav .active{color:var(--text)}.toast{bottom:calc(var(--player-h) + 72px)}.page-header{flex-direction:column;align-items:flex-start;gap:16px}.page-art{align-self:center;width:min(62vw,240px)}.grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:4px}.card{padding:8px}.card-play{display:none}.tracks.with-album .track,.track{grid-template-columns:28px minmax(0,1fr) auto;gap:10px;padding:6px 4px}.track-album,.track-dur{display:none}.track-actions{opacity:1}.track:hover{background:0 0}.track:hover .track-num .n{display:grid}.track:hover .track-num .p{display:none}}:root{--scroll-thumb:#ffffff24;--scroll-thumb-hover:#ffffff52}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar-track{margin:8px 0}::-webkit-scrollbar-button{width:0;height:0;display:none}::-webkit-scrollbar-thumb{background-color:var(--scroll-thumb);background-clip:padding-box;border:3px solid #0000;border-radius:999px;min-height:40px}:hover::-webkit-scrollbar-thumb{background-color:var(--scroll-thumb-hover)}::-webkit-scrollbar-thumb:active{background-color:#ffffff80}@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}main:hover,.queue-body:hover,.nowplaying:hover{scrollbar-color:var(--scroll-thumb-hover) transparent}}.login{background:radial-gradient(ellipse at 50% 30%, #00c8601f, transparent 60%), var(--bg);place-items:center;min-height:100%;padding:24px 16px;display:grid}.login-card{text-align:center;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:360px;display:flex}.login-card img{filter:drop-shadow(0 0 24px var(--accent-glow))}.login-card h1{font-size:32px}.login-card p{margin:0 0 8px}.login-card input{border:1px solid var(--line);background:var(--elev);width:100%;height:48px;color:var(--text);font:inherit;border-radius:10px;outline:none;padding:0 16px;font-size:16px;transition:border-color .15s}.login-card input:focus{border-color:var(--accent)}.login-card .btn-pill{justify-content:center;width:100%;height:48px;font-size:15px}.login-card .btn-pill:disabled{opacity:.5;cursor:default;transform:none}.login-error{color:#ff8a8a;text-align:left;width:100%;font-size:13px}.login-hint{font-size:12.5px;margin-top:4px!important}.avatar{background:var(--accent);width:32px;height:32px;color:var(--accent-ink);border-radius:50%;flex:none;place-items:center;font-size:14px;font-weight:800;display:grid}.account{border-top:1px solid var(--line);align-items:center;gap:10px;padding:10px 6px 0 10px;display:flex}.account-text{flex:1;min-width:0}.account-name{white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:700;overflow:hidden}.account-user{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.account-menu{flex:none;display:none;position:relative}.account-menu>.avatar{width:36px;height:36px}.account-backdrop{z-index:60;position:fixed;inset:0}.account-pop{z-index:61;background:var(--elev);border:1px solid var(--line);border-radius:10px;min-width:200px;padding:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 12px 32px #00000080}.account-logout{width:100%;color:var(--text);border-radius:6px;align-items:center;gap:8px;margin-top:10px;padding:8px 10px;font-weight:600;display:flex}.account-logout:hover{background:var(--hover)}@media (width<=860px){.account-menu{display:block}}.like{width:32px;height:32px;color:var(--muted);border-radius:50%;flex:none;place-items:center;transition:color .15s,transform .1s;display:grid}.like:hover{color:var(--text)}.like.on{color:var(--accent)}.like:active{transform:scale(.85)}.track-actions{opacity:1}.track-actions .like:not(.on),.track-actions .more{opacity:0}.track:hover .track-actions .like,.track:hover .track-actions .more,.track-actions .like:focus-visible,.track-actions .more:focus-visible{opacity:1}.track-actions .more{width:32px;height:32px;color:var(--muted);border-radius:50%;place-items:center;display:grid}.track-actions .more:hover{color:var(--text);background:var(--elev)}.track-note{color:var(--muted)}.track.dragging{opacity:.4}.track.drop-above{box-shadow:inset 0 2px 0 var(--accent)}.track.drop-below{box-shadow:inset 0 -2px 0 var(--accent)}.hint{margin-top:16px;padding:0 12px;font-size:12px}.now-like{margin-left:4px}.np-info{align-items:center;gap:12px;display:flex}.np-info-text{flex:1;min-width:0}.page-info h1.editable{cursor:pointer}.page-info h1.editable:hover{text-underline-offset:6px;text-decoration:underline;text-decoration-thickness:2px}.empty.small{padding:40px 12px}.empty.small p{margin:0 0 8px}.empty.small .btn-pill{margin-top:12px}.menu-backdrop{z-index:90;position:fixed;inset:0}.menu{background:#2a2a33;border:1px solid #3a3a45;border-radius:8px;min-width:230px;max-width:min(320px,100vw - 16px);max-height:min(420px,100vh - 16px);padding:4px;animation:.12s ease-out menu-in;position:fixed;overflow-y:auto;box-shadow:0 16px 40px #0000008c}@keyframes menu-in{0%{opacity:0;transform:scale(.97)}}.menu-item{text-align:left;width:100%;color:var(--text);border-radius:4px;align-items:center;gap:12px;padding:9px 10px;font-size:14px;display:flex}.menu-item:hover,.menu-item:focus-visible{background:#3a3a45;outline:none}.menu-item.danger{color:#ff8a8a}.menu-icon{width:16px;color:var(--muted);flex:none;place-items:center;display:grid}.menu-item.danger .menu-icon{color:inherit}.menu-label{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.menu-back{color:var(--muted);border-bottom:1px solid #3a3a45;border-radius:4px 4px 0 0;margin-bottom:4px;font-size:13px;font-weight:600}.menu-divider{background:#3a3a45;height:1px;margin:4px 6px}.modal-backdrop{z-index:95;background:#0009;place-items:center;padding:16px;animation:.15s ease-out fade-in;display:grid;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}}.modal{background:#24242c;border-radius:12px;width:100%;max-width:400px;padding:24px;box-shadow:0 24px 60px #0009}.modal h2{margin-bottom:16px;font-size:20px}.modal p{margin:0}.modal input{border:1px solid var(--line);background:var(--elev);width:100%;height:44px;color:var(--text);font:inherit;border-radius:8px;outline:none;padding:0 14px;font-size:15px}.modal input:focus{border-color:var(--accent)}.modal-actions{justify-content:flex-end;gap:10px;margin-top:22px;display:flex}.btn-ghost{color:var(--muted);border-radius:999px;padding:10px 18px;font-weight:700}.btn-ghost:hover{color:var(--text)}.btn-danger{color:#fff;background:#e5484d;border-radius:999px;padding:10px 18px;font-weight:700}.btn-danger:hover{filter:brightness(1.1)}.modal .btn-pill:disabled{opacity:.5;cursor:default}.toaster{left:50%;bottom:calc(var(--player-h) + 16px);z-index:80;pointer-events:none;flex-direction:column;align-items:center;gap:8px;width:max-content;max-width:calc(100vw - 32px);display:flex;position:fixed;transform:translate(-50%)}.toaster .toast{animation:.2s ease-out toast-in;position:static;transform:none}.toaster .toast.info{color:#111;background:#f4f4f6}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.side-lib{border-top:1px solid var(--line);flex-direction:column;flex:1;min-height:0;padding-top:12px;display:flex}.side-lib-head{justify-content:space-between;align-items:center;padding:0 4px 6px 12px;display:flex}.side-lib-title{color:var(--muted);align-items:center;gap:12px;font-weight:700;display:flex}.side-lib-title:hover,.side-lib-title.active{color:var(--text)}.side-lib-list{flex-direction:column;flex:1;gap:2px;min-height:0;display:flex;overflow-y:auto}.side-item{border-radius:6px;align-items:center;gap:10px;padding:6px 8px;display:flex}.side-item:hover{background:var(--elev)}.side-item.active{background:var(--hover)}.side-item .cover{border-radius:4px;flex:none}.side-item-text{flex-direction:column;min-width:0;display:flex}.side-item-name,.side-item-sub{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.side-item-name{font-size:13.5px;font-weight:600}.side-item.active .side-item-name{color:var(--accent)}.side-item-sub{color:var(--muted);font-size:12px}.mosaic{grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.mosaic .cover{border-radius:0!important}.liked-cover{color:#fff;background:linear-gradient(135deg,#4b2bd6,#8fd3c9);place-items:center;display:grid}.playlist-empty{color:var(--muted);background:#2a2a33}.recent{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;display:grid}.recent-item{text-align:left;background:#ffffff0f;border-radius:6px;align-items:center;gap:12px;padding-right:12px;transition:background .15s;display:flex;overflow:hidden}.recent-item:hover{background:#ffffff1f}.recent-item .cover{flex:none}.recent-text{flex-direction:column;min-width:0;display:flex}.recent-title,.recent-artist{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.recent-title{font-size:13.5px;font-weight:700}.recent-artist{color:var(--muted);font-size:12px}@media (width<=860px){.mobile-nav{grid-template-columns:repeat(5,1fr)}.recent{grid-template-columns:1fr 1fr}.track-actions .like:not(.on){display:none}.track-actions .more{opacity:1}.now-like{display:none}}.tracks.reorderable .track{grid-template-columns:24px 28px minmax(0,1fr) auto 52px}.tracks.reorderable.with-album .track{grid-template-columns:24px 28px minmax(0,3fr) minmax(0,2fr) auto 52px}.drag-handle{width:24px;height:36px;color:var(--muted);opacity:.45;cursor:grab;touch-action:none;border-radius:4px;place-items:center;transition:opacity .15s,color .15s;display:grid}.drag-handle *{pointer-events:none;touch-action:none}.track:hover .drag-handle,.drag-handle:focus-visible{opacity:1}.drag-handle:hover{color:var(--text)}.tracks.is-dragging,.tracks.is-dragging *{-webkit-user-select:none;user-select:none;cursor:grabbing!important}.tracks.is-dragging .track:hover{background:0 0}.track.dragging{opacity:1;outline:1px solid var(--accent);background:var(--hover)!important}@media (width<=860px){.tracks.reorderable .track,.tracks.reorderable.with-album .track{grid-template-columns:28px 24px minmax(0,1fr) auto}.drag-handle{opacity:.8;width:28px;height:44px}}
