.video-workspace {
  display: grid;
  gap: var(--sc-space-8);
  padding: clamp(var(--sc-space-5), 4vw, var(--sc-space-10));
}

.video-workspace__heading {
  display: grid;
  gap: var(--sc-space-3);
}

.video-workspace__title,
.video-workspace__subtitle,
.video-workspace__tasks h3,
.video-workspace__task p {
  margin: 0;
}

.video-workspace__title {
  color: var(--sc-color-ink);
  font-size: clamp(1.5rem, 4vw, 2rem);
  line-height: var(--sc-leading-tight);
}

.video-workspace__subtitle {
  max-width: 64ch;
  color: var(--sc-color-muted);
  line-height: var(--sc-leading-copy);
}

.video-workspace__form,
.video-workspace__tasks {
  display: grid;
  gap: var(--sc-space-6);
}

.video-workspace__uploads {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sc-space-5);
}

.video-workspace__upload {
  min-width: 0;
}

.video-workspace__upload-button {
  display: grid;
  width: 100%;
  min-height: 17rem;
  overflow: hidden;
  place-items: center;
  padding: 0;
  border: 1px dashed var(--sc-color-border-strong);
  border-radius: var(--sc-radius-xl);
  color: var(--sc-color-text);
  background: var(--sc-color-surface-muted);
  cursor: pointer;
  transition: border-color var(--sc-motion-fast) var(--sc-ease), background var(--sc-motion-fast) var(--sc-ease), box-shadow var(--sc-motion-fast) var(--sc-ease);
}

.video-workspace__upload-button:hover {
  border-color: var(--sc-color-brand-500);
  background: var(--sc-color-brand-50);
}

.video-workspace__upload-button:focus-visible {
  outline: none;
  border-color: var(--sc-color-brand-500);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--sc-color-brand-500) 16%, transparent);
}

.video-workspace__upload-placeholder {
  display: grid;
  place-items: center;
  gap: var(--sc-space-2);
  padding: var(--sc-space-6);
  text-align: center;
}

.video-workspace__upload-icon {
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border-radius: var(--sc-radius-pill);
  color: var(--sc-color-brand-700);
  background: var(--sc-color-brand-100);
  font-size: 1.5rem;
}

.video-workspace__upload-label {
  font-size: 1rem;
  font-weight: 750;
}

.video-workspace__upload-hint,
.video-workspace__file-name {
  color: var(--sc-color-muted);
  font-size: 0.8125rem;
}

.video-workspace__upload-preview {
  width: 100%;
  height: 100%;
  min-height: 17rem;
  object-fit: cover;
}

.video-workspace__upload-preview[hidden],
.video-workspace__upload-placeholder[hidden],
.video-workspace__file-name[hidden] {
  display: none;
}

.video-workspace__file-name {
  margin: var(--sc-space-2) 0 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.video-workspace__settings {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: var(--sc-space-4);
}

.video-workspace__field {
  min-width: 0;
}

.video-workspace__readiness {
  margin: 0;
}

.video-workspace__file-help,
.video-workspace__readiness:empty {
  display: none;
}

.video-workspace__action {
  display: flex;
  justify-content: flex-end;
}

.video-workspace__action .sc-button {
  min-width: 14rem;
}

.video-workspace__submit-separator {
  opacity: 0.7;
}

.video-workspace__tasks {
  padding-top: var(--sc-space-6);
  border-top: 1px solid var(--sc-color-border);
}

.video-workspace__empty {
  margin: 0;
  color: var(--sc-color-muted);
}

[data-video-task-list] {
  display: grid;
  gap: var(--sc-space-4);
}

.video-workspace__task {
  display: grid;
  gap: var(--sc-space-3);
  padding: var(--sc-space-4);
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-color-surface);
  box-shadow: var(--sc-shadow-sm);
}

.video-workspace__task[data-state="error"] {
  border-color: color-mix(in srgb, var(--sc-color-danger) 36%, var(--sc-color-border));
}

.video-workspace__task-status {
  color: var(--sc-color-text);
  font-weight: 750;
}

.video-workspace__task-meta {
  color: var(--sc-color-muted);
  font-size: 0.8125rem;
}

.video-workspace__task-skeleton,
.video-workspace__result-video {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--sc-radius-md);
  background: var(--sc-color-surface-muted);
}

.video-workspace__task-skeleton {
  background: linear-gradient(90deg, var(--sc-color-surface-muted), var(--sc-color-surface), var(--sc-color-surface-muted));
  background-size: 200% 100%;
  animation: video-workspace-shimmer 1.4s linear infinite;
}

.video-workspace__result-video {
  display: block;
  object-fit: contain;
}

.video-workspace__task-actions,
.video-workspace__history-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sc-space-3);
  align-items: center;
}

.video-workspace__history-pagination {
  justify-content: center;
}

@keyframes video-workspace-shimmer {
  to { background-position: -200% 0; }
}

@media (max-width: 700px) {
  .video-workspace {
    gap: var(--sc-space-6);
    padding: var(--sc-space-4);
  }

  .video-workspace__uploads,
  .video-workspace__settings {
    grid-template-columns: 1fr;
  }

  .video-workspace__upload-button,
  .video-workspace__upload-preview {
    min-height: 13rem;
  }

  .video-workspace__action,
  .video-workspace__action .sc-button,
  .video-workspace__task-actions .sc-button,
  .video-workspace__task-actions a {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .video-workspace__upload-button {
    transition: none;
  }

  .video-workspace__task-skeleton {
    animation: none;
  }
}

.video-workspace { position:relative; padding:var(--sc-space-5); gap:var(--sc-space-5); }
.video-workspace__heading { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.video-workspace__form { gap:var(--sc-space-3); }
.video-workspace__uploads { gap:var(--sc-space-3); }
.video-workspace__upload-button { min-height:0; height:clamp(8rem,22vh,12rem); }
.video-workspace__upload-preview { min-height:0; height:100%; object-fit:contain; }
.video-workspace__upload-placeholder { padding:var(--sc-space-3); gap:var(--sc-space-1); }
.video-workspace__upload-icon { width:2rem; height:2rem; }
.video-workspace__upload > .sc-help { margin-block:var(--sc-space-2) 0; font-size:.75rem; }
.video-workspace__settings { gap:var(--sc-space-3); }
.video-workspace__field { gap:var(--sc-space-1); }
@media(max-width:720px) {
  .video-workspace { padding:var(--sc-space-3); }
  .video-workspace__uploads,.video-workspace__settings { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .video-workspace__upload-button { height:8rem; }
  .video-workspace__upload-placeholder { padding:var(--sc-space-2); }
  .video-workspace__upload-hint { font-size:.6875rem; }
  .video-workspace__action .sc-button { width:100%; min-width:0; }
}