:root{--font-main: "Noto Sans SC", "Segoe UI", Arial, sans-serif;--bg-gradient: linear-gradient(140deg, #e0f5e9 0%, #c6f0e0 35%, #a3e4d7 100%);--bg-gradient-next: var(--bg-gradient);--container-bg: rgba(255, 255, 255, .6);--container-shadow: rgba(0, 0, 0, .1);--backdrop-blur: 12px;--text-color: #2c3e50;--text-secondary-color: #7f8c8d;--primary-color: #1abc9c;--primary-color-dark: #12836d;--warning-color: #e74c3c;--success-color: #2ecc71;--success-color-hover: #27ae60;--item-hover-bg: rgba(26, 188, 156, .1);--item-current-bg: rgba(26, 188, 156, .2);--item-current-text: var(--primary-color);--border-color: rgba(0, 0, 0, .1);--lyrics-highlight-bg: rgba(46, 204, 113, .12);--lyrics-highlight-text: #1e9f78;--lyrics-highlight-shadow: rgba(46, 204, 113, .18);--component-bg: rgba(255, 255, 255, .5);--scrollbar-thumb-bg: rgba(0, 0, 0, .2);--scrollbar-track-bg: transparent}.dark-mode{--bg-gradient: linear-gradient(135deg, #0b1d1b 0%, #0f2f2c 45%, #123c36 100%);--container-bg: rgba(30, 30, 30, .6);--container-shadow: rgba(0, 0, 0, .3);--text-color: #ecf0f1;--text-secondary-color: #95a5a6;--primary-color: #1abc9c;--primary-color-dark: #17a589;--item-hover-bg: rgba(26, 188, 156, .1);--item-current-bg: rgba(26, 188, 156, .2);--border-color: rgba(255, 255, 255, .15);--lyrics-highlight-bg: rgba(26, 188, 156, .12);--lyrics-highlight-text: #34d1b6;--component-bg: rgba(44, 44, 44, .5);--scrollbar-thumb-bg: rgba(255, 255, 255, .2);--success-color-hover: #1f8a4f}.dark-mode .source-menu{background:#2c2c2cf2;border-color:var(--primary-color)}.dark-mode .source-option{color:#ecf0f1}.dark-mode .source-option:hover,.dark-mode .source-option.active{color:#fff}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--scrollbar-track-bg)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-bg);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}body{font-family:var(--font-main);display:flex;justify-content:center;align-items:center;min-height:100dvh;margin:0;padding:20px;box-sizing:border-box;color:var(--text-color);transition:color .5s;background-color:#0f0f0f}.background-stage{position:fixed;inset:0;width:100%;max-width:100vw;box-sizing:border-box;pointer-events:none;z-index:-2;overflow:hidden}.background-stage__layer{position:absolute;inset:0;background-attachment:fixed;background-size:cover;background-position:center;filter:saturate(105%)}.background-stage__layer--base{background-image:var(--bg-gradient)}.background-stage__layer--transition{background-image:var(--bg-gradient-next);opacity:0;transition:opacity .85s ease}body.background-transitioning .background-stage__layer--transition{opacity:1}.container{width:min(1200px,100%);margin:0 auto;background:var(--container-bg);border-radius:24px;padding:30px;box-shadow:0 20px 60px #0000001a;border:1px solid var(--border-color);aspect-ratio:16/9;height:80vh;max-height:700px;display:grid;grid-template-areas:"header header header" "search search search" "cover playlist lyrics" "controls controls controls";grid-template-rows:auto auto 1fr 80px;grid-template-columns:300px 1fr 1fr;gap:20px;transition:background .5s,box-shadow .5s;overflow:visible;position:relative}.container.search-mode{grid-template-areas:"header header header" "search search search" "search search search" "controls controls controls"}.header{grid-area:header;text-align:center;position:relative}.header h1{margin:0;font-size:2.2em;font-weight:700;color:var(--primary-color);letter-spacing:1px}.header .warning{color:var(--text-secondary-color);font-size:.9em;margin-top:10px;font-style:italic}.search-area{grid-area:search;background:var(--component-bg);border-radius:16px;padding:20px;border:1px solid var(--border-color);position:relative;transition:all .5s cubic-bezier(.4,0,.2,1);z-index:10;overflow:visible;display:flex;flex-direction:column}.search-area *,.search-area *:before,.search-area *:after{box-sizing:border-box}.container.search-mode .search-area{background:var(--component-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 10px 40px #0003;border:2px solid var(--primary-color)}.search-container{display:flex;gap:10px;align-items:center;margin-bottom:15px;flex-shrink:0}.search-input{flex:1;padding:12px 16px;border:2px solid var(--border-color);border-radius:12px;background:var(--component-bg);color:var(--text-color);font-size:16px;font-family:inherit;outline:none;transition:all .3s ease}.search-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #1abc9c1f}.source-select-wrapper{position:relative;flex-shrink:0}.source-select-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 18px;border:1px solid var(--border-color);border-radius:12px;background:var(--component-bg);color:var(--text-color);font-size:16px;font-family:inherit;font-weight:500;cursor:pointer;transition:all .25s ease;min-width:150px;position:relative;box-shadow:none}.source-select-btn:hover,.source-select-btn.active{border-color:var(--primary-color);color:var(--primary-color);box-shadow:0 10px 24px #1abc9c33;background:var(--component-bg)}.source-select-btn:focus-visible{outline:none;box-shadow:0 0 0 3px #1abc9c2e}.source-select-btn .caret-icon{font-size:.8em;transition:transform .25s ease}.source-select-btn.active .caret-icon{transform:rotate(-180deg)}.source-menu{position:absolute;top:calc(100% + 10px);left:0;right:auto;bottom:auto;background:#fffffff2;border-radius:12px;box-shadow:0 12px 30px #0000002e;border:1px solid var(--border-color);box-sizing:border-box;min-width:100%;max-height:320px;overflow-y:auto;overflow-x:hidden;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .18s ease,transform .18s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:100000;pointer-events:none}.source-menu.show{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.source-menu.open-upwards{top:auto;bottom:calc(100% + 10px);transform-origin:bottom center}.source-menu.open-downwards{top:calc(100% + 10px);bottom:auto;transform-origin:top center}.source-option{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;font-size:.95em;color:var(--text-color);cursor:pointer;transition:all .2s ease;background:transparent}.source-option:hover,.source-option.active{background:var(--primary-color);color:#fff}.source-option i{font-size:.85em;opacity:.6}.source-option.active i{opacity:1}.search-btn{background:var(--primary-color);color:#fff;border:none;border-radius:12px;padding:12px 20px;cursor:pointer;font-size:16px;transition:all .2s ease;display:flex;align-items:center;gap:8px}.search-btn:hover{background:var(--primary-color-dark);transform:translateY(-1px)}.search-btn:disabled{background:var(--text-secondary-color);cursor:not-allowed;transform:none}.search-results{max-height:0;overflow:hidden;border-top:1px solid var(--border-color);margin:15px -20px -20px;padding-top:0;padding-left:20px;padding-right:20px;position:relative;z-index:1;transition:all .5s cubic-bezier(.4,0,.2,1);opacity:0;border-radius:0 0 14px 14px;flex:1;min-height:0;display:flex;flex-direction:column;gap:12px}.search-results-toolbar{display:flex!important;justify-content:flex-end;align-items:center;gap:8px;padding-top:12px;padding-bottom:12px;position:sticky;top:0;z-index:2;background:none}.import-dropdown{position:relative;display:inline-flex;align-items:stretch;z-index:20000}.import-selected-btn{display:inline-flex;flex-direction:row;align-items:center;gap:6px;writing-mode:horizontal-tb;white-space:nowrap}.import-dropdown-caret{font-size:12px}.import-dropdown-menu{position:absolute;top:calc(100% + 4px);right:0;background:#fffffffa;border:1px solid var(--border-color);border-radius:8px;box-shadow:0 8px 24px #0000002e;padding:6px 0;min-width:160px;z-index:20000;pointer-events:auto}.dark-mode .import-dropdown-menu{background:#1c1c1cfa;border-color:#ffffff1f;box-shadow:0 10px 28px #00000073}.import-dropdown-menu[hidden]{display:none}.import-dropdown-item{width:100%;padding:8px 14px;background:transparent;border:none;text-align:left;font-size:14px;color:var(--text-primary-color);cursor:pointer;transition:background-color .2s ease}.import-dropdown-item:hover{background:var(--item-hover-bg)}.search-results-list{display:flex;flex-direction:column;flex:1;min-height:0}.container.search-mode .search-results{max-height:none;height:100%;padding-top:15px;padding-bottom:20px;opacity:1;overflow-y:auto;overflow-x:hidden}.search-result-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:12px;cursor:pointer;transition:all .3s ease;margin-bottom:8px;background:#ffffff4d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);transform:translateY(20px);opacity:0;animation:slideInUp .4s ease forwards;gap:14px}.search-result-item:nth-child(1){animation-delay:.1s}.search-result-item:nth-child(2){animation-delay:.15s}.search-result-item:nth-child(3){animation-delay:.2s}.search-result-item:nth-child(4){animation-delay:.25s}.search-result-item:nth-child(5){animation-delay:.3s}@keyframes slideInUp{to{transform:translateY(0);opacity:1}}.search-result-item:hover:not(.selected){background:var(--item-hover-bg);transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.search-result-item.selected{background:var(--item-current-bg);border-color:var(--primary-color);box-shadow:0 12px 28px #1abc9c40;transform:translateY(0)}.search-result-item.selected .search-result-title{color:var(--primary-color)}.search-result-item.selected .search-result-select{border-color:var(--primary-color);background:var(--primary-color);color:#fff;box-shadow:0 6px 16px #1abc9c59}.search-result-item.selected .search-result-select i{opacity:1;transform:scale(1)}.search-result-select{width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:#ffffffa6;color:transparent;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease;cursor:pointer;box-shadow:0 4px 12px #00000014}.search-result-select i{opacity:0;transform:scale(.6);transition:all .2s ease;pointer-events:none}.search-result-select:focus-visible{outline:none;box-shadow:0 0 0 3px #1abc9c59}.search-result-item .search-result-select:hover{border-color:var(--primary-color)}.search-result-info{flex:1;min-width:0}.search-result-title{font-weight:600;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;margin-bottom:4px}.search-result-artist{font-size:13px;color:var(--text-secondary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-result-actions{display:flex;gap:8px;margin-left:15px}.search-result-actions .action-btn{width:32px;height:32px;padding:0;border-radius:8px;justify-content:center;font-size:14px;gap:0;border:1px solid rgba(255,255,255,.6)}.search-result-actions .action-btn i{margin:0}.search-result-actions .action-btn.favorite{background:#ff4d67;color:#fff;border-color:#ff4d67a6;box-shadow:0 6px 16px #ff4d674d}.search-result-actions .action-btn.favorite.is-active{filter:brightness(1.05)}.search-result-actions .action-btn.favorite:hover{color:#fff;filter:brightness(1.05)}.search-result-actions .action-btn.play{border-color:#1abc9c73}.search-result-actions .action-btn.download{border-color:#2ecc718c;box-shadow:0 6px 16px #2ecc7147}.import-selected-btn{display:inline-flex;flex-direction:row;align-items:center;gap:6px;writing-mode:horizontal-tb;white-space:nowrap;border:none;border-radius:999px;padding:8px 16px;background:var(--primary-color);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;box-shadow:0 10px 24px #1abc9c40}.import-selected-btn:disabled{cursor:not-allowed;background:#7f8c8d80;box-shadow:none;filter:none}.import-selected-btn:not(:disabled):hover,.import-selected-btn:not(:disabled):focus-visible{transform:translateY(-1px);box-shadow:0 14px 30px #1abc9c52;filter:brightness(1.05)}.import-selected-btn:focus-visible{outline:none}.import-selected-count{font-weight:500}.action-btn{background:var(--primary-color);color:#fff;border:none;border-radius:8px;padding:6px 12px;cursor:pointer;font-size:12px;transition:all .2s ease;display:flex;align-items:center;gap:6px;position:relative;z-index:10000;font-weight:500}.action-btn:hover{background:var(--primary-color-dark);transform:translateY(-1px);box-shadow:0 4px 12px #1abc9c4d}.action-btn.download{background:var(--success-color);padding:4px 8px;font-size:10px}.action-btn.download:hover{background:#27ae60;box-shadow:0 4px 12px #2ecc714d}.search-result-actions .action-btn.download{padding:0;font-size:14px}.main-content{display:contents;transition:all .5s cubic-bezier(.4,0,.2,1)}.container.search-mode .main-content{display:none}.cover-area{grid-area:cover;background:var(--component-bg);border-radius:16px;padding:20px;border:1px solid var(--border-color);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;box-sizing:border-box;height:100%;overflow:hidden;transition:all .5s cubic-bezier(.4,0,.2,1)}.album-cover{width:200px;height:auto;min-height:200px;flex-grow:0;flex-shrink:0;border-radius:12px;background:linear-gradient(45deg,var(--primary-color),var(--success-color));display:flex;align-items:center;justify-content:center;margin-bottom:15px;box-shadow:0 8px 20px #00000026;transition:all .3s ease;overflow:hidden}.album-cover img{width:100%;height:100%;object-fit:cover;border-radius:12px}.album-cover.loading{animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.album-cover .placeholder{font-size:48px;color:#fff;opacity:.8}.current-song-info{width:100%}.current-song-title-row{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-bottom:5px}.current-song-title-row .current-song-title{flex:0 1 auto;max-width:calc(100% - 40px);min-width:0;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.current-song-title-row .current-favorite-btn{position:static;transform:none;display:inline-flex;align-items:center;justify-content:center;background:none}.current-song-title{font-size:16px;font-weight:600;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.current-song-artist{font-size:14px;color:var(--text-secondary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist,.lyrics{background:var(--component-bg);border-radius:16px;padding:20px;border:1px solid var(--border-color);height:100%;min-width:0;max-width:100%;max-height:100%;box-sizing:border-box;transition:all .5s cubic-bezier(.4,0,.2,1);position:relative;display:flex;flex-direction:column;overflow:hidden}.playlist{grid-area:playlist;background:var(--component-bg);border-radius:16px;padding:72px 20px 24px;border:1px solid var(--border-color);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;height:100%;box-sizing:border-box}html.desktop-view .playlist{padding-top:72px}.playlist[hidden],.playlist.favorites[hidden]{display:none!important}.playlist-header{position:absolute;top:16px;left:20px;right:12px;display:flex;align-items:center;justify-content:space-between;gap:16px;pointer-events:none;z-index:5}.playlist-header>*{pointer-events:auto}.playlist-header .playlist-tabs{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.playlist-actions-tray{pointer-events:auto;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0;background:transparent;border:none;box-shadow:none}body.dark-mode .playlist-actions-tray{background:transparent;border:none;box-shadow:none}.playlist-action-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(15,23,42,.08);background:#ffffffbf;color:var(--text-secondary-color);font-size:15px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,border-color .2s ease;box-shadow:0 8px 18px #0f172a1f}body.dark-mode .playlist-action-btn{background:#181e28d9;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 26px #00000059;color:var(--text-secondary-color)}.playlist-action-btn i{pointer-events:none}.playlist-action-btn:hover:not(:disabled),.playlist-action-btn:focus-visible:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 30px #1abc9c40;filter:brightness(1.06);border-color:#1abc9c66;color:var(--primary-color)}.playlist-action-btn:focus-visible{outline:none}.playlist-action-btn--export:hover:not(:disabled),.playlist-action-btn--export:focus-visible:not(:disabled){color:var(--primary-color-dark)}.playlist-action-btn--clear{color:#e74c3cd9;border-color:#e74c3c47}.playlist-action-btn--clear:hover:not(:disabled),.playlist-action-btn--clear:focus-visible:not(:disabled){filter:brightness(1.05);box-shadow:0 16px 32px #e74c3c47;color:var(--warning-color)}.playlist-action-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;filter:none}.playlist-action-btn:disabled:hover{background:transparent}.playlist-import-input{display:none}html.mobile-view .playlist-header{position:static;top:auto;left:auto;right:auto;display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-bottom:12px;pointer-events:auto}html.mobile-view #playlist.playlist .playlist-header,html.mobile-view #favorites.playlist .playlist-header,html.mobile-view .playlist-header .playlist-tabs{display:none}html.mobile-view .playlist-header .playlist-actions-tray{justify-content:flex-end;flex-wrap:wrap;gap:10px}html.mobile-view .playlist-header .playlist-action-btn{width:36px;height:36px}.playlist:not(.empty){align-items:stretch;justify-content:flex-start}.playlist.empty:before{content:'点击"探索雷达"加载在线音乐';color:var(--text-secondary-color);font-style:italic;opacity:.7;font-size:.9em}.playlist.favorites.empty:before{content:""}.playlist-scroll{flex:1;width:100%;overflow-y:auto;padding-right:8px;margin-right:-8px;overscroll-behavior:contain}.playlist.empty .playlist-scroll{display:none}.playlist-tabs{display:flex;gap:8px}.playlist-tab{display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;border-radius:12px;border:1px solid var(--border-color);background:transparent;color:var(--text-secondary-color);font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease;flex:0 0 auto;min-width:0}.playlist-tab:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.playlist-tab:hover:not(.active){border-color:var(--primary-color);color:var(--primary-color)}.playlist-tab.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.mobile-panel-header .playlist-tabs{display:flex;gap:4px;justify-self:flex-start;flex:0 0 auto}.mobile-panel-header .playlist-tab{flex:0 0 auto;height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--border-color);background:transparent;color:var(--text-secondary-color);font-size:12px;font-weight:500;cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease}.mobile-panel-header .playlist-tab.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.mobile-panel-header .playlist-tab:hover:not(.active){border-color:var(--primary-color);color:var(--primary-color)}.playlist.favorites{margin-top:0;padding-top:72px}.playlist:not(.active) .playlist-header{display:none}.favorites[hidden]{display:none!important}.playlist-items{width:100%}.playlist-item-checkbox{width:18px;height:18px;margin-right:10px;cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;position:relative;border:2px solid var(--primary-color);border-radius:4px;background-color:var(--container-bg);transition:all .2s ease}.playlist-item-checkbox:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.playlist-item-checkbox:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px;color:#fff;font-weight:700}.playlist-item-checkbox:focus-visible{outline:2px solid var(--primary-color-dark);outline-offset:2px}.playlist-item-checkbox:hover:not(:checked){border-color:var(--primary-color-dark);background-color:#1abc9c1a}body.mobile-view .playlist-items .playlist-item .playlist-item-checkbox{width:16px;height:16px;margin-right:8px}.playlist-items .playlist-item{padding:10px 110px 10px 12px;border-radius:8px;transition:all .2s ease-in-out;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;font-size:14px;margin-bottom:2px}.playlist-items .playlist-item:hover{background-color:var(--item-hover-bg);color:var(--item-current-text);transform:translate(5px)}.playlist-items .playlist-item.current{color:var(--item-current-text);font-weight:500;background-color:var(--item-current-bg)}.playlist-item-favorite,.playlist-item-download,.playlist-item-remove{position:absolute;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;border:1px solid transparent;padding:0;font-size:14px;cursor:pointer;opacity:0;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,opacity .2s ease;z-index:5}.playlist-items .playlist-item:hover .playlist-item-favorite,.playlist-items .playlist-item:hover .playlist-item-download,.playlist-items .playlist-item:hover .playlist-item-remove,.playlist-items .playlist-item:focus-within .playlist-item-favorite,.playlist-items .playlist-item:focus-within .playlist-item-download,.playlist-items .playlist-item:focus-within .playlist-item-remove{opacity:1}.playlist-item-favorite{right:74px;background:#ff4d67;color:#fff;border-color:#ff4d6799;box-shadow:0 4px 12px #ff4d6740}.playlist-item-favorite .fas,.playlist-item-favorite .far{margin:0;transition:color .2s ease}.playlist-item-favorite.is-active{filter:brightness(1.02)}.playlist-item-favorite.is-active .fas,.playlist-item-favorite.is-active .far{color:#fff}.playlist-item-download{right:42px;background:var(--success-color);color:#fff;border-color:#2ecc7180;box-shadow:0 4px 10px #2ecc7133}.playlist-item-remove{right:10px;background:#ff3b30e6;color:#fff;border-color:#e74c3c80;box-shadow:0 4px 10px #e74c3c38}.playlist-item-favorite:hover,.playlist-items .playlist-item:focus-within .playlist-item-favorite{transform:translateY(-50%) scale(1.05);box-shadow:0 8px 20px #ff4d6759;filter:brightness(1.05)}.playlist-item-download:hover,.playlist-items .playlist-item:focus-within .playlist-item-download{transform:translateY(-50%) scale(1.05);box-shadow:0 8px 18px #2ecc7140;filter:brightness(1.05)}.playlist-item-remove:hover,.playlist-items .playlist-item:focus-within .playlist-item-remove{transform:translateY(-50%) scale(1.05);box-shadow:0 8px 18px #e74c3c47;filter:brightness(1.05)}.favorite-toggle,.save-to-backend-btn{border:none;background:none;color:var(--text-secondary-color);cursor:pointer;padding:4px;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease}.save-to-backend-btn:hover{color:var(--primary-color);background-color:var(--item-hover-bg)}.favorite-toggle:hover{color:var(--primary-color)}.favorite-toggle.is-active{color:#ff4d67}.playlist-item-favorite.favorite-toggle{padding:0;background:#ff4d67;color:#fff;border:1px solid rgba(255,77,103,.6);box-shadow:0 4px 12px #ff4d6740;transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease,filter .2s ease,color .2s ease}.playlist-item-favorite.favorite-toggle:hover{color:#fff;background:#e6435b;box-shadow:0 8px 20px #ff4d6759}.playlist-item-favorite.favorite-toggle.is-active{color:#fff;filter:brightness(1.03)}.current-favorite-btn{font-size:18px}.favorites .playlist-items .playlist-item{padding-right:150px}.favorite-item-action{position:absolute;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;border:1px solid transparent;cursor:pointer;opacity:0;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,opacity .2s ease;color:#fff}.favorite-item-action--add{right:74px;background:var(--primary-color)}.favorite-item-action--download{right:42px;background:var(--success-color)}.favorite-item-action--remove{right:10px;background:#ff3b30cc}.favorites .playlist-item:hover .favorite-item-action{opacity:1}.favorite-item-action:hover,.favorites .playlist-items .playlist-item:focus-within .favorite-item-action{transform:translateY(-50%) scale(1.05);filter:brightness(1.05)}.favorite-item-action--add{box-shadow:0 4px 12px #4c6ef538}.favorite-item-action--download{box-shadow:0 4px 10px #2ecc7133}.favorite-item-action--remove{box-shadow:0 4px 10px #e74c3c38}.favorite-item-action--add:hover,.favorites .playlist-items .playlist-item:focus-within .favorite-item-action--add{background:var(--primary-color-dark);box-shadow:0 8px 20px #4c6ef547}.favorite-item-action--download:hover,.favorites .playlist-items .playlist-item:focus-within .favorite-item-action--download{background:var(--success-color-hover);box-shadow:0 8px 18px #2ecc7140}.favorite-item-action--remove:hover,.favorites .playlist-items .playlist-item:focus-within .favorite-item-action--remove{background:#ff3b30;box-shadow:0 8px 18px #e74c3c47}html.mobile-view .mobile-panel-header .playlist-tabs{gap:6px;justify-self:flex-start;flex:0 0 auto}html.mobile-view .mobile-panel-header .playlist-tab{flex:0 0 auto;min-width:0;height:38px;padding:0 14px;border-radius:999px;font-size:13px}html.mobile-view .playlist-items .playlist-item{padding-right:108px}html.mobile-view .playlist-item-favorite,html.mobile-view .playlist-item-download,html.mobile-view .playlist-item-remove{width:28px;height:28px;border-radius:8px;opacity:1}html.mobile-view .playlist-item-favorite{right:88px}html.mobile-view .playlist-item-download{right:48px}html.mobile-view .playlist-item-remove{right:12px}html.mobile-view .playlist-item-favorite:hover,html.mobile-view .playlist-items .playlist-item:focus-within .playlist-item-favorite,html.mobile-view .playlist-item-download:hover,html.mobile-view .playlist-items .playlist-item:focus-within .playlist-item-download,html.mobile-view .playlist-item-remove:hover,html.mobile-view .playlist-items .playlist-item:focus-within .playlist-item-remove{transform:translateY(-50%);box-shadow:none;filter:none}html.mobile-view .favorites .favorite-item-action{opacity:1}html.mobile-view .favorites .favorite-item-action:hover,html.mobile-view .favorites .playlist-items .playlist-item:focus-within .favorite-item-action{transform:translateY(-50%);box-shadow:none;filter:none}html.mobile-view .favorites .playlist-items .playlist-item{padding-right:108px}html.mobile-view .favorites .favorite-item-action{width:28px;height:28px;border-radius:8px}html.mobile-view .favorites .favorite-item-action--add{right:88px}html.mobile-view .favorites .favorite-item-action--download{right:48px}html.mobile-view .favorites .favorite-item-action--remove{right:12px}.dynamic-quality-menu{background:#fff;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 12px 30px #0003;padding:6px 0;min-width:180px;overflow:hidden;z-index:100000}.dark-mode .dynamic-quality-menu{background:#1c1c1c;border-color:#ffffff26;box-shadow:0 12px 34px #0009}.lyrics{grid-area:lyrics;text-align:center;font-size:1em;line-height:2;word-wrap:break-word;overflow-wrap:break-word;max-width:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:center}.lyrics-scroll{flex:1;width:100%;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-right:8px;margin-right:-8px;overscroll-behavior:contain}.lyrics:not(.empty) .lyrics-scroll{align-items:flex-start;justify-content:flex-start}.lyrics-content{width:100%}.lyrics-content>div{white-space:pre-wrap;padding:5px;margin-bottom:5px;word-wrap:break-word;overflow-wrap:break-word;max-width:100%}.lyrics.empty[data-placeholder=default] .lyrics-content{display:none}.lyrics.empty[data-placeholder=default] .lyrics-scroll:before{content:"歌词将在此处同步显示";color:var(--text-secondary-color);font-style:italic;opacity:.7;font-size:.9em}.lyrics.empty[data-placeholder=message] .lyrics-scroll:before{content:none}.lyrics .current{color:var(--lyrics-highlight-text);font-weight:700;background-color:var(--lyrics-highlight-bg);transform:scale(1.05);box-shadow:0 4px 15px var(--lyrics-highlight-shadow)}.controls{grid-area:controls;display:grid;grid-template-columns:300px minmax(0,1fr) minmax(0,1fr);grid-template-areas:"transport progress trailing";align-items:center;column-gap:20px;row-gap:12px;width:100%;transition:all .5s cubic-bezier(.4,0,.2,1)}.controls button{background:var(--primary-color);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:1.2em;width:50px;height:50px;display:flex;justify-content:center;align-items:center;transition:all .2s ease;box-shadow:0 4px 10px #0000001a}.controls button:hover{background:var(--primary-color-dark);transform:translateY(-2px);box-shadow:0 6px 15px #00000026}.controls button:active{transform:translateY(0);box-shadow:0 2px 5px #0000001a}.controls button#loadOnlineBtn{width:auto;border-radius:25px;padding:0 25px;gap:10px}.controls button#loadOnlineBtn .btn-text{display:inline-flex;align-items:center;gap:8px;line-height:1}.controls button#loadOnlineBtn .btn-text i{line-height:1}.controls button#loadOnlineBtn .loader{display:inline-flex;align-items:center;justify-content:center}.controls button:disabled{background:var(--text-secondary-color);cursor:not-allowed;transform:none;box-shadow:none}.transport-controls{grid-area:transport;display:flex;align-items:center;gap:12px;justify-self:flex-start}html:not(.mobile-view) .transport-controls{justify-self:stretch;width:100%;justify-content:space-between;gap:0}html:not(.mobile-view) #playModeBtn{margin-right:0}#mobileQueueToggle{display:none}#shuffleToggleBtn{display:inline-flex;align-items:center;justify-content:center}.transport-button--shuffle .shuffle-icon{display:inline-flex;transition:opacity .24s ease,filter .24s ease,text-shadow .24s ease;filter:none;text-shadow:none}.transport-button--shuffle .shuffle-icon--off{opacity:.9}.transport-button--shuffle .shuffle-icon--on{opacity:1;filter:drop-shadow(0 0 4px rgba(255,255,255,.45));text-shadow:0 0 1px currentColor}#playPauseBtn{width:60px;height:60px;font-size:1.4em}.progress-container{grid-area:progress;display:flex;align-items:center;gap:12px;min-width:260px;width:100%;justify-self:stretch}.control-trailing{grid-area:trailing;display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;flex-wrap:wrap}.progress-container span{font-variant-numeric:tabular-nums;font-size:.85em;color:var(--text-secondary-color)}.progress-container input[type=range]{flex:1;height:8px;border-radius:999px;background:linear-gradient(to right,var(--primary-color) 0%,var(--primary-color) var(--progress, 0%),rgba(255,255,255,.5) var(--progress, 0%),rgba(255,255,255,.2) 100%);cursor:pointer;transition:background .2s ease}.audio-tools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-start;flex:1 1 auto}.control-trailing #loadOnlineBtn{margin-left:auto}.volume-container{display:flex;align-items:center;gap:8px;min-width:140px}.volume-container input[type=range]{width:110px;height:6px;border-radius:999px;background:linear-gradient(to right,var(--primary-color) 0%,var(--primary-color) var(--volume-progress, 100%),rgba(255,255,255,.2) var(--volume-progress, 100%),rgba(255,255,255,.1) 100%);cursor:pointer}input[type=range]{-webkit-appearance:none;appearance:none;background:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--primary-color);border:2px solid rgba(255,255,255,.6);box-shadow:0 2px 6px #0003;transition:transform .2s ease}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--primary-color);border:2px solid rgba(255,255,255,.6);box-shadow:0 2px 6px #0003;transition:transform .2s ease}input[type=range]:active::-webkit-slider-thumb,input[type=range]:active::-moz-range-thumb{transform:scale(1.1)}.player-quality{position:relative}.controls .player-quality-btn{display:flex;align-items:center;justify-content:center;gap:0;padding:10px 16px;border-radius:8px;border:1px solid var(--border-color);background:var(--component-bg);color:var(--text-color);font-size:.9em;font-weight:500;cursor:pointer;transition:all .2s ease;width:auto;height:auto;box-shadow:none}.controls .player-quality-btn:hover,.controls .player-quality-btn.active{border-color:var(--primary-color);color:var(--primary-color);box-shadow:0 6px 16px #1abc9c40;background:var(--component-bg)}.player-quality-menu{position:absolute;top:calc(100% + 10px);right:0;background:#fff;border-radius:12px;box-shadow:0 12px 30px #0003;border:1px solid var(--border-color);min-width:180px;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s ease;z-index:100000;pointer-events:none}.dark-mode .player-quality-menu{background:#1c1c1c;border-color:#ffffff26;box-shadow:0 12px 34px #0009}.player-quality-menu.show{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.player-quality-menu.floating{position:fixed;right:auto;left:0;top:0;will-change:opacity,transform}.player-quality-menu.floating:not(.show){opacity:0;visibility:hidden}.player-quality-menu.open-upwards{transform-origin:bottom center}.player-quality-menu.open-downwards{transform-origin:top center}.player-quality-option,.quality-option{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;font-size:.9em;color:var(--text-color);cursor:pointer;transition:all .2s ease;background:transparent}.player-quality-option:hover,.player-quality-option.active,.quality-option:hover,.quality-option.active{background:var(--primary-color);color:#fff}.player-quality-option small,.quality-option small{opacity:.7}#audioPlayer{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.play-mode-controls{display:flex;gap:10px;align-items:center}.play-mode-btn{background:var(--primary-color);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:1.2em;width:50px;height:50px;display:flex;justify-content:center;align-items:center;transition:all .2s ease;box-shadow:0 4px 10px #0000001a}.play-mode-btn:hover{background:var(--primary-color);color:#fff;transform:translateY(-1px)}.play-mode-btn.active{background:var(--primary-color);color:#fff}.quality-menu{position:absolute;top:calc(100% + 10px);right:0;background:#fff;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 12px 30px #0003;z-index:100000;min-width:180px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s ease;pointer-events:none;overflow:hidden}.dark-mode .quality-menu{background:#1c1c1c;border-color:#ffffff26;box-shadow:0 12px 34px #0009}.search-result-item{position:relative;z-index:1}.search-result-item:has(.quality-menu.show){z-index:1000000}.search-result-item.menu-active{z-index:1000000}.quality-menu.show{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.load-more-btn{width:100%;background:var(--component-bg);color:var(--primary-color);border:2px solid var(--primary-color);border-radius:12px;padding:15px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease;margin-top:15px;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.load-more-btn:hover{background:var(--primary-color);color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #1abc9c59}.load-more-btn:disabled{background:var(--text-secondary-color);border-color:var(--text-secondary-color);color:#fff;cursor:not-allowed;transform:none;box-shadow:none}.debug-info{position:fixed;top:10px;left:10px;background:#000c;color:#fff;padding:10px;border-radius:5px;font-size:12px;z-index:10000;max-width:300px;max-height:40vh;overflow-y:auto;display:none}.debug-info.show{display:block}.loader{width:20px;height:20px;border:3px solid var(--primary-color);border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.theme-switch-wrapper{position:absolute;top:0;right:0;display:flex;justify-content:flex-end;gap:8px}.theme-color-picker{width:44px;height:44px;border-radius:16px;border:1px solid var(--border-color);background:linear-gradient(160deg,#ffffffd9,#fff6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 8px 20px #0000001f;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;appearance:none;padding:6px}.theme-color-picker:focus{outline:none;box-shadow:0 0 0 4px #1abc9c40}.theme-color-picker:hover{transform:translateY(-2px);box-shadow:0 12px 26px #00000029}body.dark-mode .theme-color-picker{background:linear-gradient(160deg,#242a36e6,#181e2ab3);border-color:#1abc9c73}.theme-color-picker::-webkit-color-swatch-wrapper{padding:0;border-radius:12px;overflow:hidden}.theme-color-picker::-webkit-color-swatch{border:none;border-radius:12px;width:100%;height:100%;cursor:pointer}.theme-color-picker::-moz-color-swatch{border:none;border-radius:12px;width:100%;height:100%;cursor:pointer}.theme-toggle-button{width:44px;height:44px;border-radius:16px;border:1px solid var(--border-color);background:linear-gradient(160deg,#ffffffd9,#fff6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 8px 20px #0000001f;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;position:relative;overflow:hidden;color:var(--primary-color)}.theme-toggle-button:focus-visible{outline:none;box-shadow:0 0 0 4px #1abc9c40}.theme-toggle-button:hover{transform:translateY(-2px);box-shadow:0 12px 26px #00000029}.theme-toggle-button.is-dark{background:linear-gradient(160deg,#242a36e6,#181e2ab3);border-color:#1abc9c73}.theme-toggle-button .theme-icon{position:absolute;font-size:18px;transition:opacity .35s ease,transform .45s ease;opacity:0;transform:scale(.6) rotate(-20deg)}.theme-toggle-button .theme-icon--sun{color:#f5a623;text-shadow:0 0 10px rgba(245,166,35,.4)}.theme-toggle-button .theme-icon--moon{color:#a29bfe;text-shadow:0 0 10px rgba(162,155,254,.4);transform:scale(.6) rotate(20deg)}.theme-toggle-button:not(.is-dark) .theme-icon--sun{opacity:1;transform:scale(1) rotate(0)}.theme-toggle-button.is-dark .theme-icon--moon{opacity:1;transform:scale(1) rotate(0)}.notification{position:fixed;top:20px;right:20px;background:var(--success-color);color:#fff;padding:12px 20px;border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:1000;transform:translate(400px);transition:transform .3s ease}.notification.show{transform:translate(0)}.notification.error{background:var(--warning-color)}.notification.warning{background:#f39c12}.view-toggle{display:none}.mobile-panel{display:contents}.mobile-turntable{width:100%;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:15px}.mobile-turntable__platter{position:relative;display:flex;align-items:center;justify-content:center;width:100%;max-width:220px}