/* All viewport adaptation lives here. Components remain breakpoint-agnostic. */
@media (min-width: 768px) {
  #main-content { padding: 16px 24px 32px; }
  .topbar { padding: 8px 24px; }
  .topbar::after { display: none; }
  .record-workspace { gap: 8px; }
  .record-workspace > .filter-bar { padding: 0; border: 0; box-shadow: none; background: transparent; gap: 8px; }
  .record-workspace .field { min-width: 0; max-width: 250px; }
  .record-workspace .field > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .record-workspace .field select, .record-workspace .supplier-picker-trigger { min-height: 36px; padding: 7px; }
  .record-workspace .collection-search input { min-width: 120px; width: 160px; }
  .record-workspace .button { min-height: 36px; padding: 7px 10px; border-radius: 7px; }
  .record-workspace .collection-search { min-height: 36px; }
  .record-mobile-import { display: none; }
  .data-table td { padding: 6px 10px; height: 44px; font-size: 14px; }
  .row-actions .icon-button { width: 30px; min-height: 32px; flex-basis: 30px; font-size: 15px; }
  .data-table td.actions { min-width: 72px; }
}
@media (min-width: 1200px) {
  .priority-desktop { display: table-cell; }
}

@media (min-width: 1800px) {
  .supplier-core-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .supplier-core-sections > [data-supplier-section="delivery-notes"] { grid-column: 1 / -1; }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .data-table { --table-columns: var(--table-columns-tablet, 6); }
  .collection-table-layout .data-table thead th.priority-desktop,
  .collection-table-layout .data-table tbody td.priority-desktop { display: none; }
  .app-shell { grid-template-columns: var(--sidebar-rail) minmax(0, 1fr); }
  .brand-row { padding-inline: 12px; justify-content: center; }
  .brand { flex: 0 0 auto; }
  .brand-copy, .sidebar-toggle, .side-nav .nav-text, .side-nav .nav-label, .side-nav .nav-chevron, .sidebar-footer > span:last-child { display: none; }
  .side-nav { padding-inline: 10px; }
  .side-nav a { min-height: 44px; justify-content: center; padding-inline: 0; }
  .priority-desktop { display: none; }
  .kpi-primary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-doc-counts { grid-template-columns: 1fr; }
  .dashboard-doc-counts .panel-head { padding: var(--space-4) var(--space-4) 0; }
  .dashboard-doc-counts a { padding-inline: var(--space-4); }
  .chart-box { height: 280px; }
  .toast-region { left: calc(var(--sidebar-rail) + var(--space-4) + var(--safe-left)); }
}

@media (min-width: 768px) and (max-width: 899px) {
  .data-table { --table-columns: var(--table-columns-compact, var(--table-columns-tablet, 6)); }
  .priority-compact { display: none; }
  .collection-table-layout .data-table thead th.priority-compact,
  .collection-table-layout .data-table tbody td.priority-compact { display: none; }
  .data-table td.actions .row-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .surface-panel[data-surface-variant="intake-review"] { width: min(920px, calc(100vw - 40px)); }
}
@media (min-width: 1024px) {
  /* Wide review workspace: the PDF and the form scroll independently instead
     of sharing one long page. */
  .surface-panel[data-surface-variant="intake-review"] .surface-body { min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
  .surface-panel[data-surface-variant="intake-review"] .intake-review-grid { min-height: 0; flex: 1 1 0; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); align-items: stretch; overflow: hidden; }
  .intake-review-preview { height: auto; min-height: 0; }
  .intake-review-form { min-height: 0; overflow-y: auto; }
}

@media (max-width: 767px) {
  html, body { overscroll-behavior-x: none; }
  .app-shell { display: block; min-height: 100dvh; }
  .app-sidebar { display: none; }
  .workspace { min-height: 100dvh; }
  .topbar { min-height: calc(64px + var(--safe-top)); padding: calc(8px + var(--safe-top)) calc(12px + var(--safe-right)) 8px calc(16px + var(--safe-left)); }
  .route-heading p { display: none; }
  .route-back { min-height: 28px; margin-bottom: 1px; font-size: 12px; }
  .route-heading h1 { font-size: 21px; }
  .topbar-records .route-heading { flex: 1; }
  .topbar-records .route-back span { display: none; }
  .desktop-search, .topbar-import { display: none; }
  .mobile-search-button { display: inline-flex; }
  #main-content { padding: 14px calc(12px + var(--safe-right)) calc(var(--bottom-nav-height) + 28px + var(--safe-bottom)) calc(12px + var(--safe-left)); }
  .bottom-nav { position: fixed; inset: auto 0 0; z-index: var(--z-nav); min-height: calc(var(--bottom-nav-height) + var(--safe-bottom)); display: grid; grid-template-columns: repeat(4, 1fr); padding: 4px var(--safe-right) var(--safe-bottom) var(--safe-left); border-top: 1px solid var(--line-strong); background: color-mix(in srgb, var(--surface) 95%, transparent); backdrop-filter: blur(18px); box-shadow: 0 -8px 28px rgba(23,32,51,.08); }
  .bottom-nav a, .bottom-nav button { min-width: 0; min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 3px; border-radius: 9px; color: var(--ink-600); background: transparent; font-size: 10px; font-weight: 600; cursor: pointer; }
  .bottom-nav a > span:first-child, .bottom-nav button > span:first-child { font-size: 19px; line-height: 1; }
  .bottom-nav a.active { color: var(--accent-700); background: var(--accent-100); box-shadow: inset 0 3px 0 var(--accent-600); }
  .view-stack { gap: var(--space-4); }
  .view-intro, .collection-toolbar { align-items: flex-start; }
  .view-intro { display: grid; }
  .collection-toolbar { flex-wrap: wrap; }
  .toolbar-actions { width: 100%; }
  .toolbar-actions .button { flex: 1 1 auto; }
  .collection-search { width: 100%; }
  .collection-search input { min-width: 0; width: 100%; }
  .record-lookup, .record-lookup .field { width: 100%; max-width: none; }
  .record-workspace > .collection-toolbar > .toolbar-actions { width: 100%; margin-left: 0; }
  .record-workspace > .filter-bar { display: flex; flex-wrap: nowrap; gap: var(--space-2); overflow-x: auto; padding: 0 0 6px; border: 0; background: transparent; box-shadow: none; }
  .record-workspace > .filter-bar .toolbar-actions { flex: 0 0 auto; flex-wrap: nowrap; }
  .record-workspace > .filter-bar .button { flex: 0 0 auto; white-space: nowrap; }
  .filter-bar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: var(--space-3); }
  .field { min-width: 0; }
  input, select, textarea, .supplier-picker-trigger { font-size: 16px; }
  .field-grow { grid-column: 1 / -1; }
  .table-scroll { display: none; }
  .priority-tablet, .priority-desktop { display: none; }
  .kpi-primary-grid { grid-template-columns: 1fr; }
  .kpi-card { padding: var(--space-4); gap: 12px; }
  .kpi-icon { width: 36px; height: 36px; font-size: 15px; }
  .kpi-value { font-size: clamp(17px, 5vw, 20px); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .panel { padding: var(--space-4); }
  .trend-chart { aspect-ratio: 5 / 4; min-height: 220px; gap: 3px; }
  .trend-group:nth-child(-n+4) { display: none; }
  .surface-layer { align-items: end; }
  .surface-panel { width: 100%; height: min(88dvh, 760px); max-height: calc(100dvh - var(--safe-top)); align-self: end; justify-self: stretch; border-radius: 22px 22px 0 0; animation-name: sheet-up; }
  .surface-panel[data-surface-kind="modal"] { width: min(560px, calc(100vw - 32px)); height: auto; max-height: min(720px, calc(100dvh - 32px)); align-self: center; justify-self: center; border-radius: var(--radius-xl); animation-name: surface-pop; }
  .surface-panel[data-surface-kind="fullscreen"] { height: 100dvh; max-height: none; border-radius: 0; padding-top: var(--safe-top); }
  .surface-panel[data-surface-variant="pdf"] { width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .surface-panel[data-surface-variant="summary"] { width: 100%; height: min(88dvh, 760px); max-height: calc(100dvh - var(--safe-top)); border-radius: 22px 22px 0 0; }
  .surface-panel[data-surface-variant="intake-review"] { width: 100%; height: min(92dvh, 860px); max-height: calc(100dvh - var(--safe-top)); border-radius: 22px 22px 0 0; }
  .surface-head { padding-inline: calc(var(--space-4) + var(--safe-right)) calc(var(--space-4) + var(--safe-left)); }
  .surface-body { padding: var(--space-4) calc(var(--space-4) + var(--safe-right)) var(--space-4) calc(var(--space-4) + var(--safe-left)); }
  .surface-foot { padding-inline: calc(var(--space-4) + var(--safe-right)) calc(var(--space-4) + var(--safe-left)); }
  @keyframes sheet-up { from { transform: translateY(100%); } }
  .detail-list { grid-template-columns: 1fr; }
  .detail-list dt { padding: 11px 0 0; border-bottom: 0; }
  .detail-list dd { padding-top: 3px; }
  .surface-panel[data-surface-variant="summary"] .surface-body { padding: var(--space-3) calc(var(--space-4) + var(--safe-right)) var(--space-4) calc(var(--space-4) + var(--safe-left)); }
  .document-tabs { margin-bottom: var(--space-3); }
  .document-tabs .button { min-height: 44px; padding-inline: 12px; }
  .document-summary-grid { grid-template-columns: 1fr; gap: var(--space-4); }
  .document-thumbnail, .document-thumbnail img { min-height: 190px; }
  .document-thumbnail { max-height: 36dvh; }
  .document-essentials { padding: 0; }
  .document-essentials h3 { font-size: 19px; }
  .document-amounts { margin: var(--space-3) 0; }
  .document-amounts > div { padding: 10px; }
  .document-essentials > .button { min-height: 44px; padding-inline: 12px; }
  .summary-relationships { margin-top: var(--space-4); }
  .supplier-workspace-header { grid-template-columns: 1fr; padding: var(--space-4); gap: var(--space-3); }
  .supplier-workspace-header .toolbar-actions { width: 100%; justify-content: stretch; }
  .supplier-workspace-header .toolbar-actions .button { flex: 1 1 auto; }
  .supplier-document-section, .supplier-supporting-sections { padding: var(--space-3); }
  .supplier-section-heading h2, .supplier-supporting-sections > h2 { font-size: 15px; }
  .bulk-bar { bottom: calc(var(--bottom-nav-height) + var(--safe-bottom) + 8px); flex-wrap: wrap; }
  .bulk-actions { width: 100%; }
  .bulk-actions .button { flex: 1; }
  .toast-region { top: calc(var(--topbar-height) + var(--space-3)); left: calc(var(--space-3) + var(--safe-left)); right: auto; justify-items: start; }
  .upload-hero { min-height: 230px; padding: var(--space-6) var(--space-4); }
  .import-batch-grid, .proposal-fields, .intake-doc-row, .intake-review-grid { grid-template-columns: 1fr; }
  .intake-comparison-head { display: none; }
  .intake-comparison-row, .intake-comparison-identity { grid-template-columns: 34px minmax(0, 1fr); }
  .intake-comparison-values, .intake-comparison-status, .intake-comparison-row .intake-actions { grid-column: 1 / -1; }
  .intake-comparison-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .import-batch-grid .pdf-frame { min-height: 42dvh; }
  .intake-file-card { padding: var(--space-4); }
  .intake-file-head { display: grid; }
  .intake-file-head .toolbar-actions { width: 100%; }
  .intake-doc-preview { height: 42dvh; min-height: 300px; }
  .intake-doc-controls { grid-template-columns: 1fr 1fr; }
  .intake-type-field { grid-column: 1 / -1; }
  .intake-review-grid { min-height: auto; }
  .intake-review-preview { min-height: 0; height: auto; }
  .intake-review-preview .pdf-frame { min-height: 42dvh; height: 42dvh; flex: 0 0 42dvh; }
  .upload-actions { display: grid; grid-template-columns: 1fr; }
  .review-grid { grid-template-columns: 1fr; }
  .admin-grid { grid-template-columns: 1fr; }
  .management-grid { grid-template-columns: 1fr; }
  .pdf-frame { border-radius: 0; border-inline: 0; }
}

@media (max-width: 359px) {
  .filter-bar { grid-template-columns: 1fr; }
  .field-grow { grid-column: auto; }
  .card-primary-amount { font-size: 18px; }
  .card-top, .card-amounts { gap: var(--space-2); }
}

@media (orientation: landscape) and (max-height: 520px) and (max-width: 950px) {
  .topbar { position: relative; }
  .surface-panel { height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .surface-panel[data-surface-kind="modal"] { width: min(560px, calc(100vw - 32px)); height: auto; max-height: calc(100dvh - 24px); border-radius: var(--radius-xl); }
  .surface-panel.pdf-document-surface { width: calc(100vw - 24px); height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); }
  .camera-actions, .surface-foot { position: sticky; bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (max-width: 767px) {
  .matching-columns { grid-template-columns: minmax(0, 1fr); }
  .matching-header { position: static; flex-wrap: wrap; }
  .matching-header .toolbar-actions { width: 100%; }
  .matching-list { max-height: 36dvh; }
  .matching-card-open { min-height: 44px; }
  .matching-card-open { min-width: 44px; }
  .matching-workspace { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .matching-selection { grid-template-columns: minmax(0, 1fr); }
  .matching-selection .toolbar-actions { width: 100%; }
  .reconciliation-group-members { grid-template-columns: minmax(0, 1fr); }
  .matching-proposal { align-items: stretch; flex-direction: column; }
}