*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;}html,body{height:100%;overflow:hidden;}:root{--bg-primary:#0a0a0a;--bg-secondary:#141414;--bg-tertiary:#1e1e1e;--bg-card:rgba(30,30,30,0.9);--accent-1:#ff6b6b;--accent-2:#feca57;--accent-gradient:linear-gradient(135deg,#ff6b6b 0%,#feca57 100%);--text-primary:#ffffff;--text-secondary:rgba(255,255,255,0.7);--text-muted:rgba(255,255,255,0.4);--glass-bg:rgba(255,255,255,0.05);--glass-border:rgba(255,255,255,0.08);--hover-bg:rgba(255,255,255,0.08);--sidebar-width:250px;--player-height:90px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);}[data-theme="light"]{--bg-primary:#f8f9fa;--bg-secondary:#ffffff;--bg-tertiary:#f1f3f4;--bg-card:rgba(255,255,255,0.95);--text-primary:#1a1a1a;--text-secondary:rgba(0,0,0,0.7);--text-muted:rgba(0,0,0,0.45);--glass-bg:rgba(0,0,0,0.03);--glass-border:rgba(0,0,0,0.08);--hover-bg:rgba(0,0,0,0.05);}body{background:var(--bg-primary);color:var(--text-primary);transition:background 0.3s ease,color 0.3s ease;touch-action:manipulation;}.bg-wrapper{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}.bg-blur{position:absolute;width:100%;height:100%;background-size:cover;background-position:center;filter:blur(80px) saturate(1.8);-webkit-filter:blur(80px) saturate(1.8);opacity:0.2;transform:scale(1.5) translateZ(0);-webkit-transform:scale(1.5) translateZ(0);will-change:transform,opacity;transition:background-image 1s ease;}.app-container{position:fixed;top:0;left:0;right:0;bottom:calc(var(--player-height) + var(--safe-bottom));display:flex;z-index:1;}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);height:100%;background:var(--bg-secondary);border-right:1px solid var(--glass-border);display:flex;flex-direction:column;padding:15px;overflow-y:auto;}.logo{display:flex;align-items:center;gap:10px;padding:10px 10px 20px;}.logo h1{font-size:1.4rem;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.nav-menu{flex:1;}.nav-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;color:var(--text-secondary);cursor:pointer;transition:all 0.2s ease;margin-bottom:4px;font-size:0.9rem;position:relative;}.nav-item:hover{background:var(--hover-bg);color:var(--text-primary);}.nav-item.active{background:var(--accent-gradient);color:#1a1a1a;font-weight:500;}.nav-item i{font-size:1.25rem;}.badge{position:absolute;right:10px;background:var(--accent-1);color:white;font-size:0.7rem;padding:2px 6px;border-radius:10px;font-weight:600;}.nav-item.active .badge{background:rgba(0,0,0,0.3);}.user-section{padding:12px 0 0;border-top:1px solid var(--glass-border);margin-top:10px;}.user-profile{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:var(--glass-bg);}.user-avatar{width:38px;height:38px;min-width:38px;border-radius:50%;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:0.95rem;color:#1a1a1a;overflow:hidden;}.user-avatar img{width:100%;height:100%;object-fit:cover;}.user-info{flex:1;min-width:0;}.user-info h4{font-size:0.8rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.user-info p{font-size:0.7rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.logout-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:5px;border-radius:6px;transition:all 0.2s ease;display:flex;}.logout-btn:hover{color:var(--accent-1);background:var(--hover-bg);}.logout-btn i{font-size:1.1rem;}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;}.lyrics-content{height:80vh;max-height:80vh;}.lyrics-text{height:60vh;overflow-y:auto;text-align:center;padding:20px;font-size:1.1rem;line-height:1.8;color:var(--text-muted);scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;}.lyrics-text::-webkit-scrollbar{display:none;}.lyric-line{margin:10px 0;transition:all 0.3s ease;cursor:pointer;border-radius:8px;padding:5px 10px;}.lyric-line:hover{color:var(--text-primary);background:rgba(255,255,255,0.05);}.lyric-line.active{color:var(--primary-color,var(--accent-1));font-weight:700;font-size:1.4rem;transform:scale(1.05);text-shadow:0 0 10px rgba(var(--primary-rgb,255,107,107),0.5);}.header{display:flex;align-items:center;justify-content:space-between;padding:calc(12px + var(--safe-top)) 20px 12px;background:var(--bg-secondary);border-bottom:1px solid var(--glass-border);height:calc(64px + var(--safe-top));z-index:100;position:relative;overflow:visible;}.header-left,.header-right{display:flex;align-items:center;flex:1;min-width:0;}.header-right{justify-content:flex-end;}.header-brand{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;pointer-events:none;}.header-brand{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;pointer-events:none;white-space:nowrap;}.header-brand i{color:#ff6b6b;font-size:2rem;filter:drop-shadow(0 0 10px rgba(255,107,107,0.4));background:linear-gradient(135deg,#ff6b6b 0%,#feb47b 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}.header-brand span{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.6rem;line-height:1.35;letter-spacing:0.06em;background:linear-gradient(135deg,#ff6b6b 0%,#feb47b 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-transform:none;}.header-left,.header-right{display:flex;align-items:center;z-index:10;}.header-visualizer{position:absolute;bottom:-1px;left:0;width:100%;height:25px;display:flex;align-items:flex-end;justify-content:center;gap:2px;padding:0 10px;opacity:0;pointer-events:none;transition:opacity 0.5s ease;overflow:hidden;z-index:1;}.header-visualizer.playing{opacity:0.4;}.v-bar{flex:1;height:16px;background:#ff6b6b;box-shadow:0 0 8px rgba(255,107,107,0.4);border-radius:2px 2px 0 0;transform-origin:bottom;transform:scaleY(0.2);}.header-visualizer.playing .v-bar{animation-name:barBounce;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:ease-in-out;}.header-visualizer.playing .v-bar:nth-child(1){animation-duration:0.8s;animation-delay:0.1s;}.header-visualizer.playing .v-bar:nth-child(2){animation-duration:1.1s;animation-delay:0.4s;}.header-visualizer.playing .v-bar:nth-child(3){animation-duration:0.9s;animation-delay:0.2s;}.header-visualizer.playing .v-bar:nth-child(4){animation-duration:1.3s;animation-delay:0.5s;}.header-visualizer.playing .v-bar:nth-child(5){animation-duration:0.7s;animation-delay:0.3s;}.header-visualizer.playing .v-bar:nth-child(6){animation-duration:1.2s;animation-delay:0.6s;}.header-visualizer.playing .v-bar:nth-child(7){animation-duration:0.8s;animation-delay:0.2s;}.header-visualizer.playing .v-bar:nth-child(8){animation-duration:1.4s;animation-delay:0.1s;}.header-visualizer.playing .v-bar:nth-child(9){animation-duration:1.0s;animation-delay:0.4s;}.header-visualizer.playing .v-bar:nth-child(10){animation-duration:0.6s;animation-delay:0.3s;}.header-visualizer.playing .v-bar:nth-child(11){animation-duration:1.3s;animation-delay:0.5s;}.header-visualizer.playing .v-bar:nth-child(12){animation-duration:0.9s;animation-delay:0.2s;}.header-visualizer.playing .v-bar:nth-child(13){animation-duration:1.1s;animation-delay:0.4s;}.header-visualizer.playing .v-bar:nth-child(14){animation-duration:0.7s;animation-delay:0.1s;}.header-visualizer.playing .v-bar:nth-child(15){animation-duration:1.5s;animation-delay:0.3s;}.header-visualizer.playing .v-bar:nth-child(16){animation-duration:0.8s;animation-delay:0.6s;}.header-visualizer.playing .v-bar:nth-child(17){animation-duration:1.2s;animation-delay:0.2s;}.header-visualizer.playing .v-bar:nth-child(18){animation-duration:1.0s;animation-delay:0.5s;}.header-visualizer.playing .v-bar:nth-child(19){animation-duration:0.9s;animation-delay:0.1s;}.header-visualizer.playing .v-bar:nth-child(20){animation-duration:1.4s;animation-delay:0.4s;}@keyframes barBounce{0%{transform:scaleY(0.2);}50%{transform:scaleY(1.0);}100%{transform:scaleY(0.5);}}.search-container{position:relative;width:100%;max-width:440px;display:flex;align-items:center;}.search-container input{flex:1;width:100%;padding:10px 16px 10px 42px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:50px;color:var(--text-primary);font-size:0.9rem;transition:all 0.2s ease;}.search-container input:focus{outline:none;border-color:var(--accent-1);background:var(--hover-bg);}.search-container input::placeholder{color:var(--text-muted);}.search-container>i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:1.15rem;}.header-actions{display:flex;align-items:center;gap:8px;}.icon-btn{width:38px;height:38px;border-radius:50%;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;}.icon-btn:hover{background:var(--accent-gradient);color:#1a1a1a;border-color:transparent;}.icon-btn i{font-size:1.2rem;}.user-menu-container{position:relative;}.user-menu-btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%;transition:transform 0.2s ease;}.user-menu-btn:hover{transform:scale(1.05);}.user-avatar-small{width:38px;height:38px;border-radius:50%;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:0.9rem;color:#1a1a1a;border:2px solid transparent;transition:all 0.2s ease;overflow:hidden;}.user-avatar-small img{width:100%;height:100%;object-fit:cover;}.user-dropdown{position:absolute;top:calc(100% + 10px);right:0;width:220px;background:var(--bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:14px;padding:8px;box-shadow:0 10px 30px rgba(0,0,0,0.5);display:none;z-index:1000;transform:translateZ(0);-webkit-transform:translateZ(0);transform-origin:top right;animation:dropdownFade 0.2s ease;}.user-dropdown.show{display:block;}@keyframes dropdownFade{from{opacity:0;transform:scale(0.95);}to{opacity:1;transform:scale(1);}}.dropdown-header{padding:12px 15px;}.dropdown-user-name{font-weight:600;font-size:0.9rem;color:var(--text-primary);margin-bottom:2px;}.dropdown-user-email{font-size:0.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.dropdown-divider{height:1px;background:var(--glass-border);margin:6px 0;}.dropdown-item{width:100%;display:flex;align-items:center;gap:12px;padding:10px 15px;background:none;border:none;color:var(--text-secondary);font-size:0.85rem;cursor:pointer;border-radius:8px;transition:all 0.2s ease;text-align:left;}.dropdown-item:hover{background:var(--hover-bg);color:var(--text-primary);}.dropdown-item i{font-size:1.1rem;color:var(--text-muted);}.dropdown-item.logout-action:hover{background:rgba(255,107,107,0.1);color:var(--accent-1);}.dropdown-item.logout-action:hover i{color:var(--accent-1);}.content-area{flex:1;overflow-y:auto;padding:20px;}.view{display:none;animation:fadeIn 0.3s ease;}.view.active{display:block;}@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}.welcome-banner{background:var(--accent-gradient);border-radius:16px;padding:25px 30px;margin-bottom:25px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;}.welcome-content h1{font-size:1.6rem;color:#1a1a1a;margin-bottom:5px;}.welcome-content p{color:rgba(0,0,0,0.6);font-size:0.95rem;}.quick-actions{display:flex;gap:10px;flex-wrap:wrap;}.quick-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;background:rgba(0,0,0,0.15);border:none;border-radius:50px;color:#1a1a1a;font-size:0.85rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;}.quick-btn:hover{background:rgba(0,0,0,0.25);transform:scale(1.05);}.quick-btn i{font-size:1rem;}.section-title{font-size:1.3rem;font-weight:600;margin-bottom:18px;display:flex;align-items:center;gap:10px;}.section-title i{color:var(--accent-1);font-size:1.4rem;}.icon-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;width:40px;height:40px;transition:all 0.2s ease;}.icon-btn:hover{background:var(--hover-bg);color:var(--text-primary);}.icon-btn i{font-size:24px;}.view-header{display:flex;align-items:center;gap:15px;margin-bottom:25px;}.back-nav-btn{margin-right:10px;border:1px solid var(--glass-border);background:var(--glass-bg);}.back-nav-btn:hover{background:var(--hover-bg);border-color:var(--accent-1);transform:translateX(-3px);}.view-actions{display:flex;gap:10px;}.view-actions.right{margin-left:auto;}.settings-language-group{margin-top:12px;}.settings-language-group h5{margin:8px 0 6px;font-size:0.85rem;color:var(--text-secondary);font-weight:600;}.settings-language-grid .empty-msg{grid-column:1 / -1;text-align:center;color:var(--text-secondary);font-size:0.85rem;margin:6px 0 0;}.settings-artist-search{margin-top:10px;}.settings-search-input{margin-bottom:10px;}.settings-artist-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}.settings-artist-grid .empty-msg{grid-column:1 / -1;text-align:center;color:var(--text-secondary);font-size:0.85rem;margin:6px 0 0;}.settings-artist-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}.settings-artist-chips .empty-msg{color:var(--text-secondary);font-size:0.85rem;margin:4px 0 0;}.artist-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:999px;color:var(--text-primary);font-size:0.85rem;cursor:pointer;transition:all 0.2s ease;}.artist-chip i{font-size:16px;color:var(--text-muted);}.artist-chip:hover{border-color:var(--accent-1);background:var(--hover-bg);}.action-button{display:flex;align-items:center;gap:6px;padding:10px 20px;background:var(--accent-gradient);border:none;border-radius:50px;color:#1a1a1a;font-size:0.9rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;}.action-button:hover{transform:scale(1.05);box-shadow:0 5px 20px rgba(255,107,107,0.3);}.action-button.secondary{background:var(--glass-bg);color:var(--text-primary);border:1px solid var(--glass-border);}.action-button.secondary:hover{background:var(--hover-bg);box-shadow:none;}.songs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:16px;}.song-card{background:var(--bg-card);border-radius:12px;padding:12px;cursor:pointer;transition:all 0.25s ease;border:1px solid var(--glass-border);position:relative;}.song-card.menu-open{z-index:1000;}.song-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,0.2);}.song-card-img{position:relative;width:100%;aspect-ratio:1;border-radius:10px;overflow:hidden;margin-bottom:10px;}.song-card-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;}.song-card:hover .song-card-img img{transform:scale(1.05);}.play-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.25s ease;}.song-card:hover .play-overlay{opacity:1;}.play-overlay i{font-size:42px;color:var(--accent-1);}.song-card h4{font-size:0.85rem;font-weight:500;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.song-card p{font-size:0.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.song-card{position:relative;}.song-options-btn{position:absolute;top:15px;right:15px;background:var(--glass-bg);backdrop-filter:blur(8px);border:1px solid var(--glass-border);color:var(--text-primary);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:all 0.25s cubic-bezier(0.4,0,0.2,1);z-index:5;}.song-options-btn i{font-size:1.2rem;}.song-card:hover .song-options-btn{opacity:1;}.song-options-btn:hover{background:var(--accent-1);transform:scale(1.1);}.song-menu{position:absolute;top:52px;right:12px;background:var(--bg-tertiary);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.35);display:none;flex-direction:column;padding:8px;z-index:1100;min-width:185px;animation:menuFadeIn 0.25s cubic-bezier(0.4,0,0.2,1);}[data-theme="light"] .song-menu{background:#ffffff;box-shadow:0 10px 40px rgba(0,0,0,0.15);border:1px solid rgba(0,0,0,0.08);}@keyframes menuFadeIn{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:translateY(0);}}.song-menu.show{display:flex;}.song-menu button{background:none;border:none;color:var(--text-primary);padding:10px 14px;text-align:left;cursor:pointer;border-radius:6px;display:flex;align-items:center;gap:12px;font-size:0.85rem;transition:all 0.2s;width:100%;white-space:nowrap;}.song-menu button:hover{background:var(--hover-bg);color:var(--accent-1);}.song-menu button i{font-size:1.2rem;}.queue-menu{top:38px;right:0;}.queue-menu.open-up{top:auto;bottom:38px;}.queue-options-btn i{font-size:1.1rem;}.song-list{display:flex;flex-direction:column;gap:4px;}.song-list-item{display:flex;align-items:center;gap:14px;padding:10px 14px;border-radius:10px;cursor:pointer;transition:background 0.2s ease;position:relative;}.song-list-item:hover{background:var(--hover-bg);}.song-list-item.playing{background:var(--hover-bg);}.song-list-item.playing .song-list-title{color:var(--accent-1);}.song-list-item.menu-open{z-index:1000;}.song-list-index{width:24px;text-align:center;color:var(--text-muted);font-size:0.85rem;}.song-list-item:hover .song-list-index{display:none;}.song-list-item .play-icon{display:none;color:var(--accent-1);}.song-list-item:hover .play-icon{display:block;}.song-list-img{width:45px;height:45px;border-radius:6px;object-fit:cover;}.song-list-info{flex:1;min-width:0;}.song-list-title{font-size:0.9rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.song-list-artist{font-size:0.8rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.song-list-duration{color:var(--text-muted);font-size:0.8rem;}.song-list-actions{display:flex;gap:5px;opacity:0;transition:opacity 0.2s ease;position:relative;}.song-list-item:hover .song-list-actions{opacity:1;}.song-list-item.menu-open .song-list-actions{opacity:1;}.song-list-item.menu-open .queue-options-btn{color:var(--accent-1);background:var(--hover-bg);}.song-list-actions button{width:32px;height:32px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;}.song-list-actions button:hover{color:var(--accent-1);background:var(--hover-bg);}.song-list-actions .song-menu button{width:100%;height:auto;border-radius:6px;background:none;color:var(--text-primary);justify-content:flex-start;padding:10px 14px;gap:12px;font-size:0.85rem;}.song-list-actions .song-menu button:hover{background:var(--hover-bg);color:var(--accent-1);}.queue-separator{margin:25px 0 15px;display:flex;align-items:center;gap:15px;}.queue-separator span{font-size:0.8rem;font-weight:600;text-transform:uppercase;color:var(--accent-1);letter-spacing:1px;white-space:nowrap;}.queue-separator::after{content:'';flex:1;height:1px;background:linear-gradient(to right,var(--accent-1),transparent);opacity:0.3;}.autoplay-item{opacity:0.85;}.autoplay-tag{background:var(--accent-gradient);color:white;font-size:0.65rem;padding:2px 6px;border-radius:4px;margin-left:6px;font-weight:500;vertical-align:middle;}.genre-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;margin-bottom:10px;}.genre-card{background:var(--gradient);border-radius:12px;padding:25px 15px;text-align:center;cursor:pointer;transition:all 0.25s ease;}.genre-card:hover{transform:scale(1.03);box-shadow:0 10px 25px rgba(0,0,0,0.3);}.genre-card i{font-size:2rem;color:white;margin-bottom:8px;display:block;}.genre-card span{color:white;font-weight:600;font-size:0.9rem;}.playlists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px;}.playlist-card{background:var(--bg-card);border-radius:14px;padding:18px;cursor:pointer;transition:all 0.25s ease;border:1px solid var(--glass-border);}.playlist-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,0.2);}.playlist-card-cover{width:100%;aspect-ratio:1;border-radius:10px;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;margin-bottom:12px;}.playlist-card-cover i{font-size:3rem;color:rgba(0,0,0,0.3);}.playlist-card h4{font-size:0.95rem;font-weight:500;margin-bottom:3px;}.playlist-card p{font-size:0.8rem;color:var(--text-muted);}.playlist-card-cover img{width:100%;height:100%;object-fit:cover;border-radius:10px;}.playlist-header{display:flex;gap:25px;margin-bottom:30px;flex-wrap:wrap;}.playlist-cover{width:200px;height:200px;border-radius:12px;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;box-shadow:0 15px 40px rgba(0,0,0,0.3);}.playlist-cover i{font-size:5rem;color:rgba(0,0,0,0.3);}.playlist-cover img{width:100%;height:100%;object-fit:cover;border-radius:12px;}.playlist-info{flex:1;display:flex;flex-direction:column;justify-content:flex-end;}.playlist-label{font-size:0.75rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:5px;}.playlist-info h1{font-size:2rem;margin-bottom:8px;}.playlist-info>p{color:var(--text-muted);margin-bottom:15px;}.playlist-actions{display:flex;gap:10px;align-items:center;}.back-nav-btn{color:var(--text-primary);opacity:0.7;transition:all 0.2s;}.back-nav-btn:hover{opacity:1;transform:translateX(-4px);}.queue-list{display:flex;flex-direction:column;gap:4px;}.queue-item{display:flex;align-items:center;gap:14px;padding:10px 14px;border-radius:10px;cursor:pointer;transition:background 0.2s ease;}.queue-item:hover{background:var(--hover-bg);}.queue-item.current{background:var(--hover-bg);border-left:3px solid var(--accent-1);}.queue-item.current .queue-title{color:var(--accent-1);font-weight:500;}.queue-drag{color:var(--text-muted);cursor:grab;}.queue-img{width:45px;height:45px;border-radius:6px;object-fit:cover;}.queue-info{flex:1;min-width:0;}.queue-title{font-size:0.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.queue-artist{font-size:0.8rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.queue-remove{width:32px;height:32px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:all 0.2s ease;}.queue-item:hover .queue-remove{opacity:1;}.queue-remove:hover{color:var(--accent-1);background:var(--hover-bg);}#search-view{padding-top:0;--search-header-pad:20px;}#search-view .view-header{margin-bottom:20px;gap:10px;}#clear-search-btn{position:absolute;right:5px;top:50%;transform:translateY(-50%);background:transparent;border:none;}.search-results{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--bg-secondary);border:1px solid var(--glass-border);border-radius:12px;max-height:480px;overflow-y:auto;z-index:1000;box-shadow:0 12px 40px rgba(0,0,0,0.4);}.search-results.show{display:block;}.search-result-item{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;transition:background 0.15s ease;}.search-result-item:hover{background:var(--hover-bg);}.search-result-item img{width:42px;height:42px;border-radius:6px;object-fit:cover;}.search-result-info{flex:1;min-width:0;}.search-result-info h4{font-size:0.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.search-result-info p{font-size:0.75rem;color:var(--text-muted);}.search-result-actions{display:flex;gap:4px;}.search-result-actions button{padding:6px;border:none;background:transparent;color:var(--text-muted);border-radius:6px;cursor:pointer;display:flex;}.search-result-actions button:hover{color:var(--accent-1);background:var(--hover-bg);}.load-more-btn{width:calc(100% - 24px);margin:12px;padding:10px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px;color:var(--text-secondary);font-size:0.8rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:all 0.2s ease;}.load-more-btn:hover{background:var(--hover-bg);color:var(--text-primary);border-color:var(--accent-1);}.load-more-btn i{font-size:1.1rem;}.spinner-small{width:16px;height:16px;border:2px solid rgba(255,255,255,0.1);border-top-color:var(--accent-1);border-radius:50%;animation:searchSpin 0.8s linear infinite;}@keyframes searchSpin{to{transform:rotate(360deg);}}.player-bar{position:fixed;bottom:0;left:0;right:0;height:calc(var(--player-height) + var(--safe-bottom));display:flex;align-items:center;gap:12px;padding:0 20px;padding-bottom:var(--safe-bottom);background:var(--bg-secondary);border-top:1px solid var(--glass-border);z-index:100;}.mini-player-progress{position:absolute;bottom:0;left:0;width:0%;height:3px;background:var(--accent-1);transition:width 0.1s linear,opacity 0.3s ease;box-shadow:0 -2px 10px rgba(255,107,107,0.4);z-index:101;opacity:0;}.mini-player-progress.active{opacity:1;}.now-playing{display:flex;align-items:center;gap:12px;width:250px;min-width:180px;}.now-playing-img{position:relative;width:52px;height:52px;min-width:52px;border-radius:8px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.25);}.now-playing-img img{width:100%;height:100%;object-fit:cover;}.now-playing-animation{position:absolute;bottom:3px;right:3px;display:none;gap:2px;align-items:flex-end;height:12px;background:rgba(0,0,0,0.6);padding:2px 3px;border-radius:3px;}.now-playing-animation.playing{display:flex;}.now-playing-animation span{width:3px;background:var(--accent-1);border-radius:2px;animation:audioWave 0.8s ease-in-out infinite;}.now-playing-animation span:nth-child(1){height:40%;animation-delay:0s;}.now-playing-animation span:nth-child(2){height:70%;animation-delay:0.1s;}.now-playing-animation span:nth-child(3){height:50%;animation-delay:0.2s;}.now-playing-animation span:nth-child(4){height:80%;animation-delay:0.3s;}@keyframes audioWave{0%,100%{transform:scaleY(1);}50%{transform:scaleY(0.5);}}.now-playing-info{flex:1;min-width:0;}.now-playing-info h4{font-size:0.88rem;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.now-playing-info p{font-size:0.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.now-playing-actions{display:flex;gap:2px;}.action-btn{width:32px;height:32px;border:none;background:none;color:var(--text-muted);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all 0.15s ease;}.action-btn:hover{color:var(--text-primary);}.action-btn.active{color:var(--accent-1);}.icon-btn.active{color:var(--accent-1);}.player-controls{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;max-width:550px;}.control-buttons{display:flex;align-items:center;gap:12px;}.control-btn{width:34px;height:34px;border:none;background:none;color:var(--text-primary);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all 0.15s ease;}.control-btn:hover{color:var(--accent-1);transform:scale(1.08);}.control-btn.active{color:var(--accent-1);}.play-btn{width:42px;height:42px;background:var(--accent-gradient);color:#1a1a1a !important;box-shadow:0 4px 15px rgba(255,107,107,0.35);}.play-btn:hover{transform:scale(1.08);}.play-btn.loading,.mobile-play-btn.loading,#mobile-mini-play.loading,.desktop-play-btn.loading{cursor:progress;}.play-btn.loading i,.mobile-play-btn.loading i,#mobile-mini-play.loading i,.desktop-play-btn.loading i{animation:spin 0.8s linear infinite;}.progress-container{display:flex;align-items:center;gap:8px;width:100%;}.progress-container span{font-size:0.72rem;color:var(--text-muted);min-width:36px;text-align:center;}.progress-bar{flex:1;height:4px;background:var(--glass-bg);border-radius:4px;cursor:pointer;overflow:visible;position:relative;touch-action:none;}.progress-bar:hover{height:6px;}.progress{height:100%;background:var(--accent-gradient);width:0%;transition:width 0.1s linear;}.progress-thumb{position:absolute;top:50%;left:0%;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--accent-1);transform:translate(-50%,-50%);transition:left 0.1s linear,transform 0.15s ease;box-shadow:0 4px 10px rgba(0,0,0,0.35);pointer-events:none;}.progress-bar:hover .progress-thumb{transform:translate(-50%,-50%) scale(1.1);}.progress-bar.scrubbing .progress,.progress-bar.scrubbing .progress-thumb{transition:none;}.player-extra{display:flex;align-items:center;gap:8px;width:200px;justify-content:flex-end;}.player-side{display:flex;align-items:center;gap:10px;}.volume-control{display:flex;align-items:center;gap:4px;}.volume-slider{width:85px;height:4px;-webkit-appearance:none;appearance:none;background:var(--glass-bg);border-radius:4px;outline:none;}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:var(--accent-1);border-radius:50%;cursor:pointer;}.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.7);z-index:2100;align-items:center;justify-content:center;backdrop-filter:blur(5px);animation:fadeIn 0.2s ease;}.modal.show{display:flex;}.modal-content{background:var(--bg-secondary);border-radius:16px;width:90%;max-width:420px;max-height:85vh;overflow:hidden;border:1px solid var(--glass-border);box-shadow:0 20px 50px rgba(0,0,0,0.4);animation:slideUp 0.3s ease;}@keyframes slideUp{from{transform:translateY(30px);opacity:0;}to{transform:translateY(0);opacity:1;}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--glass-border);}.modal-header h3{font-size:1.1rem;font-weight:600;}.modal-close{width:32px;height:32px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;}.modal-close:hover{color:var(--text-primary);background:var(--hover-bg);}.modal-body{padding:20px;max-height:50vh;overflow-y:auto;}.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:15px 20px;border-top:1px solid var(--glass-border);}.form-group{margin-bottom:18px;}.form-group label{display:block;margin-bottom:6px;font-size:0.85rem;color:var(--text-secondary);}.form-group input,.form-group textarea{width:100%;padding:10px 14px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px;color:var(--text-primary);font-size:0.9rem;transition:all 0.2s ease;}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-1);}.form-group textarea{resize:vertical;min-height:80px;}.btn-primary,.btn-secondary{padding:10px 20px;border-radius:10px;font-size:0.9rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;}.btn-primary{background:var(--accent-gradient);border:none;color:#1a1a1a;}.btn-primary:hover{transform:scale(1.02);box-shadow:0 5px 15px rgba(255,107,107,0.3);}.btn-secondary{background:transparent;border:1px solid var(--glass-border);color:var(--text-primary);}.btn-secondary:hover{background:var(--hover-bg);}.onboarding-content{max-width:500px !important;padding-bottom:10px;}.onboarding-steps{display:flex;justify-content:center;gap:10px;padding:20px 0 10px;}.step-indicator{width:40px;height:4px;background:var(--glass-border);border-radius:2px;transition:all 0.3s ease;}.step-indicator.active{background:var(--accent-1);box-shadow:0 0 10px rgba(255,107,107,0.4);}.onboarding-step{display:none;}.onboarding-step.active{display:block;}.selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:10px;}.selection-item{padding:12px 10px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;text-align:center;cursor:pointer;font-size:0.85rem;transition:all 0.2s ease;user-select:none;color:var(--text-primary);}.selection-item:hover{background:var(--hover-bg);border-color:var(--accent-1);}.selection-item.selected{background:var(--accent-gradient);border-color:var(--accent-1);color:#1a1a1a;font-weight:600;transform:scale(1.05);}.selection-grid .empty-msg{grid-column:1 / -1;text-align:center;color:var(--text-secondary);font-size:0.85rem;margin:6px 0 0;}.onboarding-artist-search{display:flex;flex-direction:column;gap:6px;margin-top:6px;margin-bottom:12px;}.onboarding-artist-input{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:8px 12px;display:flex;align-items:center;gap:8px;}.onboarding-artist-input input{background:transparent;border:none;color:var(--text-primary);width:100%;font-size:0.9rem;}.onboarding-artist-input input:focus{outline:none;}.onboarding-note{margin:0;font-size:0.75rem;color:var(--text-muted);}.modal-body::-webkit-scrollbar{width:4px;}.modal-body::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:10px;}.playlist-select-list{display:flex;flex-direction:column;gap:6px;margin-bottom:15px;}.playlist-select-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;cursor:pointer;transition:background 0.15s ease;}.playlist-select-item:hover{background:var(--hover-bg);}.playlist-select-item i{color:var(--accent-1);}.create-new-playlist-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;background:var(--glass-bg);border:1px dashed var(--glass-border);border-radius:10px;color:var(--text-secondary);font-size:0.9rem;cursor:pointer;transition:all 0.2s ease;}.create-new-playlist-btn:hover{color:var(--accent-1);border-color:var(--accent-1);}.settings-group{margin-bottom:20px;}.settings-group h4{font-size:0.9rem;color:var(--text-muted);margin-bottom:12px;text-transform:uppercase;letter-spacing:0.5px;}.setting-item{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--glass-border);}.setting-item span{font-size:0.9rem;}.theme-toggle-btns{display:flex;gap:8px;}.theme-btn{display:flex;align-items:center;gap:10px;padding:12px 24px;background:#444444;border:1px solid rgba(255,255,255,0.15);border-radius:14px;color:#ffffff !important;font-size:0.95rem;font-weight:500;cursor:pointer;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);opacity:1;box-shadow:0 4px 10px rgba(0,0,0,0.2);}.theme-btn:not(.active):hover{background:#555555;border-color:var(--accent-1);transform:translateY(-2px);}.theme-btn.active{background:var(--accent-gradient);color:#1a1a1a !important;border-color:transparent;opacity:1;box-shadow:0 4px 15px rgba(255,107,107,0.4);}.theme-btn i{font-size:1rem;}.setting-select{padding:10px 15px;background:var(--bg-secondary);border:1px solid var(--glass-border);border-radius:12px;color:var(--text-primary);font-size:0.9rem;outline:none;cursor:pointer;min-width:180px;transition:all 0.2s ease;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;padding-right:40px;}.setting-select:hover{border-color:var(--accent-1);}.setting-select option{background:#1a1a2e;color:white;padding:10px;}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px;text-align:center;}.empty-state i{font-size:65px;color:var(--text-muted);margin-bottom:15px;opacity:0.5;}.empty-state h3{font-size:1.2rem;margin-bottom:8px;color:var(--text-secondary);}.empty-state p{color:var(--text-muted);font-size:0.9rem;}.loading-spinner{display:flex;justify-content:center;padding:35px;}.spinner{width:32px;height:32px;border:3px solid var(--glass-border);border-top-color:var(--accent-1);border-radius:50%;animation:spin 0.7s linear infinite;}@keyframes spin{to{transform:rotate(360deg);}}.skeleton-card{position:relative;padding:10px;border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);overflow:hidden;}.skeleton-thumb{width:100%;aspect-ratio:1 / 1;border-radius:12px;background:rgba(255,255,255,0.08);margin-bottom:10px;}.skeleton-line{height:10px;border-radius:999px;background:rgba(255,255,255,0.08);margin-bottom:6px;}.skeleton-line.short{width:60%;}.skeleton-card::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,0.12),transparent);animation:skeletonShimmer 1.4s infinite;}@keyframes skeletonShimmer{100%{transform:translateX(100%);}}.toast-container{position:fixed;top:calc(64px + var(--safe-top) + 12px);right:16px;z-index:1000;display:flex;flex-direction:column;gap:8px;max-width:min(360px,calc(100vw - 32px));}.toast{--toast-accent:#feca57;position:relative;padding:12px 14px 12px 16px;background:radial-gradient(circle at top left,rgba(255,255,255,0.1),transparent 55%),linear-gradient(135deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.16);border-radius:18px;backdrop-filter:blur(16px) saturate(1.3);display:grid;grid-template-columns:34px 1fr;align-items:center;column-gap:12px;animation:toastIn 0.3s ease,toastOut 0.3s ease 3.2s forwards;box-shadow:0 18px 36px rgba(0,0,0,0.35),0 0 0 1px rgba(255,255,255,0.04);font-size:0.88rem;color:var(--text-primary);}.toast.success{--toast-accent:#2ed573;}.toast.error{--toast-accent:#ff6b6b;}.toast.info{--toast-accent:#feca57;}.toast::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:999px;background:var(--toast-accent);box-shadow:0 0 14px rgba(0,0,0,0.2);}.toast i{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;font-size:1.1rem;color:#1a1a1a;background:var(--toast-accent);box-shadow:0 8px 16px rgba(0,0,0,0.25);}.toast span{line-height:1.25;}@keyframes toastIn{from{opacity:0;transform:translateY(-14px) scale(0.98);}to{opacity:1;transform:translateY(0) scale(1);}}@keyframes toastOut{to{opacity:0;transform:translateY(-14px) scale(0.98);}}@media (max-width:600px){.toast-container{left:12px;right:12px;top:calc(64px + var(--safe-top) + 8px);}.toast{width:100%;}}.install-banner{position:fixed;right:20px;bottom:calc(var(--player-height) + var(--safe-bottom) + 16px);max-width:360px;width:calc(100% - 40px);background:var(--bg-card);border:1px solid var(--glass-border);border-radius:14px;padding:14px 16px;box-shadow:0 12px 30px rgba(0,0,0,0.25);backdrop-filter:blur(12px);display:none;flex-direction:column;gap:12px;z-index:1200;}.install-banner.show{display:flex;}.install-banner-title{font-weight:600;margin-bottom:4px;}.install-banner-text{color:var(--text-secondary);font-size:0.9rem;line-height:1.4;}.install-banner-actions{display:flex;gap:8px;flex-wrap:wrap;}.install-banner-actions .action-button{padding:8px 14px;}@keyframes slideIn{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}@keyframes fadeOut{to{opacity:0;transform:translateX(100%);}}::-webkit-scrollbar{width:5px;height:5px;}::-webkit-scrollbar-track{background:transparent;}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:3px;}::-webkit-scrollbar-thumb:hover{background:var(--text-muted);}@media (max-width:1000px){.sidebar{width:200px;min-width:200px;}.now-playing{width:200px;min-width:150px;}.player-extra{width:auto;}.player-extra .action-btn:not(#volume-btn){display:none;}}@media (max-width:768px){.sidebar{display:none;}:root{--sidebar-width:0px;}.player-extra{display:none;}.now-playing{width:auto;min-width:120px;flex:0 0 auto;}.now-playing-actions{display:none;}.welcome-banner{padding:18px 20px;}.welcome-content h1{font-size:1.3rem;}.playlist-header{flex-direction:column;align-items:flex-start;}.playlist-cover{width:140px;height:140px;}}#search-view .view-header{display:flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-start !important;gap:12px !important;background:var(--bg-secondary);margin:calc(-1 * var(--search-header-pad)) calc(-1 * var(--search-header-pad)) 20px !important;padding:calc(10px + var(--safe-top)) var(--search-header-pad) 10px !important;border-bottom:1px solid var(--glass-border);position:sticky;top:0;z-index:100;flex-wrap:nowrap !important;}#search-view .back-nav-btn{margin:0 !important;flex-shrink:0;}.content-area.search-active{padding-top:0;}.content-area.search-active #search-view .view-header{margin:0 calc(-1 * var(--search-header-pad)) 20px !important;}.search-view-input-wrapper{flex:1;position:relative;display:flex;align-items:center;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:50px;padding:6px 15px;transition:all 0.3s ease;}.search-view-input-wrapper:focus-within{background:var(--hover-bg);border-color:var(--accent-1);box-shadow:0 0 15px rgba(255,107,107,0.15);}.search-view-input-wrapper input{flex:1;background:none;border:none !important;color:var(--text-primary);font-size:0.95rem;padding:8px 10px;outline:none !important;width:100%;}.search-view-input-wrapper i{color:var(--text-muted);}.search-history-list{display:flex;flex-direction:column;gap:8px;margin-top:15px;}.history-item{display:flex;align-items:center;gap:12px;padding:10px 15px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;cursor:pointer;transition:all 0.2s ease;}.history-item:hover{background:var(--hover-bg);transform:translateX(5px);}.delete-history-btn{opacity:0.4;width:30px !important;height:30px !important;}.delete-history-btn:hover{opacity:1;color:var(--accent-1) !important;background:rgba(255,107,107,0.1) !important;}.history-item img{width:40px;height:40px;border-radius:6px;object-fit:cover;}.history-info{flex:1;}.history-info h4{font-size:0.95rem;font-weight:500;margin-bottom:2px;}.history-info p{font-size:0.8rem;color:var(--text-muted);}@media (max-width:768px){.desktop-search{display:none !important;}.mobile-search-btn{display:flex !important;}.header-brand span{font-size:1rem;letter-spacing:0.5px;}.header-brand i{font-size:1.2rem;}}@media (min-width:769px){.desktop-search{display:none !important;}}@media (max-width:500px){#search-view{--search-header-pad:15px;}.content-area{padding:15px;}.header{padding:calc(10px + var(--safe-top)) 15px 10px;}.songs-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;}.genre-grid{grid-template-columns:repeat(2,1fr);}.player-bar{height:auto;min-height:calc(80px + var(--safe-bottom));flex-wrap:wrap;padding:10px 15px;padding-bottom:calc(10px + var(--safe-bottom));gap:8px;}.now-playing{width:100%;order:1;}.player-controls{width:100%;order:2;max-width:none;}}.lyrics-sidebar{width:0;max-width:0;background:rgba(0,0,0,0.3);border-left:1px solid var(--border-color);display:flex;flex-direction:column;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);overflow:hidden;flex-shrink:0;height:100%;opacity:0;}.lyrics-sidebar.show{width:320px;max-width:320px;opacity:1;}.lyrics-header{padding:20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-color);background:var(--glass-bg);}.lyrics-song-info{padding:10px 20px;opacity:0.8;font-size:0.9rem;background:rgba(0,0,0,0.1);}.lyrics-content-scroll{flex:1;overflow-y:auto;padding:20px;text-align:center;mask-image:linear-gradient(to bottom,transparent 10%,black 30%,black 70%,transparent 90%);-webkit-mask-image:linear-gradient(to bottom,transparent 10%,black 30%,black 70%,transparent 90%);scroll-behavior:smooth;}.lyrics-content-scroll::-webkit-scrollbar{width:0px;}.lyric-line{padding:15px 10px;margin:8px 0;border-radius:12px;cursor:pointer;transition:all 0.4s cubic-bezier(0.25,0.8,0.25,1);color:var(--text-muted);font-size:1.1rem;line-height:1.6;opacity:0.15;filter:blur(1.5px);transform:scale(0.95);}.lyric-line:hover{opacity:0.6;filter:blur(0);}.lyric-line.active{opacity:1;filter:blur(0);transform:scale(1.1);color:#ff6b6b !important;font-weight:800;font-size:1.5rem;margin:30px 0;background:transparent;text-shadow:0 4px 20px rgba(255,107,107,0.4);}.lyrics-footer{padding:20px;border-top:1px solid var(--border-color);text-align:center;background:var(--glass-bg);}.empty-state-lyrics{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-muted);opacity:0.6;}.pulse{animation:pulse-animation 1.5s infinite;}@keyframes pulse-animation{0%{transform:scale(1);opacity:1;}50%{transform:scale(1.1);opacity:0.8;}100%{transform:scale(1);opacity:1;}}.btn-small{background:transparent;border:1px solid var(--border-color);color:var(--text-muted);padding:6px 12px;border-radius:4px;cursor:pointer;font-size:0.8rem;transition:all 0.2s;}.btn-small:hover{border-color:var(--primary-color);color:var(--primary-color);background:rgba(255,107,107,0.05);}@media (min-width:901px){.player-bar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(380px,680px) minmax(220px,1fr);column-gap:16px;}.now-playing{width:auto;min-width:0;}.player-controls{justify-self:center;width:100%;max-width:680px;}.player-side{justify-self:end;}.player-extra{width:auto;}}.mobile-sheet-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px);z-index:2000;display:none;align-items:flex-end;opacity:0;transition:opacity 0.3s ease;}.mobile-sheet-overlay.show{display:flex;opacity:1;}.mobile-sheet-content{width:100%;background:var(--bg-card);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid var(--glass-border);box-shadow:0 20px 50px rgba(0,0,0,0.3);overflow-y:auto;transform:translateZ(0);-webkit-transform:translateZ(0);will-change:transform;border-top:1px solid var(--glass-border);border-radius:24px 24px 0 0;padding:20px;transform:translateY(100%);transition:transform 0.4s cubic-bezier(0.33,1,0.68,1);}.mobile-sheet-overlay.show .mobile-sheet-content{transform:translateY(0);}.mobile-sheet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid var(--glass-border);}.mobile-sheet-song-info{display:flex;align-items:center;gap:15px;}.mobile-sheet-song-info img{width:50px;height:50px;border-radius:8px;object-fit:cover;}.mobile-sheet-song-info h4{font-size:1rem;color:var(--text-primary);margin-bottom:2px;}.mobile-sheet-song-info p{font-size:0.8rem;color:var(--text-muted);}.mobile-sheet-body{display:flex;flex-direction:column;gap:8px;}.sheet-item{display:flex;align-items:center;gap:15px;padding:12px 15px;background:none;border:none;border-radius:12px;color:var(--text-primary);font-size:0.95rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;text-align:left;}.sheet-item:active{background:var(--hover-bg);transform:scale(0.98);}.sheet-item i{font-size:1.4rem;color:var(--text-muted);}.playlist-picker-grid{display:flex;flex-direction:column;gap:10px;max-height:350px;overflow-y:auto;margin-top:15px;padding-right:5px;}.picker-item{display:flex;align-items:center;gap:14px;padding:10px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;cursor:pointer;transition:all 0.2s ease;}.picker-item:hover{background:var(--hover-bg);border-color:var(--accent-1);transform:translateX(4px);}.picker-img{width:44px;height:44px;object-fit:cover;border-radius:8px;}.picker-item i{font-size:26px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border-radius:8px;color:var(--accent-1);}.picker-item span{font-weight:500;font-size:0.95rem;color:var(--text-primary);}.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:calc(65px + var(--safe-bottom));background:var(--bg-secondary);border-top:1px solid var(--glass-border);z-index:1000;justify-content:space-around;align-items:center;padding-bottom:var(--safe-bottom);}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-muted);cursor:pointer;transition:all 0.2s;flex:1;padding:10px 0;}.bottom-nav-item i{font-size:24px;}.bottom-nav-item span{font-size:0.7rem;font-weight:500;}.bottom-nav-item.active{color:var(--accent-1);}.mobile-only{display:none;}.mobile-player-overlay{position:fixed;inset:0;height:100dvh;background:var(--bg-primary);z-index:2000;display:flex;flex-direction:column;padding:clamp(10px,3vh,25px);transform:translateY(100%);transition:transform 0.4s cubic-bezier(0.33,1,0.68,1);overflow:hidden;}.mobile-player-overlay::before{content:'';position:absolute;inset:0;background-image:var(--player-bg,none);background-size:cover;background-position:center;filter:blur(100px) saturate(2);opacity:0.35;z-index:-1;transition:background-image 1s ease;}.mobile-player-overlay.active{transform:translateY(0);}.desktop-player-overlay{position:fixed;inset:0;background:var(--bg-primary);z-index:2200;display:none;flex-direction:column;padding:calc(28px + var(--safe-top)) clamp(24px,6vw,80px) calc(28px + var(--safe-bottom));overflow:hidden;color:var(--text-primary);}.desktop-player-overlay::before{content:'';position:absolute;inset:-10%;background-image:var(--player-bg,none);background-size:cover;background-position:center;filter:blur(90px) saturate(1.4);opacity:0.25;z-index:-2;}.desktop-player-overlay::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at top,rgba(255,107,107,0.18),transparent 45%),linear-gradient(180deg,rgba(10,10,10,0.4),rgba(10,10,10,0.85));z-index:-1;}.desktop-player-overlay.active{display:flex;}.mobile-player-overlay .aod-dimmer,.desktop-player-overlay .aod-dimmer{position:absolute;inset:0;background:radial-gradient(circle at center,rgba(0,0,0,0.2),rgba(0,0,0,0.85) 65%);opacity:0;transition:opacity 0.35s ease;pointer-events:none;z-index:3;}.mobile-player-overlay.aod-mode .aod-dimmer,.desktop-player-overlay.aod-mode .aod-dimmer{opacity:1;}.desktop-player-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:clamp(18px,3vh,30px);}.desktop-context span{display:block;font-size:0.7rem;letter-spacing:2px;color:var(--text-muted);}.desktop-context h5{margin-top:4px;font-size:1rem;color:var(--text-primary);}.desktop-player-body{flex:1;display:grid;grid-template-columns:minmax(280px,45%) minmax(320px,1fr);gap:clamp(24px,5vw,70px);align-items:center;min-height:0;}.desktop-player-art{position:relative;width:min(520px,40vw);aspect-ratio:1;border-radius:28px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,0.45);border:1px solid rgba(255,255,255,0.08);}.desktop-player-art img{width:100%;height:100%;object-fit:cover;display:block;}.desktop-lyrics-view{display:none;background:transparent;border:none;border-radius:0;padding:0;max-height:min(46vh,460px);overflow-y:auto;box-shadow:none;scrollbar-width:none;-ms-overflow-style:none;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 86%,transparent 100%);}.desktop-lyrics-view::-webkit-scrollbar{width:0;height:0;}.desktop-lyrics-content{text-align:center;font-size:clamp(1.5rem,2.2vw,2.1rem);line-height:1.35;color:rgba(255,255,255,0.2);padding:10vh 0;}.desktop-lyrics-content.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:240px;padding:0;color:rgba(255,255,255,0.45);}.desktop-lyrics-content.loading .spinner{margin:0;}.desktop-lyrics-content.loading p{margin:0;font-size:1rem;letter-spacing:0.5px;}.desktop-lyric-line{padding:8px 0;cursor:pointer;font-weight:800;color:rgba(255,255,255,0.2);opacity:0.25;transition:all 0.4s cubic-bezier(0.25,0.1,0.25,1);}.desktop-lyric-line.active{color:var(--primary-color,var(--accent-1));opacity:1;transform:scale(1.02);text-shadow:0 0 18px rgba(var(--primary-rgb,255,107,107),0.45);}.desktop-player-info{display:flex;flex-direction:column;gap:clamp(12px,2vh,22px);max-width:560px;}.desktop-title-artist h1{font-size:clamp(1.6rem,2.6vw,2.8rem);margin-bottom:6px;line-height:1.1;}.desktop-title-artist p{color:var(--text-secondary);font-size:1rem;}.desktop-progress .progress-bar{width:100%;height:6px;}.desktop-progress .time-info{display:flex;justify-content:space-between;margin-top:8px;font-size:0.85rem;color:var(--text-muted);}.desktop-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:420px;}.desktop-controls .control-btn{width:46px;height:46px;}.desktop-controls .control-btn i{font-size:2rem;}.desktop-play-btn{width:72px;height:72px;background:var(--accent-gradient);color:#1a1a1a !important;box-shadow:0 12px 35px rgba(255,107,107,0.35);}.desktop-play-btn:hover{transform:scale(1.04);}.desktop-play-btn i{font-size:3.2rem !important;color:#1a1a1a;}.desktop-actions{display:flex;gap:10px;}.desktop-player-overlay.lyrics-active .desktop-player-body{grid-template-columns:1fr;grid-template-rows:minmax(200px,1fr) auto;align-items:end;}.desktop-player-overlay.lyrics-active .desktop-player-art{display:none;}.desktop-player-overlay.lyrics-active .desktop-lyrics-view{display:block;}.desktop-player-overlay.lyrics-active .desktop-player-info{max-width:720px;width:100%;justify-self:center;align-self:end;}@media (max-width:900px){.desktop-player-overlay{display:none !important;}}.mobile-player-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(10px,1.5vh,20px);padding-top:var(--safe-top);}.mobile-header-info{text-align:center;}.mobile-header-info span{font-size:0.65rem;letter-spacing:1px;color:var(--text-muted);}.mobile-header-info h5{font-size:0.85rem;color:var(--text-primary);}.mobile-player-content{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(5px,1.5vh,15px);min-height:0;padding-bottom:env(safe-area-inset-bottom,20px);}.mobile-main-view{position:relative;width:100%;max-width:300px;margin:0 auto;display:flex;align-items:center;justify-content:center;flex:1;min-height:0;}.mobile-art-wrapper,.mobile-lyrics-wrapper{width:100%;border-radius:20px;overflow:hidden;transition:all 0.5s cubic-bezier(0.25,0.8,0.25,1);display:none;}.mobile-art-wrapper.active,.mobile-lyrics-wrapper.active{display:flex;flex-direction:column;height:100%;max-width:100%;max-height:min(280px,35vh);aspect-ratio:1/1;margin:0 auto;animation:viewSlideUp 0.5s ease;}@keyframes viewSlideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}.mobile-art-wrapper{box-shadow:0 20px 60px rgba(0,0,0,0.5);}.mobile-art-wrapper img{width:100%;height:100%;object-fit:cover;}.mobile-lyrics-wrapper{background:none;backdrop-filter:none;border:none;padding:0;}.mobile-lyrics-content{flex:1;overflow-y:auto;text-align:left;display:flex;flex-direction:column;gap:24px;scrollbar-width:none;padding:40px 20px;mask-image:linear-gradient(to bottom,transparent,black 15%,black 85%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,black 15%,black 85%,transparent);}.mobile-lyrics-content::-webkit-scrollbar{display:none;}.mobile-lyric-line{font-size:clamp(1.2rem,7vw,1.8rem);font-weight:800;color:rgba(255,255,255,0.2);transition:all 0.4s cubic-bezier(0.25,0.1,0.25,1);line-height:1.2;}.mobile-lyric-line.active{color:var(--primary-color,var(--accent-1));transform:scale(1.02);opacity:1;text-shadow:0 0 16px rgba(var(--primary-rgb,255,107,107),0.45);}.mobile-info-wrapper{display:flex;justify-content:space-between;align-items:flex-start;margin-top:5px;padding:0 5px;gap:15px;width:100%;}.mobile-title-artist{flex:1;min-width:0;}.mobile-title-artist h2{font-size:clamp(1.1rem,4.5vw,1.4rem);margin-bottom:2px;display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;width:100%;}.mobile-title-artist p{color:var(--text-muted);font-size:clamp(0.75rem,3.5vw,0.9rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.mobile-playback-controls{display:flex;flex-direction:column;gap:clamp(10px,2vh,20px);margin-top:auto;}.mobile-progress-container .progress-bar{height:4px;background:rgba(255,255,255,0.1);border-radius:2px;}.mobile-progress-container .time-info{display:flex;justify-content:space-between;margin-top:8px;font-size:0.75rem;color:var(--text-muted);}.mobile-buttons{display:flex;justify-content:space-between;align-items:center;}.mobile-buttons .control-btn i{font-size:clamp(1.8rem,5vw,2.2rem);}.mobile-play-btn i{font-size:clamp(3.2rem,12vw,4.2rem) !important;color:var(--accent-1);}.mobile-footer-actions{display:flex;justify-content:space-between;margin-top:10px;}@media (max-width:900px){.sidebar{display:none;}.app-container{position:fixed;top:0;left:0;right:0;bottom:calc(150px + var(--safe-bottom));height:auto;display:flex;flex-direction:row;z-index:10;}.main-content{flex:1;display:flex;flex-direction:column;background:rgba(0,0,0,0.5);backdrop-filter:blur(12px) saturate(1.5);-webkit-backdrop-filter:blur(12px) saturate(1.5);position:relative;overflow:hidden;}.content-area{padding-bottom:0;}.bottom-nav{display:flex;z-index:1001;}.player-bar{bottom:calc(65px + var(--safe-bottom));min-height:64px;height:auto;padding:8px 12px;gap:10px;border-radius:16px 16px 0 0;left:12px;right:12px;width:auto;margin:0;background:linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-tertiary) 100%);border:1px solid var(--glass-border);box-shadow:0 -8px 24px rgba(0,0,0,0.35);overflow:hidden;backdrop-filter:blur(12px) saturate(1.4);-webkit-backdrop-filter:blur(12px) saturate(1.4);}.player-controls,.player-extra,.mini-lyrics{display:none;}.now-playing{width:100%;display:grid;grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"art info controls";align-items:center;gap:10px;margin-bottom:0;}.now-playing-img{width:44px;height:44px;min-width:44px;border-radius:10px;flex-shrink:0;grid-area:art;}.now-playing-info{display:flex;flex-direction:column;justify-content:center;text-align:left;align-items:flex-start;min-width:0;overflow:hidden;grid-area:info;}.now-playing-info h4{font-size:0.9rem;line-height:1.15;}.now-playing-info p{font-size:0.72rem;line-height:1.1;}.mobile-only{display:block;}#mobile-player-expand{margin-bottom:20px;position:absolute;inset:0;z-index:10;cursor:pointer;}.now-playing-actions{z-index:11;display:flex;align-items:center;gap:6px;justify-content:flex-end;flex-shrink:0;flex-wrap:nowrap;white-space:nowrap;grid-area:controls;}.hide-mobile{display:none !important;}.mobile-mini-controls{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;}.mobile-mini-controls .action-btn{width:34px;height:34px;border-radius:10px;background:var(--glass-bg);border:1px solid var(--glass-border);}.mobile-mini-controls .action-btn i{font-size:1.6rem;}.song-options-btn,.song-list-actions{opacity:1 !important;}}body.ios-standalone .bottom-nav{align-items:flex-end;}body.ios-standalone .bottom-nav-item{padding-bottom:6px;}@media (max-height:660px) and (max-width:600px){.mobile-art-wrapper.active,.mobile-lyrics-wrapper.active{max-height:25vh;}.mobile-lyric-line{font-size:1.1rem;gap:15px;}.mobile-buttons .control-btn i{font-size:1.5rem;}.mobile-play-btn i{font-size:3rem !important;}.mobile-player-content{gap:5px;}.mobile-header-info span{display:none;}}@media (max-width:600px){.songs-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;}.welcome-banner{padding:20px;}.welcome-content h1{font-size:1.3rem;}.view-header{flex-direction:column;align-items:flex-start;}}#profile-view{max-width:900px;margin:0 auto;padding-bottom:40px;}.profile-content{display:flex;justify-content:center;margin-top:30px;}.profile-card{background:var(--bg-secondary);border:1px solid var(--glass-border);border-radius:24px;padding:40px;display:flex;flex-direction:column;align-items:center;gap:30px;width:100%;max-width:500px;box-shadow:0 20px 40px rgba(0,0,0,0.2);}.profile-avatar-container{position:relative;width:160px;height:160px;}.profile-avatar-large{width:100%;height:100%;border-radius:50%;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-size:4rem;font-weight:600;color:#1a1a1a;box-shadow:0 10px 25px rgba(255,107,107,0.4);cursor:pointer;overflow:hidden;transition:transform 0.3s cubic-bezier(0.175,0.885,0.32,1.275);}.profile-avatar-large:hover{transform:scale(1.05);}.profile-avatar-large img{width:100%;height:100%;object-fit:cover;}.avatar-edit-badge{position:absolute;bottom:5px;right:5px;width:42px;height:42px;background:var(--bg-primary);border:3px solid var(--bg-secondary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--accent-1);cursor:pointer;box-shadow:0 4px 10px rgba(0,0,0,0.3);transition:all 0.2s ease;}.avatar-edit-badge:hover{background:var(--accent-1);color:#1a1a1a;transform:translateY(-2px);}.profile-details{width:100%;display:flex;flex-direction:column;gap:20px;}.detail-item{display:flex;flex-direction:column;gap:5px;padding-bottom:12px;border-bottom:1px solid var(--glass-border);}.detail-item label{font-size:0.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;}.detail-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}.edit-btn{width:32px !important;height:32px !important;opacity:0.5;transition:all 0.2s;}.edit-btn:hover{opacity:1;color:var(--accent-1);}.detail-item p{font-size:1.1rem;font-weight:500;color:var(--text-primary);}.status-badge{background:var(--accent-gradient);color:#1a1a1a;padding:4px 12px;border-radius:20px;font-size:0.8rem;font-weight:600;}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;width:100%;}.stat-box{background:var(--glass-bg);border:1px solid var(--glass-border);padding:15px;border-radius:16px;text-align:center;transition:all 0.2s ease;}.stat-box:hover{background:var(--hover-bg);transform:translateY(-4px);}.stat-box h3{font-size:1.4rem;color:var(--accent-1);margin-bottom:4px;}.stat-box span{font-size:0.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;}@media (max-width:600px){.profile-card{padding:25px;}.profile-avatar-container{width:120px;height:120px;}}#settings-view{max-width:900px;margin:0 auto;padding-bottom:40px;}.settings-content{margin-top:30px;}.settings-card{background:var(--bg-secondary);border:1px solid var(--glass-border);border-radius:24px;padding:10px 0;box-shadow:0 15px 35px rgba(0,0,0,0.2);overflow:hidden;}.settings-section{padding:25px 30px;border-bottom:1px solid var(--glass-border);}.settings-section:last-child{border-bottom:none;}.settings-section h4{font-size:0.85rem;color:var(--accent-1);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:25px;display:flex;align-items:center;gap:10px;}.settings-section h4 i{font-size:1.2rem;}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:20px;}.setting-row:last-child{margin-bottom:0;}.setting-info{flex:1;}.setting-info span{display:block;font-size:1rem;font-weight:500;color:var(--text-primary);margin-bottom:4px;}.setting-info p{font-size:0.85rem;color:var(--text-muted);}.setting-select{padding:10px 15px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;color:var(--text-primary);font-size:0.9rem;outline:none;cursor:pointer;min-width:180px;transition:all 0.2s ease;}.setting-select:hover{border-color:var(--accent-1);background:var(--hover-bg);}.range-container{display:flex;align-items:center;gap:15px;min-width:200px;}.range-container input[type="range"]{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,var(--accent-1) 0%,var(--accent-1) 0%,var(--glass-bg) 0%,var(--glass-bg) 100%);border-radius:10px;outline:none;}.range-container input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--accent-1);border-radius:50%;cursor:pointer;}.range-container span{font-size:0.85rem;color:var(--text-primary);min-width:30px;}.btn-text{background:none;border:none;color:var(--accent-1);font-size:0.9rem;font-weight:500;cursor:pointer;padding:8px 16px;border-radius:8px;transition:background 0.2s;}.btn-text:hover{background:rgba(255,107,107,0.1);text-decoration:underline;}.artists-hero{display:flex;align-items:stretch;justify-content:space-between;gap:24px;padding:20px;margin-bottom:24px;border-radius:22px;border:1px solid var(--glass-border);background:radial-gradient(circle at top right,rgba(255,107,107,0.18),transparent 45%),linear-gradient(135deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));box-shadow:0 18px 40px rgba(0,0,0,0.25);}.artists-hero-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;}.artists-hero-copy h2{font-size:clamp(1.6rem,2.6vw,2.1rem);letter-spacing:0.2px;}.artists-hero-copy p{color:var(--text-secondary);font-size:0.95rem;}.artists-hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;}.hero-pill{padding:6px 10px;border-radius:999px;background:var(--glass-bg);border:1px solid var(--glass-border);font-size:0.72rem;color:var(--text-secondary);letter-spacing:0.3px;text-transform:uppercase;}.artists-hero-search{width:min(420px,100%);display:flex;flex-direction:column;gap:12px;justify-content:center;}.artists-tip{display:flex;align-items:center;gap:8px;font-size:0.78rem;color:var(--text-secondary);}.artists-tip i{font-size:1.1rem;color:var(--accent-1);}.artist-search-container{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:14px;padding:12px 20px;display:flex;align-items:center;gap:12px;width:100%;}.artist-search-container input{background:transparent;border:none;color:var(--text-primary);width:100%;font-size:0.95rem;}.artist-search-container input:focus{outline:none;}.artists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;}.artist-card{--artist-accent:rgba(255,107,107,0.35);background:radial-gradient(circle at top left,rgba(255,255,255,0.06),transparent 55%),linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.08);border-radius:20px;padding:16px;text-align:left;cursor:pointer;transition:all 0.3s ease;position:relative;overflow:hidden;box-shadow:0 16px 28px rgba(0,0,0,0.25);}.artist-card:hover{background:var(--hover-bg);transform:translateY(-6px);border-color:var(--accent-1);box-shadow:0 20px 40px rgba(0,0,0,0.35);}.artist-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--accent-gradient);opacity:0;transition:opacity 0.3s ease;z-index:2;}.artist-card:hover::before{opacity:1;}.artist-card::after{content:'';position:absolute;inset:-40% -20% auto auto;width:140px;height:140px;background:radial-gradient(circle,var(--artist-accent),transparent 65%);opacity:0.35;pointer-events:none;z-index:0;}.artist-card:nth-child(3n + 1){--artist-accent:rgba(254,202,87,0.35);}.artist-card:nth-child(3n + 2){--artist-accent:rgba(69,170,242,0.32);}.artist-card:nth-child(3n){--artist-accent:rgba(38,222,129,0.32);}.artist-card:nth-child(2n) .artist-card-img,.artist-card:nth-child(2n) .artist-card-img img{border-radius:50%;}.artist-card-header{display:grid;grid-template-columns:56px minmax(0,1fr);row-gap:10px;align-items:center;gap:12px;position:relative;z-index:1;}.artist-card-img{width:56px;height:56px;border-radius:14px;margin:0;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-size:1.6rem;font-weight:bold;color:#1a1a1a;box-shadow:0 10px 20px rgba(0,0,0,0.3);}.artist-card-img img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block;}.artist-card-info{min-width:0;}.artist-card h4{font-size:1rem;font-weight:600;margin-bottom:4px;color:var(--text-primary);white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25;}.artist-card p{font-size:0.78rem;color:var(--text-secondary);}.artist-pref-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--glass-border);background:var(--glass-bg);color:var(--text-primary);font-size:0.75rem;cursor:pointer;transition:all 0.2s ease;white-space:nowrap;justify-self:flex-start;}.artist-pref-btn i{font-size:1rem;}.artist-pref-btn:hover{border-color:var(--accent-1);color:var(--accent-1);}.artist-pref-btn.added{background:var(--accent-gradient);color:#1a1a1a;border-color:transparent;cursor:default;}.artist-pref-btn.added:hover{color:#1a1a1a;}.artist-card-hint{margin-top:10px;font-size:0.72rem;color:var(--text-muted);position:relative;z-index:1;}@media (max-width:768px){.artists-hero{flex-direction:column;padding:18px;}.artists-hero-search{width:100%;}.artists-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}.artist-card-header{grid-template-columns:48px 1fr;row-gap:10px;}.artist-card-img{width:48px;height:48px;font-size:1.4rem;}.artist-pref-btn{grid-column:1 / -1;justify-self:flex-start;padding:5px 10px;font-size:0.7rem;}.artist-card h4{font-size:0.95rem;}.artist-card p{font-size:0.72rem;}.setting-row{flex-direction:column;align-items:flex-start;gap:15px;}.setting-select,.range-container{width:100%;}.settings-section{padding:20px;}#search-view{padding-top:0 !important;}#search-view .view-header{margin-top:-10px;padding-top:calc(10px + var(--safe-top));padding-bottom:15px;background:var(--bg-primary);position:sticky;top:0;z-index:10;}}@media (max-width:900px){.install-banner{left:12px;right:12px;bottom:calc(150px + var(--safe-bottom));width:auto;max-width:none;}.header-brand span{letter-spacing:0.3em;line-height:1.2;font-size:larger;}}.branding{text-decoration:none;color:var(--accent-1);}.range-container input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--accent-1);border-radius:50%;cursor:pointer;}.range-container span{font-size:0.85rem;color:var(--text-primary);min-width:30px;}.btn-text{background:none;border:none;color:var(--accent-1);font-size:0.9rem;font-weight:500;cursor:pointer;padding:8px 16px;border-radius:8px;transition:background 0.2s;}.btn-text:hover{background:rgba(255,107,107,0.1);text-decoration:underline;}@media (max-width:768px){.setting-row{flex-direction:column;align-items:flex-start;gap:15px;}.setting-select,.range-container{width:100%;}.settings-section{padding:20px;}#search-view{padding-top:0 !important;}#search-view .view-header{margin-top:-10px;padding-top:calc(10px + var(--safe-top));padding-bottom:15px;background:var(--bg-primary);position:sticky;top:0;z-index:10;}}@media (max-width:900px){.install-banner{left:12px;right:12px;bottom:calc(150px + var(--safe-bottom));width:auto;max-width:none;}}.branding{text-decoration:none;color:var(--accent-1);}.remote-playback-banner{position:fixed;top:calc(20px + var(--safe-top));left:50%;transform:translateX(-50%) translateY(-150%);z-index:9999;background:linear-gradient(135deg,rgba(30,30,30,0.95) 0%,rgba(20,20,20,0.98) 100%);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:16px;padding:14px 20px;display:flex;align-items:center;gap:12px;max-width:90%;width:auto;min-width:280px;box-shadow:0 8px 32px rgba(0,0,0,0.4),0 0 0 1px rgba(255,107,107,0.2),0 0 60px -10px rgba(255,107,107,0.15);opacity:0;visibility:hidden;transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1);}.remote-playback-banner.show{transform:translateX(-50%) translateY(0);opacity:1;visibility:visible;}.remote-playback-content{display:flex;align-items:center;gap:14px;flex:1;min-width:0;}.remote-playback-icon{width:44px;height:44px;min-width:44px;border-radius:12px;background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px rgba(255,107,107,0.3);animation:pulse-glow 2s ease-in-out infinite;}.remote-playback-icon i{font-size:1.4rem;color:#1a1a1a;}@keyframes pulse-glow{0%,100%{box-shadow:0 4px 15px rgba(255,107,107,0.3);}50%{box-shadow:0 4px 25px rgba(255,107,107,0.5);}}.remote-playback-info{flex:1;min-width:0;}.remote-playback-title{font-size:0.75rem;font-weight:500;color:var(--accent-1);letter-spacing:0.5px;text-transform:uppercase;margin-bottom:3px;}.remote-playback-text{font-size:0.95rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px;}.remote-playback-close{width:32px;height:32px;min-width:32px;border-radius:50%;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;}.remote-playback-close:hover{background:var(--accent-gradient);color:#1a1a1a;border-color:transparent;}.remote-playback-close i{font-size:1rem;}[data-theme="light"] .remote-playback-banner{background:linear-gradient(135deg,rgba(255,255,255,0.98) 0%,rgba(250,250,250,0.98) 100%);box-shadow:0 8px 32px rgba(0,0,0,0.15),0 0 0 1px rgba(255,107,107,0.15),0 0 60px -10px rgba(255,107,107,0.1);}@media (max-width:768px){.remote-playback-banner{top:auto;bottom:calc(160px + var(--safe-bottom));max-width:calc(100% - 24px);left:12px;right:12px;transform:translateX(0) translateY(100%);}.remote-playback-banner.show{transform:translateX(0) translateY(0);}.remote-playback-text{max-width:180px;}}.search-view-input-wrapper{display:flex;align-items:center;gap:8px;width:100%;}.search-view-input-wrapper input{flex:1;width:100%;}