:root{--bg-gradient-start: #0F172A;--bg-gradient-end: #1E1B3A;--surface: rgba(255, 255, 255, .05);--surface-hover: rgba(255, 255, 255, .08);--border: rgba(255, 255, 255, .08);--border-hover: rgba(255, 255, 255, .12);--glass-bg: rgba(20, 20, 25, .7);--glass-border: rgba(255, 255, 255, .08);--neon-glow: 0 0 20px rgba(8, 247, 254, .3);--accent1: #08f7fe;--accent2: #f15bb5;--accent3: #ffea00;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .7);--text-muted: rgba(255, 255, 255, .5);--radius-xs: 4px;--radius-sm: 8px;--radius: 14px;--radius-lg: 20px;--radius-xl: 24px;--preview-color1: #08f7fe;--preview-color2: #f15bb5;--preview-color3: #ffea00;--z-modals: 1000;--shadow-glow: 0 0 20px rgba(8, 247, 254, .3);--shadow-card: 0 4px 24px rgba(0, 0, 0, .4);--font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Orbitron", var(--font-main);--transition: all .3s cubic-bezier(.4, 0, .2, 1);--header-height: 64px;--player-height: 90px;--player-height-mobile: 80px;--sidebar-width: 280px;--sidebar-compact: 170px;--sidebar-collapsed: 0px;--sidebar-transition: all .5s cubic-bezier(.25, .8, .25, 1);--safe-area-top: env(safe-area-inset-top, 0px);--safe-area-bottom: env(safe-area-inset-bottom, 0px);--safe-area-left: env(safe-area-inset-left, 0px);--safe-area-right: env(safe-area-inset-right, 0px);--total-header-height: calc(var(--header-height) + var(--safe-area-top));--total-player-height: calc(var(--player-height) + var(--safe-area-bottom));--total-player-height-mobile: calc(var(--player-height-mobile) + var(--safe-area-bottom));--surface-solid: #0a0a0a;--text-on-accent: #000000}[data-theme=light]{--bg-gradient-start: #f8fafc;--bg-gradient-end: #e2e8f0;--surface: rgba(255, 255, 255, .9);--surface-hover: rgba(0, 0, 0, .08);--border: rgba(0, 0, 0, .08);--glass-bg: rgba(255, 255, 255, .6);--glass-border: rgba(0, 0, 0, .1);--neon-glow: 0 0 20px rgba(0, 102, 255, .2);--text-primary: #1e293b;--text-secondary: rgba(30, 41, 59, .7);--text-muted: rgba(30, 41, 59, .5);--accent1: #0066ff;--accent2: #e11d48;--surface-solid: #ffffff}[data-theme=oled]{--bg-gradient-start: #000000;--bg-gradient-end: #0a0a0a;--surface: rgba(255, 255, 255, .03);--surface-hover: rgba(255, 255, 255, .06);--border: rgba(255, 255, 255, .05);--glass-bg: rgba(0, 0, 0, .7);--glass-border: rgba(255, 255, 255, .1);--neon-glow: 0 0 15px rgba(8, 247, 254, .4);--accent1: #00ffff;--accent2: #ff0080;--accent3: #ffff00}[data-accent=blue]{--accent1: #3b82f6;--accent2: #8b5cf6;--accent3: #06b6d4}[data-accent=green]{--accent1: #10b981;--accent2: #84cc16;--accent3: #22c55e}[data-accent=red]{--accent1: #ef4444;--accent2: #f97316;--accent3: #f59e0b}[data-accent=gradient]{--accent1: #08f7fe;--accent2: #f15bb5;--accent3: #ffea00}[data-accent=purple]{--accent1: #a855f7;--accent2: #ec4899;--accent3: #8b5cf6}[data-accent=orange]{--accent1: #f97316;--accent2: #fb923c;--accent3: #fdba74}[data-accent=teal]{--accent1: #14b8a6;--accent2: #06b6d4;--accent3: #22d3ee}[data-accent=pink]{--accent1: #ec4899;--accent2: #f472b6;--accent3: #f9a8d4}[data-accent=sunset]{--accent1: #f97316;--accent2: #ec4899;--accent3: #fbbf24}[data-accent=ocean]{--accent1: #06b6d4;--accent2: #3b82f6;--accent3: #0ea5e9}[data-accent=forest]{--accent1: #059669;--accent2: #10b981;--accent3: #34d399}[data-accent=neon]{--accent1: #00ff88;--accent2: #ff00ff;--accent3: #00ffff}@media (min-width: 769px){:root{--safe-area-top: 0;--safe-area-bottom: 0;--safe-area-left: 0;--safe-area-right: 0;--total-header-height: var(--header-height);--total-player-height: var(--player-height)}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:var(--font-main);font-size:15px;color:var(--text-primary);background:linear-gradient(135deg,var(--bg-gradient-start) 0%,var(--bg-gradient-end) 100%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.station-name,.track-info,.setting-label,.setting-description,.about p,.about span,p,span{-webkit-user-select:text;user-select:text}body.compact{--header-height: 56px;--player-height: 100px;--sidebar-width: 240px;--sidebar-medium: 180px}body.no-animations *{animation:none!important;transition:none!important}body.edit-mode-active{cursor:move}body.center-elements .content{display:flex;flex-direction:column;align-items:center}body.center-elements .stations-grid{max-width:1400px;margin:0 auto}body.center-elements .genre-filter{max-width:1400px;margin-left:auto;margin-right:auto}.app-container{display:flex;flex-direction:column;height:100vh;height:100dvh;position:relative}.app-main{flex:1;display:flex;overflow:hidden;position:relative}.content{flex:1;overflow-y:auto;overflow-x:hidden;padding:1.25rem;padding-left:max(1.25rem,var(--safe-area-left));padding-right:max(1.25rem,var(--safe-area-right));-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.glass{background:var(--surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);transform:translateZ(0);will-change:transform}.glass:hover{background:var(--surface-hover);border-color:var(--border-hover)}.app-header{height:var(--total-header-height);padding-top:var(--safe-area-top);display:flex;align-items:center;justify-content:space-between;padding-left:max(1.5rem,var(--safe-area-left));padding-right:max(1.5rem,var(--safe-area-right));border-bottom:1px solid var(--border);position:fixed;top:0;left:0;right:0;z-index:100;background:var(--bg-gradient-start);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);gap:1rem;transition:var(--transition)}[data-theme=light] .app-header{background:#f8fafcf2;border-bottom:1px solid rgba(0,0,0,.08)}[data-theme=oled] .app-header{background:#000000fa;border-bottom:1px solid rgba(255,255,255,.05)}.app-header[data-header-theme=glass],.app-header.theme-glass{background:#ffffff0d;backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 4px 24px #0000001a}.app-header[data-header-theme=neon],.app-header.theme-neon{background:linear-gradient(135deg,#08f7fe26,#f15bb526);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border-bottom:2px solid;border-image:linear-gradient(90deg,var(--accent1),var(--accent2),var(--accent3)) 1;box-shadow:0 0 30px #08f7fe4d}.app-header[data-header-theme=dark],.app-header.theme-dark{background:#000000f2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.05)}.app-header[data-header-theme=minimal],.app-header.theme-minimal{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid rgba(255,255,255,.05)}.app-header[data-header-layout=default],.app-header.layout-default{justify-content:space-between;gap:1rem;position:relative;background:linear-gradient(180deg,#0a0a14f2,#0f0f19fa);border-bottom:1px solid rgba(8,247,254,.2);box-shadow:0 4px 20px #0000004d}.app-header[data-header-layout=default] .header-left,.app-header.layout-default .header-left,.app-header[data-header-layout=default] .header-right,.app-header.layout-default .header-right{z-index:2}.app-header[data-header-layout=default] .header-center,.app-header.layout-default .header-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1}.app-header[data-header-layout=default]:after,.app-header.layout-default:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,var(--accent1) 50%,transparent 100%);opacity:.5}.app-header[data-header-layout=centered],.app-header.layout-centered{justify-content:space-between;gap:1rem;position:relative;background:#0009;backdrop-filter:blur(30px) brightness(120%);-webkit-backdrop-filter:blur(30px) brightness(120%);border-bottom:1px solid rgba(255,255,255,.1)}.app-header[data-header-layout=centered] .header-left,.app-header.layout-centered .header-left,.app-header[data-header-layout=centered] .header-right,.app-header.layout-centered .header-right{display:flex;align-items:center;gap:.75rem;z-index:2}.app-header[data-header-layout=centered] .header-center,.app-header.layout-centered .header-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}.app-header[data-header-layout=centered] .app-title,.app-header.layout-centered .app-title{font-size:1.5rem;text-shadow:0 0 20px rgba(8,247,254,.6),0 0 40px rgba(241,91,181,.4);white-space:nowrap}.app-header[data-header-layout=centered] .capsule-wrapper,.app-header.layout-centered .capsule-wrapper{pointer-events:auto}.app-header[data-header-layout=compact],.app-header.layout-compact{gap:.5rem;padding-left:max(1rem,var(--safe-area-left));padding-right:max(1rem,var(--safe-area-right));height:calc(var(--header-height) - 10px);background:#0a0a14fa;border-bottom:1px solid rgba(8,247,254,.15)}.app-header[data-header-layout=compact] .menu-btn,.app-header.layout-compact .menu-btn,.app-header[data-header-layout=compact] .icon-btn,.app-header.layout-compact .icon-btn,.app-header[data-header-layout=compact] .btn-view-toggle,.app-header.layout-compact .btn-view-toggle{width:36px;height:36px;padding:8px}.app-header[data-header-layout=compact] .app-title,.app-header.layout-compact .app-title{font-size:1.1rem;letter-spacing:2px}.app-header[data-header-layout=compact] .capsule-wrapper,.app-header.layout-compact .capsule-wrapper{transform:scale(.9)}.app-header[data-header-layout=spacious],.app-header.layout-spacious{gap:3rem;padding-left:max(3rem,var(--safe-area-left));padding-right:max(3rem,var(--safe-area-right));height:calc(var(--header-height) + 20px);background:linear-gradient(180deg,#08f7fe08,#0f0f19f2);backdrop-filter:blur(40px) saturate(150%);-webkit-backdrop-filter:blur(40px) saturate(150%);border-bottom:2px solid;border-image:linear-gradient(90deg,transparent 0%,var(--accent1) 25%,var(--accent2) 50%,var(--accent3) 75%,transparent 100%) 1}.app-header[data-header-layout=spacious] .menu-btn,.app-header.layout-spacious .menu-btn,.app-header[data-header-layout=spacious] .icon-btn,.app-header.layout-spacious .icon-btn,.app-header[data-header-layout=spacious] .btn-view-toggle,.app-header.layout-spacious .btn-view-toggle{width:48px;height:48px;padding:12px;border-radius:12px}.app-header[data-header-layout=spacious] .app-title,.app-header.layout-spacious .app-title{font-size:2rem;letter-spacing:4px;text-shadow:0 0 30px rgba(8,247,254,.8),0 0 60px rgba(241,91,181,.5)}.app-header[data-header-layout=spacious] .capsule-wrapper,.app-header.layout-spacious .capsule-wrapper{transform:scale(1.1)}[data-theme=light] .app-header.layout-default,[data-theme=light] .app-header[data-header-layout=default]{background:linear-gradient(180deg,#f8fafcfa,#f1f5f9f2);border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 2px 10px #0000000d}[data-theme=light] .app-header.layout-centered,[data-theme=light] .app-header[data-header-layout=centered]{background:#fffc;backdrop-filter:blur(30px) brightness(100%);-webkit-backdrop-filter:blur(30px) brightness(100%);border-bottom:1px solid rgba(0,0,0,.1)}[data-theme=light] .app-header.layout-compact,[data-theme=light] .app-header[data-header-layout=compact]{background:linear-gradient(180deg,#f8fafcfa,#f1f5f9f2);border-bottom:1px solid rgba(0,0,0,.08)}[data-theme=light] .app-header.layout-spacious,[data-theme=light] .app-header[data-header-layout=spacious]{background:linear-gradient(180deg,#f8fafcfa,#f1f5f9f2);border-bottom:1px solid rgba(0,0,0,.1)}@media (min-width: 769px){.app-header{padding-top:0;height:var(--header-height)}}.app-header:before{content:"";position:absolute;top:0;left:0;right:0;height:var(--safe-area-top);background:var(--bg-gradient-start);z-index:-1}@media (min-width: 769px){.app-header:before{display:none}}.header-left,.header-right{display:flex;align-items:center;gap:1rem;z-index:2;flex-shrink:0}.menu-btn{background:none;border:none;color:var(--text-primary);width:40px;height:40px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition);flex-shrink:0}.menu-btn:hover{background:var(--surface-hover)}.menu-btn:active{transform:scale(.95)}.header-center{position:relative;display:flex;align-items:center;gap:.5rem;z-index:1;flex-shrink:0}.header-center>*{pointer-events:auto}.app-header.layout-centered .header-center{position:relative;left:auto;top:auto;transform:none;z-index:2}.capsule-wrapper{perspective:1000px;cursor:pointer;flex:0 0 auto;flex-shrink:0;z-index:10}.capsule-scene{display:inline-block;position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1)}.capsule-wrapper.flipped .capsule-scene{transform:rotateY(180deg)}.capsule-face{backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--accent-gradient, linear-gradient(135deg, var(--accent1), var(--accent2)));padding:.5rem 1.5rem;border-radius:999px;position:relative;overflow:hidden;transition:var(--transition)}[data-accent=gradient] .capsule-face{background:var(--accent-gradient, linear-gradient(135deg, #08f7fe, #f15bb5))}.capsule-front{position:relative}.capsule-back{position:absolute;top:0;left:0;width:100%;transform:rotateY(180deg)}.capsule-wrapper:not(.flipped) .capsule-face:hover{transform:translateY(-2px);box-shadow:0 6px 20px #08f7fe66}.capsule-wrapper:not(.flipped) .capsule-face:active{transform:translateY(-1px)}.capsule-face:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(45deg,transparent,rgba(255,255,255,.3),transparent);transform:translate(-100%);transition:transform .6s}.capsule-wrapper:not(.flipped) .capsule-face:hover:after{transform:translate(100%)}.capsule-wrapper.flipped .capsule-face:hover:after{transform:translate(-100%)}.input-wrapper{display:flex;align-items:center;gap:.5rem;width:100%}.capsule-search-input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-family:var(--font-display);font-size:1rem;font-weight:600;letter-spacing:.05em;padding:0;min-width:150px}.capsule-search-input::placeholder{color:#ffffffb3}.logo-wrapper{background:var(--accent-gradient, linear-gradient(135deg, var(--accent1), var(--accent2)));padding:.5rem 1.5rem;border-radius:999px;cursor:pointer;position:relative;overflow:hidden;transition:var(--transition);flex:0 0 auto;flex-shrink:0;z-index:10}.app-title{font-family:var(--font-display);font-size:1.25rem;font-weight:700;letter-spacing:.1em;color:#fff;white-space:nowrap;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.2);background:none!important;-webkit-text-fill-color:initial!important;background-clip:initial!important;-webkit-background-clip:initial!important;mix-blend-mode:normal!important}.app-header.layout-compact .logo-wrapper{padding:.3rem 1rem}.app-header.layout-compact .app-title{font-size:1rem;letter-spacing:2px}#changelog-toggle.brand-action{position:relative;background:none;border:1px solid var(--border);width:40px;height:40px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:var(--transition);flex-shrink:0}#changelog-toggle.brand-action:hover{background:var(--surface-hover);color:var(--text-primary)}#changelog-toggle.brand-action:active{transform:scale(.95)}#changelog-toggle.brand-action .badge-dot{position:absolute;right:6px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--accent3);box-shadow:0 0 0 3px #ffffff14;display:inline-block}#settings-toggle{display:flex!important}#mobile-search{display:none;background:none;border:none;color:var(--text-secondary);width:40px;height:40px;border-radius:var(--radius-sm);cursor:pointer;align-items:center;justify-content:center;transition:var(--transition);flex-shrink:0}#mobile-search:hover{background:var(--surface-hover);color:var(--text-primary)}.icon-btn{background:none;border:none;color:var(--text-secondary);width:40px;height:40px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition);flex-shrink:0}.icon-btn:hover{background:var(--surface-hover);color:var(--text-primary)}.icon-btn:active{transform:scale(.95)}.auth-lock-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:2rem;color:var(--text-primary)}.auth-lock-icon{font-size:4rem;margin-bottom:1.5rem;color:var(--accent2);animation:pulse-lock 2s infinite}.auth-lock-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem;font-family:var(--font-display)}.auth-lock-desc{color:var(--text-secondary);max-width:400px;margin-bottom:2rem;line-height:1.6}.auth-lock-btn{background:linear-gradient(135deg,var(--accent1),var(--accent2));border:none;padding:12px 32px;border-radius:99px;color:#000;font-weight:700;font-size:1rem;cursor:pointer;transition:transform .2s}.auth-lock-btn:hover{transform:scale(1.05);box-shadow:0 0 20px #08f7fe66}@keyframes pulse-lock{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes pulseArrow{0%,to{transform:translate(0)}50%{transform:translate(3px)}}.sidebar{position:fixed;top:var(--header-height);left:0;bottom:var(--player-height);width:var(--sidebar-width);background:var(--bg-gradient-start);border-right:1px solid var(--border);z-index:1000;display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.25,.8,.25,1),width .4s cubic-bezier(.25,.8,.25,1);overflow:hidden}.sidebar.sidebar-full{width:280px;transform:translate(0)}.sidebar.sidebar-medium{width:80px;transform:translate(0)}.sidebar.sidebar-collapsed{width:0;transform:translate(-100%)}.sidebar .nav-section{flex:1;padding:1rem 0;overflow-y:auto;overflow-x:hidden}.sidebar.sidebar-medium .nav-title{opacity:0;height:0;margin:0;padding:0;overflow:hidden}.sidebar.sidebar-medium .nav-item{justify-content:center;padding:.75rem}.sidebar.sidebar-medium .nav-item span{display:none}.sidebar.sidebar-medium .nav-item svg{margin:0}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:9990;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.sidebar-overlay.show{opacity:1;visibility:visible}.sidebar-expand-tab{position:fixed;left:0;top:50%;transform:translateY(-50%);width:24px;height:80px;background:var(--surface);border:1px solid var(--border);border-left:none;border-radius:0 12px 12px 0;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:10001;transition:all .3s cubic-bezier(.4,0,.2,1);color:var(--text-secondary)}.sidebar-expand-tab:hover{background:var(--surface-hover);color:var(--accent1);width:32px}.sidebar-expand-tab:active{transform:translateY(-50%) scale(.95)}.sidebar-expand-tab svg{transition:transform .2s ease}.sidebar-expand-tab:hover svg{transform:translate(2px)}.sidebar-expand-tab.visible{display:flex}.sidebar-profile-capsule{display:none;align-items:center;gap:1rem;padding:1rem;margin:0 1rem 1rem;background:var(--surface-hover);border-radius:16px;border:1px solid var(--border);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.sidebar-profile-capsule.visible{display:flex}.sidebar-profile-capsule:hover{border-color:var(--accent1);background:#ffffff0d;transform:translate(4px)}.sidebar-profile-capsule:active{transform:scale(.98)}.sidebar-profile-avatar{width:48px;height:48px;border-radius:50%;background:#333;overflow:hidden;flex-shrink:0;border:2px solid var(--border)}.sidebar-profile-avatar img{width:100%;height:100%;object-fit:cover}.sidebar-profile-info{flex:1;min-width:0;transition:opacity .2s}.sidebar-profile-name{font-weight:700;font-size:.95rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-profile-status{font-size:.75rem;color:var(--accent1);display:flex;align-items:center;gap:4px}.sidebar-profile-dot{width:6px;height:6px;background:var(--accent1);border-radius:50%;animation:sidebarPulse 2s infinite}@keyframes sidebarPulse{0%,to{opacity:1}50%{opacity:.5}}.sidebar.sidebar-medium .sidebar-profile-capsule{padding:.75rem;margin:0 .5rem 1rem;justify-content:center}.sidebar.sidebar-medium .sidebar-profile-info{display:none}.sidebar.sidebar-medium .sidebar-profile-avatar{width:40px;height:40px;border-width:1px}@media (min-width: 769px){.app-main{padding-left:280px;transition:padding-left .4s cubic-bezier(.25,.8,.25,1)}.sidebar-full~.app-main,.sidebar.sidebar-full~.app-main{padding-left:280px}.sidebar.sidebar-medium~.app-main{padding-left:80px}.sidebar.sidebar-collapsed~.app-main{padding-left:0}body:has(.sidebar.sidebar-full) .app-main{padding-left:280px}body:has(.sidebar.sidebar-medium) .app-main{padding-left:80px}body:has(.sidebar.sidebar-collapsed) .app-main{padding-left:0}}@media (max-width: 768px){.sidebar{position:fixed;top:0;left:0;bottom:0;width:85%;max-width:280px;transform:translate(-100%)!important;z-index:10002;padding:0;background:var(--bg-gradient-start)}.sidebar.sidebar-open{transform:translate(0)!important}.sidebar.sidebar-full,.sidebar.sidebar-medium,.sidebar.sidebar-collapsed{width:85%;max-width:280px;transform:translate(-100%)!important}.sidebar.sidebar-open.sidebar-full,.sidebar.sidebar-open.sidebar-medium,.sidebar.sidebar-open.sidebar-collapsed{transform:translate(0);!important}.sidebar .nav-section{padding-top:calc(var(--safe-area-top) + 1rem)}.sidebar .nav-title{opacity:1;height:auto;margin-bottom:.75rem;padding:0 1rem}.sidebar .nav-item{justify-content:flex-start;padding:.75rem 1rem}.sidebar .nav-item span{display:inline}.sidebar .sidebar-profile-capsule{margin:1rem;padding:1rem;justify-content:flex-start}.sidebar .sidebar-profile-info{display:block}.sidebar .sidebar-profile-avatar{width:48px;height:48px;border-width:2px}.sidebar-overlay{z-index:10001;padding-left:0!important}.sidebar-expand-tab{display:none!important}.app-main{padding-left:0!important}}.nav-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:.75rem;padding:0 1rem;transition:var(--transition);overflow:hidden;white-space:nowrap}.nav-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem 1rem;background:none;border:none;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition);margin-bottom:.25rem;text-align:left;white-space:nowrap;overflow:hidden;position:relative}.nav-item:hover{background:var(--surface-hover);color:var(--text-primary)}.nav-item:active{transform:scale(.98)}.nav-item.active{background:var(--surface-hover);color:var(--accent1)}.nav-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:24px;background:var(--accent1);border-radius:0 3px 3px 0}.nav-item svg{flex-shrink:0;width:20px;height:20px;transition:var(--transition)}.nav-item:hover svg{transform:scale(1.1)}.nav-item span{transition:var(--transition)}.btn-view-toggle,#view-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-sm);border:none;background:none;color:var(--text-secondary);cursor:pointer;transition:var(--transition);padding:0;margin:0;flex-shrink:0}.btn-view-toggle:hover,#view-toggle:hover{background:var(--surface-hover);color:var(--text-primary)}.btn-view-toggle:active,#view-toggle:active{transform:scale(.98)}.btn-view-toggle svg,#view-toggle svg{width:20px;height:20px;fill:currentColor}player-bar{position:fixed;bottom:0;left:0;right:0;height:var(--total-player-height);z-index:90;transition:var(--transition)}player-bar.draggable{position:fixed;width:auto;max-width:500px;border-radius:var(--radius-xl)!important;box-shadow:0 8px 32px #00000080;cursor:move;bottom:20px;left:50%;transform:translate(-50%);overflow:hidden}player-bar.draggable button,player-bar.draggable input[type=range],player-bar.draggable .volume-slider,player-bar.draggable .control-btn,player-bar.draggable .play-btn,player-bar.draggable .step-btn,player-bar.draggable .volume-btn,player-bar.draggable a{cursor:pointer!important}player-bar.dragging{cursor:grabbing!important;box-shadow:0 12px 48px #000000b3}player-bar.dragging *{cursor:grabbing!important}player-bar.animating{animation:playerFloat .4s cubic-bezier(.34,1.56,.64,1)}@keyframes playerFloat{0%{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.05)}to{transform:translate(-50%) scale(1)}}player-bar[player-style=default]{--player-height: 100px;--total-player-height: calc(100px + var(--safe-area-bottom));background:linear-gradient(135deg,#08f7fe1a,#f15bb514,#ffea000d)!important;backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);border-top:1px solid rgba(8,247,254,.3);box-shadow:0 -4px 30px #08f7fe33,0 0 60px #f15bb51a inset;position:relative;overflow:hidden}player-bar[player-style=default]:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,rgba(8,247,254,.1) 50%,transparent 100%);animation:shimmer 3s ease-in-out infinite}@keyframes shimmer{0%,to{transform:translate(-100%);opacity:0}50%{transform:translate(100%);opacity:1}}player-bar[player-style=minimal]{--player-height: 70px;--total-player-height: calc(70px + var(--safe-area-bottom));background:#0000004d!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.05);border-radius:0}player-bar[player-style=minimal] .station-icon{width:45px!important;height:45px!important;border-radius:8px}player-bar[player-style=minimal] .player-container{padding:0 1rem;gap:1rem}player-bar[player-style=extended]{--player-height: 120px;--total-player-height: calc(120px + var(--safe-area-bottom));background:linear-gradient(180deg,#0a0a14f2,#140a1efa)!important;backdrop-filter:blur(50px);-webkit-backdrop-filter:blur(50px);border-top:2px solid;border-image:linear-gradient(90deg,var(--accent1) 0%,var(--accent2) 50%,var(--accent3) 100%) 1;box-shadow:0 -8px 40px #0006}player-bar[player-style=extended] .player-container{flex-direction:column;padding:.75rem 1.5rem;gap:.5rem;align-items:stretch}player-bar[player-style=extended] .station-info{justify-content:center}player-bar[player-style=extended] .station-icon{width:70px!important;height:70px!important;border-radius:16px;box-shadow:0 6px 20px #08f7fe4d}player-bar[player-style=compact]{--player-height: 50px;--total-player-height: calc(50px + var(--safe-area-bottom));background:#0f0f19fa!important;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-top:1px solid rgba(8,247,254,.2)}player-bar[player-style=compact] .station-icon{width:40px!important;height:40px!important;border-radius:6px}player-bar[player-style=compact] .player-container{padding:0 .75rem;gap:.5rem;height:50px}player-bar[player-style=compact] .station-name,player-bar[player-style=compact] .track-info{font-size:.85rem}player-bar[player-style=modern]{--player-height: 95px;--total-player-height: calc(95px + var(--safe-area-bottom));background:linear-gradient(135deg,#08f7fe14,#f15bb514,#ffea000f)!important;backdrop-filter:blur(30px) brightness(110%);-webkit-backdrop-filter:blur(30px) brightness(110%);border-top:1px solid transparent;border-image:linear-gradient(90deg,var(--accent1),var(--accent2),var(--accent3)) 1;border-radius:20px 20px 0 0;position:relative;overflow:hidden}player-bar[player-style=modern]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent1) 0%,var(--accent2) 50%,var(--accent3) 100%);animation:gradientFlow 4s ease infinite}@keyframes gradientFlow{0%{transform:translate(-100%)}to{transform:translate(100%)}}player-bar[player-style=modern] .station-icon{border-radius:14px;box-shadow:0 4px 15px #08f7fe66;transition:transform .3s ease,box-shadow .3s ease}player-bar[player-style=modern] .station-icon:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 25px #f15bb580}player-bar[player-style=classic]{--player-height: 85px;--total-player-height: calc(85px + var(--safe-area-bottom));background:linear-gradient(180deg,#1a1a1a,#0a0a0a)!important;border-top:3px solid #333;border-radius:0;box-shadow:0 -2px 10px #00000080;position:relative}player-bar[player-style=classic]:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%)}player-bar[player-style=classic] .station-icon{border-radius:4px;border:2px solid #333;box-shadow:0 2px 8px #0009}player-bar[player-style=classic] .station-name{font-family:Courier New,monospace;text-transform:uppercase;letter-spacing:1px;color:#08f7fe}player-bar[player-style=classic] .track-info{font-family:Courier New,monospace;font-size:.85rem;color:#888}player-bar[player-style=island]{position:fixed;width:auto;max-width:480px;min-width:320px;border-radius:var(--radius-xl)!important;box-shadow:0 8px 32px #00000080;cursor:move}player-bar[player-style=island].floating-player-host{border-radius:var(--radius-xl)!important;overflow:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}.toast-container{position:fixed;bottom:calc(var(--total-player-height) + 1rem);right:max(1rem,var(--safe-area-right));z-index:1000;pointer-events:none}.toast{background:var(--surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.5rem;margin-bottom:.5rem;min-width:300px;box-shadow:var(--shadow-card);transform:translate(400px);opacity:0;transition:var(--transition);pointer-events:auto}.toast.show{transform:translate(0);opacity:1}.toast.success{border-color:var(--accent3)}.toast.error{border-color:var(--accent2)}.toast.warning{border-color:var(--accent3);background:#ffea001a}.toast.info{border-color:var(--accent1)}.hotkeys-help{position:fixed;bottom:calc(var(--total-player-height) + 1rem);left:max(1rem,var(--safe-area-left));background:var(--surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;font-size:12px;color:var(--text-muted);max-width:300px;z-index:1000;opacity:0;transform:translateY(20px);transition:var(--transition);pointer-events:none}.hotkeys-help.show{opacity:1;transform:translateY(0);pointer-events:auto}.hotkeys-help h4{color:var(--accent1);margin-bottom:.5rem}.hotkeys-help kbd{background:var(--surface-hover);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-family:monospace;font-size:11px;min-width:60px;display:inline-block;text-align:center;margin-right:.5rem}#viz{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;opacity:.15;mix-blend-mode:screen;z-index:1;filter:blur(2px);transform:translateZ(0);will-change:transform,opacity}[data-theme=light] #viz{mix-blend-mode:multiply;opacity:.05}[data-theme=oled] #viz{mix-blend-mode:screen;opacity:.12}#viz.fade-in{animation:vizFadeIn 1s ease-out}@keyframes vizFadeIn{0%{opacity:0;transform:scale(1.1)}to{opacity:.15;transform:scale(1)}}#viz.geometric{filter:contrast(1.05)}#viz.organic{filter:contrast(1.1) saturate(1.1)}settings-panel{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000}settings-panel:not([open]){visibility:hidden}settings-panel[open]{visibility:visible}changelog-panel{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;display:none;pointer-events:none}changelog-panel[style*="display: block"]{pointer-events:auto}.ripple-effect{position:relative;overflow:hidden}.ripple-effect:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);transition:width .6s,height .6s}.ripple-effect:active:after{width:300px;height:300px}.parallax-bg{background-image:radial-gradient(circle at 20% 50%,rgba(8,247,254,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(241,91,181,.1) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(255,234,0,.1) 0%,transparent 50%);background-size:200% 200%;animation:parallaxBg 20s ease infinite}@keyframes parallaxBg{0%{background-position:0% 0%}to{background-position:100% 100%}}.station-loading-spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--accent1);border-radius:50%;animation:spin .8s linear infinite;z-index:10;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}.station-loading-spinner.active{opacity:1;visibility:visible}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.player-loading-indicator{display:none;width:20px;height:20px;border:2px solid rgba(255,255,255,.2);border-top-color:var(--accent1);border-radius:50%;animation:spin .8s linear infinite;margin-left:.5rem}.player-loading-indicator.active{display:inline-block}@media (max-width: 768px){body.menu-open{overflow:hidden}player-bar.draggable{max-width:90vw;min-width:280px}player-bar[player-style=island]{max-width:85vw;min-width:260px;border-radius:var(--radius-lg)}.app-header{padding-left:max(.75rem,var(--safe-area-left));padding-right:max(.75rem,var(--safe-area-right));justify-content:space-between}.header-left{gap:.5rem;flex:0 0 auto;justify-content:flex-start}.header-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1}.header-right{flex:0 0 auto;justify-content:flex-end}.menu-btn{width:36px;height:36px}.app-header.layout-centered{justify-content:space-between}.app-header.layout-centered .header-left{position:relative;left:auto;top:auto;transform:none}.app-header.layout-centered .header-right{position:relative;right:auto;top:auto;transform:none}.app-header.layout-centered .header-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.content{padding-top:0;padding-bottom:0;padding:1rem;padding-right:max(1rem,var(--safe-area-right))}#view-toggle,.btn-view-toggle{display:flex!important}#mobile-search{display:none!important}.logo-wrapper,.capsule-face{padding:.4rem 1rem}.capsule-search-input{font-size:.875rem;min-width:120px}.btn-view-toggle{display:inline-flex!important;width:36px;height:36px;margin-left:0;margin-right:0}.app-title{font-size:1rem;letter-spacing:2px}.mobile-search-btn{display:none!important}#view-toggle{display:flex!important}#viz{opacity:.08}settings-panel .panel{width:100%}settings-panel .visualizer-modes{grid-template-columns:1fr}.toast-container,.hotkeys-help{bottom:calc(var(--total-player-height-mobile) + .5rem)}}@media (max-width: 480px){.content{padding:.75rem;padding-right:max(.75rem,var(--safe-area-right))}.app-header.layout-compact{padding-left:max(.5rem,var(--safe-area-left));padding-right:max(.5rem,var(--safe-area-right))}.app-header.layout-spacious{padding-left:max(1.5rem,var(--safe-area-left));padding-right:max(1.5rem,var(--safe-area-right));gap:1.5rem}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes morphPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes springIn{0%{transform:scale(.8) rotate(-5deg);opacity:0}50%{transform:scale(1.1) rotate(2deg)}to{transform:scale(1) rotate(0);opacity:1}}@keyframes springOut{0%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(1.1) rotate(-2deg)}to{transform:scale(.8) rotate(5deg);opacity:0}}@media (prefers-reduced-motion: reduce){#viz,settings-panel *{animation:none!important;transition:none!important}}@media (prefers-contrast: more){#viz{opacity:.05}settings-panel .setting-row,settings-panel .viz-mode{border:1px solid var(--border)}}@supports (height: 100dvh){.app-container{height:100dvh}}@media (hover: hover){.interactive-scale{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.interactive-scale:hover{transform:scale(1.05)}.interactive-scale:active{transform:scale(.95)}}.glass,.station-card,.nav-item,.capsule-wrapper,.logo-wrapper,#viz{transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden;perspective:1000px;-webkit-perspective:1000px}#station-context-menu{transform:translateZ(0);will-change:transform,opacity}.app-container{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}button,a,.nav-item,.station-card{-webkit-user-select:none;user-select:none}@supports (backdrop-filter: blur(1px)){#viz{transform:translateZ(0)}}@supports not (backdrop-filter: blur(1px)){.glass,.summary-card,.history-item,.content-section,.tabs,.empty-state{background:#ffffff1a}}
