/* Frame the existing videos; never add a replacement video overlay. */
#transport.direct-video-assigned{overflow:hidden!important}
#mainStageVideo,#mainPanelVideo,#adlibPanelVideo,#controlsVideo{
  object-position:var(--frame-x,50%) var(--frame-y,50%)!important;
  transform-origin:var(--frame-x,50%) var(--frame-y,50%)!important;
  transform:scale(var(--frame-zoom,1))!important;
}
#videoFramePanel{position:fixed;z-index:25;top:170px;left:20px;width:min(330px,calc(100vw - 28px));max-height:calc(100vh - 32px);overflow:auto;padding:14px;border:1px solid rgba(170,246,255,.5);border-radius:18px;background:rgba(4,10,16,.96);box-shadow:0 12px 40px #0008;color:#fff}
#videoFramePanel[hidden]{display:none}
#videoFrameHead{display:flex;justify-content:space-between;align-items:center;gap:8px;cursor:move;touch-action:none}
#videoFrameHead strong{font:900 11px ui-monospace,monospace;letter-spacing:.08em;color:var(--gold)}
#videoFramePanel button{min-height:34px;padding:7px 10px;font-size:11px;touch-action:manipulation}
#videoFramePanel select{width:100%;margin:12px 0;padding:8px;background:#17212b;color:white;border:1px solid #526675;border-radius:9px}
.frame-row{display:grid;grid-template-columns:1fr 82px;gap:6px;align-items:center;margin:10px 0}
.frame-row label{font:800 11px ui-monospace,monospace}
.frame-row input[type=number]{width:82px;padding:6px;background:#17212b;color:white;border:1px solid #526675;border-radius:7px}
.frame-slider{grid-column:1/-1;display:flex;gap:7px;align-items:center}
.frame-slider input{width:100%;min-width:0;accent-color:var(--gold)}
.frame-slider button{width:34px;flex-shrink:0}
#videoFramePanel p{font-size:11px;line-height:1.4;color:#bfcbd5;margin:10px 0 0}
.frame-actions{display:flex;gap:8px;margin-top:12px}
#videoFrameStatus{color:var(--ice)!important}
@media(max-width:600px){#videoFramePanel{top:12px;left:14px}#visualChooserHead{flex-wrap:wrap}#visualChooserHeadActions{flex-wrap:wrap}}

/* Step 43 — direct camera drag + non-destructive Floating 1/2 time trims. */
#videoFramePanel{width:min(390px,calc(100vw - 28px))}
#mainStageVideo.frame-target-active,#mainPanelVideo.frame-target-active,#adlibPanelVideo.frame-target-active,#controlsVideo.frame-target-active{pointer-events:auto!important;cursor:grab;touch-action:none;outline:2px solid rgba(170,246,255,.75);outline-offset:-2px}
#mainStageVideo.frame-target-active.frame-dragging,#mainPanelVideo.frame-target-active.frame-dragging,#adlibPanelVideo.frame-target-active.frame-dragging,#controlsVideo.frame-target-active.frame-dragging{cursor:grabbing}
.trim-panel{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.16)}
.trim-panel[hidden]{display:none}
.trim-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px;font:800 10px/1.2 ui-monospace,monospace;color:var(--gold)}
.trim-title span{color:var(--ice)}
.trim-row{display:grid;grid-template-columns:28px 74px 1fr auto;gap:6px;align-items:center;margin:8px 0}
.trim-row label{font:900 11px ui-monospace,monospace}
.trim-row input[type=number]{width:74px;box-sizing:border-box;padding:6px;background:#17212b;color:white;border:1px solid #526675;border-radius:7px}
.trim-row input[type=range]{width:100%;min-width:70px;accent-color:var(--gold)}
.trim-row button{white-space:nowrap;padding:6px 8px!important;font-size:9px!important}
.trim-actions{display:flex;gap:8px;margin-top:8px}
.trim-actions button{flex:1}
#videoTrimStatus{margin-top:8px!important;color:#cfe8ef!important}
@media(max-width:600px){.trim-row{grid-template-columns:26px 68px 1fr}.trim-row button{grid-column:2/-1}.trim-row input[type=number]{width:68px}}
