/* A timeline-first workspace. The editor owns its transport and output controls. */
.mode-tab[data-mode=editor] { min-height: 44px; }
#app.mode-editor { --header-h: 48px; grid-template: var(--header-h) auto minmax(0, 1fr) / minmax(0, 1fr); }
#app.mode-editor > .header { grid-row: 1; }
#app.mode-editor > .mode-nav { grid-row: 2; min-height: 48px; flex-wrap: wrap; }
#app.mode-editor > :is(.analysis-bar, .transport, .chain-panel),
#app.mode-editor .header > :is(.upload-zone, .header-actions, .session-privacy) { display: none; }
#app.mode-editor > .daw-panel { grid-column: 1 / -1; grid-row: 3; }
.daw-panel { display: block; padding: 8px 16px 92px; overflow: auto; min-width: 0; user-select: text; scroll-padding-block: 16px 90px; }
.daw-panel[hidden], .daw-panel [hidden] { display: none !important; }
.daw-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.daw-panel button, .daw-panel input:not([type=checkbox],[type=range]), .daw-panel select { min-height: 44px; min-width: 0; border: 1px solid var(--c-border); border-radius: 5px; padding: 8px 10px; font: inherit; background: var(--c-bg-surface); color: var(--c-text-1); }
.daw-panel button { min-width: 44px; cursor: pointer; font-size: 13px; transition: background-color 120ms, border-color 120ms; }
.daw-panel button:hover:not(:disabled) { border-color: var(--c-primary); background: var(--c-primary-dim); }
.daw-panel :is(button, input, select):disabled { opacity: .45; cursor: not-allowed; }
.daw-panel button[aria-pressed=true] { border-color: var(--c-primary); background: var(--c-primary-muted); }
.daw-panel .daw-primary { color: var(--c-text-inv); background: var(--c-primary); border-color: var(--c-primary); font-weight: 600; }
.daw-panel .daw-primary:hover:not(:disabled) { background: var(--c-primary-h); }
.daw-panel .daw-quiet { background: transparent; border-color: transparent; color: var(--c-text-2); }
.daw-panel label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; line-height: 1.5; }
.daw-panel .daw-check { flex-direction: row; align-items: center; min-height: 44px; gap: 6px; }
.daw-panel input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--c-primary); }
.daw-panel input[type=range] { accent-color: var(--c-primary); min-height: 44px; }
.daw-panel h2 { font-size: 14px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
.daw-note, .daw-help p { font-size: 13px; line-height: 1.65; color: var(--c-text-2); margin: 8px 0; overflow-wrap: anywhere; }
.daw-actions { display: flex; align-items: end; flex-wrap: wrap; gap: 6px; }
.daw-project-bar { display: flex; align-items: center; gap: 10px; padding-bottom: 6px; }
.daw-project-name { flex: 1 1 180px; max-width: 260px; min-width: 0; }
.daw-project-name input { width: 100%; font-weight: 600 !important; }
.daw-file-actions { margin-left: auto; }
.daw-save-notice { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 2px 16px; padding: 0 0 6px; font-size: 12px; line-height: 1.65; color: var(--c-text-2); }
.daw-save-notice p { margin: 0; }
#daw-save-state { color: var(--c-primary); margin-right: 10px; }
.daw-editor-grid { display: grid; grid-template-columns: minmax(0, 1fr) 288px; gap: 0; align-items: start; border-top: 1px solid var(--c-border); }
.daw-arrangement { min-width: 0; padding-right: 16px; }
.daw-section-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 50px; position: relative; }
#daw-summary { color: var(--c-text-2); font: 12px var(--font-mono); margin-right: auto; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.daw-section-title > button { background: transparent; border-color: transparent; padding-inline: 8px; }
.daw-section-title > button, .daw-grid-settings { flex-shrink: 0; }
.daw-clip-group-controls { display: grid; gap: 10px; min-width: 0; }
.daw-group-summary { margin: 0; color: var(--c-text-2); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.daw-group-fields { display: flex; gap: 6px; align-items: end; }
.daw-group-fields label { flex: 1; min-width: 0; }
.daw-group-fields input { width: 100%; }
.daw-group-nudges { display: flex; gap: 6px; align-items: center; }
.daw-group-grid-summary { font-size: 12px; color: var(--c-text-2); }
.daw-panel .daw-group-overlap { flex-direction: row; align-items: center; gap: 8px; min-height: 44px; }
.daw-group-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.daw-clip-group-controls > .daw-help { margin: 0; font-size: 12px; line-height: 1.6; color: var(--c-text-2); }
.daw-panel summary { padding: 12px 0; min-height: 44px; cursor: pointer; font-size: 13px; font-weight: 500; }
.daw-grid-settings > summary { padding: 12px 8px; border-radius: 5px; }
.daw-grid-settings[open] > summary { color: var(--c-primary); background: var(--c-bg-surface); }
.daw-grid-settings:not([open]) > .daw-grid-fields { display: none; }
.daw-grid-fields { position: absolute; right: 0; top: 100%; width: min(100%, 410px); display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: end; padding: 12px; background: var(--c-bg-elevated); border: 1px solid var(--c-border-focus); box-shadow: 0 8px 20px #0004; z-index: 5; }
.daw-grid-fields .daw-note { width: 100%; margin: 0; }
.daw-inline input { width: 94px; }
.daw-grid-fields select { max-width: 126px; }
.daw-timeline { --daw-label-width: 172px; --daw-lane-width: 1440px; overflow: auto; height: clamp(300px, calc(100dvh - 324px), 680px); border: 1px solid var(--c-border); border-radius: 4px; background: var(--c-bg-input); position: relative; }
.daw-timeline[data-drop=true] { outline: 2px dashed var(--c-primary); outline-offset: -2px; }
.daw-ruler { width: calc(var(--daw-label-width) + var(--daw-lane-width)); display: flex; min-height: 32px; position: sticky; top: 0; z-index: 4; background: var(--c-bg-surface); border-bottom: 1px solid var(--c-border); }
.daw-ruler-label { position: sticky; left: 0; width: var(--daw-label-width); flex-shrink: 0; padding: 8px 10px; background: var(--c-bg-surface); z-index: 2; font-size: 12px; }
.daw-ruler-lane { position: relative; width: var(--daw-lane-width); cursor: crosshair; }
.daw-tick { position: absolute; padding: 8px 4px; height: 100%; border-left: 1px solid var(--c-border); font: 11px var(--font-mono); color: var(--c-text-2); pointer-events: none; }
.daw-track { display: flex; width: calc(var(--daw-label-width) + var(--daw-lane-width)); border-bottom: 1px solid var(--c-border); min-height: 142px; }
.daw-track-controls { width: var(--daw-label-width); flex-shrink: 0; padding: 8px; position: sticky; left: 0; z-index: 3; background: var(--c-bg-surface); border-right: 1px solid var(--c-border); }
.daw-track-controls .daw-track-name { font-size: 12px; font-weight: 600; margin-bottom: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.daw-track-controls .daw-actions { gap: 4px; flex-wrap: nowrap; }
.daw-track-controls button { padding: 6px 7px; }
.daw-track-mix { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin-top: 4px; }
.daw-track-mix label { font-size: 12px; }
.daw-track-mix input { width: 100%; min-width: 0; padding: 5px !important; }
.daw-lane { position: relative; width: var(--daw-lane-width); flex-shrink: 0; background-image: linear-gradient(to right, var(--c-border) 1px, transparent 1px); background-size: var(--daw-beat-width, 24px) 100%; background-position-x: var(--daw-grid-origin, 0px); cursor: crosshair; }
.daw-ruler:has(.daw-grid-origin-marker) { min-height: 44px; }
.daw-grid-origin-marker { position: absolute; top: 0; height: 100%; padding: 26px 3px 0; border-left: 1px dashed var(--c-primary); color: var(--c-primary); font-size: 10px; line-height: 12px; pointer-events: none; }
#daw-tempo-tools { flex-basis: 100%; min-width: 0; }
.daw-grid-fields { max-height: max(132px, calc(100dvh - 300px)); overflow-y: auto; overscroll-behavior: contain; }
.daw-tempo-controls { border-top: 1px solid var(--c-border); }
.daw-tempo-body { display: grid; gap: 8px; min-width: 0; }
.daw-tempo-help { margin: 0; font-size: 12px; line-height: 1.6; color: var(--c-text-2); }
.daw-tempo-tap-row, .daw-tempo-candidate-row, .daw-tempo-origin-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.daw-tempo-status { flex: 1 1 90px; min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
.daw-tempo-status[data-error=true] { color: var(--c-danger); }
.daw-tempo-candidate { flex: 1; font: 14px var(--font-mono); white-space: nowrap; }
.daw-tempo-origin-row { align-items: end; }
.daw-tempo-origin-row label { flex: 1 1 120px; }
.daw-tempo-origin-row input { width: 100%; min-width: 0; }
.daw-tempo-origin-details > summary { padding-block: 10px; }
.daw-tempo-controls button { min-width: 44px; }
/* The open tool already shows this same audio-invariance notice near its Tap
   control; keep one visible copy, and restore the compact footer when closed. */
.daw-grid-fields:has(.daw-tempo-controls[open]) > .daw-note { display: none; }
@media (max-width: 600px) { .daw-grid-fields { max-height: max(132px, calc(100dvh - 420px)); } }
.daw-panel .daw-clip { position: absolute; height: 92px; min-width: 12px; top: 20px; padding: 5px; overflow: hidden; text-align: left; border-color: #718594; background: #263641; touch-action: pan-y; cursor: grab; }
.daw-panel .daw-clip:nth-child(2n) { background: #253d39; }
.daw-panel .daw-clip[aria-pressed=true] { border: 2px solid var(--c-primary); background: #28423c; box-shadow: 0 0 0 1px var(--c-primary); z-index: 2; }
.daw-clip-name { display: block; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.daw-wave { width: 100%; height: 55px; display: block; color: #b1cfcc; pointer-events: none; }
.daw-wave path { fill: currentColor; }
.daw-playhead { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--c-primary); z-index: 2; pointer-events: none; }
.daw-empty { padding: 72px 20px; font-size: 16px; line-height: 1.7; color: var(--c-text-1); position: sticky; left: 0; text-align: center; }
.daw-empty span { display: block; margin-top: 6px; font-size: 13px; color: var(--c-text-2); }
.daw-status-row { display: flex; align-items: center; gap: 8px; min-height: 30px; }
#daw-status { font-size: 12px; line-height: 1.5; padding-block: 6px; color: var(--c-text-2); white-space: pre-wrap; overflow-wrap: anywhere; }
#daw-status[data-error=true] { color: var(--c-danger); }
.daw-inspector { border-left: 1px solid var(--c-border); padding: 14px 0 12px 16px; min-width: 0; max-height: calc(100dvh - 254px); overflow-y: auto; scrollbar-gutter: stable; scroll-padding-block: 12px; }
.daw-inspector-heading > span { font-size: 12px; color: var(--c-text-2); }
.daw-inspector-heading h2 { margin-top: 4px; }
.daw-inspector-heading .daw-note { font: 12px var(--font-mono); line-height: 1.6; margin-block: 4px 12px; }
.daw-inspector fieldset { border: 0; padding: 0; min-width: 0; }
.daw-inspector input, .daw-inspector select { min-width: 0; width: 100%; }
.daw-inspector button { margin-top: 6px; }
.daw-inspector .daw-actions button { flex: 1; }
.daw-inspector-group { margin-top: 12px; }
.daw-inspector-group h3 { font-size: 13px; font-weight: 500; line-height: 1.5; margin-bottom: 6px; color: var(--c-text-2); }
.daw-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.daw-full-width { width: 100%; }
.daw-inspector details { border-top: 1px solid var(--c-border); margin-top: 12px; }
.daw-inspector details label { margin-top: 8px; }
.daw-inspector details + details { margin-top: 0; }
.daw-delivery { display: flex; align-items: start; justify-content: space-between; gap: 8px 20px; border-top: 1px solid var(--c-border); padding-block: 8px; }
.daw-delivery-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.daw-delivery-bar h2 { margin-right: 6px; }
#daw-output-settings { flex: 0 1 480px; }
#daw-output-settings > summary { text-align: right; }
#daw-output-settings .daw-actions { justify-content: flex-end; }
#daw-output-settings .daw-note { text-align: right; }
.daw-help { border-top: 1px solid var(--c-border); }
.daw-help h3 { font-size: 14px; font-weight: 600; margin-top: 16px; }
.daw-help p { max-width: 88ch; }
.daw-transport { position: fixed; left: 0; right: 0; bottom: 0; z-index: 6; display: flex; align-items: center; gap: 12px; padding: 8px 16px; margin: 0; border-top: 1px solid var(--c-border-focus); background: #17221ffa; }
.daw-play-actions { display: flex; flex: 0 0 auto; gap: 6px; }
.daw-seek-label { flex: 1 1 160px; min-width: 70px; }
#daw-time { font: 12px var(--font-mono); white-space: nowrap; }
.daw-panel :is(button, input, select, summary, [tabindex]):focus-visible { outline: 2px solid var(--c-primary); outline-offset: 3px; }
@media (max-width: 1000px) {
  .daw-editor-grid { grid-template-columns: minmax(0, 1fr) 260px; }
  .daw-project-name { max-width: none; }
  .daw-project-bar { gap: 6px; }
  .daw-panel button { padding-inline: 8px; }
  .daw-save-notice { display: block; }
}
@media (max-width: 760px) {
  .daw-editor-grid { grid-template-columns: minmax(0, 1fr); }
  .daw-arrangement { padding-right: 0; }
  .daw-inspector { border-left: 0; border-top: 1px solid var(--c-border); padding: 12px 0; max-height: none; overflow: visible; }
  .daw-inspector fieldset { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: end; }
  .daw-inspector fieldset > details { grid-column: 1 / -1; }
  .daw-inspector-group { margin: 0; }
  .daw-inspector-heading .daw-note { margin-bottom: 8px; }
  .daw-timeline { height: 340px; }
  .daw-project-bar { flex-wrap: wrap; }
  .daw-project-name { flex: 1; }
  .daw-file-actions { flex-basis: 100%; justify-content: space-between; }
  .daw-delivery { flex-wrap: wrap; }
  #daw-output-settings { flex: 1 1 100%; }
  #daw-output-settings > summary, #daw-output-settings .daw-note { text-align: left; }
  #daw-output-settings .daw-actions { justify-content: flex-start; }
}
@media (max-width: 600px) {
  #app.mode-editor { --header-h: 44px; height: auto; min-height: 100dvh; overflow: visible; }
  #app.mode-editor > .header { padding-block: 0; }
  #app.mode-editor > .mode-nav { padding: 0 8px; gap: 0 3px; min-height: 44px; }
  #app.mode-editor .mode-tab { padding-inline: 10px; height: 44px; }
  .daw-panel { padding: 8px 12px 140px; overflow: visible; scroll-padding-bottom: 140px; }
  .daw-project-bar { gap: 0 6px; padding-bottom: 0; }
  .daw-save-notice { font-size: 12px; line-height: 1.6; padding-bottom: 2px; }
  #daw-save-state { margin-right: 6px; }
  .daw-section-title { min-height: 48px; gap: 6px; }
  .daw-section-title h2 { display: none; }
  #daw-summary { font-size: 11px; }
  .daw-grid-settings > summary { padding-inline: 4px; }
  .daw-timeline { --daw-label-width: 156px; height: 340px; }
  .daw-track-controls button { padding-inline: 5px; }
  .daw-panel .daw-inspector fieldset { display: block; }
  .daw-inspector-group { margin-top: 12px; }
  .daw-transport { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 6px 12px max(6px, env(safe-area-inset-bottom)); }
  .daw-transport .daw-check { justify-self: end; }
  .daw-seek-label { min-width: 0; }
  #daw-time { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { .daw-panel *, .daw-panel *::before, .daw-panel *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media (forced-colors: active) { .daw-panel .daw-clip[aria-pressed=true] { outline: 3px solid Highlight; } .daw-wave { color: CanvasText; } }
/* The graph is the actual linear gain curve; numeric fields provide keyboard editing. */
.daw-automation-graph { width: 100%; height: auto; display: block; background: var(--c-bg-input); border: 1px solid var(--c-border); border-radius: 4px; touch-action: none; }
.daw-automation-grid { stroke: var(--c-border); stroke-width: 1; }
.daw-automation-unity { stroke: var(--c-text-2); stroke-width: 1; stroke-dasharray: 4 4; }
.daw-automation-line { fill: none; stroke: var(--c-primary); stroke-width: 2; }
.daw-automation-dot { fill: var(--c-bg-surface); stroke: var(--c-primary); stroke-width: 3; cursor: grab; }
.daw-automation-dot[data-selected=true] { fill: var(--c-primary); }
.daw-automation-graph text { fill: var(--c-text-2); font-size: 10px; pointer-events: none; }
#daw-clip-fields:disabled .daw-automation-graph { opacity: .45; }
@media (forced-colors: active) { .daw-automation-line, .daw-automation-dot { stroke: Highlight; } .daw-automation-dot[data-selected=true] { fill: Highlight; } }

.daw-replacement-review { margin-top: 12px; padding: 10px; min-width: 0; border: 1px solid var(--c-border-focus); border-radius: 5px; background: var(--c-bg-input); }
.daw-replacement-review > .daw-note:first-child { margin-top: 0; }
.daw-replacement-review .daw-wave { height: 70px; }
.daw-replacement-review .daw-actions button { flex: 1 1 100px; }

/* Region stripes remain visible after a project is reopened. */
.daw-region-cue { position: absolute; top: 27px; bottom: 5px; border-inline: 1px solid #e5b76c; border-bottom: 4px solid #e5b76c; background: #e5b76c25; pointer-events: none; }
.daw-region-preview-wave { position: relative; min-height: 70px; background: #e5b76c12; border-block: 1px solid #e5b76c; overflow: hidden; }
.daw-region-preview-piece { position: absolute; top: 0; height: 70px; overflow: hidden; background: #e5b76c20; }
#daw-region-warning { color: var(--c-text-1); }
#daw-region-details > .daw-actions button { flex-basis: 110px; }
@media (forced-colors: active) { .daw-region-cue { border-color: Highlight; } .daw-region-preview-wave { border-color: Highlight; } }