.kpi-primary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.kpi-card { min-width: 0; display: flex; align-items: center; gap: 14px; padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.kpi-card.urgent { border-left: 4px solid var(--danger-700); }
.kpi-card.warning { border-left: 4px solid var(--warning-700); }
.kpi-icon { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: var(--radius-md); font-size: 17px; background: color-mix(in srgb, var(--kpi-color, var(--brand-700)) 12%, transparent); color: var(--kpi-color, var(--brand-700)); }
.kpi-body { min-width: 0; flex: 1; }
.kpi-label { display: block; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-600); font-size: 11px; font-weight: 500; }
.kpi-value { min-width: 0; display: block; margin: 0; white-space: nowrap; font-size: clamp(18px, 1.4vw, 21px); font-weight: 600; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi-note { margin: 0; color: var(--ink-500); font-size: 11px; }
.summary-strip { max-width: 100%; width: fit-content; display: flex; align-items: stretch; flex-wrap: wrap; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.summary-item { min-width: 0; display: flex; align-items: baseline; gap: 6px; padding: 7px 10px; border-right: 1px solid var(--line); white-space: nowrap; }
.summary-item:not(:last-child) { margin-right: -1px; }
.summary-item:last-child { border-right: 0; }
.summary-item span { color: var(--ink-600); font-size: 11px; }
.summary-item strong { margin: 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); gap: var(--space-4); }
.panel { min-width: 0; padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); }
.panel-head h2, .panel-head h3 { margin: 0; }
.panel-head p { margin: 4px 0 0; color: var(--ink-600); font-size: 12px; }
.trend-chart { aspect-ratio: 16 / 7; min-height: 210px; display: flex; align-items: end; gap: clamp(5px, 1vw, 14px); padding: var(--space-4) 0 24px; border-bottom: 1px solid var(--line); }
.trend-group { min-width: 18px; height: 100%; flex: 1; display: flex; align-items: end; justify-content: center; gap: 3px; position: relative; }
.trend-bar { width: min(18px, 45%); min-height: 2px; border-radius: 4px 4px 0 0; background: var(--brand-600); }
.trend-bar.paid { background: var(--success-500); }
.trend-label { position: absolute; bottom: -22px; left: 50%; transform: translateX(-50%); color: var(--ink-500); font-size: 9px; white-space: nowrap; }
.legend { display: flex; gap: var(--space-4); margin-top: var(--space-3); color: var(--ink-600); font-size: 11px; }
.legend span::before { content: ""; width: 8px; height: 8px; display: inline-block; margin-right: 5px; border-radius: 2px; background: var(--brand-600); }
.legend span:last-child::before { background: var(--success-500); }
.upload-hero { min-height: 280px; display: grid; place-items: center; padding: clamp(24px, 5vw, 52px); border: 1px dashed var(--line-strong); border-radius: var(--radius-xl); background: var(--surface); text-align: center; }
.upload-hero.dragover { border-color: var(--brand-600); background: var(--brand-100); }
.upload-mark { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto var(--space-4); border-radius: 19px; color: var(--brand-700); background: var(--brand-100); font-size: 28px; }
.upload-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-5); }
.upload-actions input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.intake-activity { width: min(680px, 100%); margin-top: var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-soft); text-align: left; }
.intake-activity-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); }
.intake-activity-head h3 { margin: 0; font-size: 14px; }
.intake-activity ol { display: grid; gap: var(--space-2); margin: var(--space-2) 0 0; padding: 0; list-style: none; }
.intake-activity-row { min-width: 0; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: start; gap: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--line); }
.intake-activity-row > div { min-width: 0; display: grid; gap: 3px; }
.intake-activity-row strong, .intake-activity-row small { overflow-wrap: anywhere; }
.intake-activity-row small { color: var(--ink-600); font-size: 12px; }
.intake-activity-icon { width: 20px; height: 20px; display: grid; place-items: center; color: var(--brand-700); font-weight: 600; }
.intake-activity-row[data-state="success"] .intake-activity-icon { color: var(--success-700); }
.intake-activity-row[data-state="error"] .intake-activity-icon { color: var(--danger-700); }
.intake-activity-row progress { width: 100%; height: 6px; accent-color: var(--brand-600); }
.intake-activity-list { margin-top: var(--space-3); }
.intake-upload-batch { display: grid; gap: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--line); }
.intake-upload-batch:first-child { padding-top: 0; border-top: 0; }
.intake-upload-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.intake-upload-head strong { overflow-wrap: anywhere; }
.intake-upload-head p { margin: 2px 0 0; font-size: 12px; }
.intake-upload-items[hidden] { display: none; }
.intake-queue { display: grid; gap: var(--space-3); }
.intake-search { max-width: 420px; }
.intake-queue-more { display: flex; justify-content: center; padding-top: var(--space-3); }
.intake-doc-context { margin: 0; color: var(--ink-600); font-size: 13px; }
.intake-thumbnail-fallback { position: absolute; inset: auto 0 20px; padding: 2px 4px; color: var(--ink-600); background: var(--surface-soft); font-size: 10px; }
.stepper { display: flex; gap: var(--space-2); margin-bottom: var(--space-4); }
.stepper span { height: 5px; flex: 1; border-radius: 99px; background: var(--line); }
.stepper span.active { background: var(--brand-600); }
.review-card { padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.review-card + .review-card { margin-top: var(--space-3); }
.review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.relationship-list { display: grid; gap: var(--space-3); margin-top: var(--space-4); }
.relationship-card { padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.relationship-card p { margin: 6px 0 0; color: var(--ink-600); }
.admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.admin-card { min-width: 0; display: flex; flex-direction: column; padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.admin-card p { color: var(--ink-600); }
.admin-card .toolbar-actions { margin-top: auto; padding-top: var(--space-4); }
.pdf-viewer { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.pdf-frame { width: 100%; min-height: 0; flex: 1 1 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); }
.pdf-document-surface .surface-head { min-height: 64px; padding-block: 8px; }
.pdf-identity { min-width: 0; flex: 1; }
.pdf-identity h2 { font-size: 16px; }
.pdf-filename { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-600); font-size: 12px; line-height: 1.5; }
.pdf-document-surface .pdf-surface-body { padding: 8px 12px 12px; }
.pdf-document-toolbar { position: relative; flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 8px; }
.pdf-variants { display: flex; padding: 2px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.pdf-variants .button { border-color: transparent; background: transparent; border-radius: 7px; padding-inline: 12px; font-weight: 500; }
.pdf-variants .button[aria-pressed="true"] { border-color: var(--line-strong); background: var(--surface); color: var(--brand-700); box-shadow: var(--shadow-sm); }
.pdf-file-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-left: auto; }
.pdf-file-actions .button { padding-inline: 10px; font-weight: 500; white-space: nowrap; }
.pdf-file-actions [data-pdf-more] { min-width: 44px; }
.pdf-more-actions { position: absolute; top: 100%; right: 0; z-index: 1; width: min(300px, 100%); max-height: min(240px, 45dvh); overflow-y: auto; padding: 6px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); box-shadow: var(--shadow-md); }
.pdf-more-actions .button { width: 100%; justify-content: flex-start; border-color: transparent; padding: 10px; font-weight: 500; text-align: left; }
.pdf-more-actions [data-source-control]:not(:empty) { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px; }
.pdf-preparation-review { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); }
.pdf-preparation-review > span { color: var(--ink-600); font-size: 12px; }
.pdf-review-actions { display: flex; flex-wrap: wrap; gap: 4px; }
.pdf-review-actions .button { padding-inline: 10px; }
.pdf-preparation-status { flex: 0 0 auto; margin: 0 0 8px; font-size: 12px; }
.pdf-preparation-status:empty, .pdf-document-viewer [hidden] { display: none; }
@media (max-width: 600px) {
  .pdf-document-surface .pdf-surface-body { padding: 8px; }
  .pdf-file-actions { margin-left: 0; }
  .pdf-file-actions .button { padding-inline: 8px; }
  .pdf-more-label { display: none; }
  .pdf-review-actions { width: 100%; }
}
.more-search { margin-bottom: var(--space-3); }
.more-search input { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 10px; font-size: 16px; }
.global-search-groups { display: grid; gap: var(--space-4); }
.global-search-group { border-bottom: 1px solid var(--line); padding-bottom: var(--space-3); }
.global-search-group:last-child { border-bottom: 0; }
.global-search-group h3 { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); }
.global-search-group [role="listbox"] { display: grid; gap: 2px; }
.global-search-group [role="option"] { width: 100%; min-height: 48px; display: grid; gap: 2px; padding: 9px 10px; border-radius: 9px; background: transparent; text-align: left; cursor: pointer; }
.global-search-group [role="option"]:hover, .global-search-group [role="option"]:focus { background: var(--surface-soft); }
.global-search-group [role="option"] small { color: var(--ink-600); overflow-wrap: anywhere; }
.surface-body.pdf-surface-body, .surface-body.camera-surface-body { min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.surface-body.pdf-surface-body > .pdf-viewer { min-height: 0; flex: 1 1 0; }
.camera-workflow { min-height: 0; height: 100%; display: flex; flex-direction: column; gap: var(--space-3); }
.camera-preview { width: 100%; min-height: 0; flex: 1 1 0; object-fit: contain; border-radius: var(--radius-md); background: var(--ink-950); }
.camera-pages { flex: 0 0 auto; color: var(--ink-600); text-align: center; }
.camera-actions { flex: 0 0 auto; display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-2); padding-bottom: var(--safe-bottom); background: var(--surface); }
.import-queue ol { display: grid; gap: 6px; margin: var(--space-4) 0 0; padding: 0; list-style: none; }
.import-queue-row { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); padding: 9px 0; border-bottom: 1px solid var(--line); }
.import-queue-row strong, .import-queue-row small { display: block; overflow-wrap: anywhere; }
.import-queue-row small { margin-top: 2px; color: var(--ink-600); }
.import-progress { height: 7px; overflow: hidden; border-radius: 999px; background: var(--surface-soft); }
.import-progress span { display: block; height: 100%; border-radius: inherit; background: var(--brand-600); transition: width var(--motion-medium); }
.import-batch-grid { display: grid; grid-template-columns: minmax(300px, 1fr) minmax(280px, .8fr); gap: var(--space-4); margin: var(--space-4) 0; }
.import-batch-grid .pdf-frame { min-height: 530px; }
.intake-board { min-width: 0; }
.intake-progress-panel { display: grid; gap: var(--space-3); }
.intake-progress { width: 100%; height: 9px; accent-color: var(--brand-600); }
.intake-files { display: grid; gap: var(--space-4); }
.intake-file-card { padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.intake-file-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-4); border-bottom: 1px solid var(--line); }
.intake-file-head h2 { margin: 0; font-size: 17px; overflow-wrap: anywhere; }
.intake-file-head p { margin: 4px 0 0; color: var(--ink-600); }
.intake-processing-status { display: inline-flex; align-items: center; gap: 6px; }
.intake-spinner { width: 12px; height: 12px; flex: 0 0 12px; border: 2px solid var(--line-strong); border-top-color: var(--brand-600); border-radius: 50%; animation: intake-spin .8s linear infinite; }
@keyframes intake-spin { to { transform: rotate(360deg); } }
.intake-doc-list { display: grid; align-content: start; gap: var(--space-4); margin-top: var(--space-4); }
.intake-doc-row { display: grid; grid-template-columns: minmax(320px, .9fr) minmax(360px, 1fr); gap: var(--space-4); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); transition: border-color var(--motion-fast), box-shadow var(--motion-fast); }
.intake-doc-row.has-error { border-color: var(--danger-700); }
.intake-doc-row[data-status="skipped"] { opacity: .55; }
.intake-doc-preview { min-width: 0; height: min(62vh, 650px); display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: var(--space-2); }
.intake-doc-preview .pdf-frame { height: 100%; min-height: 0; }
.intake-doc-preview small { color: var(--ink-600); font-size: 12px; }
.intake-triage { display: grid; gap: var(--space-4); }
.intake-triage-group { padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.intake-triage-group > header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.intake-triage-group > header h2 { margin: 0; font-size: 16px; }
.intake-triage-row { grid-template-columns: 92px minmax(0, 1fr); gap: var(--space-3); padding: var(--space-3); }
.intake-doc-thumb { position: relative; min-height: 82px; display: grid; place-items: center; align-content: center; gap: 5px; overflow: hidden; padding: 0; border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--brand-700); background: var(--surface-soft); cursor: pointer; }
.intake-doc-thumb:hover, .intake-doc-thumb:focus-visible { border-color: var(--brand-600); background: var(--brand-100); }
.intake-doc-thumb img { width: 100%; min-height: 58px; max-height: 88px; display: block; object-fit: cover; object-position: top; background: white; }
.intake-doc-thumb small { color: var(--ink-600); font-size: 10px; }
.intake-thumbnail-processing { position: absolute; inset: 0 0 20px; z-index: 1; display: grid; place-items: center; background: rgba(23, 32, 51, .48); pointer-events: none; }
.intake-thumbnail-spinner { width: 36px; height: 36px; flex-basis: 36px; border: 4px solid rgba(255, 255, 255, .42); border-top-color: white; box-shadow: 0 1px 4px rgba(23, 32, 51, .4); }
.intake-triage-pill { margin-left: auto; white-space: nowrap; }
/* Comparative myDATA approval: transmitted values beside the printed PDF check. */
.intake-comparison-head { display: grid; grid-template-columns: 34px minmax(180px, 1.1fr) minmax(0, 1.5fr) auto auto; gap: var(--space-3); padding: 0 var(--space-3) var(--space-2); color: var(--ink-600); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.intake-comparison-row { grid-template-columns: 34px minmax(180px, 1.1fr) minmax(0, 1.5fr) auto auto; align-items: start; gap: var(--space-3); }
.intake-comparison-select { display: grid; place-items: start center; padding-top: 6px; }
.intake-comparison-select input { width: 20px; height: 20px; accent-color: var(--brand-600); }
.intake-comparison-identity { min-width: 0; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: var(--space-2); }
.intake-comparison-identity .intake-doc-thumb { min-height: 72px; }
.intake-comparison-meta { min-width: 0; display: grid; align-content: start; gap: 2px; }
.intake-comparison-meta strong, .intake-comparison-meta small { overflow-wrap: anywhere; }
.intake-comparison-meta .muted { color: var(--ink-600); font-size: 12px; }
.intake-comparison-values { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.intake-comparison-column { min-width: 0; display: grid; gap: 3px; }
.intake-comparison-source { color: var(--ink-600); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.intake-comparison-field { display: flex; justify-content: space-between; gap: var(--space-2); font-size: 13px; font-variant-numeric: tabular-nums; }
.intake-comparison-field.is-different { color: var(--danger-700); }
.intake-comparison-status { white-space: nowrap; }
.intake-comparison-status[data-comparison-state="match"] { color: var(--success-700); background: var(--success-100); }
.intake-comparison-status[data-comparison-state="differences"] { color: var(--danger-700); background: var(--danger-100); }
.intake-comparison-status[data-comparison-state="failed"] { color: var(--warning-700); background: var(--warning-100); }
.intake-review-reason { margin: 0; color: var(--warning-700); font-size: 13px; }
.intake-subsection-title { margin: var(--space-2) 0 0; color: var(--ink-600); font-size: 13px; }
.intake-triage-summary { margin: calc(var(--space-2) * -1) 0 0; color: var(--ink-600); font-size: 13px; font-variant-numeric: tabular-nums; }
.intake-doc-editing { border-top: 1px solid var(--line); padding-top: var(--space-2); }
.intake-doc-editing summary { color: var(--ink-600); cursor: pointer; font-size: 13px; }
.intake-doc-editing .intake-doc-controls { margin-top: var(--space-2); }
.intake-bulk-outcomes { display: grid; gap: 4px; padding: var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.intake-bulk-outcomes header h2 { margin: 0 0 var(--space-2); font-size: 14px; }
.intake-bulk-outcome-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); padding: 8px 0; border-top: 1px solid var(--line); }
.intake-bulk-outcome-row > span:nth-child(2) { min-width: 0; }
.intake-bulk-outcome-row strong, .intake-bulk-outcome-row small { display: block; overflow-wrap: anywhere; }
.intake-bulk-outcome-row small { color: var(--ink-600); font-size: 12px; }
.intake-bulk-outcome-row p, .intake-row-outcome { margin: 0; font-size: 13px; }
.intake-usage { margin: 0; padding-bottom: var(--space-4); text-align: right; font-variant-numeric: tabular-nums; }
.intake-doc-details { min-width: 0; display: grid; align-content: start; gap: var(--space-3); }
.intake-doc-title { min-width: 0; display: flex; align-items: center; gap: var(--space-3); }
.intake-doc-title > span:last-child { min-width: 0; display: grid; gap: 2px; }
.intake-doc-title strong, .intake-doc-title small { overflow-wrap: anywhere; }
.intake-doc-title small { color: var(--ink-600); }
.intake-doc-controls { display: grid; grid-template-columns: 88px 88px minmax(170px, 1fr); gap: var(--space-2); }
.intake-doc-controls .field { min-width: 0; }
.intake-doc-controls input, .intake-doc-controls select { width: 100%; min-height: 42px; }
.intake-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.intake-warning { margin: 0; color: var(--warning-700); font-size: 13px; overflow-wrap: anywhere; }
.intake-resume-note { margin: 0; padding: 9px 10px; border-radius: var(--radius-sm); color: var(--brand-700); background: var(--brand-100); font-size: 13px; line-height: 1.4; }
.intake-review-grid { min-height: min(68vh, 680px); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
/* The review is a workspace, not a form drawer: on desktop it uses the wide
   comparative layout; the phone keeps the single-column sheet (responsive.css). */
.surface-panel[data-surface-variant="intake-review"] {
  width: min(1500px, calc(100vw - 48px));
  height: min(920px, calc(100dvh - 48px));
  max-height: min(920px, calc(100dvh - 48px));
}
.surface-panel[data-surface-variant="intake-review"] .surface-body { padding: var(--space-4) var(--space-5) var(--space-5); }
.intake-review-preview { display: flex; flex-direction: column; gap: 8px; height: min(62dvh, 620px); min-height: 420px; }
.intake-review-preview .pdf-frame { height: auto; flex: 1 1 0; min-height: 0; }
.intake-review-preview-fallback { display: flex; flex: 0 0 auto; gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); }
.intake-review-preview-fallback img { width: 96px; height: 118px; object-fit: contain; background: var(--surface); border-radius: var(--radius-sm); }
.intake-review-preview-fallback p { margin: 4px 0 8px; }
.intake-review-preview-fallback .button { display: inline-flex; }
.intake-review-form { min-width: 0; padding-right: 2px; }
.intake-proposal-summary { margin: 0; }
.intake-draft-status { min-height: 20px; margin: 0; color: var(--ink-600); font-size: 13px; }
.intake-draft-status[data-state="saving"] { color: var(--brand-700); }
.intake-draft-status[data-state="unsaved"] { color: var(--warning-700); }
.intake-draft-status[data-state="error"] { color: var(--danger-700); }
.intake-review-actions { position: sticky; bottom: 0; padding-top: var(--space-3); background: var(--surface); }
.intake-field-wide { grid-column: 1 / -1; }
.nav-count { display: inline-grid; min-width: 18px; height: 18px; place-items: center; margin-left: 5px; padding: 0 4px; border-radius: 999px; color: var(--brand-700); background: var(--brand-100); font-size: 11px; line-height: 1; }
.state-banner { margin: var(--space-3) 0; padding: 12px; border-radius: var(--radius-sm); color: var(--ink-800); background: var(--warning-100); }
.import-danger { color: var(--danger-700); background: var(--danger-100); }
.import-warning { color: var(--warning-700); background: var(--warning-100); }
.proposal-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.camera-stage { position: relative; min-height: 0; flex: 1 1 0; display: grid; place-items: center; overflow: hidden; border-radius: var(--radius-md); background: var(--ink-950); }
.camera-stage .camera-preview { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.camera-result { max-width: 100%; max-height: 100%; min-height: 0; object-fit: contain; touch-action: none; }
.camera-loading { position: absolute; inset: 0; align-items: center; justify-content: center; background: var(--ink-950); color: white; }
.camera-hint { position: absolute; bottom: 0; margin: 0; padding: var(--space-2); background: rgba(0,0,0,.7); color: white; pointer-events: none; text-align: center; }
.camera-guide { position: absolute; z-index: 1; width: 82%; height: 72%; border: 2px dashed rgba(255,255,255,.45); box-shadow: 0 0 0 9999px rgba(0,0,0,.3); pointer-events: none; }
.cleanup-item { min-height: 52px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); padding: 6px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.cleanup-item small { color: var(--ink-600); white-space: nowrap; }
.dashboard-kpi { color: inherit; text-decoration: none; transition: transform var(--motion-fast), box-shadow var(--motion-fast); }
.dashboard-kpi:hover, .dashboard-kpi:focus-visible { transform: translateY(-2px); box-shadow: var(--shadow-md); outline: 2px solid var(--brand-600); outline-offset: 2px; }
.dashboard-doc-counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 0; overflow: hidden; }
.dashboard-doc-counts .panel-head { grid-column: 1 / -1; padding: var(--space-5) var(--space-5) 0; }
.dashboard-doc-counts a { display: flex; justify-content: space-between; gap: var(--space-3); padding: 12px var(--space-5); border-top: 1px solid var(--line); color: var(--ink-700); text-decoration: none; }
.dashboard-doc-counts a:hover { background: var(--surface-soft); }
.chart-box { position: relative; height: 320px; } .chart-box-wide { height: 300px; }
.credit-line { color: var(--danger-700); font-weight: 700; }
.disabled-card { opacity: .55; pointer-events: none; }
.admin-stats { margin-top: var(--space-3); }
.detail-section { margin-top: var(--space-4); }.detail-section h3 { margin-bottom: var(--space-2); font-size: 14px; }
.danger-text { color: var(--danger-700); }.success-text { color: var(--success-700); }
.admin-card code { overflow-wrap: anywhere; word-break: break-word; }

/* Record summaries deliberately lead with the document, not its extraction payload.
   The compact preview stays useful on a desktop modal without impersonating a PDF
   reader; the full reader remains an explicit action. */
.surface-panel[data-surface-variant="summary"] {
  width: min(900px, calc(100vw - 48px));
  height: min(820px, calc(100dvh - 48px));
  max-height: min(820px, calc(100dvh - 48px));
}
.surface-panel[data-surface-variant="summary"] .surface-body { padding: var(--space-4) var(--space-5) var(--space-5); }
.document-tabs { display: flex; align-items: center; gap: 2px; margin: -2px 0 var(--space-4); padding: 3px; overflow-x: auto; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); scrollbar-width: thin; }
.document-tabs .button { min-height: 34px; flex: 0 0 auto; padding: 6px 10px; border-radius: 7px; color: var(--ink-600); font-size: 12px; white-space: nowrap; }
.document-tabs .button[aria-selected="true"] { border-color: var(--line); color: var(--brand-700); background: var(--surface); box-shadow: var(--shadow-sm); }
.document-tabs .button:hover { color: var(--ink-800); background: color-mix(in srgb, var(--surface) 74%, transparent); }
.document-summary-grid { display: grid; grid-template-columns: minmax(240px, .9fr) minmax(0, 1.1fr); gap: var(--space-5); align-items: start; }
.document-thumbnail { min-height: 310px; display: grid; place-items: center; overflow: hidden; padding: 0; border: 1px solid var(--line-strong); border-radius: var(--radius-md); color: var(--ink-600); background: #f5f7fa; cursor: pointer; }
.document-thumbnail:not(:disabled):hover { border-color: var(--brand-600); background: var(--brand-100); }
.document-thumbnail:focus-visible { outline: 3px solid var(--brand-100); outline-offset: 2px; }
.document-thumbnail:disabled { cursor: default; }
.document-thumbnail img { width: 100%; height: 100%; min-height: 310px; display: block; object-fit: contain; object-position: center; background: white; }
.document-thumbnail > span { max-width: 18ch; padding: var(--space-4); text-align: center; font-size: 12px; line-height: 1.45; }
.document-essentials { min-width: 0; padding: 2px 0; }
.document-essentials h3 { margin: 0; overflow-wrap: anywhere; color: var(--ink-950); font-size: 21px; letter-spacing: -.02em; line-height: 1.2; }
.document-essentials > .muted { margin: 7px 0 10px; font-variant-numeric: tabular-nums; }
.supplier-link { color: inherit; text-decoration: none; }
.supplier-link:hover, .supplier-link:focus-visible { color: var(--brand-700); text-decoration: underline; text-underline-offset: 3px; }
.document-amounts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: var(--space-4) 0; border: 1px solid var(--line); border-radius: var(--radius-md); overflow: hidden; background: var(--surface); font-variant-numeric: tabular-nums; }
.document-amounts > div { min-width: 0; padding: 10px 12px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.document-amounts > div:nth-child(2n) { border-right: 0; }
.document-amounts > div:nth-last-child(-n + 2):nth-child(odd), .document-amounts > div:last-child:nth-child(odd) { border-bottom: 0; }
.document-amounts span { display: block; color: var(--ink-600); font-size: 11px; line-height: 1.25; }
.document-amounts strong { display: block; margin-top: 4px; overflow-wrap: anywhere; color: var(--ink-950); font-size: 16px; letter-spacing: -.015em; }
.document-essentials > .button { min-height: 36px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--brand-700); background: var(--surface-soft); font-size: 12px; }
.document-essentials > .chip { margin-top: var(--space-3); white-space: normal; }
.summary-relationships { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--line); }
.summary-relationships h3 { margin: 0; font-size: 14px; }
.summary-relationships > .muted { margin: 6px 0 0; }

/* Supplier workspaces are an operational home for one counterparty: the
   financial position stays visible while documents remain compact and scannable. */
.supplier-workspace { gap: var(--space-4); }
.supplier-ledger { min-width: 0; padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); container-type: inline-size; }
.supplier-ledger .supplier-section-heading { flex-wrap: wrap; }
.supplier-ledger .eyebrow { margin: 0 0 5px; }
.ledger-note { color: var(--ink-600); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.ledger-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; padding: 12px 0; }
.ledger-filters .field { min-width: 0; display: grid; gap: 4px; }
.ledger-filters label { font-size: 12px; font-weight: 600; }
.ledger-filters input { max-width: 100%; min-height: 40px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink-900); }
.ledger-table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; }
.ledger-table { width: min(100%, 1500px); border-collapse: collapse; table-layout: fixed; font-size: 12px; }
.ledger-sequence { width: 4%; }
.ledger-date { width: 10%; }
.ledger-reference { width: 16%; }
.ledger-description { width: 26%; }
.ledger-money { width: 11%; }
.ledger-table th, .ledger-table td { padding: 10px 7px; border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; overflow-wrap: anywhere; }
.ledger-table th { background: var(--surface-soft); font-size: 11px; }
.ledger-table td:nth-child(n+5), .ledger-table th:nth-child(n+5) { text-align: right; font-variant-numeric: tabular-nums; }
.ledger-table td:nth-child(n+7) { font-weight: 700; }
.ledger-table td strong, .ledger-table td small, .ledger-description-text { display: block; }
.ledger-description-text, .ledger-table td small { margin-top: 4px; color: var(--ink-600); }
.ledger-document { display: inline; padding: 0; border: 0; background: transparent; color: var(--brand-700); font: inherit; font-weight: 600; text-align: left; overflow-wrap: anywhere; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.ledger-document:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 3px; }
.ledger-balance-strip { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px; background: var(--surface-soft); font-size: 12px; }
.ledger-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 14px 0; }
.ledger-totals > div { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; }
.ledger-totals strong { font-size: 15px; font-variant-numeric: tabular-nums; }
.ledger-totals [data-ledger-closing] { background: var(--surface-soft); }
.ledger-extra { margin-top: 20px; }
.ledger-extra h3 { margin: 0; font-size: 14px; }
.ledger-cards { display: none; }
/* A ledger lives inside the workspace, so viewport width is not its available
   width. Switch before the four money columns would split an amount. */
@container (max-width: 1350px) {
  .ledger-table-wrap { display: none; }
  .ledger-cards { display: grid; gap: 10px; margin-top: 10px; }
  .ledger-card { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 12px; font-size: 13px; }
  .ledger-card-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; color: var(--ink-600); font-size: 11px; margin-bottom: 8px; }
  .ledger-card p { overflow-wrap: anywhere; }
  .ledger-card dl { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 12px 0; }
  .ledger-card dt { font-size: 11px; color: var(--ink-600); }
  .ledger-card dd { margin: 4px 0 0; font-variant-numeric: tabular-nums; }
  .ledger-card-balance { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; border-top: 1px solid var(--line); padding-top: 10px; font-size: 12px; }
}
@media (max-width: 600px) {
  .ledger-totals { grid-template-columns: minmax(0, 1fr); }
  .ledger-filters .field { flex: 1 1 40%; }
  .ledger-filters input { width: 100%; }
  .supplier-ledger { padding: 12px; }
}
.supplier-workspace-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--space-3) var(--space-5); padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.supplier-workspace-header > div:first-child { min-width: 0; }
.supplier-workspace-header h1 { margin: 2px 0 0; overflow-wrap: anywhere; font-size: clamp(22px, 2vw, 28px); letter-spacing: -.03em; }
.supplier-workspace-header p:not(.eyebrow) { margin: 5px 0 0; color: var(--ink-600); font-size: 13px; }
.supplier-workspace-header .toolbar-actions { justify-content: flex-end; }
.supplier-workspace-header .summary-strip { grid-column: 1 / -1; width: 100%; margin: var(--space-1) 0 0; box-shadow: none; }
.supplier-workspace-header .summary-item.sum-unpaid { color: var(--danger-700); background: color-mix(in srgb, var(--danger-100) 35%, var(--surface)); }
.supplier-workspace-header .summary-item.sum-unpaid strong { color: inherit; }
.supplier-core-sections { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
.supplier-document-section { min-width: 0; padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.supplier-section-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.supplier-section-heading h2, .supplier-supporting-sections > h2 { margin: 0; font-size: 16px; }
.supplier-section-heading .chip { flex: 0 0 auto; }
.supplier-document-section .summary-strip { margin-bottom: var(--space-3); box-shadow: none; }
.supplier-document-section .summary-item { padding: 9px 11px; }
.supplier-supporting-sections { display: grid; gap: var(--space-2); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-soft); }
.supplier-supporting-sections > h2 { margin-bottom: var(--space-1); }
.supplier-supporting-section { overflow: clip; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.supplier-supporting-section > summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 10px 12px; color: var(--ink-800); cursor: pointer; font-size: 13px; font-weight: 700; list-style: none; }
.supplier-supporting-section > summary::-webkit-details-marker { display: none; }
.supplier-supporting-section > summary::after { content: '⌄'; color: var(--ink-600); font-size: 16px; transition: transform var(--motion-fast); }
.supplier-supporting-section[open] > summary { border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.supplier-supporting-section[open] > summary::after { transform: rotate(180deg); }
.supplier-supporting-section > .supplier-document-section { border: 0; border-radius: 0; box-shadow: none; }
.supplier-section-error { min-height: 120px; margin: 0; padding: var(--space-4); }
.matching-workspace { min-width: 0; }
.matching-header { position: sticky; top: var(--topbar-height); z-index: 5; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 0; background: var(--surface); border-bottom: 1px solid var(--line); }
.matching-header h1 { min-width: 0; margin: 0; overflow-wrap: anywhere; font-size: 20px; }
.matching-header p { margin: 4px 0; font-size: 12px; }
.matching-columns { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; }
.matching-column { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); overflow: hidden; }
.matching-column-heading, .matching-draft-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px; background: var(--surface-soft); }
.matching-column-heading h2, .matching-draft h2 { margin: 0; font-size: 15px; }
.matching-column-heading .collection-search { min-width: 0; max-width: 65%; }
.matching-column-heading input { min-width: 0; width: 100%; }
.matching-list { max-height: 52dvh; overflow: auto; overscroll-behavior: contain; }
.matching-card { position: relative; border-bottom: 1px solid var(--line); font-size: 13px; }
.matching-card-select { display: grid; grid-template-columns: minmax(0,1fr) minmax(100px,auto); gap: 8px; width: 100%; padding: 12px 54px 12px 12px; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; font: inherit; }
.matching-card:hover { background: var(--surface-soft); }
.matching-card.is-active { background: var(--brand-100); box-shadow: inset 3px 0 var(--brand-600); }
.matching-card.is-assigned { cursor: default; opacity: .68; background: var(--surface-soft); }
.matching-card-select:focus-visible { outline: 2px solid var(--brand-600); outline-offset: -2px; }
.matching-card-select > div { min-width: 0; }
.matching-card-select > div > strong, .matching-card-select > div > span { overflow-wrap: anywhere; }
.matching-card-select > div > span { display: block; font-size: 11px; color: var(--ink-600); margin-top: 3px; }
.matching-card-open { position: absolute; top: 10px; right: 12px; min-width: 32px; min-height: 32px; border: 1px solid var(--line); border-radius: 6px; color: var(--brand-700); background: var(--surface); cursor: pointer; }
.matching-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; }
.matching-empty { padding: 12px; }
.matching-supplier-picker { width: min(100%, 640px); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }
.matching-supplier-picker .field-label { display: block; margin-bottom: var(--space-2); color: var(--ink-800); font-weight: 700; }
.matching-supplier-picker input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); }
.matching-supplier-picker .muted { margin: 8px 0 0; font-size: 12px; }
.matching-supplier-results { display: grid; gap: 6px; max-height: min(46dvh, 380px); margin: var(--space-3) 0 0; padding: 0; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
.matching-supplier-result { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px var(--space-3); width: 100%; min-height: 56px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink-900); background: var(--surface); text-align: left; cursor: pointer; }
.matching-supplier-result:hover { border-color: var(--brand-400); background: var(--brand-50); }
.matching-supplier-result > span:first-child { min-width: 0; overflow-wrap: anywhere; font-weight: 700; }
.matching-supplier-result small { grid-column: 1; color: var(--ink-600); font-size: 12px; }
.matching-supplier-result > span:last-child { grid-column: 2; grid-row: 1 / span 2; color: var(--brand-700); font-size: 18px; }
.matching-supplier-empty { padding: var(--space-3); border: 1px dashed var(--line-strong); border-radius: 9px; text-align: center; }
.matching-selection { display: grid; grid-template-columns: minmax(170px, .7fr) minmax(300px, 1.5fr) auto; align-items: center; gap: 16px; padding: 14px; border: 1px solid var(--brand-300); border-radius: var(--radius-md); background: var(--brand-50); }
.matching-selection h2 { margin: 3px 0 0; font-size: 16px; }
.reconciliation-totals { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 12px; color: var(--ink-600); }
.reconciliation-totals b { display: block; margin-top: 2px; color: var(--ink-900); font-size: 14px; }
.matching-draft, .matching-proposals { border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); overflow: hidden; }
.matching-draft > .muted, .matching-proposals > .muted { padding: 0 12px 12px; }
.reconciliation-group { display: grid; gap: 12px; padding: 14px; border-top: 1px solid var(--line); }
.reconciliation-group-head { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.reconciliation-group-head h3 { margin: 3px 0 0; font-size: 15px; }
.reconciliation-group-members { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.reconciliation-group-members div { min-width: 0; padding: 10px; border-radius: var(--radius-sm); background: var(--surface-soft); }
.reconciliation-group-members strong, .reconciliation-group-members span { display: block; overflow-wrap: anywhere; }
.reconciliation-group-members strong { margin-bottom: 4px; color: var(--ink-600); font-size: 11px; text-transform: uppercase; letter-spacing: .03em; }
.reconciliation-group-members span { font-size: 13px; }
.reconciliation-group > .toolbar-actions { justify-content: flex-end; }
.matching-proposal { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 12px; border-top: 1px solid var(--line); }
.matching-proposal > div { min-width: 0; }
.matching-proposal strong, .matching-proposal span { display: block; overflow-wrap: anywhere; }
.matching-proposal span { margin-top: 3px; color: var(--ink-600); font-size: 12px; }
.matching-proposal.is-unavailable { opacity: .65; }
.matching-legacy { padding: 12px 14px; border: 1px dashed var(--line-strong); border-radius: var(--radius-md); }
.matching-legacy summary { cursor: pointer; font-weight: 700; }
.matching-legacy p { margin-bottom: 0; }
.matching-conflict { padding: 12px; border: 1px solid var(--warning-600, #b9770e); border-radius: 8px; background: #fff9ed; }
.matching-message { white-space: normal; }
@media (max-width: 1050px) {
  .matching-selection { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .matching-selection .toolbar-actions { justify-content: flex-start; }
}
.management-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.management-link { min-width: 0; display: flex; align-items: center; gap: var(--space-3); padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); color: var(--ink-900); text-decoration: none; }
.management-link:hover { border-color: var(--line-strong); background: #fafbfc; }
.management-link:focus-visible { outline: 0; border-color: var(--brand-600); box-shadow: 0 0 0 3px var(--brand-100); }
.management-icon { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; border-radius: 9px; color: var(--accent-700); background: var(--surface-soft); font-size: 15px; }
.management-body { min-width: 0; flex: 1; display: grid; gap: 2px; }
.management-body strong { font-weight: 600; }
.management-body small { color: var(--ink-600); overflow-wrap: anywhere; }
.management-arrow { flex: 0 0 auto; color: var(--ink-500); }
.surface-menu .nav-label { margin: 8px 12px 2px; }
