.lab { max-width: 1100px; margin: 32px auto; padding: 24px; color: var(--text); }
.lab h1 { font-family: var(--mono); }
.layout { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 20px; }
.preview { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; height: 540px; }
.preview canvas { width: 100%; height: 100%; display: block; }
.lab button, .lab select, .lab textarea { font: inherit; color: inherit; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px; margin: 6px 0; }
.lab button { cursor: pointer; }
.lab button:disabled { opacity: .45; cursor: default; }
.lab select, .lab textarea { display: block; width: 100%; }
.lab fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.lab fieldset label { display: block; padding: 9px 0; }
.lab input { accent-color: var(--phosphor); }
.hint { font-size: .85rem; opacity: .75; margin: 10px 0 18px; }
#status { color: var(--phosphor); }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
#transcript { line-height: 1.6; }
@media(max-width:720px) { .layout { grid-template-columns: 1fr; } .preview { height: 360px; } .lab { margin: 0; padding: 18px; } }
#waveform { width: 100%; height: 90px; display: block; background: var(--panel); border-radius: 8px; }
#seek { width: 100%; }
#diagnostic, #audit { font: 12px/1.6 var(--mono); overflow-wrap: anywhere; }
.lab details { margin: 16px 0; }
.lab input[type=file] { max-width: 100%; font-size: 12px; }
@media(min-width:721px) { .preview { position: sticky; top: 24px; } }