:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f8fafc;--bg-canvas:#08090d;--bg-surface-subtle:#0e111a80;--bg-surface:#101420b8;--bg-surface-elevated:#181d30e0;--bg-surface-active:#242c48f2;--bg-dock:#090b11f0;--glass-border:#ffffff0f;--glass-border-hover:#ffffff24;--glass-border-focus:#6366f173;--glass-glow:#6366f133;--accent-indigo:#6366f1;--accent-indigo-hover:#4f46e5;--accent-indigo-light:#818cf8;--accent-glow:#6366f159;--accent-gradient:linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #06b6d4 100%);--accent-gradient-subtle:linear-gradient(135deg, #6366f126 0%, #8b5cf61a 100%);--signal-playing:#10b981;--signal-playing-glow:#10b9814d;--signal-danger:#f43f5e;--signal-danger-subtle:#f43f5e1f;--signal-warning:#f59e0b;--signal-warning-subtle:#f59e0b1f;--signal-info:#38bdf8;--text-title:#f8fafc;--text-body:#cbd5e1;--text-secondary:#94a3b8;--text-muted:#64748b;--text-dim:#475569;--transition-fast:all .15s cubic-bezier(.4, 0, .2, 1);--transition-smooth:all .25s cubic-bezier(.4, 0, .2, 1);--transition-spring:all .35s cubic-bezier(.34, 1.56, .64, 1);--sidebar-left-width:260px;--sidebar-right-width:360px;--main-grid-cols:var(--sidebar-left-width) 1fr var(--sidebar-right-width);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:400;line-height:1.5}@media (width<=1400px){:root{--sidebar-left-width:230px;--sidebar-right-width:320px}}@media (width<=1100px){:root{--sidebar-left-width:210px;--sidebar-right-width:280px}}@media (width<=900px){:root{--sidebar-left-width:80px;--sidebar-right-width:240px}}@media (width<=768px){:root{--main-grid-cols:1fr}.hide-on-mobile{display:none!important}.mobile-only{display:flex!important}}@media (width>=769px){.mobile-only{display:none!important}}@media (width<=900px) and (width>=769px){.hide-on-small{display:none!important}.sidebar-btn{justify-content:center!important;padding:10px!important}}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-canvas);min-height:100vh;color:var(--text-body);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 15% 15%,#6366f114 0,#0000 50%),radial-gradient(at 85% 85%,#8b5cf60f 0,#0000 50%),radial-gradient(#06b6d40a 0,#0000 60%);background-attachment:fixed;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;overflow:hidden}h1,h2,h3,h4,h5,h6{color:var(--text-title);letter-spacing:-.02em;font-family:Outfit,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:700}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ffffff38}.glass-panel{background:var(--bg-surface);-webkit-backdrop-filter:blur(24px);border:1px solid var(--glass-border);transition:var(--transition-smooth);border-radius:16px;box-shadow:0 10px 30px -10px #00000080}.glass-panel:hover{border-color:var(--glass-border-hover)}.glass-card{border:1px solid var(--glass-border);transition:var(--transition-smooth);background:#ffffff05;border-radius:12px}.glass-card:hover{border-color:var(--glass-border-hover);background:#ffffff0d;transform:translateY(-1px)}.glass-dock{background:var(--bg-dock);-webkit-backdrop-filter:blur(30px);border-top:1px solid var(--glass-border)}.btn-primary{background:var(--accent-gradient);color:#fff;cursor:pointer;transition:var(--transition-spring);box-shadow:0 4px 15px var(--glass-glow);border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:9px 20px;font-family:Outfit,sans-serif;font-size:.95rem;font-weight:600;display:inline-flex}.btn-primary:hover{box-shadow:0 6px 22px var(--accent-glow);filter:brightness(1.08);transform:translateY(-2px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{border:1px solid var(--glass-border);color:var(--text-title);cursor:pointer;transition:var(--transition-smooth);background:#ffffff0d;border-radius:10px;align-items:center;gap:8px;padding:8px 18px;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:600;display:inline-flex}.btn-secondary:hover{border-color:var(--glass-border-hover);color:#fff;background:#ffffff1a}.btn-icon{color:var(--text-secondary);cursor:pointer;width:36px;height:36px;transition:var(--transition-smooth);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;display:inline-flex}.btn-icon:hover{color:var(--text-title);background:#ffffff14;transform:scale(1.08)}.btn-icon:active{transform:scale(.95)}.sidebar-btn{width:100%;color:var(--text-secondary);cursor:pointer;transition:var(--transition-smooth);text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:12px;padding:10px 14px;font-size:.95rem;font-weight:600;display:flex}.sidebar-btn:hover{color:var(--text-title);background:#ffffff0d}.sidebar-btn.active{background:var(--accent-gradient-subtle);color:var(--text-title);border-left:3px solid var(--accent-indigo)}.equalizer-bar-container{align-items:flex-end;gap:3px;height:16px;padding:0 4px;display:inline-flex}.equalizer-bar{background:var(--signal-playing);border-radius:2px;width:3px;transition:height .2s}.equalizer-bar.playing{animation:1.2s ease-in-out infinite alternate eqBounce}.equalizer-bar.playing:first-child{height:14px;animation-delay:.1s}.equalizer-bar.playing:nth-child(2){height:8px;animation-delay:.35s}.equalizer-bar.playing:nth-child(3){height:16px;animation-delay:.2s}.equalizer-bar.playing:nth-child(4){height:10px;animation-delay:.45s}.equalizer-bar.paused{opacity:.6;height:4px}@keyframes eqBounce{0%{height:3px}50%{height:16px}to{height:6px}}.modal-backdrop{-webkit-backdrop-filter:blur(16px);z-index:10000;background:#040508cc;justify-content:center;align-items:center;padding:20px;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-dialog{border:1px solid var(--glass-border-hover);background:#101420f2;border-radius:20px;flex-direction:column;gap:20px;width:100%;max-width:480px;padding:30px;animation:.25s cubic-bezier(.34,1.56,.64,1) modalScale;display:flex;box-shadow:0 25px 60px -15px #000c,0 0 40px #6366f126}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalScale{0%{opacity:0;transform:scale(.92)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.context-menu{-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border-hover);z-index:10000;background:#0f121cf5;border-radius:12px;min-width:180px;padding:6px;animation:.15s ease-out fadeInMenu;position:fixed;box-shadow:0 12px 35px #000000a6,0 0 20px #0006}.context-menu-item{cursor:pointer;color:var(--text-body);transition:var(--transition-fast);border-radius:8px;align-items:center;gap:10px;padding:9px 14px;font-size:.9rem;font-weight:500;display:flex}.context-menu-item:hover{color:#fff;background:#ffffff14}.context-menu-item.danger:hover{background:var(--signal-danger-subtle);color:var(--signal-danger)}@keyframes fadeInMenu{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.slide-in{animation:.3s cubic-bezier(.4,0,.2,1) forwards slideInTrack}@keyframes slideInTrack{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.pulse-glow{animation:2.5s infinite alternate pulseIndigo}@keyframes pulseIndigo{0%{filter:drop-shadow(0 0 2px #6366f14d)}to{filter:drop-shadow(0 0 10px #6366f1cc)}}input[type=range]{appearance:none;height:5px;transition:var(--transition-fast);background:#ffffff26;border-radius:999px;outline:none}input[type=range]:hover{background:#ffffff40}input[type=range]::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:13px;height:13px;transition:transform .15s;box-shadow:0 0 8px #0006}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.3);box-shadow:0 0 12px #6366f1cc}
