.wave-wrap{position:relative}.wave-wrap #wave{cursor:default}.loop-wave-overlay{position:absolute;z-index:3;display:block;touch-action:none;background:transparent;outline:none}.loop-wave-overlay:focus-visible{box-shadow:inset 0 0 0 1px var(--accent)}.trim-controls.auto-sample-zero{justify-content:flex-end}.trim-controls.auto-sample-zero>div:first-child{display:none}.transport-status #length-info{color:#b8c6ad}.transport-status #length-info.perfect{color:var(--accent);font-weight:650}@media(max-width:720px){.transport-status #length-info{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/*
 * Desktop visual hierarchy pass.
 * No layout redesign: the existing DAW structure stays intact. This layer only
 * separates visual loudness between primary actions, interactions, information
 * and passive containers.
 */
.app-body{
 --ui-container-bg:#171918;
 --ui-container-border:#282d29;
 --ui-control-bg:#1c1f1d;
 --ui-control-hover:#222622;
 --ui-control-border:#353b36;
 --ui-control-text:#b7beb5;
 --ui-label:#747b74;
 --ui-info:#8e968d;
 --ui-active:#aac77d;
 --ui-active-bg:#20251f;
 --ui-active-border:#4c5a41;
 --control-focus:#6e825a;
 --scroll-thumb:#4d574f;
 --scroll-thumb-hover:#69766b;
}

/* Passive grouping: visible enough to structure the screen, never louder than a control. */
.app-body .analysis-cards>div,
.app-body .mix-controls,
.app-body .wave-tools{
 background:var(--ui-container-bg);
 border-color:var(--ui-container-border);
 box-shadow:none;
}
.app-body .wave-wrap{border-color:#272c28}
.app-body .export-panel{border-top-color:var(--ui-container-border)}
.app-body .app-dropzone{background:#171917;border-color:#343a35}
.app-body .app-dropzone.dragging{background:#1c211b;border-color:#60744f}

/* Labels and secondary information intentionally sit below interactive controls. */
.app-body label,
.app-body .panel-kicker,
.app-body .daw-export-label,
.app-body .headroom-label{color:var(--ui-label)}
.app-body .analysis-cards small,
.app-body .analysis-note,
.app-body .hint,
.app-body .daw-export-profile small,
.app-body #headroom-status,
.app-body .app-dropzone small,
.app-body .track small{color:var(--ui-info)}
.app-body .transport-status{color:#7d857d}
.app-body .transport-status #loop-info{color:#89938a}
.app-body .transport-status #length-info{color:#98a298}
.app-body .transport-status #length-info.perfect{color:#a9b991;font-weight:600}
.app-body #trim-info{color:#93a28f}

/* Ordinary interaction: neutral surfaces. Lime is reserved for state and primary action. */
.app-body .secondary,
.app-body .icon-button,
.app-body .account-link,
.app-body .transport-toggle,
.app-body .loop-size,
.app-body .headroom-segment,
.app-body .wave-reset,
.app-body .sample-row button{
 background:var(--ui-control-bg);
 border-color:var(--ui-control-border);
 color:var(--ui-control-text);
 box-shadow:none;
}
.app-body .secondary:hover:not(:disabled),
.app-body .icon-button:hover:not(:disabled),
.app-body .account-link:hover:not(:disabled),
.app-body .transport-toggle:hover:not(:disabled),
.app-body .wave-reset:hover:not(:disabled),
.app-body .sample-row button:hover:not(:disabled){
 background:var(--ui-control-hover);
 border-color:#444b45;
 color:#d4dad1;
 filter:none;
}
.app-body .add-track{background:var(--ui-control-bg);border-color:#374039;color:#c0c7bd}
.app-body .add-track:hover:not(:disabled){background:var(--ui-control-hover);border-color:#465048;filter:none}
.app-body .add-track .material-symbols-rounded{color:#a9c477}
.app-body .bpm-row button{background:var(--ui-control-bg);border-color:var(--ui-control-border);color:#aab1a8}
.app-body .bpm-row button:hover:not(:disabled){background:var(--ui-control-hover);border-color:#444b45;color:#d0d6cd;filter:none}

/* Active state: distinct, but deliberately softer than the primary export action. */
.app-body .transport-toggle.active,
.app-body .transport-toggle[aria-pressed="true"],
.app-body .loop-size button.active,
.app-body .loop-size button[aria-pressed="true"],
.app-body .headroom-segment button.active,
.app-body .headroom-segment button[aria-pressed="true"]{
 background:var(--ui-active-bg);
 color:var(--ui-active);
 border-color:var(--ui-active-border);
 box-shadow:inset 0 0 0 1px #3d4937;
}
.app-body .headroom-segment button{color:#959d94}
.app-body .headroom-segment button:hover:not(:disabled){background:#202320;color:#c8cec6;filter:none}

/* Playback is a prominent interaction, not a primary app action. */
.app-body .play-button{background:#1b1f1c;border-color:#414a40;color:#b3d37c}
.app-body .play-button:hover:not(:disabled){background:#20251f;border-color:#516049;filter:none}
.app-body .text-button{color:#a5ada3}
.app-body .text-button:hover:not(:disabled){color:#d2d7cf;filter:none}

/* Values are information: no badge-like boxes unless they are actually interactive. */
.app-body .mix-controls output,
.app-body .wave-header output{
 background:transparent;
 border:0;
 color:#aab3a8;
 box-shadow:none;
 font-weight:600;
}

/* Inputs stay readable and editable without competing with calls to action. */
.app-body .trim-controls input,
.app-body .trim-controls select,
.app-body .daw-export-profile select,
.app-body .daw-select-trigger{
 background:#1b1e1c;
 border-color:var(--ui-control-border);
 color:#d0d5ce;
}
.app-body .daw-select-trigger:hover:not(:disabled),
.app-body .trim-controls input:hover,
.app-body .trim-controls select:hover,
.app-body .daw-export-profile select:hover{
 background:#202320;
 border-color:#444b45;
}
.app-body .daw-select-chevron{color:#87957f}
.app-body .daw-select-option.selected{background:#20251f;color:#b2cb8c}
.app-body .daw-select-option.selected::after{color:#a8c57b}

/* Sliders are clearly interactive, but no longer glow lime while idle. */
.app-body .mix-controls input[type="range"]::-webkit-slider-runnable-track,
.app-body .wave-header input[type="range"]::-webkit-slider-runnable-track{background:#292e2a;border-color:#3b423c;box-shadow:inset 0 1px 1px #0007}
.app-body .mix-controls input[type="range"]::-webkit-slider-thumb,
.app-body .wave-header input[type="range"]::-webkit-slider-thumb{background:#191c1a;border-color:#778173;box-shadow:0 0 0 2px #171a18}
.app-body .mix-controls input[type="range"]:hover::-webkit-slider-thumb,
.app-body .wave-header input[type="range"]:hover::-webkit-slider-thumb{background:#9dbb70;border-color:#9dbb70}
.app-body .mix-controls input[type="range"]::-moz-range-track,
.app-body .wave-header input[type="range"]::-moz-range-track{background:#292e2a;border-color:#3b423c;box-shadow:inset 0 1px 1px #0007}
.app-body .mix-controls input[type="range"]::-moz-range-progress,
.app-body .wave-header input[type="range"]::-moz-range-progress{background:#6f805e}
.app-body .mix-controls input[type="range"]::-moz-range-thumb,
.app-body .wave-header input[type="range"]::-moz-range-thumb{background:#191c1a;border-color:#778173;box-shadow:0 0 0 2px #171a18}
.app-body .mix-controls input[type="range"]:hover::-moz-range-thumb,
.app-body .wave-header input[type="range"]:hover::-moz-range-thumb{background:#9dbb70;border-color:#9dbb70}

/* Selected track remains identifiable without looking like another green action. */
.app-body .track.selected{background:#1f221f;border-color:#394139}
.app-body .track.selected .track-icon{background:#282e28;color:#a8bf82}

/* Keep the one intentionally loud semantic: primary actions. */
.app-body .primary{background:var(--accent);color:#182010}