/* Local video management; native controls, bounded layout and no auto-play. */
/* After selection keep a compact replacement control and prioritize the note text. */
.video-upload-panel:has(#videoPreviewPanel:not([hidden])) .video-drop-zone { padding:8px; }
.video-upload-panel:has(#videoPreviewPanel:not([hidden])) .video-drop-zone > svg,
.video-upload-panel:has(#videoPreviewPanel:not([hidden])) .video-drop-zone > span,
.video-upload-panel:has(#videoPreviewPanel:not([hidden])) .video-drop-zone > small { display:none; }
.video-upload-panel .video-preview-panel > video { max-height:220px; }
.video-upload-panel button, .video-library-item button { min-height:44px; min-width:44px; }
.video-upload-panel { border:1px solid var(--line); border-radius:12px; padding:16px; gap:12px; background:var(--surface-subtle); }
.video-upload-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.video-upload-heading small, .video-drop-zone small, .video-preview-panel small { color:var(--ink-soft); font-size:12px; }
.video-drop-zone { display:grid; justify-items:center; gap:8px; padding:18px 12px; border:1px dashed var(--line-strong); border-radius:10px; cursor:pointer; background:var(--surface); text-align:center; }
.video-drop-zone:focus-within { outline:2px solid var(--accent); outline-offset:2px; }
.video-drop-zone > svg { width:26px; height:26px; color:var(--accent); }
.video-drop-zone input { width:100%; max-width:340px; min-height:44px; }
.video-upload-progress { display:flex; align-items:center; gap:12px; }
.video-upload-progress progress { min-width:0; flex:1; height:12px; accent-color:var(--accent); }
.video-upload-progress button { flex:none; min-height:44px; }
.video-upload-status { margin:0; overflow-wrap:anywhere; font-size:13px; }
.video-preview-panel { display:flex; flex-direction:column; gap:8px; min-width:0; }
.video-preview-panel > video, .video-detail-preview { width:100%; max-height:320px; aspect-ratio:16 / 9; object-fit:contain; background:#101412; border-radius:10px; }
.video-preview-panel > span { overflow-wrap:anywhere; font-size:13px; }
.video-composer [hidden] { display:none !important; }
.video-library-list { display:flex; flex-direction:column; gap:10px; }
.video-library-item { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid var(--line); border-radius:10px; min-width:0; }
.video-library-item > svg { flex:none; width:24px; height:24px; color:var(--accent); }
.video-library-item > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.video-library-item strong { overflow-wrap:anywhere; font-size:14px; }
.video-library-item small { color:var(--ink-soft); font-size:12px; }
.video-library-item .row-actions { flex:none; }
@media(max-width:600px) {
  .video-upload-panel { padding:12px; }
  .video-upload-heading { align-items:flex-start; }
  .video-library-item { flex-wrap:wrap; }
  .video-library-item > span { min-width:160px; }
}