/* Trim is a source-frame range. Optional black frames remain outside it. */
.timeline-controls{flex-wrap:wrap;gap:12px!important}
.timeline-trim{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-left:auto;min-width:0}
.timeline-trim button,.timeline-trim input{height:32px;border:1px solid #45515d;background:#10161c;color:#f4f5f6;font:inherit;font-size:11px;border-radius:3px}
.timeline-trim button{padding:0 10px;font-weight:700;cursor:pointer}
.timeline-trim button:hover,.timeline-trim button:focus-visible{border-color:#ff302b;outline:2px solid #ff302b44}
.timeline-trim input{width:76px;padding:0 7px;font-variant-numeric:tabular-nums}
.timeline-trim #trimDuration{color:#aab4be;font-size:10px;white-space:nowrap}
.timeline-controls>.timeline-rule{flex-basis:100%;margin:0!important;text-align:right}
.timeline-clip{position:relative}
.trim-selection{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,rgba(0,0,0,.72) 0 var(--trim-left),transparent var(--trim-left) calc(100% - var(--trim-right)),rgba(0,0,0,.72) calc(100% - var(--trim-right)) 100%);z-index:3}
.trim-selection:after{content:"";position:absolute;inset:0 var(--trim-right) 0 var(--trim-left);border:2px solid #ff302b;min-width:0}
@media(max-width:700px){.timeline-trim{margin-left:0;width:100%}.timeline-controls>.timeline-rule{text-align:left}.timeline-trim #trimDuration{flex-basis:100%}}
