/* Music uses the same surfaces, sizing and semantic type roles as Help/History. */
@layer components {
  .music-card {height:min(700px,calc(100dvh - 170px));min-height:260px;container-type:inline-size;color:var(--text);--music-control-height:calc(var(--control-height,42px) * .761905 * var(--card-text-compensation,1));}
  .music-card-toolbar {gap:var(--card-gap);padding-block:var(--card-space-2);}
  .music-card-toolbar h2 {font-size:calc(var(--text-section-heading) * var(--type-scale,1) * var(--card-text-compensation,1));}
  .music-card-actions {display:flex;flex-wrap:wrap;gap:var(--card-gap);align-items:center;}
  .music-card-toolbar output {flex-basis:100%;font-size:calc(var(--text-meta) * var(--type-scale,1) * var(--card-text-compensation,1));overflow-wrap:anywhere;}
  .music-card .music-card-toolbar [role=status] {color:var(--text-muted);}
  .music-card-layout {display:grid;grid-template-columns:minmax(0,1.65fr) minmax(240px,1fr);gap:var(--card-gap);flex:1;min-height:0;}
  .music-library-region,.music-selected-region {min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;}
  .music-details-column {display:flex;flex-direction:column;gap:var(--card-gap);min-width:0;min-height:0;overflow:hidden;}
  .music-selected-region {flex:0 1 auto;max-height:calc(100% - 100px - var(--card-gap));overflow-wrap:anywhere;}
  .music-history-region {display:flex;flex-direction:column;flex:1;min-height:100px;min-width:0;overflow:hidden;}
  .music-history-region>h3 {flex:none;}
  .music-history-content {flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;overflow-wrap:anywhere;}
  .music-history-metrics {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--card-gap);margin:0 0 var(--card-space-3);}
  .music-history-metrics dt,.music-history-caption {color:var(--text-muted);font-size:calc(var(--text-meta) * var(--type-scale,1) * var(--card-text-compensation,1));}
  .music-history-metrics dd {margin:0;font-variant-numeric:tabular-nums;}
  .music-history-runs {list-style:none;margin:0;padding:0;}
  .music-history-runs li {padding-block:var(--card-space-2);border-top:1px solid var(--card-surface-border);font-size:calc(var(--text-meta) * var(--type-scale,1) * var(--card-text-compensation,1));}
  .music-history-runs li>div {display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--card-space-1);}
  .music-history-runs time {display:block;color:var(--text-muted);}
  .music-card-drop-hint {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--card-space-3);height:100%;min-height:140px;box-sizing:border-box;padding:var(--card-space-4);border:2px dashed var(--card-surface-border);border-radius:var(--card-surface-radius);text-align:center;}
  .music-card-drop-hint svg {flex:none;color:var(--view-emphasis);}
  .music-card-drop-hint strong {font-size:calc(var(--text-section-heading) * var(--type-scale,1) * var(--card-text-compensation,1));line-height:1.35;}
  .music-card-drop-hint small {color:var(--text-muted);}
  .music-card [data-music-drag-active=true] {border-color:var(--view-emphasis);background:color-mix(in srgb,var(--view-emphasis) 12%,var(--card-surface-fill));box-shadow:inset 0 0 0 1px var(--view-emphasis);}
  .music-card [data-music-drag-active=true] .music-card-drop-hint {border-color:var(--view-emphasis);}
  .music-card :is(button,input,select) {font-size:calc(var(--text-control) * var(--type-scale,1) * var(--card-text-compensation,1));min-height:var(--music-control-height);padding:var(--card-space-1) var(--card-space-2);}
  .music-card :is(p,label,summary) {font-size:calc(var(--text-body) * var(--type-scale,1) * var(--card-text-compensation,1));line-height:1.35;}
  .music-card :is(p,h3) {margin:0 0 var(--card-gap);}
  .music-card h3 {font-size:calc(var(--text-section-heading) * var(--type-scale,1) * var(--card-text-compensation,1));}
  .music-card :is(small,.music-song-duration,.music-entry-meta,output) {font-size:calc(var(--text-meta) * var(--type-scale,1) * var(--card-text-compensation,1));line-height:1.35;}
  .music-card [data-music-card-library]>p:first-child {display:none;}
  .music-card [data-song-search] {display:block;width:100%;margin-block:var(--card-space-1) var(--card-space-3);}
  .music-card [data-music-source-status] {display:block;margin-bottom:var(--card-gap);color:var(--text-muted);}
  .music-card .music-entry-wrapper:only-child>.music-folder-header {display:none;}
  .music-card .music-folder-header {margin-top:var(--card-space-3);}
  .music-card .music-song-item {gap:var(--card-space-1);}
  .music-card .music-entry-row {padding:var(--card-space-2);}
  .music-card .subsong-detail>strong {display:block;overflow-wrap:anywhere;font-size:calc(var(--text-section-heading) * var(--type-scale,1) * var(--card-text-compensation,1));}
  .music-card .song-folder-cover {width:min(180px,100%);max-height:180px;}
  .music-card [data-music-card-dependencies] {padding-top:var(--card-space-3);}
  .music-card .button-row {display:flex;flex-wrap:wrap;gap:var(--card-gap);}
  .music-card [hidden] {display:none;}
  .music-card[data-playback-only=true] .music-selected-region {flex:1;max-height:none;}
  .music-seek-label {display:block;margin-block:var(--card-space-3);}
  .music-seek-label input {display:block;width:100%;}
  [data-music-clock] {display:block;font-variant-numeric:tabular-nums;}
  [data-music-playback-status] {display:block;margin-block:var(--card-space-2);}
  .visualizer-summary {display:flex;flex-direction:column;gap:var(--card-gap);}
  @container(max-width:700px) {
    .music-card-layout {grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(100px,.6fr) minmax(200px,1fr);}
    .music-card-actions {gap:var(--card-space-1);}
    .music-card [data-music-card-help] {font-size:calc(var(--text-meta) * var(--type-scale,1) * var(--card-text-compensation,1));}
    .music-card .music-video-thumbnail {flex-basis:76px;}
  }
}
/* The developer drawer lives outside the hidden application shell in Gameless. */
body:has(.music-drawer:not([hidden])) .app-header {z-index:101;}
[data-music] {display:inline-flex;align-items:center;gap:var(--card-space-2);}
[data-immersive-action][hidden] {display:none;}
/* The legacy SongControls stylesheet is unlayered; override its drawer box here. */
.music-card .song-controls {border:0;background:transparent;margin:0;padding:0;}
.music-card .subsong-detail {padding:0;}
.music-card .song-controls :is(p,label,output) {font-size:calc(var(--text-body) * var(--type-scale,1) * var(--card-text-compensation,1));line-height:1.35;}
.music-card .song-controls label {margin-block:var(--card-space-2);}
.music-card .song-controls .duration-control label {margin:0;}
/* Immersion hides presentation without exchanging cards or collapsing layout. */
body.immersive-mode :is(.app-shell,.secondary-drawer,.drawer-backdrop,.mini-card-layer) {visibility:hidden!important;pointer-events:none!important;}
.immersive-view {position:fixed;inset:0;z-index:200;outline:none;display:flex;align-items:flex-end;justify-content:center;padding:24px;box-sizing:border-box;}
.immersive-view[hidden] {display:none;}
.immersive-exit-hint {display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-surface,12px);background:var(--surface);color:var(--text);opacity:0;transition:opacity 160ms ease;}
.immersive-exit-hint.visible {opacity:1;pointer-events:auto;}
.immersive-exit-hint {max-width:900px;max-height:calc(100dvh - 180px);overflow:auto;pointer-events:none;}
.immersive-exit-hint [hidden] {display:none!important;}
.immersive-theme-controls {display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;flex-basis:100%;max-width:100%;}
.immersive-theme-controls > label {display:grid;gap:4px;min-width:150px;max-width:100%;}
.immersive-exit-hint select {max-width:100%;}
.immersive-colors,.immersive-background-controls {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;}
.immersive-colors {flex:0 1 auto;max-width:100%;}
.immersive-colors label {display:grid;grid-template-columns:auto auto;gap:4px 8px;max-width:200px;}
.immersive-colors input {grid-column:1/-1;width:100%;}
.immersive-help {flex-basis:100%;text-align:center;font-size:.85rem;}
.immersive-exit-hint button {min-height:44px;}
.immersive-music-controls {position:absolute;top:24px;right:24px;max-width:calc(50% - 32px);padding:12px;border:1px solid var(--line);border-radius:var(--radius-surface,12px);background:var(--surface);color:var(--text);opacity:0;transition:opacity 160ms ease;pointer-events:none;}
.immersive-music-controls[hidden] {display:none;}
.immersive-music-controls.visible {opacity:1;pointer-events:auto;}
.immersive-music-controls .button-row {display:flex;flex-wrap:wrap;gap:8px;}
.immersive-music-controls button {min-height:44px;flex:1;}
.immersive-view.has-music-controls .immersive-track-info {max-width:min(360px,calc(50% - 32px));}
.immersive-view[data-reduced-motion=true] .immersive-music-controls {transition:none;}
@media(max-width:600px){.immersive-music-controls {top:16px;right:16px;max-width:calc(50% - 24px);}.immersive-music-controls .button-row {flex-direction:column;}.immersive-view.has-music-controls .immersive-track-info {max-width:calc(50% - 24px);flex-direction:column;align-items:flex-start;}}
.immersive-view[data-reduced-motion=true] .immersive-exit-hint {transition:none;}
@media(max-width:600px){.immersive-exit-hint span {font-size:.85rem;text-align:center;}}

.visualizer-background-controls {display:flex;flex-wrap:wrap;align-items:center;gap:var(--card-gap);}
.visualizer-background-controls label {flex:1 1 240px;min-width:0;}
.visualizer-background-controls input {width:100%;}

[data-feverscape-only][hidden] {display:none;}

.current-track-info {display:flex;align-items:center;gap:12px;min-width:0;}
.current-track-artwork {width:72px;height:72px;object-fit:contain;flex:0 0 72px;border-radius:var(--radius-surface,8px);}
.current-track-artwork[hidden] {display:none;}
.current-track-details {display:flex;flex-direction:column;gap:4px;min-width:0;}
.current-track-details :is(strong,span) {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.current-track-details [hidden] {display:none;}
.sequence-toggles {display:flex;flex-wrap:wrap;gap:4px 16px;}
.sequence-toggles .toggle-row {margin-block:4px;}
.sequence-controls summary {cursor:pointer;}
.immersive-track-info {position:absolute;top:24px;left:24px;max-width:min(360px,calc(100% - 48px));padding:12px;border-radius:var(--radius-surface,12px);background:var(--surface);color:var(--text);border:1px solid var(--line);opacity:0;transition:opacity 160ms ease;pointer-events:none;}
.immersive-track-info.visible {opacity:1;}
.immersive-view[data-reduced-motion=true] .immersive-track-info {transition:none;}
.immersive-track-info .current-track-details {font-size:.9rem;}
@media(max-width:600px){.immersive-track-info {top:16px;left:16px;max-width:calc(100% - 32px);}.current-track-artwork {width:64px;height:64px;flex-basis:64px;}}
