/* Controls are sized by the timeline's available width, not screen width. */
#timelinePanel{container:timeline-controls / inline-size}
#timelinePanel .preview-transport{display:grid;grid-template-columns:max-content 104px minmax(70px,1fr) 104px!important;gap:12px!important;height:auto!important;min-height:58px;padding:8px 10px!important;align-items:center;flex-shrink:0}
#timelinePanel .preview-primary-controls{display:flex;gap:5px;flex-wrap:nowrap;min-width:0}
#timelinePanel .preview-primary-controls .transport-command{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:50px!important;min-width:50px!important;height:44px!important;padding:5px 2px!important;box-sizing:border-box}
#timelinePanel .transport-command span{font-size:9px!important;line-height:12px!important;letter-spacing:0!important;white-space:nowrap}
#timelinePanel .transport-command svg{width:18px;height:18px;flex:none}
#timelinePanel .preview-timecode,#timelinePanel .preview-duration{display:block!important;position:static!important;width:auto!important;min-width:0;font:12px/1.4 monospace;white-space:nowrap;letter-spacing:0;text-align:center}
#timelinePanel #previewScrub{position:static!important;width:100%;min-width:0;margin:0!important}
#timelinePanel .timeline-workflow-tools{gap:10px 16px;padding:10px!important;box-sizing:border-box;align-items:center}
#timelinePanel .timeline-workflow-tools>label{flex:none;gap:8px!important;min-width:0;white-space:nowrap;line-height:1.4}
#timelinePanel .timeline-workflow-tools select{min-width:155px;max-width:100%;font-size:11px;height:34px}
#timelinePanel #timelineResultSummary{white-space:normal;overflow-wrap:anywhere;line-height:1.5;margin-left:auto;text-align:right}
#timelinePanel .timeline-trim{display:grid!important;grid-template-columns:minmax(240px,1fr) minmax(150px,.8fr) minmax(240px,1fr);gap:12px!important;padding:10px!important;box-sizing:border-box;align-items:center!important}
#timelinePanel .trim-edge{min-width:0;gap:6px;align-items:center;align-content:start}
#timelinePanel .trim-black-option{min-height:28px;grid-column:1/-1;margin-bottom:4px}
#timelinePanel .trim-black-option label{gap:8px!important;line-height:1.4;white-space:nowrap}
#timelinePanel .trim-center{min-width:0;align-self:center;text-align:center}
#timelinePanel #trimDuration{white-space:normal;line-height:1.4;margin:0 0 6px;font-size:16px}
#timelinePanel #resetTrim{white-space:normal;font-size:10px;line-height:1.4;max-width:100%;min-height:30px}
#timelinePanel .trim-edge input.trim-timecode{font:12px/1.4 monospace!important;letter-spacing:0!important;min-width:0}
.four-blocks .toolbox-card>.process-head{height:auto!important;min-height:40px!important;max-height:none!important;gap:8px 16px;flex-wrap:wrap;align-items:center}
.four-blocks>.toolbox-card{grid-template-rows:auto minmax(0,1fr)}
.saved-settings-launch{flex:none;border:1px solid #465766;border-radius:3px;background:#111a22;color:#d9e2e9;padding:6px 10px;font:inherit;font-size:11px;line-height:1.4;cursor:pointer}
#sequenceSettingsDialog{box-sizing:border-box;width:min(540px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:20px;border:1px solid #526372;border-radius:8px;background:#101922;color:#e9eef3;font:14px/1.55 sans-serif}
#sequenceSettingsDialog::backdrop{background:rgba(0,0,0,.7)}
#sequenceSettingsDialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
#sequenceSettingsDialog h2{margin:0;font-size:20px;line-height:1.3}
#sequenceSettingsDialog button{font:inherit;white-space:normal;min-height:36px;padding:7px 12px;border:1px solid #526372;background:#15212c;color:#fff;border-radius:3px;cursor:pointer}
#sequenceSettingsDialog .project-actions{padding:0;border:0;gap:10px;background:none}
#sequenceSettingsDialog .project-actions span{flex-basis:100%;font-size:12px}
@container timeline-controls (max-width:780px){
 #timelinePanel .preview-transport{grid-template-columns:104px minmax(80px,1fr) 104px!important;gap:8px!important}
 #timelinePanel .preview-primary-controls{grid-column:1/-1;justify-content:center}
 #timelinePanel .timeline-trim{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 #timelinePanel .trim-center{grid-column:1/-1;grid-row:1}
 #timelinePanel .trim-edge-in{grid-column:1;grid-row:2}
 #timelinePanel .trim-edge-out{grid-column:2;grid-row:2}
 #timelinePanel #timelineResultSummary{flex-basis:100%;margin:0;text-align:left}
}
@container timeline-controls (max-width:500px){
 #timelinePanel .trim-edge{display:flex;flex-wrap:wrap}
 #timelinePanel .trim-edge-out{justify-content:flex-end}
 #timelinePanel .trim-black-option{flex-basis:100%}
 #timelinePanel .trim-edge input.trim-timecode{flex-basis:100%!important;width:100%!important;order:4}
 #timelinePanel .trim-center{grid-column:1/-1;grid-row:1}
 #timelinePanel .timeline-workflow-tools>label:first-of-type{flex-basis:100%;justify-content:space-between}
 #timelinePanel .timeline-workflow-tools>label:first-of-type select{flex:1}
 #timelinePanel .preview-primary-controls{gap:4px}
 #timelinePanel .preview-primary-controls .transport-command{width:48px!important;min-width:48px!important}
}
#timelinePanel .timeline-trim{grid-template-columns:minmax(240px,1fr) minmax(150px,.8fr) minmax(240px,1fr)!important}
#timelinePanel #trimDuration{font-size:16px!important;line-height:1.4!important}
#timelinePanel #resetTrim{height:auto!important;min-height:30px!important;font-size:10px!important}
#timelinePanel .preview-timecode,#timelinePanel .preview-duration{font-size:12px!important;line-height:1.4!important}
@container timeline-controls (max-width:780px){#timelinePanel .timeline-trim{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}}
/* v4.17.3: the footer must reserve its complete height, including wrapped tools. */
#timelinePanel #timelineControls{display:block!important;height:auto!important;min-height:0!important;padding:0!important;overflow:visible;flex:0 0 auto;box-sizing:border-box}
#timelinePanel #timelineControls .timeline-workflow-tools{margin:0;width:100%;height:auto;min-height:54px;flex-basis:auto}
#timelinePanel .timeline-trim .trim-edge{row-gap:8px;column-gap:6px}
#timelinePanel .trim-black-option{margin-bottom:0;min-height:28px}
#timelinePanel .timeline-trim .trim-edge input,#timelinePanel .timeline-trim .trim-edge button{height:32px!important;box-sizing:border-box;font-size:12px!important}
#timelinePanel .timeline-trim .trim-edge input:not(.trim-timecode){width:56px!important;flex-basis:56px!important}
#timelinePanel .timeline-trim .trim-edge input.trim-timecode{width:104px!important;flex-basis:104px!important}
#timelinePanel .trim-center{display:grid;grid-template-rows:28px 32px;gap:8px;justify-items:center;align-items:center}
#timelinePanel #trimDuration{margin:0;align-self:center}
#timelinePanel #resetTrim{height:32px!important;min-height:32px!important;margin:0;align-self:center}
.four-blocks #runPanel .export-name-field,.four-blocks #runPanel .export-destination-choice{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:6px 8px;width:100%;box-sizing:border-box;padding:0!important;border:0!important;margin:0 0 8px!important}
.four-blocks #runPanel .export-name-field #exportName,.four-blocks #runPanel #exportModeSelect{grid-column:2;width:100%;max-width:none;min-width:0;height:34px!important;min-height:34px!important;box-sizing:border-box;margin:0!important;font-size:12px;padding:0 8px}
.four-blocks #runPanel .export-destination-choice>label{grid-column:1;line-height:1.4;margin:0!important;align-self:center}
@container timeline-controls (max-width:500px){#timelinePanel .timeline-trim .trim-edge input.trim-timecode{width:100%!important;flex-basis:100%!important}}
/* Shared column gutters and heading baselines in treatment/export. */
.four-blocks .toolbox-card>.settings-workbench,.four-blocks .toolbox-card>.result-summary-panel,.four-blocks .toolbox-card>.export-block{padding:10px!important;box-sizing:border-box}
.four-blocks .settings-workbench .workbench-head{top:0;min-height:32px;padding:0!important;margin:0 0 8px;align-items:center}
.four-blocks .result-summary-panel>strong{display:flex;align-items:center;min-height:32px;margin:0 0 8px;padding:0;box-sizing:border-box}
.four-blocks #runPanel .compact-export-heading{min-height:32px;margin:0 0 8px;align-items:center}
.four-blocks #workbenchTitle,.four-blocks .result-summary-panel>strong,.four-blocks #runTitle{font-size:13px!important;line-height:1.4!important;letter-spacing:0}
.four-blocks .settings-workbench .workbench-head{justify-content:flex-start!important;text-align:left}
.four-blocks #workbenchTitle{display:flex;align-items:center;width:100%;min-height:32px;margin:0;text-align:left}
