.performance-medium .glass-surface,.mobile-performance .glass-surface{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.performance-low .glass-surface{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.performance-low .album-large,.performance-low .album-card .artwork{box-shadow:none}.performance-low .lyric-line{transition:opacity .16s ease}.performance-low .search-featured-song,.performance-low .search-playlist-card,.performance-low .room-card{transition:none}.performance-low .room-card-join{box-shadow:none;transform:none;transition:opacity .12s ease}.performance-low .modal{animation-duration:.12s}.performance-low .header-menu .main-nav,.performance-low .search-popover,.performance-low .member-popover{animation-name:fade-in;animation-duration:.16s}.performance-low .main-content,.performance-low .detail-panel-swap{animation-name:fade-in;animation-duration:.14s}@keyframes fade-in{0%{opacity:0;transform:none}to{opacity:1;transform:none}}.performance-low .search-playlist-open{transition-duration:.12s}.performance-low .detail-panel{animation-duration:.12s;animation-name:detail-panel-fade-in}.performance-low .detail-panel-closing{animation-name:detail-panel-fade-out}@keyframes detail-panel-fade-in{0%{opacity:0}to{opacity:1}}@keyframes detail-panel-fade-out{0%{opacity:1}to{opacity:0}}.performance-off *,.performance-off *:before,.performance-off *:after,.no-animations *,.no-animations *:before,.no-animations *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.performance-off .glass-surface{background:var(--color-sidebar);backdrop-filter:none;-webkit-backdrop-filter:none}.performance-off *{box-shadow:none!important;filter:none!important;will-change:auto!important}.performance-off .room-art{background:var(--color-surface)!important}.performance-off .album-feature{background:var(--color-content)}.performance-off .lyrics-scroll{mask-image:none;-webkit-mask-image:none}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.block{display:block}.grid{display:grid}.hidden{display:none}.flex-1{flex:1 1 0%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.overflow-auto{overflow:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.\[mm\:ss\.xx\]{mm:ss.xx}.\[mm\:ss\]{mm:ss}:root{--ui-font-size: 14px;--text-ui-xl: calc(var(--ui-font-size) + 14px);--text-ui-lg: calc(var(--ui-font-size) + 4px);--text-ui-base: var(--ui-font-size);--text-ui-caption: calc(var(--ui-font-size) - 1px);--text-ui-sm: calc(var(--ui-font-size) - 2px);--text-ui-xs: calc(var(--ui-font-size) - 4px);--text-mobile-input-safe: 16px;--color-brand: #68d268;--color-primary: #68d268;--color-primary-foreground: #122412;--color-background: #1c1c1e;--color-frame: #000;--color-content: #121212;--color-player: #080808;--color-background-alt: #222224;--color-sidebar: #252526;--color-header: #080808;--color-panel: #121212;--color-surface: #232326;--color-surface-hover: #2c2c30;--color-card: #242427;--color-card-selected: #353537;--color-popover: #242427;--color-input: #29292d;--color-input-focused: #303034;--color-foreground: #f4f4f5;--color-foreground-subtle: #a6a6af;--color-foreground-subtlest: #90909a;--color-border: #333337;--color-border-hover: #585860;--color-input-border: #414148;--color-input-border-focused: #68d268;--color-hover: #303034;--color-selected: #3b3b3e;--color-accent: #203320;--color-destructive: #ff929a;--color-destructive-foreground: #34151b;--color-success: #8cc9a5;--color-warning: #eac17b;--color-toast: #303034;--color-overlay: rgb(0 0 0 / 55%);--color-shadow: rgb(0 0 0 / 24%);color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;font-synthesis:none}:root[data-theme=light]{--color-frame: #e8e8ed;--color-content: #121212;--color-player: #f7f7f9;--color-brand: #68d268;--color-background: #fff;--color-background-alt: #f7f7f9;--color-sidebar: #f2f2f5;--color-header: #fff;--color-panel: #121212;--color-surface: #f3f3f6;--color-surface-hover: #ededf0;--color-card: #f5f5f7;--color-card-selected: #ebebed;--color-popover: #fff;--color-input: #f3f3f6;--color-input-focused: #fff;--color-foreground: #202024;--color-foreground-subtle: #64646e;--color-foreground-subtlest: #71717b;--color-border: #e6e6eb;--color-border-hover: #b9b9c2;--color-input-border: #d4d4dc;--color-input-border-focused: #68d268;--color-hover: #e8e8ed;--color-selected: #e4e4e8;--color-accent: #e7f6e7;--color-destructive: #b22638;--color-destructive-foreground: #fff;--color-success: #287144;--color-warning: #886017;--color-toast: #fff;--color-shadow: rgb(30 30 45 / 12%);color-scheme:light}@media (prefers-color-scheme: light){:root[data-theme=system]{--color-frame: #e8e8ed;--color-content: #121212;--color-player: #f7f7f9;--color-brand: #68d268;--color-background: #fff;--color-background-alt: #f7f7f9;--color-sidebar: #f2f2f5;--color-header: #fff;--color-panel: #121212;--color-surface: #f3f3f6;--color-surface-hover: #ededf0;--color-card: #f5f5f7;--color-card-selected: #ebebed;--color-popover: #fff;--color-input: #f3f3f6;--color-input-focused: #fff;--color-foreground: #202024;--color-foreground-subtle: #64646e;--color-foreground-subtlest: #71717b;--color-border: #e6e6eb;--color-border-hover: #b9b9c2;--color-input-border: #d4d4dc;--color-input-border-focused: #68d268;--color-hover: #e8e8ed;--color-selected: #e4e4e8;--color-accent: #e7f6e7;--color-destructive: #b22638;--color-destructive-foreground: #fff;--color-success: #287144;--color-warning: #886017;--color-toast: #fff;--color-shadow: rgb(30 30 45 / 12%);color-scheme:light}}html,body,#root{height:100%;overflow:hidden}body{margin:0;background:var(--color-background);color:var(--color-foreground);font-size:var(--text-ui-base);line-height:1.5}*{box-sizing:border-box}button,input,select,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .15s,color .15s,opacity .15s}button,a,input,select,textarea{outline:none}button:focus-visible,a:focus-visible{outline:2px solid var(--color-brand);outline-offset:3px}button:disabled{cursor:default;opacity:.45}button:active:not(:disabled){transform:scale(.98)}h1,h2,h3,p{margin:0}h1,h2,h3,strong{font-weight:600}svg{flex-shrink:0}.text-ui-xl{font-size:var(--text-ui-xl)}.text-ui-lg{font-size:var(--text-ui-lg)}.text-ui-base{font-size:var(--text-ui-base)}.text-ui-caption{font-size:var(--text-ui-caption)}.text-ui-sm{font-size:var(--text-ui-sm)}.text-ui-xs{font-size:var(--text-ui-xs)}.muted{color:var(--color-foreground-subtle)}.accent{color:var(--color-brand)}.truncate{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--color-border-hover);border-radius:8px}::-moz-selection{background:var(--color-selected)}::selection{background:var(--color-selected)}.app-shell{height:calc(var(--vh, 1vh) * 100);height:100dvh;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 104px;overflow:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);background:var(--color-frame)}.main-nav{display:flex;flex-direction:column;gap:4px}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:var(--color-foreground);text-align:left}.nav-item svg{color:var(--color-brand)}.nav-item:hover{background:var(--color-hover)}.nav-item.selected{background:var(--color-selected)}.user-profile{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;color:inherit;text-align:left;padding:10px 4px}.user-initial{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--color-accent);color:var(--color-brand)}.workspace{grid-column:1;grid-row:1;display:flex;flex-direction:column;min-height:0;min-width:0}.header-menu{position:relative}.header-menu summary{list-style:none;display:grid;place-items:center;width:36px;height:36px;border-radius:8px;cursor:pointer}.header-menu summary::-webkit-details-marker{display:none}.header-menu summary:focus-visible{outline:2px solid var(--color-brand);outline-offset:3px}.header-menu summary:hover{background:var(--color-hover)}.header-menu .main-nav{position:absolute;left:0;top:calc(100% + 12px);width:180px;padding:6px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-popover);box-shadow:0 8px 24px var(--color-shadow);transform-origin:top left}.header-menu[open] .main-nav{animation:popover-in .2s cubic-bezier(.2,.8,.2,1) both}.header-actions .user-profile{width:36px;padding:0}.header-actions .user-profile .song-copy{display:none}.workspace-header{--color-header: #000000;--color-foreground: #f4f4f5;--color-foreground-subtle: #a6a6af;--color-foreground-subtlest: #90909a;--color-brand: #68d268;--color-input: #29292d;--color-input-focused: #303034;--color-input-border: #414148;--color-input-border-focused: #68d268;--color-popover: #242427;--color-surface: #232326;--color-selected: #3b3b3e;--color-hover: #303034;--color-border: #333337;--color-border-hover: #585860;--color-success: #8cc9a5;position:relative;z-index:30;height:76px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 24px;background:var(--color-header);color:var(--color-foreground);border:0;border-radius:0}.header-leading{display:flex;align-items:center;gap:4px;flex-shrink:0}.header-search-area{display:flex;align-items:center;gap:12px;flex:1;min-width:0;max-width:680px;margin:0 auto}.home-widget{width:44px;height:44px;border-radius:50%;background:var(--color-surface)}.home-widget[aria-current=page]{color:var(--color-brand)}.header-search{position:relative;flex:1;min-width:0}.header-search-field{--color-input: #1f1f1f;--color-input-focused: #1f1f1f;display:flex;align-items:center;gap:12px;padding:0 16px;height:48px;border:1px solid var(--color-input-border);border-radius:24px;background:var(--color-input);color:var(--color-foreground-subtle)}.header-search-field.search-open{border-color:var(--color-input-border-focused);background:var(--color-input-focused)}.header-search-field input{border:0!important;padding:10px 0!important;background:transparent!important}.header-search-field .icon-button{width:24px;height:28px}.search-popover{position:absolute;top:calc(100% + 12px);left:0;right:0;border-radius:12px;padding:16px;border:1px solid var(--color-border);background:var(--color-popover);box-shadow:0 12px 32px var(--color-shadow);transform-origin:top center;animation:popover-in .2s cubic-bezier(.2,.8,.2,1) both}.header-search-history{display:flex;flex-direction:column;gap:6px}@keyframes popover-in{0%{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.search-recent{display:flex;align-items:center;gap:10px;padding:8px;text-align:left;border-radius:8px}.search-recent:hover{background:var(--color-hover)}.workspace-title{display:flex;align-items:center;gap:12px;min-width:0}.workspace-title>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:500}.header-actions{display:flex;align-items:center;gap:8px}.connection-status{display:flex;align-items:center;gap:4px;padding:4px 6px;color:var(--color-foreground-subtle);white-space:nowrap;border:0;background:none;border-radius:4px}.connection-status:disabled{opacity:1}.connection-status.connected{color:var(--color-success)}.workspace-body{display:flex;flex:1;min-height:0;gap:8px;padding:8px;background:var(--color-frame)}.main-content:not(.settings-view),.detail-panel{--color-brand: #68d268;--color-background: #1c1c1e;--color-background-alt: #222224;--color-surface: #232326;--color-surface-hover: #2c2c30;--color-card: #242427;--color-card-selected: #353537;--color-popover: #242427;--color-input: #29292d;--color-input-focused: #303034;--color-foreground: #f4f4f5;--color-foreground-subtle: #a6a6af;--color-foreground-subtlest: #90909a;--color-border: #333337;--color-border-hover: #585860;--color-input-border: #414148;--color-input-border-focused: #68d268;--color-hover: #303034;--color-selected: #3b3b3e;--color-accent: #203320;--color-destructive: #ff929a;--color-destructive-foreground: #34151b;--color-success: #8cc9a5;--color-warning: #eac17b;color:var(--color-foreground);color-scheme:dark}.main-content{flex:1;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:0;border-radius:12px;background:var(--color-content);animation:page-swap-in .18s cubic-bezier(.2,.8,.2,1) both}@keyframes page-swap-in{0%{opacity:0}to{opacity:1}}::view-transition-group(root){animation:none;overflow:clip}::view-transition-image-pair(root){isolation:auto}::view-transition-old(root),::view-transition-new(root){mix-blend-mode:normal;animation:none}::view-transition-group(detail-panel-content){overflow:clip}::view-transition-image-pair(detail-panel-content){isolation:auto}::view-transition-old(detail-panel-content),::view-transition-new(detail-panel-content){background:var(--color-panel);mix-blend-mode:normal}::view-transition-old(detail-panel-content){animation:view-recede .3s cubic-bezier(.2,.8,.2,1) both}::view-transition-new(detail-panel-content){animation:view-push-in .3s cubic-bezier(.2,.8,.2,1) both}@keyframes view-recede{0%{transform:translate(0)}to{transform:translate(-14%)}}@keyframes view-push-in{0%{transform:translate(100%)}to{transform:translate(0)}}.page-content{width:100%;max-width:1400px;margin:0 auto;padding:32px 40px 48px}.page-title{margin-bottom:28px}.page-title h1{margin:8px 0}.page-title p{margin-top:8px}.page-heading{margin-bottom:28px}.page-heading h1{margin-top:6px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.section-heading h1,.section-heading h2{min-width:0}.section-heading h1>span{margin-left:6px}.detail-panel{--detail-panel-width: 480px;width:var(--detail-panel-width);flex-shrink:0;position:relative;min-height:0;display:flex;flex-direction:column;border:0;border-radius:12px;background:var(--color-panel);overflow:hidden;animation:detail-panel-open .24s cubic-bezier(.2,.8,.2,1) both}.detail-panel-content{view-transition-name:detail-panel-content;width:var(--detail-panel-width);flex:1;min-height:0;display:flex;flex-direction:column}.detail-panel-swap{animation:detail-panel-swap-in .18s cubic-bezier(.2,.8,.2,1) both}@keyframes detail-panel-swap-in{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.detail-panel-closing{pointer-events:none;animation-name:detail-panel-close}@keyframes detail-panel-open{0%{width:0;margin-left:-8px;opacity:0;transform:translate(16px)}to{width:var(--detail-panel-width);margin-left:0;opacity:1;transform:translate(0)}}@keyframes detail-panel-close{0%{width:var(--detail-panel-width);margin-left:0;opacity:1;transform:translate(0)}to{width:0;margin-left:-8px;opacity:0;transform:translate(16px)}}.detail-tabs{display:flex;align-items:center;gap:20px;padding:12px 16px;flex-shrink:0}.detail-tabs .icon-button{margin-left:auto}.detail-tab{padding:8px 0;color:var(--color-foreground-subtle);border-bottom:2px solid transparent}.detail-tab[aria-pressed=true]{color:var(--color-foreground);border-bottom-color:var(--color-brand)}.history-compact{flex:1;min-height:0;padding:8px 16px 24px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.history-compact,.queue-panel,.main-content:has(>.history-page,>.queue-page){scrollbar-width:none;scrollbar-gutter:auto}.history-compact::-webkit-scrollbar,.queue-panel::-webkit-scrollbar,.main-content:has(>.history-page,>.queue-page)::-webkit-scrollbar{display:none}.history-compact .page-title,.history-compact .history-toolbar,.history-compact>.section-heading,.history-compact .history-row>time{display:none}.history-compact .history-date{padding-top:16px}.mobile-brand,.mobile-settings,.mobile-nav,.icon-button.mobile-search-button{display:none}.icon-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border:0;border-radius:8px;background:transparent;color:inherit}.icon-button:hover:not(:disabled){background:var(--color-hover)}.icon-button.accent{color:var(--color-brand)}.button-primary,.button-secondary,.button-destructive,.button-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 14px;border-radius:8px;font-size:var(--text-ui-base);font-weight:500;white-space:nowrap;border:1px solid transparent}.button-primary{background:var(--color-primary);color:var(--color-primary-foreground)}.button-primary:hover:not(:disabled){background:color-mix(in srgb,var(--color-primary),var(--color-foreground) 8%)}.button-secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-foreground)}.button-secondary:hover:not(:disabled){background:var(--color-surface-hover)}.button-ghost{background:transparent;padding:6px 8px}.button-ghost:hover:not(:disabled){background:var(--color-hover)}.button-destructive{background:var(--color-destructive);color:var(--color-destructive-foreground)}input:not([type=range]):not([type=checkbox]),textarea,select{width:100%;min-width:0;padding:10px 12px;border-radius:8px;border:1px solid var(--color-input-border);background:var(--color-input);color:var(--color-foreground);font-size:var(--text-ui-base)}input::-moz-placeholder,textarea::-moz-placeholder{color:var(--color-foreground-subtlest);opacity:1}input::placeholder,textarea::placeholder{color:var(--color-foreground-subtlest);opacity:1}input:focus,textarea:focus,select:focus{border-color:var(--color-input-border-focused)!important;background:var(--color-input-focused)}input[type=range],input[type=checkbox]{accent-color:var(--color-primary)}input[type=range]{width:100%;height:18px;cursor:pointer}input[type=checkbox]{width:16px;height:16px;flex-shrink:0}.search-field{display:flex;align-items:center;gap:10px;flex:1;min-width:0;border:1px solid var(--color-input-border);border-radius:8px;padding:0 12px;background:var(--color-input);color:var(--color-foreground-subtle)}.search-field:focus-within{border-color:var(--color-input-border-focused);background:var(--color-input-focused)}.search-field input{border:0!important;background:transparent!important;padding:11px 0!important}.search-toolbar,.room-toolbar,.history-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:24px}.form-stack{display:flex;flex-direction:column;gap:16px}.form-stack label{display:flex;flex-direction:column;gap:6px;font-size:var(--text-ui-base)}.checkbox-label,.form-stack .checkbox-label{display:flex;flex-direction:row;align-items:center;gap:8px}.error-text{color:var(--color-destructive);margin:12px 0}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:230px;padding:32px 20px;gap:12px}.empty-state>svg{color:var(--color-foreground-subtlest);margin-bottom:4px}.empty-state>.muted{max-width:380px}.empty-state>button{margin-top:4px}.skeleton-list{padding:8px 0}.skeleton-row{display:flex;gap:12px;align-items:center;padding:12px 0}.skeleton-row>span{width:48px;height:48px;border-radius:8px;background:var(--color-surface-hover)}.skeleton-row>div{flex:1}.skeleton-row>div>span{display:block;width:55%;height:12px;border-radius:4px;background:var(--color-surface-hover)}.skeleton-row>div>span+span{width:35%;height:10px;margin-top:10px;background:var(--color-surface)}.room-page{--color-room-card: #181818}.room-toolbar{margin-bottom:28px}.room-toolbar .search-field{height:48px;padding:0 20px;gap:12px;border-radius:999px}.room-toolbar .button-primary{padding:10px 20px;border-radius:999px}.room-page .form-stack>.button-primary{width:100%;border-radius:999px}.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:24px 20px}.room-card{position:relative;min-width:0;display:flex;flex-direction:column;gap:12px;padding:12px;text-align:left;border:0;border-radius:12px;background:var(--color-room-card);color:inherit;transition:background-color .15s ease}.room-card:hover:not(:disabled),.room-card:focus-visible{background:var(--color-surface)}.room-card-art{position:relative;width:100%}.room-art{width:100%;aspect-ratio:1.6;display:grid;place-items:center;border-radius:8px;background:var(--color-surface);color:var(--color-brand)}.room-card-badge{position:absolute;top:8px;left:8px;display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;background:var(--color-content);color:var(--color-foreground-subtle)}.room-card-join{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--color-primary);color:var(--color-primary-foreground);box-shadow:0 8px 16px var(--color-shadow);opacity:0;transform:translateY(8px);transition:opacity .15s ease,transform .15s ease}.room-card:hover:not(:disabled) .room-card-join,.room-card:focus-visible .room-card-join{opacity:1;transform:translateY(0)}@media (hover: none){.room-card-join{opacity:1;transform:none}}.room-card-copy{display:flex;flex-direction:column;gap:4px;width:100%;min-width:0}.room-card-copy>p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3em}.room-card-copy>span{display:flex;align-items:center;gap:6px}.room-skeleton{pointer-events:none}.room-skeleton .room-art{background:var(--color-surface-hover)}.room-skeleton .room-card-copy{min-height:86px}.room-skeleton .skeleton-line{display:block;height:14px;width:70%;border-radius:4px;background:var(--color-surface-hover)}.room-skeleton .skeleton-line+.skeleton-line{height:12px;width:45%;margin-top:10px;background:var(--color-surface)}.join-summary{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center}.join-art{width:88px;aspect-ratio:1;display:grid;place-items:center;border-radius:12px;background:var(--color-surface);color:var(--color-brand)}.join-detail{display:flex;flex-direction:column;gap:4px;min-width:0}.join-detail h3{overflow-wrap:anywhere}.join-meta{display:flex;align-items:center;gap:8px;margin-top:4px;flex-wrap:wrap}.artwork{flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--color-surface);color:var(--color-foreground-subtlest);border-radius:8px;aspect-ratio:1}.artwork img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.song-artwork{display:block;position:relative;flex-shrink:0;border-radius:8px}.song-artwork-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-brand);opacity:0;pointer-events:none}.song-artwork:hover .artwork,.song-artwork:focus-visible .artwork{opacity:.45}.song-artwork:hover .song-artwork-icon,.song-artwork:focus-visible .song-artwork-icon{opacity:1}.now-playing{display:block;margin-bottom:32px}.album-feature{display:grid;grid-template-columns:220px minmax(0,1fr);align-items:end;gap:24px;padding:24px;border-radius:12px;background:linear-gradient(150deg,var(--color-accent),var(--color-content))}.album-large{width:100%;border-radius:8px;box-shadow:0 8px 20px var(--color-shadow)}.album-large>svg{width:30%;height:30%}.album-caption{margin:0}.album-eyebrow{margin-bottom:8px;color:var(--color-foreground)}.album-caption .sync-playback{padding-left:0;margin-top:12px}.album-caption h2{overflow-wrap:anywhere}.album-caption p{margin-top:4px}.listen-page{display:flex;height:100%;min-height:0;padding:24px 32px}.lyrics-panel{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}.section-label{display:flex;align-items:center;gap:8px;padding-bottom:12px}.lyrics-scroll{flex:1;min-height:0;overflow-y:auto;position:relative;scrollbar-width:none;overscroll-behavior:contain;-webkit-mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent)}.lyrics-scroll::-webkit-scrollbar{display:none}.lyrics-scroll:not(:has(.empty-state)):before,.lyrics-scroll:not(:has(.empty-state)):after{content:"";display:block;height:50%}.lyric-line{max-width:880px;margin:0 auto;padding:8px 32px;line-height:1.5;text-align:center;color:var(--color-foreground-subtle);opacity:.78;font-weight:600;overflow-wrap:anywhere;transform:translateY(4px) scale(.7);transform-origin:center;transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .3s ease,color .3s ease}.lyric-line.near-lyric{opacity:.9;transform:translateY(2px) scale(.8)}.lyric-line.active-lyric{color:var(--color-foreground);opacity:1;transform:translateY(0) scale(1.18)}.lyrics-scroll:has(.empty-state){display:grid;place-items:center}.song-list{list-style:none;padding:0;margin:0}.song-row,.history-row{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:8px;min-height:68px;content-visibility:auto;contain-intrinsic-size:auto 68px}.song-row:hover,.history-row:hover{background:var(--color-surface-hover)}.song-row .artwork,.history-row .artwork{width:42px}.song-row .artwork>svg,.history-row .artwork>svg{width:22px}.song-action{color:var(--color-foreground-subtle)}.song-action:hover:not(:disabled),.song-action:focus-visible:not(:disabled){color:var(--color-brand);background:transparent}.song-action:active:not(:disabled){color:var(--color-brand);background:transparent;transform:none}.song-action[aria-busy=true]{cursor:progress;opacity:.7;color:var(--color-brand)}.song-index{width:22px;flex-shrink:0}.song-copy{display:flex;flex-direction:column;min-width:0;gap:3px;flex:1}.song-album{max-width:22%;width:150px}.song-duration{flex-shrink:0;font-variant-numeric:tabular-nums}.song-table-heading{display:grid;grid-template-columns:22px minmax(0,1fr) 150px 48px 84px;gap:12px;align-items:center;padding:8px;border-bottom:1px solid var(--color-border)}.recommendations{margin-top:32px}.recommendation-empty{display:flex;align-items:center;gap:12px;padding:20px 0}.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:24px 20px}.album-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;min-width:0;background:none;color:inherit;border:0;border-radius:12px;gap:4px;position:relative}.album-card .artwork{width:100%;border-radius:12px;margin-bottom:8px}.album-card:hover .artwork{box-shadow:0 8px 24px var(--color-shadow)}.album-card-action{color:var(--color-brand);padding-top:4px}.search-page{--color-search-card: #181818;container:search / inline-size;padding-top:16px}.search-filter-bar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0 16px;background:var(--color-content)}.search-filter-chips{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.search-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:7px 14px;border:0;border-radius:999px;background:var(--color-surface);color:var(--color-foreground);white-space:nowrap}.search-chip:hover:not(:disabled){background:var(--color-hover)}.search-chip[aria-pressed=true]{background:var(--color-foreground);color:var(--color-content)}.search-chip[aria-pressed=true]:hover{background:var(--color-foreground)}.search-source{width:auto;max-width:144px;flex-shrink:0;border-radius:999px;padding:7px 12px;background:transparent}.search-page-heading{margin:16px 0 28px}.search-page-heading p{margin-top:6px;overflow-wrap:anywhere}.search-recommend-hint{display:none;align-items:center;gap:6px}.search-recommend-hint>svg{color:var(--color-brand)}.search-page .section-heading,.search-section-title{margin-bottom:16px}.search-section-link{padding:4px 0;border:0;background:transparent;color:var(--color-foreground-subtle);white-space:nowrap}.search-section-link:hover:not(:disabled){color:var(--color-foreground);text-decoration:underline}.search-overview-grid,.search-loading-overview{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(0,1.5fr);gap:24px}.search-overview-grid>section{min-width:0}.search-featured-song{min-width:0;padding:20px;border-radius:12px;background:var(--color-search-card);transition:background-color .15s ease}.search-featured-song:hover{background:var(--color-surface)}.search-featured-song>.song-artwork{width:-moz-fit-content;width:fit-content}.search-featured-song>.song-artwork,.search-featured-song>.artwork{margin-bottom:16px}.search-featured-song .artwork{width:88px}.search-featured-song h3{margin-bottom:4px}.search-feature-footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px}.search-feature-footer .icon-button{width:36px;height:36px}.search-feature-footer .icon-button svg{width:26px;height:26px}.search-preview .song-row{display:grid;grid-template-columns:42px minmax(0,1fr) 48px 36px;min-height:64px;padding:8px;gap:12px}.search-preview .song-index,.search-preview .song-album{display:none}.search-page .song-duration{text-align:right}.search-page .song-copy strong{font-weight:500}.search-song-table{--search-song-columns: 24px 42px minmax(0, 1fr) minmax(100px, .65fr) 56px 36px}.search-song-table .song-row,.search-song-heading{display:grid;grid-template-columns:var(--search-song-columns);gap:12px;padding:8px 12px;align-items:center}.search-song-table .song-row{min-height:64px}.search-song-table .song-index{width:auto;text-align:center}.search-song-table .song-album{display:block;width:auto;max-width:none}.search-song-heading{min-height:40px;margin-bottom:8px;border-bottom:1px solid var(--color-border)}.search-song-heading>:nth-child(2){grid-column:2 / span 2}.search-song-heading>:nth-child(4){justify-self:end}.search-playlists{margin-top:32px}.search-album-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 -10px}.search-playlist-card{padding:10px;gap:5px;transition:background-color .15s ease}.search-playlist-card:hover:not(:disabled),.search-playlist-card:focus-visible{background:var(--color-surface)}.search-playlist-art{position:relative;width:100%}.search-playlist-card .artwork{margin-bottom:6px;border-radius:8px}.search-playlist-card>strong,.search-playlist-card>span{width:100%}.search-playlist-open{position:absolute;right:10px;bottom:16px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--color-primary);color:var(--color-primary-foreground);opacity:0;transition:opacity .15s ease}.search-playlist-card:hover:not(:disabled) .search-playlist-open,.search-playlist-card:focus-visible .search-playlist-open{opacity:1}.search-recent-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.search-recent-card{display:flex;align-items:center;gap:16px;min-width:0;padding:16px;border:0;border-radius:8px;background:var(--color-search-card);color:var(--color-foreground);text-align:left}.search-recent-card:hover:not(:disabled){background:var(--color-surface)}.search-recent-card>svg{color:var(--color-foreground-subtle)}.search-help{margin-top:24px}.search-inline-field{display:none;align-items:center;gap:10px;height:48px;padding:0 18px;border:1px solid var(--color-input-border);border-radius:24px;background:var(--color-surface);color:var(--color-foreground-subtle)}.search-inline-field:focus-within{border-color:var(--color-input-border-focused);background:var(--color-input-focused)}.search-inline-field input{padding:11px 0!important;border:0!important;background:transparent!important;color:var(--color-foreground)!important}.search-inline-field input::-moz-placeholder{color:var(--color-foreground-subtlest)}.search-inline-field input::placeholder{color:var(--color-foreground-subtlest)}.search-inline-field .icon-button{width:28px;height:28px}.search-error{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.search-feature-skeleton{display:flex;flex-direction:column;gap:16px;padding:20px;min-height:260px;border-radius:12px;background:var(--color-search-card)}.search-feature-skeleton span{width:60%;height:14px;border-radius:4px;background:var(--color-surface)}.search-feature-skeleton span:first-child{width:88px;height:88px;border-radius:8px}@container search (max-width: 720px){.search-overview-grid,.search-loading-overview{grid-template-columns:minmax(0,1fr)}.search-album-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.search-song-table{--search-song-columns: 24px 42px minmax(0, 1fr) 56px 36px}.search-song-table .song-album,.search-song-heading>:nth-child(3){display:none}.search-filter-bar{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.search-filter-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:3px;margin:-3px}.search-filter-chips::-webkit-scrollbar{display:none}.search-chip{flex-shrink:0}.search-source{justify-self:end}.search-featured-song{display:grid;grid-template-columns:88px minmax(0,1fr) 36px;-moz-column-gap:16px;column-gap:16px;align-items:center}.search-featured-song>.song-artwork,.search-featured-song>.artwork{grid-row:1 / span 3;margin-bottom:0}.search-featured-song h3,.search-featured-song>p{grid-column:2}.search-feature-footer{grid-column:2 / span 2;margin-top:0}}@container search (max-width: 480px){.search-album-grid,.search-recent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.search-filter-chips{gap:6px}.search-chip{padding:7px 11px}.search-page-heading{margin:12px 0 24px}.search-featured-song{grid-template-columns:64px minmax(0,1fr) 28px;padding:16px;gap:0 12px}.search-featured-song .artwork{width:64px}.search-featured-song h3{font-size:var(--text-ui-lg)}.search-feature-footer .icon-button{width:28px;height:28px}.search-preview .song-row{grid-template-columns:42px minmax(0,1fr) 32px;gap:10px}.search-preview .song-duration{display:none}.search-song-table{--search-song-columns: 42px minmax(0, 1fr) 32px}.search-song-table .song-row{padding:8px 0;gap:10px}.search-song-table .song-index,.search-song-table .song-duration,.search-song-heading{display:none}.search-song-table .icon-button,.search-preview .icon-button{width:32px;height:36px}}.queue-panel{padding:24px 16px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0}.queue-current{display:flex;gap:12px;align-items:center;margin-bottom:20px;padding:12px;background:var(--color-accent);border-radius:12px}.queue-current .artwork{width:48px}.queue-panel .song-index,.queue-panel .song-album,.queue-panel .song-duration{display:none}.queue-panel .song-row,.history-compact .history-row{gap:8px}.queue-panel .icon-button,.history-compact .history-row .icon-button{width:28px;height:32px}.player-bar{--color-player: #000000;--color-foreground: #f4f4f5;--color-foreground-subtle: #a6a6af;--color-foreground-subtlest: #90909a;--color-surface: #232326;--color-hover: #303034;grid-column:1;grid-row:2;position:relative;display:flex;align-items:center;gap:16px;padding:12px 16px;margin:0;border:0;border-radius:0;z-index:10;background:var(--color-player);color:var(--color-foreground)}.glass-surface{background:color-mix(in srgb,var(--color-sidebar) 94%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.player-bar.glass-surface{background:var(--color-player);backdrop-filter:none;-webkit-backdrop-filter:none}.player-artwork{flex-shrink:0;border-radius:12px}.player-artwork .artwork{width:64px;border-radius:12px}.player-artwork .artwork>svg{width:32px}.player-track{flex:1;min-width:0;position:relative}.player-song{display:flex;min-width:0;width:100%;padding:0 112px 0 0;text-align:left;color:inherit;border:0;border-radius:8px;background:transparent}.player-right{display:flex;align-items:center;gap:8px;flex-shrink:0;padding-left:12px}.player-center{display:flex;align-items:center}.transport{display:flex;align-items:center;gap:10px}.playback-progress{margin-top:10px;color:var(--color-foreground-subtle);font-variant-numeric:tabular-nums}.player-time{position:absolute;right:0;top:34px;text-align:right;white-space:nowrap}.progress-track{height:3px;flex:1;background:var(--color-border-hover);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--color-foreground-subtle);transform:scaleX(0);transform-origin:left}.player-tools{display:flex;align-items:center;justify-content:flex-end;gap:4px}.player-tools .volume-slider{width:90px;margin-right:16px;accent-color:var(--color-foreground)}.player-panel-toggle{color:var(--color-foreground-subtle)}.player-panel-toggle:hover:not(:disabled),.player-panel-toggle:focus-visible:not(:disabled),.player-panel-toggle[aria-pressed=true]{color:var(--color-brand);background:transparent}.player-panel-toggle:active:not(:disabled){color:var(--color-brand);background:transparent;transform:none}.player-bar .progress-fill{background:var(--color-foreground)}.chat-panel{min-width:0;min-height:0;flex:1;display:flex;flex-direction:column;height:100%;position:relative}.chat-heading{min-height:64px;flex-shrink:0;padding:14px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--color-border)}.chat-heading-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.chat-members-toggle{color:var(--color-foreground-subtle)}.chat-members-toggle:hover,.chat-members-toggle[aria-expanded=true]{color:var(--color-brand)}.chat-page{display:flex}.chat-page .chat-panel{max-width:920px;margin:0 auto}.chat-messages{display:flex;flex-direction:column;gap:20px;flex:1;min-height:0;overflow-y:auto;padding:20px;overscroll-behavior:contain}.chat-messages>.empty-state{min-height:0;margin:auto 0}.chat-message{display:flex;gap:12px;flex-shrink:0}.chat-message .artwork{width:32px;height:32px;border-radius:50%}.chat-message .artwork>svg{width:16px}.message-content{min-width:0;flex:1}.message-meta{display:flex;align-items:center;gap:8px;margin:0 0 4px}.message-meta>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-meta time{flex-shrink:0;font-variant-numeric:tabular-nums}.message-bubble{display:inline-block;padding:8px 12px;border-radius:8px;background:var(--color-surface);max-width:100%;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap}.self .message-bubble{background:var(--color-accent)}.chat-composer{display:flex;align-items:center;gap:8px;flex-shrink:0;margin:0 20px 20px;padding:6px;border:1px solid var(--color-input-border);border-radius:12px;background:var(--color-input)}.chat-composer:focus-within{border-color:var(--color-brand)}.chat-composer input[type=text]{flex:1;min-width:0;padding:8px;border:0;background:transparent}.chat-composer input:focus{background:transparent}.chat-send{color:var(--color-brand)}.chat-send:hover:not(:disabled){background:var(--color-accent)}.member-popover-anchor{position:relative}.member-popover{position:absolute;z-index:5;top:calc(100% + 10px);right:0;width:min(272px,calc(100vw - 40px));padding:8px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-popover);box-shadow:0 16px 40px var(--color-shadow);transform-origin:top right;animation:popover-in .2s cubic-bezier(.2,.8,.2,1) both}.member-popover-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 8px 10px}.member-popover-list{display:flex;flex-direction:column;gap:2px;max-height:min(280px,45vh);overflow-y:auto;overscroll-behavior:contain;padding:2px}.member-popover-list>p{padding:8px}.member{display:flex;align-items:center;gap:10px;min-width:0;padding:6px 8px;border-radius:8px}.member:hover{background:var(--color-hover)}.member .artwork{width:28px;border-radius:50%}.member>span{min-width:0}.new-messages{background:var(--color-primary);color:var(--color-primary-foreground);align-self:center;padding:6px 12px;border-radius:8px;margin-bottom:8px}.search-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:28px}.segmented{display:flex;background:var(--color-surface);padding:3px;border-radius:8px}.segmented button{border-radius:4px;padding:6px 12px;font-size:var(--text-ui-caption);color:var(--color-foreground-subtle)}.segmented button[aria-pressed=true]{background:var(--color-selected);color:var(--color-foreground)}.pagination{display:flex;justify-content:center;align-items:center;gap:20px;padding:24px 0 8px}.search-history{display:flex;flex-wrap:wrap;gap:8px}.history-row time{flex-shrink:0}.history-date{padding:24px 8px 8px}.load-more{display:flex;margin:24px auto 0}.modal{width:min(480px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;overflow:auto;border:1px solid var(--color-border);border-radius:16px;background:var(--color-popover);color:var(--color-foreground);box-shadow:0 24px 64px var(--color-shadow);font-size:var(--text-ui-base)}.modal::backdrop{background:var(--color-overlay)}.modal-wide{width:min(760px,calc(100vw - 48px))}.modal-header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;border-bottom:1px solid var(--color-border);background:var(--color-popover)}.modal-body{padding:24px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.main-content.settings-view{overflow:hidden;scrollbar-gutter:auto;background:var(--color-background)}.settings-page{container:settings / inline-size;display:flex;flex-direction:column;height:100%;min-height:0}.settings-page-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;width:100%;max-width:1120px;margin:0 auto;padding:28px 40px 20px}.settings-page-header h1{outline:none}.settings-page-form{display:flex;flex-direction:column;flex:1;min-height:0}.settings-fields{border:0;margin:0;padding:0;min-width:0}.settings-page-footer{display:flex;align-items:center;justify-content:flex-end;gap:20px;flex-shrink:0;width:100%;max-width:1120px;margin:0 auto;padding:16px 40px 24px}.settings-save-status{flex:1;min-width:0;overflow-wrap:anywhere}.settings-page-footer .button-primary{min-width:96px}.settings-title-trigger{padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:inherit}.settings-title-trigger:active{transform:none}.settings-page-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:16px 40px 48px}.settings-content{display:flex;flex-direction:column;gap:40px;max-width:1040px;margin:0 auto}.settings-section{min-width:0}.settings-section h3{margin-bottom:16px}.settings-group{padding:0 20px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface)}.settings-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;min-height:86px;padding:18px 0}.settings-row+.settings-row{border-top:1px solid var(--color-border)}.settings-row-copy{min-width:0}.settings-row-title{display:block;font-weight:600}.settings-row-copy p{margin-top:4px;overflow-wrap:anywhere}.settings-row-control{display:flex;justify-content:flex-end;align-items:center;min-width:0;max-width:320px}.settings-row-control select{width:auto;max-width:100%;min-width:128px;padding:8px 12px}.settings-row-control button{white-space:nowrap}.settings-row-field .settings-row-control{width:280px}.settings-row-control textarea{resize:vertical;min-height:88px;max-height:220px}.settings-row-control select:disabled{opacity:.5;cursor:not-allowed}.settings-volume-control{display:flex;align-items:center;gap:16px;width:100%}.settings-volume-control output{min-width:4ch;text-align:right;font-variant-numeric:tabular-nums}.settings-error{padding-bottom:16px}.settings-switch[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;width:40px;height:24px;margin:0;border:1px solid var(--color-border-hover);border-radius:999px;background:var(--color-selected);cursor:pointer}.settings-switch[type=checkbox]:before{content:"";display:block;width:18px;height:18px;margin:2px;border-radius:50%;background:var(--color-foreground);transform:translate(0);transition:transform .15s ease}.settings-switch[type=checkbox]:checked{border-color:var(--color-primary);background:var(--color-primary)}.settings-switch[type=checkbox]:checked:before{background:var(--color-primary-foreground);transform:translate(16px)}.settings-switch[type=checkbox]:focus{background:var(--color-selected)}.settings-switch[type=checkbox]:checked:focus{background:var(--color-primary)}.settings-switch[type=checkbox]:focus-visible,.settings-row-control input[type=range]:focus-visible{outline:2px solid var(--color-brand);outline-offset:4px}.help-content{display:flex;flex-direction:column;gap:24px}.help-content h3{margin-bottom:8px}.help-content p{color:var(--color-foreground-subtle);line-height:1.8}.notifications{--notification-top: calc(88px + env(safe-area-inset-top)) ;position:fixed;top:var(--notification-top);left:50%;transform:translate(-50%);width:min(420px,calc(100vw - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:calc(100dvh - var(--notification-top) - 24px - env(safe-area-inset-bottom));overflow-y:auto;scrollbar-width:none;z-index:20;display:flex;flex-direction:column;gap:8px;pointer-events:none}.notifications::-webkit-scrollbar{display:none}.toast{display:flex;align-items:center;gap:12px;flex-shrink:0;padding:12px 16px;border:1px solid var(--color-border);border-radius:16px;background:var(--color-toast);box-shadow:0 8px 24px var(--color-shadow);pointer-events:auto}.toast p{flex:1;min-width:0;overflow-wrap:anywhere}.toast-error>svg{color:var(--color-destructive)}.toast-success>svg{color:var(--color-success)}.toast-warning>svg{color:var(--color-warning)}.toast-info>svg{color:var(--color-brand)}@media (max-width: 1100px){.page-content{padding:24px}.album-feature{grid-template-columns:180px minmax(0,1fr);gap:20px;padding:20px}.detail-panel{--detail-panel-width: 420px}.workspace-body:has(.detail-panel) .album-feature{grid-template-columns:1fr}.workspace-body:has(.detail-panel) .album-large{max-width:240px}.song-album{display:none}.song-table-heading{grid-template-columns:22px minmax(0,1fr) 48px 84px}.song-table-heading .table-album{display:none}.player-bar{gap:12px}.player-tools .volume-slider{width:60px;margin-right:4px}}@media (max-width: 767px){.app-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:0}.workspace{grid-column:1;grid-row:1}.workspace-header{height:64px;padding:0 12px;gap:8px}.header-leading{gap:0}.header-leading .icon-button,.header-leading .header-menu summary{width:28px;height:36px}.header-leading .header-forward{display:none}.header-search-area{gap:6px}.header-search-area .header-search{display:none}.mobile-search-button{color:var(--color-foreground-subtle)}.icon-button.mobile-search-button{display:inline-flex}.mobile-search-button[aria-current=page]{color:var(--color-brand)}.home-widget{width:32px;height:36px}.header-search-field{height:42px;padding:0 10px;gap:8px}.header-search-field>svg{width:18px}.search-popover{position:fixed;top:calc(64px + env(safe-area-inset-top));left:12px;right:12px}.workspace-title{gap:8px}.workspace-title>span{max-width:38vw}.connection-status>span{display:none}.header-actions{gap:0}.header-actions>button{display:none}.header-actions>.user-profile{display:flex}.mobile-brand,.mobile-settings{display:inline-flex}.detail-panel{display:none}.workspace-body{padding:0;gap:0;background:var(--color-content)}.main-content{border:0;border-radius:0}.page-content{padding:24px 16px 32px}.page-title{margin-bottom:24px}.page-title p{line-height:1.8}input:not([type=range]):not([type=checkbox]),textarea,select{font-size:var(--text-mobile-input-safe)}.search-toolbar,.room-toolbar{gap:8px}.room-toolbar{margin-bottom:20px}.room-toolbar .search-field{height:44px;padding:0 16px}.room-toolbar .button-primary{padding:10px 16px}.room-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.room-card{padding:10px;gap:10px}.room-art{aspect-ratio:1}.room-art>svg{width:36px;height:36px}.room-card-join{right:6px;bottom:6px;width:34px;height:34px}.room-skeleton .room-card-copy{min-height:78px}.join-summary{gap:12px}.join-art{width:72px}.now-playing{display:flex;flex-direction:column;gap:28px;margin-bottom:32px}.album-feature{display:flex;flex-direction:column;width:100%;max-width:320px;align-self:center;padding:16px;align-items:stretch}.album-caption{margin-top:16px}.listen-page{padding:16px}.lyrics-panel{width:100%}.lyric-line{text-align:center}.page-heading{margin-bottom:20px}.song-row,.history-row{gap:8px}.song-row .icon-button,.history-row .icon-button{width:28px}.song-row .song-index,.song-duration,.song-table-heading{display:none}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}.player-bar,.player-bar.glass-surface{grid-column:1;grid-row:2;display:flex;position:relative;gap:10px;margin:6px 8px;padding:6px 10px;border:0;border-radius:8px;background:var(--color-surface)}.player-artwork,.player-artwork .artwork{border-radius:6px}.player-artwork .artwork{width:44px}.player-song{padding-right:76px;border:0;background:transparent}.player-song strong{font-size:var(--text-ui-base)}.player-right{padding-left:8px;gap:0}.playback-progress{position:absolute;left:0;right:0;bottom:0;margin-top:0}.player-center{flex-shrink:0}.transport{gap:4px}.player-track{position:static}.player-time{top:30px;right:54px}.progress-track{height:2px;border-radius:0 0 8px 8px}.player-tools{display:none}.mobile-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-row:3;grid-column:1;background:var(--color-frame);padding:6px 8px calc(6px + env(safe-area-inset-bottom));border:0}.mobile-nav button{display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center;min-height:48px;background:none;color:var(--color-foreground-subtle);border:0;border-radius:8px}.mobile-nav button:active{background:var(--color-hover)}.mobile-nav .selected{color:var(--color-brand)}.chat-heading{padding:12px 16px}.chat-composer{margin:0 16px 16px}.chat-messages{padding:16px}.search-options{gap:8px}.search-recommend-hint{display:flex}.search-page{padding-top:8px}.search-filter-bar{padding:8px 0 12px}.search-inline-field{display:flex}.segmented button{padding:6px 10px}.history-toolbar{gap:4px}.history-toolbar .search-field{margin-right:4px}.modal,.modal-wide{width:100%;max-width:none;max-height:calc(100dvh - env(safe-area-inset-top) - 16px);margin:auto 0 0;border:0;border-radius:16px 16px 0 0;animation:sheet-up .24s cubic-bezier(.2,.8,.2,1) both}.modal-header{padding:12px 20px}.modal-body{padding:20px 20px calc(20px + env(safe-area-inset-bottom))}.notifications{--notification-top: calc(76px + env(safe-area-inset-top)) }}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@container settings (max-width: 640px){.settings-page-header{padding:20px 20px 16px}.settings-page-footer{padding:12px 20px 16px;gap:12px}.settings-page-body{padding:12px 16px 32px}.settings-content{gap:28px}.settings-section h3{margin-left:4px;margin-bottom:12px}.settings-group{padding:0 16px}.settings-row{gap:16px;min-height:80px;padding:16px 0}.settings-row-control{max-width:160px}.settings-row-control select{min-width:100px;padding:8px}.settings-row-field{grid-template-columns:minmax(0,1fr);gap:12px}.settings-row-field .settings-row-control{width:100%;max-width:none}}@media (prefers-reduced-transparency: reduce){.glass-surface{background:var(--color-sidebar);backdrop-filter:none;-webkit-backdrop-filter:none}}.help-version{align-self:flex-start;padding:8px 0;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:none;-webkit-touch-callout:none}.environment-options{display:flex;flex-direction:column;gap:12px}.environment-options [aria-pressed=true]{color:var(--color-primary)}