/* Hosted video source library: inherits the existing quiet, compact workbench. */
.video-material-library { margin: 10px 0 6px; color: #24272c; font-size: 13px; }
.video-material-library > summary { cursor: pointer; color: #616b79; padding: 5px 0; }
.video-material-library .vm-content { padding-top: 6px; }
.video-material-library .vm-help { margin: 0 0 8px; color: #616b79; line-height: 1.5; font-size: 12px; }
.video-material-library .vm-list { max-height: 184px; overflow-y: auto; overscroll-behavior: contain; }
.video-material-library .vm-row { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 5px 0; border-bottom: 1px solid #e2e6ec; }
.video-material-library .vm-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400; }
.video-material-library .vm-state { color: #616b79; font-size: 12px; flex-shrink: 0; }
.video-material-library select { width: 74px; min-width: 74px; padding: 5px 3px; border: 1px solid #e2e6ec; border-radius: 7px; background: #fafbfc; color: #24272c; font: inherit; }
.video-material-library input[type=checkbox] { width: 15px; height: 15px; margin: 0; accent-color: #24272c; flex-shrink: 0; }
.video-material-library .vm-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.video-material-library .vm-actions button { border: 1px solid #e2e6ec; border-radius: 8px; padding: 7px 10px; min-height: 34px; color: #24272c; background: #fff; font: inherit; cursor: pointer; }
.video-material-library .vm-actions .vm-save { background: #24272c; color: #fff; border-color: #24272c; }
.video-material-library .vm-actions button:disabled { opacity: .5; cursor: default; }
.video-material-library .vm-status { color: #616b79; line-height: 1.5; margin: 8px 0 0; overflow-wrap: anywhere; }
.video-material-library :is(button,select,input,summary):focus-visible { outline: 1px solid #818995; outline-offset: 2px; }
@media(min-width:980px) {
  .video-material-library .vm-content { display: grid; grid-template-rows: auto minmax(0,1fr) auto auto; max-height: min(280px,30dvh); }
  .video-material-library .vm-list { min-height: 0; max-height: none; }
}
@media(max-width:600px) { .video-material-library select { font-size: 16px; width: 80px; min-width: 80px; } }

.vm-state{white-space:normal;overflow-wrap:anywhere}.vm-ratio-warning{grid-column:1/-1;color:inherit;font-size:13px;line-height:1.6}.vm-padding-preview{max-width:min(800px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #bdc4ca;border-radius:12px;padding:20px}.vm-padding-preview img{max-width:100%;max-height:55vh;object-fit:contain}.vm-padding-preview button{min-height:44px;margin:8px}.vm-padding-preview::backdrop{background:rgba(0,0,0,.45)}

/* A saved asset has several lines of status and actions; never squeeze them
   into the single upload row, including in the narrow desktop editor pane. */
.video-material-library .vm-list .vm-row{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:8px;align-items:center;color:var(--ux-ink,#24272c)}
.video-material-library .vm-list .vm-row[data-media-id]{grid-template-columns:20px minmax(0,1fr) 88px}
.video-material-library .vm-name{color:inherit;white-space:normal;overflow-wrap:anywhere;line-height:1.5}
.video-material-library .vm-row .vm-state,.video-material-library .vm-row .vm-ratio-warning,.video-material-library .vm-row .vm-padding-action{grid-column:1/-1;min-width:0;max-width:100%;white-space:normal;line-height:1.6}
.video-material-library .vm-row .vm-ratio-warning{margin:0}
.video-material-library .vm-row .vm-padding-action{justify-self:start;width:auto;min-height:44px;padding:8px 12px;white-space:nowrap;font:inherit;cursor:pointer}
.video-material-library .vm-row select{width:88px;min-width:0;max-width:100%;min-height:44px}
html[data-wwx-appearance="dark"] .video-material-library :is(.vm-name,.vm-ratio-warning){color:var(--ux-ink,#edf2f6)}
html[data-wwx-appearance="dark"] .video-material-library :is(.vm-help,.vm-state,.vm-status){color:var(--ux-muted,#c0cbd4)}
.video-material-library .vm-content{display:block;max-height:none}
.video-material-library .vm-list{max-height:min(360px,45dvh)}