:root{--bg-sidebar: #000000;--bg-main: #121212;--bg-card: #181818;--bg-card-hover: #282828;--spotify-green: #1DB954;--text-primary: #FFFFFF;--text-secondary: #B3B3B3;--text-tertiary: #727272;--border-subtle: rgba(255, 255, 255, .1);--skeleton-base: #282828}*{margin:0;padding:0;box-sizing:border-box;outline:none}body{background-color:#000;color:var(--text-primary);font-family:Circular Sp,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.app-grid{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:1fr 90px;height:100vh;padding:8px;gap:8px}.sidebar{width:280px;display:flex;flex-direction:column;gap:8px;transition:width .3s cubic-bezier(.45,0,.55,1)}.sidebar.collapsed{width:72px}.sidebar-box{background:var(--bg-main);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:4px}.skeleton{background:var(--skeleton-base);border-radius:4px;position:relative;overflow:hidden}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);animation:shimmer 1.2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.splash{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:9999;display:flex;align-items:center;justify-content:center;flex-direction:column}.splash-logo{animation:logo-pulse 1.5s cubic-bezier(.45,0,.55,1) infinite}@keyframes logo-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(.95);opacity:.7}}.main-stage{background:var(--bg-main);border-radius:8px;overflow-y:auto;position:relative;scroll-behavior:smooth}.header-gradient{position:absolute;top:0;left:0;right:0;height:340px;background:linear-gradient(to bottom,var(--extract-color, #222) 0%,var(--bg-main) 100%);z-index:0}.nav-link{display:flex;align-items:center;gap:20px;height:48px;padding:0 12px;color:var(--text-secondary);text-decoration:none;font-weight:700;border-radius:4px;transition:.2s;cursor:pointer}.nav-link:hover,.nav-link.active{color:#fff;background:rgba(255,255,255,.05)}.track-row{display:grid;grid-template-columns:16px 4fr 2fr 1fr;padding:8px 16px;gap:16px;align-items:center;border-radius:4px;cursor:pointer;color:var(--text-secondary)}.track-row:hover{background:rgba(255,255,255,.1)}.track-row:hover .track-index{display:none}.track-row:hover .track-play{display:block;color:#fff}.track-play{display:none}.player-bar{grid-column:span 3;display:flex;align-items:center;justify-content:space-between;padding:0 16px}.slider-base{width:100%;height:4px;background:#4d4d4d;border-radius:2px;position:relative;cursor:pointer}.slider-fill{height:100%;border-radius:2px;background:#FFF}.slider-base:hover .slider-fill{background:var(--spotify-green)}