@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";:root{--color-primary:#a038ff;--color-primary-dark:#7b1fd4;--color-primary-light:#c47aff;--bg-base:#0a0a0a;--bg-sidebar:#1a1a1a;--bg-card:#1a1a1a;--bg-elevated:#242424;--bg-highlight:#2e2e2e;--bg-row-active:#a038ff0f;--accent-primary:var(--color-primary);--accent-hover:var(--color-primary-dark);--accent-blue:#a038ff;--text-primary:#fff;--text-secondary:#b3b3b3;--text-tertiary:#666;--border-subtle:#ffffff14;--border-card:#ffffff1a;--sidebar-width:220px;--player-height:64px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-pill:50px;--radius-full:50%;--shadow-card:0 4px 20px #00000080;--shadow-player:0 -4px 30px #a038ff26;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--transition-fast:.15s ease-out;--transition-normal:.25s cubic-bezier(.25, .46, .45, .94);--transition-bounce:.3s cubic-bezier(.34, 1.56, .64, 1)}.ambient-bg{filter:blur(140px)saturate(1.8)brightness(.4);opacity:.75;z-index:0;pointer-events:none;background-position:50%;background-size:cover;transition:background-image .8s cubic-bezier(.25,.46,.45,.94);position:absolute;inset:0}*,:before,:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html{background:var(--bg-base)}body{background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;height:100dvh;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5;overflow:hidden}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer;background:0 0;border:none;font-family:inherit}.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}.skeleton{border-radius:var(--radius-md);background:linear-gradient(90deg,#1a1a1a 25%,#2e2e2e 50%,#1a1a1a 75%) 0 0/200%;animation:1.2s linear infinite shimmer}::-webkit-scrollbar{width:0;height:0;display:none}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:0 0}*{scrollbar-width:none;-ms-overflow-style:none}.sidebar{background:var(--bg-sidebar);-webkit-backdrop-filter:blur(40px);border-right:1px solid var(--border-subtle);z-index:2;flex-direction:column;grid-area:sidebar;height:100vh;padding:28px 14px;display:flex;overflow-y:auto}.sidebar-logo{align-items:center;gap:10px;margin-bottom:20px;padding:0 6px;display:flex}.sidebar-logo-img{object-fit:contain;mix-blend-mode:screen;flex-shrink:0;width:28px;height:28px}.sidebar-logo span{letter-spacing:-.3px;font-size:1.25rem;font-weight:800}.sidebar-search{background:var(--bg-elevated);border-radius:var(--radius-md);border:1.5px solid var(--border-subtle);align-items:center;gap:8px;margin-bottom:20px;padding:8px 12px;transition:border-color .2s;display:flex}.sidebar-search:focus-within{border-color:var(--color-primary)}.sidebar-search input{color:var(--text-primary);background:0 0;border:none;outline:none;width:100%;font-size:.82rem}.sidebar-search input::placeholder{color:var(--text-tertiary)}.s-icon{color:var(--text-tertiary);flex-shrink:0;font-size:.95rem}.sidebar-group{margin-bottom:6px}.sidebar-group-header{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:background var(--transition-fast);border-radius:6px;align-items:center;gap:7px;padding:6px 8px;font-size:.7rem;font-weight:700;display:flex}@media (hover:hover){.sidebar-group-header:hover{background:var(--bg-card)}}.playlist-header{margin-bottom:4px}.badge-count{color:var(--text-secondary)}.pl-add-btn{color:var(--text-tertiary);transition:color var(--transition-fast);margin-left:auto;font-size:.7rem}@media (hover:hover){.pl-add-btn:hover{color:var(--text-primary)}}.pl-chevron{color:var(--text-tertiary);font-size:.6rem}.nav-menu{list-style:none}.nav-item{cursor:pointer;color:var(--text-secondary);transition:background var(--transition-fast), color var(--transition-fast);border-radius:8px;align-items:center;gap:10px;margin-bottom:1px;padding:8px 10px;font-size:.85rem;font-weight:500;display:flex;position:relative}@media (hover:hover){.nav-item:hover{background:var(--bg-card);color:var(--text-primary)}}.nav-item.active{color:var(--text-primary);background:#a038ff1a}.nav-item.active:before{content:"";background:var(--color-primary);border-radius:0 3px 3px 0;width:3px;height:60%;position:absolute;top:20%;left:0}.nav-icon{flex-shrink:0;align-items:center;font-size:.9rem;display:flex}.nav-label{flex:1}.sidebar-playlists{flex-direction:column;flex:1;display:flex;overflow:hidden}.playlist-list{flex:1;overflow-y:auto}.pl-item{padding-right:6px}.pl-count{color:var(--text-tertiary);background:var(--bg-highlight);border-radius:8px;flex-shrink:0;padding:1px 5px;font-size:.7rem}.pl-delete-btn{color:var(--text-tertiary);opacity:0;transition:opacity var(--transition-fast), color var(--transition-fast);font-size:.7rem}@media (hover:hover){.pl-item:hover .pl-delete-btn{opacity:1}.pl-delete-btn:hover{color:#e8315f}}.pl-empty-hint{color:var(--text-tertiary);text-align:center;padding:10px;font-size:.75rem;line-height:1.5}.new-playlist-form{gap:6px;padding:6px 8px;display:flex}.new-playlist-form input{background:var(--bg-card);border:1px solid var(--border-subtle);color:var(--text-primary);border-radius:6px;outline:none;flex:1;padding:5px 10px;font-size:.8rem}.new-playlist-form input:focus{border-color:var(--color-primary)}.new-playlist-form button{background:var(--color-primary);color:#fff;border-radius:var(--radius-pill);transition:background var(--transition-fast);padding:5px 12px;font-size:.8rem;font-weight:600}@media (hover:hover){.new-playlist-form button:hover{background:var(--color-primary-dark)}}.sidebar-user{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:10px;align-items:center;gap:8px;margin-top:12px;padding:10px 8px;display:flex}.user-avatar-box{width:32px;height:32px;color:var(--color-primary-light);background:#a038ff40;border:1.5px solid #a038ff66;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.9rem;font-weight:700;display:flex;overflow:hidden}.user-avatar-box img{object-fit:cover;width:100%;height:100%}.user-text{flex-direction:column;flex:1;min-width:0;display:flex}.user-name{max-width:110px;font-size:.8rem;font-weight:600}.user-sub{color:var(--text-tertiary);max-width:110px;font-size:.65rem}.sidebar-logout{color:var(--text-tertiary);transition:color var(--transition-fast);flex-shrink:0;font-size:.9rem}@media (hover:hover){.sidebar-logout:hover{color:var(--accent-primary)}}.sidebar-close-btn{display:none}@media (width<=768px){.sidebar{display:none!important}}.sidebar-overlay{display:none}@media (width<=768px){.sidebar-overlay{-webkit-backdrop-filter:blur();z-index:900;pointer-events:none;background:0 0;transition:background .4s,-webkit-backdrop-filter .4s,backdrop-filter .4s;display:block;position:fixed;inset:0}.sidebar-overlay.overlay-active{-webkit-backdrop-filter:blur(8px);pointer-events:auto;background:#0006}}.player{-webkit-backdrop-filter:blur(50px)saturate(180%);box-shadow:var(--shadow-player);z-index:100;background:#121212d9;flex-direction:column;flex-shrink:0;display:flex;position:relative}.player-time{color:var(--text-tertiary);font-variant-numeric:tabular-nums;text-align:center;min-width:36px;font-size:.75rem;font-weight:500}.player-top-seekbar{cursor:pointer;z-index:10;transform-origin:top;background:#ffffff1a;align-items:center;height:2px;transition:height .15s,transform .15s;display:flex;position:absolute;top:0;left:0;right:0}@media (hover:hover){.player-top-seekbar:hover{height:8px;transform:translateY(-6px)}}.player-top-seekbar.loading .player-progress-bg:after{content:"";background:linear-gradient(90deg,#0000,#a038ff59,#0000);animation:1.2s linear infinite buffer-slide;position:absolute;inset:0}@keyframes buffer-slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}.player-top-seekbar .player-progress-bg{width:100%;height:100%;position:relative}.player-top-seekbar .player-progress-fill{background:var(--color-primary);height:100%;transition:width .1s linear;position:relative;box-shadow:0 0 10px #a038ff73}.player-top-seekbar .player-progress-handle{opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:transform .2s,opacity .2s;position:absolute;top:50%;transform:translate(-50%,-50%)scale(0);box-shadow:0 0 6px #0009}@media (hover:hover){.player-top-seekbar:hover .player-progress-handle{opacity:1;transform:translate(-50%,-50%)scale(1)}}.player-inner{justify-content:space-between;align-items:center;height:84px;padding:0 24px;display:flex}.player-now-playing{flex:1;align-items:center;gap:14px;min-width:0;display:flex}.now-playing-cover{border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0;width:48px;height:48px;transition:transform .3s;box-shadow:0 4px 12px #00000080}.now-playing-cover.placeholder{background:linear-gradient(135deg, var(--bg-elevated), var(--bg-card))}@media (hover:hover){.player-now-playing:hover .now-playing-cover:not(.placeholder){transform:scale(1.05)}}.now-playing-text{flex-direction:column;gap:2px;min-width:0;display:flex}.now-playing-title{color:var(--text-primary);letter-spacing:-.2px;max-width:180px;font-size:.9rem;font-weight:700}.now-playing-artist{color:var(--text-secondary);max-width:180px;font-size:.72rem;font-weight:500}.now-playing-actions{gap:6px;margin-left:8px;display:flex}.p-action-btn{color:var(--text-tertiary);cursor:pointer;background:0 0;border:none;align-items:center;padding:4px;font-size:.9rem;transition:all .2s;display:flex}@media (hover:hover){.p-action-btn:hover{color:var(--text-primary);transform:scale(1.1)}}.p-action-btn.liked{color:#ef4444}.player-center{flex-direction:column;flex:2;align-items:center;gap:4px;display:flex}.player-controls{align-items:center;gap:20px;display:flex}.p-ctrl-btn,.p-skip-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .2s;display:flex}.p-ctrl-btn{font-size:.95rem}.p-skip-btn{font-size:1.1rem}@media (hover:hover){.p-ctrl-btn:hover:not(:disabled),.p-skip-btn:hover:not(:disabled){color:var(--text-primary);transform:scale(1.1)}}.p-ctrl-btn.ctrl-active{color:var(--color-primary);filter:drop-shadow(0 0 4px #a038ff80)}.sleep-timer-wrap{align-items:center;display:flex;position:relative}.sleep-popup{background:var(--bg-elevated);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-subtle);border-radius:var(--radius-md);z-index:200;flex-direction:column;width:148px;margin-bottom:10px;padding:6px 0;animation:.2s ease-out sleep-slide-up;display:flex;position:absolute;bottom:100%;right:0;box-shadow:0 8px 24px #0009}@keyframes sleep-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.sleep-popup-title{text-transform:uppercase;letter-spacing:.8px;color:var(--text-tertiary);border-bottom:1px solid var(--border-subtle);margin-bottom:4px;padding:6px 14px;font-size:.68rem;font-weight:700}.sleep-item{color:var(--text-secondary);text-align:left;cursor:pointer;background:0 0;border:none;padding:9px 14px;font-size:.85rem;transition:all .15s}@media (hover:hover){.sleep-item:hover{color:var(--text-primary);background:#a038ff1f}}.sleep-badge{background:var(--color-primary);color:#fff;border-radius:4px;padding:1px 4px;font-size:.6rem;font-weight:700;position:absolute;top:-8px;right:2px;transform:scale(.85)}.p-ctrl-btn:disabled,.p-skip-btn:disabled,.p-play-btn:disabled{opacity:.3;cursor:not-allowed}.p-play-btn-wrapper{border-radius:50%;justify-content:center;align-items:center;transition:transform .2s cubic-bezier(.175,.885,.32,1.275);display:flex;position:relative}@media (hover:hover){.p-play-btn-wrapper:hover{transform:scale(1.08)}}.p-play-btn-wrapper:active{transform:scale(.95)}.p-play-btn-wrapper.is-playing:before{content:"";background:var(--color-primary);opacity:.28;filter:blur(8px);z-index:-1;border-radius:50%;animation:2.5s ease-in-out infinite alternate pulse-glow;position:absolute;inset:-4px}@keyframes pulse-glow{0%{opacity:.2;transform:scale(.95)}to{opacity:.5;transform:scale(1.1)}}.p-play-btn{background:var(--color-primary);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1rem;transition:background .15s,transform .1s;display:flex;box-shadow:0 4px 12px #a038ff73;color:#fff!important}@media (hover:hover){.p-play-btn:hover{background:var(--color-primary-dark)}}.p-play-btn:active{transform:scale(.95)}.player-right{flex:1;justify-content:flex-end;align-items:center;gap:14px;display:flex;position:relative}.p-icon-btn,.p-queue-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;font-size:1.05rem;transition:all .2s;display:flex}@media (hover:hover){.p-icon-btn:hover,.p-queue-btn:hover{color:var(--text-primary);transform:scale(1.1)}}.p-queue-btn.active{color:var(--color-primary)}.volume-track{background:var(--bg-highlight);cursor:pointer;border-radius:2px;align-items:center;width:88px;height:4px;display:flex;position:relative}.volume-fill{background:var(--color-primary);border-radius:2px;height:100%;transition:background .2s}@media (hover:hover){.volume-track:hover .volume-fill{background:#a038ff}}.volume-handle{opacity:0;background:#fff;border-radius:50%;width:10px;height:10px;transition:all .2s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:50%;transform:translate(-50%,-50%)scale(0);box-shadow:0 2px 4px #0006}@media (hover:hover){.volume-track:hover .volume-handle{opacity:1;transform:translate(-50%,-50%)scale(1)}}.queue-popup{background:var(--bg-elevated);-webkit-backdrop-filter:blur(40px)saturate(150%);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);z-index:101;flex-direction:column;width:320px;max-height:400px;animation:.3s cubic-bezier(.2,.8,.2,1) queue-slide-up;display:flex;position:absolute;bottom:calc(100% + 20px);right:0;overflow:hidden;box-shadow:0 20px 50px #000c}@keyframes queue-slide-up{0%{opacity:0;transform:translateY(20px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.queue-popup-hdr{color:var(--text-primary);border-bottom:1px solid var(--border-subtle);padding:16px 20px 12px;font-size:.9rem;font-weight:700}.queue-popup-list{flex:1;padding:8px;overflow-y:auto}.queue-item{border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:12px;padding:10px 12px;transition:background .15s;display:flex}@media (hover:hover){.queue-item:hover{background:#ffffff0f}}.queue-item-active{border-left:3px solid var(--color-primary);background:#a038ff1f;border-top-left-radius:4px;border-bottom-left-radius:4px}.queue-item-cover{object-fit:cover;border-radius:6px;flex-shrink:0;width:32px;height:32px}.queue-item-info{flex:1;min-width:0}.queue-item-title{color:var(--text-primary);font-size:.85rem;font-weight:600}.queue-item-active .queue-item-title{color:var(--color-primary)}.queue-item-artist{color:var(--text-secondary);margin-top:2px;font-size:.75rem}.queue-empty{color:var(--text-tertiary);text-align:center;padding:30px 20px;font-size:.85rem}.volume-wrapper{align-items:center;gap:8px;display:flex}.queue-sec-hdr{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.7px;padding:10px 14px 4px;font-size:.72rem;font-weight:700}.queue-drag-handle{cursor:grab;color:var(--text-tertiary);align-items:center;margin-left:auto;padding:6px 10px;transition:color .15s;display:flex}.queue-item:hover .queue-drag-handle{color:var(--text-secondary)}.queue-drag-handle:active{cursor:grabbing}.queue-item-active.now-playing-row{border-left:3px solid var(--color-primary);background:#a038ff1a}@media (width<=768px){.player-inner{height:64px;padding:0 16px}.player-seekbar-row,.player-time{display:none}.now-playing-cover{width:40px;height:40px}.now-playing-title{max-width:140px;font-size:.85rem}.player-right{display:none}.player-controls{gap:12px}.p-ctrl-btn{display:none}.player-center{flex:0}}@media (width<=420px){.now-playing-title,.now-playing-artist{max-width:110px}}.np-overlay{z-index:2000;z-index:2000;will-change:transform, opacity;background:#0a0a0e;justify-content:center;align-items:center;animation:.6s cubic-bezier(.32,.72,0,1) forwards np-slide-up;display:flex;position:absolute;inset:0}.np-overlay.closing{pointer-events:none;animation:.45s cubic-bezier(.45,0,.55,1) forwards np-slide-down}@keyframes np-slide-up{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translate(0,0)}}@keyframes np-slide-down{0%{opacity:1;transform:translate(0,0)}to{opacity:0;transform:translateY(100%)}}@keyframes np-fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.np-panel{z-index:4;width:100%;max-width:600px;height:100%;box-shadow:none;background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.np-bg,.np-bg-next,.np-bg-color,.np-bg-vignette{pointer-events:none;will-change:transform, opacity;position:absolute;inset:0;transform:translate(0,0)}.np-bg{filter:brightness(.4);z-index:0;background-position:50%;background-size:cover}.np-bg-next{z-index:1;opacity:0}.np-bg-color{z-index:2;opacity:0}.np-bg-vignette{z-index:3;background:linear-gradient(#0000 40%,#00000040 100%)}.np-panel>:not(.np-bg):not(.np-bg-next):not(.np-bg-color):not(.np-bg-vignette){z-index:4;position:relative}.npp-top-header{z-index:100;background:linear-gradient(#0009,#0000);justify-content:space-between;align-items:center;padding:18px 20px;display:flex;position:absolute;top:0;left:0;right:0}.np-close-chevron{width:40px;height:40px;color:var(--text-secondary);transition:transform var(--transition-bounce), color .2s;z-index:10;justify-content:center;align-items:center;font-size:1.25rem;display:flex}@media (hover:hover){.np-close-chevron:hover{color:var(--text-primary);transform:translateY(2px)}}.npp-header-spacer{width:40px}.npp-header-brand{flex:1;justify-content:center;align-items:center;padding-top:10px;display:flex}.npp-header-info{text-align:center;flex-direction:column;align-items:center;min-width:0;max-width:80%;display:flex}.npp-context-type{letter-spacing:1.8px;color:#ffffff73;text-transform:uppercase;margin-bottom:3px;font-size:.62rem;font-weight:700}.npp-context-name{color:#fff;width:100%;font-size:.96rem;font-weight:700}.np-close{color:#ffffffb3;cursor:pointer;z-index:100;pointer-events:auto;background:#2a2a2e;border:none;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;font-size:1rem;transition:all .2s;display:flex}@media (hover:hover){.np-close:hover{color:#fff;background:#ffffff2e;transform:scale(1.1)}}.np-turntable{aspect-ratio:1;cursor:pointer;flex-shrink:0;width:calc(100% - 50px);height:auto;margin-top:32px;position:relative}.vinyl-disc{background:radial-gradient(circle,#1a1a1a 0%,#111 60%,#222 62%,#111 63%,#0d0d0d 100%);border-radius:50%;position:absolute;inset:0;box-shadow:0 12px 40px #000000d9,inset 0 0 0 2px #ffffff0a}.vinyl-groove{border:1px solid #ffffff0b;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.g1{width:95%;height:95%}.g2{width:82%;height:82%}.g3{width:69%;height:69%}.g4{width:56%;height:56%}.vinyl-label{border-radius:50%;justify-content:center;align-items:center;width:38%;height:38%;display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #ffffff14}.vinyl-label-img{object-fit:cover;border-radius:50%;width:100%;height:100%}.vinyl-spindle{pointer-events:none;background:#0009;border-radius:50%;width:10px;height:10px;position:absolute;box-shadow:inset 0 1px 2px #000c}.vinyl-disc{animation:3s linear infinite paused vinyl-spin}.vinyl-disc.spinning{animation-play-state:running}@keyframes vinyl-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tonearm-wrap{transform-origin:40px 40px;z-index:10;pointer-events:auto;cursor:pointer;width:140px;height:180px;transition:transform .7s cubic-bezier(.4,0,.2,1);position:absolute;top:-15px;right:-130px}.tonearm-wrap.arm-off{transform:rotate(-15deg)}.tonearm-wrap.arm-on{transform:rotate(20deg)}.tonearm-base{z-index:3;background:#333;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;display:flex;position:absolute;top:0;left:0;box-shadow:0 4px 8px #0009,inset 0 1px 2px #ffffff1a}.tonearm-base-inner{background:#111;border-radius:50%;width:44px;height:44px;position:absolute;box-shadow:inset 0 2px 4px #000c}.tonearm-base-ring{box-sizing:border-box;background:#2a2a2a;border:4px solid #7a7a7a;border-radius:50%;width:28px;height:28px;position:absolute;box-shadow:0 2px 4px #00000080}.tonearm-base-dot{background:#222;border-radius:50%;width:8px;height:8px;position:absolute;top:50%;right:12px;transform:translateY(-50%);box-shadow:inset 0 1px 1px #000c}.tonearm-counterweight{z-index:2;background:#b5b5b5;width:16px;height:24px;position:absolute;top:-15px;left:32px}.tonearm-counterweight:after{content:"";background:#222;border-radius:2px;width:32px;height:24px;position:absolute;top:-24px;left:-8px;box-shadow:0 4px 8px #0006}.tonearm-segment-1{z-index:2;background:#111;border-radius:2px;width:12px;height:60px;position:absolute;top:54px;left:34px;box-shadow:2px 2px 4px #00000080}.tonearm-segment-1:before{content:"";background:#e6d0ba;height:18px;position:absolute;top:0;left:0;right:0}.tonearm-segment-2{transform-origin:50% 2px;background:#111;border-radius:2px;width:12px;height:50px;position:absolute;top:calc(100% - 2px);left:0;transform:rotate(38deg);box-shadow:2px 2px 4px #00000080}.tonearm-head{transform-origin:50% 2px;flex-direction:column;align-items:center;width:10px;height:45px;display:flex;position:absolute;top:calc(100% - 2px);left:1px;transform:rotate(-12deg)}.tonearm-head-connector{background:#333;width:8px;height:12px}.tonearm-head-connector:before{content:"";background:#b5b5b5;width:12px;height:4px;position:absolute;top:4px;left:-1px}.tonearm-head-body{background:#111;border-radius:2px;width:18px;height:26px;margin-top:-2px;position:relative;overflow:hidden;box-shadow:2px 4px 6px #0009}.tonearm-needle-lines{box-sizing:border-box;background:0 0;border-top:2px solid #b5b5b5;border-bottom:2px solid #b5b5b5;height:6px;position:absolute;bottom:6px;left:4px;right:4px}.np-info{text-align:center;box-sizing:border-box;width:100%;margin-top:28px;padding:0 32px}.np-title{color:#fff;letter-spacing:-.2px;font-size:1.15rem;font-weight:700}.np-artist{color:#ffffff80;margin-top:4px;font-size:.85rem}.np-seekbar-row{box-sizing:border-box;align-items:center;gap:10px;width:100%;margin-top:28px;padding:0 32px;display:flex}.np-time{color:#ffffff73;font-variant-numeric:tabular-nums;min-width:32px;font-size:.72rem}.np-time:last-child{text-align:right}.np-seekbar{cursor:pointer;background:#ffffff1f;border-radius:2px;flex:1;height:4px;transition:height .2s;position:relative}.np-seekbar:hover{height:6px}.np-seekbar-fill{background:var(--color-primary);border-radius:2px;height:100%;transition:width .1s linear;box-shadow:0 0 8px #a038ff80}.np-seekbar-handle{opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:all .2s;position:absolute;top:50%;transform:translate(-50%,-50%)scale(0)}@media (hover:hover){.np-seekbar:hover .np-seekbar-handle{opacity:1;transform:translate(-50%,-50%)scale(1)}}.np-controls{box-sizing:border-box;justify-content:center;align-items:center;gap:32px;margin-top:28px;padding:0 16px;display:flex}.np-ctrl-btn{color:#ffffff73;cursor:pointer;background:0 0;border:none;font-size:1rem;transition:all .2s}@media (hover:hover){.np-ctrl-btn:hover{color:#fff;transform:scale(1.1)}}.np-ctrl-btn.ctrl-active{color:var(--color-primary);filter:drop-shadow(0 0 6px #a038ff80)}.np-skip-btn{color:#ffffffb3;cursor:pointer;background:0 0;border:none;font-size:1.2rem;transition:all .2s}@media (hover:hover){.np-skip-btn:hover{color:#fff;transform:scale(1.12)}}.np-play-wrap{justify-content:center;align-items:center;display:flex;position:relative}.np-play-wrap.is-playing:before{content:"";background:var(--color-primary);opacity:.28;filter:blur(10px);z-index:-1;border-radius:50%;animation:2.5s ease-in-out infinite alternate pulse-glow;position:absolute;inset:-6px}.np-play-btn{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:1.4rem;transition:background .15s,transform .1s;display:flex;box-shadow:0 6px 20px #a038ff80}@media (hover:hover){.np-play-btn:hover{background:var(--color-primary-dark);transform:scale(1.06)}}.np-play-btn:active{transform:scale(.95)}.np-secondary-controls{z-index:10;justify-content:space-between;align-items:center;padding-top:0;display:flex;position:absolute;bottom:30px;left:32px;right:32px}.np-volume-section{align-items:center;gap:8px;display:flex}.np-vol-btn{color:var(--text-secondary);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:1.1rem;transition:color .2s;display:flex}@media (hover:hover){.np-vol-btn:hover{color:var(--text-primary)}}.np-vol-slider{cursor:pointer;align-items:center;width:100px;height:20px;display:flex}.np-vol-bg{background:#ffffff26;border-radius:2px;width:100%;height:4px;position:relative}.np-vol-fill{background:var(--color-primary);border-radius:2px;transition:width .1s linear;position:absolute;top:0;bottom:0;left:0}@media (hover:hover){.np-vol-slider:hover .np-vol-fill{background:var(--color-primary-light)}.np-vol-handle{opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:all .2s;position:absolute;top:50%;transform:translate(-50%,-50%)scale(0)}.np-vol-slider:hover .np-vol-handle{opacity:1;transform:translate(-50%,-50%)scale(1)}}.np-tool-btn-wrap{align-items:center;display:flex;position:relative}.np-tool-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:3px;font-size:1.1rem;transition:color .2s,transform .2s;display:flex}@media (hover:hover){.np-tool-btn:hover{color:#fff;transform:scale(1.1)}}.np-squircle-cover-wrapper{aspect-ratio:1;width:90%;height:auto;box-shadow:none;border-radius:24px;flex-shrink:0;justify-content:center;align-items:center;margin-top:32px;animation:.3s ease-out scale-up;display:flex;overflow:hidden}.np-squircle-cover{object-fit:cover;width:100%;height:100%}@keyframes scale-up{0%{opacity:.8;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.more-popup{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:200;background:#16161af2;border:1px solid #44404014;border-radius:12px;flex-direction:column;width:160px;margin-bottom:8px;padding:8px 0;animation:.2s ease-out more-slide-up;display:flex;position:absolute;bottom:100%;right:0;box-shadow:0 12px 32px #0009}@keyframes more-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.more-popup-title{text-transform:uppercase;letter-spacing:.5px;color:#fff6;border-bottom:1px solid #ffffff0d;margin-bottom:4px;padding:6px 14px;font-size:.75rem;font-weight:700}.more-item{color:#fffc;text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:10px 14px;font-size:.88rem;transition:all .2s;display:flex}@media (hover:hover){.more-item:hover{background:var(--color-primary-transparent);color:#fff}}.more-item.item-active{color:var(--color-primary);font-weight:600}.np-cover-flipper{perspective:1000px;aspect-ratio:1;cursor:pointer;flex-shrink:0;width:calc(100% - 50px);height:auto;margin-top:32px;position:relative}.np-cover-flipper-inner{text-align:center;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.np-cover-flipper.flipped .np-cover-flipper-inner{transform:rotateY(-180deg)}.np-cover-front,.np-cover-back{backface-visibility:hidden;border-radius:24px;width:100%;height:100%;position:absolute;overflow:hidden}.np-cover-front{z-index:2;justify-content:center;align-items:center;display:flex}.np-cover-back{-webkit-backdrop-filter:blur(24px)saturate(1.2);backdrop-filter:blur(24px)saturate(1.2);box-shadow:none;z-index:1;background:#16161ce6;border:1px solid #ffffff0d;flex-direction:column;justify-content:center;align-items:center;display:flex;transform:rotateY(-180deg)}.track-details-card.center-aligned{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:24px;display:flex}.details-list{flex-direction:column;gap:14px;width:100%;display:flex}.detail-entry{border-bottom:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding-bottom:8px;font-size:.88rem;display:flex}.detail-entry:last-child{border-bottom:none;padding-bottom:0}.detail-prop{color:#ffffff73;font-weight:500}.detail-val{color:#fff;font-family:JetBrains Mono,Courier New,monospace;font-size:.85rem;font-weight:600}@media (width<=768px){.queue-popup,.sleep-popup,.more-popup{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-sizing:border-box;flex-direction:column;display:flex;transform:translateY(100%);z-index:9999!important;width:100%!important;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))!important;background:#121216fa!important;border:1px solid #ffffff0d!important;border-radius:24px 24px 0 0!important;margin:0!important;animation:.35s cubic-bezier(.25,1,.5,1) forwards sheet-slide-up!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important;box-shadow:0 -10px 40px #000c!important}@keyframes sheet-slide-up{to{transform:translateY(0)}}.queue-popup{height:75vh!important}.sleep-popup,.more-popup{height:auto!important;max-height:50vh!important;padding:10px 0 20px!important}.bottom-sheet-drag-handle{background:#fff3;border-radius:2px;flex-shrink:0;width:40px;height:4px;margin:6px auto 12px}.queue-popup-hdr,.sleep-popup-title,.more-popup-title{text-align:center;color:#fff!important;text-transform:none!important;border-bottom:none!important;margin-bottom:12px!important;padding:0!important;font-size:1rem!important;font-weight:800!important}.queue-popup-list{box-sizing:border-box;flex:1;width:100%;padding:0 16px!important;overflow-y:auto!important}.queue-item{border-bottom:1px solid #ffffff08;padding:14px 8px!important}.more-item,.sleep-item{border-bottom:1px solid #ffffff08;padding:14px 24px!important;font-size:.95rem!important}.np-close-chevron,.npp-header-spacer{display:flex!important}}@media (width>=769px){.np-cover-flipper{width:280px;margin:10px auto}}.np-pager-viewport{width:100%;position:relative}.np-pager-rail{align-items:center;display:flex}.np-pager-card{justify-content:center;align-items:center;display:flex}@media (width<=768px){.np-pager-viewport{touch-action:pan-y;overflow:visible}.np-pager-rail{will-change:transform;--card-w:85vw;--card-gap:16px;--peek:calc((100vw - var(--card-w)) / 2);--base-x:calc(var(--peek) - (var(--card-w) + var(--card-gap)));transform:translate3d(var(--base-x), 0, 0);flex-direction:row;gap:16px}.np-pager-card{will-change:transform, opacity;flex:0 0 85%;width:85%;min-width:0}.np-pager-card .np-squircle-cover-wrapper,.np-pager-card .np-cover-flipper{aspect-ratio:1;width:min(100%,48vh);height:auto}.np-pager-card:first-child .np-squircle-cover-wrapper,.np-pager-card:last-child .np-squircle-cover-wrapper{box-shadow:none}}.np-pager-card-empty{aspect-ratio:1;width:100%}@media (width>=769px){.np-pager-viewport{margin-top:75px;margin-bottom:-15px;overflow:visible}.np-pager-rail{justify-content:center}.np-pager-card{width:auto;display:none}.np-pager-card:nth-child(2){display:flex}.np-pager-card .np-squircle-cover-wrapper,.np-pager-card .np-cover-flipper{width:320px;margin:10px auto}}.upload-modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:9999;background:#000000b8;justify-content:center;align-items:center;padding:16px;animation:.2s um-fade-in;display:flex;position:fixed;inset:0}@keyframes um-fade-in{0%{opacity:0}to{opacity:1}}.upload-modal{background:var(--surface-2,#1a1a2e);border:1px solid #ffffff14;border-radius:20px;flex-direction:column;width:100%;max-width:460px;max-height:90vh;animation:.28s cubic-bezier(.19,1,.22,1) um-slide-up;display:flex;overflow:hidden;box-shadow:0 32px 80px #0009}@keyframes um-slide-up{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}.upload-modal-header{border-bottom:1px solid #ffffff0f;flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 20px 14px;display:flex}.upload-modal-title{color:var(--text-primary,#fff);align-items:center;gap:10px;font-size:.95rem;font-weight:600;display:flex}.upload-title-icon{color:var(--color-primary,#a038ff);font-size:1.2rem}.upload-close-btn{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;font-size:1rem;transition:color .2s,background .2s;display:flex}.upload-close-btn:hover{color:var(--text-primary,#fff);background:#ffffff14}.upload-modal-body{scrollbar-width:none;flex-direction:column;flex:1;gap:14px;padding:16px 20px;display:flex;overflow-y:auto}.upload-modal-body::-webkit-scrollbar{display:none}.upload-dropzone{cursor:pointer;background:#ffffff05;border:2px dashed #ffffff1f;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;padding:28px 20px;transition:border-color .2s,background .2s;display:flex}.upload-dropzone.compact{border-radius:10px;padding:12px 20px}.upload-dropzone:hover,.upload-dropzone.drag-over{border-color:var(--color-primary,#a038ff);background:#a038ff0f}.upload-dropzone-hint{flex-direction:column;align-items:center;gap:5px;display:flex}.upload-drop-icon{color:var(--color-primary,#a038ff);opacity:.7;margin-bottom:4px;font-size:2.2rem}.upload-drop-text{color:var(--text-primary,#fff);font-size:.92rem;font-weight:600}.upload-drop-sub{color:var(--text-tertiary,#888);font-size:.78rem}.upload-drop-formats{color:var(--text-tertiary,#888);letter-spacing:.04em;margin-top:4px;font-size:.7rem}.upload-add-more{color:var(--color-primary,#a038ff);opacity:.8;align-items:center;gap:8px;font-size:.82rem;font-weight:500;display:flex}.upload-file-list{flex-direction:column;gap:8px;display:flex}.upload-summary-bar{justify-content:space-between;align-items:center;display:flex}.upload-summary-text{color:var(--text-secondary,#bbb);letter-spacing:.02em;font-size:.78rem;font-weight:600}.upload-clear-all{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:2px 6px;font-size:.74rem;transition:color .2s,background .2s}.upload-clear-all:hover{color:#ff6060;background:#ff505014}.upload-file-rows{scrollbar-width:thin;scrollbar-color:#ffffff14 transparent;flex-direction:column;gap:6px;max-height:260px;display:flex;overflow-y:auto}.upload-file-row{background:#ffffff08;border:1px solid #ffffff0f;border-radius:10px;align-items:center;gap:10px;padding:9px 12px;transition:background .2s;display:flex}.upload-file-row.done{background:#4ade800a;border-color:#4ade8033}.upload-file-row.error{background:#ff50500a;border-color:#ff505033}.upload-file-row.uploading{background:#a038ff0d;border-color:#a038ff4d}.file-status-icon{flex-shrink:0;font-size:1rem}.file-status-icon.done{color:#4ade80}.file-status-icon.error{color:#ff6060}.file-status-icon.uploading{color:var(--color-primary,#a038ff)}.file-status-icon.pending{color:#ffffff40}@keyframes spin{to{transform:rotate(360deg)}}.upload-file-row-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.upload-file-name{color:var(--text-primary,#fff);white-space:nowrap;text-overflow:ellipsis;font-size:.82rem;font-weight:500;overflow:hidden}.upload-file-size{color:var(--text-tertiary,#888);font-size:.7rem}.upload-file-error{color:#ff8080;font-size:.7rem}.upload-row-progress-track{background:#ffffff14;border-radius:99px;height:3px;overflow:hidden}.upload-row-progress-fill{background:linear-gradient(90deg, var(--color-primary,#a038ff), #c86aff);border-radius:99px;height:100%;transition:width .15s}.upload-row-pct{color:var(--color-primary,#a038ff);text-align:right;flex-shrink:0;min-width:34px;font-size:.7rem;font-weight:700}.upload-file-remove{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;align-items:center;padding:3px 5px;font-size:.75rem;transition:color .2s,background .2s;display:flex}.upload-file-remove:hover{color:#f44;background:#ff44441a}.upload-secret-row{flex-direction:column;flex-shrink:0;gap:6px;display:flex}.upload-secret-label{letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary,#888);font-size:.75rem;font-weight:600}.upload-secret-input{color:var(--text-primary,#fff);box-sizing:border-box;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;outline:none;width:100%;padding:10px 14px;font-size:.88rem;transition:border-color .2s}.upload-secret-input:focus{border-color:var(--color-primary,#a038ff)}.upload-secret-input.input-error{border-color:#ff6060}.upload-secret-input:disabled{opacity:.5}.upload-secret-input::placeholder{color:var(--text-tertiary,#888);font-size:.8rem}.upload-modal-footer{border-top:1px solid #ffffff0f;flex-shrink:0;justify-content:flex-end;gap:10px;padding:14px 20px 18px;display:flex}.upload-btn-ghost{color:var(--text-secondary,#bbb);cursor:pointer;background:0 0;border:1px solid #ffffff1a;border-radius:10px;padding:10px 18px;font-size:.88rem;font-weight:500;transition:background .2s,color .2s}.upload-btn-ghost:hover{color:var(--text-primary,#fff);background:#ffffff0f}.upload-btn-primary{background:var(--color-primary,#a038ff);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:10px;padding:10px 22px;font-size:.88rem;font-weight:600;transition:opacity .2s,transform .15s}.upload-btn-primary:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.upload-btn-primary:disabled{opacity:.4;cursor:not-allowed}.upload-bg-note{color:var(--text-secondary,#bbb);background:#a038ff14;border:1px solid #a038ff2e;border-radius:10px;align-items:flex-start;gap:8px;padding:10px 14px;font-size:.78rem;line-height:1.5;display:flex}.upload-secret-error{color:#ff6060;margin-top:-2px;font-size:.74rem}.upload-file-emoji{flex-shrink:0;font-size:1.1rem}.upload-indicator-root{align-items:center;display:flex;position:relative}.upload-indicator-btn{cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;margin-right:6px;transition:transform .18s,box-shadow .18s,background .2s;display:flex;position:relative}.upload-indicator-btn.active{background:#a038ff2e;box-shadow:0 0 0 1px #a038ff4d}.upload-indicator-btn.idle{background:#ffffff0f}.upload-indicator-btn:hover{transform:scale(1.1)}.ui-btn-icon{color:var(--color-primary,#a038ff);font-size:1.05rem}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-slow{animation:1.8s linear infinite spin-slow}.ui-badge{background:var(--color-primary,#a038ff);color:#fff;border:1.5px solid var(--bg-main,#0a0a0e);letter-spacing:0;border-radius:99px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:0 3px;font-size:.58rem;font-weight:800;display:flex;position:absolute;top:-3px;right:-3px}.ui-badge.error{background:#f44}.ui-badge.done{color:#000;background:#4ade80}.ui-panel{z-index:9000;background:#120f23fa;border:1px solid #ffffff17;border-radius:16px;flex-direction:column;width:320px;max-height:420px;animation:.2s cubic-bezier(.19,1,.22,1) ui-drop-in;display:flex;position:absolute;top:calc(100% + 10px);right:0;overflow:hidden;box-shadow:0 24px 64px #0009}@keyframes ui-drop-in{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.ui-panel-header{border-bottom:1px solid #ffffff0f;flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.ui-panel-title{color:var(--text-secondary,#bbb);letter-spacing:.02em;font-size:.8rem;font-weight:700}.ui-panel-actions{align-items:center;gap:6px;display:flex}.ui-clear-btn{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:3px 7px;font-size:.72rem;transition:color .2s,background .2s}.ui-clear-btn:hover{color:#fff;background:#ffffff14}.ui-close-panel-btn{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px;font-size:.8rem;transition:color .2s;display:flex}.ui-close-panel-btn:hover{color:#fff}.ui-item-list{scrollbar-width:thin;scrollbar-color:#ffffff12 transparent;flex:1;padding:8px 0;overflow-y:auto}.ui-empty{text-align:center;color:var(--text-tertiary,#888);padding:20px;font-size:.8rem}.ui-item{align-items:center;gap:10px;padding:8px 14px;transition:background .15s;display:flex}.ui-item:hover{background:#ffffff08}.ui-item.uploading{background:#a038ff0a}.ui-item.done{opacity:.7}.ui-row-icon{flex-shrink:0;font-size:.95rem}.ui-row-icon.done{color:#4ade80}.ui-row-icon.error{color:#ff6060}.ui-row-icon.uploading{color:var(--color-primary,#a038ff)}.ui-row-icon.pending{color:#fff3}.spin{animation:1s linear infinite spin}.ui-item-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.ui-item-name{color:var(--text-primary,#fff);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;font-weight:500;overflow:hidden}.ui-item-size,.ui-item-error{font-size:.68rem}.ui-item-size{color:var(--text-tertiary,#888)}.ui-item-error{color:#ff8080}.ui-item-progress-track{background:#ffffff14;border-radius:99px;height:3px;overflow:hidden}.ui-item-progress-fill{background:linear-gradient(90deg, var(--color-primary,#a038ff), #c86aff);border-radius:99px;height:100%;transition:width .15s}.ui-item-pct{color:var(--color-primary,#a038ff);text-align:right;flex-shrink:0;min-width:30px;font-size:.68rem;font-weight:700}.ui-item-remove{color:#fff3;cursor:pointer;background:0 0;border:none;border-radius:5px;flex-shrink:0;padding:3px;font-size:.7rem;transition:color .2s;display:flex}.ui-item-remove:hover{color:#f44}@media (width<=480px){.ui-panel{top:auto;bottom:calc(var(--player-height,64px) + 60px + env(safe-area-inset-bottom,0px) + 20px);z-index:9999;width:auto;position:fixed;left:12px;right:12px}}.cf-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:9999;background:#000000b3;justify-content:center;align-items:center;padding:16px;animation:.2s cf-fade-in;display:flex;position:fixed;inset:0}@keyframes cf-fade-in{0%{opacity:0}to{opacity:1}}.cf-modal{background:#120e20fa;border:1px solid #ffffff14;border-radius:20px;width:100%;max-width:400px;animation:.26s cubic-bezier(.19,1,.22,1) cf-slide-up;overflow:hidden;box-shadow:0 32px 80px #000000a6}@keyframes cf-slide-up{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.cf-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:18px 20px 14px;display:flex}.cf-title{color:var(--text-primary,#fff);align-items:center;gap:10px;font-size:.95rem;font-weight:700;display:flex}.cf-title-icon{color:var(--color-primary,#a038ff);font-size:1.15rem}.cf-close-btn{color:var(--text-tertiary,#888);cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;padding:6px;font-size:1rem;transition:color .2s,background .2s;display:flex}.cf-close-btn:hover{color:var(--text-primary,#fff);background:#ffffff14}.cf-body{flex-direction:column;gap:8px;padding:18px 20px;display:flex}.cf-label{letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary,#888);margin-top:4px;font-size:.74rem;font-weight:600}.cf-input{color:var(--text-primary,#fff);box-sizing:border-box;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;outline:none;width:100%;padding:11px 14px;font-size:.9rem;transition:border-color .2s}.cf-input:focus{border-color:var(--color-primary,#a038ff)}.cf-input:disabled{opacity:.5}.cf-input::placeholder{color:var(--text-tertiary,#888)}.cf-error{color:#ff8080;background:#ff44441a;border:1px solid #f443;border-radius:8px;margin-top:4px;padding:9px 12px;font-size:.8rem}.cf-success{color:#4ade80;background:#4ade8014;border:1px solid #4ade8033;border-radius:8px;margin-top:4px;padding:9px 12px;font-size:.82rem}.cf-footer{border-top:1px solid #ffffff0f;justify-content:flex-end;gap:10px;padding:14px 20px 18px;display:flex}.cf-btn-ghost{color:var(--text-secondary,#bbb);cursor:pointer;background:0 0;border:1px solid #ffffff1a;border-radius:10px;padding:10px 18px;font-size:.88rem;font-weight:500;transition:background .2s,color .2s}.cf-btn-ghost:hover{color:var(--text-primary,#fff);background:#ffffff0f}.cf-btn-primary{background:var(--color-primary,#a038ff);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px 22px;font-size:.88rem;font-weight:600;transition:opacity .2s,transform .15s}.cf-btn-primary:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.cf-btn-primary:disabled{opacity:.4;cursor:not-allowed}.settings-view{width:100%;padding:32px 24px 100px;animation:.3s ease-out fadeIn}.settings-container{flex-direction:column;gap:24px;max-width:900px;margin:0 auto;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.settings-header{margin-bottom:8px}.settings-title{letter-spacing:-.5px;color:var(--text-primary);margin-bottom:6px;font-size:1.85rem;font-weight:800}.settings-subtitle{color:var(--text-secondary);font-size:.9rem}.user-overview-card{border-radius:var(--radius-xl);align-items:center;gap:20px;display:flex;background:linear-gradient(135deg,#a038ff1f 0%,#1e1e28b3 100%)!important;border:1px solid #a038ff40!important;padding:24px 28px!important}.user-overview-avatar{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:68px;height:68px;font-size:1.5rem;font-weight:800;display:flex;box-shadow:0 4px 20px #a038ff66}.user-overview-info{flex:1;min-width:0}.user-overview-name-row{align-items:center;gap:12px;margin-bottom:6px;display:flex}.user-overview-name{color:var(--text-primary);font-size:1.35rem;font-weight:700}.user-badge{border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:4px;padding:3px 10px;font-size:.72rem;font-weight:600;display:inline-flex}.user-badge.verified{color:#4ade80;background:#22c55e26;border:1px solid #22c55e4d}.badge-icon{font-size:.75rem}.user-overview-meta{color:var(--text-secondary);flex-wrap:wrap;gap:16px;font-size:.85rem;display:flex}.meta-item{align-items:center;gap:6px;display:inline-flex}.settings-logout-btn-header{border-radius:var(--radius-md);border:1px solid var(--border-card);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff14;flex-shrink:0;align-items:center;gap:8px;padding:10px 18px;font-size:.85rem;font-weight:600;display:inline-flex}.settings-logout-btn-header:hover{color:#f87171;background:#ef444426;border-color:#ef44444d}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:20px;display:grid}.settings-card{background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-card);flex-direction:column;padding:24px;display:flex}.card-header{align-items:center;gap:14px;margin-bottom:20px;display:flex}.card-icon-wrap{border-radius:var(--radius-md);width:40px;height:40px;color:var(--color-primary-light);background:#a038ff1f;flex-shrink:0;justify-content:center;align-items:center;font-size:1.15rem;display:flex}.card-icon-wrap.danger{color:#f87171;background:#ef44441f}.card-title{color:var(--text-primary);margin-bottom:2px;font-size:1.05rem;font-weight:700}.card-desc{color:var(--text-tertiary);font-size:.78rem}.settings-form{flex-direction:column;flex:1;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.78rem;font-weight:600}.form-group input{background:var(--bg-elevated);border:1.5px solid var(--border-card);border-radius:var(--radius-md);color:var(--text-primary);transition:all var(--transition-fast);outline:none;padding:11px 14px;font-family:inherit;font-size:.9rem}.form-group input:focus{border-color:var(--color-primary);background:var(--bg-highlight);box-shadow:0 0 0 3px #a038ff26}.form-group input.input-disabled{opacity:.6;cursor:not-allowed;background:#0003}.field-hint{color:var(--text-tertiary);font-size:.72rem}.password-input-wrap{align-items:center;display:flex;position:relative}.password-input-wrap input{width:100%;padding-right:42px}.pwd-toggle{color:var(--text-tertiary);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:.9rem;display:flex;position:absolute;right:12px}.pwd-toggle:hover{color:var(--text-primary)}.status-banner{border-radius:var(--radius-md);align-items:center;gap:10px;padding:10px 14px;font-size:.82rem;font-weight:500;animation:.2s ease-out bannerIn;display:flex}@keyframes bannerIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.status-banner.success{color:#4ade80;background:#22c55e1f;border:1px solid #22c55e4d}.status-banner.error{color:#f87171;background:#ef44441f;border:1px solid #ef44444d}.form-actions{margin-top:auto;padding-top:8px}.btn-primary{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);color:#fff;cursor:pointer;transition:all var(--transition-fast);border:none;justify-content:center;align-items:center;min-height:42px;padding:11px 22px;font-size:.88rem;font-weight:600;display:inline-flex;box-shadow:0 4px 14px #a038ff4d}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #a038ff73}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-danger{border-radius:var(--radius-md);color:#f87171;cursor:pointer;transition:all var(--transition-fast);background:#ef444426;border:1px solid #ef44444d;justify-content:center;align-items:center;gap:8px;padding:11px 22px;font-size:.88rem;font-weight:600;display:inline-flex}.btn-danger:hover{color:#fff;background:#ef444440;border-color:#ef444480}.btn-secondary{border-radius:var(--radius-md);background:var(--bg-elevated);border:1px solid var(--border-card);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;padding:11px 22px;font-size:.88rem;font-weight:600;display:inline-flex}.btn-secondary:hover{background:var(--bg-highlight)}.settings-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.7s linear infinite spinnerRotate}@keyframes spinnerRotate{to{transform:rotate(360deg)}}.stats-list{flex-direction:column;gap:12px;display:flex}.stat-row{background:var(--bg-elevated);border-radius:var(--radius-md);border:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:12px 14px;font-size:.86rem;display:flex}.stat-label{color:var(--text-secondary);align-items:center;gap:8px;display:inline-flex}.stat-value{color:var(--text-primary);font-weight:600}.stat-value.highlight{color:var(--color-primary-light);font-size:.82rem}.session-info-text{color:var(--text-secondary);margin-bottom:20px;font-size:.85rem;line-height:1.6}.settings-modal-backdrop{-webkit-backdrop-filter:blur(12px);z-index:10000;background:#000000bf;justify-content:center;align-items:center;padding:20px;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.settings-modal{border-radius:var(--radius-xl);text-align:center;background:#181822;border:1px solid #ffffff1a;width:100%;max-width:400px;padding:32px 28px;animation:.25s cubic-bezier(.16,1,.3,1) modalScale;box-shadow:0 16px 48px #000c}@keyframes modalScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-icon-danger{color:#f87171;background:#ef444426;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:16px;font-size:1.4rem;display:inline-flex}.modal-title{color:var(--text-primary);margin-bottom:8px;font-size:1.25rem;font-weight:700}.modal-text{color:var(--text-secondary);margin-bottom:24px;font-size:.88rem;line-height:1.5}.modal-actions{justify-content:center;gap:12px;display:flex}.modal-actions button{flex:1}@media (width<=640px){.settings-view{padding:20px 14px 120px}.user-overview-card{text-align:center;flex-direction:column;padding:20px 16px!important}.user-overview-name-row,.user-overview-meta{justify-content:center}.settings-logout-btn-header{justify-content:center;width:100%;margin-top:8px}.settings-grid{grid-template-columns:1fr}}.main-view{background:0 0;flex-direction:column;grid-area:main;height:100dvh;display:flex;position:relative;overflow:hidden}.mv-topbar{align-items:center;padding:16px 16px 8px;display:flex}.mv-nav-arrows{gap:8px;display:flex}.nav-arrow-btn{background:var(--bg-card);width:28px;height:28px;color:var(--text-secondary);border:1px solid var(--border-subtle);transition:background var(--transition-fast), color var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;font-size:.75rem;display:flex}@media (hover:hover){.nav-arrow-btn:hover{background:var(--bg-elevated);color:var(--text-primary)}}.mv-spacer{flex:1}.topbar-settings-btn{background:var(--bg-card);width:34px;height:34px;color:var(--text-secondary);border:1px solid var(--border-subtle);cursor:pointer;transition:all var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;margin-left:10px;font-size:.95rem;display:flex}.topbar-settings-btn:hover,.topbar-settings-btn.active{color:var(--color-primary-light);background:#a038ff26;border-color:#a038ff4d}.mv-scroll{scrollbar-width:none;flex:1;padding:0 16px 80px;overflow-y:auto}.mv-scroll::-webkit-scrollbar{display:none}@media (width<=768px){.mv-scroll{padding-bottom:160px}}.recent-section{margin-bottom:24px}.section-subtitle{color:var(--text-primary);margin-bottom:12px;font-size:1.05rem;font-weight:700}:root{--recent-size:160px}.recent-grid{scrollbar-width:none;gap:16px;margin:0 -32px;padding:8px 32px;display:flex;overflow-x:auto}@media (width<=768px){.recent-grid{margin:0 -16px;padding:8px 16px}}.home-search-mobile{display:none}@media (width<=768px){.home-search-mobile{background:#ffffff0d;border:1px solid #ffffff14;border-radius:14px;align-items:center;gap:12px;margin-bottom:24px;padding:12px 16px;transition:background .2s;display:flex;position:relative}.home-search-mobile:focus-within{border-color:var(--color-primary);background:#ffffff12}.home-search-mobile input{color:#fff;background:0 0;border:none;outline:none;flex:1;font-size:1rem}.hs-icon{color:#fff6;font-size:1.2rem}}.recent-grid::-webkit-scrollbar{display:none}.recent-card{width:var(--recent-size);cursor:pointer;flex-shrink:0;transition:transform .2s}@media (hover:hover){.recent-card:hover{transform:translateY(-4px)}}.recent-cover-wrap{width:var(--recent-size);height:var(--recent-size);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);margin-bottom:8px;overflow:hidden;box-shadow:0 6px 16px #0006}.recent-cover{object-fit:cover;width:100%;height:100%}.recent-cover.placeholder{background:var(--bg-card);color:var(--text-tertiary);justify-content:center;align-items:center;font-size:1.8rem;display:flex}.recent-track-info{flex-direction:column;display:flex}.recent-title{color:var(--text-primary);font-size:.85rem;font-weight:600}.recent-artist{color:var(--text-tertiary);margin-top:2px;font-size:.72rem}.folder-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;margin-bottom:24px;display:grid}.folder-card{cursor:pointer;background:#18181b;border:1px solid #ffffff0a;border-radius:12px;flex-direction:column;align-items:flex-start;gap:10px;padding:12px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}@media (hover:hover){.folder-card:hover{background:#202024;border-color:#ffffff1a;transform:translateY(-6px);box-shadow:0 12px 30px #0009}}.folder-icon{aspect-ratio:1;color:#fff;background:linear-gradient(135deg,#a038ff 0%,#6038ff 100%);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:100%;font-size:1.6rem;transition:transform .3s;display:flex;box-shadow:0 4px 12px #a038ff40}.folder-card:hover .folder-icon{transform:scale(1.05)}.folder-icon img{object-fit:cover;border-radius:8px;width:100%;height:100%}.folder-info{flex-direction:column;width:100%;display:flex}.folder-name{color:#fff;margin-bottom:2px;font-size:.85rem;font-weight:700}.folder-count{color:#ffffff80;font-size:.78rem;font-weight:500}.trending-section{margin-bottom:24px}.trending-label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px;font-size:.72rem}.trending-title-row,.playlist-title-row{justify-content:space-between;align-items:baseline;margin-bottom:14px;display:flex}.trending-title,.playlist-title{letter-spacing:-.5px;font-size:1.6rem;font-weight:800}.more-btn{color:var(--text-secondary);transition:color var(--transition-fast);font-size:.8rem;font-weight:500}@media (hover:hover){.more-btn:hover{color:var(--text-primary)}}.hero-card{background-position:50%;background-size:cover;border-radius:16px;flex-direction:column;justify-content:flex-end;width:100%;height:200px;padding:20px;display:flex;position:relative;overflow:hidden}.hero-overlay{background:linear-gradient(90deg,#0a051ed9 0%,#0a051e4d 100%);position:absolute;inset:0}.hero-meta,.hero-big-title,.hero-actions{z-index:1;position:relative}.hero-meta{color:#ffffffa6;justify-content:space-between;margin-bottom:8px;font-size:.75rem;display:flex}.hero-listeners{align-items:center;display:flex}.hero-big-title{letter-spacing:-1px;white-space:pre-line;margin-bottom:16px;font-size:1.8rem;font-weight:900;line-height:1.1}.hero-actions{gap:12px;display:flex}.hero-play-btn{background:var(--accent-primary);color:#fff;transition:transform var(--transition-bounce), background var(--transition-fast);border-radius:20px;align-items:center;gap:8px;padding:8px 20px;font-size:.85rem;font-weight:700;display:flex}@media (hover:hover){.hero-play-btn:hover{background:var(--accent-hover);transform:scale(1.04)}}.hero-follow-btn{color:#fff;transition:background var(--transition-fast);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff1a;border:1px solid #ffffff40;border-radius:20px;padding:8px 20px;font-size:.85rem;font-weight:600}@media (hover:hover){.hero-follow-btn:hover{background:#941f1f33}}.playlist-section{margin-bottom:8px}.track-loading,.track-error,.track-empty{text-align:center;color:var(--text-secondary);padding:32px 0;font-size:.9rem}.track-error{color:#e8315f}.loading-spinner{border:3px solid var(--bg-highlight);border-top-color:var(--color-primary);border-radius:50%;width:28px;height:28px;margin:0 auto 12px;animation:.8s linear infinite spin}.track-skeleton-list{flex-direction:column;gap:6px;padding:8px 0;display:flex}.track-skeleton-row{border-radius:var(--radius-sm);align-items:center;gap:12px;padding:8px 10px;display:flex}.track-skeleton-num{border-radius:4px;flex-shrink:0;width:32px;height:14px}.track-skeleton-cover{border-radius:var(--radius-sm);flex-shrink:0;width:36px;height:36px}.track-skeleton-info{flex-direction:column;flex:1;gap:6px;display:flex}.track-skeleton-title{border-radius:4px;width:55%;height:13px}.track-skeleton-artist{border-radius:4px;width:35%;height:11px}.track-skeleton-duration{border-radius:4px;flex-shrink:0;width:36px;height:12px}.track-table{border-collapse:collapse;table-layout:fixed;width:100%}.track-table-hdr th{letter-spacing:1.5px;color:var(--text-tertiary);text-align:left;border-bottom:1px solid var(--border-subtle);padding:6px 10px;font-size:.65rem;font-weight:700}.track-table-hdr th:first-child{width:50px}.track-table-hdr th:nth-child(2){width:40%}.track-table-hdr th:nth-child(3){width:160px}.track-table-hdr th:nth-child(4){width:35%}.track-table-hdr th:nth-child(5){text-align:right;width:60px}.track-table-hdr th:nth-child(6){text-align:center;width:40px}.track-row{cursor:pointer;transition:background var(--transition-fast);border-radius:8px}@media (hover:hover){.track-row:hover{background:var(--bg-card)}}.track-row.row-active{background:var(--bg-row-active)!important}.track-row td{vertical-align:middle;color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;padding:10px;font-size:.875rem;overflow:hidden}.td-add-queue{text-align:center;width:40px;color:var(--text-tertiary);cursor:pointer;transition:color var(--transition-fast)}@media (hover:hover){.td-add-queue:hover{color:var(--text-primary)}}.td-num{width:50px;color:var(--text-tertiary);font-size:.8rem}.td-num-content{justify-content:center;align-items:center;width:100%;display:flex}.td-title{width:45%}.td-quality{width:110px}.td-artist{width:35%}.td-time{width:50px;color:var(--text-tertiary);text-align:right}.td-album{width:140px;color:var(--text-tertiary)}.active-num{color:var(--color-primary);font-weight:700}.row-play-icon{color:var(--text-secondary);font-size:.75rem;transform:translateY(2px)}.rp-active{color:var(--color-primary)}.title-cell{align-items:center;gap:12px;min-width:0;display:flex}.track-cover-mini{object-fit:cover;width:36px;height:36px;color:var(--text-tertiary);background:#ffffff0d;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;display:flex}.track-cover-mini.placeholder{border:1px dashed #ffffff1a}.track-title-text{color:var(--text-secondary);max-width:220px;font-weight:500}.track-artist-sub{display:none}.text-active{color:var(--text-primary)}.format-badge{color:var(--color-primary-light);text-transform:uppercase;letter-spacing:.3px;background:#a038ff1a;border:1px solid #a038ff40;border-radius:4px;flex-shrink:0;padding:2px 5px;font-size:.6rem;font-weight:800}.quality-cell{align-items:center;gap:8px;display:flex}.quality-text{color:var(--text-tertiary);letter-spacing:.2px;font-size:.65rem;font-weight:500}.equaliser{flex-shrink:0;align-items:flex-end;gap:2px;height:13px;display:flex;transform:translateY(-1px)}.equaliser span{background:var(--color-primary);border-radius:2px;width:3px;animation:.8s ease-in-out infinite eq;display:block}.equaliser span:first-child{height:60%;animation-delay:0s}.equaliser span:nth-child(2){height:100%;animation-delay:.15s}.equaliser span:nth-child(3){height:40%;animation-delay:.3s}@keyframes eq{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}.mobile-menu-btn{color:var(--text-primary);cursor:pointer;background:0 0;border:none;margin-right:4px;padding:10px;font-size:1.2rem;display:none}.mobile-logo-text{color:#fff;letter-spacing:-.1px;align-items:center;font-size:1.25rem;font-weight:800;display:none}@media (width<=768px){.mobile-menu-btn,.mobile-logo-text{display:flex}.mv-topbar{padding:calc(24px + env(safe-area-inset-top,0px)) 16px 12px}.main-page-title{display:none!important}.playlist-title-row:not(.main-page-title){margin-bottom:16px;display:flex!important}.playlist-title{font-size:1.3rem;font-weight:700}.track-table-hdr th:nth-child(3),.track-table-hdr th:nth-child(5),.track-row td:nth-child(3),.track-row td:nth-child(5){display:none}.folder-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:12px}.nav-arrow-btn{display:none!important}.track-table{flex-direction:column;gap:4px;width:100%;display:flex}.track-table thead{display:none!important}.track-table tbody{flex-direction:column;gap:2px;width:100%;display:flex}.track-row{cursor:pointer;box-sizing:border-box;border-bottom:none;align-items:center;gap:2px;width:100%;padding:5px;display:flex}.td-num,.td-artist,.td-add-queue{display:none!important}.td-title{flex:1;align-items:center;min-width:0;padding:0;display:flex}.title-cell{align-items:center;gap:12px;width:100%;display:flex}.track-cover-mini{align-items:left;object-fit:cover!important;border-radius:8px!important;flex-shrink:0!important;width:48px!important;height:48px!important}.title-text-group{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.track-title-text{color:#fff;white-space:nowrap;text-overflow:ellipsis;width:100%;font-size:.98rem;font-weight:500;line-height:1.3;overflow:hidden;max-width:100%!important;display:block!important}.track-artist-sub{white-space:nowrap;text-overflow:ellipsis;width:100%;font-size:.8rem;font-weight:400;display:block;overflow:hidden;color:#fff9!important;display:block!important}.td-quality,.td-time{display:none!important}.td-item-more-mob{color:#ffffff80;justify-content:center;align-items:center;margin-left:auto;padding-left:10px;font-size:.95rem;display:flex!important}}.td-item-more-mob{display:none}.playlist-picker-popup{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);z-index:300;flex-direction:column;width:180px;animation:.2s ease-out queue-slide-up;display:flex;position:absolute;bottom:calc(100% + 6px);right:0;overflow:hidden;box-shadow:0 8px 24px #000000b3}.playlist-picker-hdr{text-transform:uppercase;letter-spacing:.8px;color:var(--text-tertiary);border-bottom:1px solid var(--border-subtle);padding:8px 12px 6px;font-size:.68rem;font-weight:700}.playlist-picker-item{color:var(--text-secondary);text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:9px 12px;font-family:inherit;font-size:.83rem;transition:background .15s,color .15s;display:flex}@media (hover:hover){.playlist-picker-item:hover{color:var(--text-primary);background:#a038ff1f}}.playlist-picker-empty{color:var(--text-tertiary);padding:10px 12px;font-size:.78rem;font-style:italic}.search-view{padding:0}.folder-upload-btn{background:var(--color-primary,#a038ff);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;margin-left:auto;font-size:.85rem;transition:transform .18s,box-shadow .18s,opacity .18s;display:flex;box-shadow:0 4px 14px #a038ff66}.folder-upload-btn:hover{transform:scale(1.1);box-shadow:0 6px 20px #a038ff8c}.folder-upload-btn:active{opacity:.85;transform:scale(.95)}.folder-upload-bar{display:none}.folder-upload-count{color:var(--text-tertiary);font-size:.8rem;font-weight:500}@media (width>=769px){.folder-upload-bar{display:none}}.topbar-upload-btn{background:var(--color-primary,#a038ff);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;margin-left:8px;font-size:.85rem;transition:transform .18s,box-shadow .18s,opacity .18s;display:flex;box-shadow:0 4px 14px #a038ff66}.topbar-upload-btn:hover{transform:scale(1.1);box-shadow:0 6px 20px #a038ff8c}.topbar-upload-btn:active{opacity:.85;transform:scale(.95)}.folder-create-btn{background:var(--color-primary,#a038ff);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.88rem;transition:background .18s,transform .18s,box-shadow .18s;display:flex}.folder-create-btn:hover{background:var(--color-primary,#a038ff);color:#fff;transform:scale(1.1);box-shadow:0 4px 14px #a038ff66}.folder-create-btn:active{transform:scale(.95)}.desktop-player-only{width:100%}@media (width<=768px){.desktop-player-only{display:none!important}}.create-card{box-shadow:none!important;background:0 0!important;border:2px dashed #ffffff1a!important}.create-card:hover{border-color:var(--color-primary)!important;background:#a038ff0d!important}.create-icon{color:#ffffff4d!important;box-shadow:none!important;background:#ffffff08!important;border:1px dashed #fff3!important}.create-card:hover .create-icon{border-color:var(--color-primary)!important;color:var(--color-primary)!important;background:#a038ff1a!important}.mobile-nav-player{z-index:1000;pointer-events:none;background:0 0;flex-direction:column;transition:opacity .4s,transform .4s;display:none;position:fixed;bottom:0;left:0;right:0}.mobile-nav-player.panel-open{opacity:0;pointer-events:none;transform:translateY(20px)scale(.95)}.mobile-nav-player.panel-open *{pointer-events:none!important}@media (width<=768px){.mobile-nav-player{display:flex}}.mini-player{pointer-events:auto;background:#0a0a0e;border:1px solid #ffffff0d;border-radius:20px;justify-content:space-between;align-items:center;height:64px;margin:0 8px 8px;padding:0 12px;display:flex;box-shadow:0 8px 24px #3a393966}.mini-player-info{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.mini-player-cover-wrap{border-radius:8px;flex-shrink:0;width:44px;height:44px;overflow:hidden;box-shadow:0 4px 10px #0000004d}.mini-player-cover{object-fit:cover;width:100%;height:100%}.mini-player-text{flex-direction:column;min-width:0;display:flex}.mini-player-title{color:#fff;letter-spacing:-.2px;text-shadow:0 1px 2px #0000004d;font-size:.9rem;font-weight:700}.mini-player-artist{color:#ffffffa6;text-shadow:0 1px 2px #0003;font-size:.75rem;font-weight:500}.mini-player-controls{align-items:center;gap:16px;margin-left:12px;display:flex}.mini-skip-btn{color:#fff;opacity:.8;justify-content:center;align-items:center;font-size:1.1rem;display:flex}.mini-play-btn-wrap{justify-content:center;align-items:center;display:flex;position:relative}.mini-play-btn{background:var(--color-primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:transform .1s;display:flex;box-shadow:0 0 15px #a038ff80}.mini-play-btn:active{transform:scale(.92)}.mobile-bottom-nav{pointer-events:auto;height:60px;padding:0 12px;padding-bottom:env(safe-area-inset-bottom,0px);background:#000;border:1px solid #ffffff0d;border-bottom:none;border-radius:0;justify-content:space-around;align-items:center;display:flex;box-shadow:0 -10px 30px #0006}.nav-tab{color:#71717a;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;font-family:inherit;transition:color .2s;display:flex}.nav-tab svg{font-size:1.3rem}.nav-tab span{font-size:.65rem;font-weight:600}.nav-tab.active{color:var(--color-primary)}.mini-player.is-light .mini-player-title{color:#000;text-shadow:none}.mini-player.is-light .mini-player-artist{color:#0009;text-shadow:none}.mini-player.is-light .mini-skip-btn{color:#000;opacity:.7}.mini-player.is-light .mini-play-btn{background:var(--color-primary);color:#fff}.mini-player.is-light{border:1px solid #00000014;box-shadow:0 8px 24px #00000026}.login-screen{z-index:9999;background:#050508;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:hidden}.login-bg{position:absolute;inset:0;overflow:hidden}.login-bg-orb{filter:blur(100px);opacity:.5;will-change:transform;border-radius:50%;position:absolute}.login-bg-orb-1{background:radial-gradient(circle,#a038ff99 0%,#0000 70%);width:500px;height:500px;animation:12s ease-in-out infinite orbFloat1;top:-10%;left:-10%}.login-bg-orb-2{background:radial-gradient(circle,#581cc480 0%,#0000 70%);width:400px;height:400px;animation:15s ease-in-out infinite orbFloat2;bottom:-15%;right:-10%}.login-bg-orb-3{background:radial-gradient(circle,#c878ff59 0%,#0000 70%);width:300px;height:300px;animation:10s ease-in-out infinite orbFloat3;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes orbFloat1{0%,to{transform:translate(0)scale(1)}33%{transform:translate(60px,80px)scale(1.1)}66%{transform:translate(-40px,40px)scale(.95)}}@keyframes orbFloat2{0%,to{transform:translate(0)scale(1)}33%{transform:translate(-50px,-60px)scale(1.15)}66%{transform:translate(30px,-30px)scale(.9)}}@keyframes orbFloat3{0%,to{transform:translate(-50%,-50%)scale(1)}50%{transform:translate(-50%,-55%)scale(1.2)}}.login-particles{pointer-events:none;position:absolute;inset:0;overflow:hidden}.login-note{color:#a038ff26;font-size:2rem;animation:8s ease-in-out infinite noteFloat;position:absolute}.login-note-0{font-size:1.5rem;animation-delay:0s;top:20%;left:10%}.login-note-1{font-size:2.5rem;animation-delay:1.5s;top:15%;left:80%}.login-note-2{font-size:1.8rem;animation-delay:3s;top:70%;left:25%}.login-note-3{font-size:2rem;animation-delay:4.5s;top:65%;left:75%}.login-note-4{font-size:1.2rem;animation-delay:2s;top:10%;left:50%}.login-note-5{font-size:2.2rem;animation-delay:5s;top:80%;left:90%}@keyframes noteFloat{0%,to{opacity:.15;transform:translateY(0)rotate(0)}25%{opacity:.3;transform:translateY(-30px)rotate(10deg)}50%{opacity:.2;transform:translateY(-15px)rotate(-5deg)}75%{opacity:.25;transform:translateY(-25px)rotate(8deg)}}.login-card{z-index:10;-webkit-backdrop-filter:blur(40px)saturate(1.5);background:#14141cbf;border:1px solid #a038ff26;border-radius:24px;width:100%;max-width:420px;margin:16px;padding:40px 36px 32px;animation:.6s cubic-bezier(.16,1,.3,1) both cardIn;position:relative;box-shadow:0 0 0 1px #ffffff0a,0 8px 40px #00000080,0 0 120px -40px #a038ff40}@keyframes cardIn{0%{opacity:0;transform:translateY(30px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.login-card.shake{animation:.4s ease-in-out shakeCard}@keyframes shakeCard{0%,to{transform:translate(0)}20%{transform:translate(-10px)}40%{transform:translate(10px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.login-brand{text-align:center;margin-bottom:28px}.login-logo-circle{background:linear-gradient(135deg,#a038ff 0%,#7b1fd4 100%);border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:16px;animation:3s ease-in-out infinite alternate logoGlow;display:inline-flex;box-shadow:0 4px 20px #a038ff66}@keyframes logoGlow{0%{box-shadow:0 4px 20px #a038ff4d}to{box-shadow:0 4px 30px #a038ff99,0 0 60px #a038ff26}}.login-logo-icon{color:#fff;font-size:1.4rem}.login-title{color:#fff;letter-spacing:-.02em;margin-bottom:6px;font-size:1.75rem;font-weight:800}.login-subtitle{color:#ffffff80;font-size:.88rem;font-weight:400}.login-mode-toggle{background:#ffffff0f;border:1px solid #ffffff0f;border-radius:12px;margin-bottom:24px;padding:3px;display:flex;position:relative}.login-mode-btn{color:#ffffff73;z-index:2;cursor:pointer;background:0 0;border:none;border-radius:10px;flex:1;padding:10px 0;font-family:inherit;font-size:.85rem;font-weight:600;transition:color .25s;position:relative}.login-mode-btn.active{color:#fff}.login-mode-slider{z-index:1;background:#a038ff40;border:1px solid #a038ff4d;border-radius:10px;width:calc(50% - 3px);height:calc(100% - 6px);transition:transform .3s cubic-bezier(.34,1.56,.64,1);position:absolute;top:3px;left:3px}.login-mode-slider.right{transform:translate(100%)}.login-form{flex-direction:column;gap:16px;display:flex}.login-field{flex-direction:column;gap:6px;display:flex}.login-field label{color:#fff9;letter-spacing:.03em;text-transform:uppercase;font-size:.78rem;font-weight:600}.login-field input{color:#fff;background:#ffffff0f;border:1.5px solid #ffffff14;border-radius:12px;outline:none;width:100%;padding:12px 14px;font-family:inherit;font-size:.95rem;transition:border-color .2s,box-shadow .2s,background .2s}.login-field input::placeholder{color:#fff3}.login-field input:focus{background:#ffffff14;border-color:#a038ff80;box-shadow:0 0 0 3px #a038ff1a}.login-field.error input{border-color:#ff505080;box-shadow:0 0 0 3px #ff50501a}.login-field-error{color:#ff6b6b;font-size:.75rem;font-weight:500;animation:.2s ease-out fieldErrIn}@keyframes fieldErrIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.login-password-wrap{position:relative}.login-password-wrap input{width:100%;padding-right:44px}.login-password-toggle{color:#ffffff59;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;transition:color .15s,background .15s;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.login-password-toggle:hover{color:#ffffffb3;background:#ffffff0f}.login-server-error{color:#ff8a8a;background:#ff50501a;border:1px solid #ff505033;border-radius:10px;align-items:center;gap:8px;padding:10px 14px;font-size:.82rem;font-weight:500;animation:.3s ease-out fieldErrIn;display:flex}.login-submit-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#a038ff 0%,#7b1fd4 100%);border:none;border-radius:12px;justify-content:center;align-items:center;width:100%;min-height:48px;margin-top:4px;padding:13px 0;font-family:inherit;font-size:.95rem;font-weight:700;transition:transform .15s,box-shadow .25s,opacity .15s;display:flex;box-shadow:0 4px 20px #a038ff4d}.login-submit-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 28px #a038ff73}.login-submit-btn:active:not(:disabled){transform:translateY(0)scale(.98)}.login-submit-btn:disabled{opacity:.7;cursor:not-allowed}.login-spinner{border:2.5px solid #ffffff40;border-top-color:#fff;border-radius:50%;width:22px;height:22px;animation:.7s linear infinite spinnerRotate}.login-footer{text-align:center;color:#fff6;margin-top:20px;font-size:.82rem}.login-footer button{color:var(--color-primary,#a038ff);cursor:pointer;font-weight:600;font-size:inherit;background:0 0;border:none;font-family:inherit;text-decoration:none;transition:color .15s}.login-footer button:hover{color:var(--color-primary-light,#c47aff)}.login-loading-screen{z-index:9999;background:#050508;flex-direction:column;justify-content:center;align-items:center;gap:20px;display:flex;position:fixed;inset:0}.login-loading-logo{background:linear-gradient(135deg,#a038ff 0%,#7b1fd4 100%);border-radius:18px;justify-content:center;align-items:center;width:64px;height:64px;animation:2s ease-in-out infinite alternate logoGlow,1.5s ease-in-out infinite logoPulse;display:flex;box-shadow:0 4px 30px #a038ff66}@keyframes logoPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.login-loading-logo svg{color:#fff;font-size:1.6rem}.login-loading-text{color:#fff6;font-size:.85rem;font-weight:500}@media (width<=480px){.login-card{border-radius:20px;max-width:none;margin:12px;padding:28px 24px 24px}.login-bg-orb-1{width:300px;height:300px}.login-bg-orb-2{width:250px;height:250px}.login-bg-orb-3{width:200px;height:200px}.login-title{font-size:1.5rem}.login-subtitle{font-size:.82rem}}@media (height<=650px){.login-card{padding:24px 24px 20px}.login-brand{margin-bottom:16px}.login-logo-circle{border-radius:12px;width:44px;height:44px;margin-bottom:10px}.login-logo-icon{font-size:1.1rem}.login-mode-toggle{margin-bottom:16px}.login-mode-btn{padding:8px 0}}.app-container{grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:100dvh;grid-template-areas:"sidebar main";width:100vw;height:100dvh;display:grid;overflow:hidden}.app-container.np-expanded{grid-template-columns:1fr;grid-template-areas:"main"}@media (width<=768px){.app-container{grid-template-columns:1fr;grid-template-areas:"main"}}
