/* Shared listening surfaces; creative DSP and workflow are untouched. */
:root {
  --listening-light: 112, 232, 219;
  --listening-strength: .12;
}
.direction-icon { width: 20px; height: 20px; color: #a8eade; flex-shrink: 0; }
.direction-badge { font-size: 11px; color: #b9e8dc; letter-spacing: .02em; }
.md-preset { align-content: start; gap: 8px; }
.md-preset small { line-height: 1.5; }
.remix-direction-choice { position: relative; min-width: 0; }
.remix-preset-grid .remix-direction-choice > [data-preset] {
  width: 100%; height: 100%; display: flex; flex-direction: column;
  align-items: flex-start; gap: 8px; text-align: left; min-height: 150px;
}
.remix-preset-grid .remix-direction-choice strong { padding-right: 26px; }
.remix-preset-grid .remix-direction-choice .direction-summary { font-size: 12px; line-height: 1.5; color: #c0ddd5; }
.remix-preset-grid .remix-direction-choice .md-favorite { position: absolute; top: 0; right: 0; width: 44px; height: 44px; min-height: 44px; padding: 0; border: none; display: grid; place-items: center; background: transparent; color: #a8cfc3; border-radius: 10px; }
.remix-direction-choice .md-favorite svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.remix-direction-choice .md-favorite[aria-pressed="true"] { color: #baffdf; }
.remix-direction-choice .md-favorite[aria-pressed="true"] svg { fill: currentColor; }
.listening-focus-toggle, .listening-focus-exit {
  min-height: 44px; padding: 10px 16px; border: 1px solid #90cfc255;
  border-radius: 12px; background: #16454c; color: #eafff6;
  font: 600 13px system-ui, sans-serif; cursor: pointer;
}
.music-room-page .listening-focus-toggle { position: absolute; top: 16px; left: 16px; z-index: 5; }
.listening-focus-exit { position: fixed; top: max(16px, env(safe-area-inset-top)); right: 20px; z-index: 96; }
.listening-focus-exit[hidden] { display: none; }
.focus-direction-change { border: 0; background: transparent; color: #b5f1e1; font: 12px system-ui, sans-serif; padding: 8px 0; min-height: 44px; text-align: left; cursor: pointer; }
.listening-focus .listening-focus-toggle { visibility: hidden; }
.music-room-page.listening-focus .side,
.music-room-page.listening-focus .mobile-top,
.music-room-page.listening-focus .mobile-nav,
.music-room-page.listening-focus .topbar,
.music-room-page.listening-focus #view > :not(#stage) { display: none; }
.music-room-page.listening-focus .app { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'main' 'player'; }
.music-room-page.listening-focus .main { padding: 80px 24px 210px; }
.music-room-page.listening-focus #stage { width: min(1100px, 100%); margin: 0 auto; }
.music-room-page.listening-focus .hero-specs,
.music-room-page.listening-focus .hero-note { display: none; }
.remix-studio-page.listening-focus .site-header,
.remix-studio-page.listening-focus .lab-bottom-nav,
.remix-studio-page.listening-focus .remix-main > :not(.remix-workspace),
.remix-studio-page.listening-focus .remix-workspace > .ui-render-aside,
.remix-studio-page.listening-focus .remix-workspace > .remix-stack > :not(.studio-timeline) { display: none; }
.remix-studio-page.listening-focus .remix-main { padding-top: 90px; }
.remix-studio-page.listening-focus .remix-workspace { display: block; max-width: 1100px; margin: auto; }
.studio-wave-readout { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin: 12px 0; font-size: 12px; color: #c4e7dd; }
.studio-scrub { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; color: #c4e7dd; font-size: 12px; }
.studio-scrub input { width: 100%; min-width: 0; min-height: 44px; accent-color: #86ede0; }
.music-room-page .hero-seek .track-bar { min-height: 44px; touch-action: pan-y; }
.studio-selection-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 16px; }
.studio-selection-actions button { min-height: 44px; padding: 8px 12px; border: 1px solid #a9e8db38; border-radius: 10px; background: #17474e; color: #ecfff7; cursor: pointer; }
#studioWave::part(region) { border: 1px solid #aefff0; background: #79ded426; }
#studioWave::part(region-handle) { min-width: 20px; border-width: 2px; }
@media (max-width: 700px) {
  .music-room-page.listening-focus .main { padding: 78px 12px 185px; }
  .music-room-page.listening-focus .player { bottom: max(12px, env(safe-area-inset-bottom)); }
  .music-room-page.listening-focus .music-direction-quick { bottom: 90px; }
  .music-room-page.listening-focus[data-playback-health="error"] .music-direction-quick,
  .music-room-page.listening-focus[data-playback-health="offline"] .music-direction-quick { bottom: 134px; }
  .listening-focus-exit { right: 12px; }
  .remix-studio-page.listening-focus .remix-main { padding-top: 80px; }
}
body.music-room-page {
  --bg: #eaf5f3; --bg-2: #deeeeb; --panel: #f8fffd; --panel-2: #eff9f6;
  --accent: #147e78; --accent-deep: #09605e; --accent-ink: #09605e;
  --accent-soft: #d3eee7; --accent-glow: #278f8526;
  --ink: #102d32; --ink-2: #28484c; --muted: #4a686c;
  --line: #bad4ce; --line-2: #a5c9c0;
  font-family: Jost, system-ui, sans-serif;
}
[data-theme="dark"] body.music-room-page {
  --bg: #071e22; --bg-2: #0b292f; --panel: #10343a; --panel-2: #153f45;
  --accent: #86ede0; --accent-deep: #339d96; --accent-ink: #b5fff0;
  --accent-soft: #164b4d; --accent-glow: #86ede02b;
  --ink: #f1fff9; --ink-2: #d4eee6; --muted: #a9cec5;
  --line: #b0e8dc25; --line-2: #b0e8dc40;
}
.music-room-page .stage,
.remix-studio-page .studio-timeline {
  background-image: radial-gradient(ellipse at 50% 100%, rgba(var(--listening-light), var(--listening-strength)), transparent 70%);
  border-radius: 24px;
  border-color: #aeece338;
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
.remix-studio-page { --lab-muted: #b0cec8; --rs-ink-subtle: #b0cec8; }
.remix-studio-page .remix-panel {
  background-color: #103238;
  border-color: #b2ded41c;
}
.remix-studio-page .studio-timeline { background-color: #113b40; }
.music-room-page .player { backdrop-filter: blur(8px); }
.music-room-page .aurora-glass {
  --ink: inherit; --ink-2: inherit; --muted: inherit;
  --panel: inherit; --panel-2: inherit; --bg-2: inherit;
  --line: inherit; --line-2: inherit; --accent: inherit; --accent-deep: inherit;
  --accent-ink: inherit; --accent-soft: inherit; --accent-glow: inherit;
  --amb-color: inherit;
  --aurora-grid: #5ca99914;
  --aurora-glowspot: rgba(var(--listening-light), .18), rgba(var(--listening-light), .06);
  background: linear-gradient(175deg, var(--panel), var(--bg-2));
  border-color: var(--line-2);
  box-shadow: 0 12px 36px #00352d16;
}
.music-room-page .aurora-glass::after { box-shadow: inset 0 0 0 1px var(--line), 0 0 18px rgba(var(--listening-light), .08); }
.music-direction-quick,
.music-direction-dialog {
  background-color: #10383e;
  border-color: #b3f2e540;
  background-image: radial-gradient(ellipse at 50% 100%, rgba(var(--listening-light), var(--listening-strength)), transparent 75%);
}
.music-direction-quick { box-shadow: 0 8px 24px #001d2426; }
.music-direction-quick button,
.music-direction-dialog button,
.remix-studio-page .remix-button,
.remix-studio-page .remix-preset-grid button {
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 150ms ease;
}
.music-direction-quick button:active,
.music-direction-dialog button:active,
.remix-studio-page .remix-button:active,
.remix-studio-page .remix-preset-grid button:active { transform: scale(.98); }
.music-direction-quick button[aria-pressed="true"],
.music-direction-dialog .md-preset.selected,
.remix-studio-page .remix-preset-grid .is-selected {
  box-shadow: 0 0 18px rgba(var(--listening-light), .14);
}
@media (hover: hover) {
  .music-direction-dialog .md-preset:hover,
  .remix-studio-page .remix-preset-grid button:hover { border-color: #aeece385; }
}
/* Compact mobile dock: full favorites remain available in the native dialog. */
@media (max-width: 700px) {
  .music-direction-quick {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(105px, 1fr);
    gap: 10px; padding: 8px 10px; border-radius: 18px;
    bottom: 146px;
  }
  .md-quick-presets { min-width: 0; display: block; }
  #musicQuickFavorites, #musicQuickOriginal, #musicQuickProtection { display: none; }
  .md-quick-presets .music-direction-launch {
    width: 100%; max-width: 100%; min-height: 44px; padding: 8px !important;
    background: #204a50; border: 1px solid #b2eede38; border-radius: 12px;
    color: #f1fff9; font-size: 12px; text-align: left;
  }
  .md-quick-presets .music-direction-launch[data-active="true"] { background: #215e60; }
  .md-quick-bottom { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0; }
  .md-quick-bottom label { font-size: 0; gap: 0; }
  .md-quick-bottom input { width: 100%; max-width: none; min-height: 44px; }
  .md-quick-bottom output { font-size: 12px; min-width: 32px; }
  .music-room-page .main { padding-bottom: 240px; }
}
@media (prefers-reduced-motion: reduce) {
  .music-room-page *, .remix-studio-page * {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition: none !important; scroll-behavior: auto !important;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .music-direction-quick, .music-direction-dialog, .music-room-page .player { backdrop-filter: none; }
}