@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap";@import "https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap";:root{--font-sans:"Inter", ui-sans-serif, system-ui, sans-serif;--font-serif:"Inter", ui-sans-serif, system-ui, sans-serif;--background:#000;--foreground:#fff;--theme-glow-rgb:29, 185, 84;--theme-glow:#1db95466;--theme-dominant:#1db9541f;--text-primary:#fff;--text-secondary:#b3b3b3;--text-muted:#7f7f7f;--border-light:#282828;--border-glow:#1db95440;--bg-panel:#121212;--bg-card:#181818;--bg-card-hover:#282828;--bg-sidebar:#000;--bg-player:#181818}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--foreground);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.01em;height:100vh;overflow:hidden}#root{height:100%}.liquid-glass{background:var(--bg-panel);border:none;border-radius:8px;position:relative;overflow:hidden}.liquid-glass:before{display:none!important}.glass-pill{background:var(--bg-card);border-radius:9999px;box-shadow:none!important}.glass{background:var(--bg-card);border:1px solid var(--border-light)}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff2e}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit;transition:all .25s cubic-bezier(.4,0,.2,1)}button:focus{outline:none}.btn-primary{color:#fff;letter-spacing:normal;background:#1db954;border-radius:500px;padding:12px 32px;font-size:14px;font-weight:700;transition:all .2s}.btn-primary:hover{box-shadow:none;background:#1ed760;transform:scale(1.04)}.track-row{color:#b3b3b3;border-radius:6px;grid-template-columns:48px 2.5fr 1.8fr 1.5fr 80px;align-items:center;padding:8px 16px;transition:background .2s;display:grid}.track-row:hover{color:#fff;background:#2a2a2a}.track-row.active{color:#1db954;background:#1db9541a}.glass-input{color:#fff;font-family:var(--font-sans);background:#ffffff0a;border:1px solid #ffffff1a;border-radius:50px;padding:12px 20px;font-size:14px;transition:all .3s}.glass-input:focus{background:#ffffff0f;border-color:#ffffff40;outline:none;box-shadow:0 0 0 3px #ffffff0d}.glass-input::placeholder{color:#ffffff59}@keyframes recordSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.vinyl-record{animation:3.5s linear infinite paused recordSpin}.vinyl-record.spinning{animation-play-state:running}.dynamic-backdrop{z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 50%, rgba(var(--theme-glow-rgb), .1) 0%, transparent 70%);transition:background 2s;position:absolute;inset:0}#root>div:first-child:not([style*=fixed]){box-sizing:border-box!important;flex-direction:initial!important;grid-template:"sidebar main"1fr"player player"/240px 1fr!important;gap:8px!important;height:100vh!important;padding:8px!important;display:grid!important}#root>div:first-child:not([style*=fixed])>nav{background:var(--bg-card)!important;z-index:20!important;border-radius:8px!important;flex-direction:column!important;grid-area:sidebar!important;justify-content:flex-start!important;align-items:flex-start!important;width:100%!important;max-width:none!important;height:100%!important;padding:24px 16px!important;display:flex!important;position:relative!important}#root>div:first-child:not([style*=fixed])>nav>div{width:100%!important;max-width:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:0 0!important;border-radius:0!important;flex-direction:column!important;align-items:flex-start!important;gap:24px!important;padding:0!important}#root>div:first-child:not([style*=fixed])>nav>div:before{display:none!important}#root>div:first-child:not([style*=fixed])>nav>div>div:nth-child(2){flex-direction:column!important;gap:8px!important;width:100%!important;overflow:visible!important}#root>div:first-child:not([style*=fixed])>nav>div>div:nth-child(2)>button{border-radius:6px!important;justify-content:flex-start!important;width:100%!important;padding:10px 16px!important}#root>div:first-child:not([style*=fixed])>main{background:var(--bg-card)!important;border-radius:8px!important;grid-area:main!important;height:100%!important;margin:0!important;padding:24px 32px!important;overflow-y:auto!important}#root>div:first-child:not([style*=fixed])>footer{background:var(--bg-card)!important;border:none!important;border-radius:8px!important;grid-area:player!important;width:100%!important;margin:0!important}main>div>div[style*=flex-wrap]:not([style*="gap: 2rem"]):not([style*=gap\:2rem]){flex-direction:initial!important;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:24px!important;display:grid!important}main>div>div[style*=flex-wrap]:not([style*="gap: 2rem"]):not([style*=gap\:2rem])>div{border-radius:8px!important;flex-direction:column!important;justify-content:flex-start!important;gap:16px!important;width:100%!important;min-width:0!important;padding:16px!important;display:flex!important}main>div>div[style*=flex-wrap]:not([style*="gap: 2rem"]):not([style*=gap\:2rem])>div img{aspect-ratio:1!important;object-fit:cover!important;border-radius:6px!important;width:100%!important;height:auto!important}main>div>div[style*=flex-wrap]:not([style*="gap: 2rem"]):not([style*=gap\:2rem])>div img[style*="50%"]{border-radius:50%!important}@media (width<=768px){#root>div:first-child:not([style*=fixed]){flex-direction:column!important;gap:0!important;height:100vh!important;padding:0!important;display:flex!important}#root>div:first-child:not([style*=fixed])>nav{grid-area:initial!important;-webkit-backdrop-filter:blur(20px)!important;backdrop-filter:blur(20px)!important;background:#000000d9!important;border-bottom:1px solid #ffffff14!important;border-radius:0!important;width:100%!important;height:auto!important;padding:10px 14px!important;box-shadow:0 4px 20px #0000004d!important}#root>div:first-child:not([style*=fixed])>nav>div{flex-direction:row!important;justify-content:space-between!important;align-items:center!important;gap:12px!important;width:100%!important;max-width:none!important}#root>div:first-child:not([style*=fixed])>nav>div>div:nth-child(2){scrollbar-width:none!important;flex-direction:row!important;gap:4px!important;width:auto!important;overflow-x:auto!important}#root>div:first-child:not([style*=fixed])>nav>div>div:nth-child(2)::-webkit-scrollbar{display:none!important}#root>div:first-child:not([style*=fixed])>nav>div>div:nth-child(2)>button{border-radius:9999px!important;width:auto!important;padding:8px 12px!important}.hidden-mobile{display:none!important}#root>div:first-child:not([style*=fixed])>main{grid-area:initial!important;border-radius:0!important;flex:1!important;margin:0!important;padding:16px!important}#root>div:first-child:not([style*=fixed])>main>div>div[style*=flex-wrap]{flex-direction:column!important;gap:20px!important}#root>div:first-child:not([style*=fixed])>main>div>div[style*=flex-wrap]>div{flex:none!important;width:100%!important}#root>div:first-child:not([style*=fixed])>footer{grid-area:initial!important;border-top:1px solid #ffffff14!important;border-radius:0!important;grid-template-columns:1fr auto!important;gap:8px!important;height:76px!important;padding:0 16px!important}#root>div:first-child:not([style*=fixed])>footer>div:nth-child(2)>div:nth-child(2),#root>div:first-child:not([style*=fixed])>footer>div:nth-child(2)>div:first-child>button:first-child,#root>div:first-child:not([style*=fixed])>footer>div:nth-child(2)>div:first-child>button:last-child,#root>div:first-child:not([style*=fixed])>footer>div:nth-child(3){display:none!important}#root>div:first-child:not([style*=fixed])>footer>div:nth-child(2){width:auto!important;max-width:none!important;margin:0!important}}@keyframes pulseGlow{0%{transform:scale(.95);box-shadow:0 0 #1db954b3}70%{transform:scale(1.15);box-shadow:0 0 0 5px #1db95400}to{transform:scale(.95);box-shadow:0 0 #1db95400}}.live-pulse-dot{animation:1.8s ease-in-out infinite pulseGlow}.vinyl-record.spinning.speed-33{animation-duration:3.5s}.vinyl-record.spinning.speed-45{animation-duration:2.2s}.spotify-sidebar{box-sizing:border-box;background:#000;flex-direction:column;flex-shrink:0;justify-content:space-between;width:240px;height:100%;padding:24px 12px;display:flex}.sidebar-top{flex-direction:column;gap:24px;display:flex}.sidebar-logo{align-items:center;gap:12px;padding-left:12px;display:flex}.sidebar-logo .logo-icon{background:#1db954;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.sidebar-logo .logo-text{color:#fff;letter-spacing:-.02em;font-size:22px;font-weight:800}.sidebar-nav{flex-direction:column;gap:4px;display:flex}.sidebar-nav-item{color:#b3b3b3;text-align:left;background:0 0;border-radius:4px;align-items:center;gap:16px;width:100%;padding:12px 16px;font-size:14px;font-weight:700;transition:all .2s;display:flex}.sidebar-nav-item:hover{color:#fff}.sidebar-nav-item.active{color:#fff;background:#282828}.sidebar-nav-item.active svg{color:#1db954}.sidebar-nav-item .live-pulse-dot{background-color:#1db954;border-radius:50%;width:8px;height:8px;margin-left:auto}.sidebar-profile{border-top:1px solid #282828;justify-content:space-between;align-items:center;padding:16px 12px 0;display:flex}.profile-details{align-items:center;gap:10px;display:flex}.profile-avatar{color:#fff;background:#282828;border:1px solid #3e3e3e;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:flex}.profile-name{color:#e5e5e5;text-overflow:ellipsis;white-space:nowrap;max-width:90px;font-size:14px;font-weight:600;overflow:hidden}.profile-actions{align-items:center;gap:8px;display:flex}.status-dot{border-radius:50%;width:8px;height:8px}.status-dot.spotify{background:#1db954;box-shadow:0 0 6px #1db95499}.status-dot.apple{background:#fc3c44;box-shadow:0 0 6px #fc3c4499}.btn-logout{color:#b3b3b3;background:0 0;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:all .2s;display:flex}.btn-logout:hover{color:#fc3c44;background:#fc3c441a}@media (width<=768px){.spotify-sidebar{background:#000000f2;border-bottom:1px solid #282828;flex-direction:row;justify-content:space-between;align-items:center;width:100%;height:auto;padding:10px 14px}.sidebar-top{flex-direction:row;align-items:center;gap:16px;width:auto}.sidebar-logo{padding-left:0}.sidebar-logo .logo-text{display:none}.sidebar-nav{flex-direction:row;gap:4px}.sidebar-nav-item{border-radius:20px;width:auto;padding:8px 12px}.sidebar-nav-item .nav-label{display:none}.sidebar-profile{border-top:none;padding:0}.profile-name{display:none}}