:root{
    --motion-fast:150ms;--motion-menu:240ms;--motion-view:420ms;
    --nav-safe-bottom:env(safe-area-inset-bottom,0px);
    --nav-safe-left:env(safe-area-inset-left,0px);
    --nav-safe-right:env(safe-area-inset-right,0px);
    --nav-viewport-x:0px;--nav-viewport-y:0px;--nav-viewport-bottom:0px;
    --nav-viewport-width:100vw;--nav-viewport-height:100dvh;
}
.icon-button{flex-shrink:0;touch-action:manipulation;transition:background-color var(--motion-fast),color var(--motion-fast),box-shadow var(--motion-fast),border-radius var(--motion-view)}
.icon-button svg{flex-shrink:0;pointer-events:none}
.icon-button:focus-visible,.card-actions-menu button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.shortcut-handle{cursor:default}
.shortcut-sorting .shortcut-handle,.personal-layout-handle,[data-queue-handle],[data-canvas-handle]{cursor:grab;touch-action:none}
.shortcut-sorting .shortcut-handle:active,.personal-layout-handle:active,[data-queue-handle]:active,[data-canvas-handle]:active{cursor:grabbing;background:var(--accent-soft)}
.moving-selection[data-selection-ready]>.selection-indicator{transition:opacity var(--motion-fast),border-radius var(--motion-view)}
.nav-select .ts-control,.nav-select .select-chevron,.nav-select-menu .option{transition-duration:var(--motion-fast)}
.nav-select-menu{transition:opacity var(--motion-menu),transform var(--motion-menu) var(--ease),border-radius var(--motion-view)}
.nav-select-menu .ts-dropdown-content,.card-actions-menu{overscroll-behavior:contain;scrollbar-width:thin}
.card-actions-menu{overflow:auto;transition:opacity var(--motion-menu),transform var(--motion-menu) var(--ease),display var(--motion-menu) allow-discrete,overlay var(--motion-menu) allow-discrete}
.card-actions-menu[data-closing]{pointer-events:none}
.context-heading{overflow-wrap:anywhere}
.dialog,.music-library{position:fixed;top:var(--nav-viewport-y);bottom:var(--nav-viewport-bottom);left:var(--nav-viewport-x);right:calc(100vw - var(--nav-viewport-x) - var(--nav-viewport-width));margin:auto;height:fit-content;max-width:calc(var(--nav-viewport-width) - 28px);max-height:calc(var(--nav-viewport-height) - 28px);overflow:auto;overscroll-behavior:contain;scroll-padding-block:20px;transition:opacity var(--motion-menu),transform var(--motion-menu) var(--ease),display var(--motion-menu) allow-discrete,overlay var(--motion-menu) allow-discrete}
.music-library>header{position:sticky;top:0;z-index:4;min-height:40px;background:var(--music-glass);box-shadow:0 -26px 0 var(--music-glass),0 8px 14px color-mix(in srgb,var(--music-ink) 8%,transparent);backdrop-filter:blur(20px)}
.music-library>header h2{min-width:0;overflow-wrap:anywhere}
.music-library>header [data-music=close]{flex-shrink:0}
.dialog::backdrop,.music-library::backdrop{transition-duration:var(--motion-menu)}
.dialog :is(input,textarea,button,.nav-select),.music-library :is(input,button,.nav-select){scroll-margin-block:18px}
.appearance-editor{grid-template-columns:minmax(0,1fr);container-type:inline-size}
.appearance-editor>*{min-width:0}
.appearance-editor :is(input,textarea,.nav-select){min-width:0;max-width:100%}
@container(max-width:280px){
    .appearance-editor .setting-row{flex-wrap:wrap;gap:8px}
    .appearance-editor .setting-row>input[type=range]{width:100%}
    .appearance-editor .theme-slider{grid-template-columns:minmax(0,1fr) 42px;gap:8px}
    .appearance-editor .theme-slider>label{grid-column:1/-1}
    .appearance-editor .theme-stop{grid-template-columns:28px minmax(0,1fr) 34px 24px;gap:6px}
    .appearance-editor .theme-stop input[type=color]{width:28px;height:28px}
    .appearance-editor .theme-stop .icon-button{width:24px;height:28px}
    .appearance-editor .palette-options{grid-template-columns:repeat(3,minmax(0,1fr))}
    .appearance-editor .preset-save-row{flex-wrap:wrap}
    .appearance-editor .preset-save-row input{flex-basis:100%}
}
.command-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}
.command-results{min-height:0;max-height:min(460px,calc(var(--nav-viewport-height) - 150px))}
input[type=range]:focus:not(:focus-visible){outline:none;box-shadow:none}
input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.music-root input[type=range]:focus-visible{outline:2px solid var(--music-accent);outline-offset:3px}
.music-root .music-range:has(input:focus-visible){outline:2px solid var(--music-accent);outline-offset:3px;border-radius:var(--r-small)}
.music-root .music-range input[type=range]:focus-visible{outline:none}
.music-root .music-dock{bottom:calc(var(--nav-viewport-bottom) + max(24px,var(--nav-safe-bottom)));max-height:calc(var(--nav-viewport-height) - max(48px,var(--nav-safe-bottom) + 24px))}
.music-root .music-immersive .music-dock{bottom:auto;max-height:none}

/* Suggested themes use opaque text surfaces; music keeps its own color settings. */
[data-color-protection=true] :is(.link-card,.widget,.sidebar,.search-box,.dialog,.nav-select-menu){background:var(--theme-safe-surface);color:var(--theme-safe-text)}
html[data-color-protection=true] .personal-components :is(.widget,.widget+.widget){background:var(--theme-safe-surface);color:var(--theme-safe-text)}
/* Foreground and its opaque surface switch together; decorative gradients animate separately. */
html[data-color-protection=true] :is(.link-card,.widget,.sidebar,.search-box,.dialog,.nav-select-menu,.topbar,.clock,.greeting,.engines,.library-toolbar,.section-heading,.personal-toolbar,.home-footer,.music-library),
html[data-color-protection=true] :is(.link-card,.widget,.sidebar,.search-box,.dialog,.nav-select-menu,.topbar,.clock,.greeting,.engines,.library-toolbar,.section-heading,.personal-toolbar,.home-footer,.music-library) :is(h1,h2,h3,p,span,a,button,label,input,textarea){transition-property:transform,box-shadow,border-color,opacity!important}
[data-color-protection=true] :is(.card-copy h3,.widget h2,.dialog-heading h2,.nav-item.active,.command-option strong){color:var(--theme-safe-text)}
[data-color-protection=true] :is(.card-copy p,.eyebrow,.sidebar-label,.nav-item,.form-grid label,.setting-row,.command-option small){color:var(--theme-safe-muted)}
[data-color-protection=true] :is(.search-box input,.widget textarea,.form-grid input,.form-grid textarea,.nav-select .ts-control){background:var(--theme-safe-surface);color:var(--theme-safe-text)}
[data-color-protection=true] :is(.search-box input,.widget textarea,.form-grid input,.form-grid textarea)::placeholder{color:var(--theme-safe-muted);opacity:1}
[data-color-protection=true] :is(.primary-button,.accent-button,.search-go){background:var(--theme-safe-button);color:#fff}
[data-color-protection=true] .dialog-heading{background:var(--theme-safe-surface)}
[data-color-protection=true] .dialog .form-actions{background:var(--theme-safe-surface);color:var(--theme-safe-text)}
[data-color-protection=true] .selection-indicator{background:var(--theme-safe-surface);box-shadow:inset 0 0 0 1px var(--theme-safe-accent)}
[data-color-protection=true] :is(.segmented .active,.toolbar-actions .icon-button,.nav-select-menu .option){color:var(--theme-safe-text)}
[data-color-protection=true] .toolbar-actions .accent-button{color:#fff}
[data-color-protection=true] .nav-select-menu .option.selected{background:var(--theme-safe-surface);color:var(--theme-safe-accent)}
[data-color-protection=true] .nav-select-menu .option.active{background:var(--theme-safe-surface);box-shadow:inset 0 0 0 1px var(--theme-safe-accent)}
[data-color-protection=true] :is(.topbar,.clock,.greeting,.engines,.library-toolbar,.section-heading,.personal-toolbar,.home-footer,.music-library){background:var(--theme-safe-surface);color:var(--theme-safe-text);text-shadow:none;border-radius:var(--r-large)}
[data-color-protection=true] .topbar{border-radius:0 0 var(--r-large) var(--r-large)}
[data-color-protection=true] .clock{padding:10px 16px}
[data-color-protection=true] .greeting{width:fit-content;max-width:100%;padding:5px 10px;margin:8px auto 16px;border-radius:var(--r-small)}
[data-color-protection=true] .engines{width:fit-content;max-width:100%;padding:4px;margin-inline:auto;border-radius:var(--r-small)}
[data-color-protection=true] :is(.library-toolbar,.section-heading){padding:8px 10px}
[data-color-protection=true] .personal-toolbar{padding:10px 12px;border-color:var(--line)}
[data-color-protection=true] .home-footer{padding-inline:12px}
[data-color-protection=true] :is(.clock-time,.topbar .brand,.topbar .icon-button,.topbar .text-button,.personal-tools .icon-button,.engine,.engine.active,.personal-space,.personal-space.active,.home-footer .text-button){color:var(--theme-safe-text)}
[data-color-protection=true] :is(.clock-date,.clock-time>span:last-child,.eyebrow,.library h1 span,.toolbar-actions,.section-heading svg,.section-heading span){color:var(--theme-safe-muted)}
[data-color-protection=true] :is(.topbar .icon-button:hover,.topbar .text-button:hover,.personal-tools .icon-button:hover,.engine:hover,.engine.active,.personal-space.active){background:var(--theme-safe-surface);color:var(--theme-safe-accent)}
[data-color-protection=true] .music-library>header{background:var(--theme-safe-surface);color:var(--theme-safe-text);box-shadow:0 -26px 0 var(--theme-safe-surface),0 8px 14px color-mix(in srgb,var(--theme-safe-text) 8%,transparent)}
[data-color-protection=true] .music-library :is(button,input,select,.music-full-lyrics,.music-lyric-row){color:var(--theme-safe-text)}
[data-color-protection=true] .music-library :is(.music-source,.music-toolbar>span,.music-empty,.music-tabs span,.lyric-diagnostic-grid dt,.lyric-calibration p,.lyric-calibration small){color:var(--theme-safe-muted)}
[data-color-protection=true] .music-library :is(.lyric-diagnostics,.music-full-lyrics .active){background:var(--theme-safe-surface)}
[data-color-protection=true] .music-library button:hover{background:var(--theme-safe-surface);color:var(--theme-safe-accent)}
[data-color-protection=true] .music-library input:not([type=file],[type=range]){background:var(--theme-safe-surface);color:var(--theme-safe-text)}
[data-color-protection=true] .music-library input::placeholder{color:var(--theme-safe-muted);opacity:1}
[data-color-protection=true] .music-library :is(.music-tabs button[aria-selected=true],.music-full-lyrics .active,.music-platform-link){color:var(--theme-safe-accent)}
[data-color-protection=true] .music-library .music-tabs button[aria-selected=true]:after{background:var(--theme-safe-accent)}
[data-color-protection=true] .music-library [data-search] button{background:var(--theme-safe-button);color:#fff}
[data-color-protection=true] .music-root .music-lyrics.visible{background:var(--theme-safe-surface);color:var(--theme-safe-text);opacity:1;text-shadow:none;border-radius:var(--r-small);padding:6px 12px}
[data-color-protection=true] .music-root .music-lyrics.visible .music-karaoke:not([data-word-timed]){background-image:var(--theme-safe-lyrics-gradient),linear-gradient(var(--theme-safe-muted),var(--theme-safe-muted));background-size:var(--line-progress) 100%,100% 100%;background-repeat:no-repeat;filter:none}
[data-color-protection=true] .music-root .music-lyrics.visible .music-karaoke-word{background-image:var(--theme-safe-lyrics-gradient),linear-gradient(var(--theme-safe-muted),var(--theme-safe-muted));background-size:var(--word-progress) 100%,100% 100%;background-repeat:no-repeat;filter:none}
[data-color-protection=true] .music-root .music-live-lyrics{background:var(--theme-safe-surface);color:var(--theme-safe-text);border-radius:var(--r-small);mask-image:none}
[data-color-protection=true] .music-root .music-live-lyrics .music-lyric-row{opacity:1;color:var(--theme-safe-muted);filter:none}
[data-color-protection=true] .music-root .music-live-lyrics .music-lyric-row.active{color:var(--theme-safe-text)}
[data-color-protection=true] .music-root .music-live-lyrics .active .music-karaoke:not([data-word-timed]){background-image:var(--theme-safe-lyrics-gradient),linear-gradient(var(--theme-safe-muted),var(--theme-safe-muted));background-size:var(--line-progress) 100%,100% 100%;background-repeat:no-repeat}
[data-color-protection=true] .music-root .music-live-lyrics .active .music-karaoke-word{background-image:var(--theme-safe-lyrics-gradient),linear-gradient(var(--theme-safe-muted),var(--theme-safe-muted));background-size:var(--word-progress) 100%,100% 100%;background-repeat:no-repeat;filter:none}
[data-color-protection=true] .music-root .music-translation{color:var(--theme-safe-muted);text-shadow:none}

@media(max-width:700px){
    .dialog:has(.appearance-editor),.personal-dialog-wide,.music-library,.page-capture-dialog,.collection-editor{
        position:fixed;inset:auto;left:calc(var(--nav-viewport-x) + 8px);bottom:calc(var(--nav-viewport-bottom) + max(8px,var(--nav-safe-bottom)));
        margin:0;width:calc(var(--nav-viewport-width) - 16px);max-width:calc(var(--nav-viewport-width) - 16px);
        max-height:calc(var(--nav-viewport-height) - max(24px,var(--nav-safe-bottom) + 16px));border-radius:var(--r-large);
    }
    :is(.dialog:has(.appearance-editor),.personal-dialog-wide,.page-capture-dialog,.collection-editor) .dialog-heading{position:sticky;top:0;z-index:2;background:var(--surface)}
    [data-color-protection=true] .dialog .dialog-heading{background:var(--theme-safe-surface)}
    .dialog:has(.appearance-editor) .form-actions{flex-wrap:wrap;padding-bottom:8px}
    .command-dialog{position:fixed;inset:auto;left:calc(var(--nav-viewport-x) + 12px);top:calc(var(--nav-viewport-y) + 20px);margin:0;width:calc(var(--nav-viewport-width) - 24px);max-height:calc(var(--nav-viewport-height) - 40px)}
    .command-dialog .command-input-row{min-width:0;padding:14px}
    .command-input{font-size:16px;min-width:0}
    .card-actions-menu.mobile-actions{right:auto;bottom:auto;max-height:calc(var(--nav-viewport-height) - 24px);padding:12px}
    .dialog .form-actions{gap:8px;flex-wrap:wrap}
    .dialog .form-actions>*{max-width:100%;min-width:0}
    .dialog-heading h2{min-width:0;overflow-wrap:anywhere}
    .music-root .music-dock{left:calc(var(--nav-viewport-x) + max(12px,var(--nav-safe-left)));bottom:calc(var(--nav-viewport-bottom) + max(12px,var(--nav-safe-bottom)));max-width:calc(var(--nav-viewport-width) - max(12px,var(--nav-safe-left)) - max(12px,var(--nav-safe-right)));max-height:calc(var(--nav-viewport-height) - max(32px,var(--nav-safe-bottom) + 12px))}
    .music-root .music-immersive .music-dock{left:auto;max-width:none}
    .music-root .music-lyrics[data-position=dock]{bottom:calc(var(--nav-viewport-bottom) + max(12px,var(--nav-safe-bottom)) + 104px)}
    .music-root:not([data-shape=panel]) .music-lyrics{left:calc(var(--nav-viewport-x) + 18px);right:calc(100vw - var(--nav-viewport-x) - var(--nav-viewport-width) + 18px);bottom:calc(var(--nav-viewport-bottom) + max(12px,var(--nav-safe-bottom)) + 104px)}
    .home-footer{padding-bottom:calc(20px + var(--nav-safe-bottom))}
}
@media(prefers-reduced-motion:reduce){
    .nav-select-menu,.card-actions-menu,.dialog,.music-library,.selection-indicator{transition-duration:1ms!important;animation:none!important}
    .nav-select-menu,.card-actions-menu{transform:none!important}
}
.motion-off :is(.nav-select-menu,.card-actions-menu,.dialog,.music-library,.selection-indicator){transition-duration:1ms!important;animation:none!important}
