@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";@import"https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100..900;1,100..900&family=Space+Grotesk:wght@300..700&display=swap";:root{--bg-base: #07000f;--bg-surface-1: #0e0819;--bg-surface-2: #160d28;--bg-surface-3: #1d1237;--accent-primary: #a855f7;--accent-secondary: #6366f1;--accent-glow: #c084fc;--accent-hover: #b97cf8;--accent-dim: rgba(168, 85, 247, .18);--accent-border: rgba(168, 85, 247, .25);--spotify-green: #1db954;--spotify-green-dim: rgba(29, 185, 84, .15);--text-primary: #f1eeff;--text-secondary: #a89ec4;--text-muted: #5c5278;--border-subtle: rgba(255, 255, 255, .06);--border-mid: rgba(255, 255, 255, .12);--glass-bg: rgba(255, 255, 255, .04);--glass-bg-hover: rgba(255, 255, 255, .08);--nav-height: 5.5rem;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--radius-full: 9999px;--shadow-glow: 0 0 24px rgba(168, 85, 247, .35);--shadow-card: 0 8px 32px rgba(0, 0, 0, .5)}*,*:before,*:after{padding:0;margin:0;border:none;box-sizing:border-box;text-decoration:none}html{scroll-behavior:smooth;overflow-x:hidden;font-size:16px}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:var(--bg-base);color:var(--text-primary);-webkit-user-select:none;user-select:none;margin:0;padding:0;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:var(--bg-surface-1)}::-webkit-scrollbar-thumb{background:var(--accent-dim);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}button{cursor:pointer;font-family:Inter,sans-serif}button:focus,button:active,button:focus-visible{outline:none;box-shadow:none;border:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:2.4rem;padding:0 1.2rem;border-radius:var(--radius-full);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;letter-spacing:.01em;transition:all .2s cubic-bezier(.25,.46,.45,.94);cursor:pointer;white-space:nowrap;border:none}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;box-shadow:0 4px 14px #a855f766}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #a855f78c;filter:brightness(1.1)}.btn-primary:active{transform:scale(.97);box-shadow:0 2px 8px #a855f74d}.btn-ghost{background:var(--glass-bg);color:var(--text-primary);border:1px solid var(--border-mid);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-ghost:hover{background:var(--glass-bg-hover);border-color:var(--accent-border);color:#fff;transform:translateY(-1px)}.btn-ghost:active{transform:scale(.97)}.btn-spotify{background:var(--spotify-green);color:#000;font-weight:700;box-shadow:0 4px 14px #1db9544d}.btn-spotify:hover{background:#1ed760;transform:translateY(-1px);box-shadow:0 6px 20px #1db95473}.btn-spotify:active{transform:scale(.97)}.video-background{position:fixed;right:0;bottom:0;min-width:100%;min-height:100%;width:auto;height:auto;z-index:-1000;background-size:cover;background:linear-gradient(to bottom,var(--bg-base),var(--bg-surface-1),var(--bg-base))}#profile-img{border-radius:50%;object-fit:cover;height:2.2rem;width:2.2rem;border:2px solid var(--accent-border)}#profile-btn{background-color:transparent;height:2.5rem;display:flex;align-items:center;justify-content:start;gap:.5rem;overflow:hidden;border-radius:var(--radius-md);padding:0 .5rem;transition:background .2s ease}#profile-btn:hover{background:var(--glass-bg-hover);cursor:pointer}#username{color:var(--text-primary);font-size:.875rem;font-family:Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}main{height:fit-content;width:100%;margin-top:var(--nav-height);padding:1.5rem 2rem 7rem;position:relative}@media (max-width: 768px){:root{--nav-height: 8.5rem}main{margin-top:var(--nav-height);padding:1rem .75rem 6rem;width:100%;margin-left:0}}@media (max-width: 480px){main{padding:.75rem .5rem 6rem}}#artstation-icon{color:var(--accent-primary)}#logout-icon{color:#ef4444}#trend-icon{color:var(--accent-primary)}#link-icon{color:#000}.glass-card{background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-md)}body{background-color:var(--bg-base, #07000f);-webkit-user-select:none;user-select:none;margin:0;padding:0;overflow-x:hidden}.nav-bar{display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:0;right:0;height:var(--nav-height, 4rem);z-index:1000;padding:0 2.5rem;gap:1.5rem;background:var(--bg-surface-1, #0e0819);border-bottom:1px solid var(--border-subtle, rgba(255, 255, 255, .06));box-shadow:0 4px 24px #0006}.nav-logo-area{display:flex;align-items:center;flex-shrink:0;gap:.75rem}.nav-search-area{flex:1;max-width:480px;min-width:0}.nav-right{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.auth-buttons,.auth-status{display:flex;align-items:center;gap:1rem}.spotify-connected-badge{display:flex;align-items:center;gap:.4rem;background:var(--spotify-green-dim, rgba(29, 185, 84, .15));border:1px solid rgba(29,185,84,.35);border-radius:var(--radius-full);padding:.3rem .85rem;color:#1db954;font-size:.8rem;font-weight:600;letter-spacing:.01em;white-space:nowrap}.spotify-badge-icon{width:15px;height:15px;fill:#1db954;flex-shrink:0}.nav-hamburger{display:flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border-radius:var(--radius-sm);background:var(--glass-bg);border:1px solid var(--border-mid);color:var(--text-primary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.nav-hamburger:hover{background:var(--glass-bg-hover);border-color:var(--accent-border);color:var(--accent-primary)}.nav-hamburger svg{width:1.2rem;height:1.2rem}@media (min-width: 769px){.auth-buttons{display:flex}.nav-search-area{display:block}}@media (max-width: 768px){.nav-bar{padding:.75rem 1rem;height:auto;flex-direction:column;align-items:center;gap:0}.auth-buttons,.auth-status{display:none}.nav-hamburger{display:flex;position:absolute;top:.75rem;left:1rem;margin:0}.nav-right{display:none}.nav-logo-area{width:100%;height:auto;min-height:2.4rem;display:flex;align-items:center;justify-content:center;margin-top:.5rem;margin-bottom:0}.nav-search-area{width:100%;max-width:100%;min-width:0;margin-top:0;margin-bottom:.25rem}}@media (max-width: 480px){.nav-bar{padding:.75rem}.nav-hamburger{left:.75rem}}.nav-avatar-btn{width:2.2rem;height:2.2rem;border-radius:50%;background:var(--accent-dim);border:1px solid var(--accent-border);color:var(--accent-glow);display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.nav-avatar-btn:hover{background:var(--glass-bg-hover);box-shadow:var(--shadow-glow);transform:scale(1.08)}.desktop-only{display:flex}@media (max-width: 768px){.desktop-only{display:none!important}}.logo{display:flex;align-items:center;text-decoration:none;padding:4px;transition:opacity .2s ease;flex-shrink:0}.logo:hover{opacity:.85}.logo-symbol img{width:180px;height:auto;display:block;object-fit:contain}@media (max-width: 768px){.logo-symbol img{width:150px}.logo{padding:2px}}@media (max-width: 400px){.logo-symbol img{width:135px}}.search-bar-container{display:flex;align-items:center;justify-content:center;width:100%;padding:0}.nav-search-bar{display:flex;align-items:center;height:2.2rem;width:100%;max-width:500px;border-radius:var(--radius-full, 9999px);background:var(--glass-bg, rgba(255,255,255,.06));border:1px solid var(--border-mid, rgba(255,255,255,.12));overflow:hidden;transition:all .25s ease;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.nav-search-bar:hover{border-color:var(--accent-border, rgba(168,85,247,.3));background:var(--glass-bg-hover, rgba(255,255,255,.08))}.nav-search-bar:focus-within{border-color:var(--accent-primary, #a855f7);background:#a855f714;box-shadow:0 0 0 3px #a855f71f}#nav-select-category{border:none;height:100%;border-right:1px solid var(--border-subtle, rgba(255,255,255,.06));background:#a855f71f;color:var(--text-secondary, #a89ec4);padding:0 .6rem;outline:none;font-family:Inter,sans-serif;font-size:.75rem;flex-shrink:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none}#nav-select-category option{background:var(--bg-surface-2, #160d28);color:var(--text-primary)}#nav-input-bar{border:none;height:100%;text-align:left;background:transparent;padding:0 .75rem;outline:none;color:var(--text-primary, #f1eeff);font-family:Inter,sans-serif;font-size:.875rem;flex:1;min-width:0;caret-color:var(--accent-primary, #a855f7)}#nav-input-bar::placeholder{color:var(--text-muted, #5c5278)}#nav-input-bar:-webkit-autofill,#nav-input-bar:-webkit-autofill:hover,#nav-input-bar:-webkit-autofill:focus,#nav-input-bar:-webkit-autofill:active{transition:background-color 5000s ease-in-out 0s;-webkit-text-fill-color:var(--text-primary, #f1eeff)!important}#nav-search-button{height:100%;padding:0 .9rem;border:none;outline:none;font-family:Inter,sans-serif;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease;color:var(--text-secondary);background:transparent;border-left:1px solid var(--border-subtle)}#nav-search-button:hover{color:var(--accent-glow, #c084fc);background:#a855f71a}#nav-search-button:active{color:var(--accent-primary);transform:scale(.97)}@media (max-width: 1024px){#nav-input-bar{min-width:140px}}@media (max-width: 768px){.search-bar-container{width:100%;padding:0;margin:0}.nav-search-bar{width:100%;max-width:100%;height:2rem}#nav-select-category{display:none}#nav-input-bar{font-size:.82rem;padding:0 .6rem}#nav-search-button{padding:0 .65rem;font-size:.75rem}}@media (max-width: 480px){.nav-search-bar{height:1.9rem}#nav-input-bar{font-size:.8rem}}.login-btn-container{display:flex;align-items:center}.login-btn-container .auth-trigger-btn{display:inline-flex;align-items:center;justify-content:center;height:2.4rem;padding:0 1.2rem;border-radius:var(--radius-full, 9999px);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;letter-spacing:.01em;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);white-space:nowrap;background:transparent;color:var(--text-secondary, #a89ec4);border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.login-btn-container .auth-trigger-btn:hover{background:transparent;color:#fff;transform:scale(1.04)}.login-btn-container .auth-trigger-btn:active{transform:scale(.97)}.log-in-out-btns{display:inline-flex;align-items:center;justify-content:center;height:2.4rem;padding:0 1.2rem;border-radius:var(--radius-full, 9999px);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);white-space:nowrap;background:transparent;color:var(--text-secondary, #a89ec4);border:none;-webkit-backdrop-filter:none;backdrop-filter:none;margin:0}.log-in-out-btns:hover{background:transparent;color:#fff;transform:scale(1.04);box-shadow:none}.log-in-out-btns:active{transform:scale(.97)}@media (max-width: 768px){.login-btn-container{width:auto}.log-in-out-btns{margin:0;width:auto}}.signup-btn-container{display:flex;align-items:center}.signup-trigger-btn{display:inline-flex;align-items:center;justify-content:center;height:2.4rem;padding:0 1.2rem;border-radius:var(--radius-full, 9999px);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);white-space:nowrap;border:none;background:#fff;color:#000;box-shadow:none;margin:0}.signup-trigger-btn:hover{background:#f6f6f6;transform:scale(1.04);box-shadow:none}.signup-trigger-btn:active{transform:scale(.97)}@media (max-width: 768px){.signup-btn-container{width:auto}.signup-trigger-btn{margin:0;width:auto}}.spotify-connect-btn-container{display:flex;align-items:center}.spotify-trigger-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;height:2.4rem;padding:0 1.1rem;border-radius:var(--radius-full, 9999px);font-family:Inter,sans-serif;font-size:.875rem;font-weight:700;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);white-space:nowrap;border:none;background:#1db954;color:#000;box-shadow:none;margin:0}.spotify-trigger-btn:hover{background:#1ed760;transform:scale(1.04);box-shadow:none}.spotify-trigger-btn:active{transform:scale(.97)}@media (max-width: 768px){.spotify-connect-btn-container{width:auto}.spotify-trigger-btn{margin:0;width:auto;font-size:.8rem;padding:0 .9rem}}.player{position:fixed;bottom:24px;left:50%;transform:translate(-50%);width:96%;max-width:1100px;height:5.5rem;background:#0c0616d9;backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);border-radius:20px;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 40px #00000080,inset 0 1px #ffffff0d;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem;z-index:100;gap:1rem}.player-left{display:flex;align-items:center;flex:1;min-width:0}.player-center{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:2;gap:.4rem}.player-right{display:flex;align-items:center;justify-content:flex-end;flex:1;min-width:0;gap:1rem}.track-info{display:flex;align-items:center;text-decoration:none;cursor:pointer;overflow:hidden;max-width:100%;border-radius:12px;padding:.25rem;transition:background .2s ease}.track-info:hover{background:#ffffff0a}.thumbnail{position:relative;width:3.5rem;height:3.5rem;border-radius:10px;overflow:hidden;flex-shrink:0;box-shadow:0 4px 12px #0000004d}.thumbnail img{width:100%;height:100%;object-fit:cover}.track-name{margin-left:.75rem;font-family:Inter,sans-serif;font-size:.95rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.01em}.share-btn-desktop{background:transparent;border:none;color:var(--text-secondary, #a89ec4);font-size:1.1rem;margin-left:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .2s ease,transform .2s ease}.share-btn-desktop:hover{color:#fff;transform:scale(1.1)}.share-btn-desktop:active{transform:scale(.95)}.player-controls{display:flex;align-items:center;justify-content:center;gap:1.25rem}.play-pause-btn{height:2.8rem;width:2.8rem;border-radius:50%;background-color:#fff;color:#000;font-size:1.2rem;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);box-shadow:0 4px 12px #ffffff26}.play-pause-btn:hover{transform:scale(1.05);box-shadow:0 6px 16px #ffffff40}.play-pause-btn:active{transform:scale(.95)}.play-pause-btn:disabled{background-color:#fff3;color:#fff6;cursor:not-allowed;box-shadow:none}.backward-btn,.other-btn{background:transparent;border:none;color:var(--text-secondary, #a89ec4);font-size:1.1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s ease,transform .2s ease}.backward-btn:hover,.other-btn:hover{color:#fff}.backward-btn:active,.other-btn:active{transform:scale(.9)}.player-progress{display:flex;align-items:center;width:100%;max-width:500px;gap:.5rem}.duration-text{font-family:Inter,sans-serif;font-size:.75rem;color:var(--text-muted, #5c5278);font-variant-numeric:tabular-nums;min-width:40px;text-align:center}.seek-bar,.volumeSlider{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:linear-gradient(to right,#ffffff var(--progress, 0%),rgba(255,255,255,.1) var(--progress, 0%));border-radius:4px;outline:none;flex:1;cursor:pointer;transition:height .2s ease}.seek-bar:hover,.volumeSlider:hover{height:6px;background:linear-gradient(to right,#ffffff var(--progress, 0%),rgba(255,255,255,.25) var(--progress, 0%))}.seek-bar::-webkit-slider-thumb,.volumeSlider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;cursor:pointer;opacity:0;transition:opacity .2s ease,transform .2s ease;box-shadow:0 2px 8px #00000080}.seek-bar:hover::-webkit-slider-thumb,.volumeSlider:hover::-webkit-slider-thumb{opacity:1}.seek-bar::-webkit-slider-thumb:active,.volumeSlider::-webkit-slider-thumb:active{transform:scale(1.2)}.volume-icon-container{color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;transition:color .2s ease}.volume-icon-container:hover{color:#fff}.volumeSlider{width:80px;flex:none}.music-wave-container{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.animated-wave{display:flex;align-items:flex-end;justify-content:center;gap:3px;width:100%;height:80%}.wave-bar{width:3px;background-color:#fff;border-radius:2px;animation:wave 1s ease-in-out infinite;transform-origin:bottom}.wave-bar:nth-child(1){animation-delay:0s;height:30%}.wave-bar:nth-child(2){animation-delay:.2s;height:60%}.wave-bar:nth-child(3){animation-delay:.4s;height:100%}.wave-bar:nth-child(4){animation-delay:.1s;height:50%}.wave-bar:nth-child(5){animation-delay:.3s;height:80%}@keyframes wave{0%,to{transform:scaleY(.5)}50%{transform:scaleY(1)}}.buffering-spinner{background:transparent!important;box-shadow:none!important}.spinner{width:2.5rem;height:2.5rem;border:3px solid rgba(255,255,255,.1);border-top:3px solid #ffffff;border-radius:50%;animation:spin .8s linear infinite}.error-message{position:absolute;top:-40px;left:50%;transform:translate(-50%);background:#ef4444e6;color:#fff;padding:.5rem 1rem;border-radius:var(--radius-md);font-size:.85rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.queue-edge-tab{position:absolute;top:-36px;right:32px;height:36px;padding:0 16px;background:#121212f2;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.1);border-bottom:none;border-radius:12px 12px 0 0;color:#a89ec4;font-size:14px;font-weight:600;letter-spacing:.5px;display:flex;align-items:center;gap:8px;cursor:pointer;z-index:99;transition:all .2s ease;box-shadow:0 -4px 12px #0003}.queue-edge-tab:hover{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;border-color:transparent;top:-40px;height:40px}.queue-edge-tab.open{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;border-color:transparent}.desktop-queue-drawer{position:fixed;bottom:100px;right:24px;width:350px;max-height:60vh;background:linear-gradient(180deg,#261148f2,#121212fa);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(168,85,247,.2);border-radius:12px;z-index:1000;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;transform:translateY(120%);opacity:0;pointer-events:none;transition:transform .3s cubic-bezier(.25,.46,.45,.94),opacity .3s}.desktop-queue-drawer.open{transform:translateY(0);opacity:1;pointer-events:auto}.desktop-queue-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid rgba(255,255,255,.1)}.desktop-queue-header h3{margin:0;font-size:16px;color:#fff}.desktop-queue-close{background:none;border:none;color:#fff9;font-size:18px;cursor:pointer}.desktop-queue-close:hover{color:#fff}.desktop-queue-content{overflow-y:auto;padding:0}@media (max-width: 1024px){.player{width:92%}}@media (max-width: 768px){.player{bottom:12px;height:4.5rem;padding:0 .75rem;width:94%;border-radius:16px;gap:.5rem}.thumbnail{width:3rem;height:3rem}.track-name{font-size:.85rem;max-width:120px}.player-progress,.other-btn{display:none}.play-pause-btn{height:2.5rem;width:2.5rem;font-size:1rem}.backward-btn{font-size:1rem}.player-right{display:none}}.queue-list-container{padding:1rem;max-width:800px;margin:0 auto;box-sizing:border-box;overflow-x:hidden;width:100%}.queue-section-title{font-size:1.2rem;font-weight:700;margin-bottom:1rem;margin-top:2rem;color:#fff}.queue-section-title:first-child{margin-top:0}.queue-item{display:flex;justify-content:flex-start;gap:.5rem;align-items:center;padding:.8rem;border-radius:8px;transition:background-color .2s ease;margin-bottom:.5rem}.queue-item:hover{background-color:#ffffff1a}.queue-item:hover .queue-item-img-container .play-overlay{opacity:1}.queue-item-left{display:flex;align-items:center;gap:1rem;flex:1;cursor:pointer;min-width:0}.queue-item-img-container{position:relative;width:48px;height:48px;flex-shrink:0;border-radius:4px;overflow:hidden}.queue-item-img-container img{width:100%;height:100%;object-fit:cover}.play-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;color:#fff;font-size:1.2rem}.queue-wave{position:absolute;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center}.queue-wave-bars{display:flex;align-items:flex-end;justify-content:center;gap:2px;height:50%}.queue-wave-bars .bar{width:3px;background-color:var(--accent-primary, #a855f7);border-radius:2px;transform-origin:bottom;transform:scaleY(.2);transition:transform .2s ease}.queue-wave-bars .bar.is-playing{animation:queueWaveAnim 1s ease-in-out infinite}.queue-wave-bars .bar:nth-child(1){animation-delay:0s;height:40%}.queue-wave-bars .bar:nth-child(2){animation-delay:.2s;height:70%}.queue-wave-bars .bar:nth-child(3){animation-delay:.4s;height:100%}.queue-wave-bars .bar:nth-child(4){animation-delay:.1s;height:60%}@keyframes queueWaveAnim{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}.queue-item-info{display:flex;flex-direction:column;gap:.2rem;overflow:hidden}.queue-item-title{color:#fff;font-size:1rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}.active-title{color:var(--accent-primary, #a855f7)}.queue-item-title:hover{text-decoration:underline}.queue-item-artist{color:#b3b3b3;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-dimmed{opacity:.6}.queue-item-right{display:flex;align-items:center;justify-content:flex-end;min-width:32px}.queue-action-btn{background:none;border:none;color:#b3b3b3;font-size:1rem;cursor:pointer;padding:.35rem;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease;opacity:0}.queue-item:hover .queue-action-btn{opacity:1}.queue-action-btn:hover{color:#fff;transform:scale(1.1);background:#ffffff1a}.empty-queue-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;color:#b3b3b3;text-align:center}.empty-icon{font-size:4rem;margin-bottom:1rem}.empty-queue-container h2{color:#fff;margin-bottom:.5rem}@media (max-width: 768px){.queue-list-container{padding:.5rem}.queue-action-btn{opacity:1}}@media (max-width: 1200px){.ctb-mini-player{position:fixed;bottom:20px;left:12px;right:12px;height:60px;background:#121212b3;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.1);border-radius:16px;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:0 16px 0 10px;box-shadow:0 10px 30px #00000080;cursor:pointer;transition:transform .2s,background .2s}.ctb-mini-player:active{transform:scale(.98);background:#ffffff1a}.ctb-mini-left{display:flex;align-items:center;gap:12px;overflow:hidden;flex:1}.ctb-mini-art{width:40px;height:40px;border-radius:8px;object-fit:cover;flex-shrink:0}.ctb-mini-info{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap}.ctb-mini-title{color:#fff;font-size:14px;font-weight:600;text-overflow:ellipsis;overflow:hidden}.ctb-mini-artist{color:#b3b3b3;font-size:12px;text-overflow:ellipsis;overflow:hidden}.ctb-mini-right{display:flex;align-items:center;margin-left:12px}.ctb-mini-play-btn{width:36px;height:36px;border-radius:50%;background:#fff;color:#000;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;outline:none;transition:transform .1s}.ctb-mini-play-btn:active{transform:scale(.9)}.ctb-mini-play-btn i{margin-left:2px}.ctb-mini-play-btn .fa-pause{margin-left:0}}.player-drawer{position:fixed;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,#140a1ef2,#0c0616fa);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);z-index:10000;transform:translateY(100%);transition:transform .4s cubic-bezier(.25,.46,.45,.94);overflow-y:auto}.player-drawer.open{transform:translateY(0)}.drawer-handle{position:absolute;top:16px;left:50%;transform:translate(-50%);width:50px;height:5px;cursor:pointer;z-index:10001}.handle-bar{width:100%;height:100%;background:#ffffff4d;border-radius:3px;transition:background .2s ease}.drawer-handle:hover .handle-bar{background:#ffffff80}.drawer-content{padding:50px 32px 32px;display:flex;flex-direction:column;align-items:center;min-height:100vh;position:relative}.drawer-header-row{position:absolute;top:24px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center}.close-btn{width:40px;height:40px;border:none;background:transparent;color:#fff9;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;transition:all .2s ease;outline:none}.close-btn:hover{color:#fff;transform:scale(1.1)}.mobile-queue-btn{background:#ffffff1a;border:none;color:#fff;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .2s}.mobile-queue-btn:hover{background:#fff3}.close-btn:focus{outline:none}.close-btn:active{transform:scale(.95)}.large-artwork{width:280px;height:280px;border-radius:20px;overflow:hidden;margin:60px 0 30px;box-shadow:0 20px 50px #000c;background:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.large-artwork img{width:100%;height:100%;object-fit:cover}.track-details{text-align:center;margin-bottom:40px;max-width:320px}.track-title{color:#fff;font-size:24px;font-weight:700;margin:0 0 8px;line-height:1.2}.artist-title{color:#a89ec4;font-size:16px;font-weight:400;margin:0}.progress-section-drawer{width:100%;margin-bottom:40px;padding:0 32px}.progress-section-drawer input[type=range]{width:100%}.progress-slider-drawer{width:100%;height:4px;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(to right,#ffffff var(--progress, 0%),rgba(255,255,255,.1) var(--progress, 0%));border-radius:4px;margin-bottom:12px;transition:height .2s ease}.progress-slider-drawer::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 2px 8px #00000080;transition:transform .2s ease}.progress-slider-drawer::-webkit-slider-thumb:active{transform:scale(1.2)}.progress-slider-drawer::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;cursor:pointer;border:none;box-shadow:0 2px 8px #00000080}.progress-slider-drawer:focus{outline:none}.time-display{display:flex;justify-content:space-between;color:#a89ec4;font-size:13px;font-weight:500;font-family:Inter,sans-serif;font-variant-numeric:tabular-nums}.main-controls{display:flex;align-items:center;justify-content:center;gap:24px;margin-bottom:30px}.secondary-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:40px}.control-btn{background:transparent;color:#a89ec4;border:none;cursor:pointer;border-radius:50%;transition:all .2s ease;display:flex;align-items:center;justify-content:center;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;outline:none}.control-btn:hover{color:#fff;transform:scale(1.1)}.control-btn:active{transform:scale(.9)}.control-btn:disabled{opacity:.3;cursor:not-allowed;transform:none}.control-btn:disabled:hover{color:#a89ec4}.drawer-prev-btn,.drawer-next-btn{width:50px;height:50px;font-size:22px}.play-btn-large{width:70px;height:70px;background:#fff;color:#000;font-size:24px;box-shadow:0 4px 12px #ffffff26;border:none}.play-btn-large:hover{background:#fff;color:#000;transform:scale(1.05);box-shadow:0 6px 16px #ffffff40}.play-btn-large:active{transform:scale(.95)}.play-btn-large:disabled{background:#fff3;color:#fff6;box-shadow:none}.secondary-btn{width:44px;height:44px;font-size:18px;background:transparent;border:none;color:#a89ec4}.secondary-btn:hover{color:#fff;transform:scale(1.1)}.secondary-btn.active{color:#fff}.loading-spinner{width:20px;height:20px;position:relative}.spinner-ring{width:100%;height:100%;border:2px solid rgba(255,255,255,.3);border-top:2px solid #ffffff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ctb-drawer-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);z-index:9998;opacity:0;animation:fadeIn .3s ease forwards}@keyframes fadeIn{to{opacity:1}}.error-toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#ff6b6b,#ee5a52);color:#fff;padding:12px 20px;border-radius:25px;font-size:14px;font-weight:500;box-shadow:0 8px 32px #ff6b6b66;display:flex;align-items:center;gap:8px;animation:slideDown .3s ease;z-index:10001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,107,107,.3)}.error-toast i{font-size:12px}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@media (max-width: 768px){.large-artwork{width:200px;height:200px;margin:50px 0 25px}.track-title{font-size:22px}.artist-title{font-size:15px}.main-controls{gap:20px;margin-bottom:25px}.secondary-controls{gap:16px;margin-bottom:30px}.play-btn-large{width:65px;height:65px;font-size:18px}.drawer-prev-btn,.drawer-next-btn{width:46px;height:46px;font-size:16px}.secondary-btn{width:40px;height:40px;font-size:14px}.progress-section-drawer{padding:0 24px}.drawer-content{overflow:hidden}.close-btn{top:50px;left:24px;width:36px;height:36px;font-size:16px}.player-drawer.open{overflow:hidden}}@media (max-width: 480px){.large-artwork{width:240px;height:240px}.track-title{font-size:20px}.artist-title{font-size:14px}.main-controls{gap:16px}.secondary-controls{gap:12px;justify-content:center;width:100%;padding:0 40px;box-sizing:border-box}.play-btn-large{width:60px;height:60px;font-size:16px}.drawer-prev-btn,.drawer-next-btn{width:44px;height:44px;font-size:15px}.secondary-btn{width:36px;height:36px;font-size:12px}.progress-section-drawer{padding:0 20px}.drawer-content{padding:35px 20px 20px}}@media (max-width: 375px){.large-artwork{width:220px;height:220px}.track-title{font-size:18px}.artist-title{font-size:13px}.main-controls{gap:14px}.secondary-controls{gap:10px;justify-content:center;width:100%;padding:0 30px;box-sizing:border-box}.play-btn-large{width:56px;height:56px;font-size:15px}.drawer-prev-btn,.drawer-next-btn{width:42px;height:42px;font-size:14px}.secondary-btn{width:34px;height:34px;font-size:11px}.progress-section-drawer{padding:0 25px}.drawer-content{padding:30px 15px 15px}.close-btn{top:45px;left:20px;width:34px;height:34px;font-size:15px}}@media (max-width: 320px){.large-artwork{width:200px;height:200px}.track-title{font-size:17px}.artist-title{font-size:12px}.main-controls{gap:12px}.secondary-controls{gap:8px;justify-content:center;width:100%;padding:0 25px;box-sizing:border-box}.play-btn-large{width:54px;height:54px;font-size:14px}.drawer-prev-btn,.drawer-next-btn{width:40px;height:40px;font-size:13px}.secondary-btn{width:32px;height:32px;font-size:10px}.progress-section-drawer{padding:0 20px}.drawer-content{padding:25px 10px 10px}.close-btn{top:40px;left:15px;width:32px;height:32px;font-size:14px}}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000;z-index:10005;pointer-events:none;transition:background .3s ease}.drawer-backdrop--open{background:#0009;pointer-events:all;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.side-drawer{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:85vw;z-index:10010;background:#08040ffa;backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);box-shadow:12px 0 48px #000000d9;display:flex;flex-direction:column;transform:translate(-100%);transition:transform .32s cubic-bezier(.4,0,.2,1);will-change:transform;overflow:hidden}.side-drawer--open{transform:translate(0)}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 1.25rem 1rem 1.5rem;flex-shrink:0}.drawer-header .logo-symbol img{width:135px!important}@media (max-width: 400px){.drawer-header .logo-symbol img{width:120px!important}}.drawer-close-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:var(--radius-sm);background:var(--glass-bg);border:1px solid var(--border-subtle);color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.drawer-close-btn svg{width:1rem;height:1rem}.drawer-close-btn:hover{background:#ef444426;border-color:#ef44444d;color:#ef4444}.drawer-nav{display:flex;flex-direction:column;padding:1rem .75rem;gap:.25rem;flex:1;overflow-y:auto}.drawer-nav-item{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem;border-radius:var(--radius-md);color:var(--text-secondary);font-family:Inter,sans-serif;font-size:.95rem;font-weight:500;text-decoration:none;transition:all .2s ease;cursor:pointer;background:transparent;border:none;width:100%;text-align:left;position:relative}.drawer-nav-item:hover{background:var(--glass-bg-hover);color:var(--text-primary)}.drawer-nav-item:active{background:var(--accent-dim);color:var(--accent-glow)}.drawer-nav-item--restricted{opacity:.6}.drawer-nav-item--restricted:hover{opacity:.8;background:#ffffff0a}.drawer-nav-icon{display:flex;align-items:center;justify-content:center;width:1.2rem;height:1.2rem;flex-shrink:0;color:inherit}.drawer-nav-icon svg{width:100%;height:100%}.drawer-nav-label{flex:1;letter-spacing:.01em}.drawer-nav-lock{display:flex;align-items:center;color:var(--text-muted);margin-left:auto}.drawer-auth-section{padding:1rem 1.25rem;border-top:1px solid var(--border-subtle);flex-shrink:0}.drawer-auth-label{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.75rem}.drawer-auth-buttons{display:flex;gap:.5rem;margin-bottom:.75rem}.drawer-auth-btn{flex:1;display:flex;align-items:center;justify-content:center;height:2.4rem;border-radius:var(--radius-full);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;text-decoration:none}.drawer-auth-btn--login{background:transparent;color:var(--text-secondary);border:none}.drawer-auth-btn--login:hover{background:transparent;color:#fff;transform:scale(1.04)}.drawer-auth-btn--signup{background:#fff;color:#000;border:none;box-shadow:none}.drawer-auth-btn--signup:hover{background:#f6f6f6;transform:scale(1.04)}.drawer-spotify-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;height:2.4rem;border-radius:var(--radius-full);background:#1db954;color:#000;font-family:Inter,sans-serif;font-size:.875rem;font-weight:700;cursor:pointer;border:none;transition:all .2s ease;box-shadow:none}.drawer-spotify-btn:hover{background:#1ed760;transform:scale(1.04)}.drawer-spotify-connected{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:#1db9541f;border:1px solid rgba(29,185,84,.3);border-radius:var(--radius-full);color:#1db954;font-size:.85rem;font-weight:600}.drawer-footer{padding:.75rem 1.25rem 1.5rem;border-top:1px solid var(--border-subtle);flex-shrink:0}.drawer-logout-btn{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem 1rem;border-radius:var(--radius-md);background:transparent;color:#ef4444;font-family:Inter,sans-serif;font-size:.9rem;font-weight:500;cursor:pointer;border:1px solid rgba(239,68,68,.2);transition:all .2s ease}.drawer-logout-btn:hover{background:#ef44441a;border-color:#ef444466}@media (min-width: 769px){.side-drawer{width:280px}}.footer{background:var(--bg-surface-1, #0e0819);color:var(--text-secondary, #a89ec4);padding:3rem 2rem 0;font-family:Inter,sans-serif;border-top:1px solid var(--border-subtle, rgba(255,255,255,.06))}.footer-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2.5rem;max-width:1200px;margin:0 auto;text-align:left}.footer-section h2{color:var(--text-primary, #f1eeff);font-size:1.25rem;font-weight:800;letter-spacing:-.02em;margin-bottom:.75rem;background:linear-gradient(135deg,var(--accent-glow),var(--accent-secondary, #6366f1));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.footer-section h3{color:var(--text-primary, #f1eeff);font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.85rem;opacity:.8}.footer-section p{font-size:.85rem;line-height:1.7;color:var(--text-secondary)}.footer-section ul{margin:0;padding:0;list-style:none;font-size:.85rem;line-height:1.6}.footer-section ul li{margin-bottom:.5rem}.footer-section ul li a{color:var(--text-secondary, #a89ec4);text-decoration:none;transition:color .2s ease;font-size:.85rem}.footer-section ul li a:hover{color:var(--accent-glow, #c084fc)}.footer-section ul{margin-top:0;padding-left:0}.footer-section .social-media{display:flex;gap:.75rem;margin-top:.75rem}.footer-section .social-media a{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;background:var(--glass-bg, rgba(255,255,255,.05));border:1px solid var(--border-subtle);color:var(--text-secondary);font-size:.9rem;transition:all .2s ease}.footer-section .social-media a:hover{background:var(--accent-dim);border-color:var(--accent-border);color:var(--accent-glow);transform:translateY(-2px)}.footer-section strong{color:var(--text-primary);font-weight:600}.footer-bottom{border-top:1px solid var(--border-subtle);margin-top:2.5rem;padding:1.25rem 0 5rem;text-align:center;font-size:.78rem;color:var(--text-muted, #5c5278);letter-spacing:.02em}@media (max-width: 768px){.footer{padding:2rem 1.25rem 0}.footer-container{grid-template-columns:1fr 1fr;gap:1.5rem;margin-left:0}.footer-section{text-align:left}}@media (max-width: 480px){.footer-container{grid-template-columns:1fr}}.splash-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:var(--bg-base);overflow:hidden;animation:splash-fade-in .4s ease forwards}.splash-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;opacity:0;animation:splash-orb-appear 1.2s ease forwards}.splash-orb--1{width:clamp(280px,45vw,560px);height:clamp(280px,45vw,560px);background:radial-gradient(circle,rgba(168,85,247,.28),transparent 70%);top:-10%;right:-10%;animation-delay:.1s}.splash-orb--2{width:clamp(200px,35vw,420px);height:clamp(200px,35vw,420px);background:radial-gradient(circle,rgba(99,102,241,.2),transparent 70%);bottom:-10%;left:-8%;animation-delay:.25s}.splash-orb--3{width:clamp(120px,20vw,240px);height:clamp(120px,20vw,240px);background:radial-gradient(circle,rgba(192,132,252,.15),transparent 70%);top:40%;left:30%;animation-delay:.4s}.splash-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:2rem}.splash-logo-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:clamp(160px,28vw,260px);height:clamp(160px,28vw,260px)}.splash-logo-glow{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle,rgba(168,85,247,.3) 0%,transparent 70%);animation:splash-glow-pulse 2s ease-in-out infinite}.splash-logo{position:relative;z-index:2;width:clamp(130px,22vw,210px);height:auto;object-fit:contain;animation:splash-logo-pop .7s cubic-bezier(.34,1.56,.64,1) .15s both;filter:drop-shadow(0 0 24px rgba(168,85,247,.55))}.splash-pulse-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;border:1.5px solid rgba(168,85,247,.45);animation:splash-ring-expand 2.4s ease-out infinite}.splash-pulse-ring--delay{animation-delay:1.2s;border-color:#6366f159}.splash-wave{display:flex;align-items:flex-end;gap:5px;height:32px}.splash-wave-bar{display:block;width:4px;border-radius:4px;background:linear-gradient(to top,var(--accent-secondary),var(--accent-primary));animation:splash-bar-bounce 1s ease-in-out infinite alternate;animation-delay:calc(var(--i) * .12s);min-height:6px}.splash-wave-bar:nth-child(1){height:14px}.splash-wave-bar:nth-child(2){height:24px}.splash-wave-bar:nth-child(3){height:32px}.splash-wave-bar:nth-child(4){height:22px}.splash-wave-bar:nth-child(5){height:12px}.splash-tagline{font-family:Inter,sans-serif;font-size:clamp(.65rem,3vw,.9rem);font-weight:400;color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;text-align:center;max-width:85vw;line-height:1.5;opacity:0;animation:splash-text-fade .6s ease .7s forwards}@keyframes splash-fade-in{0%{opacity:0}to{opacity:1}}@keyframes splash-orb-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes splash-logo-pop{0%{opacity:0;transform:scale(.6);filter:drop-shadow(0 0 0px rgba(168,85,247,0))}to{opacity:1;transform:scale(1);filter:drop-shadow(0 0 24px rgba(168,85,247,.55))}}@keyframes splash-glow-pulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}@keyframes splash-ring-expand{0%{transform:scale(1);opacity:.7}to{transform:scale(1.65);opacity:0}}@keyframes splash-bar-bounce{0%{transform:scaleY(.35);opacity:.6}to{transform:scaleY(1);opacity:1}}@keyframes splash-text-fade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.splash-logo,.splash-pulse-ring,.splash-logo-glow,.splash-wave-bar,.splash-orb,.splash-tagline{animation:none!important;opacity:1!important;transform:none!important}}.pd-list-mode,.pd-create-mode{display:flex;flex-direction:column}.pd-list-mode{min-height:200px;max-height:400px;overflow-y:auto}.pd-list-mode::-webkit-scrollbar{width:6px}.pd-list-mode::-webkit-scrollbar-track{background:transparent}.pd-list-mode::-webkit-scrollbar-thumb{background:var(--border-mid);border-radius:10px}.pd-list-mode::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}.section{padding-top:.4rem;background:transparent;position:relative}.material{margin-top:.3rem;margin-bottom:.5rem;padding:.75rem .5rem 1rem;background:linear-gradient(160deg,#a855f70f,#0e081980,#6366f10a);border-radius:var(--radius-lg, 20px);border:1px solid var(--border-subtle, rgba(255,255,255,.05));position:relative}.material .carousel-wrapper{position:relative;width:100%}.material .carousel-container{display:flex;gap:.5rem;overflow-x:auto;overflow-y:hidden;align-items:center;scroll-behavior:smooth;-ms-overflow-style:none;scroll-snap-type:x mandatory}.material .carousel-container::-webkit-scrollbar{display:none}.material .carousel-card{flex:0 0 auto;scroll-snap-align:start;transition:transform .3s ease;animation:slideIn .3s ease-out}.material .carousel-card:hover{transform:scale(1.03);z-index:2}.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:#0c0618e0;color:#fff;border:1px solid var(--border-mid, rgba(255,255,255,.12));border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;font-size:1.1rem;transition:all .25s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.carousel-arrow:hover{background:#a855f740;border-color:var(--accent-border, rgba(168,85,247,.3));transform:translateY(-50%) scale(1.08);box-shadow:0 4px 16px #a855f740}.carousel-arrow-left{left:-22px}.carousel-arrow-right{right:-22px}.carousel-dots{display:flex;justify-content:center;gap:.4rem;margin-top:.75rem}.carousel-dot{width:6px;height:6px;border-radius:50%;border:none;background:#fff3;cursor:pointer;transition:all .25s ease}.carousel-dot.active{background:var(--accent-primary, #a855f7);transform:scale(1.4);width:14px;border-radius:3px}.carousel-dot:hover{background:#ffffff80}.card-stat-text a{color:var(--text-secondary, #a89ec4);text-decoration:none;font-weight:500}.card-stat-text a:hover{text-decoration:underline;color:var(--accent-glow, #c084fc)}@media (max-width: 1024px){.carousel-card{flex:0 0 calc(25% - .75rem)}.carousel-arrow{width:40px;height:40px;font-size:1rem}.carousel-arrow-left{left:-20px}.carousel-arrow-right{right:-20px}}@media (max-width: 768px){.section{margin-top:.5rem;margin-left:0}.carousel-card{flex:0 0 calc(50% - .5rem)}.carousel-arrow{width:36px;height:36px}.carousel-arrow-left{left:-18px}.carousel-arrow-right{right:-18px}.carousel-dots{display:none}}@media (max-width: 480px){.carousel-card{flex:0 0 calc(50% - .3rem)}.carousel-arrow{display:none}}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.carousel-dot:focus{outline:2px solid var(--accent-primary);outline-offset:2px}.section-name{color:var(--text-primary, #f1eeff);font-family:Inter,sans-serif;font-weight:700;letter-spacing:-.01em;font-size:1.25rem;display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:.5rem;padding:.4rem 1rem;background:transparent;border-radius:var(--radius-md, 14px)}.section-name li{margin-bottom:0;list-style:none}.section-name:hover{cursor:default}.more-btn-home{font-family:Inter,sans-serif;font-size:.75rem;font-weight:600;height:1.75rem;padding:0 .85rem;border-radius:var(--radius-full, 9999px);display:inline-flex;justify-content:center;align-items:center;color:var(--text-secondary, #a89ec4);background:var(--glass-bg, rgba(255,255,255,.05));border:1px solid var(--border-mid, rgba(255,255,255,.12));outline:none;cursor:pointer;transition:all .2s ease;white-space:nowrap;letter-spacing:.01em}.more-btn-home:hover{background:var(--accent-dim, rgba(168,85,247,.15));border-color:var(--accent-border, rgba(168,85,247,.3));color:var(--accent-glow, #c084fc);transform:translateY(-1px)}.more-btn-home:active{transform:scale(.96)}.section-name i,.section-name svg{color:var(--accent-primary, #a855f7)}@media (max-width: 768px){.section-name{font-size:1rem;padding:.3rem .5rem}.more-btn-home{font-size:.7rem;height:1.5rem;padding:0 .65rem}}@media (max-width: 480px){.section-name{font-size:.95rem}.more-btn-home{font-size:.68rem;height:1.4rem;padding:0 .55rem}}.card-container{width:100%;max-width:260px;background:var(--bg-surface-2, #160d28);padding:12px;border-radius:var(--radius-md, 12px);display:flex;flex-direction:column;transition:background-color .3s ease,transform .2s ease;cursor:pointer;box-sizing:border-box}.card-container:hover{background:#ffffff14;transform:translateY(-2px)}.card-img-wrapper{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:var(--radius-sm, 8px);overflow:hidden;box-shadow:0 8px 24px #0006;margin-bottom:12px;flex-shrink:0}.card-photo{width:100%;height:100%;object-fit:cover;display:block}.card-wave-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:2}.card-music-wave{display:flex;align-items:flex-end;justify-content:center;width:28px;height:28px;gap:3px}.card-music-wave .bar{width:4px;background-color:var(--accent-glow, #1db954);border-radius:2px;animation:cardWave 1s ease-in-out infinite}.card-music-wave .bar:nth-child(1){animation-duration:1s;height:60%}.card-music-wave .bar:nth-child(2){animation-duration:1.1s;height:100%}.card-music-wave .bar:nth-child(3){animation-duration:1.2s;height:50%}.card-music-wave .bar:nth-child(4){animation-duration:1.3s;height:80%}@keyframes cardWave{0%,to{height:40%}50%{height:100%}}.card-overlay-spotify{position:absolute;top:8px;left:8px;z-index:3;width:24px;height:24px;background:#0006;border-radius:50%;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:opacity .2s ease;opacity:.8}.card-overlay-spotify img{width:16px;height:16px;border-radius:50%}.card-overlay-spotify:hover{opacity:1;background:#0009}.card-overlay-like{position:absolute;top:8px;right:8px;z-index:3;width:28px;height:28px;background:#0006;border-radius:50%;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .2s ease;opacity:0}.card-container:hover .card-overlay-like{opacity:1}.card-overlay-like:hover{background:#0009;transform:scale(1.1)}.card-overlay-saved{position:absolute;top:10px;right:10px;z-index:3;background:var(--accent-primary);color:#fff;padding:4px 10px;border-radius:12px;font-size:.75rem;font-weight:700;display:flex;align-items:center;gap:5px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:1;box-shadow:0 4px 12px #0006;text-transform:uppercase;letter-spacing:.5px}.card-overlay-saved i{font-size:.75rem}.card-overlay-play{position:absolute;bottom:8px;right:8px;z-index:3;opacity:0;transform:translateY(8px);transition:all .3s cubic-bezier(.3,0,0,1)}.card-container:hover .card-overlay-play{opacity:1;transform:translateY(0)}.card-text-content{display:flex;flex-direction:column;gap:4px;width:100%}.card-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;width:100%}.card-title-link{text-decoration:none;flex:1;min-width:0}.card-name{font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:700;color:var(--text-primary, #ffffff);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-menu-wrapper{flex-shrink:0;margin-top:-4px;opacity:0;transition:opacity .2s ease;margin-left:auto}.card-container:hover .card-menu-wrapper{opacity:1}.card-subtitle-row{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%}.card-subtitle{font-family:Inter,Arial,sans-serif;font-size:.85rem;font-weight:400;color:var(--text-secondary, #a89ec4);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.card-subtitle a{color:inherit;text-decoration:none}.card-subtitle a:hover{text-decoration:underline}.like-icon-section{flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease}.like-icon-section:hover{transform:scale(1.1)}.like-icon-section:active{transform:scale(.9)}@media (max-width: 768px){.card-container{padding:8px;border-radius:8px}.card-img-wrapper{margin-bottom:8px}.card-name{font-size:.9rem}.card-subtitle{font-size:.75rem}.card-overlay-play{opacity:1;transform:none;bottom:6px;right:6px}.card-menu-wrapper,.card-overlay-like{opacity:1}}.play-btn{width:48px;height:48px;border-radius:50%;background-color:var(--accent-primary, #1db954);color:#000;display:flex;align-items:center;justify-content:center;font-size:1.2rem;border:none;cursor:pointer;box-shadow:0 8px 8px #0000004d;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;padding:0}.play-btn i{margin-left:4px}.play-btn i.fa-pause,.play-btn i.fa-spinner{margin-left:0}.play-btn:hover{background-color:#1ed760;transform:scale(1.05);box-shadow:0 12px 12px #0006}.play-btn:active{transform:scale(.95);background-color:#1aa34a}.play-btn.playing-active{background-color:var(--accent-primary, #1db954);color:#000}.play-btn:focus{outline:none;border:none}@media (max-width: 768px){.play-btn{width:40px;height:40px;font-size:1rem}}.lazy-image-container{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:#ffffff0d}.lazy-image-container.is-loading:before{content:"";position:absolute;top:0;left:-150%;width:50%;height:100%;background:linear-gradient(90deg,#fff0,#ffffff1a,#fff0);animation:shimmer 1.5s infinite ease-in-out;pointer-events:none}@keyframes shimmer{0%{left:-150%}to{left:150%}}.lazy-image{opacity:0;transition:opacity .5s ease-in-out;width:100%;height:100%;object-fit:cover}.lazy-image.is-loaded{opacity:1}.carousel-wrapper{position:relative;width:100%}.carousel-container{display:flex;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-ms-overflow-style:none;align-items:center;padding:.5rem 0;min-width:100%}.carousel-container::-webkit-scrollbar{display:none}.carousel-container{-ms-overflow-style:none}.carousel-card{flex:0 0 auto;scroll-snap-align:start;transition:transform .3s ease;min-width:0}.carousel-card:hover{transform:scale(1.05);z-index:2}.carousel-container:has(.carousel-card:nth-child(-n+12)) .carousel-card{flex-shrink:0}.carousel-container:has(.carousel-card:nth-child(-n+8):last-child){justify-content:flex-start}.carousel-container:has(.carousel-card:nth-child(-n+8):last-child) .carousel-card{margin-right:auto}.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:#1b22e5b3;color:#fff;border:none;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;font-size:1.2rem;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.carousel-arrow:hover{background:#c343d7a0;transform:translateY(-50%) scale(1.1)}.carousel-arrow:focus{outline:none}.carousel-arrow-left{left:-25px}.carousel-arrow-right{right:-25px}.carousel-dots{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}.carousel-dot{width:8px;height:8px;border-radius:50%;border:none;background:#fff6;cursor:pointer;transition:all .3s ease}.carousel-dot.active{background:#0389f7;transform:scale(1.2)}.carousel-dot:hover{background:#ffffffb3}.carousel-dot:focus{outline:2px solid #0389f7;outline-offset:2px}@media (max-width: 1280px){.carousel-card{flex:0 0 calc(20% - .8rem)}}@media (max-width: 1024px){.carousel-card{flex:0 0 calc(25% - .75rem)}.carousel-arrow{width:45px;height:45px;font-size:1.1rem}.carousel-arrow-left{left:-22px}.carousel-arrow-right{right:-22px}}@media (max-width: 768px){.carousel-card{flex:0 0 calc(33.333% - .33rem)}.carousel-arrow{width:40px;height:40px;font-size:1rem;display:none}.carousel-arrow-left{left:-20px}.carousel-arrow-right{right:-20px}.carousel-dots{display:none}}@media (max-width: 480px){.carousel-card{flex:0 0 calc(50% - .25rem)}.carousel-arrow{width:35px;height:35px;font-size:.9rem}.carousel-arrow-left{left:-17px}.carousel-arrow-right{right:-17px}}@media (max-width: 380px){.carousel-arrow{display:none}}.carousel-card{animation:slideIn .3s ease-out}.see-all-glass-card{background:var(--glass-bg);border-radius:var(--radius-md);height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-subtle);transition:transform .2s ease-in-out,box-shadow .3s ease-in-out,border-color .3s ease}.see-all-glass-card:hover{transform:scale(1.03);box-shadow:var(--shadow-glow);border-color:var(--accent-border)}.icon-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center}.icon-glow{background:var(--accent-dim);padding:1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .3s ease,box-shadow .3s ease}.icon-glow:hover{background:#a855f740;box-shadow:0 0 15px #a855f766}.see-all-big-icon{color:var(--accent-glow);height:2.2rem;width:2.2rem;stroke-width:2}.see-all-label{margin-top:.8rem;font-size:1rem;color:var(--text-primary);font-weight:600;letter-spacing:.05rem;text-align:center}@media (max-width: 768px){.see-all-label{font-size:.9rem}.see-all-big-icon{height:1.8rem;width:1.8rem}}.recently-played-section{margin-top:1.5rem}.recently-played-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-top:1rem}.recently-played-card{display:flex;align-items:center;background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:0;overflow:hidden;cursor:pointer;transition:all .3s ease;position:relative}.recently-played-card:hover{background:var(--glass-bg-hover);border-color:var(--accent-border)}.rp-thumbnail{width:60px;height:60px;object-fit:cover;flex-shrink:0;box-shadow:2px 0 10px #0000004d}.rp-info{flex:1;padding:0 1rem;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.rp-title{font-size:.95rem;font-weight:600;color:var(--text-primary);margin:0 0 .2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rp-artist{font-size:.8rem;color:var(--text-secondary);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rp-play-btn{width:40px;height:40px;border-radius:50%;background:var(--accent-primary);color:#fff;border:none;display:flex;align-items:center;justify-content:center;margin-right:1rem;opacity:0;transform:scale(.8);transition:all .3s ease;box-shadow:var(--shadow-glow)}.recently-played-card:hover .rp-play-btn{opacity:1;transform:scale(1)}@media (max-width: 768px){.recently-played-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.rp-thumbnail{width:50px;height:50px}.rp-play-btn{display:none}}@media (max-width: 480px){.recently-played-grid{grid-template-columns:1fr}}.artist-grid-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1.5rem;padding:1rem 0 1.5rem;justify-items:center}.artist-circular-card{display:flex;flex-direction:column;align-items:center;width:140px;cursor:pointer;flex-shrink:0;transition:transform .3s ease}.artist-circular-card:hover{transform:translateY(-5px)}.artist-img-wrapper{position:relative;width:130px;height:130px;border-radius:50%;margin-bottom:.75rem;box-shadow:0 8px 24px #00000080;transition:all .3s ease}.artist-circular-img{width:100%;height:100%;border-radius:50%;object-fit:cover;transition:opacity .3s ease}.artist-circular-card:hover .artist-img-wrapper{box-shadow:0 12px 30px #a855f74d}.artist-circular-card:hover .artist-circular-img{opacity:.7}.artist-play-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);width:48px;height:48px;background:var(--accent-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;opacity:0;transition:all .3s ease;box-shadow:var(--shadow-glow)}.artist-circular-card:hover .artist-play-overlay{opacity:1;transform:translate(-50%,-50%) scale(1)}.artist-name{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.artist-label{font-size:.8rem;color:var(--text-secondary);margin:.2rem 0 0;text-align:center}@media (max-width: 768px){.artist-grid-container{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:1rem}.artist-circular-card{width:110px}.artist-img-wrapper{width:100px;height:100px}.artist-name{font-size:.9rem}}.hero-container{position:relative;width:98%;margin:.5rem auto 1.5rem;height:320px;border-radius:var(--radius-lg, 20px);overflow:hidden;contain:paint;box-shadow:0 12px 48px #000000b3;display:flex;align-items:center;transition:all .3s ease;border:1px solid var(--border-subtle, rgba(255, 255, 255, .06));isolation:isolate;transform:translateZ(0);-webkit-transform:translateZ(0)}.hero-bg-clip{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:inherit;z-index:1}.hero-background{position:absolute;top:-20px;right:-20px;bottom:-20px;left:-20px;background-size:cover;background-position:center;filter:blur(45px) brightness(.4);border-radius:inherit}.hero-content{position:relative;z-index:2;display:flex;flex-direction:row;align-items:center;padding:2rem 2.5rem;width:100%;gap:2rem;background:linear-gradient(90deg,#000000e6,#07000fa6)}.hero-image-wrapper{flex-shrink:0;box-shadow:0 12px 32px #0009;border-radius:var(--radius-md, 14px);transition:transform .3s ease;overflow:hidden;border:1px solid var(--accent-border, rgba(168, 85, 247, .2))}.hero-image-wrapper:hover{transform:scale(1.02)}.hero-img{width:230px;height:230px;object-fit:cover;display:block}.hero-details{color:#fff;display:flex;flex-direction:column;justify-content:center;max-width:600px}.hero-label{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-primary, #a855f7);font-weight:700;margin-bottom:.4rem;font-family:Inter,sans-serif}.hero-title{font-family:Inter,sans-serif;font-size:2.8rem;font-weight:800;margin:0 0 .75rem;line-height:1.1;letter-spacing:-.03em;text-shadow:0 4px 16px rgba(0,0,0,.5);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hero-description{font-family:Inter,sans-serif;font-size:1rem;color:var(--text-secondary, #a89ec4);margin-bottom:1.5rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:90%;font-weight:400}.hero-buttons{display:flex;gap:1rem}.hero-play-btn{background:linear-gradient(135deg,var(--accent-primary, #a855f7),var(--accent-secondary, #6366f1));color:#fff;padding:12px 32px;border-radius:var(--radius-full, 9999px);text-decoration:none;font-family:Inter,sans-serif;font-weight:700;font-size:.9rem;display:flex;align-items:center;gap:.6rem;transition:all .2s cubic-bezier(.25,.46,.45,.94);box-shadow:0 4px 16px #a855f766;border:none;cursor:pointer;letter-spacing:.01em}.hero-play-btn:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 24px #a855f780}.hero-play-btn:active{transform:scale(.97)}@media (max-width: 1024px){.hero-container{height:auto;min-height:280px}.hero-content{padding:1.75rem}.hero-img{width:200px;height:200px}.hero-title{font-size:2.2rem}}@media (max-width: 768px){.hero-container{flex-direction:column;height:auto;margin:.5rem 0;width:100%;border-radius:var(--radius-md, 14px)}.hero-content{flex-direction:column;text-align:center;padding:1.5rem 1.25rem;background:linear-gradient(180deg,#0000008c,#07000feb);gap:1.25rem}.hero-image-wrapper{box-shadow:0 8px 24px #0009}.hero-img{width:160px;height:160px}.hero-details{align-items:center}.hero-title{font-size:1.7rem;margin-bottom:.5rem}.hero-description{font-size:.9rem;margin:0 auto 1.25rem;-webkit-line-clamp:3;max-width:100%}.hero-buttons{width:100%;justify-content:center}.hero-play-btn{padding:11px 22px;font-size:.85rem}}@media (max-width: 380px){.hero-img{width:130px;height:130px}.hero-title{font-size:1.4rem}}.category-pills-wrapper{position:relative;width:100%;margin:.25rem 0 .5rem}.category-pills-container{display:flex;gap:.6rem;overflow-x:auto;padding:.75rem .25rem;scrollbar-width:none;scroll-behavior:smooth}.category-pills-container::-webkit-scrollbar{display:none}.category-pill{background:var(--glass-bg, rgba(255,255,255,.05));border:1px solid var(--border-subtle, rgba(255,255,255,.08));color:var(--text-secondary, #a89ec4);display:inline-block;padding:.5rem 1.1rem;border-radius:var(--radius-full, 9999px);font-family:Inter,sans-serif;font-size:.82rem;font-weight:600;white-space:nowrap;cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);letter-spacing:.01em}.category-pill:hover{background:var(--accent-dim, rgba(168,85,247,.15));border-color:var(--accent-border, rgba(168,85,247,.3));color:var(--accent-glow, #c084fc);transform:translateY(-1px);box-shadow:0 4px 12px #a855f733}.category-pill-link{text-decoration:none;display:inline-block}.category-fade-right{position:absolute;top:0;right:0;height:100%;width:60px;background:linear-gradient(90deg,transparent,var(--bg-base, #07000f));pointer-events:none}@media (max-width: 768px){.category-pills-wrapper{width:100%;padding-left:0}.category-pill{padding:.45rem .9rem;font-size:.78rem}}.connect-spotify-section{position:relative;width:100%;margin:1.5rem 0;background:linear-gradient(135deg,#1db9541f,#0e0819d9);border-radius:var(--radius-lg, 20px);padding:2rem 2.5rem;overflow:hidden;box-shadow:0 8px 32px #0006;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(29,185,84,.2)}.connect-spotify-content{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;width:100%;gap:2rem}.connect-spotify-text h2{font-family:Inter,sans-serif;font-size:1.75rem;font-weight:800;letter-spacing:-.02em;color:var(--text-primary, #f1eeff);margin:0 0 .4rem}.connect-spotify-text p{font-family:Inter,sans-serif;font-size:.9rem;color:var(--text-secondary, #a89ec4);margin:0;max-width:500px;line-height:1.6}.connect-spotify-cta-btn{background-color:#1db954;color:#000;border:none;padding:14px 32px;border-radius:2rem;font-size:1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:.8rem;transition:all .2s ease;white-space:nowrap;box-shadow:0 4px 15px #1db95466}.connect-spotify-cta-btn:hover{background-color:#1ed760;transform:scale(1.05)}.connect-spotify-bg-icon{position:absolute;right:-30px;top:50%;transform:translateY(-50%) rotate(15deg);font-size:15rem;color:#ffffff08;z-index:1;pointer-events:none}@media (max-width: 768px){.connect-spotify-section{padding:2rem 1.5rem;flex-direction:column;text-align:center}.connect-spotify-content{flex-direction:column;gap:1.5rem}.connect-spotify-text h2{font-size:1.5rem}.connect-spotify-text p{font-size:.9rem}.connect-spotify-cta-btn{width:100%;justify-content:center}}.hcb-banner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;background:linear-gradient(135deg,#a855f714,#6366f10f);border:1px solid var(--accent-border);padding:1.5rem 2rem;border-radius:var(--radius-lg);margin:1.5rem 0;position:relative;overflow:hidden;transition:all .3s ease}.hcb-banner:before{content:"";position:absolute;top:-60px;right:-40px;width:220px;height:220px;background:radial-gradient(circle,rgba(168,85,247,.12) 0%,transparent 70%);pointer-events:none}.hcb-banner:hover{border-color:#a855f766;background:linear-gradient(135deg,#a855f71f,#6366f114)}.hcb-left{display:flex;align-items:center;gap:1.2rem;position:relative;z-index:1}.hcb-icon{width:3rem;height:3rem;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:#fff;box-shadow:var(--shadow-glow);flex-shrink:0}.hcb-text h2{font-size:1.2rem;font-weight:700;color:var(--text-primary);margin:0 0 .2rem;letter-spacing:-.01em}.hcb-text p{font-size:.85rem;color:var(--text-secondary);margin:0}.hcb-btn{display:inline-flex;align-items:center;gap:.45rem;height:2.4rem;padding:0 1.25rem;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;font-family:Inter,sans-serif;font-size:.875rem;font-weight:700;cursor:pointer;transition:all .2s ease;white-space:nowrap;box-shadow:0 4px 14px #a855f766;border:none;position:relative;z-index:1;flex-shrink:0}.hcb-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #a855f78c;filter:brightness(1.1)}.hcb-btn:active{transform:scale(.97)}@media (max-width: 600px){.hcb-banner{flex-direction:column;align-items:flex-start;padding:1.25rem}.hcb-btn{width:100%;justify-content:center}}.section-loading{display:flex;flex-direction:column;gap:1rem;align-items:center;justify-content:center;padding-top:2rem}.material-loading{display:flex;margin-top:.3rem;padding:.75rem .5rem 1rem;margin-bottom:.5rem;gap:.75rem;overflow:hidden;background:linear-gradient(160deg,#a855f70f,#0e081980,#6366f10a);border-radius:var(--radius-lg, 20px);border:1px solid var(--border-subtle, rgba(255, 255, 255, .05));align-items:center;width:100%;max-width:100%}.material-loading::-webkit-scrollbar{height:4px}.material-loading::-webkit-scrollbar-track{background:transparent}.material-loading::-webkit-scrollbar-thumb{background:var(--accent-dim, rgba(168, 85, 247, .2));border-radius:4px}@media (max-width: 768px){.section{margin-top:0;margin-left:0}.material-loading{padding-left:.5rem;padding-right:.5rem;gap:.5rem}}.scroll-reveal{opacity:0;transform:translateY(30px);transition:opacity .6s cubic-bezier(.25,.46,.45,.94),transform .6s cubic-bezier(.25,.46,.45,.94);will-change:opacity,transform}.scroll-reveal.is-visible{opacity:1;transform:translateY(0)}#artist-name{color:var(--text-primary, #f1eeff);font-family:Inter,sans-serif;font-size:clamp(1.2rem,5vw,3rem);font-weight:800;letter-spacing:-.02em;overflow-wrap:break-word;overflow:auto;text-align:center;margin:.5rem 0}.mainInfo{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:15rem;background:var(--glass-bg, rgba(255,255,255,.04));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-md, 14px);border:1px solid var(--border-subtle);padding:1rem;flex-wrap:wrap;gap:1.5rem;box-sizing:border-box}.name-stat{display:flex;align-items:center;justify-content:center;width:100%;max-width:600px;overflow:hidden;text-align:center;padding:.5rem;box-sizing:border-box}@keyframes slideIn{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}.mainInfo{animation:slideIn .3s ease-out}@media (max-width: 1024px){.mainInfo{flex-direction:column;padding:1.5rem}#artist-name{font-size:clamp(1.8rem,4vw,3.5rem)}.name-stat{width:90%}}@media (max-width: 600px){#artist-name{font-size:clamp(1.5rem,6vw,2.5rem)}.name-stat{width:100%}.mainInfo{padding:1rem;gap:1rem}}#artist-followers-count{color:#8d8989;font-size:.95rem;font-family:"Exo 2",sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:5 00;letter-spacing:.1rem;margin-top:.7rem;text-align:center}#artist-followers-count i{margin-right:2.5rem}@media (max-width: 768px){#artist-followers-count{font-size:.7rem}#artist-followers-count i{margin-right:1.5rem}}.artist-pic-lazy{border:.12rem solid rgb(0,242,255);border-radius:50%;height:15rem;width:15rem;margin-left:1rem;margin-right:1rem}@media (max-width: 768px){.artist-pic-lazy{height:10rem;width:10rem;margin-left:.5rem;margin-right:.5rem}}#followbtn{background:linear-gradient(45deg,#180443,#6966ff);color:#fff;border:2px solid hsl(260,97%,61% / .75);padding:10px 20px;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;margin-top:1.3rem;border-radius:2rem}.follow-btn-container{display:flex;align-items:center;justify-content:center;width:100%}#followbtn:before{content:"";position:absolute;top:50%;left:50%;width:300%;height:300%;background:#ffffff26;transition:all .5s ease;transform:translate(-50%,-50%) rotate(45deg);z-index:0}#followbtn:hover:before{width:0;height:0}#followbtn:hover{box-shadow:0 12px 24px #0006;transform:translateY(-4px)}#followbtn:active{box-shadow:0 6px 12px #0006;transform:translateY(0);outline:none;box-shadow:none;border:none}#followbtn:focus{outline:none;box-shadow:none;border:none}#followbtn span{position:relative;z-index:1;font-family:"Exo 2",sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:500;letter-spacing:.1rem}@media (max-width: 768px){#followbtn{align-items:center;justify-content:center;padding:8px 16px;font-size:16px;border-radius:2rem;width:50%}#followbtn span{font-size:14px}}#artist-trend-score{color:#8d8989;font-size:.95rem;font-family:"Exo 2",sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:5 00;letter-spacing:.1rem;margin-top:.7rem;text-align:center}#artist-trend-score i{margin-right:2.5rem}@media (max-width: 768px){#artist-trend-score{font-size:.7rem}#artist-trend-score i{margin-right:1.5rem}}.artist-top-track-container{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;background:linear-gradient(#26046b77,#0f012385,#01294a1c);border-radius:2rem;padding:1rem;overflow:hidden}@media (max-width: 768px){.artist-top-track-container{padding:.3rem;gap:.2rem;overflow:hidden}}.track-line-card{display:flex;align-items:center;padding:.5rem .85rem;border-radius:var(--radius-md, 14px);justify-content:space-between;gap:.85rem;width:100%;box-sizing:border-box;transition:background-color .2s ease;font-family:Inter,sans-serif}.track-line-card:hover{background-color:var(--glass-bg-hover, rgba(255,255,255,.06))}.img-container img{width:2.8rem;height:2.8rem;border-radius:var(--radius-sm, 8px);object-fit:cover;display:block;border:1px solid var(--border-subtle)}.track-line-card p{color:var(--text-primary, #f1eeff);font-family:Inter,sans-serif;font-size:.9rem;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-rank{width:2rem;flex-shrink:0;text-align:center;color:var(--text-muted, #5c5278);font-size:.8rem;font-weight:500}.Track-name{flex:2;min-width:0}.Track-artists-name{flex:1.5;min-width:0}.Track-artists-name p{color:var(--text-secondary, #a89ec4);font-size:.82rem}.Track-artists-name p a{color:inherit;text-decoration:none}.Track-artists-name p a:hover{text-decoration:underline}.Duration{width:4rem;flex-shrink:0;text-align:right}.Duration p{color:var(--text-muted, #5c5278);font-size:.8rem}.spotify-logo{display:flex;align-items:center;justify-content:center}.track-play{width:2.2rem;height:2.2rem;color:var(--accent-primary, #a855f7);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .2s ease;background:var(--accent-dim, rgba(168,85,247,.1))}.track-play:hover{background:var(--accent-dim);color:var(--accent-glow);transform:scale(1.1);box-shadow:0 4px 12px #a855f740}.music-wave-container{display:flex;align-items:flex-end;justify-content:center;width:100%;height:1.4rem;gap:2px;margin:0 auto}.bar{width:3px;background-color:var(--accent-primary, #a855f7);border-radius:2px;animation:wave 1s ease-in-out infinite}@keyframes wave{0%{height:10%}50%{height:100%}to{height:10%}}.bar:nth-child(1){animation-delay:0s;height:40%}.bar:nth-child(2){animation-delay:.2s;height:100%}.bar:nth-child(3){animation-delay:.4s;height:60%}.bar:nth-child(4){animation-delay:.1s;height:80%}@keyframes slideIn{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.track-line-card{animation:slideIn .3s ease-out}@media (max-width: 768px){.track-line-card{padding:.45rem .5rem;gap:.6rem;border-radius:var(--radius-sm, 8px)}.img-container img{width:2.4rem;height:2.4rem}.track-rank{display:none}.Track-name{flex:1}.Track-name p{font-size:.85rem}.Track-artists-name,.Duration,.spotify-logo{display:none}.track-play{width:2rem;height:2rem;font-size:.85rem}@media (min-width: 480px){.Track-artists-name{display:block;flex:1}.Track-artists-name p{font-size:.78rem}}}.upcoming-concerts{background:linear-gradient(135deg,#000,#010218,#2c002755);padding:2rem;border-radius:12px;margin:2rem 0}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.section-header h2{font-size:2rem;font-weight:700;margin:0;background:linear-gradient(45deg,#f8f7f9d8,#64b9e3);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.view-all-btn{background:transparent;border:2px solid #7b68ee;color:#7b68ee;padding:.5rem 1.5rem;border-radius:25px;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:.9rem}.view-all-btn:hover{background:#7b68ee;color:#fff;transform:translateY(-2px)}.view-all-btn:focus{outline:none;box-shadow:none;border:none}.concerts-list{display:flex;flex-direction:column;gap:.75rem}.concert-card{background:#00000050;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(15px);border:1px solid rgba(12,0,0,.15);border-radius:12px;padding:1rem 1.25rem;display:flex;align-items:center;gap:1rem;transition:all .3s ease}.concert-card:hover{background:#ffffff1f;border-color:#7b68ee66;box-shadow:0 8px 25px #00d4ff1a}.date-section{display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#dedcec7e,#7a7ab06e);border-radius:8px;padding:.75rem .5rem;min-width:50px;text-align:center}.month{color:#fff;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;line-height:1}.day{color:#fff;font-size:1.25rem;font-weight:700;line-height:1;margin-top:.1rem}.concert-card:hover{transform:scale(1.05)}.concert-details{flex:1;min-width:0}.concert-title{color:#5ea6ea;font-size:1.1rem;font-weight:700;margin:0 0 .25rem;line-height:1.2}.concert-artist{color:#a8a8a8;font-size:.9rem;font-weight:500;margin:0 0 .5rem}.concert-datetime{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.concert-day{color:#a8a8a8;font-size:.85rem;font-weight:500}.concert-time{color:#fff;font-size:.85rem;font-weight:500}.concert-venue{color:#a8a8a8;font-size:.85rem;font-weight:400}.concert-actions{display:flex;align-items:center;cursor:pointer}.book-btn{background:linear-gradient(45deg,#7b68ee,#00d4ff);border:none;color:#fff;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}.book-btn:hover{transform:scale(1.1);box-shadow:0 4px 15px #7b68ee66}.no-events{display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#000,#010218,#2c002755);color:#b0c4ff;font-size:1rem;padding:1rem;margin:2rem auto;border-radius:16px;box-shadow:0 4px 12px #0033cc4d;max-width:500px;text-align:center;transition:all .3s ease}.no-events p{display:flex;align-items:center;gap:.5rem;margin:0;font-weight:500;font-family:Segoe UI,sans-serif}@media (max-width: 600px){.no-events{font-size:1rem;padding:1.2rem;margin:1rem}}@media (max-width: 1200px){.concert-card{padding:.875rem 1rem;gap:.875rem}.concert-image{width:55px;height:55px;display:none}}@media (max-width: 768px){.upcoming-concerts{padding:1.5rem;margin:1rem 0}.section-header{flex-direction:column;align-items:flex-start;gap:1rem}.section-header h2{font-size:1.75rem}.view-all-btn{align-self:stretch;text-align:center}.concert-card{padding:.75rem;gap:.75rem}.date-section{min-width:45px;padding:.5rem .375rem}.month{font-size:.65rem}.day{font-size:1.1rem}.concert-image{width:50px;height:50px;display:none}.concert-datetime{flex-direction:column;align-items:flex-start;gap:.25rem}.concert-location{margin-right:.5rem}}@media (max-width: 480px){.upcoming-concerts{padding:1rem;margin:.5rem 0;border-radius:8px}.section-header h2{font-size:1.5rem}.view-all-btn{padding:.4rem 1.2rem;font-size:.85rem}.concert-card{padding:.75rem;gap:.5rem;flex-wrap:wrap}.date-section{min-width:40px;padding:.4rem .3rem}.month{font-size:.6rem}.day{font-size:1rem}.concert-image{width:45px;height:45px}.concert-title{font-size:1rem}.concert-artist{font-size:.85rem}.concert-datetime{gap:.5rem}.concert-day,.concert-time,.concert-venue,.country{font-size:.8rem}.book-btn{width:32px;height:32px}}@media (max-width: 320px){.upcoming-concerts{padding:.75rem}.concert-card{padding:.5rem;gap:.5rem}.section-header h2{font-size:1.25rem}.concert-datetime{flex-direction:column;gap:.25rem}.concert-location{order:-1;margin-right:0;margin-bottom:.25rem}}.artist-page-bg{margin-top:.5rem;padding:1rem .75rem 1.25rem;margin-bottom:.5rem;gap:1rem;overflow:hidden;background:linear-gradient(160deg,#a855f714,#0e081980,#6366f10a);border-radius:var(--radius-lg, 20px);border:1px solid var(--border-subtle)}.buttons-container{display:flex;gap:.5rem;padding:1.5rem 0 .75rem;justify-content:center;flex-wrap:wrap}.artist-page-bg .btn{padding:.55rem 1.2rem;font-family:Inter,sans-serif;font-weight:500;font-size:.875rem;letter-spacing:.01em;border:1px solid var(--border-mid, rgba(255,255,255,.12));border-radius:var(--radius-full, 9999px);background:var(--glass-bg);color:var(--text-secondary);cursor:pointer;transition:all .2s ease;outline:none}.artist-page-bg .btn:hover{background:var(--glass-bg-hover);color:var(--text-primary);border-color:var(--accent-border)}.artist-page-bg .btn:focus{outline:none;border:1px solid var(--accent-border)}.artist-page-bg .selected{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;border-color:transparent;box-shadow:0 4px 14px #a855f759}.artist-page-bg .selected:hover{filter:brightness(1.1);transform:translateY(-1px)}.custom-hr{border:none;border-top:1px solid var(--border-subtle);margin:.75rem 0;width:100%}@media (max-width: 768px){.artist-page-bg{padding:.75rem .5rem;margin-top:.25rem}.artist-page-bg .btn{font-size:.8rem;padding:.45rem .85rem}}#playlist-description{margin-top:10px;font-size:1rem;color:#b3b3b3;font-family:Arial,Helvetica,sans-serif;font-weight:400;padding:0 20px;text-align:center}#playlist-name{color:#cfedf2;font-size:clamp(1rem,5vw,3rem);overflow-wrap:break-word;overflow:auto;text-align:center;margin:.5rem 0}.mainInfo-1{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:15rem;background-color:#00000080;border-radius:10px;padding:1rem;flex-wrap:wrap;gap:1.5rem;box-sizing:border-box}.name-stat-1{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-width:280px;text-align:center;padding:10px}.track-play-container{display:flex;gap:.3rem;padding-top:1.5rem;padding-bottom:1rem;justify-content:flex-start;padding-left:1.5rem;width:100%}.name-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;width:30%;text-align:center;padding:10px}@media (max-width: 768px){#playlist-description{font-size:.6rem;margin-top:8px}.mainInfo-1{flex-direction:column;padding:1.5rem}.name-stat-1{width:100%;min-width:auto}.track-play-container{justify-content:center;padding-left:0}.name-stat{width:100%;text-align:center;flex-wrap:wrap;padding:5px 10px}}.playlist-pic-lazy{border:.12rem solid rgb(0,242,255);border-radius:2rem;height:15rem;width:15rem;margin-left:1rem;margin-right:1rem}@media (max-width: 768px){.playlist-pic-lazy{height:10rem;width:10rem;margin-left:.5rem;margin-right:.5rem}}.playlist-track-container{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;background:linear-gradient(#26046b77,#0f012385,#01294a1c);border-radius:2rem;padding:1rem;margin-bottom:0}.not-found-container{display:flex;justify-content:center;align-items:center;height:100vh;background:var(--bg-base, #07000f);color:var(--text-primary, #f1eeff);text-align:center;overflow:hidden;font-family:Inter,sans-serif}.not-found-content{background:var(--glass-bg, rgba(255,255,255,.04));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding:3rem 4rem;border-radius:var(--radius-xl, 28px);border:1px solid var(--border-subtle, rgba(255,255,255,.06));box-shadow:0 16px 48px #00000080;max-width:560px;animation:fadeIn .7s ease-in-out}.not-found-heading{font-size:5rem;font-weight:900;letter-spacing:-.04em;background:linear-gradient(135deg,var(--accent-glow, #c084fc),var(--accent-secondary, #6366f1));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:slideIn .7s ease-out;margin-bottom:.5rem}.not-found-description{font-size:1.35rem;font-weight:700;margin:.75rem 0;color:var(--text-primary);animation:fadeIn .9s ease-in-out}.not-found-subheading{font-size:1rem;color:var(--text-secondary, #a89ec4);margin-bottom:2rem;line-height:1.6;animation:fadeIn 1.1s ease-in-out}.back-home-btn{display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,var(--accent-primary, #a855f7),var(--accent-secondary, #6366f1));color:#fff;padding:.75rem 1.75rem;font-family:Inter,sans-serif;font-size:.95rem;font-weight:700;border:none;cursor:pointer;border-radius:var(--radius-full, 9999px);transition:all .2s ease;text-decoration:none;box-shadow:0 4px 16px #a855f766}.back-home-btn:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 24px #a855f780}.back-home-btn:focus{outline:none}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{transform:translate(-30px);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 480px){.not-found-content{padding:2rem 1.5rem;margin:1rem;border-radius:var(--radius-lg)}.not-found-heading{font-size:3.5rem}.not-found-description{font-size:1.1rem}.back-home-btn{padding:.65rem 1.25rem;font-size:.875rem}}.page-container{padding:0;min-height:100vh;background:var(--bg-base, #07000f);padding-bottom:4rem}.category-hero{position:relative;width:100%;height:280px;background:linear-gradient(135deg,rgba(168,85,247,.5) 0%,rgba(99,102,241,.6) 50%,var(--bg-surface-2, #160d28) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:2rem 2.5rem;box-shadow:0 10px 40px #00000080;overflow:hidden;margin-bottom:2rem}.category-hero:before{content:"";position:absolute;top:-50px;right:-50px;width:300px;height:300px;background:#ffffff1a;border-radius:50%;filter:blur(60px)}.category-header-content{position:relative;z-index:2;animation:slideDown .6s ease-out}.back-btn{position:absolute;top:2rem;left:2rem;background:#0000004d;color:#fff;border:none;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:10}.back-btn:hover{background:#fff3;transform:scale(1.1)}.category-label{font-size:.9rem;letter-spacing:2px;text-transform:uppercase;color:#fffc;margin-bottom:.5rem;font-weight:700}.category-title{font-size:4.5rem;font-weight:900;color:#fff;margin:0;line-height:1;letter-spacing:-2px;text-shadow:0 4px 20px rgba(0,0,0,.3);text-transform:capitalize}.category-subtitle{color:#e0e0e0;margin-top:1rem;font-size:1.1rem;font-weight:400;max-width:600px;opacity:.9}.grid-wrapper{padding:0 3rem;animation:fadeIn .8s ease-out}.grid-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2rem;justify-items:stretch}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 1024px){.category-hero{height:250px;padding:2rem}.category-title{font-size:3.5rem}.grid-container{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem}.grid-wrapper{padding:0 2rem}}@media (max-width: 768px){.category-hero{height:auto;min-height:220px;padding:4rem 1.5rem 2rem;justify-content:center}.back-btn{top:1.5rem;left:1.5rem}.category-label{font-size:.8rem}.category-title{font-size:2.8rem}.category-subtitle{font-size:.95rem}.grid-wrapper{padding:0 1rem}.grid-container{grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:.8rem;justify-items:stretch}}.pp-page{max-width:960px;margin:0 auto;padding-bottom:4rem;color:var(--text-primary)}.sk-box{background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-md);animation:pp-pulse 1.6s ease-in-out infinite}@keyframes pp-pulse{0%,to{opacity:.7}50%{opacity:.3}}.sk-hero{background:none;border:none;animation:none}.pp-hero{position:relative;overflow:hidden;border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--bg-surface-3) 0%,var(--bg-surface-2) 60%,rgba(168,85,247,.08) 100%);border:1px solid var(--border-subtle);padding:2.5rem;margin-bottom:1.5rem;box-shadow:var(--shadow-card)}.pp-hero-glow{position:absolute;top:-80px;right:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(168,85,247,.18) 0%,transparent 70%);pointer-events:none}.pp-hero-inner{display:flex;align-items:center;gap:2rem;position:relative;z-index:1}.pp-avatar-wrap{position:relative;flex-shrink:0}.pp-avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--accent-border);box-shadow:0 0 0 6px #a855f71f,var(--shadow-card);transition:transform .3s ease}.pp-avatar:hover{transform:scale(1.04)}.pp-online-dot{position:absolute;bottom:8px;right:8px;width:16px;height:16px;border-radius:50%;background:var(--spotify-green);border:3px solid var(--bg-surface-3);box-shadow:0 0 8px var(--spotify-green)}.pp-hero-text{flex:1;min-width:0}.pp-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:.75rem}.pp-badge{display:inline-flex;align-items:center;gap:5px;font-size:.65rem;font-weight:700;letter-spacing:.08em;padding:4px 10px;border-radius:var(--radius-full)}.pp-badge--beatyx{background:var(--accent-dim);color:var(--accent-glow);border:1px solid var(--accent-border)}.pp-badge--spotify{background:var(--spotify-green-dim);color:var(--spotify-green);border:1px solid rgba(29,185,84,.3)}.pp-name{font-size:2.4rem;font-weight:900;letter-spacing:-.03em;line-height:1.1;background:linear-gradient(130deg,#fff 20%,var(--accent-glow) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.35rem}.pp-email{display:flex;align-items:center;gap:6px;font-size:.875rem;color:var(--text-secondary);margin-bottom:1.25rem}.pp-hero-actions{display:flex;flex-wrap:wrap;gap:10px}.pp-tabs{display:flex;gap:4px;background:var(--bg-surface-1);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:5px;margin-bottom:1.5rem;width:fit-content}.pp-tab-btn{display:inline-flex;align-items:center;gap:7px;padding:.55rem 1.2rem;border-radius:var(--radius-md);border:none;background:transparent;color:var(--text-secondary);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.pp-tab-btn:hover{color:var(--text-primary)}.pp-tab-btn.active{background:var(--accent-dim);color:var(--accent-glow);border:1px solid var(--accent-border)}.pp-tab-body{animation:pp-fade-in .3s ease}@keyframes pp-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.pp-folder-grid{display:flex;flex-direction:column;gap:12px}.pp-folder-card{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.4rem;background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);cursor:pointer;transition:all .2s ease}.pp-folder-card:hover{background:var(--glass-bg-hover);border-color:var(--accent-border);transform:translate(4px)}.pp-folder-card--disabled{cursor:default;opacity:.7}.pp-folder-card--disabled:hover{transform:none;border-color:var(--border-subtle)}.pp-fc-icon{width:46px;height:46px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}.pp-fc-icon--heart{background:#ef444426;color:#f87171}.pp-fc-icon--playlist{background:var(--accent-dim);color:var(--accent-glow)}.pp-fc-info{flex:1}.pp-fc-info h3{font-size:1rem;font-weight:700;margin-bottom:3px;color:var(--text-primary)}.pp-fc-info p{font-size:.82rem;color:var(--text-secondary)}.pp-fc-arrow{color:var(--text-muted)}.pp-no-data{color:var(--text-muted)!important;font-style:italic}.pp-no-data--center{text-align:center;padding:2rem}.pp-soon-badge{font-size:.65rem;font-weight:700;background:var(--accent-dim);color:var(--accent-glow);border:1px solid var(--accent-border);padding:3px 9px;border-radius:var(--radius-full);letter-spacing:.05em}.pp-sp-connect{display:flex;flex-direction:column;align-items:center;text-align:center;padding:3.5rem 2rem;background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);gap:.75rem}.pp-sp-connect-icon{width:80px;height:80px;border-radius:50%;background:var(--spotify-green-dim);display:flex;align-items:center;justify-content:center;color:var(--spotify-green);margin-bottom:.5rem}.pp-sp-connect h2{font-size:1.5rem;font-weight:800;color:var(--text-primary)}.pp-sp-connect p{font-size:.9rem;color:var(--text-secondary);max-width:380px;line-height:1.55}.pp-sp-connect .btn-spotify{margin-top:.5rem}.pp-sp-banner{display:flex;align-items:center;gap:1.25rem;padding:1.25rem 1.5rem;background:linear-gradient(135deg,var(--spotify-green-dim),transparent);border:1px solid rgba(29,185,84,.2);border-radius:var(--radius-lg);margin-bottom:2rem}.pp-sp-avatar{width:68px;height:68px;border-radius:50%;object-fit:cover;border:2px solid rgba(29,185,84,.5);flex-shrink:0}.pp-sp-label{font-size:.7rem;font-weight:700;letter-spacing:.08em;color:var(--spotify-green);text-transform:uppercase;margin-bottom:3px}.pp-sp-name{font-size:1.4rem;font-weight:800;color:var(--text-primary);margin-bottom:8px}.pp-sp-meta{display:flex;flex-wrap:wrap;gap:6px}.pp-sp-chip{font-size:.72rem;font-weight:600;padding:3px 10px;border-radius:var(--radius-full);background:#1db9541a;color:var(--spotify-green);border:1px solid rgba(29,185,84,.2)}.pp-sp-section{margin-bottom:2.5rem}.pp-sp-section-title{display:flex;align-items:center;gap:8px;font-size:1.05rem;font-weight:700;color:var(--text-primary);margin-bottom:1rem;padding-bottom:.6rem;border-bottom:1px solid var(--border-subtle)}.pp-sp-section-title svg{color:var(--accent-primary)}.pp-artist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px}.pp-artist-card{background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:14px 10px;text-align:center;cursor:pointer;transition:all .25s ease}.pp-artist-card:hover{background:var(--glass-bg-hover);border-color:var(--accent-border);transform:translateY(-4px);box-shadow:var(--shadow-glow)}.pp-artist-img-wrap{position:relative;width:80px;height:80px;margin:0 auto 10px}.pp-artist-img-wrap img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid var(--border-mid)}.pp-rank{position:absolute;bottom:-4px;right:-4px;background:var(--accent-primary);color:#fff;font-size:.65rem;font-weight:800;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--bg-surface-2)}.pp-artist-name{font-size:.82rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pp-track-list{display:flex;flex-direction:column;gap:4px;background:var(--bg-surface-1);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:6px}.pp-track-row{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:var(--radius-md);cursor:pointer;transition:background .2s ease}.pp-track-row:hover{background:var(--glass-bg-hover)}.pp-track-idx{width:22px;text-align:center;font-size:.8rem;font-weight:600;color:var(--text-muted);flex-shrink:0}.pp-track-thumb{width:42px;height:42px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0}.pp-track-info{flex:1;min-width:0}.pp-track-name{font-size:.9rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.pp-track-artist{font-size:.78rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pp-track-dur{font-size:.78rem;color:var(--text-muted);font-variant-numeric:tabular-nums;flex-shrink:0}@media (max-width: 640px){.pp-hero{padding:1.5rem}.pp-hero-inner{flex-direction:column;text-align:center;gap:1.25rem}.pp-badges,.pp-email,.pp-hero-actions{justify-content:center}.pp-avatar{width:90px;height:90px}.pp-name{font-size:1.8rem}.pp-tabs{width:100%}.pp-tab-btn{flex:1;justify-content:center}.pp-artist-grid{grid-template-columns:repeat(3,1fr)}}.playlists-page-container{padding:2rem 1.5rem;max-width:1200px;margin:0 auto}.playlists-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.playlists-header h1{font-size:2.5rem;font-weight:800;margin:0;background:linear-gradient(135deg,#fff,var(--accent-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.create-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1.2rem;border-radius:var(--radius-full)}.playlists-tabs{display:flex;gap:1rem;margin-bottom:2rem;border-bottom:1px solid var(--border-subtle);padding-bottom:1rem}.pl-tab{background:none;border:none;color:var(--text-secondary);font-size:1.1rem;font-weight:600;padding:.5rem 1rem;cursor:pointer;border-radius:var(--radius-md);transition:all .2s ease}.pl-tab:hover{color:var(--text-primary);background:var(--glass-bg-hover)}.pl-tab.active{color:var(--text-primary);background:var(--accent-primary)}.playlists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem}.empty-state{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;text-align:center;background:var(--bg-surface-2);border-radius:var(--radius-lg);border:1px dashed var(--border-mid)}.empty-state i{font-size:3rem;color:var(--accent-primary);margin-bottom:1rem;opacity:.7}.empty-state p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:1.5rem}.auth-page-container{min-height:100vh;width:100vw;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at top left,rgba(140,82,255,.15) 0%,transparent 40%),radial-gradient(circle at bottom right,rgba(0,195,255,.1) 0%,transparent 50%);margin:0;padding:0}.auth-layout-wrapper{display:flex;width:100%;height:100vh;max-width:none;background:#12121266;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:none;border-radius:0;box-shadow:none;animation:authFadeIn .5s ease-out}.auth-branding-side{flex:1;padding:3rem;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(135deg,#8c52ff1a,#12121200);border-right:1px solid rgba(255,255,255,.05);text-align:center}.auth-branding-side .logo{margin:1rem 0;display:flex;justify-content:center;align-items:center}.auth-branding-side .logo .logo-symbol img{width:380px;height:auto;max-width:90vw}.auth-branding-text{color:#e5e5e5;font-size:1.1rem;line-height:1.6;margin-top:1.5rem;max-width:80%}.auth-form-side{flex:1;padding:3rem;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#18181899}@keyframes authFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.auth-title{font-size:2rem;font-weight:800;color:#fff;margin-bottom:.5rem;text-align:center}.auth-subtitle{color:#a7a7a7;font-size:.95rem;text-align:center;margin-bottom:2rem}.auth-error{background:#e91e631a;color:#ff4b4b;border:1px solid rgba(233,30,99,.3);padding:.75rem 1rem;border-radius:8px;font-size:.9rem;margin-bottom:1.5rem;text-align:center;width:100%;max-width:420px}.auth-form{display:flex;flex-direction:column;gap:1.25rem;width:100%;max-width:420px}.auth-input-group{display:flex;flex-direction:column;gap:.5rem}.auth-input-group label{font-size:.85rem;font-weight:600;color:#e5e5e5;letter-spacing:.5px}.auth-input-group input{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff;padding:.85rem 1rem;border-radius:8px;font-size:1rem;transition:all .2s ease;outline:none}.auth-input-group input:hover{background:#ffffff14}.auth-input-group input:focus{background:#ffffff1a;border-color:#8c52ff;box-shadow:0 0 0 2px #8c52ff33}.auth-input-group input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px rgba(40,40,40,.9) inset!important;-webkit-text-fill-color:#ffffff!important;caret-color:#fff}.auth-submit-btn{background:#8c52ff;color:#fff;border:none;padding:1rem;border-radius:50px;font-size:1rem;font-weight:700;cursor:pointer;margin-top:1rem;transition:transform .2s,background-color .2s,box-shadow .2s;letter-spacing:.5px}.auth-submit-btn:hover:not(:disabled){background:#9e6aff;transform:scale(1.02);box-shadow:0 4px 15px #8c52ff4d}.auth-submit-btn:disabled{background:#535353;color:#b3b3b3;cursor:not-allowed}.auth-footer-text{text-align:center;margin-top:2rem;color:#a7a7a7;font-size:.9rem}.auth-footer-text a{color:#fff;font-weight:600;text-decoration:none;transition:color .2s}.auth-footer-text a:hover{color:#8c52ff;text-decoration:underline}@media (max-width: 768px){.auth-layout-wrapper{flex-direction:column}.auth-branding-side{padding:2rem;flex:0 0 auto;border-right:none;border-bottom:1px solid rgba(255,255,255,.05)}.auth-branding-side .logo{margin:1rem 0}.auth-branding-side .logo .logo-symbol img{width:250px}.auth-branding-text{display:none}.auth-form-side{padding:2rem 1.5rem;flex:1 1 auto}}@media (max-width: 480px){.auth-page-container{padding:0}}.as-page{max-width:680px;margin:0 auto;padding-bottom:5rem;padding-left:1.25rem;padding-right:1.25rem;color:var(--text-primary)}.as-brand{display:flex;align-items:center;justify-content:center;padding:1rem 0 2rem;border-bottom:1px solid var(--border-subtle);margin-bottom:2rem}.as-brand .logo{transform:scale(1.35);transform-origin:center}.as-header{display:flex;align-items:flex-start;gap:1rem;margin-bottom:2rem}.as-back-btn{flex-shrink:0;width:40px;height:40px;border-radius:50%;background:var(--glass-bg);border:1px solid var(--border-subtle);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;margin-top:4px}.as-back-btn:hover{background:var(--glass-bg-hover);color:var(--text-primary);border-color:var(--border-mid)}.as-title{font-size:1.75rem;font-weight:800;letter-spacing:-.02em;background:linear-gradient(130deg,#fff 20%,var(--accent-glow) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:4px}.as-subtitle{font-size:.875rem;color:var(--text-secondary)}.as-sections{display:flex;flex-direction:column;gap:16px}.as-section{background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem;transition:border-color .2s ease}.as-section:hover{border-color:var(--border-mid)}.as-section--danger{border-color:#ef444433;background:#ef444408}.as-section--danger:hover{border-color:#ef444459}.as-section-label{display:flex;align-items:flex-start;gap:1rem}.as-section-icon{width:44px;height:44px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}.as-section-icon--spotify{background:var(--spotify-green-dim);color:var(--spotify-green);border:1px solid rgba(29,185,84,.2)}.as-section-icon--danger{background:#ef44441a;color:#f87171;border:1px solid rgba(239,68,68,.2)}.as-section h2{font-size:1rem;font-weight:700;color:var(--text-primary);margin-bottom:5px}.as-section--danger h2{color:#f87171}.as-section p{font-size:.83rem;color:var(--text-secondary);line-height:1.55}.as-btn{display:inline-flex;align-items:center;gap:8px;padding:.6rem 1.25rem;border-radius:var(--radius-full);font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;cursor:pointer;border:none;transition:all .2s ease;width:fit-content}.as-btn:disabled{opacity:.5;cursor:not-allowed}.as-btn--secondary{background:var(--glass-bg);border:1px solid var(--border-mid);color:var(--text-primary)}.as-btn--secondary:hover:not(:disabled){background:var(--glass-bg-hover);border-color:#1db95466;color:var(--spotify-green)}.as-btn--danger{background:#ef44441f;border:1px solid rgba(239,68,68,.3);color:#f87171}.as-btn--danger:hover:not(:disabled){background:#ef444438;border-color:#ef444480}.as-success{display:flex;align-items:center;gap:8px;font-size:.875rem;font-weight:600;color:var(--spotify-green);background:var(--spotify-green-dim);border:1px solid rgba(29,185,84,.25);border-radius:var(--radius-md);padding:.65rem 1rem;width:fit-content}.as-success a{color:var(--text-secondary);text-decoration:underline;margin-left:4px;transition:color .2s}.as-success a:hover{color:var(--text-primary)}@media (max-width: 640px){.as-page{padding-bottom:7rem}.as-section-label{flex-direction:column}}.goodbye-container{display:flex;align-items:center;justify-content:center;min-height:80vh;padding:20px;text-align:center;color:#fff}.goodbye-content{background:#ffffff0d;padding:60px 40px;border-radius:16px;max-width:500px;box-shadow:0 10px 30px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.goodbye-logo{display:flex;justify-content:center;margin-bottom:30px}.goodbye-content h1{font-size:2rem;margin-bottom:20px;background:linear-gradient(90deg,#1db954,#1ed760);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.goodbye-content p{color:#aaa;font-size:1.1rem;line-height:1.6;margin-bottom:20px}.go-home-btn{display:inline-block;margin-top:20px;padding:14px 32px;background-color:#fff;color:#000;text-decoration:none;font-weight:700;border-radius:50px;transition:transform .2s,background-color .2s}.go-home-btn:hover{background-color:#ddd;transform:scale(1.05)}.cp-page{color:var(--text-primary);padding-bottom:4rem}.cp-hero{position:relative;width:100%;padding:3rem 2.5rem 2.5rem;background:linear-gradient(140deg,rgba(168,85,247,.22) 0%,rgba(99,102,241,.18) 40%,var(--bg-surface-2) 100%);border-bottom:1px solid var(--border-subtle);overflow:hidden;margin-bottom:2rem}.cp-hero:before{content:"";position:absolute;top:-80px;right:-60px;width:360px;height:360px;background:radial-gradient(circle,rgba(168,85,247,.2) 0%,transparent 70%);pointer-events:none}.cp-hero:after{content:"";position:absolute;bottom:-60px;left:30%;width:250px;height:250px;background:radial-gradient(circle,rgba(99,102,241,.12) 0%,transparent 70%);pointer-events:none}.cp-hero-inner{position:relative;z-index:1;max-width:1100px;margin:0 auto}.cp-hero-label{display:inline-flex;align-items:center;gap:.4rem;background:var(--accent-dim);border:1px solid var(--accent-border);border-radius:var(--radius-full);padding:.25rem .85rem;font-size:.72rem;font-weight:700;color:var(--accent-glow);letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}.cp-hero-label i{font-size:.65rem}.cp-hero-title{font-size:clamp(2rem,5vw,3.2rem);font-weight:900;letter-spacing:-.03em;color:var(--text-primary);margin:0 0 .6rem;line-height:1.1}.cp-hero-desc{font-size:1rem;color:var(--text-secondary);margin:0;max-width:520px;line-height:1.6}.cp-toolbar{max-width:1100px;margin:0 auto 1.75rem;padding:0 2.5rem;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.cp-search-wrap{position:relative;flex:1;min-width:220px;max-width:380px}.cp-search-icon{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none;display:flex;align-items:center;transition:color .2s ease;z-index:1}.cp-search-wrap:focus-within .cp-search-icon{color:var(--accent-primary)}.cp-search-input{width:100%;height:2.6rem;padding:0 1rem 0 2.75rem;border-radius:var(--radius-md);background:var(--glass-bg);border:1px solid var(--border-mid);color:var(--text-primary);font-family:Inter,sans-serif;font-size:.875rem;font-weight:400;transition:all .2s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:none;caret-color:var(--accent-primary)}.cp-search-input::placeholder{color:var(--text-muted);font-weight:400}.cp-search-input:hover{border-color:var(--accent-border);background:var(--glass-bg-hover)}.cp-search-input:focus{border-color:var(--accent-primary);background:#a855f712;box-shadow:0 0 0 3px #a855f71a}.cp-search-input:-webkit-autofill,.cp-search-input:-webkit-autofill:hover,.cp-search-input:-webkit-autofill:focus{transition:background-color 5000s ease-in-out 0s;-webkit-text-fill-color:var(--text-primary)!important}.cp-region-wrap{position:relative;display:flex;align-items:center}.cp-region-icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;display:flex;align-items:center;z-index:1;transition:color .2s ease}.cp-region-wrap:focus-within .cp-region-icon{color:var(--accent-primary)}.cp-region-select{height:2.6rem;padding:0 2.25rem 0 2.35rem;border-radius:var(--radius-md);background:var(--glass-bg);border:1px solid var(--border-mid);color:var(--text-primary);font-family:Inter,sans-serif;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;min-width:155px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%235c5278'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;background-color:var(--glass-bg)}.cp-region-select option{background:var(--bg-surface-2);color:var(--text-primary)}.cp-region-select:hover{border-color:var(--accent-border);background-color:var(--glass-bg-hover)}.cp-region-select:focus{border-color:var(--accent-primary);background-color:#a855f712;box-shadow:0 0 0 3px #a855f71a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%23a855f7'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E")}.cp-results-count{margin-left:auto;font-size:.78rem;font-weight:500;color:var(--text-muted);white-space:nowrap;display:inline-flex;align-items:center;gap:.4rem}.cp-content{max-width:1100px;margin:0 auto;padding:0 2.5rem}.cp-loading{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.cp-skeleton-card{background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;animation:cp-pulse 1.6s ease-in-out infinite}.cp-skeleton-img{width:100%;height:175px;background:var(--bg-surface-2)}.cp-skeleton-body{padding:1.1rem;display:flex;flex-direction:column;gap:.6rem}.cp-skeleton-line{height:12px;border-radius:var(--radius-full);background:var(--bg-surface-3)}.cp-skeleton-line.short{width:55%}.cp-skeleton-line.medium{width:75%}.cp-skeleton-line.full{width:100%}@keyframes cp-pulse{0%,to{opacity:.8}50%{opacity:.4}}.cp-state-box{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4rem 2rem;background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);gap:.75rem}.cp-state-icon{width:3.5rem;height:3.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:.25rem}.cp-state-icon.error{background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.2)}.cp-state-icon.empty{background:var(--accent-dim);color:var(--accent-primary);border:1px solid var(--accent-border)}.cp-state-title{font-size:1.1rem;font-weight:700;color:var(--text-primary);margin:0}.cp-state-desc{font-size:.875rem;color:var(--text-secondary);margin:0;max-width:380px;line-height:1.6}.cp-retry-btn{display:inline-flex;align-items:center;gap:.4rem;height:2.25rem;padding:0 1.25rem;border-radius:var(--radius-full);background:var(--accent-dim);border:1px solid var(--accent-border);color:var(--accent-primary);font-family:Inter,sans-serif;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:.25rem}.cp-retry-btn:hover{background:var(--accent-primary);color:#fff;transform:translateY(-1px)}.cp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.cp-card{background:var(--glass-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;display:flex;flex-direction:column;transition:all .3s cubic-bezier(.25,.46,.45,.94)}.cp-card:hover{transform:translateY(-4px);background:var(--glass-bg-hover);border-color:var(--accent-border);box-shadow:0 12px 32px #00000073,0 0 0 1px var(--accent-border)}.cp-card-img-wrap{position:relative;overflow:hidden;height:175px;flex-shrink:0}.cp-card-img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;display:block}.cp-card:hover .cp-card-img{transform:scale(1.06)}.cp-card-img-placeholder{width:100%;height:100%;background:var(--bg-surface-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;color:var(--text-muted)}.cp-card-img-placeholder svg{opacity:.35}.cp-card-img-placeholder span{font-size:.75rem;opacity:.6}.cp-card-img-overlay{position:absolute;bottom:0;left:0;right:0;height:65%;background:linear-gradient(to top,rgba(7,0,15,.9),transparent);pointer-events:none}.cp-card-date-badge{position:absolute;top:.65rem;left:.65rem;background:#07000fd1;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-mid);border-radius:var(--radius-sm);padding:.3rem .65rem;text-align:center;min-width:44px}.cp-badge-day{font-size:1.15rem;font-weight:800;color:var(--text-primary);line-height:1;display:block}.cp-badge-month{font-size:.6rem;font-weight:700;color:var(--accent-primary);text-transform:uppercase;letter-spacing:.08em;display:block}.cp-card-body{padding:1rem 1.1rem;display:flex;flex-direction:column;flex:1;gap:.3rem}.cp-card-name{font-size:1rem;font-weight:700;color:var(--text-primary);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35}.cp-card-venue{display:flex;align-items:flex-start;gap:.35rem;color:var(--text-secondary);font-size:.8rem}.cp-card-venue svg{flex-shrink:0;margin-top:1px;color:var(--accent-primary);opacity:.7}.cp-card-venue span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cp-card-footer{margin-top:auto;padding-top:.75rem;border-top:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cp-card-price{font-size:.78rem;font-weight:500;color:var(--text-muted)}.cp-buy-btn{display:inline-flex;align-items:center;gap:.35rem;height:2rem;padding:0 .9rem;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;font-family:Inter,sans-serif;font-size:.78rem;font-weight:700;text-decoration:none;transition:all .2s ease;white-space:nowrap;box-shadow:0 3px 10px #a855f759}.cp-buy-btn:hover{transform:translateY(-1px);box-shadow:0 5px 16px #a855f780;filter:brightness(1.1)}@media (max-width: 768px){.cp-hero{padding:2rem 1.25rem}.cp-toolbar,.cp-content{padding:0 1.25rem}.cp-search-wrap{max-width:100%}.cp-results-count{width:100%;margin-left:0}.cp-grid,.cp-loading{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}