*{margin:0;padding:0;box-sizing:border-box}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;background:#0a0a0a;color:#fff}button,input{font-family:inherit}.top-nav{height:64px;background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;gap:1.5rem;position:relative;z-index:10}.top-nav-left{display:flex;align-items:center;gap:1rem;flex:0 0 auto}.top-nav-logo{background:none;border:none;display:flex;align-items:center;gap:.75rem;color:var(--accent);cursor:pointer;padding:.5rem;border-radius:4px;transition:all .2s;font-size:1.25rem;font-weight:700}.top-nav-logo-img{width:48px;height:48px;object-fit:contain;display:block}.top-nav-logo span{color:var(--accent)}.top-nav-logo:hover{background:var(--bg-hover);transform:scale(1.05)}.top-nav-center{flex:1;display:flex;align-items:center;justify-content:center;gap:1rem;max-width:600px;margin:0 auto}.top-nav-home-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:4px;transition:all .2s;display:flex;align-items:center;justify-content:center;flex-shrink:0}.top-nav-home-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.top-nav-search-form{width:100%;position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:1rem;color:var(--text-secondary);pointer-events:none}.top-nav-search-input{width:100%;padding:.75rem 1rem .75rem 3rem;background:var(--bg-tertiary);border:1px solid transparent;border-radius:500px;color:var(--text-primary);font-size:.9375rem;font-family:inherit;transition:all .2s}.top-nav-search-input:focus{outline:none;border-color:var(--text-secondary);background:var(--bg-primary)}.top-nav-search-input::placeholder{color:var(--text-secondary)}.top-nav-right{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}.top-nav-action-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem 1rem;border-radius:500px;font-size:.875rem;font-weight:600;font-family:inherit;display:flex;align-items:center;gap:.5rem;transition:all .2s;white-space:nowrap}.top-nav-action-btn.icon-only{padding:.5rem;border-radius:50%}.top-nav-action-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.top-nav-action-text{display:inline-block}.top-nav-user-menu-wrapper{position:relative;margin-left:.5rem}.top-nav-user-btn{background:var(--bg-hover);border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;padding:0}.top-nav-user-btn:hover{background:var(--bg-tertiary);transform:scale(1.05)}.top-nav-user-avatar{width:100%;height:100%;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--bg-primary);display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:700;text-transform:uppercase}.user-menu-backdrop{position:fixed;inset:0;z-index:998;background:transparent}.user-menu-dropdown{position:absolute;top:calc(100% + .5rem);right:0;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 32px #00000080;min-width:200px;z-index:999;overflow:hidden}.user-menu-header{padding:1rem;display:flex;align-items:center;gap:.75rem}.user-menu-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--bg-primary);display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;text-transform:uppercase;flex-shrink:0}.user-menu-info{flex:1;min-width:0}.user-menu-email{font-size:.875rem;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu-divider{height:1px;background:var(--border);margin:.5rem 0}.user-menu-item{width:100%;padding:.75rem 1rem;background:none;border:none;color:var(--text-primary);font-size:.875rem;font-family:inherit;text-align:left;cursor:pointer;display:flex;align-items:center;gap:.75rem;transition:background .2s}.user-menu-item:hover{background:var(--bg-hover)}.user-menu-item svg{color:var(--text-secondary);flex-shrink:0}@media(max-width:900px){.top-nav-action-text{display:none}.top-nav{padding:0 1rem;gap:1rem}.top-nav-center{max-width:none;margin:0}}@media(max-width:600px){.top-nav-home-btn{display:none}.top-nav-center{flex:1}}.context-menu{position:fixed;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;min-width:200px;z-index:10000;box-shadow:0 8px 24px #00000080;padding:.25rem 0;animation:contextMenuFadeIn .15s ease-out}@keyframes contextMenuFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.625rem 1rem;background:none;border:none;color:var(--text-primary);font-size:.875rem;cursor:pointer;text-align:left;transition:background .15s;font-family:inherit}.context-menu-item:hover:not(.disabled){background:var(--bg-hover)}.context-menu-item.disabled{opacity:.5;cursor:not-allowed}.context-menu-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0}.context-menu-icon svg{width:16px;height:16px}.context-menu-arrow{margin-left:auto;font-size:.75rem;color:var(--text-secondary)}.context-menu-separator{height:1px;background:var(--border);margin:.25rem 0}@media(max-width:600px){.context-menu{min-width:240px}.context-menu-item{padding:.875rem 1rem;font-size:.9375rem;min-height:44px}.context-menu-icon svg{width:20px;height:20px}}.playlist-grid-cover{border-radius:4px;overflow:hidden;flex-shrink:0}.playlist-grid-cover.small{width:40px;height:40px}.playlist-grid-cover.medium{width:80px;height:80px}.playlist-grid-cover.large{width:232px;height:232px;box-shadow:0 8px 24px #00000080}.playlist-grid-cover.placeholder{background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.playlist-grid-cover.single{display:flex}.playlist-grid-cover-single{width:100%;height:100%;object-fit:cover}.playlist-grid-cover.grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:0}.playlist-grid-cover-item{width:100%;height:100%;object-fit:cover}.sidebar{width:var(--sidebar-width, 240px);background:var(--bg-secondary);display:flex;flex-direction:column;padding:1rem 0;overflow:hidden;height:100%;position:relative}.sidebar-resize-handle{position:absolute;top:0;right:0;width:4px;height:100%;cursor:col-resize;background:transparent;z-index:10;transition:background .2s}.sidebar-resize-handle:hover,.sidebar-resize-handle:active{background:var(--accent)}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem 1rem;gap:.5rem}.sidebar-title{font-size:1rem;font-weight:700;color:var(--text-primary);margin:0;flex:1}.sidebar-header-actions{display:flex;align-items:center;gap:.5rem}.sidebar-create-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.sidebar-create-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.sidebar-filters{display:flex;gap:.5rem;padding:0 1rem 1rem;border-bottom:1px solid var(--border);margin-bottom:.5rem;overflow-x:auto;overflow-y:hidden}.sidebar-filters::-webkit-scrollbar{height:6px}.sidebar-filters::-webkit-scrollbar-track{background:transparent}.sidebar-filters::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}.sidebar-filters::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.sidebar-filter-tab{background:none;border:none;color:var(--text-secondary);font-size:.875rem;font-weight:600;padding:.5rem .75rem;border-radius:4px;cursor:pointer;white-space:nowrap;transition:all .2s;font-family:inherit}.sidebar-filter-tab:hover,.sidebar-filter-tab.active{color:var(--text-primary);background:var(--bg-hover)}.sidebar-content{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:0 .5rem}.sidebar-empty{color:var(--text-secondary);font-size:.875rem;text-align:center;padding:2rem 1rem}.sidebar-library-list{flex:1;overflow-y:auto;padding-right:.5rem}.sidebar-library-list::-webkit-scrollbar{width:8px}.sidebar-library-list::-webkit-scrollbar-track{background:transparent}.sidebar-library-list::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:4px}.sidebar-library-list::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.sidebar-library-item{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;border-radius:4px;text-decoration:none;color:var(--text-primary);transition:background .2s;min-height:56px}.sidebar-library-item:hover,.sidebar-library-item.active{background:var(--bg-hover)}.sidebar-library-item.playing-source{background:var(--bg-hover);border-left:3px solid var(--accent);padding-left:calc(.75rem - 3px)}.sidebar-library-item.playing-source .sidebar-item-title{color:var(--accent)}.sidebar-item-thumbnail{width:40px;height:40px;flex-shrink:0;border-radius:4px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;overflow:hidden}.sidebar-item-image{width:100%;height:100%;object-fit:cover}.sidebar-item-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.sidebar-item-icon.liked-icon{background:linear-gradient(135deg,#450af5,#c4efd9);color:#fff}.sidebar-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.sidebar-item-title{font-size:.9375rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:flex;align-items:center;gap:.375rem;min-width:0}.sidebar-item-title>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.sidebar-pin-icon{flex-shrink:0;color:var(--accent);opacity:.8}.sidebar-item-subtitle{font-size:.8125rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}.dialog-cancel,.dialog-submit{padding:.75rem 1.5rem;border-radius:500px;font-weight:600;font-size:.9375rem;cursor:pointer;transition:all .2s;border:none;font-family:inherit}@media(max-width:900px){.sidebar{width:80px}.sidebar-title,.sidebar-filter-tab,.sidebar-item-info{display:none}.sidebar-header-actions{flex-direction:column}.sidebar-library-item{justify-content:center;padding:.75rem}.sidebar-item-thumbnail{width:48px;height:48px}}@media(max-width:600px){.sidebar{display:none}.library-content .sidebar{display:flex!important}}.playlist-picker{position:fixed;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;width:300px;max-height:400px;z-index:10001;box-shadow:0 8px 24px #00000080;display:flex;flex-direction:column;animation:playlistPickerFadeIn .15s ease-out;overflow:hidden}@keyframes playlistPickerFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.playlist-picker-search{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:var(--bg-secondary);border-bottom:1px solid var(--border)}.playlist-picker-search-icon{color:var(--text-secondary);flex-shrink:0}.playlist-picker-search-input{flex:1;background:transparent;border:none;color:var(--text-primary);font-size:.875rem;font-family:inherit;outline:none}.playlist-picker-search-input::placeholder{color:var(--text-secondary)}.playlist-picker-new{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem;background:none;border:none;color:var(--text-primary);font-size:.875rem;cursor:pointer;text-align:left;transition:background .15s;font-family:inherit}.playlist-picker-new:hover:not(:disabled){background:var(--bg-hover)}.playlist-picker-new:disabled{opacity:.5;cursor:not-allowed}.playlist-picker-new-input-container{padding:.75rem;border-bottom:1px solid var(--border)}.playlist-picker-new-input{width:100%;padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-size:.875rem;font-family:inherit;outline:none}.playlist-picker-new-input:focus{border-color:var(--accent)}.playlist-picker-list{flex:1;overflow-y:auto;max-height:300px}.playlist-picker-list::-webkit-scrollbar{width:8px}.playlist-picker-list::-webkit-scrollbar-track{background:transparent}.playlist-picker-list::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:4px}.playlist-picker-list::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.playlist-picker-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.5rem .75rem;background:none;border:none;color:var(--text-primary);font-size:.875rem;cursor:pointer;text-align:left;transition:background .15s;font-family:inherit}.playlist-picker-item:hover{background:var(--bg-hover)}.playlist-picker-item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlist-picker-empty{padding:1.5rem;text-align:center;color:var(--text-secondary);font-size:.875rem}.right-sidebar{width:var(--right-sidebar-width, 320px);background:var(--bg-secondary);border-left:1px solid var(--border);display:flex;flex-direction:column;height:100%;overflow:hidden;position:relative}.right-sidebar-resize-handle{position:absolute;top:0;left:0;width:4px;height:100%;cursor:col-resize;background:transparent;z-index:10;transition:background .2s}.right-sidebar-resize-handle:hover,.right-sidebar-resize-handle:active{background:var(--accent)}.right-sidebar-top{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid var(--border)}.right-sidebar-tabs{display:flex;gap:.5rem}.tab-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;color:var(--text-secondary);cursor:pointer;font-size:.875rem;transition:all .2s}.tab-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.tab-btn.active{background:var(--accent);color:var(--bg-primary);border-color:var(--accent)}.close-sidebar-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:4px;transition:color .2s}.close-sidebar-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.right-sidebar-content{display:flex;flex-direction:column;height:100%;overflow:hidden}.right-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid var(--border)}.right-sidebar-header h3{margin:0;font-size:1rem;font-weight:600;color:var(--text-primary)}.header-actions{display:flex;align-items:center;gap:.5rem}.view-toggle-btn{background:none;border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;padding:.375rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.view-toggle-btn:hover{color:var(--text-primary);border-color:var(--text-secondary);background:var(--bg-hover)}.clear-queue-btn{background:none;border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;padding:.375rem .75rem;border-radius:4px;font-size:.875rem;transition:all .2s}.clear-queue-btn:hover:not(:disabled){color:var(--text-primary);border-color:var(--text-secondary)}.clear-queue-btn:disabled{opacity:.5;cursor:not-allowed}.lyrics-content,.queue-content{flex:1;overflow-y:auto;padding:1rem}.lyrics-content::-webkit-scrollbar,.queue-content::-webkit-scrollbar{width:8px}.lyrics-content::-webkit-scrollbar-track,.queue-content::-webkit-scrollbar-track{background:transparent}.lyrics-content::-webkit-scrollbar-thumb,.queue-content::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:4px}.lyrics-content::-webkit-scrollbar-thumb:hover,.queue-content::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.lyrics-text{white-space:pre-wrap;font-size:.875rem;line-height:1.6;color:var(--text-primary);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.lyrics-lines{display:flex;flex-direction:column;gap:.25rem}.lyrics-line{padding:.35rem .5rem;border-radius:6px;color:var(--text-secondary);transition:background .2s,color .2s;cursor:pointer}.lyrics-line.active{background:#ff6b3526;color:var(--text-primary)}.lyrics-line-text{display:block;font-size:.9rem}.loading-state,.error-state,.no-content{color:var(--text-secondary);font-size:.875rem;text-align:center;padding:2rem 1rem}.queue-list{display:flex;flex-direction:column;gap:.125rem}.queue-item{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem;background:none;border:none;border-radius:6px;color:var(--text-primary);text-align:left;transition:background .2s,opacity .2s,border-top .2s}.queue-item[draggable=true]{cursor:grab}.queue-item.dragging{opacity:.5;background:var(--bg-hover)}.queue-item.drag-over{border-top:2px solid var(--accent)}.drag-handle{color:var(--text-secondary);cursor:grab;display:flex;align-items:center;opacity:0;transition:opacity .2s}.queue-item:hover .drag-handle{opacity:1}.queue-item-content{flex:1;display:flex;align-items:center;gap:.75rem;background:none;border:none;color:inherit;cursor:pointer;text-align:left;padding:0;min-width:0}.queue-item.active{background:#ff6b3526}.queue-number{width:1.5rem;flex-shrink:0;font-size:.8125rem;color:var(--text-secondary);text-align:center;font-weight:500}.queue-item.active .queue-number{color:var(--accent)}.queue-track-info{display:flex;flex-direction:column;min-width:0;flex:1}.queue-track-title{font-size:.875rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:.125rem}.queue-track-artist{font-size:.8125rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:1200px){.right-sidebar{width:var(--right-sidebar-width, 280px)}}@media(max-width:900px){.right-sidebar{position:fixed;top:0;right:0;bottom:90px;width:var(--right-sidebar-width, 320px);max-width:90vw;z-index:100;box-shadow:-4px 0 20px #0000004d}.right-sidebar-resize-handle{display:none}}@media(max-width:600px){.right-sidebar{width:100vw;max-width:100vw;bottom:70px}.right-sidebar-tabs{flex:1}.tab-btn{flex:1;justify-content:center}}.player{height:90px;background:var(--bg-tertiary);border-top:1px solid var(--border);display:grid;grid-template-columns:minmax(160px,1fr) minmax(640px,2fr) minmax(160px,1fr);align-items:center;padding:0 1rem;gap:1rem;box-shadow:0 -2px 10px #0000004d;grid-column:1 / -1}.player-track{display:flex;align-items:center;gap:1rem;min-width:0}.player-cover{width:56px;height:56px;border-radius:4px;object-fit:cover;background:var(--bg-secondary)}.player-info{display:flex;flex-direction:column;min-width:0;overflow:hidden}.player-title{font-size:.875rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-artist{font-size:.75rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-artist.clickable{cursor:pointer;transition:color .2s}.player-artist.clickable:hover{color:var(--text-primary);text-decoration:underline}.player-like{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:color .2s}.player-like:hover{color:var(--text-primary)}.player-like.liked{color:var(--accent)}.player-empty{color:var(--text-secondary);font-size:.875rem}.player-mobile-play{display:none}.player-controls{display:flex;flex-direction:column;align-items:center;gap:.5rem;justify-self:center}.player-buttons{display:flex;align-items:center;gap:1rem}.control-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:all .12s ease-in-out;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;line-height:0}.control-btn:hover:not(:disabled){color:var(--text-primary);transform:scale(1.05)}.control-btn:disabled{opacity:.5;cursor:not-allowed}.control-btn.active{color:var(--accent)}.play-btn{width:44px;height:44px;background:var(--accent);color:var(--bg-primary);display:inline-flex;align-items:center;justify-content:center;border-radius:50%}.play-btn:hover:not(:disabled){transform:scale(1.05);background:var(--text-primary)}.player-progress{display:flex;align-items:center;gap:.75rem;width:100%;max-width:none}.progress-time{font-size:.75rem;color:var(--text-secondary);min-width:40px;text-align:center}.progress-bar{flex:1;height:6px;background:var(--bg-hover);border-radius:999px;cursor:pointer;position:relative;overflow:visible;min-width:600px}.progress-fill{height:100%;background:var(--text-primary);border-radius:999px;position:relative;transition:width .1s ease-out;min-width:2px;will-change:width}.progress-bar:hover .progress-fill{background:var(--accent)}.progress-bar:hover .progress-fill:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background:var(--accent);border-radius:50%;box-shadow:0 0 6px #ff6b352e}.player-extras{display:flex;align-items:center;justify-content:flex-end;gap:.25rem}.extra-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:color .2s;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}.extra-btn:hover:not(:disabled){color:var(--text-primary)}.extra-btn:disabled{opacity:.5;cursor:not-allowed}.extra-btn.active{color:var(--accent)}.volume-control{display:inline-flex;align-items:center;gap:.5rem;vertical-align:middle}.volume-control .extra-btn{display:inline-flex;align-items:center;justify-content:center}.volume-bar{width:100px;height:4px;background:var(--bg-hover);border-radius:2px;cursor:pointer;align-self:center}.volume-fill{height:100%;background:var(--text-primary);border-radius:2px;min-width:2px}.volume-bar:hover .volume-fill{background:var(--accent)}.speed-control{position:relative;display:inline-flex;align-items:center}.speed-control-wrapper{position:relative;display:inline-block;vertical-align:middle}.speed-control .extra-btn{display:inline-flex;align-items:center;justify-content:center}.speed-label{position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);font-size:.75rem;font-weight:500;color:var(--accent);text-align:center;line-height:1;white-space:nowrap;pointer-events:none}.speed-menu{position:absolute;bottom:100%;right:0;margin-bottom:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;width:320px;z-index:1000;box-shadow:0 8px 24px #00000080;padding:1rem;animation:speedMenuFadeIn .15s ease-out}@keyframes speedMenuFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.speed-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.speed-menu-title{font-size:1rem;font-weight:700;color:var(--text-primary)}.speed-slider-container{margin-bottom:1rem}.speed-slider{position:relative;width:100%;height:32px;cursor:pointer;margin-bottom:.5rem}.speed-slider-track{position:absolute;top:50%;left:0;right:0;height:4px;background:var(--bg-hover);border-radius:2px;transform:translateY(-50%)}.speed-slider-fill{height:100%;background:var(--text-primary);border-radius:2px;transition:width .1s linear}.speed-slider-thumb{position:absolute;top:50%;width:16px;height:16px;background:var(--text-primary);border-radius:50%;transform:translate(-50%,-50%);transition:left .1s linear;cursor:grab}.speed-slider-thumb:active{cursor:grabbing}.speed-slider:hover .speed-slider-fill{background:var(--accent)}.speed-slider:hover .speed-slider-thumb{background:var(--accent);transform:translate(-50%,-50%) scale(1.1)}.speed-slider-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-primary);padding:0 2px}.speed-menu-footer{display:flex;align-items:center;justify-content:space-between}.speed-toggle-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none}.speed-toggle-text{font-size:.875rem;color:var(--accent);font-weight:500}.speed-toggle{position:relative;width:44px;height:24px;background:var(--bg-hover);border:none;border-radius:12px;cursor:pointer;padding:2px;transition:background .2s}.speed-toggle.active{background:var(--accent)}.speed-toggle-slider{position:absolute;top:2px;left:2px;width:20px;height:20px;background:var(--text-primary);border-radius:50%;transition:transform .2s;transform:translate(0)}.speed-toggle.active .speed-toggle-slider{transform:translate(20px)}.speed-reset-btn{background:var(--bg-hover);border:none;border-radius:4px;color:var(--text-primary);font-size:.875rem;font-weight:700;padding:.5rem 1rem;cursor:pointer;transition:background .2s;font-family:inherit}.speed-reset-btn:hover{background:var(--bg-tertiary)}@media(max-width:768px){.player{padding:0 .5rem;gap:.5rem}.player-track{gap:.5rem}.player-cover{width:48px;height:48px}.player-title{font-size:.8rem}.player-artist{font-size:.7rem}.player-buttons{gap:.5rem}.control-btn{padding:.25rem}.player-progress{gap:.5rem;max-width:none}.progress-time{font-size:.7rem;min-width:35px}.player-extras{gap:.25rem}.extra-btn{padding:.25rem}.volume-bar{width:80px}}@media(max-width:600px){.player{height:var(--mobile-player-height);grid-template-columns:1fr auto;grid-template-rows:1fr;padding:.5rem 1rem;gap:1rem;align-items:center;position:relative}.player-track{justify-content:flex-start;gap:.75rem;min-width:0;flex:1;cursor:pointer}.player-cover{width:48px;height:48px;flex-shrink:0;pointer-events:none}.player-info{min-width:0;flex:1;pointer-events:none}.player-like{display:none}.player-mobile-play{display:flex!important;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:.5rem}.player-controls,.player-extras{display:none}}.mobile-bottom-nav{display:none}@media(max-width:600px){.mobile-bottom-nav{display:flex;position:relative;bottom:0;left:0;right:0;background:var(--bg-secondary);border-top:1px solid var(--border);height:var(--mobile-bottom-nav-height);z-index:50;box-shadow:0 -2px 10px #0000004d}.mobile-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;color:var(--text-secondary);text-decoration:none;background:none;border:none;cursor:pointer;padding:.5rem;transition:color .2s;min-height:44px;font-family:inherit}.mobile-nav-item:active{background:var(--bg-hover)}.mobile-nav-item.active{color:var(--accent)}.mobile-nav-label{font-size:.625rem;font-weight:600;text-align:center}}.fullscreen-player{position:fixed;inset:0;background:linear-gradient(180deg,var(--bg-tertiary) 0%,var(--bg-primary) 50%);z-index:1000;display:flex;flex-direction:column;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.fullscreen-player-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;height:var(--top-nav-height);flex-shrink:0}.fullscreen-player-close,.fullscreen-player-more{background:none;border:none;color:var(--text-primary);cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s;min-width:44px;min-height:44px}.fullscreen-player-close:active,.fullscreen-player-more:active{background:var(--bg-hover)}.fullscreen-player-title-small{font-size:.875rem;font-weight:600;color:var(--text-primary)}.fullscreen-player-tabs{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:0 1.5rem 1rem;border-bottom:1px solid var(--border)}.fullscreen-tab{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:all .2s;border-radius:20px;font-family:inherit}.fullscreen-tab:hover{color:var(--text-primary);background:var(--bg-hover)}.fullscreen-tab.active{color:var(--text-primary);background:var(--bg-tertiary)}.fullscreen-player-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:2rem 1.5rem;overflow-y:auto}.fullscreen-player-artwork{width:100%;max-width:400px;aspect-ratio:1;flex-shrink:0;margin-bottom:2rem}.fullscreen-player-cover{width:100%;height:100%;object-fit:cover;border-radius:8px;box-shadow:0 8px 32px #00000080}.fullscreen-player-info{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:2rem}.fullscreen-player-track-details{flex:1;min-width:0}.fullscreen-player-track-title{font-size:1.5rem;font-weight:700;margin:0 0 .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fullscreen-player-track-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.fullscreen-player-track-artist{font-size:1rem;color:var(--text-secondary);cursor:pointer;transition:color .2s}.fullscreen-player-track-artist.clickable:hover{color:var(--text-primary);text-decoration:underline}.fullscreen-player-separator{color:var(--text-secondary);font-size:.875rem}.fullscreen-player-album{display:flex;align-items:center;gap:.375rem;background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.25rem .5rem;border-radius:12px;font-size:.875rem;font-family:inherit;transition:all .2s}.fullscreen-player-album:hover{color:var(--text-primary);background:var(--bg-hover)}.fullscreen-player-like{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;flex-shrink:0}.fullscreen-player-like:active{transform:scale(.95)}.fullscreen-player-like.liked{color:var(--accent)}.fullscreen-player-progress{width:100%;margin-bottom:2rem}.fullscreen-player-progress-bar{width:100%;height:6px;background:var(--bg-hover);border-radius:3px;cursor:pointer;position:relative;margin-bottom:.5rem}.fullscreen-player-progress-fill{height:100%;background:var(--accent);border-radius:3px;position:relative}.fullscreen-player-progress-fill:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background:var(--accent);border-radius:50%;box-shadow:0 0 8px #ff6b354d}.fullscreen-player-progress-times{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-secondary)}.fullscreen-player-controls{width:100%;display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-bottom:2rem}.fullscreen-control-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.fullscreen-control-btn:active{transform:scale(.95)}.fullscreen-control-btn.active{color:var(--accent)}.fullscreen-control-btn-play{background:var(--text-primary);border:none;border-radius:50%;color:var(--bg-primary);cursor:pointer;padding:1rem;transition:all .2s;display:flex;align-items:center;justify-content:center;width:72px;height:72px}.fullscreen-control-btn-play:active{transform:scale(.95)}.fullscreen-control-btn-play:disabled{opacity:.5;cursor:not-allowed}.fullscreen-player-actions{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}.fullscreen-action-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.fullscreen-action-btn:active{transform:scale(.95)}.fullscreen-action-btn:disabled{opacity:.5;cursor:not-allowed}.fullscreen-action-btn:hover{color:var(--text-primary)}@media(max-width:600px){.fullscreen-player-content{padding:1.5rem 1rem}.fullscreen-player-artwork{max-width:100%;margin-bottom:1.5rem}.fullscreen-player-track-title{font-size:1.25rem}.fullscreen-player-track-artist{font-size:.875rem}.fullscreen-player-controls{gap:1rem}.fullscreen-control-btn-play{width:64px;height:64px;padding:.875rem}}.fullscreen-player-queue{flex:1;display:flex;flex-direction:column;padding:1.5rem;overflow-y:auto}.queue-title{font-size:1.25rem;font-weight:700;margin:0 0 1.5rem;color:var(--text-primary)}.queue-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;color:var(--text-secondary);padding:4rem 2rem}.queue-empty p{margin:0;font-size:1rem}.queue-list{display:flex;flex-direction:column;gap:.5rem}.queue-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border-radius:8px;transition:background .2s}.queue-item:hover{background:var(--bg-hover)}.queue-item.playing{background:#ff6b351a}.queue-item-info{display:flex;flex-direction:column;gap:.25rem;flex:1;min-width:0}.queue-item-title{font-size:.9375rem;font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-item-artist{font-size:.8125rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-item-duration{font-size:.875rem;color:var(--text-secondary);flex-shrink:0}.fullscreen-player-lyrics{flex:1;display:flex;flex-direction:column;padding:1.5rem;overflow-y:auto}.lyrics-title{font-size:1.25rem;font-weight:700;margin:0 0 1.5rem;color:var(--text-primary)}.lyrics-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.lyrics-content p{margin:0;font-size:1rem}.lyrics-lines{width:100%;max-width:720px;display:flex;flex-direction:column;gap:.5rem;align-items:stretch}.lyrics-line{padding:.5rem .75rem;border-radius:8px;cursor:pointer;color:var(--text-secondary);transition:background .15s,color .15s}.lyrics-line:hover{background:var(--bg-hover);color:var(--text-primary)}.lyrics-line.active{background:linear-gradient(90deg,#ffffff05,#fff0);color:var(--text-primary);font-weight:600}.lyrics-text{white-space:pre-wrap;text-align:left;max-width:720px}.home{padding-bottom:2rem}.home-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;color:var(--text-secondary)}.hero{position:relative;padding:4rem 2rem;background:linear-gradient(135deg,var(--accent) 0%,#191414 70%);border-radius:8px;margin:1rem 2rem 2rem;overflow:hidden}.hero-content{position:relative;z-index:1;max-width:600px}.hero h1{font-size:3rem;font-weight:800;margin:0 0 1rem;line-height:1.1}.hero p{font-size:1.125rem;color:#fffc;margin:0 0 2rem}.hero-cta{display:inline-flex;align-items:center;gap:.5rem;padding:1rem 2rem;background:var(--text-primary);color:var(--bg-primary);text-decoration:none;font-weight:700;border-radius:500px;transition:transform .2s,background .2s}.hero-cta:hover{transform:scale(1.05);background:#f0f0f0}.hero-gradient{position:absolute;top:0;right:0;width:50%;height:100%;background:radial-gradient(circle at center,rgba(0,0,0,.3),transparent)}.home-section{padding:0 2rem;margin-bottom:2rem}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.section-header h2{font-size:1.5rem;font-weight:700;margin:0}.see-all{color:var(--text-secondary);text-decoration:none;font-size:.875rem;font-weight:600;transition:color .2s}.see-all:hover{color:var(--text-primary)}.card-grid{display:flex;gap:1.5rem;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--bg-hover) transparent;padding-bottom:.5rem;-webkit-overflow-scrolling:touch}.card-grid::-webkit-scrollbar{height:6px}.card-grid::-webkit-scrollbar-track{background:transparent}.card-grid::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}.card-grid::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.music-card{background:var(--bg-secondary);padding:1rem;border-radius:8px;transition:background .2s;cursor:pointer;text-decoration:none;color:inherit;flex:0 0 180px;min-width:180px}.music-card:hover{background:var(--bg-hover)}.card-image-container{position:relative;margin-bottom:1rem}.card-image{width:100%;aspect-ratio:1;border-radius:4px;object-fit:cover;background:var(--bg-tertiary)}.artist-image-container{border-radius:50%;overflow:hidden;position:relative}.artist-image{border-radius:50%}.artist-card .card-image-container.artist-image-container{overflow:visible}.artist-card .artist-image{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover}.artist-card .card-play-btn{position:absolute;bottom:8px;right:8px;width:48px;height:48px;background:var(--accent);border:none;border-radius:50%;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;box-shadow:0 8px 16px #0000004d;z-index:10;pointer-events:auto}.artist-card:hover .card-play-btn{opacity:1;transform:translateY(0)}.card-play-btn{position:absolute;bottom:8px;right:8px;width:48px;height:48px;background:var(--accent);border:none;border-radius:50%;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;box-shadow:0 8px 16px #0000004d}.music-card:hover .card-play-btn{opacity:1;transform:translateY(0)}.card-play-btn:hover{transform:scale(1.05);background:var(--accent-hover)}.card-title{font-size:.9375rem;font-weight:600;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-subtitle{font-size:.8125rem;color:var(--text-secondary);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlist-card .card-image-container{position:relative;width:100%;aspect-ratio:1;border-radius:4px;overflow:hidden;background:var(--bg-tertiary)}.playlist-card .playlist-cover-wrapper{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.playlist-card .playlist-cover-wrapper .playlist-grid-cover{width:100%!important;height:100%!important;border-radius:4px}.playlist-card .playlist-cover-wrapper .playlist-grid-cover.small,.playlist-card .playlist-cover-wrapper .playlist-grid-cover.medium,.playlist-card .playlist-cover-wrapper .playlist-grid-cover.large{width:100%!important;height:100%!important}.loading-skeleton{pointer-events:none;cursor:default}.skeleton-image{width:100%;aspect-ratio:1;background:linear-gradient(90deg,var(--bg-tertiary) 0%,var(--bg-hover) 50%,var(--bg-tertiary) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}.skeleton-title,.skeleton-subtitle{height:16px;background:linear-gradient(90deg,var(--bg-tertiary) 0%,var(--bg-hover) 50%,var(--bg-tertiary) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px;margin-top:.75rem}.skeleton-title{width:80%;margin-bottom:.5rem}.skeleton-subtitle{width:60%}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.empty-section{padding:3rem 2rem;text-align:center;color:var(--text-secondary)}.empty-section p{margin:0;font-size:.9375rem}@media(max-width:768px){.hero{margin:.5rem 1rem 1.5rem;padding:2rem 1.5rem}.hero h1{font-size:2rem}.home-section{padding:0 1rem}.card-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}}@media(max-width:600px){.hero{margin:.5rem .5rem 1rem;padding:1.5rem 1rem}.hero h1{font-size:1.5rem}.hero p{font-size:.875rem}.home-section{padding:0 .5rem;margin-bottom:2rem}.section-header h2{font-size:1.25rem}.card-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.card{padding:.75rem}.card-title{font-size:.875rem}.card-subtitle{font-size:.75rem}}.search-page{padding:1rem 2rem 2rem}.search-filters{display:flex;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap;align-items:center}.search-filter-btn{padding:.5rem 1rem;background:#ffffff1a;border:none;border-radius:500px;color:var(--text-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.search-filter-btn:hover{background:#ffffff26}.search-filter-btn.active{background:var(--text-primary);color:var(--bg-primary);font-weight:600}.search-top-section{display:grid;grid-template-columns:max-content 1fr;gap:1.5rem;margin-bottom:3rem}.search-top-result{text-decoration:none;color:inherit;justify-self:center}.top-result-card{background:var(--bg-secondary);border-radius:8px;padding:1rem;cursor:pointer;transition:background .2s;display:flex;flex-direction:column;align-items:center;height:100%;min-height:0;max-width:480px}.top-result-card:hover{background:var(--bg-hover)}.top-result-image-container{margin-bottom:1rem;flex-shrink:0}.top-result-image{width:100%;aspect-ratio:1;max-width:180px;object-fit:cover;background:var(--bg-tertiary)}.top-result-image-circle{border-radius:50%}.top-result-image-square{border-radius:8px}.top-result-placeholder{width:100%;aspect-ratio:1;max-width:180px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.top-result-placeholder-circle{border-radius:50%}.top-result-placeholder-square{border-radius:8px}.top-result-name{font-size:1.5rem;font-weight:700;margin:0 0 .5rem;color:var(--text-primary);line-height:1.2}.top-result-meta{display:flex;align-items:center;gap:.375rem;margin:0 0 .5rem;font-size:.875rem;color:var(--text-secondary);flex-wrap:wrap}.top-result-explicit-tag{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;background:#fff3;border:1px solid rgba(255,255,255,.3);border-radius:2px;font-size:.75rem;font-weight:600;color:var(--text-secondary);flex-shrink:0}.top-result-type-label{text-transform:capitalize}.top-result-meta-separator{color:var(--text-secondary);opacity:.7}.top-result-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-result-type{font-size:.875rem;color:var(--text-secondary);margin:0;text-transform:capitalize}.search-songs-section{display:flex;flex-direction:column;height:100%}.search-songs-list{display:flex;flex-direction:column;gap:.5rem}.search-song-item{display:flex;align-items:center;gap:1rem;padding:.5rem;border-radius:4px;cursor:pointer;transition:background .2s}.search-song-item:hover{background:var(--bg-hover)}.search-song-image{width:56px;height:56px;flex-shrink:0;border-radius:4px;overflow:hidden;background:var(--bg-tertiary)}.search-song-image img{width:100%;height:100%;object-fit:cover}.search-song-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);background:var(--bg-tertiary)}.search-song-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.search-song-title{font-size:1rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-song-artist{font-size:.875rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-song-actions{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.search-song-heart-btn{background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:color .2s,transform .2s;flex-shrink:0}.search-song-heart-btn:hover{color:var(--accent);transform:scale(1.1)}.search-song-heart{color:currentColor;flex-shrink:0}.search-song-heart-btn .search-song-heart[fill=currentColor]{color:var(--accent)}.search-song-duration{font-size:.875rem;color:var(--text-secondary);min-width:40px;text-align:right}.search-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.search-section-title{font-size:1.5rem;font-weight:700;margin:0;color:var(--text-primary)}.search-show-more{background:none;border:none;color:var(--text-secondary);font-size:.875rem;font-weight:600;cursor:pointer;padding:.5rem;transition:color .2s;text-transform:uppercase;letter-spacing:.05em}.search-show-more:hover{color:var(--text-primary);text-decoration:underline}.search-section{margin-bottom:3rem}.search-artists-scroll{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;align-items:flex-start;overflow:visible;padding-bottom:.5rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.search-artists-scroll::-webkit-scrollbar{height:8px}.search-artists-scroll::-webkit-scrollbar-track{background:transparent}.search-artists-scroll::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.search-artists-scroll::-webkit-scrollbar-thumb:hover{background:#ffffff80}.search-artist-card{flex:0 1 180px;width:180px;text-decoration:none;color:inherit;text-align:center;transition:transform .2s}.search-artist-card:hover{transform:scale(1.05)}.search-artist-image-container{margin-bottom:1rem}.search-artist-image{width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;background:var(--bg-tertiary)}.search-artist-placeholder{width:100%;aspect-ratio:1;border-radius:50%;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.search-artist-name{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-artist-type{font-size:.875rem;color:var(--text-secondary);text-transform:capitalize}.search-albums-scroll{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;align-items:flex-start;overflow:visible;padding-bottom:.5rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.search-album-card{flex:0 1 180px;width:180px;text-decoration:none;color:inherit;transition:transform .2s}.search-albums-scroll::-webkit-scrollbar{height:8px}.search-albums-scroll::-webkit-scrollbar-track{background:transparent}.search-albums-scroll::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.search-albums-scroll::-webkit-scrollbar-thumb:hover{background:#ffffff80}.search-album-card:hover{transform:scale(1.05)}.search-album-image-container{margin-bottom:.75rem}.search-album-image{width:100%;aspect-ratio:1;border-radius:4px;object-fit:cover;background:var(--bg-tertiary)}.search-album-placeholder{width:100%;aspect-ratio:1;border-radius:4px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.search-album-title{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-album-meta{font-size:.875rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-full-width{width:100%}.search-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;color:var(--text-secondary)}.search-error{background:#e74c3c1a;border:1px solid var(--error);color:var(--error);padding:1rem;border-radius:8px}.search-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;color:var(--text-secondary);text-align:center}.search-empty h2{margin:1rem 0 .5rem;color:var(--text-primary)}.search-empty p{margin:0}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.3);border-top-color:var(--text-primary);border-radius:50%;animation:spin .8s linear infinite}@media(max-width:768px){.search-page{padding:1rem}.search-top-section{grid-template-columns:1fr;gap:2rem}.search-artist-card,.search-album-card{width:150px}.top-result-card{max-width:none;width:100%;align-items:flex-start}.top-result-image-container{width:100%}.top-result-image,.top-result-placeholder{max-width:100%;width:100%;aspect-ratio:16 / 9;border-radius:8px}.top-result-image.top-result-image-circle{border-radius:8px}}@media(max-width:600px){.search-page{padding:.5rem}.search-filters{padding:.75rem .5rem;gap:.5rem;overflow-x:auto}.search-filter-btn{padding:.5rem .875rem;font-size:.8125rem;white-space:nowrap}.search-top-section{gap:1.5rem;padding:0 .5rem}.search-top-result{padding:1rem}.search-top-result h3{font-size:1.125rem}.search-results-section{padding:0 .5rem}.search-results-section h2{font-size:1.25rem}.search-artist-card,.search-album-card{width:130px}.search-artists-grid,.search-albums-grid{gap:.75rem}}.library-page{padding:2rem;height:100%;overflow-y:auto}.library-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.library-title{font-size:2rem;font-weight:700;margin:0}.library-create-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s;min-width:44px;min-height:44px}.library-create-btn:hover{color:var(--text-primary);background:var(--bg-hover);transform:scale(1.05)}.library-filters{display:flex;gap:.5rem;margin-bottom:1.5rem;overflow-x:auto;padding-bottom:.5rem}.library-filters::-webkit-scrollbar{height:4px}.library-filters::-webkit-scrollbar-track{background:transparent}.library-filters::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.library-filter-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:20px;color:var(--text-secondary);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;font-family:inherit}.library-filter-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.library-filter-btn.active{background:var(--accent);color:var(--bg-primary);border-color:var(--accent)}.library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem}.library-item{display:flex;flex-direction:column;gap:.75rem;text-decoration:none;color:var(--text-primary);padding:1rem;border-radius:8px;transition:background .2s;cursor:pointer}.library-item:hover{background:var(--bg-hover)}.library-item-cover{position:relative;width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--bg-tertiary);flex-shrink:0}.library-item-cover .playlist-grid-cover{width:100%;height:100%;border-radius:0}.library-item-image{width:100%;height:100%;object-fit:cover}.library-item-image.artist-image{border-radius:50%}.library-item-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);background:var(--bg-tertiary)}.library-item-placeholder.artist-placeholder{border-radius:50%}.liked-songs-cover{background:linear-gradient(135deg,#450af5,#8e2de2);display:flex;align-items:center;justify-content:center;position:relative}.liked-songs-gradient{position:absolute;inset:0;background:linear-gradient(135deg,#450af5,#8e2de2,#c770f0)}.liked-songs-icon{position:relative;font-size:4rem;color:#fff;z-index:1}.library-item-info{display:flex;flex-direction:column;gap:.25rem;min-width:0}.library-item-title{font-size:.9375rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-item-subtitle{font-size:.8125rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-empty{display:flex;align-items:center;justify-content:center;padding:4rem 2rem;color:var(--text-secondary);font-size:1rem}@media(max-width:768px){.library-page{padding:1rem}.library-title{font-size:1.75rem}.library-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.library-item{padding:.75rem}}@media(max-width:600px){.library-page{padding:1rem .5rem}.library-title{font-size:1.5rem}.library-header{margin-bottom:1rem;padding:0 .5rem}.library-filters{padding:0 .5rem;margin-bottom:1rem}.library-filter-btn{padding:.5rem .875rem;font-size:.8125rem}.library-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;padding:0 .5rem}.library-item{padding:.5rem}.library-item-title{font-size:.875rem}.library-item-subtitle{font-size:.75rem}.liked-songs-icon{font-size:3rem}}.track-list{width:100%}.track-list-header{display:grid;gap:1rem;padding:.5rem 1rem;border-bottom:1px solid var(--border);color:var(--text-secondary);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em}.track-list.with-album .track-list-header{grid-template-columns:50px 1fr 1fr 80px 100px 120px}.track-list.without-album .track-list-header{grid-template-columns:50px 1fr 100px 120px}.track-row{display:grid;gap:1rem;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background .2s;align-items:center}.track-list.with-album .track-row{grid-template-columns:50px 1fr 1fr 80px 100px 120px}.track-list.without-album .track-row{grid-template-columns:50px 1fr 100px 120px}.track-row:hover{background:var(--bg-hover)}.track-row.playing{background:#ff6b351a}.track-col-num{text-align:center;color:var(--text-secondary);font-size:.875rem;position:relative;display:flex;align-items:center;justify-content:center}.track-number{display:block}.track-play-icon,.track-playing-icon,.track-icon{display:none}.track-play-icon.always-show,.track-icon.always-show{display:block;margin:0 auto}.track-row:hover .track-number{display:none}.track-row:hover .track-play-icon{display:block;margin:0 auto}.track-row.playing .track-number{display:none}.track-row.playing .track-playing-icon{display:block;margin:0 auto;color:var(--accent)}.track-col-title{display:flex;align-items:center;gap:.75rem;min-width:0}.track-cover,.track-cover-small{width:40px;height:40px;border-radius:4px;object-fit:cover;background:var(--bg-tertiary);flex-shrink:0}.track-info{display:flex;flex-direction:column;min-width:0}.track-name{font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-name.active{color:var(--accent)}.track-artist{font-size:.8125rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-artist-link{cursor:pointer;transition:color .2s}.track-artist-link:hover{color:var(--text-primary);text-decoration:underline}.track-col-album{font-size:.875rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-album-link{cursor:pointer;transition:color .2s}.track-album-link:hover{color:var(--text-primary);text-decoration:underline}.track-col-year{font-size:.875rem;color:var(--text-secondary);text-align:center}.track-col-duration{font-size:.875rem;color:var(--text-secondary);text-align:right}.track-col-actions{display:flex;align-items:center;gap:.25rem;opacity:0;transition:opacity .2s}.track-row:hover .track-col-actions{opacity:1}.track-action-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:color .2s;border-radius:4px}.track-action-btn:hover{color:var(--text-primary)}.track-action-btn.liked{color:var(--accent)}.track-action-btn:disabled{opacity:.6;cursor:not-allowed}.track-drag-handle{color:var(--text-secondary);cursor:grab;margin-right:.25rem;opacity:0;transition:opacity .2s}.track-row:hover .track-drag-handle{opacity:1}.track-row.dragging{opacity:.5;background:var(--bg-hover)}.track-row.drag-over{border-top:2px solid var(--accent)}.track-row[draggable=true]{cursor:grab}.track-row[draggable=true]:active{cursor:grabbing}.track-menu-container{position:relative}.track-menu{position:absolute;top:100%;right:0;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;min-width:200px;z-index:100;box-shadow:0 8px 24px #00000080}.track-menu-header{padding:.75rem 1rem;font-size:.75rem;color:var(--text-secondary);border-bottom:1px solid var(--border)}.track-menu-empty{padding:.75rem 1rem;font-size:.875rem;color:var(--text-secondary)}.track-menu-item{display:flex;align-items:center;gap:.5rem;width:100%;padding:.75rem 1rem;background:none;border:none;color:var(--text-primary);font-size:.875rem;cursor:pointer;text-align:left;transition:background .2s}.track-menu-item:hover{background:var(--bg-hover)}@media(max-width:900px){.track-list.with-album .track-list-header,.track-list.with-album .track-row,.track-list.without-album .track-list-header,.track-list.without-album .track-row{grid-template-columns:40px 1fr 80px 100px 100px}.track-col-album{display:none}}@media(max-width:600px){.track-list-header,.track-list.with-album .track-row,.track-list.without-album .track-row{grid-template-columns:1fr 80px}.track-row{padding:.75rem 1rem;min-height:56px}.track-col-num,.track-col-album,.track-col-year,.track-col-actions{display:none}.track-col-duration{text-align:right;width:80px;padding-left:.5rem;flex-shrink:0}.track-col-title{padding-right:.5rem;min-width:0}}.liked-page{padding:1rem 2rem 2rem}.liked-header{display:flex;gap:2rem;align-items:flex-end;margin-bottom:2rem;background:linear-gradient(135deg,#450af5,#8e8ee5 50%,var(--bg-primary));padding:3rem 2rem;margin:-1rem -2rem 2rem;border-radius:0 0 8px 8px}.liked-header-icon{width:232px;height:232px;background:linear-gradient(135deg,#450af5,#c4efd9);border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 8px 24px #00000080;flex-shrink:0}.liked-header-info{flex:1;min-width:0}.liked-type{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em}.liked-header-info h1{font-size:3rem;font-weight:800;margin:.5rem 0;line-height:1.1}.liked-header-info p{color:#fffc;margin:0 0 1.5rem}.liked-tracks{background:var(--bg-secondary);border-radius:8px;padding:1rem 0}.liked-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;color:var(--text-secondary);text-align:center}.liked-empty h2{margin:1rem 0 .5rem;color:var(--text-primary)}.liked-empty p{margin:0}@media(max-width:768px){.liked-page{padding:1rem}.liked-header{flex-direction:column;align-items:center;text-align:center;padding:2rem 1rem;margin:-1rem -1rem 2rem}.liked-header-icon{width:180px;height:180px}.liked-header-info h1{font-size:2rem}}@media(max-width:600px){.liked-page{padding:.5rem}.liked-header{padding:1.5rem .5rem;margin:-.5rem -.5rem 1.5rem}.liked-header-icon{width:150px;height:150px}.liked-header-info h1{font-size:1.5rem}.liked-header-info p{font-size:.875rem}.liked-actions{gap:.75rem}.play-btn{padding:.75rem 1.5rem;font-size:.875rem}}.playlist-page{padding:1rem 2rem 2rem}.playlist-error,.playlist-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;color:var(--text-secondary);text-align:center}.playlist-loading .spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.playlist-header{display:flex;gap:2rem;margin-bottom:2rem;align-items:flex-end}.playlist-cover{flex-shrink:0}.playlist-cover-image{width:232px;height:232px;border-radius:4px;object-fit:cover;box-shadow:0 8px 24px #00000080}.playlist-cover-placeholder{width:232px;height:232px;background:var(--bg-tertiary);border-radius:4px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);box-shadow:0 8px 24px #00000080}.playlist-type{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em}.playlist-title{font-size:3rem;font-weight:800;margin:.5rem 0;line-height:1.1}.playlist-meta{color:var(--text-secondary);font-size:.875rem;margin:0 0 1.5rem}.playlist-actions{display:flex;align-items:center;gap:1rem}.action-btn.delete:hover{color:var(--error);border-color:var(--error)}.action-btn.save:hover{color:var(--accent);border-color:var(--accent)}.action-btn.save:hover svg{fill:var(--accent)}.playlist-tracks{background:var(--bg-secondary);border-radius:8px;padding:1rem 0}.playlist-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;color:var(--text-secondary);text-align:center;background:var(--bg-secondary);border-radius:8px}.playlist-empty h2{margin:1rem 0 .5rem;color:var(--text-primary)}.playlist-empty p{margin:0 0 1.5rem}.search-link{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--accent);color:#000;text-decoration:none;font-weight:600;border-radius:500px;transition:transform .2s,background .2s}.search-link:hover{transform:scale(1.05);background:var(--accent-hover)}@media(max-width:768px){.playlist-page{padding:1rem}.playlist-header{flex-direction:column;align-items:center;text-align:center}.playlist-cover-image,.playlist-cover-placeholder{width:180px;height:180px}.playlist-title{font-size:2rem}.playlist-actions{justify-content:center}}@media(max-width:600px){.playlist-page{padding:.5rem}.playlist-header{gap:1rem;padding:1rem .5rem}.playlist-cover-image,.playlist-cover-placeholder{width:160px;height:160px}.playlist-title{font-size:1.5rem}.playlist-description{font-size:.875rem}.playlist-meta{font-size:.75rem}.playlist-actions{flex-wrap:wrap;gap:.75rem}.play-btn{padding:.75rem 1.5rem;font-size:.875rem}.action-btn{width:36px;height:36px}}.album-page{padding:1rem 2rem 2rem}.album-loading,.album-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;color:var(--text-secondary);text-align:center}.back-link{display:inline-flex;align-items:center;gap:.25rem;color:var(--text-secondary);text-decoration:none;font-size:.875rem;margin-bottom:1.5rem;transition:color .2s}.album-header{display:flex;gap:2rem;margin-bottom:2rem;align-items:flex-end}.album-cover-container{flex-shrink:0}.album-cover{width:240px;height:240px;border-radius:8px;object-fit:cover;background:var(--bg-secondary);box-shadow:0 8px 24px #00000080}.album-info{flex:1;min-width:0}.album-type{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em}.album-title{font-size:3rem;font-weight:800;margin:.5rem 0;line-height:1.1;overflow:hidden;text-overflow:ellipsis}.album-meta{color:var(--text-secondary);font-size:.875rem;margin-bottom:1.5rem}.artist-link{color:var(--text-primary);text-decoration:none;font-weight:600}.artist-link:hover{text-decoration:underline}.meta-separator{margin:0 .5rem}.album-actions{display:flex;align-items:center;gap:1rem}.play-btn{display:flex;align-items:center;justify-content:center;text-align:center;width:100%;max-width:fit-content;gap:.5rem;padding:.875rem 2rem;background:var(--accent);border:none;border-radius:500px;color:#000;font-weight:700;font-size:.9375rem;cursor:pointer;transition:transform .2s,background .2s}.action-btn:disabled{opacity:.6;cursor:not-allowed}.action-btn:disabled:hover{transform:none}.action-btn.saved{color:var(--accent);border-color:var(--accent)}.album-tracks{background:var(--bg-secondary);border-radius:8px;padding:1rem 0}@media(max-width:768px){.album-page{padding:1rem}.album-header{flex-direction:column;align-items:center;text-align:center}.album-cover{width:200px;height:200px}.album-title{font-size:2rem}.album-actions{justify-content:center}}@media(max-width:600px){.album-page{padding:.5rem}.album-header{gap:1rem;padding:1rem .5rem}.album-cover{width:180px;height:180px}.album-title{font-size:1.5rem}.album-artist{font-size:.875rem}.album-meta{font-size:.75rem}.album-actions{flex-wrap:wrap;gap:.75rem}.play-btn{padding:.75rem 1.5rem;font-size:.875rem}.action-btn{width:36px;height:36px}}.artist-page{padding:0;min-height:100vh;position:relative}.artist-loading,.artist-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;color:var(--text-secondary);text-align:center}.artist-hero{position:relative;min-height:340px;display:flex;align-items:flex-end;padding:0 2rem 2rem;margin-bottom:0;transition:background .3s ease;background-color:var(--bg-tertiary)}.artist-hero-content{position:relative;z-index:1;width:100%;max-width:100%;display:flex;align-items:flex-end;gap:2rem}.artist-hero-image-container{flex-shrink:0}.artist-hero-image{width:232px;height:232px;border-radius:8px;object-fit:cover;box-shadow:0 8px 32px #00000080;background:var(--bg-tertiary)}.artist-hero-image-placeholder{width:232px;height:232px;border-radius:8px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);box-shadow:0 8px 32px #00000080}.artist-hero-info{display:flex;flex-direction:column;gap:1.5rem;flex:1;padding-bottom:.5rem}.artist-name{font-size:5.5rem;font-weight:900;margin:0;line-height:1;letter-spacing:-.04em;color:var(--text-primary)}.artist-hero-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.artist-play-btn{width:56px;height:56px;background:var(--accent);border:none;border-radius:50%;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s,background .2s;flex-shrink:0;box-shadow:0 8px 24px #00000080}.artist-play-btn:hover{transform:scale(1.05);background:var(--accent-hover)}.artist-follow-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;background:transparent;border:1px solid rgba(255,255,255,.3);border-radius:500px;color:var(--text-primary);font-weight:700;font-size:.875rem;cursor:pointer;transition:all .2s;min-width:120px}.artist-follow-btn:hover{border-color:var(--text-primary);transform:scale(1.05)}.artist-follow-btn.followed{background:#ffffff1a;border-color:#ffffff4d}.artist-follow-btn.followed:hover{border-color:#ffffff80;background:#ffffff26}.artist-content{padding:2rem;background:var(--bg-primary)}.artist-section{margin-bottom:3rem}.section-title{font-size:1.5rem;font-weight:700;margin:0 0 1.5rem;color:var(--text-primary);letter-spacing:-.02em}.artist-show-more-btn{background:none;border:none;color:var(--text-secondary);font-size:.875rem;font-weight:600;cursor:pointer;padding:.5rem 0;margin-top:1rem;transition:color .2s;text-transform:none;font-family:inherit}.artist-show-more-btn:hover{color:var(--text-primary);text-decoration:underline}.discography-section{margin-top:2rem}.discography-header{margin-bottom:1.5rem}.discography-header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.discography-show-all{background:none;border:none;color:var(--text-primary);font-size:.875rem;font-weight:600;cursor:pointer;padding:.5rem;transition:color .2s,text-decoration .2s;font-family:inherit}.discography-show-all:hover{text-decoration:underline}.discography-filters{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem}.discography-filter-tab{background:#ffffff1a;border:none;color:var(--text-primary);font-size:.9375rem;font-weight:600;cursor:pointer;padding:.5rem 1rem;border-radius:4px;transition:all .2s;font-family:inherit;position:relative}.discography-filter-tab:hover{background:#ffffff26}.discography-filter-tab.active{background:var(--text-primary);color:var(--bg-primary)}.album-grid{display:flex;gap:1.5rem;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.album-grid::-webkit-scrollbar{height:8px}.album-grid::-webkit-scrollbar-track{background:transparent}.album-grid::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.album-grid::-webkit-scrollbar-thumb:hover{background:#ffffff80}.album-card{background:transparent;padding:0;text-decoration:none;color:inherit;transition:transform .2s;cursor:pointer;flex-shrink:0;width:180px}.album-card:hover{transform:translateY(-4px)}.album-card-cover{position:relative;margin-bottom:1rem;background:var(--bg-tertiary);border-radius:8px;overflow:hidden;aspect-ratio:1}.album-card-image{width:100%;height:100%;object-fit:cover;background:var(--bg-tertiary)}.album-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);background:var(--bg-tertiary)}.album-play-btn{position:absolute;bottom:12px;right:12px;width:48px;height:48px;background:var(--accent);border:none;border-radius:50%;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s,background .2s;box-shadow:0 8px 16px #0006;z-index:2}.album-card:hover .album-play-btn{opacity:1;transform:translateY(0)}.album-play-btn:hover{transform:translateY(0) scale(1.1);background:var(--accent-hover)}.album-play-btn.playing{opacity:1;transform:translateY(0)}.album-card-title{font-size:1rem;font-weight:600;margin:0 0 .375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary)}.album-card-year{font-size:.875rem;color:var(--text-secondary);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.artist-page .back-link{position:absolute;top:1rem;left:1rem;z-index:10;background:none;padding:.5rem 1rem;border:none}.artist-page .back-link:hover{color:var(--text-primary)}@media(max-width:1024px){.album-grid{gap:1.25rem}.album-card{width:160px}}@media(max-width:768px){.artist-hero{min-height:280px;padding:0 1.5rem 1.5rem}.artist-hero-content{gap:1.5rem}.artist-hero-image,.artist-hero-image-placeholder{width:180px;height:180px}.artist-name{font-size:3.5rem}.artist-play-btn{width:48px;height:48px}.artist-follow-btn{padding:.5rem .875rem;font-size:.8125rem;min-width:100px}.artist-content{padding:1.5rem}.artist-section{margin-bottom:2rem}.album-grid{gap:1rem}.album-card{width:140px}.discography-filters{flex-wrap:wrap;gap:.375rem}.discography-filter-tab{font-size:.875rem;padding:.4375rem .875rem}.artist-page .back-link{top:.75rem;left:.75rem;padding:.375rem .75rem;font-size:.8125rem}}@media(max-width:600px){.artist-hero{min-height:260px;padding:0 1rem 1rem}.artist-hero-content{flex-direction:column;align-items:center;gap:1.5rem}.artist-hero-info{align-items:center;text-align:center}.artist-hero-image,.artist-hero-image-placeholder{width:160px;height:160px}.artist-name{font-size:2rem}.artist-hero-actions{gap:.75rem;justify-content:center}.artist-play-btn{width:48px;height:48px}.artist-follow-btn{padding:.5rem 1rem;font-size:.8125rem}.artist-content{padding:1rem .5rem}.section-title{font-size:1.25rem;margin-bottom:1rem}.album-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}}@media(max-width:480px){.artist-hero{min-height:240px;padding:0 1rem 1rem}.artist-hero-content{flex-direction:column;align-items:center;gap:1.5rem}.artist-hero-info{align-items:center;text-align:center}.artist-hero-image,.artist-hero-image-placeholder{width:150px;height:150px}.artist-name{font-size:2.5rem}.artist-hero-actions{gap:.75rem;justify-content:center}.artist-play-btn{width:44px;height:44px}.artist-follow-btn{padding:.4375rem .75rem;font-size:.75rem;min-width:90px}.artist-content{padding:1rem}.section-title{font-size:1.25rem;margin-bottom:1rem}.album-grid{gap:.875rem}.album-card{width:120px}.album-card-title{font-size:.9375rem}.album-card-year{font-size:.8125rem}.discography-filters{gap:.25rem}.discography-filter-tab{font-size:.8125rem;padding:.375rem .75rem}}.spotify-import{display:flex;flex-direction:column;gap:1rem}.spotify-error{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#ef44441a;color:#ef4444;border-radius:8px;font-size:.875rem}.spotify-auth-step,.spotify-source-step,.spotify-playlist-step,.spotify-importing-step,.spotify-complete-step,.spotify-manual-match-step{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem;text-align:center}.spotify-icon-container{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:#1db954;border-radius:50%;margin-bottom:1rem}.spotify-logo{width:48px;height:48px;color:#fff}.spotify-auth-step h3,.spotify-source-step h3,.spotify-playlist-step h3,.spotify-importing-step h3,.spotify-complete-step h3,.spotify-manual-match-step h3{margin:0;font-size:1.5rem;color:var(--text-primary)}.spotify-auth-step p,.spotify-source-step p,.spotify-playlist-step p{margin:0;color:var(--text-secondary)}.spotify-login-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 2rem;background:#1db954;color:#fff;border:none;border-radius:24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;margin-top:1rem}.spotify-login-btn:hover:not(:disabled){background:#1ed760;transform:scale(1.05)}.spotify-login-btn:disabled{opacity:.6;cursor:not-allowed}.spotify-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem}.spotify-loading p{color:var(--text-secondary)}.spotify-playlists-list{display:flex;flex-direction:column;gap:.5rem;width:100%;max-height:400px;overflow-y:auto;padding:1rem 0}.spotify-playlist-item{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;text-align:left}.spotify-playlist-item:hover{background:var(--bg-hover)}.spotify-playlist-item.selected{border-color:var(--accent);background:#ff70001a}.playlist-image{width:48px;height:48px;border-radius:4px;object-fit:cover;flex-shrink:0}.playlist-info{flex:1;min-width:0}.playlist-name{font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-meta{font-size:.875rem;color:var(--text-secondary);margin-top:.25rem}.check-icon{color:var(--accent);flex-shrink:0}.spotify-actions{display:flex;gap:1rem;margin-top:1rem}.import-btn,.secondary-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border:none;border-radius:24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.import-btn{background:var(--accent);color:#fff}.import-btn:hover:not(:disabled){background:var(--accent-hover);transform:scale(1.05)}.import-btn:disabled{opacity:.5;cursor:not-allowed}.secondary-btn{background:var(--bg-secondary);color:var(--text-primary)}.secondary-btn:hover{background:var(--bg-hover)}.import-progress{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:400px;padding:2rem}.progress-text{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0}.current-track{font-size:.875rem;color:var(--text-secondary);margin:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress-bar{width:100%;height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);transition:width .3s ease}.success-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:#10b9811a;border-radius:50%;color:#10b981;margin-bottom:1rem}.result-summary{font-size:1rem;color:var(--text-secondary);margin:0}.result-summary strong{color:var(--text-primary)}.failed-tracks{width:100%;max-width:500px;margin-top:1.5rem;padding:1rem;background:#ef44440d;border:1px solid rgba(239,68,68,.2);border-radius:8px}.failed-header{display:flex;align-items:center;gap:.5rem;margin:0 0 .75rem;font-weight:600;color:#ef4444;font-size:.875rem}.failed-tracks-list{display:flex;flex-direction:column;gap:.5rem;max-height:200px;overflow-y:auto}.failed-track-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:var(--bg-secondary);border-radius:4px;font-size:.875rem;color:var(--text-secondary)}.failed-track-item svg{color:#ef4444;flex-shrink:0}.failed-more{margin:.5rem 0 0;font-size:.875rem;color:var(--text-secondary);font-style:italic}.match-failed-btn{margin-top:1rem}.spotify-manual-match-step{max-width:600px;width:100%}.match-info{margin:0;color:var(--text-secondary);font-size:.875rem}.track-to-match{width:100%;padding:1rem;background:var(--bg-secondary);border-radius:8px;margin:1rem 0}.track-to-match h4{margin:0 0 .5rem;font-size:.875rem;color:var(--text-secondary);text-transform:uppercase;font-weight:600}.track-name{margin:0 0 .25rem;font-size:1.125rem;font-weight:600;color:var(--text-primary)}.track-artist{margin:0;font-size:.875rem;color:var(--text-secondary)}.track-reason{margin:.5rem 0 0;font-size:.75rem;color:#f59e0b;display:flex;align-items:center;gap:.25rem}.suggested-match{width:100%;margin:1rem 0;padding:1rem;background:#ff70001a;border:2px solid rgba(255,112,0,.3);border-radius:8px}.suggested-match h4{margin:0 0 .75rem;font-size:.875rem;color:var(--accent);text-transform:uppercase;font-weight:600}.result-item.suggested{background:var(--bg-primary);border:2px solid var(--accent)}.result-item.suggested:hover{background:var(--bg-hover);border-color:var(--accent-hover)}.search-section{width:100%;margin:1rem 0}.search-section h4{margin:0 0 .75rem;font-size:.875rem;color:var(--text-secondary);text-transform:uppercase;font-weight:600}.search-form{display:flex;gap:.5rem;width:100%}.search-input{flex:1;padding:.75rem 1rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:24px;font-size:1rem;color:var(--text-primary);outline:none;transition:all .2s}.search-input:focus{border-color:var(--accent);background:var(--bg-hover)}.search-input:disabled{opacity:.6;cursor:not-allowed}.search-input::placeholder{color:var(--text-tertiary)}.search-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--accent);color:#fff;border:none;border-radius:24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.search-btn:hover:not(:disabled){background:var(--accent-hover);transform:scale(1.05)}.search-btn:disabled{opacity:.6;cursor:not-allowed}.search-results{width:100%;margin-top:1rem}.search-results h4{margin:0 0 .75rem;font-size:.875rem;color:var(--text-secondary);text-align:left}.results-overflow{margin:.5rem 0 0;font-size:.75rem;color:var(--text-secondary);font-style:italic;text-align:center}.results-list{display:flex;flex-direction:column;gap:.5rem;max-height:400px;overflow-y:auto}.result-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;text-align:left}.result-item:hover{background:var(--bg-hover);border-color:var(--accent)}.result-info{flex:1;min-width:0}.result-name{font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-artist{font-size:.875rem;color:var(--text-secondary);margin-top:.25rem}.result-album{font-size:.75rem;color:var(--text-tertiary);margin-top:.25rem}.result-item .check-icon{opacity:0;transition:opacity .2s}.result-item:hover .check-icon{opacity:1}.no-results{margin:1rem 0;color:var(--text-secondary);font-size:.875rem}.source-options{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:500px;margin:1rem 0}.source-option-btn{display:flex;align-items:center;gap:1rem;padding:1.5rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:12px;cursor:pointer;transition:all .2s;text-align:left}.source-option-btn:hover:not(:disabled){background:var(--bg-hover);border-color:var(--accent);transform:translateY(-2px)}.source-option-btn:disabled{opacity:.6;cursor:not-allowed}.source-option-btn svg{color:var(--accent);flex-shrink:0}.option-text{flex:1}.option-title{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin-bottom:.25rem;display:flex;align-items:center;gap:.5rem}.coming-soon-badge{display:inline-flex;align-items:center;padding:.125rem .5rem;background:#ff700026;color:var(--accent);font-size:.75rem;font-weight:600;border-radius:12px;text-transform:uppercase;letter-spacing:.5px}.option-description{font-size:.875rem;color:var(--text-secondary)}.search-container{width:100%;margin-bottom:1rem}.search-container .search-input{width:100%;padding:.75rem 1rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:24px;font-size:1rem;color:var(--text-primary);outline:none;transition:all .2s}.search-container .search-input:focus{border-color:var(--accent);background:var(--bg-hover)}.search-container .search-input::placeholder{color:var(--text-tertiary)}.loading-more-trigger{padding:1rem;display:flex;justify-content:center;align-items:center}.loading-more{display:flex;flex-direction:column;align-items:center;gap:.5rem}.loading-more p{margin:0;color:var(--text-secondary);font-size:.875rem}.backup-manager{margin-top:1.5rem}.backup-manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.backup-manager-header h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin:0}.backup-counts{font-size:.85rem;color:var(--text-secondary);margin:.25rem 0 0}.backup-header-actions{display:flex;gap:.5rem}.create-backup-btn,.refresh-backups-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-size:.9rem;cursor:pointer;transition:all .2s ease}.create-backup-btn{background:var(--accent);color:#fff;border-color:var(--accent)}.create-backup-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px)}.refresh-backups-btn:hover:not(:disabled){background:var(--hover-bg);border-color:var(--accent)}.create-backup-btn:disabled,.refresh-backups-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.backup-manager-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem;color:var(--text-secondary)}.backup-error{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:.9rem;margin-bottom:1rem}.backup-success{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#10b9811a;border:1px solid rgba(16,185,129,.3);border-radius:8px;color:#10b981;font-size:.9rem;margin-bottom:1rem}.no-backups{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:3rem 2rem;color:var(--text-secondary);text-align:center}.no-backups svg{opacity:.5}.no-backups p{margin:0}.no-backups-desc{font-size:.85rem;max-width:400px;line-height:1.5}.backup-list{display:flex;flex-direction:column;gap:.75rem}.backup-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;transition:all .2s ease}.backup-item:hover{border-color:var(--accent);background:var(--hover-bg)}.backup-info{flex:1;display:flex;flex-direction:column;gap:.5rem}.backup-reason{font-size:.95rem;font-weight:500;color:var(--text-primary)}.backup-meta{display:flex;flex-wrap:wrap;gap:1rem;font-size:.85rem;color:var(--text-secondary)}.backup-created,.backup-expires{display:flex;align-items:center;gap:.25rem}.backup-expires{color:var(--accent)}.backup-actions{display:flex;gap:.5rem}.restore-btn,.delete-backup-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:6px;font-size:.9rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.restore-btn{background:var(--accent);color:#fff}.restore-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px)}.restore-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.delete-backup-btn{background:transparent;border-color:var(--border-color);color:var(--text-secondary);padding:.5rem .75rem}.delete-backup-btn:hover:not(:disabled){background:#ef44441a;border-color:#ef4444;color:#ef4444}.delete-backup-btn:disabled{opacity:.5;cursor:not-allowed}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:768px){.backup-item{flex-direction:column;align-items:flex-start;gap:1rem}.backup-actions{width:100%;justify-content:stretch}.restore-btn,.delete-backup-btn{flex:1}.backup-meta{flex-direction:column;gap:.5rem}}.settings-page{padding:1rem 2rem 2rem;max-width:1400px;width:100%;margin:0 auto}.settings-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.settings-header h1{font-size:2rem;font-weight:800;margin:0}.settings-section{background:var(--bg-secondary);border-radius:8px;padding:1.5rem;margin-bottom:1.5rem}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem}@media(max-width:1200px){.settings-grid{grid-template-columns:1fr}}.section-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.section-header h2{font-size:1.25rem;font-weight:700;margin:0}.section-description{color:var(--text-secondary);font-size:.875rem;margin:0 0 1.5rem;line-height:1.6}.auto-select-toggle{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border)}.toggle-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;font-weight:500}.toggle-label input{display:none}.toggle-switch{width:44px;height:24px;background:var(--bg-hover);border-radius:12px;position:relative;transition:background .2s}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .2s}.toggle-label input:checked+.toggle-switch{background:var(--accent)}.toggle-label input:checked+.toggle-switch:after{transform:translate(20px)}.toggle-description{color:var(--text-secondary);font-size:.8125rem;margin:.5rem 0 0 52px}.speed-test-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.speed-test-header h3{font-size:1rem;font-weight:600;margin:0}.test-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--bg-hover);border:1px solid var(--border);border-radius:500px;color:var(--text-primary);font-weight:500;cursor:pointer;transition:all .2s}.test-btn:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--text-secondary)}.test-btn:disabled{opacity:.6;cursor:not-allowed}.spin{animation:spin 1s linear infinite}.server-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:.75rem}@media(max-width:900px){.server-list{grid-template-columns:1fr}}.server-item{display:flex;align-items:center;justify-content:space-between;padding:1rem;background:var(--bg-tertiary);border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;text-align:left;width:100%}.server-item:hover{background:var(--bg-hover)}.server-item.selected{border-color:var(--accent);background:#ff6b351a}.server-info{flex:1;min-width:0}.server-name{font-weight:600;display:flex;align-items:center;gap:.75rem}.server-url{font-size:.8125rem;color:var(--text-secondary);margin-top:.25rem;overflow:hidden;text-overflow:ellipsis}.fastest-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:var(--accent);color:#000;font-size:.6875rem;font-weight:700;border-radius:500px;text-transform:uppercase}.server-status{display:flex;align-items:center;gap:1rem}.latency{font-weight:700;font-size:.9375rem;min-width:60px;text-align:right}.error-status{display:flex;align-items:center;gap:.25rem;color:var(--error);font-size:.875rem}.no-result{color:var(--text-secondary);font-size:.875rem}.testing-indicator{color:var(--text-secondary)}.selected-indicator{width:24px;height:24px;background:var(--accent);color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center}@media(max-width:768px){.settings-page{padding:1rem}.speed-test-header{flex-direction:column;align-items:flex-start;gap:1rem}.server-item{flex-direction:column;align-items:flex-start;gap:.75rem}.server-status{width:100%;justify-content:space-between}}.quality-options{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}@media(max-width:768px){.quality-options{grid-template-columns:1fr}}.quality-option{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:all .2s ease}.quality-option:hover{border-color:var(--accent);background:var(--bg-hover)}.quality-option input[type=radio]{margin-top:.125rem;accent-color:var(--accent)}.quality-info{flex:1}.quality-label{font-weight:600;margin-bottom:.25rem}.quality-desc{font-size:.875rem;color:var(--text-secondary)}.data-actions{display:flex;gap:1rem;flex-wrap:wrap}.data-action-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:1px solid var(--border);border-radius:500px;background:var(--bg-tertiary);color:var(--text-primary);font-weight:500;cursor:pointer;transition:all .2s;font-size:.9375rem}.data-action-btn:hover{background:var(--bg-hover);border-color:var(--accent)}.data-action-btn.export-btn{background:var(--accent);color:#000;border-color:var(--accent)}.data-action-btn.export-btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.data-action-btn.import-btn{cursor:pointer}.import-message{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-radius:6px;margin-bottom:1rem;font-size:.875rem;font-weight:500}.import-message.success{background:#ff6b351a;color:var(--accent);border:1px solid rgba(255,107,53,.2)}.import-message.error{background:#ef44441a;color:var(--error);border:1px solid rgba(239,68,68,.2)}.import-success-content{display:flex;flex-direction:column;gap:.5rem}.reload-prompt{display:flex;align-items:center;gap:.75rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,107,53,.2);font-size:.8125rem}.reload-btn{padding:.375rem .75rem;background:var(--accent);color:#000;border:none;border-radius:500px;font-weight:600;font-size:.8125rem;cursor:pointer;transition:background .2s}.reload-btn:hover{background:var(--accent-hover)}@media(max-width:768px){.data-actions{flex-direction:column}.data-action-btn{width:100%;justify-content:center}}.account-actions{display:flex;gap:1rem;flex-wrap:wrap}.login-btn,.signup-btn,.logout-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:1px solid var(--border);border-radius:500px;font-weight:500;cursor:pointer;transition:all .2s;font-size:.9375rem}.login-btn{background:var(--accent);color:#000;border-color:var(--accent)}.login-btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.signup-btn{background:var(--bg-tertiary);color:var(--text-primary)}.signup-btn:hover{background:var(--bg-hover);border-color:var(--accent)}.logout-btn{background:var(--bg-tertiary);color:var(--text-primary)}.logout-btn:hover{background:var(--bg-hover);border-color:var(--error);color:var(--error)}.sync-status-container{display:flex;flex-direction:column;gap:1.5rem}.sync-status{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:8px}.sync-status-indicator{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.sync-status-text{flex:1}.sync-status-label{font-weight:600;margin-bottom:.25rem}.sync-status-time{font-size:.8125rem;color:var(--text-secondary)}.cloud-actions{display:flex;gap:1rem;flex-wrap:wrap}.sync-btn,.delete-cloud-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:1px solid var(--border);border-radius:500px;font-weight:500;cursor:pointer;transition:all .2s;font-size:.9375rem}.sync-btn{background:var(--accent);color:#000;border-color:var(--accent)}.sync-btn:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.sync-btn:disabled{opacity:.6;cursor:not-allowed}.delete-cloud-btn{background:var(--bg-tertiary);color:var(--text-primary)}.delete-cloud-btn:hover{background:var(--bg-hover);border-color:var(--error);color:var(--error)}.delete-dialog-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.delete-dialog{background:var(--bg-secondary);border-radius:12px;padding:2rem;max-width:500px;width:100%;box-shadow:0 20px 25px -5px #00000080}.delete-dialog h3{font-size:1.5rem;margin:0 0 1rem}.delete-dialog p{color:var(--text-secondary);margin:.75rem 0;line-height:1.6}.delete-dialog ul{margin:1rem 0;padding-left:1.5rem;color:var(--text-secondary)}.delete-dialog ul li{margin:.5rem 0}.delete-dialog-actions{display:flex;gap:1rem;margin-top:1.5rem}.cancel-btn,.confirm-delete-btn{flex:1;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s}.cancel-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border)}.cancel-btn:hover:not(:disabled){background:var(--bg-hover)}.cancel-btn:disabled{opacity:.6;cursor:not-allowed}.confirm-delete-btn{background:var(--error);color:#fff;border:1px solid var(--error)}.confirm-delete-btn:hover:not(:disabled){background:#dc2626}.confirm-delete-btn:disabled{opacity:.6;cursor:not-allowed}@media(max-width:768px){.account-actions,.cloud-actions{flex-direction:column}.login-btn,.signup-btn,.logout-btn,.sync-btn,.delete-cloud-btn{width:100%;justify-content:center}.delete-dialog-actions{flex-direction:column}}.spotify-icon-header{color:#1db954}.spotify-import-actions{display:flex;gap:1rem;margin-top:1rem}.spotify-import-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#1db954;color:#fff;border:none;border-radius:24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.spotify-import-btn:hover{background:#1ed760;transform:scale(1.05)}.spotify-import-btn svg{fill:#fff}.spotify-import-container{margin-top:1rem;padding:1rem;background:var(--bg-primary);border-radius:8px}.close-spotify-btn{width:100%;padding:.75rem;margin-top:1rem;background:var(--bg-secondary);color:var(--text-primary);border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:all .2s}.close-spotify-btn:hover{background:var(--bg-hover)}.profile-preferences{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}@media(max-width:768px){.profile-preferences{grid-template-columns:1fr}.settings-page{padding:1rem}.settings-header h1{font-size:1.75rem}.settings-section{padding:1.5rem}}@media(max-width:600px){.settings-page{padding:.5rem}.settings-header{padding:1rem .5rem}.settings-header h1{font-size:1.5rem}.settings-section{padding:1rem;margin-bottom:1rem}.section-header h2{font-size:1.125rem}.section-header p{font-size:.8125rem}.quality-options{gap:.75rem}.quality-option{padding:1rem .875rem}.server-list{gap:.75rem}.server-item{padding:1rem}.action-buttons{gap:.75rem}.btn{padding:.75rem 1rem;font-size:.875rem}}.preference-field{display:flex;flex-direction:column;gap:.5rem}.preference-label{font-weight:600;font-size:.9375rem;color:var(--text-primary)}.preference-select{padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-size:.9375rem;font-family:inherit;cursor:pointer;transition:all .2s}.preference-select:hover{border-color:var(--accent);background:var(--bg-hover)}.preference-select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #ff6b351a}.preference-select option{background:var(--bg-secondary);color:var(--text-primary)}.auth-form{width:100%;max-width:400px;display:flex;flex-direction:column;gap:1.5rem}.auth-form-group{display:flex;flex-direction:column;gap:.5rem}.auth-form-group label{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:500;color:var(--text-primary)}.auth-form-group input{padding:.75rem 1rem;font-size:1rem;border:1px solid var(--border);border-radius:8px;background:var(--background-secondary);color:var(--text-primary);transition:border-color .2s}.auth-form-group input:focus{outline:none;border-color:var(--accent)}.auth-form-group input:disabled{opacity:.5;cursor:not-allowed}.auth-error{padding:.75rem 1rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:.9rem}.auth-submit-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;font-size:1rem;font-weight:600;color:#fff;background:var(--accent);border:none;border-radius:8px;cursor:pointer;transition:all .2s}.auth-submit-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px)}.auth-submit-btn:active:not(:disabled){transform:translateY(0)}.auth-submit-btn:disabled{opacity:.6;cursor:not-allowed}.auth-footer{text-align:center;color:var(--text-secondary);font-size:.9rem}.auth-footer a{color:var(--accent);text-decoration:none;font-weight:500}.auth-footer a:hover{text-decoration:underline}.oauth-divider{display:flex;align-items:center;gap:1rem;margin:1rem 0;color:var(--text-secondary);font-size:.9rem}.oauth-divider:before,.oauth-divider:after{content:"";flex:1;height:1px;background:var(--border)}.oauth-buttons{display:flex;flex-direction:column;gap:.75rem}.oauth-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.75rem 1rem;font-size:.95rem;font-weight:500;color:var(--text-primary);background:var(--background-secondary);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .2s}.oauth-btn:hover:not(:disabled){background:var(--background-hover);border-color:var(--accent)}.oauth-btn:disabled{opacity:.5;cursor:not-allowed}.auth-page{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem;background:var(--background-primary)}.auth-container{width:100%;max-width:450px;display:flex;flex-direction:column;gap:2rem}.auth-header{text-align:center}.auth-header h1{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:.5rem}.auth-header p{font-size:1rem;color:var(--text-secondary)}:root{--bg-primary: #0a0a0a;--bg-secondary: #141414;--bg-tertiary: #1e1e1e;--bg-hover: #282828;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent: #FF6B35;--accent-hover: #FF8C42;--border: #282828;--error: #e74c3c;--sidebar-width: 240px;--right-sidebar-width: 320px;--top-nav-height: 64px;--mobile-player-height: 64px;--mobile-bottom-nav-height: 64px}.app{display:grid;grid-template-columns:var(--sidebar-width, 240px) 1fr;grid-template-rows:64px 1fr 90px;height:100vh;background:var(--bg-primary);color:var(--text-primary)}.app.with-right-sidebar{grid-template-columns:var(--sidebar-width, 240px) 1fr var(--right-sidebar-width, 320px)}.top-nav{grid-column:1 / -1;grid-row:1}.main-content{overflow-y:auto;background:linear-gradient(180deg,var(--bg-tertiary) 0%,var(--bg-primary) 300px)}.main-content{scrollbar-gutter:stable both-edges;scrollbar-width:none;-ms-overflow-style:none}.main-content::-webkit-scrollbar{width:0px;height:0px;display:none}.main-content::-webkit-scrollbar-track{background:transparent}.main-content::-webkit-scrollbar-thumb{background:transparent}.library-page{scrollbar-width:none;-ms-overflow-style:none}.library-page::-webkit-scrollbar{display:none;width:0;height:0}.back-link{display:inline-flex;align-items:center;gap:.25rem;color:var(--text-secondary);text-decoration:none;font-size:.875rem;margin-bottom:1.5rem;transition:color .2s;background:none;border:none;cursor:pointer;padding:0;font-family:inherit}.back-link:hover{color:var(--text-primary)}.play-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 2rem;background:var(--accent);border:none;border-radius:500px;color:#000;font-weight:700;font-size:.9375rem;cursor:pointer;transition:transform .2s,background .2s}.play-btn:hover{transform:scale(1.05);background:var(--accent-hover)}.action-btn{width:40px;height:40px;background:none;border:1px solid var(--text-secondary);border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.action-btn:hover{color:var(--text-primary);border-color:var(--text-primary);transform:scale(1.05)}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.create-playlist-dialog{border:none;border-radius:8px;padding:0;background:var(--bg-secondary);color:var(--text-primary);max-width:400px;width:90vw;box-shadow:0 8px 32px #00000080;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0}.create-playlist-dialog::backdrop{background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dialog-content{padding:1.5rem}.dialog-content form{display:flex;flex-direction:column}.dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.dialog-header h2{font-size:1.5rem;font-weight:700;margin:0}.dialog-close{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-close:hover{background:var(--bg-hover);color:var(--text-primary)}.dialog-field{margin-bottom:1rem}.dialog-field label{display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.dialog-field input{width:100%;padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-size:.9375rem;font-family:inherit;transition:border-color .2s}.dialog-field input:focus{outline:none;border-color:var(--accent)}.dialog-field textarea{width:100%;padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-size:.9375rem;font-family:inherit;transition:border-color .2s;resize:vertical;min-height:80px}.dialog-field textarea:focus{outline:none;border-color:var(--accent)}.dialog-actions{display:flex;gap:.75rem;justify-content:flex-end;margin-top:2rem}.dialog-cancel,.dialog-submit{padding:.75rem 1.5rem;border-radius:500px;font-weight:600;font-size:.9375rem;cursor:pointer;transition:all .2s;border:none}.dialog-cancel{background:transparent;color:var(--text-secondary)}.dialog-cancel:hover{color:var(--text-primary);background:var(--bg-hover)}.dialog-submit{background:var(--accent);color:#000}.dialog-submit:hover{background:var(--accent-hover);transform:scale(1.05)}.dialog-submit:disabled{opacity:.5;cursor:not-allowed;transform:none}@media(max-width:1200px){.app.with-right-sidebar{grid-template-columns:var(--sidebar-width, 240px) 1fr var(--right-sidebar-width, 280px)}}@media(max-width:900px){.app,.app.with-right-sidebar{grid-template-columns:80px 1fr;grid-template-rows:64px 1fr 90px}.sidebar-resize-handle{display:none}}@media(max-width:600px){.app{grid-template-columns:1fr;grid-template-rows:var(--top-nav-height) 1fr auto auto;padding-bottom:0;height:100vh;overflow:hidden}.app.with-right-sidebar{grid-template-columns:1fr;grid-template-rows:var(--top-nav-height) 1fr auto auto;padding-bottom:0}.sidebar{display:none}.main-content{overflow-y:auto;overflow-x:hidden}}