:root{--color-primary: #31c27c;--color-primary-hover: #25a566;--color-primary-light: #e8f8f0;--color-on-primary: #ffffff;--color-text: #262626;--color-text-2: #757575;--color-text-3: #a6a6a6;--color-bg: #f6f6f6;--color-card: #ffffff;--color-border: #e9e9e9;--color-border-strong: #d9d9d9;--color-success: #31c27c;--color-success-soft: rgba(49, 194, 124, .11);--color-warning: #d48806;--color-warning-soft: rgba(212, 136, 6, .11);--color-warning-bg: #fef3c7;--color-warning-text: #92400e;--color-danger: #e54545;--color-danger-soft: rgba(229, 69, 69, .11);--color-danger-bg: #fdecec;--color-hover-bg: #f5f5f5;--color-selected-bg: #e8f8f0;--state-disabled-opacity: .5;--radius-tag: 3px;--radius-card-sm: 10px;--radius-card: 12px;--radius-pill: 999px;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-md: 14px;--font-size-lg: 15px;--font-size-xl: 17px;--font-size-title: 18px;--font-size-xxl: 22px;--font-size-xxxl: 26px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 28px;--space-8: 32px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);--shadow-md: 0 4px 14px rgba(0, 0, 0, .08);--font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;font-family:var(--font-family);color:var(--color-text);background:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit}.app-shell{min-height:100vh;padding-bottom:76px}.app-topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:40px;height:64px;padding:0 32px;background:var(--color-card);border-bottom:1px solid var(--color-border)}.brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--radius-card-sm);background:var(--color-primary);color:var(--color-on-primary);font-size:20px;font-weight:700}.brand-name{font-size:var(--font-size-title);font-weight:700;letter-spacing:.5px;line-height:1.2}.brand-name small{display:block;font-size:10px;color:var(--color-text-3);font-weight:400;letter-spacing:2px}.main-nav{display:flex;align-self:stretch}.main-nav a{display:flex;align-items:center;padding:0 22px;color:var(--color-text);text-decoration:none;font-size:var(--font-size-lg)}.main-nav a:hover{color:var(--color-primary)}.main-nav a.active{background:var(--color-primary);color:var(--color-on-primary);font-weight:600}.top-right{margin-left:auto;display:flex;align-items:center;gap:20px}.top-search{display:flex;align-items:center;width:240px;height:36px;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-card);overflow:hidden}.top-search input{flex:1;min-width:0;border:0;outline:0;padding:0 14px;background:transparent;color:var(--color-text);font-size:var(--font-size-sm)}.top-search button{width:44px;height:100%;border:0;background:transparent;color:var(--color-text-2);cursor:pointer;display:grid;place-items:center}.avatar{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:var(--color-primary);color:var(--color-on-primary);font-weight:700;cursor:pointer}.user-menu{position:relative}.user-dropdown{position:absolute;right:0;top:calc(100% + 10px);z-index:30;width:280px;padding:16px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-md)}.user-name{margin:0 0 4px;font-weight:600}.user-hint{margin:0 0 12px;color:var(--color-text-2);font-size:var(--font-size-sm)}.user-actions{display:flex;gap:8px}.user-actions button{min-height:36px;padding:0 14px;border:1px solid var(--color-border-strong);border-radius:9px;background:var(--color-card);color:var(--color-text);cursor:pointer}.user-actions button:hover:not(:disabled){background:var(--color-hover-bg)}.user-actions button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.shell-main{max-width:1180px;margin:0 auto;padding:28px 32px 40px}.shell-banners{max-width:1180px;margin:0 auto;padding:0 32px}.playbar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:24px;height:76px;padding:0 24px;background:color-mix(in srgb,var(--color-card) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--color-border)}.pb-song{display:flex;align-items:center;gap:12px;width:260px}.pb-cover{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--radius-card-sm);background:var(--color-primary-light);color:var(--color-primary);font-size:20px}.pb-meta .t{font-size:var(--font-size-md);font-weight:600}.pb-meta .a{margin-top:2px;color:var(--color-text-2);font-size:var(--font-size-xs)}.pb-center{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}.pb-btns{display:flex;align-items:center;gap:22px;color:var(--color-text)}.pb-btns button{display:grid;place-items:center;padding:0;border:0;background:transparent;color:inherit;cursor:pointer}.pb-btns .play{width:38px;height:38px;border:2px solid var(--color-text);border-radius:50%}.pb-btns button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.pb-progress{display:flex;align-items:center;gap:10px;width:min(520px,100%);color:var(--color-text-3);font-size:var(--font-size-xs)}.pb-track{position:relative;flex:1;height:4px;border-radius:2px;background:var(--color-border)}.pb-track .fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;background:var(--color-primary)}.pb-right{display:flex;align-items:center;gap:18px;color:var(--color-text-2)}.login-screen{min-height:100vh;display:grid;place-content:center;justify-items:center;padding:48px 24px}.login-card{width:min(400px,100%);padding:40px 36px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-md);text-align:center}.login-brand{width:56px;height:56px;margin:0 auto 12px;border-radius:14px;font-size:30px}.login-title{margin:0 0 20px;font-size:var(--font-size-xxl)}.login-card form{text-align:left}.login-card h2{margin:0;font-size:var(--font-size-title)}.login-hint{margin:0;color:var(--color-text-2)}.login-card button[type=submit]{width:100%;min-height:44px;border:0;border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-on-primary);font-weight:700;cursor:pointer}.login-card button[type=submit]:hover:not(:disabled){background:var(--color-primary-hover)}.login-card button[type=submit]:disabled{opacity:var(--state-disabled-opacity);cursor:default}.login-screen .status-card,.login-screen .update-card{width:min(400px,100%)}.eyebrow{color:var(--color-primary);font-size:11px;font-weight:700;letter-spacing:.16em}.status-card{display:flex;align-items:center;gap:16px;margin-top:22px;padding:24px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-card)}.status-dot{width:11px;height:11px;flex:none;border-radius:50%;background:var(--color-warning);box-shadow:0 0 0 6px var(--color-warning-soft)}.status-dot.online{background:var(--color-success);box-shadow:0 0 0 6px var(--color-success-soft)}.status-dot.offline{background:var(--color-danger);box-shadow:0 0 0 6px var(--color-danger-soft)}.status-copy{flex:1;min-width:0}.status-copy h3{margin:0 0 4px;font-size:17px}.status-copy p{margin:0;color:var(--color-text-2);line-height:1.5}.status-card button{flex:none;min-height:44px;padding:0 18px;border:1px solid var(--color-primary);border-radius:11px;background:transparent;color:var(--color-primary);cursor:pointer}.status-card button:hover:not(:disabled){background:var(--color-primary-light)}.status-card button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.auth-fields{display:grid;gap:14px;margin:20px 0}.auth-fields label{display:grid;gap:7px;color:var(--color-text-2);font-size:14px}.auth-fields input{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-card);color:var(--color-text);font:inherit}.auth-fields input:focus-visible,.login-card button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.auth-error{margin:16px 0 0;color:var(--color-danger)}.search-error{margin:18px 0 0;color:var(--color-danger)}.search-empty{margin:22px 0 0;color:var(--color-text-2)}.search-count{margin:0 0 12px;color:var(--color-text-2);font-size:13px}.search-results li:hover{background:var(--color-hover-bg)}.search-results li div{display:grid;gap:5px;min-width:0}.search-results li strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-results li span{color:var(--color-text-2);font-size:13px}.preview-player{margin-top:20px;padding:16px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-bg)}.preview-player p{margin:0 0 12px}.preview-player audio{display:block;width:100%}.library-card,.settings-card{margin-top:22px;padding:28px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-card)}.settings-card h2{margin:8px 0 18px;font-size:23px}.settings-card button{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);color:var(--color-text);font:inherit;cursor:pointer}.settings-card button:hover:not(:disabled){background:var(--color-hover-bg)}.settings-card button:disabled{opacity:.45;cursor:default}.library-header,.playlist-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.library-header h2{margin:8px 0 0;font-size:23px}.library-summary,.library-list span,.playlist-card p{color:var(--color-text-2)}.library-device-setting{margin-top:18px;color:var(--color-text-2)}.library-device-setting label{display:inline-flex;align-items:center;gap:8px;cursor:pointer}.library-device-setting input{width:18px;height:18px}.cache-setting{margin-top:18px;padding-top:18px;border-top:1px solid var(--color-border);display:flex;flex-direction:column;align-items:flex-start;gap:10px}.cache-setting p{margin:0}.device-setting{margin-top:18px;padding-top:18px;border-top:1px solid var(--color-border);display:flex;flex-direction:column;align-items:flex-start;gap:10px}.device-setting p{margin:0}.device-list{display:grid;gap:8px;list-style:none;padding:0;margin:0;width:100%}.device-list li{display:grid;gap:4px;border:1px solid var(--color-border);border-radius:12px;padding:12px}.device-list button{justify-self:start;min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);color:var(--color-text);font:inherit;cursor:pointer}.device-list button:hover:not(:disabled){background:var(--color-hover-bg)}.device-list button:disabled{opacity:.45;cursor:default}.device-name{font-weight:600}.diagnostics-setting{margin-top:18px;padding-top:18px;border-top:1px solid var(--color-border);display:flex;flex-direction:column;align-items:flex-start;gap:10px}.diagnostics-setting p,.diagnostics-setting h3{margin:0}.diagnostics-setting h3{font-size:16px}.diagnostics-list{display:grid;gap:8px;list-style:none;padding:0;margin:0;width:100%}.diagnostics-list li{display:grid;gap:4px;border:1px solid var(--color-border);border-radius:12px;padding:10px;overflow-wrap:anywhere}.diagnostics-paused{color:var(--color-warning);font-weight:600}.about-setting{display:flex;flex-direction:column;gap:10px}.about-setting p{margin:0;overflow-wrap:anywhere}.about-setting a{color:var(--color-primary)}.update-card{display:flex;align-items:center;gap:16px;margin-top:22px;padding:20px 24px;border:1px solid var(--color-border-strong);border-radius:20px;background:var(--color-card)}.update-card.incompatible{border-color:var(--color-danger);background:var(--color-danger-bg)}.update-card h3{margin:0 0 4px;font-size:17px}.update-card p{margin:0;color:var(--color-text-2);line-height:1.5}.update-card button{flex:none;min-height:44px;padding:0 18px;border:1px solid var(--color-primary);border-radius:11px;background:transparent;color:var(--color-primary);font:inherit;cursor:pointer}.update-card button:hover:not(:disabled){background:var(--color-primary-light)}.compact-library .library-list{gap:4px}.compact-library .library-list li{padding:6px 10px}.playlist-create{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:22px 0}.playlist-create input,.library-actions select{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px;background:var(--color-card);color:var(--color-text);font:inherit}.library-card button{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);color:var(--color-text);font:inherit;cursor:pointer}.library-card button:hover:not(:disabled){background:var(--color-hover-bg)}.library-card button:disabled{opacity:.45;cursor:default}.library-list{display:grid;gap:8px;list-style:none;padding:0}.library-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--color-border);border-radius:12px;padding:12px}.library-list li:hover{background:var(--color-hover-bg)}.library-list li>div:first-child{display:grid;gap:4px;min-width:0}.library-list strong{overflow:hidden;text-overflow:ellipsis}.library-actions{display:flex;flex-wrap:wrap;gap:6px}.catalog-browser{display:grid;gap:12px;margin-top:12px}.catalog-browser button{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);color:var(--color-text);font:inherit;cursor:pointer}.catalog-browser button:hover:not(:disabled){background:var(--color-hover-bg)}.catalog-browser button:disabled{opacity:.45;cursor:default}.catalog-browser input{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px;background:var(--color-card);color:var(--color-text);font:inherit}.catalog-replace{display:inline-flex;align-items:center;min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);cursor:pointer}.catalog-replace input{width:0;height:0;opacity:0;position:absolute}.catalog-preview{margin-top:22px;padding-top:14px;border-top:1px solid var(--color-border)}.catalog-preview h3{margin:0 0 10px}.page-heading{margin:4px 0 24px}.page-heading h2{margin:6px 0 8px;font-size:var(--font-size-xxxl);line-height:1.25}.page-heading p,.search-intro p{max-width:680px;margin:0;color:var(--color-text-2);font-size:var(--font-size-md);line-height:1.7}.search-view.search-card{margin-top:0;padding:0;border:0;border-radius:0;background:transparent}.search-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:4px 0 24px}.search-heading h2{margin:6px 0 8px;font-size:var(--font-size-xxxl);line-height:1.25}.source-tabs{display:flex;gap:4px;padding:4px;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-card);box-shadow:var(--shadow-sm)}.source-tabs button{min-height:36px;padding:0 16px;border:0;border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-on-primary);font-size:var(--font-size-sm);font-weight:600;transition:color .15s,background .15s;cursor:pointer}.source-tabs button:hover{background:var(--color-primary-hover)}.source-tabs button[aria-selected=false]{background:transparent;color:var(--color-text-2)}.source-tabs button[aria-selected=false]:hover{background:var(--color-hover-bg);color:var(--color-text)}.search-controls{margin-top:0;padding:24px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-card)}.search-controls label{display:block;margin-bottom:10px;color:var(--color-text);font-size:var(--font-size-md);font-weight:600}.search-controls>div{display:flex;gap:12px}.search-controls input{flex:1;min-width:0;min-height:48px;padding:0 18px;border-color:var(--color-border);border-radius:var(--radius-pill);background:var(--color-bg);color:var(--color-text);font:inherit;transition:border-color .15s,box-shadow .15s,background .15s}.search-controls input:hover{border-color:var(--color-border-strong);background:var(--color-card)}.search-controls input:focus{border-color:var(--color-primary);background:var(--color-card);box-shadow:0 0 0 3px var(--color-primary-light);outline:0}.search-controls button{min-width:104px;min-height:48px;padding:0 20px;border:0;border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-on-primary);font:inherit;font-weight:700;cursor:pointer}.search-controls button:hover:not(:disabled){background:var(--color-primary-hover)}.search-controls button:disabled,.search-results button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.search-controls input:focus-visible,.search-card button:focus-visible,.preview-player audio:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.search-hint{margin:0 0 12px;padding:10px 14px;border-radius:var(--radius-card-sm);background:var(--color-primary-light)}.search-results{overflow:hidden;margin-top:20px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-card)}.search-count{margin:0;padding:14px 20px;border-bottom:1px solid var(--color-border)}.search-results ul{display:grid;gap:0;margin:0;padding:0;list-style:none}.search-results li{display:flex;align-items:center;justify-content:flex-start;gap:16px;min-height:76px;padding:12px 20px;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:var(--color-card)}.search-results li:last-child{border-bottom:0}.search-results li .search-result-art{display:grid;flex:0 0 44px;place-items:center;width:44px;height:44px;border-radius:var(--radius-card-sm);background:linear-gradient(135deg,var(--color-primary-light),#dff2fb);color:var(--color-primary);font-size:20px;font-weight:700}.search-results li .search-result-copy{display:grid;flex:1;gap:3px}.search-result-copy small{color:var(--color-text-3);font-size:var(--font-size-xs)}.search-results li .search-result-actions{display:flex;flex:none;gap:8px}.search-results button{min-height:40px;padding:0 18px;border-radius:var(--radius-pill);font:inherit;font-weight:700;cursor:pointer}.search-results .button-secondary,.catalog-browser .button-secondary{border:1px solid var(--color-border-strong);background:var(--color-card);color:var(--color-text)}.search-results .button-secondary:hover:not(:disabled),.catalog-browser .button-secondary:hover:not(:disabled){border-color:var(--color-primary);background:var(--color-primary-light);color:var(--color-primary-hover)}.search-results .button-primary,.catalog-browser .button-primary{border-color:var(--color-primary);background:var(--color-primary);color:var(--color-on-primary)}.search-results .button-primary:hover:not(:disabled),.catalog-browser .button-primary:hover:not(:disabled){background:var(--color-primary-hover)}.preview-player{background:var(--color-card);box-shadow:var(--shadow-sm)}.empty-state{padding:48px 24px;border:1px dashed var(--color-border-strong);border-radius:var(--radius-card);background:var(--color-card);color:var(--color-text-2);text-align:center}.catalog-surface{padding:24px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-card)}.catalog-surface>.source-tabs{width:fit-content;margin-bottom:18px}.catalog-browser{gap:16px;margin-top:0}.catalog-browser>.library-summary{margin:0}.catalog-browser .library-list{overflow:hidden;gap:0;margin:0;border:1px solid var(--color-border);border-radius:var(--radius-card)}.catalog-browser .library-list li{min-height:92px;padding:16px 18px;border:0;border-bottom:1px solid var(--color-border);border-radius:0}.catalog-browser .library-list li:last-child{border-bottom:0}.catalog-entry-copy{flex:1}.catalog-entry-copy strong{font-size:var(--font-size-lg)}.catalog-entry-artist{color:var(--color-text-2);font-size:var(--font-size-sm)}.replica-statuses{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.catalog-browser .replica-status,.catalog-browser .catalog-meta-tag{display:inline-flex;align-items:center;gap:5px;width:fit-content;padding:3px 7px;border-radius:var(--radius-pill);background:var(--color-hover-bg);color:var(--color-text-2);font-size:11px;line-height:1.4}.replica-status-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.catalog-browser .replica-status-healthy{background:var(--color-success-soft);color:var(--color-primary-hover)}.catalog-browser .replica-status-warning{background:var(--color-warning-soft);color:var(--color-warning)}.catalog-browser .replica-status-danger{background:var(--color-danger-soft);color:var(--color-danger)}.catalog-browser .catalog-meta-busy{background:var(--color-warning-soft);color:var(--color-warning-text)}.catalog-actions{flex:none;justify-content:flex-end}.catalog-actions button,.catalog-replace{border-radius:var(--radius-pill)}.settings-view{margin-top:4px}.settings-page-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px}.settings-page-actions button{min-height:40px;padding:0 16px;border:1px solid var(--color-primary);border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-on-primary);font-weight:600;cursor:pointer}.settings-page-actions button:hover:not(:disabled){background:var(--color-primary-hover)}.settings-page-actions button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.settings-page-actions label{display:inline-flex;align-items:center;gap:8px;color:var(--color-text-2);font-size:var(--font-size-sm);cursor:pointer}.settings-page-actions input{width:17px;height:17px;accent-color:var(--color-primary)}.settings-page-actions [role=status]{color:var(--color-text-2);font-size:var(--font-size-sm)}.settings-page-actions [role=alert]{color:var(--color-danger);font-size:var(--font-size-sm)}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.settings-section{min-width:0;padding:24px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-card);box-shadow:var(--shadow-sm)}.settings-section-wide{grid-column:1 / -1}.settings-section-head{padding-bottom:18px;border-bottom:1px solid var(--color-border)}.settings-section-head h3{margin:0 0 6px;font-size:var(--font-size-xl)}.settings-section-head p{margin:0;color:var(--color-text-2);font-size:var(--font-size-sm)}.settings-section .cache-setting,.settings-section .device-setting,.settings-section .diagnostics-setting{margin-top:18px;padding-top:0;border-top:0}.settings-section .about-setting{margin-top:18px}.settings-section button,.backup-jobs-card button{min-height:40px;padding:0 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius-pill);background:var(--color-card);color:var(--color-text);cursor:pointer}.settings-section button:hover:not(:disabled),.backup-jobs-card button:hover:not(:disabled){border-color:var(--color-primary);background:var(--color-primary-light);color:var(--color-primary-hover)}.settings-section button:disabled,.backup-jobs-card button:disabled{opacity:var(--state-disabled-opacity);cursor:default}.settings-section a{overflow-wrap:anywhere}.backup-jobs-card{margin-bottom:20px;padding:20px 24px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-card)}.backup-jobs-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.backup-jobs-head h3{margin:0 0 5px;font-size:var(--font-size-xl)}.backup-jobs-head p{margin:0;color:var(--color-text-2);font-size:var(--font-size-sm)}.backup-jobs-card .library-list{margin-bottom:0}.library-route-status{margin:0 0 16px;padding:10px 14px;border-radius:var(--radius-card-sm);background:var(--color-primary-light);color:var(--color-text-2);font-size:var(--font-size-sm)}.playlist-card{margin-top:14px;padding:16px;border:1px solid var(--color-border);border-radius:12px}.playlist-heading h4{margin:0}.library-card button:focus-visible,.library-card input:focus-visible,.library-card select:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.player-card{margin-top:22px;padding:28px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-card)}.player-card h2{margin:8px 0 18px;font-size:23px}.player-card button,.player-card select,.player-card input{min-height:42px;border:1px solid var(--color-border-strong);border-radius:9px;padding:8px 12px;background:var(--color-card);color:var(--color-text);font:inherit}.player-card button{cursor:pointer}.player-card button:hover:not(:disabled){background:var(--color-hover-bg)}.player-card button:disabled{opacity:.45;cursor:default}.player-current{display:flex;align-items:center;gap:18px}.player-current img{flex:none;border-radius:12px}.player-current strong{font-size:20px}.player-current p{color:var(--color-text-2)}.player-controls,.lyric-offset{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:16px 0}.player-controls label,.lyric-offset label{display:inline-flex;align-items:center;gap:8px}.player-card audio{display:block;width:100%}.lyrics-panel,.history-panel{margin-top:20px;border-top:1px solid var(--color-border);padding-top:12px}.lyrics-lines{max-height:280px;overflow-y:auto;padding:8px 16px;border-radius:12px;background:var(--color-bg)}.lyrics-lines p{margin:8px 0;color:var(--color-text-2)}.lyrics-lines .active-lyric{color:var(--color-primary);font-weight:700}.history-panel ol{max-height:260px;overflow-y:auto;padding-left:24px}.history-panel li{margin:5px 0}.library-subnav{display:flex;align-items:center;gap:36px;height:48px;margin:-28px -32px 0;padding:0 32px;background:var(--color-card);border-bottom:1px solid var(--color-border)}.library-subnav button{position:relative;display:flex;align-items:center;height:48px;padding:0;border:0;background:transparent;color:var(--color-text-2);font-size:var(--font-size-md);cursor:pointer}.library-subnav button:hover{color:var(--color-text)}.library-subnav button.active{color:var(--color-text);font-weight:600}.library-subnav button.active:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:24px;height:3px;border-radius:2px;background:var(--color-primary)}.section-head{display:flex;align-items:baseline;gap:16px;margin:28px 0 20px}.section-head h2{margin:0;font-size:var(--font-size-xxl);font-weight:700}.section-head span{color:var(--color-text-3);font-size:var(--font-size-sm);cursor:pointer}.section-head span:hover{color:var(--color-primary)}.card-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}.pl-card{display:block;color:inherit;text-decoration:none;cursor:pointer}.pl-cover{position:relative;aspect-ratio:1;border-radius:var(--radius-card-sm);overflow:hidden;box-shadow:var(--shadow-md)}.pl-cover .art{position:absolute;inset:0}.pl-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.25),transparent 40%)}.pl-play{position:absolute;right:10px;bottom:10px;z-index:2;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fffffff2;color:var(--color-primary);opacity:0;transform:translateY(6px);transition:all .2s;box-shadow:0 2px 10px #0003}.pl-card:hover .pl-play{opacity:1;transform:translateY(0)}.pl-count{position:absolute;left:10px;bottom:8px;z-index:2;display:flex;align-items:center;gap:4px;color:var(--color-on-primary);font-size:var(--font-size-xs);text-shadow:0 1px 3px rgba(0,0,0,.4)}.pl-name{margin-top:10px;font-size:var(--font-size-md);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pl-card:hover .pl-name{color:var(--color-primary)}.song-table{margin-top:36px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-card);overflow:hidden}.st-head,.st-row{display:grid;grid-template-columns:56px 1fr 200px 180px 90px;align-items:center;padding:0 20px}.st-head{height:46px;color:var(--color-text-3);font-size:var(--font-size-sm);border-bottom:1px solid var(--color-border)}.st-row{height:56px;cursor:pointer}.st-row:hover{background:var(--color-hover-bg)}.st-row:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}.st-row.playing{color:var(--color-primary)}.st-idx{color:var(--color-text-3)}.st-row.playing .st-idx{color:var(--color-primary);font-weight:700}.st-title{display:flex;align-items:center;gap:8px;min-width:0}.st-title .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tag{flex:none;padding:1px 5px;border:1px solid var(--color-primary);border-radius:var(--radius-tag);color:var(--color-primary);font-size:10px;line-height:1.5}.tag.gray{border-color:var(--color-border-strong);color:var(--color-text-3)}.st-artist,.st-album{color:var(--color-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.st-row.playing .st-artist,.st-row.playing .st-album{color:var(--color-primary);opacity:.75}.st-dur{color:var(--color-text-3);text-align:right}.st-empty{margin:0;padding:24px 20px;color:var(--color-text-2)}.pd-bg{position:fixed;inset:-60px;z-index:-2;filter:blur(70px) saturate(1.1)}.pd-blob{position:absolute;border-radius:50%}.pd-blob.b1{width:70vw;height:70vw;left:-15vw;top:-20vw}.pd-blob.b2{width:55vw;height:55vw;right:-12vw;top:5vh;opacity:.85}.pd-blob.b3{width:60vw;height:60vw;left:15vw;bottom:-35vw}.pd-blob.b4{width:40vw;height:40vw;right:10vw;bottom:-10vw;opacity:.7}.pd-veil{position:fixed;inset:0;z-index:-1;background:#fafbf7}.pd-topbar{display:flex;align-items:center;flex-wrap:wrap;gap:20px;padding-bottom:18px}.pd-back{display:inline-flex;align-items:center;gap:6px;color:var(--color-text-2);font-size:var(--font-size-md);text-decoration:none}.pd-back:hover{color:var(--color-primary)}.pd-missing{color:var(--color-text-2)}.pd-actions{display:flex;flex-wrap:wrap;gap:12px}.act-btn{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 16px;border:1px solid var(--color-border-strong);border-radius:var(--radius-pill);background:#ffffff8c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--color-text-2);font-size:var(--font-size-sm);cursor:pointer;transition:all .15s}.act-btn:hover:not(:disabled){color:var(--color-primary);border-color:var(--color-primary);background:#ffffffd9}.act-btn.primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-on-primary);font-weight:600}.act-btn.primary:hover:not(:disabled){background:var(--color-primary-hover)}.act-btn:disabled{opacity:var(--state-disabled-opacity);cursor:default}.pd-main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:start}.pd-list-title{display:flex;align-items:baseline;gap:12px;padding:4px 0 14px}.pd-list-title h1{margin:0;font-size:var(--font-size-xxl)}.pd-list-title span{color:var(--color-text-2);font-size:var(--font-size-sm)}.pd-list .st-head,.pd-list .st-row{grid-template-columns:48px minmax(0,1fr) 150px 80px;padding:0 14px}.pd-list .st-head{height:40px;border-bottom:0}.pd-list .st-row{height:52px;border-radius:8px}.pd-list .st-row:hover{background:#ffffff8c}.pd-list-scroll{max-height:calc(100vh - 340px);overflow-y:auto}.pd-list-scroll::-webkit-scrollbar{width:8px}.pd-list-scroll::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:4px}.pd-side{padding:10px 8px 20px 0;text-align:center}.pd-cover{display:grid;place-items:center;width:220px;height:220px;margin:6px auto 18px;border-radius:var(--radius-card);box-shadow:0 14px 40px #465a3259;color:#ffffffd9;font-size:54px}.pd-now h2{margin:0;font-size:var(--font-size-title)}.pd-now p{margin:5px 0 0;color:var(--color-text-2);font-size:var(--font-size-sm)}.pd-lyrics{margin-top:26px;max-height:300px;overflow-y:auto;line-height:2.3;color:var(--color-text-3);font-size:var(--font-size-md)}.pd-lyrics p{margin:0}.pd-lyrics .cur{color:var(--color-primary);font-weight:600;font-size:var(--font-size-lg)}.pd-lyrics-empty{color:var(--color-text-3)}.pd-player-host{display:none}@media(max-width:640px){.app-topbar{padding:0 16px;gap:20px}.shell-main,.shell-banners{padding-left:16px;padding-right:16px}.status-card{align-items:flex-start;flex-wrap:wrap}.status-card button{margin-left:27px}.search-card{padding:22px 16px}.search-heading{align-items:flex-start;flex-direction:column;gap:14px}.search-controls>div{flex-direction:column}.search-results li{align-items:flex-start}.search-results button{padding:0 12px}.library-card,.settings-card,.player-card{padding:22px 16px}.library-list li,.playlist-heading{align-items:flex-start;flex-direction:column}}.song-unavailable{display:inline-block;margin-left:.5rem;padding:0 .45rem;border-radius:var(--radius-pill);background:var(--color-warning-bg);color:var(--color-warning-text);font-size:.75rem;font-weight:600;cursor:help}
