#image-fake-video-image-generator { color:#182b45; }
.fake-video-generator { display:grid; grid-template-columns:minmax(240px,300px) minmax(0,1fr); overflow:hidden; border:1px solid #dfe6ef; border-radius:16px; background:#fff; box-shadow:0 8px 28px rgba(31,55,88,.06); }
.fake-video-controls { display:flex; flex-direction:column; gap:20px; padding:22px; border-inline-end:1px solid #e3e9f0; background:#f6f9fd; }
.fake-video-label,.fake-video-field label { display:block; margin:0 0 7px; color:#43536a; font-size:13px; font-weight:700; }
.fake-video-dropzone { display:grid; min-height:150px; place-items:center; align-content:center; gap:3px; padding:18px; border:2px dashed #a9bdd5; border-radius:12px; background:#fff; color:#52657d; text-align:center; transition:border-color .15s,background .15s,transform .15s; cursor:pointer; }
.fake-video-dropzone:hover,.fake-video-dropzone.is-dragging { border-color:#2563eb; background:#f0f6ff; }
.fake-video-dropzone.is-dragging { transform:scale(.99); }
.fake-video-dropzone .material-icons { margin-bottom:4px; color:#2563eb; font-size:34px; }
.fake-video-dropzone strong { color:#1e3a5f; font-size:14px; }
.fake-video-dropzone small { color:#718096; font-size:12px; }
.fake-video-dropzone:focus-within { outline:3px solid rgba(37,99,235,.22); outline-offset:2px; }
.fake-video-file-name { overflow:hidden; margin:7px 0 0; color:#64748b; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.fake-video-field select { width:100%; min-height:44px; padding:9px 38px 9px 12px; border:1px solid #cbd6e3; border-radius:9px; background:#fff; color:#24364f; }
.fake-video-field select:focus-visible,.fake-video-primary:focus-visible,.fake-video-secondary:focus-visible { outline:3px solid rgba(37,99,235,.22); outline-offset:2px; }
.fake-video-actions { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.fake-video-primary,.fake-video-secondary { display:inline-flex; width:100%; min-height:44px; align-items:center; justify-content:center; gap:7px; padding:9px 13px; border-radius:9px; font-weight:700; white-space:nowrap; }
.fake-video-primary { border:1px solid #2563eb; background:#2563eb; color:#fff; }
.fake-video-primary:hover:not(:disabled) { background:#174eb6; }
.fake-video-secondary { border:1px solid #cbd6e3; background:#fff; color:#43536a; }
.fake-video-secondary:hover:not(:disabled) { border-color:#8ab0f8; color:#2563eb; }
.fake-video-primary:disabled,.fake-video-secondary:disabled { cursor:not-allowed; opacity:.48; }
.fake-video-primary .material-icons,.fake-video-secondary .material-icons { font-size:18px; }
.fake-video-privacy { display:flex; align-items:flex-start; gap:6px; margin:auto 0 0; color:#64748b; font-size:12px; }
.fake-video-privacy .material-icons { flex:0 0 auto; margin-top:1px; font-size:15px; }
.fake-video-preview-panel { min-width:0; padding:22px; }
.fake-video-preview-heading { display:flex; min-height:42px; align-items:flex-start; justify-content:space-between; gap:16px; }
.fake-video-preview-heading p { margin:0; color:#263a55; font-size:14px; font-weight:750; }
.fake-video-preview-heading small { color:#7a8798; font-size:11px; }
#fakevideo-status { color:#087f5b; font-size:12px; font-weight:650; text-align:end; }
#fakevideo-status.is-error { color:#b42332; }
.fake-video-canvas-wrap { overflow:hidden; border-radius:12px; background:#080b10; box-shadow:0 7px 22px rgba(15,23,42,.18); }
#fakevideo-image { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#080b10; }
.fake-video-help { max-width:860px; margin-top:42px; }
.fake-video-eyebrow { margin:0; color:#2563eb; font-size:11px; font-weight:800; letter-spacing:.12em; }
.fake-video-help h2 { margin:2px 0 12px; font-size:21px; }
.fake-video-help ol { margin:0 0 13px; padding-inline-start:1.5rem; color:#43536a; }
.fake-video-help li+li { margin-top:4px; }
.fake-video-help>p:last-child { margin:0; color:#64748b; font-size:13px; }

@media (max-width:820px) {
  .fake-video-generator { grid-template-columns:1fr; }
  .fake-video-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,240px); align-items:start; border-inline-end:0; border-bottom:1px solid #e3e9f0; }
  .fake-video-controls>div:first-child { grid-row:1/4; min-width:0; }
  .fake-video-field,.fake-video-actions,.fake-video-privacy { grid-column:2; }
  .fake-video-privacy { margin:0; }
  .fake-video-dropzone { min-height:116px; }
}
@media (max-width:640px) {
  .fake-video-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; padding:16px; }
  .fake-video-controls>div:first-child { grid-column:1; grid-row:1/3; }
  .fake-video-field { grid-column:2; grid-row:1; }
  .fake-video-actions { grid-column:2; grid-row:2; gap:6px; }
  .fake-video-privacy { grid-column:1/-1; }
  .fake-video-dropzone { min-height:126px; padding:12px 8px; }
  .fake-video-dropzone .material-icons { font-size:29px; }
  .fake-video-primary,.fake-video-secondary { min-height:40px; padding:7px 9px; font-size:12px; }
  .fake-video-field select { min-height:40px; padding-block:7px; font-size:13px; }
  .fake-video-file-name { margin-top:5px; }
  .fake-video-preview-panel { padding:18px; }
  .fake-video-preview-heading { min-height:39px; gap:10px; }
  .fake-video-help { margin-top:34px; }
}
@media (max-width:420px) {
  .fake-video-controls { gap:9px; padding:13px; }
  .fake-video-preview-panel { padding:13px; }
  .fake-video-dropzone { min-height:122px; }
  .fake-video-primary .material-icons,.fake-video-secondary .material-icons { display:none; }
  .fake-video-primary,.fake-video-secondary { padding-inline:6px; }
  .fake-video-preview-heading { display:block; }
  #fakevideo-status { display:block; min-height:1.4em; margin-top:2px; text-align:start; }
  .fake-video-help h2 { font-size:19px; }
}