@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap";*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width: 640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width: 768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width: 1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width: 1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width: 1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.z-50{z-index:50}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-10{margin-top:2.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-20{height:5rem}.h-24{height:6rem}.h-7{height:1.75rem}.min-h-screen{min-height:100vh}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-20{width:5rem}.w-24{width:6rem}.w-7{width:1.75rem}.w-full{width:100%}.min-w-0{min-width:0px}.max-w-5xl{max-width:64rem}.max-w-md{max-width:28rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-spin{animation:spin 1s linear infinite}.resize{resize:both}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-\[--glass-border\]{border-color:var(--glass-border)}.border-melody-primary{--tw-border-opacity: 1;border-color:rgb(168 85 247 / var(--tw-border-opacity, 1))}.border-t-transparent{border-top-color:transparent}.bg-\[\#5865F2\]{--tw-bg-opacity: 1;background-color:rgb(88 101 242 / var(--tw-bg-opacity, 1))}.bg-\[--bg-input\]{background-color:var(--bg-input)}.bg-\[--glass-bg\]{background-color:var(--glass-bg)}.bg-melody-bg{--tw-bg-opacity: 1;background-color:rgb(15 10 26 / var(--tw-bg-opacity, 1))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.from-cyan-400{--tw-gradient-from: #22d3ee var(--tw-gradient-from-position);--tw-gradient-to: rgb(34 211 238 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-cyan-500\/20{--tw-gradient-from: rgb(6 182 212 / .2) var(--tw-gradient-from-position);--tw-gradient-to: rgb(6 182 212 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.via-cyan-500{--tw-gradient-to: rgb(6 182 212 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), #06b6d4 var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-blue-500{--tw-gradient-to: #3b82f6 var(--tw-gradient-to-position)}.to-blue-500\/20{--tw-gradient-to: rgb(59 130 246 / .2) var(--tw-gradient-to-position)}.to-blue-600{--tw-gradient-to: #2563eb var(--tw-gradient-to-position)}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pt-4{padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-melody-text-muted{--tw-text-opacity: 1;color:rgb(148 163 184 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.opacity-30{opacity:.3}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-cyan-500\/20{--tw-shadow-color: rgb(6 182 212 / .2);--tw-shadow: var(--tw-shadow-colored)}.shadow-cyan-500\/25{--tw-shadow-color: rgb(6 182 212 / .25);--tw-shadow: var(--tw-shadow-colored)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-2xl{--tw-blur: blur(40px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-xl{--tw-backdrop-blur: blur(24px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}:root{--bg-dark: #050a14;--bg-gradient-start: #050a14;--bg-gradient-end: #0a1628;--bg-base: #050a14;--glass-bg: rgba(15, 25, 45, .6);--glass-border: rgba(100, 200, 255, .08);--glass-border-hover: rgba(100, 200, 255, .15);--glass-shadow: rgba(0, 0, 0, .4);--primary: #22d3ee;--primary-hover: #06b6d4;--primary-glow: rgba(34, 211, 238, .25);--primary-soft: rgba(34, 211, 238, .1);--accent: #f472b6;--accent-glow: rgba(244, 114, 182, .2);--text: #f0f9ff;--text-secondary: #cbd5e1;--text-muted: #64748b;--success: #34d399;--warning: #fbbf24;--danger: #f87171;--bg-input: rgba(15, 23, 42, .8);--bg-card: #1a1f2e;--bg-dropdown: #1e2433;--bg-modal: #161b26;--aurora-1: #0ea5e9;--aurora-2: #22d3ee;--aurora-3: #a855f7;--aurora-4: #f472b6}*{box-sizing:border-box}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-dark);color:var(--text);min-height:100vh;margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}.aurora-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--bg-dark);overflow:hidden}.aurora-bg:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 20% 20%,rgba(14,165,233,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(168,85,247,.1) 0%,transparent 50%),radial-gradient(ellipse at 40% 80%,rgba(34,211,238,.1) 0%,transparent 40%),radial-gradient(ellipse at 80% 80%,rgba(244,114,182,.08) 0%,transparent 40%);animation:aurora 20s ease-in-out infinite alternate}@keyframes aurora{0%{transform:translate(0) rotate(0)}50%{transform:translate(-5%,-5%) rotate(3deg)}to{transform:translate(5%,5%) rotate(-3deg)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#22d3ee33;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#22d3ee66}::-moz-selection{background:#22d3ee4d}::selection{background:#22d3ee4d}.section-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:16px}.gradient-text{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.text-primary{color:var(--primary)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-danger{color:var(--danger)}.bg-glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.divider{height:1px;background:linear-gradient(90deg,transparent,var(--glass-border),transparent);margin:20px 0}.card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:24px;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(34,211,238,.2),transparent)}.card-hover{transition:all .3s cubic-bezier(.4,0,.2,1)}.card-hover:hover{border-color:var(--glass-border-hover);transform:translateY(-2px);box-shadow:0 20px 40px var(--glass-shadow),0 0 0 1px var(--glass-border-hover)}.card-compact{padding:16px;border-radius:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;font-size:14px;font-weight:600;border-radius:12px;border:none;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--aurora-1));color:var(--bg-dark);box-shadow:0 4px 15px var(--primary-glow)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 25px var(--primary-glow)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);color:var(--text)}.btn-secondary:hover{background:#22d3ee1a;border-color:var(--primary)}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover{background:#ffffff0d;color:var(--text)}.btn-danger{background:#f871711a;color:var(--danger);border:1px solid rgba(248,113,113,.2)}.btn-danger:hover{background:#f8717133;border-color:var(--danger)}.btn-icon{width:40px;height:40px;padding:0;border-radius:12px}.btn-icon-sm{width:36px;height:36px}.input{width:100%;background:var(--bg-input);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:12px;padding:14px 16px;font-size:15px;color:var(--text);outline:none;transition:all .2s}.input::-moz-placeholder{color:var(--text-muted)}.input::placeholder{color:var(--text-muted)}.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.input-with-icon{position:relative}.input-with-icon .input{padding-left:48px}.input-with-icon .icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.tabs{display:flex;gap:4px;background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:4px;border-radius:14px;border:1px solid var(--glass-border)}.tab{padding:10px 18px;font-size:14px;font-weight:500;color:var(--text-muted);background:transparent;border:none;border-radius:10px;cursor:pointer;transition:all .2s;white-space:nowrap}.tab:hover{color:var(--text);background:#ffffff0d}.tab.active{background:linear-gradient(135deg,var(--primary),var(--aurora-1));color:var(--bg-dark);font-weight:600}.bottom-nav-universal{position:fixed;bottom:0;left:0;right:0;z-index:100;padding:12px;padding-bottom:max(12px,env(safe-area-inset-bottom));pointer-events:none}.bottom-nav-container{max-width:400px;margin:0 auto;background:#0a1428d9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:8px;display:flex;justify-content:space-around;gap:4px;box-shadow:0 8px 32px #0006,0 0 0 1px #22d3ee0d inset;pointer-events:auto}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 16px;color:var(--text-muted);background:transparent;border:none;font-size:11px;font-weight:500;border-radius:14px;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.bottom-nav-icon{display:flex;align-items:center;justify-content:center;transition:transform .2s}.bottom-nav-label{transition:all .2s}.bottom-nav-item:hover{color:var(--text);background:#ffffff0d}.bottom-nav-item:hover .bottom-nav-icon{transform:scale(1.1)}.bottom-nav-item.active{color:var(--primary);background:#22d3ee1a}.bottom-nav-item.active:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:24px;height:3px;background:var(--primary);border-radius:0 0 3px 3px;box-shadow:0 0 10px var(--primary)}.bottom-nav-item.active .bottom-nav-icon{transform:scale(1.1)}@media (min-width: 640px){.bottom-nav-container{max-width:500px;padding:10px 16px}.bottom-nav-item{padding:12px 24px;font-size:12px;flex-direction:row;gap:8px}}.bottom-nav{display:none}.dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:16px;max-height:280px;overflow-y:auto;z-index:50;box-shadow:0 20px 60px #00000080;animation:dropdownIn .2s ease}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:background .15s}.dropdown-item:hover{background:#22d3ee1a}.dropdown-item:first-child{border-radius:15px 15px 0 0}.dropdown-item:last-child{border-radius:0 0 15px 15px}.status-dot{width:10px;height:10px;border-radius:50%;position:relative}.status-online{background:var(--success);box-shadow:0 0 12px var(--success)}.status-online:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:var(--success);opacity:.3;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:.3}50%{transform:scale(1.3);opacity:0}}.status-paused{background:var(--warning);box-shadow:0 0 8px #fbbf2480}.status-offline{background:var(--text-muted)}.avatar{width:44px;height:44px;border-radius:14px;-o-object-fit:cover;object-fit:cover;border:2px solid var(--glass-border);transition:border-color .2s}.avatar:hover{border-color:var(--primary)}.avatar-sm{width:36px;height:36px;border-radius:10px}.avatar-lg{width:64px;height:64px;border-radius:18px}.avatar-round{border-radius:50%}.badge{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;font-size:12px;font-weight:600;border-radius:8px}.badge-admin{background:linear-gradient(135deg,#22d3ee26,#0ea5e926);color:var(--primary);border:1px solid rgba(34,211,238,.2)}.badge-user{background:#34d39926;color:var(--success);border:1px solid rgba(52,211,153,.2)}.badge-blocked{background:#f8717126;color:var(--danger);border:1px solid rgba(248,113,113,.2)}.sound-wave{display:flex;align-items:center;gap:3px;height:24px}.sound-wave span{width:3px;height:100%;background:var(--primary);border-radius:2px;animation:wave 1s ease-in-out infinite}.sound-wave span:nth-child(1){animation-delay:0s}.sound-wave span:nth-child(2){animation-delay:.1s}.sound-wave span:nth-child(3){animation-delay:.2s}.sound-wave span:nth-child(4){animation-delay:.3s}.sound-wave span:nth-child(5){animation-delay:.4s}@keyframes wave{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.spinner{width:28px;height:28px;border:3px solid var(--glass-border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.spinner-lg{width:48px;height:48px;border-width:4px}.skeleton{background:linear-gradient(90deg,var(--glass-bg) 0%,rgba(34,211,238,.05) 50%,var(--glass-bg) 100%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:8px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.fade-in{animation:fadeIn .4s cubic-bezier(.4,0,.2,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .3s cubic-bezier(.4,0,.2,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.scale-in{animation:scaleIn .2s cubic-bezier(.4,0,.2,1)}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}[data-tooltip]{position:relative}[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);padding:8px 14px;background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:10px;font-size:12px;font-weight:500;white-space:nowrap;z-index:100;animation:tooltipIn .2s ease}@keyframes tooltipIn{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}input[type=color]{-webkit-appearance:none;width:48px;height:48px;border:none;border-radius:12px;cursor:pointer;background:transparent}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:2px solid var(--glass-border);border-radius:12px}input[type=color]:hover::-webkit-color-swatch{border-color:var(--primary)}.player-preview{border-radius:20px;overflow:hidden;box-shadow:0 8px 32px #0006,0 0 0 1px var(--glass-border)}.guild-card{position:relative;overflow:hidden}.guild-card:after{content:"";position:absolute;top:0;right:0;width:100px;height:100px;background:radial-gradient(circle,var(--primary-soft) 0%,transparent 70%);pointer-events:none}.music-glow{position:relative}.music-glow:before{content:"";position:absolute;top:-20px;right:-20px;bottom:-20px;left:-20px;background:radial-gradient(circle at center,var(--primary-glow) 0%,transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none}.music-glow:hover:before{opacity:1}.global-loading-indicator{position:fixed;top:70px;left:50%;transform:translate(-50%);z-index:9999;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.global-loading-content{display:flex;align-items:center;gap:12px;padding:12px 24px;background:#1e1e1ef2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:50px;box-shadow:0 8px 32px #0006}.global-loading-content span{color:var(--text);font-size:14px;font-weight:500;white-space:nowrap}.global-loading-content .btn-loader{width:18px;height:18px;border-width:2px;border-color:rgba(var(--primary),.3);border-top-color:var(--primary)}.playlist-loading-indicator{position:fixed;bottom:120px;right:20px;z-index:9999;animation:slideInRight .3s ease-out}.playlist-loading-indicator.fade-out{animation:fadeOut .5s ease-out 2.5s forwards}@keyframes slideInRight{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}@keyframes fadeOut{to{opacity:0;transform:translate(50px)}}@media (max-width: 768px){.playlist-loading-indicator{bottom:auto;top:8px;right:12px;left:12px;animation:slideInDown .3s ease-out}@keyframes slideInDown{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.playlist-loading-indicator.fade-out{animation:fadeOutUp .5s ease-out 2.5s forwards}@keyframes fadeOutUp{to{opacity:0;transform:translateY(-30px)}}}.playlist-loading-content{display:flex;align-items:center;gap:12px;padding:14px 20px;background:#1e1e1efa;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 32px #00000080;min-width:280px;max-width:400px}.playlist-loading-spinner{width:20px;height:20px;border:2px solid rgba(30,215,96,.3);border-top-color:#1db954;border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}.playlist-loading-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.playlist-loading-title{color:var(--text);font-size:13px;font-weight:600}.playlist-loading-track{color:var(--text-sub);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}.playlist-loading-bar{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff1a;border-radius:0 0 12px 12px;overflow:hidden}.playlist-loading-progress{height:100%;background:linear-gradient(90deg,#1db954,#1ed760);transition:width .3s ease-out;border-radius:0 0 0 12px}.playlist-loading-complete{color:#1db954;font-size:18px;font-weight:700;flex-shrink:0}.playlist-loading-error{color:#e74c3c;font-size:18px;font-weight:700;flex-shrink:0}.dashboard-layout{display:flex;min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:260px;background:#050a14f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);display:flex;flex-direction:column;z-index:100;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar.open{transform:translate(0)}@media (min-width: 1024px){.sidebar{transform:translate(0)}}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:99}@media (min-width: 1024px){.sidebar-overlay{display:none}}.sidebar-header{padding:16px;border-bottom:1px solid var(--glass-border);display:flex;align-items:center;gap:12px}.sidebar-back{width:36px;height:36px;border-radius:10px;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.sidebar-back:hover{color:var(--text);border-color:var(--primary)}.sidebar-guild{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.sidebar-guild-icon{width:40px;height:40px;border-radius:12px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;border:2px solid var(--glass-border)}.sidebar-guild-icon-placeholder{background:linear-gradient(135deg,var(--primary-soft),rgba(168,85,247,.1));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:var(--primary)}.sidebar-guild-info{min-width:0}.sidebar-guild-name{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.sidebar-guild-label{font-size:11px;color:var(--text-muted);margin:0}.sidebar-close{width:36px;height:36px;border-radius:10px;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.sidebar-close:hover{color:var(--text)}.sidebar-nav{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:4px}.sidebar-nav-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:transparent;border:none;color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;text-align:left;width:100%}.sidebar-nav-item:hover{background:#ffffff0d;color:var(--text)}.sidebar-nav-item.active{background:linear-gradient(135deg,#22d3ee26,#22d3ee0d);color:var(--primary);border:1px solid rgba(34,211,238,.2)}.sidebar-nav-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0}.sidebar-nav-label{flex:1}.sidebar-footer{padding:16px;border-top:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-between;gap:12px}.sidebar-user{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.sidebar-user-avatar{width:32px;height:32px;border-radius:8px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.sidebar-user-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-logout{width:36px;height:36px;border-radius:10px;background:transparent;border:1px solid var(--glass-border);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.sidebar-logout:hover{color:var(--danger);border-color:var(--danger);background:#f871711a}.dashboard-main{flex:1;margin-left:0;min-height:100vh;display:flex;flex-direction:column;padding-bottom:90px}@media (min-width: 1024px){.dashboard-main{margin-left:260px}}.mobile-header{position:sticky;top:0;z-index:50;padding:12px 16px;background:#050a14e6;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-between}.mobile-menu-btn{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;overflow:hidden}.mobile-header-guild{display:flex;align-items:center;gap:10px}.mobile-header-icon{width:32px;height:32px;border-radius:8px;-o-object-fit:cover;object-fit:cover}.mobile-header-icon-placeholder{background:linear-gradient(135deg,var(--primary-soft),rgba(168,85,247,.1));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:var(--primary)}.mobile-header-name{font-size:14px;font-weight:600}.page-header{padding:24px 24px 0}@media (max-width: 1023px){.page-header{padding:20px 16px 0}}.page-title{font-size:24px;font-weight:700;margin:0;background:linear-gradient(135deg,var(--text),var(--text-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.page-content{padding:24px;flex:1}@media (max-width: 1023px){.page-content{padding:20px 16px}}.theme-color-preview{width:40px;height:40px;border-radius:10px;overflow:hidden;flex-shrink:0;border:2px solid var(--glass-border)}.theme-color-bg{width:100%;height:100%;position:relative;display:flex;align-items:flex-end;padding:4px;gap:2px}.theme-color-primary{width:50%;height:12px;border-radius:3px}.theme-color-accent{width:50%;height:8px;border-radius:3px}.spotify-layout:has(.queue-panel) .spotify-main{margin-right:350px}.guild-selector-container{display:flex;align-items:center;gap:6px;margin-right:12px}.guild-selector-btn{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;background:#ffffff12;border:1px solid var(--glass-border);border-radius:20px;color:var(--text);cursor:pointer;transition:all .15s;max-width:200px}.discord-channels-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#ffffff12;border:1px solid var(--glass-border);border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.discord-channels-btn:hover{background:#5865f233;border-color:#5865f2;color:#5865f2}.discord-channels-btn.active{background:#5865f24d;border-color:#5865f2;color:#5865f2}.discord-channels-btn .btn-loader.small{width:16px;height:16px;border-width:2px}.guild-selector-btn:hover{background:#ffffff1f;border-color:var(--primary)}.guild-selector-btn .guild-icon{width:24px;height:24px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.guild-selector-btn .guild-icon-placeholder{width:24px;height:24px;border-radius:50%;background:var(--primary);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--bg-dark)}.guild-selector-btn .guild-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.guild-selector-btn svg{flex-shrink:0;color:var(--text-muted);transition:transform .15s}.guild-selector-btn:hover svg{color:var(--primary)}.listeners-dropdown{position:absolute;bottom:calc(100% + 8px);left:0;min-width:220px;background:var(--bg-dropdown);border:1px solid var(--glass-border);border-radius:12px;box-shadow:0 16px 48px #0009;animation:dropdownSlide .15s ease;z-index:300}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.listeners-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--glass-border);font-size:12px;color:var(--text-muted)}.listeners-header .listener-total{color:var(--primary);font-weight:500}.listeners-list{padding:8px;max-height:200px;overflow-y:auto}.listener-item{display:flex;align-items:center;gap:10px;padding:8px;border-radius:8px;transition:background .15s}.listener-item:hover{background:#ffffff0d}.listener-avatar{width:28px;height:28px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.listener-name{font-size:13px;color:var(--text)}.listeners-empty{padding:16px;text-align:center;color:var(--text-muted);font-size:13px}.server-structure-panel{position:fixed;left:280px;top:64px;bottom:90px;width:280px;background:var(--bg-card);border-right:1px solid var(--glass-border);z-index:150;display:flex;flex-direction:column;animation:slideInPanel .2s ease}@keyframes slideInPanel{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.server-structure-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--glass-border)}.server-info{display:flex;align-items:center;gap:10px;overflow:hidden}.server-icon{width:32px;height:32px;border-radius:50%;flex-shrink:0}.server-info h3{font-size:14px;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-close{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center}.panel-close:hover{background:#ffffff1a;color:var(--text)}.server-structure-content{flex:1;overflow-y:auto;padding:12px 8px}.category-section{margin-bottom:8px}.category-header{display:flex;align-items:center;gap:4px;width:100%;padding:6px 8px;background:transparent;border:none;color:var(--text-muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:color .15s}.category-header:hover{color:var(--text)}.category-arrow{transition:transform .15s;display:flex;align-items:center}.category-arrow.expanded{transform:rotate(0)}.category-arrow:not(.expanded){transform:rotate(-90deg)}.category-channels{margin-left:8px}.channel-tree-item{margin-bottom:2px}.channel-tree-btn{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:transparent;border:none;border-radius:6px;color:var(--text-muted);font-size:13px;cursor:pointer;transition:all .15s;text-align:left}.channel-tree-btn:hover{background:#ffffff14;color:var(--text)}.channel-tree-item.current .channel-tree-btn{background:#22d3ee26;color:var(--primary)}.channel-tree-btn svg{flex-shrink:0}.channel-tree-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-tree-count{font-size:11px;color:var(--text-muted);background:#ffffff1a;padding:2px 6px;border-radius:10px}.current-badge{font-size:9px;font-weight:600;text-transform:uppercase;background:var(--primary);color:var(--bg-dark);padding:2px 6px;border-radius:4px}.channel-members{margin-left:28px;padding:4px 0 8px}.channel-member{display:flex;align-items:center;gap:8px;padding:4px 8px;font-size:12px;color:var(--text-muted)}.channel-member img{width:20px;height:20px;border-radius:50%}.channel-member.is-bot{opacity:.7}.bot-tag{font-size:9px;font-weight:600;background:var(--primary);color:var(--bg-dark);padding:1px 4px;border-radius:3px}.no-channels{padding:8px 12px;font-size:12px;color:var(--text-muted);font-style:italic}.library-actions{display:flex;align-items:center;gap:4px}.library-channels-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.library-channels-btn:hover{background:#ffffff1a;color:var(--text)}.library-channels-btn.active{color:var(--primary)}.library-channels-btn .btn-loader.small{width:16px;height:16px;border-width:2px}.spotify-layout:has(.server-structure-panel) .spotify-main{margin-left:280px}.mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:190;background:#050a14f2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--glass-border);display:flex;justify-content:space-around;padding:8px 12px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 16px;background:transparent;border:none;color:var(--text-muted);font-size:10px;font-weight:500;cursor:pointer;border-radius:12px;transition:all .2s;min-width:60px}.mobile-nav-item:hover{color:var(--text)}.mobile-nav-icon{display:flex;align-items:center;justify-content:center;transition:transform .2s}.mobile-nav-label{white-space:nowrap}.mobile-nav-item.active{color:var(--primary);background:#22d3ee1a}.mobile-nav-item.active .mobile-nav-icon{transform:scale(1.1)}@media (max-width: 767px){.dashboard-main{padding-bottom:150px}.mobile-player-container.expanded~.dashboard-main .mobile-header{opacity:0}}.player-bar{position:fixed;bottom:0;left:0;right:0;height:80px;background:#050a14fa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid var(--glass-border);z-index:200;display:flex;align-items:center;padding:0 16px}.player-bar-track{display:flex;align-items:center;gap:12px;flex:1;min-width:0;max-width:300px}.player-bar-thumbnail{width:56px;height:56px;border-radius:8px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}.player-bar-thumbnail-empty{display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.player-bar-info{min-width:0}.player-bar-title{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 2px}.player-bar-artist{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.player-bar-controls{display:flex;align-items:center;justify-content:center;gap:8px;flex:1}.player-bar-btn{width:36px;height:36px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.player-bar-btn:hover{color:var(--text);transform:scale(1.05)}.player-bar-btn-main{width:40px;height:40px;background:var(--text);color:var(--bg-dark);border-radius:50%}.player-bar-btn-main:hover{transform:scale(1.08);background:var(--primary)}.player-bar-extra{display:flex;align-items:center;gap:12px;flex:1;justify-content:flex-end;max-width:300px}.player-bar-volume{display:none;align-items:center;gap:8px;color:var(--text-muted)}@media (min-width: 768px){.player-bar-volume{display:flex}}.player-bar-volume input[type=range]{width:100px;height:4px;-webkit-appearance:none;background:var(--glass-border);border-radius:2px;outline:none}.player-bar-volume input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text);cursor:pointer;-webkit-transition:all .15s;transition:all .15s}.player-bar-volume input[type=range]:hover::-webkit-slider-thumb{background:var(--primary);transform:scale(1.2)}.player-bar-queue-count{font-size:12px;color:var(--text-muted);white-space:nowrap}.player-bar-queue-btn{width:36px;height:36px;border-radius:8px;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;position:relative}.player-bar-queue-btn:hover{color:var(--text);background:var(--glass-bg)}.player-bar-queue-btn.active{color:var(--primary)}.player-bar-queue-btn .badge{position:absolute;top:2px;right:2px;font-size:9px;background:var(--primary);color:#fff;border-radius:8px;padding:1px 5px;min-width:14px;text-align:center}.player-bar-progress{position:absolute;top:0;left:0;right:0;height:4px;background:var(--glass-border);cursor:pointer}.player-bar-progress:hover{height:6px}.player-bar-progress-fill{height:100%;background:var(--primary);transition:width .1s linear}.player-bar-progress:hover .player-bar-progress-fill{background:var(--accent)}.player-bar-time{font-size:11px;color:var(--text-muted);display:none;gap:4px;min-width:90px;justify-content:center}@media (min-width: 768px){.player-bar-time{display:flex}}.ws-indicator{width:8px;height:8px;border-radius:50%;background:#ef4444;margin-right:8px;flex-shrink:0}.ws-indicator.connected{background:#22c55e}.spotify-player{grid-area:player;position:fixed;bottom:0;left:0;right:0;height:90px;background:#0f0f14fa;border-top:1px solid var(--glass-border);display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;padding:0 16px;z-index:250}@media (max-width: 768px){.spotify-player{grid-template-columns:1fr auto;height:72px;padding:0 12px}}.spotify-player-track{display:flex;align-items:center;gap:14px;min-width:0}.spotify-player-thumbnail{width:56px;height:56px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}@media (max-width: 768px){.spotify-player-thumbnail{width:48px;height:48px}}.spotify-player-thumbnail-placeholder{display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.spotify-player-info{min-width:0}.spotify-player-title{font-size:14px;font-weight:500;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-player-artist{font-size:12px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-player-center{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:720px;margin:0 auto;width:100%}@media (max-width: 768px){.spotify-player-center{display:none}}.spotify-player-controls{display:flex;align-items:center;gap:8px}.spotify-player-btn{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.spotify-player-btn:hover{color:var(--text);transform:scale(1.05)}.spotify-player-btn:disabled{opacity:.5;cursor:default;transform:none}.spotify-player-btn-main{width:36px;height:36px;background:var(--text);color:var(--bg-dark)}.spotify-player-btn-main:hover{transform:scale(1.08);background:var(--primary)}.spotify-player-progress-wrapper{display:flex;align-items:center;gap:8px;width:100%}.spotify-player-time{font-size:11px;color:var(--text-muted);min-width:40px}.spotify-player-time:first-child{text-align:right}.spotify-progress-container{flex:1;height:16px;display:flex;align-items:center;cursor:pointer;position:relative}.spotify-progress-bar{width:100%;height:4px;background:#fff3;border-radius:2px;overflow:hidden;position:relative}.spotify-progress-container:hover .spotify-progress-bar{height:6px}.spotify-progress-fill{height:100%;background:var(--text);border-radius:2px;transition:width .1s linear;position:relative}.spotify-progress-container:hover .spotify-progress-fill{background:var(--primary)}.spotify-progress-handle{position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background:var(--text);border-radius:50%;opacity:0;transition:opacity .15s}.spotify-progress-container:hover .spotify-progress-handle{opacity:1}.spotify-progress-hover-time{position:absolute;bottom:20px;transform:translate(-50%);padding:4px 8px;background:#1e1e28f2;border-radius:4px;font-size:11px;font-weight:500;white-space:nowrap;pointer-events:none}.spotify-player-right{display:flex;align-items:center;justify-content:flex-end;gap:8px}@media (max-width: 768px){.spotify-player-right{gap:4px}}.spotify-player-volume{display:flex;align-items:center;gap:8px}@media (max-width: 768px){.spotify-player-volume{display:none}}.spotify-volume-slider{width:100px;height:4px;-webkit-appearance:none;background:#fff3;border-radius:2px;outline:none}.spotify-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text);cursor:pointer;-webkit-transition:all .15s;transition:all .15s}.spotify-volume-slider:hover::-webkit-slider-thumb{background:var(--primary)}.spotify-player-mobile-btn{display:none;width:40px;height:40px;border-radius:50%;background:var(--text);border:none;color:var(--bg-dark);cursor:pointer;align-items:center;justify-content:center}@media (max-width: 768px){.spotify-player-mobile-btn{display:flex}}.mobile-player-container{position:fixed;bottom:0;left:0;right:0;z-index:200;pointer-events:none}.mobile-player-container>*{pointer-events:auto}.mobile-mini-player{position:absolute;bottom:72px;left:12px;right:12px;height:64px;background:#0f141ef2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:12px;overflow:hidden;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 20px #0006;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:pan-y}.mobile-player-container.expanded .mobile-mini-player{opacity:0;transform:translateY(20px);pointer-events:none}.mobile-mini-progress{position:absolute;top:0;left:0;right:0;height:3px;background:var(--glass-border)}.mobile-mini-progress-fill{height:100%;background:var(--primary);transition:width .1s linear}.mobile-mini-content{display:flex;align-items:center;justify-content:space-between;height:100%;padding:3px 12px 0;gap:10px}.mobile-mini-left{display:flex;align-items:center;gap:10px;flex-shrink:0}.ws-indicator-mini{width:6px;height:6px;border-radius:50%;background:#ef4444;flex-shrink:0}.ws-indicator-mini.connected{background:#22c55e}.mobile-mini-thumb-container{position:relative;width:44px;height:44px;flex-shrink:0}.mobile-mini-thumbnail{width:44px;height:44px;border-radius:8px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg);transition:opacity .2s ease}.mobile-mini-thumbnail.loading{opacity:.6}.mobile-mini-thumb-loader{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--primary)}.mobile-mini-thumb-loader svg{width:20px;height:20px}.mobile-mini-thumbnail-empty{display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.mobile-mini-swipe-area{flex:1;min-width:0;position:relative;overflow:hidden;height:100%;display:flex;align-items:center}.mobile-mini-carousel-item{position:absolute;top:0;bottom:0;left:0;right:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none;will-change:transform,opacity}.mobile-mini-carousel-item .mobile-mini-title,.mobile-mini-carousel-item .mobile-mini-artist{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-mini-carousel-item .mobile-mini-title{font-size:14px;font-weight:500;margin:0 0 2px}.mobile-mini-carousel-item .mobile-mini-artist{font-size:12px;color:var(--text-muted);margin:0}.mobile-mini-carousel-current{position:relative}.mobile-mini-title{font-size:14px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-mini-artist{font-size:12px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-mini-controls{display:flex;align-items:center;gap:4px;flex-shrink:0;padding-right:4px}.mobile-mini-btn{width:40px;height:40px;border-radius:50%;background:transparent;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-mini-btn:hover{background:#ffffff1a}.mobile-mini-btn:disabled{opacity:.4;cursor:default}.mobile-player-fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-dark);display:flex;flex-direction:column;justify-content:center;padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));transform:translateY(100%) translateZ(0);transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:210;overflow:hidden;will-change:transform;backface-visibility:hidden}.mobile-player-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;filter:blur(40px) saturate(1.3);opacity:.5;transform:scale(1.1);z-index:0}.mobile-player-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#050a1426,#050a1466,#050a14bf)}.mobile-player-container.expanded .mobile-player-fullscreen{transform:translateY(0) translateZ(0)}.mobile-player-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;position:absolute;top:max(16px,env(safe-area-inset-top));left:16px;right:16px;z-index:1}.mobile-player-collapse-btn{width:40px;height:40px;border-radius:50%;background:transparent;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-player-collapse-btn:hover{background:#ffffff1a}.mobile-player-header-title{text-align:center}.mobile-player-artwork{flex:0 0 auto;display:flex;align-items:center;justify-content:center;padding:8px 20px;margin-bottom:24px;position:relative;z-index:1;will-change:transform;-webkit-transform:translateZ(0);backface-visibility:hidden}.mobile-player-artwork-img{width:calc(100vw - 80px);max-width:320px;aspect-ratio:1 / 1;border-radius:12px;-o-object-fit:cover;object-fit:cover;box-shadow:0 8px 40px #0009,0 0 0 1px var(--glass-border)}.mobile-player-artwork-prev,.mobile-player-artwork-next{position:absolute;top:50%;transform:translateY(-50%)}.mobile-player-artwork-prev{right:calc(100% + 40px)}.mobile-player-artwork-next{left:calc(100% + 40px)}.mobile-player-artwork-placeholder{width:calc(100vw - 80px);max-width:320px;aspect-ratio:1 / 1;border-radius:12px;background:var(--glass-bg);display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.mobile-player-artwork-placeholder svg{width:60px;height:60px}.mobile-player-artwork-img.loading{opacity:.7}.mobile-player-artwork-loader{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0006;border-radius:12px}.mobile-player-artwork-loader:after{content:"";width:48px;height:48px;border:3px solid transparent;border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.mobile-player-track-title.loading,.mobile-player-track-artist.loading{opacity:.7}.mobile-player-btn-main.loading svg{animation:spin 1s linear infinite}.mobile-player-track-info{text-align:center;padding:0 20px;margin-bottom:16px;position:relative;z-index:1}.mobile-player-track-title{font-size:20px;font-weight:700;margin:0 0 6px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mobile-player-track-artist{font-size:15px;color:var(--text-muted);margin:0}.mobile-player-progress-container{padding:0 20px;margin-bottom:16px;position:relative;z-index:1}.mobile-player-progress-bar{height:6px;background:var(--glass-border);border-radius:3px;overflow:hidden}.mobile-player-progress-fill{height:100%;background:var(--primary);transition:width .1s linear;border-radius:3px}.mobile-player-progress-time{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--text-muted)}.mobile-player-controls{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px;position:relative;z-index:1}.mobile-player-btn{width:56px;height:56px;border-radius:50%;background:transparent;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-player-btn svg{width:28px;height:28px}.mobile-player-btn:hover{transform:scale(1.05)}.mobile-player-btn:disabled{opacity:.4;cursor:default;transform:none}.mobile-player-btn-main{width:72px;height:72px;background:var(--text);color:var(--bg-dark)}.mobile-player-btn-main svg{width:32px;height:32px}.mobile-player-btn-main:hover{background:var(--primary);transform:scale(1.08)}.mobile-player-btn-secondary{width:44px;height:44px;color:var(--text-muted)}.mobile-player-btn-secondary svg{width:20px;height:20px}.mobile-player-volume{display:flex;align-items:center;justify-content:center;gap:12px;padding:0 40px;margin-bottom:12px;position:relative;z-index:1}.mobile-player-volume-icon{color:var(--text-muted)}.mobile-player-volume-slider{flex:1;height:4px;-webkit-appearance:none;background:var(--glass-border);border-radius:2px;outline:none}.mobile-player-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--text);cursor:pointer}.mobile-player-queue-info{text-align:left;flex:1}.mobile-player-options-btn{width:40px;height:40px;border-radius:50%;background:transparent;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-player-options-btn:hover{background:#ffffff1a}.mobile-player-options-btn:disabled{opacity:.4;cursor:default}.mobile-player-bottom{display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:absolute;bottom:max(20px,env(safe-area-inset-bottom));left:0;right:0;z-index:1}.mobile-player-queue-btn{position:relative;width:44px;height:44px;border-radius:50%;background:#ffffff1a;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-player-queue-btn:hover{background:#ffffff26;color:var(--text)}.mobile-player-queue-btn.has-items{color:var(--primary)}.mobile-queue-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;background:var(--primary);border-radius:9px;font-size:10px;font-weight:700;color:var(--bg-dark);display:flex;align-items:center;justify-content:center}.mobile-player-bottom-buttons{display:flex;align-items:center;gap:12px}.mobile-player-stop-btn{width:40px;height:40px;border-radius:50%;background:#ffffff1a;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-player-stop-btn:hover:not(:disabled){background:#f8717133;color:var(--danger)}.mobile-player-stop-btn:disabled{opacity:.4;cursor:default}.mobile-queue-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:249;opacity:0;pointer-events:none;transition:opacity .3s ease}.mobile-queue-overlay.show{opacity:1;pointer-events:auto}.mobile-queue-panel{position:fixed;bottom:0;left:0;right:0;height:75vh;background:var(--bg-dark);border-top-left-radius:20px;border-top-right-radius:20px;transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:250;display:flex;flex-direction:column;overflow:hidden}.mobile-queue-panel.show{transform:translateY(0)}.mobile-queue-handle{display:flex;justify-content:center;padding:12px;cursor:pointer}.mobile-queue-handle .handle-bar{width:40px;height:4px;background:#ffffff4d;border-radius:2px}.mobile-queue-tabs{display:flex;gap:8px;padding:0 16px 12px;border-bottom:1px solid var(--glass-border)}.mobile-queue-tabs button{flex:1;padding:10px 16px;background:transparent;border:none;border-radius:8px;color:var(--text-muted);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.mobile-queue-tabs button.active{background:#ffffff1a;color:var(--text)}.mobile-queue-content{flex:1;overflow-y:auto;padding:16px;padding-bottom:max(16px,env(safe-area-inset-bottom))}.mobile-queue-section{margin-bottom:24px}.mobile-queue-section h3{font-size:13px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 12px}.mobile-queue-current,.mobile-queue-item{display:flex;align-items:center;gap:12px;padding:8px;border-radius:8px;cursor:pointer;transition:background .15s}.mobile-queue-current:active,.mobile-queue-item:active{background:#ffffff1a}.mobile-queue-thumb{position:relative;width:48px;height:48px;border-radius:6px;overflow:hidden;flex-shrink:0}.mobile-queue-thumb img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.mobile-queue-play-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transition:opacity .15s}.mobile-queue-thumb:active .mobile-queue-play-overlay,.mobile-queue-item:active .mobile-queue-play-overlay,.mobile-queue-current:active .mobile-queue-play-overlay{opacity:1}.mobile-queue-play-overlay svg{width:20px;height:20px}.mobile-queue-info{flex:1;min-width:0}.mobile-queue-title{font-size:15px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-queue-artist{font-size:13px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-queue-duration,.mobile-queue-time-ago{font-size:12px;color:var(--text-muted);flex-shrink:0}.mobile-queue-empty{text-align:center;color:var(--text-muted);padding:24px;font-size:14px}.mobile-queue-list{display:flex;flex-direction:column;gap:4px}.mobile-bottom-sheet-overlay{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;background:#0009!important;z-index:99999!important;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.mobile-bottom-sheet{position:fixed!important;bottom:0!important;left:0!important;right:0!important;background:var(--bg-dark)!important;border-top-left-radius:20px;border-top-right-radius:20px;z-index:99999!important;padding-bottom:max(16px,env(safe-area-inset-bottom));animation:slideUp .3s cubic-bezier(.4,0,.2,1)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.mobile-bottom-sheet-handle{width:40px;height:4px;background:#ffffff4d;border-radius:2px;margin:12px auto}.mobile-bottom-sheet-header{display:flex;align-items:center;gap:12px;padding:12px 20px 16px;border-bottom:1px solid var(--glass-border)}.mobile-sheet-thumb{width:56px;height:56px;border-radius:8px;-o-object-fit:cover;object-fit:cover}.mobile-sheet-info{flex:1;min-width:0}.mobile-sheet-title{font-size:16px;font-weight:600;color:var(--text);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-sheet-artist{font-size:14px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-bottom-sheet-options{padding:8px 12px}.mobile-sheet-option{display:flex;align-items:center;gap:16px;width:100%;padding:16px 12px;background:transparent;border:none;color:var(--text);font-size:16px;font-weight:500;cursor:pointer;border-radius:12px;transition:background .15s;text-align:left}.mobile-sheet-option:active{background:#ffffff1a}.mobile-sheet-option svg{width:24px;height:24px;flex-shrink:0}.mobile-sheet-option.danger{color:#e74c3c}.mobile-sheet-option.danger svg{color:#e74c3c}.mobile-sheet-divider{height:1px;background:var(--glass-border);margin:8px 12px}.mobile-sheet-playlist-picker{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-dark);border-top-left-radius:20px;border-top-right-radius:20px;display:flex;flex-direction:column;animation:slideInFromRight .2s ease-out}@keyframes slideInFromRight{0%{transform:translate(100%)}to{transform:translate(0)}}.mobile-sheet-picker-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--glass-border);font-size:16px;font-weight:600;color:var(--text)}.mobile-sheet-picker-header .back-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text);cursor:pointer;border-radius:8px;transition:background .15s}.mobile-sheet-picker-header .back-btn:active{background:#ffffff1a}.mobile-sheet-picker-list{flex:1;overflow-y:auto;padding:8px 12px;padding-bottom:max(16px,env(safe-area-inset-bottom))}.mobile-sheet-picker-item{display:flex;align-items:center;gap:16px;width:100%;padding:14px 12px;background:transparent;border:none;color:var(--text);font-size:15px;font-weight:500;cursor:pointer;border-radius:10px;transition:background .15s;text-align:left}.mobile-sheet-picker-item:active{background:#ffffff1a}.mobile-sheet-picker-item svg{width:22px;height:22px;flex-shrink:0;color:var(--text-muted)}.mobile-sheet-picker-item.create-new{color:var(--primary)}.mobile-sheet-picker-item.create-new svg{color:var(--primary)}.player-btn.shuffle.active,.player-btn.repeat.active{color:var(--primary)}.player-btn.shuffle.active:after,.player-btn.repeat.active:after{content:"";position:absolute;bottom:-4px;left:50%;transform:translate(-50%);width:4px;height:4px;background:var(--primary);border-radius:50%}.player-btn.shuffle,.player-btn.repeat,.queue-btn{position:relative}.queue-btn.has-items{color:var(--primary)}.queue-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;background:var(--primary);border-radius:8px;font-size:10px;font-weight:700;color:var(--bg-dark);display:flex;align-items:center;justify-content:center}.queue-btn.active{color:var(--primary)}.nav-btn.disabled,.nav-btn:disabled{opacity:.4;cursor:not-allowed}.nav-btn.disabled:hover,.nav-btn:disabled:hover{background:transparent;transform:none}.queue-panel{position:fixed;top:64px;right:0;bottom:90px;width:350px;background:var(--bg-modal);border-left:1px solid var(--glass-border);display:flex;flex-direction:column;z-index:100;animation:slideInRight .2s ease-out}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.queue-panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid rgba(255,255,255,.1)}.queue-panel-header h2{font-size:16px;font-weight:700;color:var(--text);margin:0}.queue-panel-tabs{display:flex;gap:4px}.queue-tab{padding:8px 16px;background:transparent;border:none;border-radius:4px;color:var(--text-muted);font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}.queue-tab:hover{background:#ffffff12;color:var(--text)}.queue-tab.active{background:#ffffff1a;color:var(--text)}.queue-track-time-ago{font-size:12px;color:var(--text-muted);white-space:nowrap;margin-left:auto;padding-left:8px}.queue-panel-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.queue-panel-close:hover{background:#ffffff1a;color:var(--text)}.queue-panel-content{flex:1;overflow-y:auto;padding:16px}.queue-panel .queue-section{margin-bottom:24px}.queue-panel .queue-section h3{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin:0 0 12px}.queue-panel .queue-current-track{display:flex;align-items:center;gap:12px;padding:8px;background:#ffffff0d;border-radius:8px;cursor:pointer;transition:background .15s}.queue-panel .queue-current-track:hover{background:#ffffff1a}.queue-panel .queue-track-thumb-container{position:relative;flex-shrink:0}.queue-panel .queue-track-thumb-container img{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover;display:block}.queue-panel .queue-track-row .queue-track-thumb-container img{width:40px;height:40px}.queue-panel .queue-track-play-btn{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0009;border:none;border-radius:4px;color:#fff;cursor:pointer;opacity:0;transition:opacity .15s}.queue-panel .queue-track-thumb-container:hover .queue-track-play-btn,.queue-panel .queue-current-track:hover .queue-track-play-btn,.queue-panel .queue-track-row:hover .queue-track-play-btn{opacity:1}.queue-panel .queue-track-play-btn svg{width:20px;height:20px}.queue-panel .queue-track-play-btn:hover{background:#000000bf}.queue-panel .queue-track-more-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;opacity:0;transition:all .15s;flex-shrink:0}.queue-panel .queue-current-track:hover .queue-track-more-btn,.queue-panel .queue-track-row:hover .queue-track-more-btn{opacity:1}.queue-panel .queue-track-more-btn:hover{background:#ffffff1a;color:var(--text)}.queue-panel .queue-track-more-btn svg{width:18px;height:18px}.queue-panel .queue-track-info{flex:1;min-width:0}.queue-panel .queue-track-title{font-size:14px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.queue-panel .queue-track-artist{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.queue-panel .queue-empty{font-size:13px;color:var(--text-muted);text-align:center;padding:24px}.queue-panel .queue-tracks{display:flex;flex-direction:column;gap:4px}.queue-panel .queue-track-row{display:flex;align-items:center;gap:12px;padding:8px;border-radius:4px;cursor:pointer;transition:background .15s}.queue-panel .queue-track-row:hover{background:#ffffff1a}.queue-panel .queue-track-thumb{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.queue-panel .queue-track-row .queue-track-info{flex:1;min-width:0}.queue-panel .queue-track-row .queue-track-title{font-size:13px}.queue-panel .queue-track-row .queue-track-artist{font-size:11px}.context-menu button.danger{color:#f44336}.context-menu button.danger:hover{background:#f443361a}.queue-track-drag-handle{display:none}.queue-panel .queue-track-row[draggable=true]{cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;transition:background .15s,transform .15s,box-shadow .15s,opacity .15s}.queue-panel .queue-track-row[draggable=true]:hover{background:var(--glass-hover)}.queue-panel .queue-track-row[draggable=true]:active{cursor:grabbing}.queue-panel .queue-track-row.dragging{opacity:.5;transform:scale(.98);background:var(--glass-bg);box-shadow:0 4px 16px #0000004d;cursor:grabbing}.queue-panel .queue-track-row.drop-target{background:#22d3ee26}.queue-panel .queue-track-row.drop-target:after{content:"";position:absolute;left:8px;right:8px;bottom:-2px;height:2px;background:var(--primary);border-radius:1px}.queue-tracks .queue-track-row{position:relative}.mobile-queue-item{position:relative;transition:transform .2s,box-shadow .2s,background .2s,opacity .2s}.mobile-queue-item.dragging{transform:scale(1.03);background:var(--glass-bg);box-shadow:0 8px 32px #00000080;z-index:100;border:1px solid var(--primary);border-radius:8px}.mobile-queue-item.dragging:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;background:linear-gradient(135deg,rgba(34,211,238,.2),transparent);border-radius:10px;z-index:-1}.mobile-queue-item.drop-target{background:#22d3ee1a}.mobile-queue-item.drop-target:after{content:"";position:absolute;left:8px;right:8px;bottom:-3px;height:3px;background:var(--primary);border-radius:2px;box-shadow:0 0 8px var(--primary)}.mobile-queue-item.dragging .mobile-queue-play-overlay{opacity:1;background:#22d3eee6}.mobile-queue-item.dragging .mobile-queue-play-overlay svg{color:#fff}.mobile-queue-list.dragging-active .mobile-queue-item:not(.dragging):not(.drop-target){opacity:.6}.mobile-mini-swipe-area .swipe-hint{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--primary);border-radius:50%;color:#fff;z-index:10;animation:swipeHintPulse .2s ease-out;box-shadow:0 2px 8px #22d3ee66}.mobile-mini-swipe-area .swipe-hint-left{left:0}.mobile-mini-swipe-area .swipe-hint-right{right:0}@keyframes swipeHintPulse{0%{transform:translateY(-50%) scale(.8);opacity:0}to{transform:translateY(-50%) scale(1);opacity:1}}.mobile-mini-info{will-change:transform}.spotify-layout{display:grid;grid-template-columns:280px 1fr;grid-template-rows:64px 1fr 90px;grid-template-areas:"header header" "sidebar main" "player player";height:100vh;overflow:hidden;background:var(--bg-dark)}@media (max-width: 1024px){.spotify-layout{grid-template-columns:1fr;grid-template-rows:64px 1fr 90px;grid-template-areas:"header" "main" "player"}}.spotify-sidebar{grid-area:sidebar;background:#0000004d;border-right:1px solid var(--glass-border);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}@media (max-width: 1024px){.spotify-sidebar{position:fixed;left:0;top:0;bottom:0;width:280px;z-index:300;transform:translate(-100%);transition:transform .3s ease}.spotify-sidebar.open{transform:translate(0)}}.spotify-sidebar-header{padding:16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--glass-border)}.spotify-sidebar-logo{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--aurora-3));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px}.spotify-sidebar-title{font-size:16px;font-weight:700;margin:0;flex:1}.spotify-sidebar-close{display:none;width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer}@media (max-width: 1024px){.spotify-sidebar-close{display:flex;align-items:center;justify-content:center}}.spotify-sidebar-nav{padding:12px;display:flex;flex-direction:column;gap:4px}.spotify-nav-item{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:8px;background:transparent;border:none;color:var(--text-secondary);font-size:15px;font-weight:500;cursor:pointer;transition:all .15s;text-align:left;width:100%}.spotify-nav-item:hover,.spotify-nav-item.active{background:#ffffff1a;color:var(--text)}.spotify-nav-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.spotify-library{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:8px}.spotify-library-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:8px}.spotify-library-title{display:flex;align-items:center;gap:10px;color:var(--text-secondary);font-size:14px;font-weight:600}.spotify-library-add{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.spotify-library-add:hover{background:#ffffff1a;color:var(--text)}.spotify-playlists{flex:1;overflow-y:auto;padding:4px}.spotify-playlist-item{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background .15s}.spotify-playlist-item:hover{background:#ffffff1a}.spotify-playlist-item.active{background:#ffffff26}.spotify-playlist-cover{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}.spotify-playlist-cover-placeholder{display:flex;align-items:center;justify-content:center;color:var(--text-muted);background:linear-gradient(135deg,#22d3ee1a,#a855f71a)}.spotify-playlist-info{flex:1;min-width:0}.spotify-playlist-name{font-size:14px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-playlist-meta{font-size:12px;color:var(--text-muted);margin:0}.spotify-sidebar-user{padding:12px;border-top:1px solid var(--glass-border);display:flex;align-items:center;gap:12px}.spotify-user-avatar{width:32px;height:32px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.spotify-user-name{flex:1;font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-header{grid-area:header;position:sticky;top:0;z-index:100;padding:16px 24px;background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,transparent 100%);display:flex;align-items:center;gap:16px}@media (max-width: 1024px){.spotify-header{padding:12px 16px}}.spotify-header-menu{display:none;width:40px;height:40px;border-radius:50%;background:#0006;border:none;color:var(--text);cursor:pointer;align-items:center;justify-content:center}@media (max-width: 1024px){.spotify-header-menu{display:flex}}.spotify-header-nav{display:flex;gap:8px}.spotify-nav-btn{width:32px;height:32px;border-radius:50%;background:#0006;border:none;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.spotify-nav-btn:hover{background:#0009;transform:scale(1.05)}.spotify-nav-btn:disabled{opacity:.5;cursor:default;transform:none}.spotify-search-container{flex:1;max-width:400px;position:relative}.spotify-search-input{width:100%;height:40px;padding:0 16px 0 44px;border-radius:20px;border:none;background:#ffffff1a;color:var(--text);font-size:14px;outline:none;transition:all .2s}.spotify-search-input::-moz-placeholder{color:var(--text-muted)}.spotify-search-input::placeholder{color:var(--text-muted)}.spotify-search-input:focus{background:#ffffff26;box-shadow:0 0 0 2px #ffffff1a}.spotify-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.spotify-search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:24px;height:24px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center}.spotify-search-clear:hover{color:var(--text)}.spotify-search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:400px;overflow-y:auto;background:var(--bg-dropdown);border-radius:12px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #0009;animation:dropdownSlide .2s ease;z-index:200}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.spotify-search-loading{padding:24px;text-align:center;color:var(--text-muted)}.spotify-search-results{padding:8px}.spotify-search-result{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;cursor:pointer;transition:background .15s}.spotify-search-result:hover{background:#ffffff1a}.spotify-search-result-thumbnail{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}.spotify-search-result-info{flex:1;min-width:0}.spotify-search-result-title{font-size:14px;font-weight:500;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-search-result-artist{font-size:12px;color:var(--text-muted);margin:0}.spotify-search-result-duration{font-size:12px;color:var(--text-muted);flex-shrink:0}.spotify-search-result-actions{display:flex;gap:4px;flex-shrink:0}.spotify-search-action-btn{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.spotify-search-action-btn:hover{background:#ffffff26;color:var(--text)}.spotify-search-action-btn.play:hover{background:var(--primary);color:var(--bg-dark)}.spotify-user-menu{position:relative}.spotify-user-btn{display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;border-radius:20px;background:#0006;border:none;cursor:pointer;transition:background .15s}.spotify-user-btn:hover{background:#0009}.spotify-user-btn-avatar{width:28px;height:28px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.spotify-user-btn-name{font-size:13px;font-weight:600;color:var(--text)}.spotify-user-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:var(--bg-dropdown);border-radius:8px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #0009;padding:4px;animation:dropdownSlide .15s ease;z-index:200}.spotify-user-dropdown-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:4px;background:transparent;border:none;color:var(--text-secondary);font-size:14px;cursor:pointer;width:100%;text-align:left;transition:all .15s}.spotify-user-dropdown-item:hover{background:#ffffff1a;color:var(--text)}.spotify-user-dropdown-divider{height:1px;background:var(--glass-border);margin:4px 0}.spotify-main{grid-area:main;overflow:hidden;display:flex;flex-direction:column;padding:0;min-height:0}@media (max-width: 1024px){.spotify-main{padding:0}}.spotify-section{margin-bottom:32px}.spotify-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.spotify-section-title{font-size:22px;font-weight:700;margin:0}.spotify-section-link{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:color .15s}.spotify-section-link:hover{color:var(--text)}.spotify-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}@media (max-width: 640px){.spotify-cards-grid{grid-template-columns:repeat(2,1fr);gap:12px}}.spotify-card{padding:16px;background:#ffffff0d;border-radius:8px;cursor:pointer;transition:all .2s}.spotify-card:hover{background:#ffffff1a}.spotify-card-cover{aspect-ratio:1;border-radius:6px;-o-object-fit:cover;object-fit:cover;width:100%;margin-bottom:16px;background:var(--glass-bg);box-shadow:0 8px 24px #0000004d}.spotify-card-cover-placeholder{display:flex;align-items:center;justify-content:center;color:var(--text-muted);background:linear-gradient(135deg,#22d3ee1a,#a855f71a)}.spotify-card-title{font-size:15px;font-weight:600;margin:0 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-card-subtitle{font-size:13px;color:var(--text-muted);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.spotify-playlist-view{padding-bottom:120px}.spotify-playlist-hero{display:flex;align-items:flex-end;gap:24px;background:linear-gradient(180deg,rgba(40,40,60,.5) 0%,transparent 100%);margin:-24px -24px 0;padding:80px 24px 24px}@media (max-width: 768px){.spotify-playlist-hero{flex-direction:column;align-items:center;text-align:center;padding:40px 16px 24px;margin:0 -16px}}.spotify-playlist-hero-cover{width:232px;height:232px;border-radius:8px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;box-shadow:0 16px 48px #00000080;background:var(--glass-bg)}@media (max-width: 768px){.spotify-playlist-hero-cover{width:180px;height:180px}}.spotify-playlist-hero-cover-placeholder{display:flex;align-items:center;justify-content:center;color:var(--text-muted);background:linear-gradient(135deg,#22d3ee26,#a855f726)}.spotify-playlist-hero-info{flex:1;min-width:0}.spotify-playlist-hero-type{font-size:12px;font-weight:600;text-transform:uppercase;margin:0 0 8px}.spotify-playlist-hero-title{font-size:48px;font-weight:900;margin:0 0 16px;line-height:1.1}@media (max-width: 768px){.spotify-playlist-hero-title{font-size:32px}}.spotify-playlist-hero-desc{font-size:14px;color:var(--text-muted);margin:0 0 8px}.spotify-playlist-hero-meta{font-size:14px;color:var(--text-secondary);margin:0}.spotify-playlist-controls{display:flex;align-items:center;gap:16px;padding:24px 0}.spotify-play-btn{width:56px;height:56px;border-radius:50%;background:var(--primary);border:none;color:var(--bg-dark);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;box-shadow:0 8px 24px #22d3ee4d}.spotify-play-btn:hover{transform:scale(1.08);background:#5de8f9}.spotify-playlist-actions{display:flex;gap:8px}.spotify-action-btn{width:40px;height:40px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.spotify-action-btn:hover{color:var(--text)}.spotify-tracks-header{display:grid;grid-template-columns:40px 1fr 1fr 80px;gap:16px;padding:8px 16px;border-bottom:1px solid rgba(255,255,255,.1);font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}@media (max-width: 768px){.spotify-tracks-header{display:none}}.spotify-track-row{display:grid;grid-template-columns:40px 1fr 1fr 80px;gap:16px;padding:8px 16px;align-items:center;border-radius:4px;transition:background .15s}.spotify-track-row:hover{background:#ffffff1a}@media (max-width: 768px){.spotify-track-row{grid-template-columns:40px 1fr auto;padding:12px}}.spotify-track-number{font-size:14px;color:var(--text-muted);text-align:center}.spotify-track-row:hover .spotify-track-number{display:none}.spotify-track-play{display:none;width:24px;height:24px;margin:0 auto;background:transparent;border:none;color:var(--text);cursor:pointer}.spotify-track-row:hover .spotify-track-play{display:block}.spotify-track-info{display:flex;align-items:center;gap:12px;min-width:0}.spotify-track-cover{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.spotify-track-details{min-width:0}.spotify-track-title{font-size:14px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-track-artist{font-size:13px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width: 768px){.spotify-track-album{display:none}}.spotify-track-duration{font-size:14px;color:var(--text-muted);text-align:right}.spotify-track-actions{display:flex;gap:4px;opacity:0;transition:opacity .15s}.spotify-track-row:hover .spotify-track-actions{opacity:1}.search-history-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--glass-border)}.search-history-header span{font-size:14px;font-weight:600;color:var(--text)}.search-history-header button{font-size:12px;color:var(--text-muted);background:transparent;border:none;cursor:pointer}.search-history-header button:hover{color:var(--text)}.search-history{padding:8px}.search-history-item{display:flex;align-items:center;gap:8px;border-radius:4px;transition:background .15s}.search-history-item:hover{background:#ffffff1a}.history-item-btn{flex:1;display:flex;align-items:center;gap:12px;padding:8px;background:transparent;border:none;cursor:pointer;text-align:left}.history-thumbnail{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.history-thumbnail-placeholder{width:40px;height:40px;border-radius:4px;background:#ffffff1a;display:flex;align-items:center;justify-content:center;color:var(--text-muted);flex-shrink:0}.history-info{flex:1;min-width:0}.history-title{font-size:14px;font-weight:500;color:var(--text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-artist{font-size:12px;color:var(--text-muted);margin:0}.history-remove{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;opacity:0;transition:all .15s}.search-history-item:hover .history-remove{opacity:1}.history-remove:hover{color:var(--text);background:#ffffff1a}.search-view{padding:24px 0}.search-view-header{margin-bottom:24px}.search-view-header h1{font-size:24px;font-weight:700;color:var(--text);margin:0}.search-view-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 0;gap:16px}.search-view-loading p{color:var(--text-muted);font-size:14px}.search-view-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 0;text-align:center}.search-view-empty .empty-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);margin-bottom:16px}.search-view-empty .empty-icon svg{width:48px;height:48px}.search-view-empty h2{font-size:24px;font-weight:700;color:var(--text);margin:0 0 8px}.search-view-empty p{font-size:14px;color:var(--text-muted);margin:0}.search-section{margin-bottom:32px}.search-section h2{font-size:18px;font-weight:700;color:var(--text);margin:0 0 16px}.search-section-empty{text-align:center;padding:40px 20px;color:var(--text-muted)}.search-filter-tabs{display:flex;gap:8px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--glass-border)}.search-filter-tab{display:flex;align-items:center;gap:8px;padding:10px 20px;background:#ffffff0d;border:none;border-radius:20px;color:var(--text-muted);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.search-filter-tab:hover{background:#ffffff1a;color:var(--text)}.search-filter-tab.active{background:var(--text);color:var(--bg-dark)}.search-filter-tab .filter-count{background:#fff3;padding:2px 8px;border-radius:10px;font-size:12px}.search-filter-tab.active .filter-count{background:#0003}.search-tracks{display:flex;flex-direction:column}.search-track-row{display:grid;grid-template-columns:40px 1fr auto auto auto;align-items:center;gap:16px;padding:8px 16px;border-radius:4px;transition:background .15s}.search-track-row:hover{background:#ffffff1a}.search-track-row:hover .track-index .track-num{opacity:0}.search-track-row:hover .track-index-play,.search-track-row:hover .track-more-btn{opacity:1}.search-track-main{flex:1;display:flex;align-items:center;gap:12px;min-width:0}.search-track-thumb{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.search-track-info{flex:1;min-width:0}.search-track-title{font-size:15px;font-weight:500;color:var(--text);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-track-artist{font-size:13px;color:var(--text-muted);margin:0}.search-track-duration{font-size:13px;color:var(--text-muted);min-width:50px;text-align:right}.search-track-actions{display:flex;align-items:center;gap:8px;opacity:0;transition:opacity .15s}.search-track-row:hover .search-track-actions{opacity:1}.action-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.action-btn:hover{color:var(--text);background:#ffffff1a}.action-btn.play:hover{background:var(--primary);color:var(--bg-dark)}.add-to-playlist-container{position:relative}.add-playlist-dropdown{position:absolute;right:0;top:100%;background:#1e1e28fa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:4px;box-shadow:0 16px 48px #00000080;min-width:200px;z-index:100;overflow:hidden}.add-playlist-dropdown .dropdown-header{padding:12px 16px;font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--glass-border)}.add-playlist-dropdown button{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;background:transparent;border:none;color:var(--text);font-size:14px;text-align:left;cursor:pointer}.add-playlist-dropdown button:hover{background:#ffffff1a}.dropdown-playlist-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:4px;color:var(--text-muted)}.dropdown-playlist-icon.new{background:var(--primary);color:var(--bg-dark)}.add-playlist-dropdown .dropdown-divider{height:1px;background:var(--glass-border);margin:4px 0}.add-playlist-dropdown .create-new-playlist-btn{color:var(--primary);font-weight:500}.search-playlists-section{margin-bottom:32px}.search-yt-playlists{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.search-yt-playlist-card{background:var(--glass-bg);border-radius:8px;overflow:hidden;transition:all .2s ease;border:1px solid transparent}.search-yt-playlist-card:hover{background:#ffffff1a;border-color:var(--glass-border);transform:translateY(-2px)}.yt-playlist-thumb{position:relative;aspect-ratio:16/9;overflow:hidden}.yt-playlist-thumb img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.yt-playlist-count{position:absolute;bottom:8px;right:8px;display:flex;align-items:center;gap:4px;background:#000c;padding:4px 8px;border-radius:4px;font-size:11px;color:var(--text)}.yt-playlist-count svg{width:12px;height:12px}.yt-playlist-info{padding:12px}.yt-playlist-title{font-size:14px;font-weight:600;color:var(--text);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.yt-playlist-owner{font-size:12px;color:var(--text-muted);margin:0}.yt-playlist-actions{display:flex;gap:8px;padding:0 12px 12px}.yt-playlist-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:none;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}.yt-playlist-btn.play{background:var(--primary);color:var(--bg-dark)}.yt-playlist-btn.play:hover{background:var(--primary-hover);transform:scale(1.02)}.yt-playlist-btn.save{background:#ffffff1a;color:var(--text)}.yt-playlist-btn.save:hover{background:#fff3}.yt-playlist-btn.save:disabled{opacity:.6;cursor:not-allowed}.yt-playlist-btn svg{width:16px;height:16px}.saving-spinner{width:16px;height:16px;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}.btn-loader{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}.btn-loader.small{width:14px;height:14px}.playlist-card.loading .playlist-card-play,.search-yt-playlist-card.loading .yt-playlist-btn.play{background:var(--primary);opacity:1}.playlist-card.loading .playlist-card-cover:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0006;border-radius:8px}@media (max-width: 768px){.search-view-header h1{font-size:20px}.search-filter-tabs{gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.search-filter-tabs::-webkit-scrollbar{display:none}.search-filter-tab{padding:8px 16px;font-size:13px;white-space:nowrap}.search-tracks{scrollbar-width:none;-ms-overflow-style:none}.search-tracks::-webkit-scrollbar{display:none}.search-track-row{grid-template-columns:1fr 40px;gap:12px;padding:12px 8px;cursor:pointer;border-radius:8px}.search-track-row:active{background:#ffffff26}.search-track-row .track-index,.search-track-row .track-views,.search-track-row .search-track-duration,.search-track-row .add-to-playlist-container{display:none}.search-track-actions{opacity:1}.search-track-main{flex:1;min-width:0}.search-track-thumb{width:52px;height:52px;border-radius:6px}.search-track-title{font-size:15px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal}.search-track-artist{font-size:13px}.search-track-row .track-more-btn{opacity:1;width:40px;height:40px}.search-yt-playlists{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}}.playlist-loading-banner{display:flex;align-items:center;gap:12px;padding:16px 24px;background:#22d3ee1a;border-radius:8px;margin-bottom:16px;color:var(--primary)}.playlist-loading-banner span{font-size:14px;font-weight:500}.play-btn-large.loading{opacity:.7;cursor:wait}.play-btn-large:disabled,.shuffle-btn:disabled{opacity:.5;cursor:not-allowed}.spotify-sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:299;display:none}@media (max-width: 1024px){.spotify-sidebar-overlay.visible{display:block}}.spotify-now-playing-card{background:linear-gradient(135deg,#22d3ee26,#a855f726);border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px}.spotify-now-playing-art{width:80px;height:80px;border-radius:8px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;box-shadow:0 8px 24px #0000004d}.spotify-now-playing-info{flex:1;min-width:0}.spotify-now-playing-label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--primary);margin:0 0 4px}.spotify-now-playing-title{font-size:16px;font-weight:600;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-now-playing-artist{font-size:14px;color:var(--text-muted);margin:0}.spotify-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-dark)}.spotify-loader{width:48px;height:48px;border:3px solid var(--glass-border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.spotify-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-dark);color:var(--text);gap:16px}.spotify-error button{padding:12px 24px;background:var(--primary);border:none;border-radius:20px;color:var(--bg-dark);font-weight:600;cursor:pointer}.spotify-sidebar .library-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px}.spotify-sidebar .library-title{display:flex;align-items:center;gap:12px;color:var(--text-muted);font-size:14px;font-weight:600}.spotify-sidebar .library-add-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.spotify-sidebar .library-add-btn:hover{color:var(--text);background:#ffffff1a}.spotify-sidebar .library-search{padding:0 12px 8px}.spotify-sidebar .library-search-input{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ffffff14;border:1px solid transparent;border-radius:8px;transition:all .2s}.spotify-sidebar .library-search-input:focus-within{background:#ffffff1f;border-color:var(--glass-border-hover)}.spotify-sidebar .library-search-input svg{width:16px;height:16px;color:var(--text-muted);flex-shrink:0}.spotify-sidebar .library-search-input input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:13px;min-width:0}.spotify-sidebar .library-search-input input::-moz-placeholder{color:var(--text-muted)}.spotify-sidebar .library-search-input input::placeholder{color:var(--text-muted)}.spotify-sidebar .library-search-clear{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:#ffffff1a;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.spotify-sidebar .library-search-clear:hover{background:#fff3;color:var(--text)}.spotify-sidebar .library-search-clear svg{width:12px;height:12px}.spotify-sidebar .library-no-results{padding:16px;text-align:center;color:var(--text-muted);font-size:13px}.spotify-sidebar .library-list{flex:1;overflow-y:auto;padding:8px}.spotify-sidebar .library-empty{text-align:center;padding:24px 16px;color:var(--text-muted)}.spotify-sidebar .library-empty p{margin:0 0 16px}.spotify-sidebar .create-playlist-btn{padding:10px 20px;background:var(--text);border:none;border-radius:20px;color:var(--bg-dark);font-size:13px;font-weight:600;cursor:pointer}.spotify-sidebar .create-playlist-btn:hover{transform:scale(1.02)}.spotify-sidebar .playlist-item{display:flex;align-items:center;gap:12px;width:100%;padding:8px;background:transparent;border:none;border-radius:6px;cursor:pointer;transition:background .15s;text-align:left}.spotify-sidebar .playlist-item:hover{background:#ffffff1a}.spotify-sidebar .playlist-item.active{background:#ffffff26}.spotify-sidebar .playlist-cover{width:48px;height:48px;border-radius:4px;overflow:hidden;flex-shrink:0;background:var(--glass-bg)}.spotify-sidebar .playlist-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.spotify-sidebar .playlist-cover-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#22d3ee1a,#a855f71a);color:var(--text-muted)}.spotify-sidebar .playlist-info{flex:1;min-width:0}.spotify-sidebar .playlist-name{font-size:14px;font-weight:500;color:var(--text);margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-sidebar .playlist-meta{font-size:12px;color:var(--text-muted);margin:0}.spotify-top-header{grid-area:header;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:#0009;border-bottom:1px solid var(--glass-border);z-index:500;position:sticky;top:0}.spotify-top-header .header-left{display:flex;align-items:center;gap:8px}.spotify-top-header .header-center{display:flex;align-items:center;gap:12px;flex:1;max-width:600px;margin:0 24px}.spotify-top-header .header-right{display:flex;align-items:center;gap:16px}.listeners-indicator-container{position:relative}.listeners-indicator{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffff14;border:1px solid var(--glass-border);border-radius:20px;color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.listeners-indicator svg{width:16px;height:16px}.listeners-indicator.disconnected{opacity:.6;cursor:default}.listeners-indicator.connected{background:#22c55e26;border-color:#22c55e4d;color:#22c55e}.listeners-indicator.playing{background:#22c55e33;border-color:#22c55e;color:#22c55e;animation:pulse-green 2s ease-in-out infinite}@keyframes pulse-green{0%,to{box-shadow:0 0 #22c55e66}50%{box-shadow:0 0 0 8px #22c55e00}}.listeners-indicator:hover:not(.disconnected){background:#22c55e40}.listeners-indicator-container .listeners-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;z-index:400}.spotify-top-header .nav-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#ffffff12;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.spotify-top-header .nav-btn:hover{background:#ffffff1a;color:var(--text)}.spotify-top-header .home-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffff12;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s;flex-shrink:0}.spotify-top-header .home-btn:hover{background:#ffffff1a;color:var(--text)}.spotify-top-header .home-btn.active{background:var(--text);color:var(--bg-dark)}.spotify-top-header .search-container{flex:1;position:relative}.spotify-top-header .search-input-wrapper{display:flex;align-items:center;gap:12px;padding:0 16px;height:40px;background:#ffffff1a;border-radius:20px;transition:all .2s}.spotify-top-header .search-input-wrapper:focus-within{background:#ffffff26;box-shadow:0 0 0 2px #ffffff1a}.spotify-top-header .search-input-wrapper svg{flex-shrink:0;color:var(--text-muted)}.spotify-top-header .search-input-wrapper input{flex:1;background:transparent;border:none;color:var(--text);font-size:14px;outline:none}.spotify-top-header .search-input-wrapper input::-moz-placeholder{color:var(--text-muted)}.spotify-top-header .search-input-wrapper input::placeholder{color:var(--text-muted)}.spotify-top-header .search-clear{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:4px;display:flex}.spotify-top-header .search-clear:hover{color:var(--text)}.spotify-top-header .search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:400px;overflow-y:auto;background:var(--bg-dropdown);border-radius:8px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #0009;z-index:200}.spotify-top-header .search-loading,.spotify-top-header .search-empty{padding:24px;text-align:center;color:var(--text-muted)}.spotify-top-header .search-results{padding:8px}.spotify-top-header .search-result-item{display:flex;align-items:center;gap:12px;padding:8px;border-radius:4px;transition:background .15s}.spotify-top-header .search-result-item:hover{background:#ffffff1a}.spotify-top-header .result-thumbnail{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.spotify-top-header .result-info{flex:1;min-width:0}.spotify-top-header .result-title{font-size:14px;font-weight:500;color:var(--text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-top-header .result-artist{font-size:12px;color:var(--text-muted);margin:0}.spotify-top-header .result-actions{display:flex;align-items:center;gap:8px}.spotify-top-header .result-play-btn,.spotify-top-header .result-add-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.spotify-top-header .result-play-btn:hover{background:var(--primary);color:var(--bg-dark)}.spotify-top-header .result-add-btn:hover{color:var(--text)}.spotify-top-header .result-add-dropdown{position:relative}.spotify-top-header .add-dropdown-content{display:none;position:absolute;right:0;top:100%;background:#1e1e28fa;border-radius:4px;box-shadow:0 8px 24px #0006;min-width:180px;z-index:201;padding:4px}.spotify-top-header .result-add-dropdown:hover .add-dropdown-content{display:block}.spotify-top-header .add-dropdown-content button{display:block;width:100%;padding:10px 12px;background:transparent;border:none;color:var(--text);font-size:13px;text-align:left;cursor:pointer;border-radius:2px}.spotify-top-header .add-dropdown-content button:hover{background:#ffffff1a}.spotify-top-header .user-avatar-btn{width:32px;height:32px;padding:0;background:transparent;border:none;border-radius:50%;cursor:pointer;overflow:hidden;transition:all .15s}.spotify-top-header .user-avatar-btn:hover{transform:scale(1.05)}.spotify-top-header .user-avatar{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.spotify-top-header .user-avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--primary);color:var(--bg-dark);font-size:14px;font-weight:600}.spotify-top-header .user-menu-container{position:relative;display:flex;align-items:center}.spotify-top-header .user-dropdown{position:fixed;right:16px;top:52px;background:var(--bg-dropdown);border:1px solid var(--glass-border);border-radius:8px;box-shadow:0 16px 48px #0009;min-width:200px;padding:4px;z-index:10000}.spotify-top-header .user-dropdown button{display:flex;align-items:center;gap:12px;width:100%;padding:12px;background:transparent;border:none;color:var(--text);font-size:14px;cursor:pointer;border-radius:2px}.spotify-top-header .user-dropdown button:hover{background:#ffffff1a}.spotify-top-header .user-dropdown .dropdown-divider{height:1px;background:var(--glass-border);margin:4px 0}.spotify-top-header .user-dropdown .logout-btn:hover{background:#ef444433;color:#ef4444}.spotify-header{display:flex;align-items:center;gap:16px;padding:16px 32px;background:linear-gradient(180deg,rgba(0,0,0,.6) 0%,transparent 100%);position:sticky;top:0;z-index:100}.spotify-header .header-nav{display:flex;gap:8px}.spotify-header .nav-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#00000080;border:none;border-radius:50%;color:var(--text);cursor:pointer;transition:all .15s}.spotify-header .nav-btn:hover{background:#000000b3;transform:scale(1.05)}.spotify-header .search-container{flex:1;max-width:400px;position:relative}.spotify-header .search-input-wrapper{display:flex;align-items:center;gap:12px;padding:0 16px;height:40px;background:#ffffff1a;border-radius:20px;transition:all .2s}.spotify-header .search-input-wrapper:focus-within{background:#ffffff26;box-shadow:0 0 0 2px #ffffff1a}.spotify-header .search-input-wrapper svg{flex-shrink:0;color:var(--text-muted)}.spotify-header .search-input-wrapper input{flex:1;background:transparent;border:none;color:var(--text);font-size:14px;outline:none}.spotify-header .search-input-wrapper input::-moz-placeholder{color:var(--text-muted)}.spotify-header .search-input-wrapper input::placeholder{color:var(--text-muted)}.spotify-header .search-clear{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:4px;display:flex}.spotify-header .search-clear:hover{color:var(--text)}.spotify-header .search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:400px;overflow-y:auto;background:var(--bg-dropdown);border-radius:12px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #0009;z-index:200}.spotify-header .search-loading,.spotify-header .search-empty{padding:24px;text-align:center;color:var(--text-muted)}.spotify-header .search-results{padding:8px}.spotify-header .search-result-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;transition:background .15s}.spotify-header .search-result-item:hover{background:#ffffff1a}.spotify-header .result-thumbnail{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}.spotify-header .result-info{flex:1;min-width:0}.spotify-header .result-title{font-size:14px;font-weight:500;color:var(--text);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-header .result-artist{font-size:12px;color:var(--text-muted);margin:0}.spotify-header .result-actions{display:flex;gap:4px;flex-shrink:0}.spotify-header .result-play-btn,.spotify-header .result-add-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.spotify-header .result-play-btn:hover{background:var(--primary);color:var(--bg-dark)}.spotify-header .result-add-btn:hover{background:#ffffff26;color:var(--text)}.spotify-header .result-add-dropdown{position:relative}.spotify-header .add-dropdown-content{display:none;position:absolute;top:100%;right:0;min-width:180px;background:#1e1e28fa;border-radius:8px;border:1px solid var(--glass-border);box-shadow:0 8px 24px #0006;z-index:300;padding:4px}.spotify-header .result-add-dropdown:hover .add-dropdown-content{display:block}.spotify-header .add-dropdown-content button{display:block;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:4px;color:var(--text-secondary);font-size:14px;text-align:left;cursor:pointer;transition:background .15s}.spotify-header .add-dropdown-content button:hover{background:#ffffff1a;color:var(--text)}.spotify-header .user-menu-container{position:relative}.spotify-header .user-menu-btn{display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;background:#00000080;border:none;border-radius:20px;cursor:pointer;transition:background .15s}.spotify-header .user-menu-btn:hover{background:#000000b3}.spotify-header .user-avatar{width:28px;height:28px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.spotify-header .user-avatar-placeholder{width:28px;height:28px;border-radius:50%;background:var(--primary);color:var(--bg-dark);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}.spotify-header .user-name{font-size:13px;font-weight:600;color:var(--text)}.spotify-header .user-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:var(--bg-dropdown);border-radius:8px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #0009;padding:4px;z-index:200}.spotify-header .user-dropdown button{display:flex;align-items:center;gap:12px;width:100%;padding:12px;background:transparent;border:none;border-radius:4px;color:var(--text-secondary);font-size:14px;cursor:pointer;transition:all .15s}.spotify-header .user-dropdown button:hover{background:#ffffff1a;color:var(--text)}.spotify-header .dropdown-divider{height:1px;background:var(--glass-border);margin:4px 0}.spotify-header .logout-btn:hover{color:var(--danger)!important}.content-area{flex:1;min-height:0;overflow:hidden;padding:0;display:flex;flex-direction:column}.content-area>*{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 24px 120px}.home-view{padding-top:16px}.home-section{margin-bottom:32px}.home-section h2{font-size:22px;font-weight:700;margin:0 0 16px}.now-playing-card{display:flex;align-items:center;gap:16px;padding:16px;background:linear-gradient(135deg,#22d3ee26,#a855f726);border-radius:12px}.now-playing-card img{width:80px;height:80px;border-radius:8px;-o-object-fit:cover;object-fit:cover;box-shadow:0 8px 24px #0000004d}.now-playing-card .np-info{flex:1;min-width:0}.now-playing-card .np-title{font-size:16px;font-weight:600;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.now-playing-card .np-artist{font-size:14px;color:var(--text-muted);margin:0}.now-playing-card .np-status{padding:6px 12px;border-radius:12px;font-size:12px;font-weight:600}.now-playing-card .np-status.playing{background:#22d3ee33;color:var(--primary)}.now-playing-card .np-status.paused{background:#fbbf2433;color:var(--warning)}.playlist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.playlist-card{padding:12px;background:transparent;border-radius:8px;cursor:pointer;transition:all .2s}.playlist-card:hover{background:#ffffff14}.playlist-card-cover{position:relative;aspect-ratio:1;margin-bottom:10px;border-radius:6px;overflow:hidden;background:var(--glass-bg);box-shadow:0 8px 24px #0000004d}.playlist-card-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.playlist-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#22d3ee1a,#a855f71a);color:var(--text-muted)}.playlist-card-play{position:absolute;right:8px;bottom:8px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--primary);border:none;border-radius:50%;color:var(--bg-dark);cursor:pointer;opacity:0;transform:translateY(8px);transition:all .2s;box-shadow:0 8px 16px #0000004d}.playlist-card:hover .playlist-card-play{opacity:1;transform:translateY(0)}.playlist-card-play:hover{transform:scale(1.08)}.playlist-card-count{position:absolute;left:8px;bottom:8px;display:flex;align-items:center;gap:4px;padding:4px 8px;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:6px;font-size:12px;font-weight:500;color:#fff}.playlist-card-count svg{width:12px;height:12px;opacity:.8}.playlist-card-name{font-size:15px;font-weight:600;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-card-meta{font-size:13px;color:var(--text-muted);margin:0}.playlist-card.discover{border:1px solid rgba(168,85,247,.2)}.trending-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px}.trending-card{cursor:pointer;transition:all .2s}.trending-card:hover{transform:translateY(-4px)}.trending-card-cover{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;margin-bottom:10px;box-shadow:0 4px 12px #0000004d}.trending-card-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.trending-card-play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000080;border:none;color:#fff;cursor:pointer;opacity:0;transition:opacity .2s}.trending-card:hover .trending-card-play{opacity:1}.trending-card-play svg{width:40px;height:40px}.trending-card-title{font-size:14px;font-weight:500;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trending-card-artist{font-size:12px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.simple-playlist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}.simple-playlist-card{cursor:pointer;transition:all .2s}.simple-playlist-card:hover{transform:translateY(-4px)}.simple-playlist-cover{position:relative;aspect-ratio:1/1;border-radius:8px;overflow:hidden;margin-bottom:10px;box-shadow:0 4px 12px #0000004d}.simple-playlist-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.simple-playlist-count{position:absolute;bottom:8px;right:8px;display:flex;align-items:center;gap:4px;background:#000c;padding:4px 8px;border-radius:4px;font-size:11px;color:var(--text)}.simple-playlist-count svg{width:12px;height:12px}.simple-playlist-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0009}.simple-playlist-title{font-size:14px;font-weight:500;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}.album-year{color:var(--text-muted);font-weight:400;font-size:13px}.section-icon{display:inline-flex;align-items:center;margin-right:8px;vertical-align:middle}.section-icon.spotify-icon{color:#1db954}.section-icon.youtube-icon{color:red}.home-section h2{display:flex;align-items:center}.temp-playlist .playlist-header{position:relative}.temp-playlist .back-btn{position:absolute;top:0;left:0;background:#00000080;border:none;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:background .2s;z-index:10}.temp-playlist .back-btn:hover{background:#000000b3}.playlist-source-badge{position:absolute;bottom:8px;right:8px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center}.playlist-source-badge.spotify{background:#1db954;color:#fff}.temp-playlist .playlist-actions{display:flex;gap:12px;margin-bottom:24px}.temp-playlist .save-btn{display:flex;align-items:center;gap:8px;background:transparent;color:var(--text-primary);border:1px solid var(--border-color);border-radius:24px;padding:12px 24px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s,border-color .2s}.temp-playlist .save-btn:hover{background:#ffffff1a;border-color:var(--text-primary)}.playlist-card.spotify-playlist{position:relative}.playlist-card-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000080;border-radius:8px}.queue-list{display:flex;flex-direction:column;gap:8px}.queue-item{display:flex;align-items:center;gap:12px;padding:8px;border-radius:6px;transition:background .15s}.queue-item:hover{background:#ffffff0d}.queue-num{width:24px;font-size:14px;color:var(--text-muted);text-align:center}.queue-thumb{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.queue-info{flex:1;min-width:0}.queue-title{font-size:14px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-artist{font-size:12px;color:var(--text-muted);margin:0}.queue-duration{font-size:13px;color:var(--text-muted)}.home-empty{text-align:center;padding:80px 24px}.home-empty .empty-icon{margin-bottom:16px;opacity:.5}.home-empty .empty-icon svg{width:64px;height:64px}.home-empty h2{font-size:24px;font-weight:700;margin:0 0 8px}.home-empty p{font-size:14px;color:var(--text-muted);margin:0}.playlist-view{padding-top:24px;position:relative;z-index:101}.playlist-sticky-header{position:fixed;top:63px;left:280px;right:0;height:64px;display:flex;align-items:center;gap:16px;padding:0 24px;z-index:90;background-color:var(--bg-dark);opacity:0;visibility:hidden;transform:translateY(-20px);transition:opacity .2s,transform .2s,visibility .2s,right .2s ease-out}.playlist-sticky-header.visible{opacity:1;visibility:visible;transform:translateY(0)}.playlist-sticky-header .play-btn-large{width:48px;height:48px;flex-shrink:0}.playlist-sticky-title{font-size:24px;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-blur-bg{position:absolute;top:0;left:-24px;right:-24px;height:400px;background-size:cover;background-position:center;filter:blur(60px) saturate(1.2);opacity:.4;transform:scale(1.2);z-index:0;pointer-events:none}.playlist-blur-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(5,10,20,.1) 0%,rgba(5,10,20,.3) 40%,rgba(5,10,20,.7) 70%,var(--bg-base) 100%)}.playlist-header{position:relative;z-index:1;display:flex;align-items:flex-end;gap:24px;padding-bottom:24px}.playlist-cover-large{width:232px;height:232px;border-radius:8px;overflow:hidden;flex-shrink:0;box-shadow:0 16px 48px #00000080;background:var(--glass-bg)}.playlist-cover-large img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.playlist-cover-placeholder-large{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#22d3ee26,#a855f726);color:var(--text-muted)}.playlist-cover-placeholder-large svg{width:64px;height:64px}.playlist-header-info{flex:1;min-width:0}.playlist-type{font-size:12px;font-weight:600;text-transform:uppercase}.playlist-title{font-size:48px;font-weight:900;margin:8px 0 16px;line-height:1.1}.playlist-desc{font-size:14px;color:var(--text-muted);margin:0 0 8px}.playlist-meta-info{font-size:14px;color:var(--text-secondary);margin:0}.playlist-actions{display:flex;align-items:center;gap:16px;padding:24px 0;position:relative;z-index:50}.play-btn-large{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--primary);border:none;border-radius:50%;color:var(--bg-dark);cursor:pointer;transition:all .15s;box-shadow:0 8px 24px #22d3ee4d}.play-btn-large:hover:not(:disabled){transform:scale(1.08)}.play-btn-large:disabled{opacity:.5;cursor:default}.shuffle-btn,.delete-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.shuffle-btn:hover:not(:disabled),.delete-btn:hover{color:var(--text)}.delete-btn:hover{color:var(--danger)}.shuffle-btn:disabled{opacity:.5;cursor:default}.save-to-library-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.save-to-library-btn:hover:not(:disabled){color:var(--primary);background:#22d3ee1a}.save-to-library-btn:disabled{opacity:.5;cursor:default}.save-to-library-btn svg{width:22px;height:22px}.temp-playlist-menu-container,.playlist-menu-container{position:relative}.temp-playlist-menu,.playlist-options-menu{position:absolute;top:0;left:100%;margin-left:8px;background:var(--bg-dropdown);border:1px solid var(--glass-border);border-radius:8px;padding:8px 0;min-width:200px;z-index:1000;box-shadow:0 8px 24px #0009}.temp-playlist-menu button,.playlist-options-menu button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;background:transparent;border:none;color:var(--text);font-size:14px;cursor:pointer;transition:background .15s}.temp-playlist-menu button:hover,.playlist-options-menu button:hover{background:#ffffff1a}.temp-playlist-menu button svg,.playlist-options-menu button svg{width:16px;height:16px;color:var(--text-muted)}.playlist-options-menu button.danger{color:#ef4444}.playlist-options-menu button.danger svg{color:#ef4444}.temp-playlist-menu .menu-divider,.playlist-options-menu .menu-divider{height:1px;background:var(--glass-border);margin:8px 0}.playlist-empty{text-align:center;padding:60px 24px;color:var(--text-muted)}.playlist-empty p{margin:0}.playlist-empty-hint{margin-top:8px!important;font-size:14px}.playlist-tracks{margin-top:16px;position:relative;z-index:1}.tracks-header{display:grid;grid-template-columns:40px 1fr 120px 60px 40px;gap:16px;padding:8px 16px;border-bottom:1px solid rgba(255,255,255,.1);font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;align-items:center}.tracks-header.sticky{position:sticky;top:-1px;background:var(--bg-dark);z-index:40;margin:0 -24px;padding:8px 40px}.tracks-header.sticky.fixed{position:fixed;top:127px;left:280px;right:0;margin:0;padding:8px 40px;transition:right .2s ease-out}.queue-open .playlist-sticky-header,.queue-open .tracks-header.sticky.fixed{right:350px}.track-header-num{text-align:center}.track-header-title,.track-header-date{text-align:left}.track-header-duration{text-align:right;display:flex;justify-content:flex-end}.track-row{display:grid;grid-template-columns:40px 1fr 120px 60px 40px;gap:16px;padding:8px 16px;align-items:center;border-radius:4px;transition:background .15s}.track-date{font-size:13px;color:var(--text-muted);text-align:left}.track-row:hover{background:#ffffff1a}.track-index{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.track-num{font-size:14px;color:var(--text-muted);text-align:center;transition:opacity .15s}.track-index-play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text);cursor:pointer;opacity:0;transition:opacity .15s}.track-index-play svg{width:16px;height:16px}.track-row:hover .track-index .track-num{opacity:0}.track-row:hover .track-index-play{opacity:1}.track-more-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;opacity:0;transition:all .15s}.track-row:hover .track-more-btn{opacity:1}.track-more-btn:hover{color:var(--text);background:#ffffff1a}.track-views{font-size:13px;color:var(--text-muted);text-align:right;min-width:60px}.track-main{display:flex;align-items:center;gap:12px;min-width:0}.track-thumb{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.track-info{min-width:0}.track-name{font-size:14px;font-weight:500;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-artist{font-size:13px;color:var(--text-muted);margin:0}.track-actions{display:flex;gap:4px;opacity:0;transition:opacity .15s}.track-row:hover .track-actions{opacity:1}.track-actions button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.track-actions button:hover{color:var(--text);background:#ffffff1a}.track-duration{font-size:14px;color:var(--text-muted);text-align:right}@media (max-width: 768px){.playlist-view{padding-top:80px}.playlist-blur-bg{left:-16px;right:-16px;height:350px;filter:blur(50px) saturate(1.3);opacity:.5}.playlist-header{flex-direction:column;align-items:center;text-align:center}.playlist-header-info{text-align:center}.playlist-title{font-size:24px!important}.playlist-actions{justify-content:space-between;width:100%;padding:16px 0}.playlist-options-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:0;color:var(--text-muted);cursor:pointer}.playlist-actions-left{display:flex;align-items:center;gap:8px}.playlist-actions-left .save-to-library-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:0;color:var(--text-muted);cursor:pointer}.playlist-actions-right{display:flex;align-items:center;gap:12px}.playlist-actions-right .shuffle-btn{width:44px;height:44px;background:transparent;border-radius:0}.playlist-actions-right .play-btn-large{width:48px;height:48px}.playlist-actions-left .temp-playlist-menu{left:0;right:auto}.tracks-header{display:none}.playlist-tracks{scrollbar-width:none;-ms-overflow-style:none}.playlist-tracks::-webkit-scrollbar{display:none}.track-row{grid-template-columns:1fr 40px;gap:12px;padding:12px 4px 12px 8px;border-radius:8px}.track-row .track-index,.track-row .track-date,.track-row .track-duration{display:none}.track-main{flex:1;min-width:0}.track-thumb{width:48px;height:48px;border-radius:6px}.track-name{font-size:15px;line-height:1.3}.track-more-btn{opacity:1;width:40px;height:40px}}.settings-view{padding-top:16px}.settings-view h1{font-size:32px;font-weight:700;margin:0 0 24px}.settings-tabs{display:flex;gap:8px;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--glass-border)}.settings-tabs button{display:flex;align-items:center;gap:8px;padding:12px 20px;background:transparent;border:none;border-radius:20px;color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;transition:all .15s}.settings-tabs button:hover{color:var(--text);background:#ffffff0d}.settings-tabs button.active{color:var(--bg-dark);background:var(--text)}.settings-content{padding-top:8px}.themes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.theme-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;overflow:hidden;transition:all .2s}.theme-card:hover{border-color:#fff3}.theme-card.active{border-color:var(--primary)}.theme-preview{height:100px;padding:16px;display:flex;align-items:flex-end}.theme-colors{display:flex;gap:8px}.theme-colors span{width:24px;height:24px;border-radius:50%;border:2px solid rgba(255,255,255,.2)}.theme-info{padding:12px 16px;display:flex;align-items:center;justify-content:space-between}.theme-name{font-size:14px;font-weight:500;margin:0}.theme-active-badge{font-size:12px;color:var(--primary);font-weight:600}.theme-info button{padding:6px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;color:var(--text);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.theme-info button:hover{border-color:var(--primary);color:var(--primary)}.users-list{display:flex;flex-direction:column;gap:8px}.users-empty{color:var(--text-muted);text-align:center;padding:40px}.user-row .user-avatar{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.user-row .user-info p{margin:0;font-size:14px;font-weight:500}.role-badge{padding:4px 8px;border-radius:8px;font-size:11px;font-weight:600;text-transform:uppercase}.role-admin{background:#22d3ee26;color:var(--primary)}.role-user{background:#34d39926;color:var(--success)}.role-blocked{background:#f8717126;color:var(--danger)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}.stat-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:20px;text-align:center}.stat-value{font-size:32px;font-weight:700;margin:0 0 4px;color:var(--primary)}.stat-label{font-size:13px;color:var(--text-muted);margin:0}.stat-section{grid-column:1 / -1;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:20px}.stat-section h3{font-size:16px;font-weight:600;margin:0 0 16px}.stat-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--glass-border)}.stat-row:last-child{border-bottom:none}.stat-rank{width:24px;font-size:14px;font-weight:600;color:var(--text-muted)}.stat-name{flex:1;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-count{font-size:13px;color:var(--text-muted)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.section-header h2{font-size:20px;font-weight:600;margin:0}.create-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--primary);border:none;border-radius:20px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s}.create-btn:hover{transform:scale(1.02);filter:brightness(1.1)}.theme-actions{display:flex;align-items:center;gap:8px}.theme-actions .edit-btn{padding:4px 10px;font-size:11px}.theme-actions .delete-btn{padding:4px 8px;background:transparent;border:1px solid rgba(248,113,113,.3);color:#f87171}.theme-actions .delete-btn:hover{background:#f871711a;border-color:#f87171}.user-row{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--glass-bg);border-radius:8px}.user-row .user-info{flex:1;display:flex;align-items:center;gap:12px}.role-select{padding:6px 10px;border-radius:8px;border:1px solid var(--glass-border);background:var(--glass-bg);color:var(--text);font-size:12px;font-weight:500;cursor:pointer}.role-select.role-admin{border-color:#22d3ee4d;color:var(--primary)}.role-select.role-blocked{border-color:#f871714d;color:#f87171}.remove-user-btn{padding:8px;background:transparent;border:none;border-radius:8px;color:var(--text-muted);cursor:pointer;transition:all .15s}.remove-user-btn:hover{background:#f871711a;color:#f87171}.theme-editor-modal{max-width:800px;width:90vw}.theme-editor-layout{display:grid;grid-template-columns:1fr 280px;gap:24px}@media (max-width: 700px){.theme-editor-layout{grid-template-columns:1fr}}.theme-editor-form .form-group{margin-bottom:20px}.theme-editor-form .form-group label{display:block;font-size:14px;font-weight:500;margin-bottom:8px;color:var(--text-muted)}.theme-editor-form .form-group input[type=text]{width:100%;padding:12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:8px;color:var(--text);font-size:14px}.color-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.color-field label{display:block;font-size:12px;font-weight:500;margin-bottom:6px;color:var(--text-muted)}.color-input-wrapper{display:flex;gap:8px;align-items:center}.color-input-wrapper input[type=color]{width:40px;height:40px;border:none;border-radius:8px;cursor:pointer;background:transparent}.color-input-wrapper input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-input-wrapper input[type=color]::-webkit-color-swatch{border:2px solid var(--glass-border);border-radius:6px}.color-input-wrapper input[type=text]{flex:1;padding:8px 10px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:6px;color:var(--text);font-size:13px;font-family:monospace}.theme-preview-panel h3{font-size:14px;font-weight:600;margin:0 0 12px;color:var(--text-muted)}.theme-preview-box{border-radius:12px;padding:20px;min-height:200px;border:1px solid var(--glass-border)}.preview-card{border-radius:8px;padding:16px}.preview-title{font-size:16px;font-weight:600;margin-bottom:4px}.preview-subtitle{font-size:13px;margin-bottom:16px}.preview-button{display:inline-block;padding:8px 16px;border-radius:20px;font-size:13px;font-weight:500;color:#fff}.preview-accent{width:100%;height:4px;border-radius:2px;margin-top:16px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid var(--glass-border)}.modal-footer .cancel-btn{padding:10px 20px;background:transparent;border:1px solid var(--glass-border);border-radius:20px;color:var(--text);font-size:14px;font-weight:500;cursor:pointer}.modal-footer .cancel-btn:hover{background:#ffffff0d}.modal-footer .save-btn{padding:10px 20px;background:var(--primary);border:none;border-radius:20px;color:#fff;font-size:14px;font-weight:500;cursor:pointer}.modal-footer .save-btn:hover{filter:brightness(1.1)}.add-user-modal{max-width:500px;width:90vw}.add-user-modal .search-input-wrapper{margin-bottom:16px}.user-search-results{max-height:300px;overflow-y:auto}.user-search-results .searching,.user-search-results .no-results{text-align:center;color:var(--text-muted);padding:20px}.user-search-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:8px;transition:background .15s}.user-search-item:hover{background:#ffffff0d}.user-search-item img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.user-search-info{flex:1;min-width:0}.user-search-info p{margin:0;font-size:14px;font-weight:500}.user-search-info span{font-size:12px;color:var(--text-muted)}.user-search-actions{display:flex;gap:8px}.user-search-actions button{padding:6px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;color:var(--text);font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}.user-search-actions button:hover{border-color:var(--primary);color:var(--primary)}.user-search-actions button:last-child:hover{border-color:#22d3ee;color:#22d3ee}.general-section{max-width:600px}.settings-options{display:flex;flex-direction:column;gap:16px}.setting-item{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px}.setting-info h3{font-size:14px;font-weight:600;margin:0 0 4px}.setting-info p{font-size:13px;color:var(--text-muted);margin:0}.setting-input{flex-shrink:0;width:280px;padding:10px 14px;background:var(--bg-input);border:1px solid var(--glass-border);border-radius:8px;color:var(--text);font-size:14px;font-family:inherit;transition:border-color .2s,box-shadow .2s}.setting-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.setting-input::-moz-placeholder{color:var(--text-muted);opacity:.7}.setting-input::placeholder{color:var(--text-muted);opacity:.7}.discovery-section .section-description{color:var(--text-muted);font-size:14px;margin-top:4px}.discovery-section .setting-item{flex-direction:column;align-items:flex-start;gap:12px}.discovery-section .setting-input{width:100%;max-width:500px}.toggle-switch{position:relative;display:inline-block;width:48px;height:26px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:#ffffff1a;transition:.3s;border-radius:26px}.toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:3px;bottom:3px;background:#fff;transition:.3s;border-radius:50%}.toggle-switch input:checked+.toggle-slider{background:var(--primary)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}.volume-setting{display:flex;align-items:center;gap:12px}.volume-setting input[type=range]{width:120px;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff1a;border-radius:2px;outline:none}.volume-setting input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:var(--primary);border-radius:50%;cursor:pointer}.volume-setting span{font-size:14px;font-weight:500;min-width:40px;text-align:right}.spotify-player{position:fixed;bottom:0;left:0;right:0;height:90px;background:var(--bg-modal);border-top:1px solid var(--glass-border);display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;padding:0 16px;z-index:250;overflow:hidden}.player-bg-artwork{position:absolute;left:0;top:0;bottom:0;width:350px;background-size:cover;background-position:top center;opacity:.6;pointer-events:none;z-index:0}.player-bg-artwork:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom right,transparent 0%,transparent 20%,rgba(22,27,38,.4) 50%,var(--bg-modal) 80%),linear-gradient(to bottom,transparent 0%,rgba(22,27,38,.3) 60%,var(--bg-modal) 100%),linear-gradient(to right,transparent 0%,transparent 50%,var(--bg-modal) 100%)}.spotify-player>*:not(.player-bg-artwork){position:relative;z-index:1}.player-track-info{display:flex;align-items:center;gap:12px;min-width:0}.player-thumb{width:56px;height:56px;border-radius:4px;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--glass-bg)}.player-thumb-empty{display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.player-thumb-container{position:relative;flex-shrink:0}.player-thumb.loading{opacity:.7}.player-thumb-loader{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0006;border-radius:4px}.player-thumb-loader:after{content:"";width:24px;height:24px;border:2px solid transparent;border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.player-track-title.loading,.player-track-artist.loading{opacity:.7}.player-btn.play-pause.loading svg{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.icon-loading{animation:spin 1s linear infinite}.player-track-text{flex:1;min-width:0;overflow:hidden}.player-track-title{font-size:14px;font-weight:500;margin:0 0 4px;white-space:nowrap;display:inline-block;max-width:100%}.player-track-title.scrolling{animation:marquee 10s linear infinite;animation-delay:2s}@keyframes marquee{0%,10%{transform:translate(0)}45%,55%{transform:translate(calc(-100% + 180px))}90%,to{transform:translate(0)}}.player-track-artist{font-size:12px;color:var(--text-muted);margin:0}.player-like-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:8px;display:flex;transition:color .15s}.player-like-btn:hover{color:var(--text)}.player-controls{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:720px;margin:0 auto;width:100%}.player-buttons{display:flex;align-items:center;gap:8px}.player-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-secondary);cursor:pointer;transition:all .15s}.player-btn:hover:not(:disabled){color:var(--text);transform:scale(1.05)}.player-btn:disabled{opacity:.5;cursor:default}.player-btn.play-pause{width:36px;height:36px;background:var(--text);color:var(--bg-dark)}.player-btn.play-pause:hover{transform:scale(1.08);background:var(--primary)}.player-btn.stop-btn{color:var(--text-muted)}.player-btn.stop-btn:hover:not(:disabled){color:var(--danger)}.player-progress-container{display:flex;align-items:center;gap:8px;width:100%}.player-time{font-size:11px;color:var(--text-muted);min-width:40px}.player-time:first-child{text-align:right}.player-progress-bar{flex:1;height:16px;display:flex;align-items:center;cursor:pointer;position:relative}.progress-bg{width:100%;height:4px;background:#fff3;border-radius:2px;overflow:visible;position:relative}.player-progress-bar:hover .progress-bg{height:6px}.progress-fill{height:100%;background:var(--text);border-radius:2px;transition:width .1s linear}.player-progress-bar:hover .progress-fill{background:var(--primary)}.progress-hover{position:absolute;top:50%;transform:translateY(-50%);pointer-events:none}.hover-time{position:absolute;bottom:20px;left:50%;transform:translate(-50%);padding:4px 8px;background:#1e1e28f2;border-radius:4px;font-size:11px;font-weight:500;white-space:nowrap}.player-extra{display:flex;align-items:center;justify-content:flex-end;gap:8px}.queue-btn{color:var(--text-muted)}.queue-btn:hover{color:var(--text)}.player-volume{display:flex;align-items:center;gap:8px}.volume-btn{color:var(--text-muted)}.volume-btn:hover{color:var(--text)}.volume-slider{width:100px;height:4px;-webkit-appearance:none;background:#fff3;border-radius:2px;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text);cursor:pointer;-webkit-transition:all .15s;transition:all .15s}.volume-slider:hover::-webkit-slider-thumb{background:var(--primary)}.spotify-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:400;padding:24px;animation:fadeIn .2s ease}.spotify-modal{width:100%;max-width:480px;background:#1e1e28fa;border-radius:16px;border:1px solid var(--glass-border);overflow:hidden;animation:scaleIn .2s ease}.spotify-modal-header{padding:24px 24px 16px;display:flex;align-items:center;justify-content:space-between}.spotify-modal-title{font-size:20px;font-weight:700;margin:0}.spotify-modal-close{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center}.spotify-modal-close:hover{color:var(--text)}.spotify-modal-body{padding:0 24px 24px}.spotify-form-group{margin-bottom:20px}.spotify-form-label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}.spotify-form-input{width:100%;padding:12px 16px;border-radius:8px;border:1px solid var(--glass-border);background:#0000004d;color:var(--text);font-size:14px;outline:none;transition:all .2s}.spotify-form-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #22d3ee1a}.spotify-form-textarea{resize:vertical;min-height:80px}.spotify-modal-footer{padding:16px 24px;border-top:1px solid var(--glass-border);display:flex;justify-content:flex-end;gap:12px}.spotify-btn{padding:12px 24px;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}.spotify-btn-ghost{background:transparent;border:none;color:var(--text-muted)}.spotify-btn-ghost:hover{color:var(--text)}.spotify-btn-primary{background:var(--primary);border:none;color:var(--bg-dark)}.spotify-btn-primary:hover{transform:scale(1.02);background:#5de8f9}.spotify-btn-primary:disabled{opacity:.5;cursor:default;transform:none}.spotify-add-playlist-dropdown{position:absolute;top:100%;right:0;min-width:200px;max-height:300px;overflow-y:auto;background:#1e1e28fa;border-radius:8px;border:1px solid var(--glass-border);box-shadow:0 16px 48px #00000080;z-index:300;animation:dropdownSlide .15s ease}.spotify-add-playlist-item{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;transition:background .15s}.spotify-add-playlist-item:hover{background:#ffffff1a}.spotify-add-playlist-cover{width:32px;height:32px;border-radius:4px;flex-shrink:0;background:var(--glass-bg)}.spotify-add-playlist-name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-empty{text-align:center;padding:60px 24px}.spotify-empty-icon{width:64px;height:64px;margin:0 auto 16px;color:var(--text-muted);opacity:.5}.spotify-empty-title{font-size:20px;font-weight:700;margin:0 0 8px}.spotify-empty-desc{font-size:14px;color:var(--text-muted);margin:0}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:var(--bg-modal);border:1px solid var(--glass-border);border-radius:12px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 64px #000000b3}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 0}.modal-header h2{font-size:24px;font-weight:700;color:var(--text);margin:0}.modal-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .15s}.modal-close:hover{background:#ffffff1a;color:var(--text)}.modal-body{padding:24px}.modal-form-row{display:flex;gap:24px;margin-bottom:20px}.cover-preview-container{width:160px;height:160px;flex-shrink:0}.cover-preview{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:8px}.cover-preview-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(135deg,#a855f733,#22d3ee33);border-radius:8px;color:var(--text-muted)}.cover-preview-placeholder svg{width:48px;height:48px}.cover-preview-placeholder span{font-size:13px}.modal-form-fields{flex:1;display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:13px;font-weight:600;color:var(--text)}.form-group input,.form-group textarea{padding:12px;background:#ffffff12;border:1px solid transparent;border-radius:6px;color:var(--text);font-size:14px;transition:all .15s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--primary);background:#ffffff1a}.form-group input::-moz-placeholder,.form-group textarea::-moz-placeholder{color:var(--text-muted)}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-muted)}.form-group textarea{resize:vertical;min-height:80px}.visibility-toggle{margin-top:8px}.toggle-options{display:flex;gap:8px}.toggle-options.three-options .toggle-option{padding:10px 8px;font-size:13px}.toggle-option{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;background:#ffffff0d;border:1px solid var(--glass-border);border-radius:8px;color:var(--text-muted);font-size:14px;cursor:pointer;transition:all .15s}.toggle-option:hover{background:#ffffff1a}.toggle-option.active{background:#a855f733;border-color:var(--primary);color:var(--text)}.visibility-hint{font-size:12px;color:var(--text-muted);margin-top:8px}.pending-track-info{margin-top:20px;padding:16px;background:#ffffff0d;border-radius:8px}.pending-track-info>p{font-size:12px;color:var(--text-muted);margin:0 0 12px;text-transform:uppercase;letter-spacing:.05em}.pending-track{display:flex;align-items:center;gap:12px}.pending-track img{width:48px;height:48px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.pending-track .track-title{font-size:14px;font-weight:500;color:var(--text);margin:0 0 4px}.pending-track .track-artist{font-size:12px;color:var(--text-muted);margin:0}.modal-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:24px;padding-top:20px;border-top:1px solid var(--glass-border)}.btn-cancel{padding:12px 24px;background:transparent;border:1px solid var(--glass-border);border-radius:20px;color:var(--text);font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}.btn-cancel:hover{background:#ffffff1a}.btn-create{padding:12px 32px;background:var(--primary);border:none;border-radius:20px;color:var(--bg-dark);font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}.btn-create:hover:not(:disabled){transform:scale(1.02);filter:brightness(1.1)}.btn-create:disabled{opacity:.5;cursor:default}.voice-channel-modal{max-width:480px}.voice-channel-hint{color:var(--text-muted);font-size:14px;margin-bottom:20px}.voice-channels-loading,.voice-channels-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;color:var(--text-muted);gap:12px}.voice-channels-loading span{font-size:14px}.voice-channels-empty p{font-size:14px;margin:0}.voice-channels-list{display:flex;flex-direction:column;gap:8px;max-height:400px;overflow-y:auto}.voice-channel-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#ffffff0d;border:1px solid transparent;border-radius:8px;cursor:pointer;transition:all .15s;text-align:left;width:100%}.voice-channel-item:hover:not(:disabled){background:#ffffff1a;border-color:var(--glass-border)}.voice-channel-item:disabled{opacity:.6;cursor:wait}.voice-channel-item.joining{border-color:var(--primary);background:#a855f71a}.voice-channel-icon{width:40px;height:40px;border-radius:50%;background:#ffffff1a;display:flex;align-items:center;justify-content:center;color:var(--text-muted);flex-shrink:0}.voice-channel-item:hover .voice-channel-icon{background:var(--primary);color:var(--bg-dark)}.voice-channel-info{flex:1;min-width:0}.voice-channel-name{font-size:15px;font-weight:500;color:var(--text);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.voice-channel-members{display:flex;align-items:center;gap:4px;margin-top:6px}.voice-channel-members .member-avatar{width:20px;height:20px;border-radius:50%;border:2px solid var(--bg-card);margin-left:-6px}.voice-channel-members .member-avatar:first-child{margin-left:0}.voice-channel-members .member-count{font-size:12px;color:var(--text-muted);margin-left:4px}.voice-channel-meta{display:flex;align-items:center;gap:12px;flex-shrink:0}.member-count-badge{font-size:12px;color:var(--text-muted);background:#ffffff1a;padding:4px 8px;border-radius:12px}.join-arrow{color:var(--text-muted);transition:all .15s}.voice-channel-item:hover .join-arrow{color:var(--primary);transform:translate(4px)}.joining-indicator{width:20px;height:20px}.spotify-loader.small{width:20px;height:20px;border-width:2px}@media (max-width: 600px){.modal-form-row{flex-direction:column;align-items:center}.cover-preview-container{width:140px;height:140px}.modal-form-fields{width:100%}}@media (max-width: 1024px){.spotify-layout{grid-template-columns:1fr}.spotify-sidebar{display:none}.spotify-header{padding:12px 16px}.content-area>*{padding:0 16px 120px}.search-track-actions{opacity:1}}@media (max-width: 768px){.spotify-player{grid-template-columns:1fr auto;height:72px}.player-controls,.player-volume{display:none}.playlist-header{flex-direction:column;align-items:center;text-align:center}.playlist-cover-large{width:180px;height:180px}.playlist-title{font-size:32px}}.queue-choice-modal{max-width:400px;width:90%}.queue-choice-text{color:var(--text-muted);margin-bottom:20px;text-align:center}.queue-choice-buttons{display:flex;flex-direction:column;gap:12px}.queue-choice-btn{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s;text-align:left;color:var(--text)}.queue-choice-btn:hover{background:#ffffff1a;border-color:#fff3}.queue-choice-btn svg{color:var(--primary);margin-bottom:4px}.queue-choice-btn span{font-size:16px;font-weight:600}.queue-choice-btn small{font-size:12px;color:var(--text-muted)}.queue-choice-btn.add:hover{border-color:var(--primary)}.queue-choice-btn.replace:hover svg{color:#ff6b6b}.queue-choice-btn.replace:hover{border-color:#ff6b6b}.context-menu{position:fixed;background:var(--bg-dropdown);border:1px solid var(--glass-border);border-radius:8px;padding:4px 0;min-width:200px;box-shadow:0 16px 48px #0009;z-index:2000;animation:contextMenuAppear .15s ease}@keyframes contextMenuAppear{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;background:transparent;border:none;color:var(--text-muted);font-size:14px;cursor:pointer;transition:all .1s;text-align:left}.context-menu button:hover{background:#ffffff1a;color:var(--text)}.context-menu button svg{width:16px;height:16px;flex-shrink:0}.context-menu-divider{height:1px;background:var(--glass-border);margin:4px 0}.context-menu-submenu{position:relative}.context-menu-submenu>button{justify-content:space-between}.context-menu-submenu>button span{flex:1}.submenu-arrow{opacity:.5}.context-submenu{position:absolute;top:0;left:100%;background:var(--bg-dropdown);border:1px solid var(--glass-border);border-radius:8px;padding:4px 0;min-width:180px;max-height:300px;overflow-y:auto;box-shadow:0 16px 48px #0009;z-index:2001}.context-submenu.open-left{left:auto;right:100%}.context-submenu.open-up{top:auto;bottom:0}.context-menu-submenu.open-left>button{flex-direction:row}.submenu-arrow-left{opacity:.5;margin-right:4px}.context-submenu button{padding:8px 12px;font-size:13px}.queue-modal{background:var(--bg-card);border-radius:12px;width:100%;max-width:480px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 24px 64px #00000080}.queue-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--glass-border)}.queue-modal-header h2{font-size:20px;font-weight:700;color:var(--text);margin:0}.queue-modal-content{flex:1;overflow-y:auto;padding:16px 24px 24px}.queue-section{margin-bottom:24px}.queue-section:last-child{margin-bottom:0}.queue-section h3{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin:0 0 12px}.queue-current-track{display:flex;align-items:center;gap:12px;padding:12px;background:#a855f71a;border:1px solid rgba(168,85,247,.3);border-radius:8px}.queue-current-track img{width:56px;height:56px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.queue-track-info{flex:1;min-width:0}.queue-track-title{font-size:14px;font-weight:500;color:var(--text);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-track-artist{font-size:12px;color:var(--text-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-track-duration{font-size:12px;color:var(--text-muted);flex-shrink:0}.queue-empty{color:var(--text-muted);font-size:14px;text-align:center;padding:24px}.queue-tracks{display:flex;flex-direction:column;gap:4px}.queue-track-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:6px;transition:background .1s}.queue-track-row:hover{background:#ffffff0d}.queue-track-num{width:20px;font-size:14px;color:var(--text-muted);text-align:center}.queue-track-thumb{width:40px;height:40px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.queue-track-row .queue-track-info{flex:1;min-width:0}.queue-track-row .queue-track-title{font-size:13px}.queue-track-row .queue-track-artist{font-size:11px}.queue-track-actions{display:flex;gap:4px;opacity:0;transition:opacity .15s}.queue-track-row:hover .queue-track-actions{opacity:1}.queue-track-actions button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;transition:all .1s}.queue-track-actions button:hover{background:#ffffff1a;color:var(--text)}.queue-track-actions button svg{width:16px;height:16px}.toast-container{position:fixed;bottom:120px;left:50%;transform:translate(-50%);z-index:10000;display:flex;flex-direction:column;gap:10px;pointer-events:none;max-width:400px;width:calc(100% - 32px)}@media (max-width: 768px){.toast-container{bottom:180px}}.toast{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:12px;border:1px solid var(--glass-border);box-shadow:0 8px 32px #0000004d;animation:toast-slide-in .3s ease-out;pointer-events:auto;cursor:pointer;transition:transform .2s,opacity .2s}.toast:hover{transform:scale(1.02)}@keyframes toast-slide-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.toast-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.toast-message{flex:1;font-size:14px;font-weight:500;color:var(--text);line-height:1.4}.toast-close{display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:4px;border-radius:6px;transition:background .2s,color .2s;flex-shrink:0}.toast-close:hover{background:#ffffff1a;color:var(--text)}.toast-success{border-color:#34d3994d;background:linear-gradient(135deg,rgba(52,211,153,.15),var(--glass-bg))}.toast-success .toast-icon{color:var(--success)}.toast-error{border-color:#f871714d;background:linear-gradient(135deg,rgba(248,113,113,.15),var(--glass-bg))}.toast-error .toast-icon{color:var(--danger)}.toast-warning{border-color:#fbbf244d;background:linear-gradient(135deg,rgba(251,191,36,.15),var(--glass-bg))}.toast-warning .toast-icon{color:var(--warning)}.toast-info{border-color:#22d3ee4d;background:linear-gradient(135deg,rgba(34,211,238,.15),var(--glass-bg))}.toast-info .toast-icon{color:var(--primary)}@media (max-width: 768px){*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}.guild-selector-btn .guild-name{display:none}.guild-selector-btn{padding:6px;border-radius:50%;margin-right:8px}.server-structure-panel{left:0;width:100%;z-index:200}.spotify-layout:has(.server-structure-panel) .spotify-main{margin-left:0}.spotify-layout{display:flex;flex-direction:column;min-height:100vh}.spotify-main.mobile{flex:1;min-height:0;padding:0;margin-left:0;overflow:hidden;display:flex;flex-direction:column}.content-area>*{padding:0 12px 150px}.content-area>.playlist-view{padding-top:40px}.playlist-mobile-back-btn{position:absolute;top:12px;left:12px;z-index:10;padding:4px;background:none;border:none;color:var(--text);opacity:.8;cursor:pointer;transition:opacity .15s}.playlist-mobile-back-btn:active{opacity:1}.playlist-mobile-back-btn svg{width:24px;height:24px}.playlist-mobile-sticky-header{position:fixed;top:56px;left:0;right:0;height:48px;display:flex;align-items:center;gap:12px;padding:0 72px 0 16px;z-index:45;background-color:var(--bg-dark);opacity:0;visibility:hidden;transform:translateY(-100%);transition:opacity .25s,transform .25s,visibility .25s}.playlist-actions{z-index:1}.playlist-actions .play-btn-large{width:48px;height:48px}.playlist-actions .play-btn-large svg{width:20px;height:20px}.playlist-mobile-sticky-header.visible{opacity:1;visibility:visible;transform:translateY(0)}.playlist-mobile-sticky-back{padding:8px;background:none;border:none;color:var(--text);cursor:pointer;margin-left:-8px}.playlist-mobile-sticky-back svg{width:24px;height:24px}.playlist-mobile-sticky-title{flex:1;font-size:16px;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-mobile-sticky-play{position:absolute;right:12px;bottom:0;transform:translateY(50%);width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--primary);border:none;border-radius:50%;color:var(--bg-dark);cursor:pointer;box-shadow:0 4px 12px #0000004d;opacity:0;visibility:hidden}.playlist-mobile-sticky-play.visible{opacity:1;visibility:visible}.playlist-mobile-sticky-play:disabled{opacity:.5;cursor:default}.playlist-mobile-sticky-play.visible:disabled{opacity:.5}.playlist-mobile-sticky-play svg{width:20px;height:20px}.search-view,.mobile-library-view{padding-left:4px;padding-right:4px}}.mobile-search-bar{padding:8px 16px 16px;background:var(--bg-dark);z-index:40}.mobile-search-bar .search-input-wrapper{display:flex;align-items:center;gap:12px;padding:0 16px;height:48px;width:100%;max-width:none;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px}.mobile-search-bar .search-input-wrapper svg{flex-shrink:0;color:var(--text-muted);width:20px;height:20px}.mobile-search-bar .search-input-wrapper input{flex:1;background:transparent;border:none;color:var(--text);font-size:16px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.mobile-search-bar .search-input-wrapper input::-moz-placeholder{color:var(--text-muted)}.mobile-search-bar .search-input-wrapper input::placeholder{color:var(--text-muted)}.mobile-search-bar .search-clear{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center}.mobile-library-view{padding:16px 0}.mobile-library-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;margin-bottom:16px}.mobile-library-header h1{font-size:24px;font-weight:700;margin:0}.mobile-library-search{padding:0 16px 16px}.mobile-library-search .library-search-input{display:flex;align-items:center;gap:12px;padding:0 16px;height:48px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;transition:all .2s}.mobile-library-search .library-search-input:focus-within{background:#ffffff1f;border-color:var(--glass-border-hover)}.mobile-library-search .library-search-input svg{width:20px;height:20px;color:var(--text-muted);flex-shrink:0}.mobile-library-search .library-search-input input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:16px;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.mobile-library-search .library-search-input input::-moz-placeholder{color:var(--text-muted)}.mobile-library-search .library-search-input input::placeholder{color:var(--text-muted)}.mobile-library-search .library-search-clear{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:#ffffff26;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;-webkit-tap-highlight-color:transparent}.mobile-library-search .library-search-clear:active{background:#ffffff40;color:var(--text)}.mobile-library-search .library-search-clear svg{width:14px;height:14px}.mobile-library-no-results{padding:32px 16px;text-align:center;color:var(--text-muted);font-size:15px}.mobile-library-list{display:flex;flex-direction:column;padding:0 12px}.mobile-playlist-item{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:10px;color:var(--text);cursor:pointer;text-align:left;transition:background .15s;width:100%;overflow:hidden;margin-bottom:8px}.mobile-playlist-bg{position:absolute;top:0;left:0;width:60%;height:100%;background-size:cover;background-position:center;filter:blur(8px) saturate(1.3);opacity:.5;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,#000000b3,#0000);pointer-events:none}.mobile-playlist-item:hover,.mobile-playlist-item:active{background:#ffffff14}.mobile-playlist-item .playlist-cover{position:relative;z-index:1;width:48px;height:48px;border-radius:8px;overflow:hidden;flex-shrink:0}.mobile-playlist-item .playlist-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.mobile-playlist-item .playlist-info{position:relative;z-index:1;flex:1;min-width:0}.mobile-playlist-item .playlist-name{font-size:16px;font-weight:500;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-playlist-item .playlist-meta{font-size:13px;color:var(--text-muted);margin:0}.mobile-user-dropdown{position:fixed;top:60px;right:12px;left:auto;z-index:300;min-width:180px;background:#141923fa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:12px;padding:8px;box-shadow:0 16px 48px #00000080}.mobile-user-dropdown button{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;background:transparent;border:none;color:var(--text);font-size:14px;cursor:pointer;border-radius:8px;transition:background .15s}.mobile-user-dropdown button:hover,.mobile-user-dropdown button:active{background:#ffffff1a}.mobile-user-dropdown button svg{width:18px;height:18px;color:var(--text-muted)}.mobile-user-dropdown .dropdown-divider{height:1px;background:var(--glass-border);margin:6px 0}.mobile-user-dropdown .logout-btn:hover{background:#ef444426;color:#ef4444}.mobile-user-dropdown .logout-btn:hover svg{color:#ef4444}.mobile-header-left,.mobile-header-right{display:flex;align-items:center;gap:8px}.mobile-header-icon,.mobile-header-icon-placeholder{width:32px;height:32px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.mobile-header-btn{width:32px;height:32px;border-radius:50%;background:#ffffff14;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mobile-header-btn:hover,.mobile-header-btn.active{background:#ffffff1f;color:var(--text)}.mobile-header-btn svg{width:22px;height:22px}.mobile-status-indicator{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:20px;background:#ffffff14;font-size:13px;font-weight:500;color:var(--text-muted);min-height:28px}.mobile-status-indicator:empty{display:none}.mobile-status-indicator.connected{background:#22c55e26;color:#22c55e}.mobile-status-indicator.playing{background:#22d3ee26;color:var(--primary)}.mobile-status-indicator .status-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);animation:pulse 1.5s ease-in-out infinite}.mobile-status-indicator svg{width:14px;height:14px}.mobile-status-indicator .status-count{font-size:12px}@media (max-width: 768px){.playlist-grid{display:flex;flex-direction:column;gap:8px}.playlist-card{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:10px;overflow:hidden}.playlist-card-bg{position:absolute;top:0;left:0;width:60%;height:100%;background-size:cover;background-position:center;filter:blur(8px) saturate(1.3);opacity:.5;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,#000000b3,#0000);pointer-events:none}.playlist-card:hover,.playlist-card:active{background:#ffffff14}.playlist-card-cover{position:relative;z-index:1;width:48px;height:48px;flex-shrink:0;margin-bottom:0;border-radius:6px;box-shadow:none;aspect-ratio:auto}.playlist-card-cover img,.playlist-card-placeholder{border-radius:6px}.playlist-card-play,.playlist-card-count{display:none}.playlist-card-info{position:relative;z-index:1;flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.playlist-card-name{font-size:16px;font-weight:500;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-card-meta{font-size:13px;margin:0}}.hover\:scale-\[1\.02\]:hover{--tw-scale-x: 1.02;--tw-scale-y: 1.02;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:border-\[--glass-border-hover\]:hover{border-color:var(--glass-border-hover)}.hover\:bg-\[\#4752C4\]:hover{--tw-bg-opacity: 1;background-color:rgb(71 82 196 / var(--tw-bg-opacity, 1))}.hover\:shadow-lg:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-indigo-500\/25:hover{--tw-shadow-color: rgb(99 102 241 / .25);--tw-shadow: var(--tw-shadow-colored)}.active\:scale-\[0\.98\]:active{--tw-scale-x: .98;--tw-scale-y: .98;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-x-1{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:scale-110{--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:border-\[--primary\]{border-color:var(--primary)}@media (min-width: 640px){.sm\:block{display:block}.sm\:inline{display:inline}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}