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