/* A shared task surface keeps the header and actions visible while its body scrolls. */
body:has(dialog.dialog-task[open]) {overflow: hidden;}
dialog.dialog-task {padding: 0; width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: hidden; border-radius: var(--radius-lg);}
.dialog-task #dialog-content {max-height: calc(100dvh - 34px); display: flex; min-height: 0;}
.dialog-frame {display: flex; flex-direction: column; width: 100%; min-width: 0; max-height: inherit;}
.dialog-header {display: flex; align-items: start; justify-content: space-between; gap: 16px; padding: 24px 24px 16px; flex-shrink: 0;}
.dialog-header h2 { margin: 0 0 8px;}
.dialog-header p {margin: 0; overflow-wrap: anywhere;}
.dialog-close {border: 0; padding: 4px; display: flex; align-items: center;}
.dialog-close img {width: 18px; height: 18px;}
.dialog-body {padding: 0 24px 16px; min-height: 0; min-width: 0; overflow-y: auto; overscroll-behavior: contain;}
.dialog-footer {padding: 16px 24px 24px; border-top: 1px solid var(--color-line); flex-shrink: 0;}
.dialog-footer [role="status"] {font-size: var(--text-small); color: var(--color-text-secondary); margin-bottom: 12px;}
.dialog-actions {display: flex; justify-content: end; gap: 8px; flex-wrap: wrap;}
.dialog-actions .primary {flex: 1;}
.acquisition-category {display: flex; gap: 8px; align-items: center; margin-bottom: 16px; font-size: var(--text-small); color: var(--color-text-secondary);}
.acquisition-category select {flex: 1; min-width: 0;}
.acquisition-files {padding: 0; margin: 0; list-style: none; display: flex; flex-direction: column; gap: 12px;}
.acquisition-file {background: var(--color-surface-subtle); padding: 12px; display: flex; gap: 12px; align-items: center; min-width: 0;}
.acquisition-file label {display: flex; align-items: start; gap: 12px; flex: 1; min-width: 0; cursor: pointer;}
.acquisition-file input {width: 16px; height: 16px; flex-shrink: 0; margin: 2px 0 0; accent-color: var(--color-accent);}
.acquisition-file strong {display: block; font-weight: 400; font-size: var(--text-small); overflow-wrap: anywhere;}
.acquisition-file small {display: block; margin-top: 4px; color: var(--color-text-secondary); font-size: var(--text-caption); overflow-wrap: anywhere;}
.acquisition-file button {flex-shrink: 0;}
.acquisition-preview h3 {font-size: var(--text-body); overflow-wrap: anywhere;}
.acquisition-image {max-width: 100%; max-height: 45dvh; object-fit: contain; display: block; margin: 12px auto;}
.acquisition-image.zoomed {max-height: none; width: 100%;}
.acquisition-zoom {font-size: var(--text-caption);}
@media (max-width: 520px) {
  .dialog-header {padding: 20px 16px 16px;}
  .dialog-body {padding: 0 16px 16px;}
  .dialog-footer {padding: 16px;}
  .acquisition-file {flex-wrap: wrap;}
  .acquisition-file label {flex-basis: 100%;}
}