:root{--font-ui:"SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;--font-display:"SF Pro Display", "Helvetica Neue", Helvetica, Arial, sans-serif;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:2.5rem;--radius-sm:.5rem;--radius-md:.875rem;--radius-lg:1.125rem;--radius-xl:1.5rem;--radius-pill:999px;--shadow-soft:0 8px 24px #0f172a14;--shadow-panel:0 18px 48px #0f172a24;--shadow-focus:0 0 0 3px #e4091440;--motion-ease:cubic-bezier(.2, 0, .1, 1);--motion-fast:.16s var(--motion-ease);--motion-base:.28s var(--motion-ease);--z-base:1;--z-header:20;--z-player:30;--z-overlay:100;--glass-blur:blur(14px);--panel-glass-solid:10%;--color-brand:#fa233b;--color-brand-strong:#d90d28;--color-text:#111827;--color-text-muted:#4b5563;--color-bg:#f7f8fb;--color-bg-elevated:#ffffffbd;--color-bg-solid:#fff;--color-bg-flow-1:#fa233b33;--color-bg-flow-2:#0ea5e92e;--color-bg-flow-3:#fb923c29;--color-border:#0f172a14;--color-input:#ffffffd1}:root[data-theme=dark]{--color-brand:#ff4b61;--color-brand-strong:#ff6a7d;--color-text:#f1f5f9;--color-text-muted:#a7b4c8;--color-bg:#090d14;--color-bg-elevated:#0f172ab8;--color-bg-solid:#131b2b;--color-bg-flow-1:#ff4b6133;--color-bg-flow-2:#2dd4bf29;--color-bg-flow-3:#38bdf824;--color-border:#94a3b847;--color-input:#1e293bb3;--shadow-soft:0 8px 28px #0206176b;--shadow-panel:0 18px 52px #0206179e;--shadow-focus:0 0 0 3px #ff6a7d4d}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}:root{--bg-intensity-hue-1:12deg;--bg-intensity-hue-2:-10deg;--bg-intensity-hue-3:16deg;--bg-intensity-sat-1:1.08;--bg-intensity-sat-2:1.06;--bg-intensity-sat-3:1.1;--bg-intensity-bright-1:1.01;--bg-intensity-bright-2:.99;--bg-intensity-bright-3:1.02;--bg-intensity-opacity-base:.94;--bg-intensity-opacity-peak:.99}:root[data-bg-intensity=vivid]{--bg-intensity-hue-1:34deg;--bg-intensity-hue-2:-28deg;--bg-intensity-hue-3:42deg;--bg-intensity-sat-1:1.22;--bg-intensity-sat-2:1.18;--bg-intensity-sat-3:1.26;--bg-intensity-bright-1:1.04;--bg-intensity-bright-2:.96;--bg-intensity-bright-3:1.06;--bg-intensity-opacity-base:.97;--bg-intensity-opacity-peak:1}body{font-family:var(--font-ui);color:var(--color-text);background:var(--color-bg);isolation:isolate;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;position:relative;overflow-x:hidden}body:before{content:"";z-index:0;pointer-events:none;background:radial-gradient(circle at 18% 14%, var(--color-bg-flow-1), transparent 44%), radial-gradient(circle at 84% 12%, var(--color-bg-flow-2), transparent 42%), radial-gradient(circle at 54% 86%, var(--color-bg-flow-3), transparent 46%), linear-gradient(135deg, color-mix(in srgb, var(--color-bg) 92%, #fff 8%) 0%, var(--color-bg) 100%);transform-origin:50%;will-change:filter, opacity, transform;background-size:160% 160%,150% 150%,170% 170%,100% 100%;animation:18s ease-in-out infinite bg-color-cycle,26s ease-in-out infinite alternate bg-breathe;position:fixed;inset:-32vmax}#root{z-index:1;position:relative}@keyframes bg-color-cycle{0%{filter:hue-rotate()saturate()brightness();opacity:var(--bg-intensity-opacity-base)}25%{filter:hue-rotate(var(--bg-intensity-hue-1)) saturate(var(--bg-intensity-sat-1)) brightness(var(--bg-intensity-bright-1));opacity:var(--bg-intensity-opacity-peak)}50%{filter:hue-rotate(var(--bg-intensity-hue-2)) saturate(var(--bg-intensity-sat-2)) brightness(var(--bg-intensity-bright-2));opacity:calc(var(--bg-intensity-opacity-base) - .02)}75%{filter:hue-rotate(var(--bg-intensity-hue-3)) saturate(var(--bg-intensity-sat-3)) brightness(var(--bg-intensity-bright-3));opacity:var(--bg-intensity-opacity-peak)}to{filter:hue-rotate()saturate()brightness();opacity:var(--bg-intensity-opacity-base)}}@keyframes bg-breathe{0%{transform:scale(1)rotate(0)}to{transform:scale(1.035)rotate(1deg)}}@media (prefers-reduced-motion:reduce){body:before{animation:none}}h1,h2,h3,p{margin:0}button,input{font:inherit}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{box-shadow:var(--shadow-focus);outline:none}.muted{color:var(--color-text-muted)}.ui-button{border-radius:var(--radius-pill);cursor:pointer;transition:transform var(--motion-fast), background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast);border:1px solid #0000;padding:.625rem 1rem;font-weight:600}.ui-button:hover{transform:translateY(-1px)}.ui-button:active{transform:scale(.98)}.ui-button:focus-visible,.ui-icon-button:focus-visible,.ui-input:focus-visible{box-shadow:var(--shadow-focus);outline:none}.ui-button--sm{padding:.45rem .8rem;font-size:.86rem}.ui-button--primary{color:#fff;background:var(--color-brand)}.ui-button--primary:hover{background:var(--color-brand-strong)}.ui-button--secondary{color:var(--color-brand);border-color:color-mix(in srgb, var(--color-brand) 35%, transparent);background:color-mix(in srgb, var(--color-brand) 10%, transparent)}.ui-button--ghost{color:var(--color-text);border-color:var(--color-border);background:0 0}.ui-icon-button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 75%, transparent);width:2.25rem;height:2.25rem;color:var(--color-text-muted);cursor:pointer;transition:transform var(--motion-fast), background-color var(--motion-fast);border-radius:50%}.ui-icon-button:hover{transform:translateY(-1px)}.ui-icon-button:active{transform:scale(.96)}.ui-card{border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-bg-elevated);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-soft);padding:var(--space-5);transition:transform var(--motion-base), box-shadow var(--motion-base)}.ui-card:hover{box-shadow:var(--shadow-panel);transform:translateY(-2px)}.ui-input-wrap{gap:var(--space-2);display:grid}.ui-input-label{color:var(--color-text-muted);font-size:.875rem}.ui-input{border:1px solid var(--color-border);background:var(--color-input);width:100%;color:var(--color-text);border-radius:var(--radius-md);padding:.66rem .8rem}#root{min-height:100svh;padding:var(--space-6);padding-bottom:130px}.fullscreen-toggle-hover-zone{top:var(--space-4);right:var(--space-4);z-index:120;justify-content:center;align-items:center;width:44px;height:44px;display:flex;position:fixed}.fullscreen-toggle-fixed{border:1px solid color-mix(in srgb, var(--color-brand) 24%, var(--color-border));border-radius:var(--radius-pill);background:color-mix(in srgb, var(--color-bg-solid) 84%, transparent);width:38px;height:38px;color:var(--color-text);box-shadow:var(--shadow-soft);cursor:pointer;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);opacity:0;pointer-events:none;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast), opacity var(--motion-fast);justify-content:center;align-items:center;padding:0;display:inline-flex;transform:translateY(-2px)scale(.92)}.fullscreen-toggle-hover-zone:hover .fullscreen-toggle-fixed,.fullscreen-toggle-hover-zone:focus-within .fullscreen-toggle-fixed,.fullscreen-toggle-fixed:focus-visible{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.fullscreen-toggle-fixed:hover:not(:disabled){border-color:color-mix(in srgb, var(--color-brand) 48%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid));transform:translateY(-1px)}.fullscreen-toggle-fixed:active:not(:disabled){transform:scale(.97)}.fullscreen-toggle-fixed:focus-visible{box-shadow:var(--shadow-focus);outline:none}.fullscreen-toggle-fixed:disabled{cursor:not-allowed;opacity:.65}.app-shell{gap:var(--space-4);grid-template-columns:minmax(220px,.9fr) minmax(520px,2fr) minmax(0,0fr);width:min(1380px,100%);height:calc(100svh - 170px);min-height:560px;margin:0 auto;transition:grid-template-columns .26s cubic-bezier(.22,1,.36,1);display:grid}@media (width<=768px){.fullscreen-toggle-hover-zone{top:var(--space-3);right:var(--space-3);width:40px;height:40px}.fullscreen-toggle-fixed{width:34px;height:34px}}@media (hover:none){.fullscreen-toggle-fixed{opacity:.28;pointer-events:auto;border-color:color-mix(in srgb, var(--color-border) 82%, transparent);background:color-mix(in srgb, var(--color-bg-solid) 42%, transparent);box-shadow:none;color:color-mix(in srgb, var(--color-text) 62%, transparent);transform:translateY(0)scale(1)}.fullscreen-toggle-hover-zone:active .fullscreen-toggle-fixed,.fullscreen-toggle-fixed:active:not(:disabled),.fullscreen-toggle-fixed:focus-visible{opacity:.92;border-color:color-mix(in srgb, var(--color-brand) 52%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 14%, var(--color-bg-solid));box-shadow:var(--shadow-soft);color:var(--color-text)}}.app-shell--queue-open{transition:grid-template-columns .42s var(--motion-ease);grid-template-columns:minmax(220px,.9fr) minmax(520px,2fr) minmax(240px,1fr)}.app-shell--tri-layout{align-items:stretch}.app-left-column,.app-center-column,.app-right-column{border:1px solid var(--color-border);background:linear-gradient(155deg, color-mix(in srgb, var(--color-bg-solid) var(--panel-glass-solid), transparent), color-mix(in srgb, var(--color-bg-solid) var(--panel-glass-solid), transparent));height:100%;min-height:0;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-panel);transition:border-color var(--motion-base);border-radius:28px;flex-direction:column;display:flex}.app-left-column,.app-right-column{padding:0;overflow:hidden}.app-center-column{min-width:0;overflow:hidden}.app-left-column,.app-center-column{transition:transform .26s cubic-bezier(.22,1,.36,1);transform:translate(0)scale(1)}.app-shell--queue-open .app-left-column{transition:transform .42s var(--motion-ease);transform:translate(-4px)scale(.994)}.app-shell--queue-open .app-center-column{transition:transform .42s var(--motion-ease);transform:translate(-2px)scale(.996)}.app-right-column{opacity:0;pointer-events:none;visibility:hidden;transition:transform .24s cubic-bezier(.22,1,.36,1),opacity .2s cubic-bezier(.22,1,.36,1),visibility 0s linear .24s;transform:translate(20px)scale(.985)}.app-right-column.app-right-column--visible{opacity:1;pointer-events:auto;visibility:visible;transition:transform .46s var(--motion-ease), opacity .38s var(--motion-ease), visibility 0s linear 0s;transform:translate(0)scale(1)}.main-content-scroll{scrollbar-gutter:stable;height:100%;min-height:0;overflow:hidden auto}.main-content-scroll,.lyric-panel-body,.queue-list{scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--color-border) 78%, var(--color-bg-solid)) transparent}.main-content-scroll::-webkit-scrollbar{width:8px}.lyric-panel-body::-webkit-scrollbar{width:8px}.queue-list::-webkit-scrollbar{width:8px}.main-content-scroll::-webkit-scrollbar-track{background:0 0}.lyric-panel-body::-webkit-scrollbar-track{background:0 0}.queue-list::-webkit-scrollbar-track{background:0 0}.main-content-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--color-border) 78%, var(--color-bg-solid));border-radius:var(--radius-pill)}.lyric-panel-body::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--color-border) 78%, var(--color-bg-solid));border-radius:var(--radius-pill)}.queue-list::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--color-border) 78%, var(--color-bg-solid));border-radius:var(--radius-pill)}.brand-mark{font-family:var(--font-display);letter-spacing:-.01em;font-weight:650}.sidebar-nav{gap:var(--space-2);display:grid}.sidebar-nav-item{text-align:left;border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;background:0 0;border:0;padding:.55rem .65rem}.sidebar-nav-item:hover{background:color-mix(in srgb, var(--color-bg-solid) 88%, var(--color-brand) 12%)}.sidebar-card{padding:var(--space-4)}.app-frame{min-width:0;display:block}.layout-header{z-index:var(--z-header);justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 68%, transparent);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:flex;position:sticky;top:0}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-size:.78rem;font-weight:600}.headline{font-family:var(--font-display);letter-spacing:-.02em;font-size:clamp(1.35rem,2vw,1.8rem)}.header-actions{align-items:center;gap:var(--space-2);display:flex}.settings-icon{margin-left:var(--space-1)}.content-tabs{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6) 0;display:flex}.content-tabs-nav,.content-tabs-actions{align-items:center;gap:var(--space-2);display:inline-flex}.content-opacity-control{align-items:center;gap:var(--space-2);border-radius:var(--radius-pill);border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 78%, transparent);height:34px;padding:0 .35rem;display:inline-flex}.content-opacity-value{text-align:right;width:38px;color:var(--color-text-muted);font-size:.72rem;font-weight:600}.content-opacity-slider{width:92px;accent-color:var(--color-brand);cursor:pointer}.content-opacity-slider:focus-visible{outline:none}.content-tab{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 72%, transparent);color:var(--color-text-muted);border-radius:var(--radius-pill);cursor:pointer;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast), color var(--motion-fast);padding:.36rem .82rem;font-weight:600}.content-tab:hover{border-color:color-mix(in srgb, var(--color-brand) 28%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 10%, var(--color-bg-solid));color:var(--color-text);transform:translateY(-1px)}.content-tab:active{transform:scale(.97)}.content-tab:focus-visible{box-shadow:var(--shadow-focus);outline:none}.content-tab--active{color:var(--color-text);border-color:color-mix(in srgb, var(--color-brand) 32%, transparent);background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid))}.content-view{display:block}.content-view--hidden{display:none}.content-theme-toggle{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 82%, transparent);width:34px;height:34px;color:var(--color-text);cursor:pointer;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast);border-radius:50%;justify-content:center;align-items:center;font-size:.95rem;display:inline-flex}.content-theme-toggle:hover{border-color:color-mix(in srgb, var(--color-brand) 35%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid));transform:translateY(-1px)}.content-theme-toggle:active{transform:scale(.96)}.content-theme-toggle:focus-visible{box-shadow:var(--shadow-focus);outline:none}.content-theme-toggle--active{border-color:color-mix(in srgb, var(--color-brand) 42%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 14%, var(--color-bg-solid))}.content-logout-button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 82%, transparent);width:34px;height:34px;color:var(--color-text-muted);cursor:pointer;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast), color var(--motion-fast);border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.95rem;display:inline-flex}.content-logout-button:hover{border-color:color-mix(in srgb, #ef4444 42%, var(--color-border));background:color-mix(in srgb, #ef4444 12%, var(--color-bg-solid));color:color-mix(in srgb, #ef4444 88%, var(--color-text));transform:translateY(-1px)}.content-logout-button:active{transform:scale(.96)}.content-logout-button:focus-visible{outline:none;box-shadow:0 0 0 3px #ef444440}.layout-main{padding:var(--space-6);align-content:start;gap:var(--space-5);display:grid}.hero-panel{gap:var(--space-2);display:grid}.hero-panel h2{font-family:var(--font-display);letter-spacing:-.02em}.grid-panels{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.stack-row{margin-top:var(--space-4);gap:var(--space-3);display:flex}.layout-player{left:50%;bottom:max(14px, env(safe-area-inset-bottom));width:min(1240px, calc(100% - var(--space-8)));min-width:650px;z-index:var(--z-player);border:1px solid var(--color-border);padding:var(--space-3) var(--space-5);align-items:center;gap:var(--space-4);background:color-mix(in srgb, var(--color-bg-solid) 82%, transparent);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-panel);border-radius:20px;grid-template-columns:minmax(0,1fr) minmax(360px,1.3fr) minmax(0,1fr);display:grid;position:fixed;transform:translate(-50%)}.player-left,.player-center,.player-right{min-width:0}.player-left{align-items:center;gap:var(--space-3);display:flex}.player-cover{background:linear-gradient(150deg,#f43f5e,#2563eb) 50%/cover;border-radius:10px;flex-shrink:0;width:44px;height:44px;position:relative;overflow:hidden}.player-cover:after{content:"▶";color:#fff;opacity:0;transition:opacity var(--motion-fast), transform var(--motion-fast);background:#0a0e176b;place-items:center;font-size:.74rem;display:grid;position:absolute;inset:0;transform:scale(.96)}.player-left:hover .player-cover:after{opacity:1;transform:scale(1)}.player-track-meta{min-width:0}.player-track-title,.player-track-artist{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.player-track-title{font-size:.9rem;font-weight:600}.player-track-artist{color:var(--color-text-muted);margin-top:2px;font-size:.8rem}.player-center{gap:var(--space-2);display:grid}.player-controls{justify-content:center;align-items:center;gap:var(--space-2);display:flex}.player-loop-button{border-radius:50%;justify-content:center;align-items:center;width:34px;min-width:34px;padding:0;font-size:.88rem;display:inline-flex}.player-loop-icon{letter-spacing:-.02em;opacity:.9;font-weight:600}.player-favorite-button{border-radius:50%;justify-content:center;align-items:center;width:34px;min-width:34px;padding:0;font-size:.95rem;display:inline-flex}.player-favorite-button--active{color:#f43f5e;background:color-mix(in srgb, #f43f5e 14%, var(--color-bg-solid));border-color:#f43f5e}.player-icon-button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 80%, transparent);color:var(--color-text);cursor:pointer;width:34px;height:34px;transition:transform var(--motion-fast), background-color var(--motion-fast), border-color var(--motion-fast);border-radius:50%}.player-icon-svg{fill:none;stroke:currentColor;stroke-width:2.3px;pointer-events:none;opacity:1;width:17px;height:17px}.player-icon-button--play .player-icon-svg{width:18px;height:18px;transform:translateY(2px)}.player-icon-glyph{letter-spacing:-.05em;opacity:1;pointer-events:none;font-size:.78rem;font-weight:800;line-height:1}.player-icon-button:hover{transform:translateY(-1px)}.player-icon-button:active{transform:scale(.96)}.player-icon-button:disabled{opacity:.5;cursor:not-allowed}.player-icon-button--play{border-color:color-mix(in srgb, var(--color-brand) 42%, transparent);background:color-mix(in srgb, var(--color-brand) 16%, var(--color-bg-solid));width:38px;height:38px}.player-icon-button--play:hover{transform:scale(1.03)}.player-progress{align-items:center;gap:var(--space-2);grid-template-columns:44px 1fr 44px;display:grid}.player-time{text-align:center;color:var(--color-text-muted);font-size:.72rem}.player-progress-range,.player-volume-range{accent-color:var(--color-brand)}.player-right{justify-content:flex-end;align-items:center;gap:var(--space-2);display:flex}.player-volume{align-items:center;gap:var(--space-2);display:flex}.player-volume-range{width:120px}@media (width<=1800px){.layout-player{gap:var(--space-3);padding:var(--space-3) var(--space-4);grid-template-columns:minmax(0,.95fr) minmax(320px,1.25fr) minmax(0,.9fr)}.player-controls{gap:.4rem}.player-volume-range{width:96px}}@media (width<=1500px){.layout-player{grid-template-columns:minmax(0,.95fr) minmax(280px,1.2fr) minmax(0,.85fr)}.player-icon-button{width:32px;height:32px}.player-icon-button--play{width:36px;height:36px}.player-loop-button,.player-favorite-button{width:32px;min-width:32px}.player-right,.player-volume{gap:var(--space-1)}.player-volume-range{width:80px}}.search-page-main{gap:var(--space-4)}.search-hero-panel{gap:var(--space-1)}.search-bar{gap:var(--space-3);grid-template-columns:1fr auto auto;align-items:center;display:grid}.search-input{border-radius:var(--radius-pill);border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 80%, transparent);width:100%;color:var(--color-text);padding:.72rem 1rem}.search-input:focus-visible{box-shadow:var(--shadow-focus);outline:none}.search-submit-button{justify-content:center;align-items:center;min-width:110px;display:inline-flex}.search-submit-icon{width:1.2rem;height:1.2rem;display:block}.search-source-wrap{z-index:3;min-width:148px;position:relative}.search-source-trigger{border-radius:var(--radius-pill);border:1px solid var(--color-border);background:linear-gradient(160deg, color-mix(in srgb, var(--color-bg-solid) 92%, transparent), color-mix(in srgb, var(--color-bg-solid) 74%, transparent));width:100%;min-width:148px;color:var(--color-text);justify-content:space-between;align-items:center;gap:var(--space-2);cursor:pointer;transition:border-color var(--motion-fast), transform var(--motion-fast), box-shadow var(--motion-fast);padding:.64rem .95rem;font-weight:600;line-height:1.2;display:flex;box-shadow:inset 0 1px #ffffff59}.search-source-trigger:hover{border-color:color-mix(in srgb, var(--color-brand) 34%, var(--color-border));transform:translateY(-1px)}.search-source-trigger:focus-visible{border-color:color-mix(in srgb, var(--color-brand) 42%, var(--color-border));box-shadow:var(--shadow-focus);outline:none}.search-source-trigger-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.search-source-chevron{color:var(--color-text-muted);transition:transform var(--motion-fast);flex-shrink:0;font-size:.76rem}.search-source-wrap--open .search-source-chevron{transform:rotate(180deg)}.search-source-menu{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 95%, transparent);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-panel);animation:source-menu-in var(--motion-fast) ease-out;border-radius:14px;padding:4px;display:grid;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow:hidden}.search-source-option{color:var(--color-text);text-align:left;cursor:pointer;transition:background-color var(--motion-fast), color var(--motion-fast);background:0 0;border:0;border-radius:10px;padding:.5rem .62rem;font-weight:500}.search-source-option:hover{background:color-mix(in srgb, var(--color-brand) 12%, transparent)}.search-source-option--active{background:color-mix(in srgb, var(--color-brand) 15%, var(--color-bg-solid));color:var(--color-brand-strong);font-weight:600}@keyframes source-menu-in{0%{opacity:0;transform:translateY(-6px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.search-pagination{justify-content:center;align-items:center;gap:var(--space-3);display:flex}.search-pagination-button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 84%, transparent);color:var(--color-text);cursor:pointer;width:34px;height:34px;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast);border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.94rem;font-weight:600;display:inline-flex}.search-pagination-button:hover:not(:disabled){border-color:color-mix(in srgb, var(--color-brand) 32%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid));transform:translateY(-1px)}.search-pagination-button:active:not(:disabled){transform:scale(.97)}.search-pagination-button:focus-visible{box-shadow:var(--shadow-focus);outline:none}.search-pagination-button:disabled{opacity:.45;cursor:not-allowed}.search-pagination-status{text-align:center;min-width:30px;color:var(--color-text);font-size:.9rem;font-weight:600}.search-results{border-radius:var(--radius-xl);border:1px solid var(--color-border);background:var(--color-bg-elevated);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-soft);transition:transform var(--motion-base), box-shadow var(--motion-base);overflow:hidden}.search-results:hover,.lyric-panel:hover,.library-section:hover,.queue-panel:hover{box-shadow:var(--shadow-panel);transform:translateY(-2px)}.search-state{border-radius:var(--radius-lg);border:1px dashed var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 70%, transparent);color:var(--color-text-muted);padding:var(--space-5)}.search-state--loading,.search-state--error{border-style:solid}.search-state--error{color:color-mix(in srgb, var(--color-brand-strong) 82%, var(--color-text))}.song-row{border:0;border-top:1px solid #0000;border-bottom:1px solid var(--color-border);width:100%;color:inherit;padding:.88rem var(--space-4);align-items:center;gap:var(--space-3);text-align:left;cursor:pointer;transition:background-color var(--motion-fast), border-color var(--motion-fast);background:0 0;grid-template-columns:34px 38px 1fr auto auto;display:grid}.song-row:last-child{border-bottom:0}.song-row:hover{background:color-mix(in srgb, var(--color-brand) 8%, var(--color-bg-solid))}.song-row--active{border-top-color:color-mix(in srgb, var(--color-brand) 28%, transparent);border-bottom-color:color-mix(in srgb, var(--color-brand) 28%, transparent);background:color-mix(in srgb, var(--color-brand) 13%, var(--color-bg-solid))}.song-cover{background:linear-gradient(145deg,#f43f5e,#0ea5e9) 50%/cover;border-radius:8px;width:38px;height:38px;position:relative;overflow:hidden}.song-cover-overlay{color:#fff;opacity:0;transition:opacity var(--motion-fast), transform var(--motion-fast);background:#0a0e1773;place-items:center;font-size:.76rem;display:grid;position:absolute;inset:0;transform:scale(.96)}.song-row:hover .song-cover-overlay,.song-row--active .song-cover-overlay{opacity:1;transform:scale(1)}.song-row-index{color:var(--color-text-muted);font-size:.86rem;font-weight:600}.song-row-main{min-width:0}.song-row-title{letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.song-row-meta{color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:.86rem;overflow:hidden}.song-row-duration{color:var(--color-text-muted);font-size:.84rem}.song-row-badge{letter-spacing:.08em;text-transform:uppercase;color:var(--color-brand-strong);font-size:.72rem;font-weight:700}.song-row-actions{align-items:center;gap:var(--space-2);opacity:0;transition:opacity var(--motion-fast);pointer-events:none;display:flex}.song-row:hover .song-row-actions,.song-row--active .song-row-actions{opacity:1;pointer-events:auto}.song-row-action-button{border:1px solid var(--color-border);width:28px;height:28px;color:var(--color-text-muted);cursor:pointer;transition:all var(--motion-fast);background:0 0;border-radius:6px;justify-content:center;align-items:center;padding:0;font-size:.88rem;display:flex}.song-row-action-button:hover{border-color:var(--color-brand);background:color-mix(in srgb, var(--color-brand) 12%, transparent);color:var(--color-brand);transform:scale(1.08)}.song-row-action-button:active{transform:scale(.96)}.song-row-favorite-button--active{color:#f43f5e;background:#f43f5e26;border-color:#f43f5e}.song-row-download-button{color:var(--color-text-muted)}.song-row-playlist-container{position:relative}.song-row-playlist-dropdown{background:var(--color-bg-solid);border:1px solid var(--color-border);z-index:100;min-width:160px;animation:slideDown var(--motion-fast) ease-out;border-radius:8px;margin-top:4px;position:absolute;top:100%;right:0;overflow:hidden;box-shadow:0 4px 12px #00000026}.song-row-playlist-dropdown--up{animation:slideUp var(--motion-fast) ease-out;margin-top:0;margin-bottom:4px;top:auto;bottom:100%}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.song-row-playlist-item{width:100%;padding:var(--space-2) var(--space-3);color:var(--color-text);text-align:left;cursor:pointer;transition:all var(--motion-fast);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:0;font-size:.9rem;overflow:hidden}.song-row-playlist-item:hover{background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid));color:var(--color-brand)}.song-row-playlist-empty{padding:var(--space-2) var(--space-3);color:var(--color-text-muted);text-align:center;font-size:.9rem}.song-row-default-playlist-item{background:color-mix(in srgb, var(--color-brand) 8%, var(--color-bg-solid));font-weight:500}.song-row-default-playlist-item:hover{background:color-mix(in srgb, var(--color-brand) 16%, var(--color-bg-solid))}.song-row-playlist-divider{background:var(--color-border);height:1px;margin:var(--space-1) 0}.lyric-panel{border-radius:inherit;height:100%;min-height:0;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:none;transition:transform var(--motion-base), box-shadow var(--motion-base);background:0 0;border:0;grid-template-rows:auto 1fr;display:grid;overflow:hidden}.lyric-panel-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border)}.lyric-panel-header h3{margin:0;font-size:.92rem}.lyric-panel-body{min-height:0;padding:var(--space-3) 0;overflow:auto}.lyric-panel-body--empty{place-items:center;display:grid}.lyric-empty{padding:var(--space-4);color:var(--color-text-muted);text-align:center;margin:0}.lyric-lines{gap:2px;display:grid}.lyric-line{color:color-mix(in srgb, var(--color-text-muted) 85%, var(--color-text));text-align:left;cursor:pointer;border-radius:var(--radius-md);margin:0 var(--space-3);transition:color var(--motion-fast), background-color var(--motion-fast), transform var(--motion-fast);background:0 0;border:0;padding:.5rem .68rem}.lyric-line:hover{background:color-mix(in srgb, var(--color-brand) 8%, transparent)}.lyric-line--active{color:var(--color-text);background:color-mix(in srgb, var(--color-brand) 14%, transparent);font-weight:650;transform:translate(2px)}.equalizer{align-items:flex-end;gap:2px;height:12px;display:inline-flex}.equalizer span{background:var(--color-brand-strong);border-radius:2px;width:2px;height:4px;animation:1s ease-in-out infinite equalizer-wave}.equalizer span:nth-child(2){animation-delay:.14s}.equalizer span:nth-child(3){animation-delay:.28s}@keyframes equalizer-wave{0%,to{opacity:.45;height:3px}50%{opacity:1;height:12px}}.queue-panel{border-radius:inherit;height:100%;min-height:0;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:none;transition:transform .24s cubic-bezier(.22, 1, .36, 1), opacity .2s cubic-bezier(.22, 1, .36, 1), box-shadow var(--motion-base);background:0 0;border:0;grid-template-rows:auto 1fr;margin:0;display:grid}.queue-panel--closed{opacity:0;transform:translate(14px)}.queue-panel--open{opacity:1;transition-duration:.42s, .34s, var(--motion-base);transition-timing-function:var(--motion-ease), var(--motion-ease), var(--motion-ease);transform:translate(0)}@keyframes queue-slide-in{0%{opacity:0;transform:translate(22px)}to{opacity:1;transform:translate(0)}}.library-section{border:1px solid var(--color-border);border-radius:var(--radius-xl);background:color-mix(in srgb, var(--color-bg-solid) 76%, transparent);box-shadow:var(--shadow-soft);transition:transform var(--motion-base), box-shadow var(--motion-base)}.library-section-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.library-section-header h3{margin:0}.library-section-header button,.library-row-actions button,.playlist-actions button,.playlist-add button,.page-back-button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 85%, transparent);color:var(--color-text-muted);border-radius:var(--radius-pill);cursor:pointer;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast), color var(--motion-fast);padding:.36rem .66rem;font-size:.78rem}.library-section-header button:hover,.library-row-actions button:hover,.playlist-actions button:hover,.playlist-add button:hover,.page-back-button:hover{border-color:color-mix(in srgb, var(--color-brand) 32%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 11%, var(--color-bg-solid));color:var(--color-text);transform:translateY(-1px)}.library-section-header button:active,.library-row-actions button:active,.playlist-actions button:active,.playlist-add button:active,.page-back-button:active{transform:scale(.97)}.library-section-header button:focus-visible,.library-row-actions button:focus-visible,.playlist-actions button:focus-visible,.playlist-add button:focus-visible,.page-back-button:focus-visible{box-shadow:var(--shadow-focus);outline:none}.library-list{display:grid}.library-empty{padding:var(--space-4);color:var(--color-text-muted);margin:0}.library-row{border-top:1px solid var(--color-border);grid-template-columns:1fr auto;align-items:center;display:grid}.library-row--active{background:color-mix(in srgb, var(--color-brand) 11%, var(--color-bg-solid))}.library-row-main{color:inherit;text-align:left;cursor:pointer;padding:.72rem var(--space-4);background:0 0;border:0;gap:2px;display:grid}.library-row-main:hover{background:color-mix(in srgb, var(--color-brand) 7%, var(--color-bg-solid))}.library-row-title{font-size:.9rem;font-weight:600}.library-row-meta{color:var(--color-text-muted);font-size:.8rem}.library-row-actions{gap:var(--space-2);padding-right:var(--space-4);display:flex}.page-back-button{width:fit-content}.playlist-actions,.playlist-add{gap:var(--space-3);align-items:center;display:flex}.playlist-song-select{border-radius:var(--radius-md);border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 85%, transparent);min-width:260px;color:var(--color-text);padding:.44rem .52rem}.app-toast{background:color-mix(in srgb, var(--color-bg-solid) 75%, var(--color-brand) 25%);color:var(--color-text);border:1px solid color-mix(in srgb, var(--color-brand) 36%, var(--color-border));border-radius:var(--radius-pill);box-shadow:var(--shadow-soft);z-index:var(--z-overlay);padding:.5rem .9rem;font-size:.82rem;position:fixed;bottom:22px;left:50%;transform:translate(-50%)}.queue-panel-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.queue-panel-header h3{margin:0;font-size:.92rem}.queue-clear-button{color:var(--color-text-muted);cursor:pointer;border-radius:var(--radius-pill);transition:transform var(--motion-fast), color var(--motion-fast), background-color var(--motion-fast);background:0 0;border:0;padding:.2rem .45rem;font-size:.78rem}.queue-clear-button:hover{color:color-mix(in srgb, #ef4444 80%, var(--color-text));background:#ef44441a;transform:translateY(-1px)}.queue-clear-button:active{transform:scale(.97)}.queue-clear-button:focus-visible{outline:none;box-shadow:0 0 0 3px #ef444440}.queue-empty{padding:var(--space-4);color:var(--color-text-muted);text-align:center;margin:0}.queue-list{scrollbar-gutter:stable;min-height:0;display:grid;overflow:auto}.queue-list::-webkit-scrollbar{width:8px}.queue-list::-webkit-scrollbar-track{background:0 0}.queue-list::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--color-border) 78%, var(--color-bg-solid));border-radius:var(--radius-pill)}.queue-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--color-border) 90%, var(--color-bg-solid))}.queue-item{border-top:1px solid var(--color-border);grid-template-columns:1fr auto;align-items:center;display:grid}.queue-item--active{background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid))}.queue-item-main{color:inherit;cursor:pointer;align-items:center;gap:var(--space-3);text-align:left;padding:.68rem var(--space-4);background:0 0;border:0;grid-template-columns:28px 1fr auto;display:grid}.queue-item-main:hover{background:color-mix(in srgb, var(--color-brand) 8%, var(--color-bg-solid))}.queue-item-index{color:var(--color-text-muted);font-size:.82rem}.queue-item-title{margin:0;font-size:.88rem;font-weight:600}.queue-item-artist{color:var(--color-text-muted);margin:2px 0 0;font-size:.78rem}.queue-item-meta{min-width:0}.queue-item-title,.queue-item-artist{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.queue-item-actions{gap:var(--space-2);padding-right:var(--space-4);display:flex}.queue-item-actions button{border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg-solid) 82%, transparent);color:var(--color-text-muted);border-radius:var(--radius-pill);cursor:pointer;transition:transform var(--motion-fast), border-color var(--motion-fast), background-color var(--motion-fast), color var(--motion-fast);padding:.28rem .58rem;font-size:.72rem}.queue-item-actions button:hover{border-color:color-mix(in srgb, var(--color-brand) 34%, var(--color-border));background:color-mix(in srgb, var(--color-brand) 12%, var(--color-bg-solid));color:var(--color-text);transform:translateY(-1px)}.queue-item-actions button:active{transform:scale(.97)}.queue-item-actions button:focus-visible{box-shadow:var(--shadow-focus);outline:none}@media (width<=960px){#root{padding:var(--space-4);padding-bottom:180px}.app-shell{grid-template-columns:1fr;height:auto;min-height:0;transition:none}.app-left-column,.app-right-column{padding:0}.app-left-column,.app-center-column{transform:none}.app-right-column{display:none}.app-right-column--visible{opacity:1;visibility:visible;pointer-events:auto;display:flex;transform:none}.grid-panels{grid-template-columns:1fr}.layout-header{flex-direction:column;align-items:flex-start}.content-tabs{padding:var(--space-3) var(--space-4) 0}.content-tabs-nav,.content-tabs-actions{gap:var(--space-1)}.content-opacity-control{padding:0 .3rem}.content-opacity-value{width:34px}.content-opacity-slider{width:74px}.search-bar{grid-template-columns:1fr}.song-row{grid-template-columns:24px 34px 1fr auto}.song-row-badge{display:none}.layout-player{gap:var(--space-3);width:calc(100% - var(--space-4));grid-template-columns:1fr;min-width:0}.player-controls{flex-wrap:wrap}.player-right{justify-content:flex-start}.player-volume-range{width:min(180px,45vw)}.queue-panel{border-radius:var(--radius-xl)}.lyric-panel-body{height:260px}.queue-item{grid-template-columns:1fr}.queue-item-actions{padding:0 var(--space-4) var(--space-3)}.library-row{grid-template-columns:1fr}.library-row-actions{padding:0 var(--space-4) var(--space-3)}.playlist-actions,.playlist-add{flex-direction:column;align-items:flex-start}.playlist-song-select{width:100%;min-width:0}}.password-verify-page{background:radial-gradient(circle at 20% 30%, color-mix(in srgb, var(--color-brand) 28%, #667eea) 0%, transparent 45%), radial-gradient(circle at 75% 85%, #bc4ead 0%, transparent 50%), linear-gradient(135deg, #0f172a 0%, #1e293b 35%, #0f172a 100%);padding:var(--space-6);place-items:center;display:grid;position:fixed;inset:0}.password-verify-page:before{content:"";opacity:1;pointer-events:none;z-index:0;background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1920 1080\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.85\" numOctaves=\"4\" result=\"noise\" seed=\"2\"/></filter><rect width=\"1920\" height=\"1080\" fill=\"white\" opacity=\"0.03\" filter=\"url(%23noise)\"/></svg>"),radial-gradient(circle,#ffffff08 0%,#0000 60%);position:absolute;inset:0}.password-verify-container{z-index:1;width:100%;max-width:460px;position:relative}.password-verify-card{align-content:center;justify-items:center;gap:var(--space-3);padding:var(--space-6) var(--space-6);box-sizing:border-box;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);height:360px;animation:card-fade-in .6s var(--motion-ease);background:linear-gradient(135deg,#1e293ba6,#0f172a8c);border:1.5px solid #ffffff2e;border-radius:36px;grid-template-rows:auto auto auto;display:grid;box-shadow:0 8px 32px #0000004d,0 32px 64px #0003,inset 1px 1px #ffffff1a}@keyframes card-fade-in{0%{opacity:0;transform:translateY(14px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.password-verify-header{gap:var(--space-1);text-align:center;width:100%;max-width:320px;margin:0 auto;display:grid}.password-verify-title{font-family:var(--font-display);letter-spacing:-.02em;background:linear-gradient(135deg, var(--color-brand), color-mix(in srgb, var(--color-brand) 70%, #2563eb));-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(1.8rem,4vw,2.4rem);font-weight:850}.password-verify-subtitle{color:var(--color-text-muted);letter-spacing:.01em;margin:0;font-size:.92rem;font-weight:500;line-height:1.3}.password-verify-form{gap:var(--space-2);width:100%;max-width:300px;margin:0 auto;display:grid}.password-verify-input-group{position:relative}.password-verify-input{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#e2e8f0;letter-spacing:.1em;text-align:center;width:100%;transition:border-color var(--motion-base), box-shadow var(--motion-base), transform var(--motion-base), background-color var(--motion-base);background:#1e293b80;border:1.5px solid #ffffff26;border-radius:14px;padding:.64rem .9rem;font-size:.96rem;font-weight:500}.password-verify-input::placeholder{color:#e2e8f073;letter-spacing:.08em}.password-verify-input:focus-visible{border-color:var(--color-brand);background:#1e293bb3;outline:none;transform:translateY(-1px);box-shadow:0 0 0 3px #fa233b40}.password-verify-input--error{background:#7f1d1d66;border-color:#ef444499}.password-verify-input--error:focus-visible{border-color:#ef4444;box-shadow:0 0 0 3px #ef444440}.password-verify-error{padding:0 var(--space-2);color:color-mix(in srgb, #ef4444 88%, var(--color-text));text-align:center;margin:0;font-size:.82rem;font-weight:500;animation:.42s cubic-bezier(.36,0,.66,-.56) shake}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}.password-verify-button{background:linear-gradient(135deg, var(--color-brand), color-mix(in srgb, var(--color-brand) 75%, #2563eb));color:#fff;letter-spacing:.05em;cursor:pointer;transition:all var(--motion-base);box-shadow:0 4px 15px color-mix(in srgb, var(--color-brand) 35%, transparent);border:0;border-radius:12px;width:100%;padding:.6rem 1.5rem;font-size:.9rem;font-weight:700}.password-verify-button:hover:not(:disabled){box-shadow:0 6px 20px color-mix(in srgb, var(--color-brand) 45%, transparent);transform:translateY(-2px)}.password-verify-button:active:not(:disabled){box-shadow:0 2px 8px color-mix(in srgb, var(--color-brand) 35%, transparent);transform:translateY(0)}.password-verify-button:disabled{opacity:.7;cursor:not-allowed}.password-verify-hint{text-align:center;width:100%;max-width:320px;color:color-mix(in srgb, var(--color-text-muted) 85%, transparent);letter-spacing:.01em;margin:0;font-size:.78rem}