:root {
  color-scheme: light;
  --nav: #1a2c4e;
  --nav-raised: #243b64;
  --ink: #1e2630;
  --ink-soft: #526076;
  --muted: #6f7b8e;
  --line: #d7dee7;
  --line-strong: #bdc9d8;
  --surface: #ffffff;
  --surface-soft: #f5f7fa;
  --canvas: #edf1f5;
  --accent: #1a2c4e;
  --accent-strong: #122441;
  --accent-soft: #edf2f8;
  --highlight: #f5b819;
  --highlight-ink: #765a00;
  --copper: #a67500;
  --copper-soft: #fff4cf;
  --danger: #a83e36;
  --danger-soft: #fae9e7;
  --shadow-sm: 0 1px 2px rgba(26, 44, 78, .05), 0 6px 18px rgba(26, 44, 78, .055);
  --shadow-md: 0 18px 50px rgba(26, 44, 78, .13);
  --radius-sm: 7px;
  --radius: 11px;
  --radius-lg: 16px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  font-synthesis: none;
  color: var(--ink);
  background: var(--canvas);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { min-width: 320px; margin: 0; overflow-x: hidden; background: var(--canvas); }
button, input, select, textarea { font: inherit; }
button, a, summary, input, select, textarea { -webkit-tap-highlight-color: rgba(245, 184, 25, .22); touch-action: manipulation; }
a, button, summary { transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(245, 184, 25, .62); outline-offset: 2px; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2 { text-wrap: balance; }
p { text-wrap: pretty; }
code, .numeric, .workspace-stats dd, .metric-grid strong, .catalog-count strong { font-variant-numeric: tabular-nums; }
[hidden] { display: none !important; }

.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 14px; border-radius: var(--radius-sm); background: var(--surface); color: var(--nav); font-weight: 750; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

.topbar { position: sticky; z-index: 30; top: 0; min-height: 72px; padding: 0 max(24px, calc((100vw - 1440px) / 2)); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 34px; border-top: 3px solid var(--highlight); border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .97); color: var(--nav); box-shadow: 0 8px 24px rgba(26, 44, 78, .08); backdrop-filter: blur(14px); }
.brand { min-width: 0; display: flex; align-items: center; gap: 11px; color: var(--nav); text-decoration: none; font-size: 13px; font-weight: 760; letter-spacing: .01em; line-height: 1.05; }
.brand:hover { color: var(--nav-raised); }
.brand-logo { width: 83px; height: 54px; display: grid; place-items: center; overflow: hidden; background: #fff; }
.brand-logo img { width: 100%; height: 100%; display: block; object-fit: contain; }
.brand-copy { display: grid; gap: 3px; }
.brand-copy strong { color: var(--nav); font-size: 12px; }
.brand-copy small { color: var(--muted); font-size: 9px; font-weight: 720; letter-spacing: .12em; text-transform: uppercase; }
.topbar nav { min-width: 0; display: flex; align-self: stretch; gap: 4px; }
.topbar nav a { position: relative; display: flex; align-items: center; padding: 0 14px; color: #667287; font-size: 13px; font-weight: 680; text-decoration: none; }
.topbar nav a:hover { color: var(--nav); background: #f5f7fa; }
.topbar nav a[aria-current="page"] { color: var(--nav); }
.topbar nav a[aria-current="page"]::after { position: absolute; right: 14px; bottom: 0; left: 14px; height: 3px; border-radius: 4px 4px 0 0; background: var(--highlight); content: ""; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.mode { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .1em; white-space: nowrap; }
.mode i { width: 7px; height: 7px; border-radius: 50%; background: var(--highlight); box-shadow: 0 0 0 4px rgba(245, 184, 25, .14); }
.language-switcher { position: relative; }
.language-switcher summary { min-width: 42px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); color: var(--nav); cursor: pointer; font-size: 11px; font-weight: 800; text-align: center; list-style: none; }
.language-switcher summary::-webkit-details-marker { display: none; }
.language-switcher[open] summary { border-color: var(--nav); background: var(--accent-soft); }
.language-switcher > div { position: absolute; z-index: 40; top: calc(100% + 9px); right: 0; min-width: 156px; display: grid; gap: 2px; padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-md); }
.language-switcher a { padding: 9px 10px; border-radius: 6px; color: var(--ink); font-size: 12px; text-decoration: none; }
.language-switcher a:hover, .language-switcher a[aria-current="true"] { background: var(--accent-soft); color: var(--accent-strong); }
[dir="rtl"] .language-switcher > div { right: auto; left: 0; }
.role-indicator { min-height: 34px; display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #f7f9fc; color: var(--nav); font-size: 10px; font-weight: 730; text-decoration: none; white-space: nowrap; }
.role-indicator:hover { border-color: var(--nav); background: var(--nav); color: #fff; }

.container { width: min(1440px, calc(100vw - 48px)); min-width: 0; margin: 28px auto 72px; animation: page-in 280ms ease both; }
.hero, .workspace-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; margin-bottom: 24px; }
.hero.compact { align-items: center; }
.hero h1, .workspace-title h1 { max-width: 980px; margin: 5px 0 10px; color: var(--nav); font-size: clamp(32px, 4vw, 52px); line-height: .98; letter-spacing: -.045em; }
.hero p, .workspace-title > p:last-child { max-width: 780px; margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.55; }
.eyebrow { margin: 0; color: var(--accent) !important; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.panel { min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.panel h2 { margin: 0 0 18px; color: var(--nav); font-size: 19px; }
.grid { min-width: 0; display: grid; grid-template-columns: minmax(280px, 360px) minmax(0, 1fr); gap: 18px; align-items: start; }
.panel-wide { min-width: 0; }

label { min-width: 0; display: grid; gap: 7px; color: #30434e; font-size: 12px; font-weight: 680; }
input, select, textarea { width: 100%; min-width: 0; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background-color: var(--surface); color: var(--ink); }
input, select { min-height: 42px; padding: 9px 11px; }
textarea { min-height: 92px; padding: 10px 11px; resize: vertical; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: #89979e; }
input:hover, select:hover, textarea:hover { border-color: #8fa0a7; }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(13, 118, 108, .09); }
button, .button-link { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--accent); border-radius: var(--radius-sm); padding: 9px 15px; background: var(--accent); color: white; font-size: 12px; font-weight: 760; text-decoration: none; cursor: pointer; box-shadow: inset 0 -3px var(--highlight); }
button:hover, .button-link:hover { border-color: var(--accent-strong); background: var(--accent-strong); transform: translateY(-1px); box-shadow: 0 7px 16px rgba(13, 118, 108, .16); }
button:active, .button-link:active { transform: translateY(0); }
button.secondary, .button-link.secondary { border-color: var(--line-strong); background: var(--surface); color: var(--ink-soft); }
button.secondary:hover, .button-link.secondary:hover { border-color: #82959d; background: var(--surface-soft); color: var(--ink); box-shadow: none; }
.form-stack { display: grid; gap: 15px; }
.note, .empty, .hint { color: var(--muted); font-size: 11px; line-height: 1.55; }
.hint { margin: -10px 0 0; }
.error { margin-bottom: 16px; padding: 12px 14px; border: 1px solid #efc9c5; border-radius: var(--radius-sm); background: var(--danger-soft); color: var(--danger); font-size: 12px; line-height: 1.5; }
.back, .text-link { color: var(--accent-strong); font-size: 12px; font-weight: 720; text-decoration: none; }
.back { display: inline-block; margin-bottom: 20px; }
.back:hover, .text-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.status, .count-pill, .family-tag, .version-tag { display: inline-flex; width: fit-content; align-items: center; border-radius: 999px; white-space: nowrap; }
.status { padding: 5px 9px; background: var(--accent-soft); color: var(--accent-strong) !important; font-size: 10px; font-weight: 750; }
.count-pill { min-width: 26px; justify-content: center; padding: 5px 8px; background: #e7edef; color: var(--ink-soft); font-size: 11px; }

/* Supplier register — dense procurement workbench */
.vendor-hero { min-height: 112px; align-items: center; }
.workspace-stats { flex: none; display: grid; grid-template-columns: repeat(3, minmax(112px, 1fr)); margin: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: rgba(255, 255, 255, .72); box-shadow: var(--shadow-sm); }
.workspace-stats div { min-width: 0; padding: 14px 16px; border-right: 1px solid var(--line); }
.workspace-stats div:last-child { border-right: 0; }
.workspace-stats dt { max-width: 145px; color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.workspace-stats dd { margin: 3px 0 0; color: var(--nav); font-size: 25px; font-weight: 780; letter-spacing: -.035em; }
.vendor-filterbar { position: sticky; z-index: 20; top: 68px; margin: 0 0 14px; padding: 12px; border: 1px solid rgba(189, 201, 206, .9); border-radius: var(--radius); background: rgba(248, 250, 250, .95); box-shadow: 0 10px 28px rgba(13, 27, 36, .08); backdrop-filter: blur(14px); }
.vendor-search-form { display: grid; grid-template-columns: minmax(250px, 1.4fr) minmax(220px, 1fr) minmax(170px, .65fr) auto auto; gap: 9px; align-items: end; }
.vendor-search-form label > span { color: var(--muted); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.vendor-search-form input, .vendor-search-form select, .vendor-search-form button, .vendor-search-form .button-link { min-height: 40px; }
.vendor-workbench { min-width: 0; display: grid; grid-template-columns: minmax(245px, 285px) minmax(0, 1fr); gap: 14px; align-items: start; }
.group-rail { position: sticky; top: 149px; max-height: calc(100vh - 355px); min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #304569; border-radius: var(--radius); background: var(--nav); box-shadow: var(--shadow-sm); }
.rail-heading { flex: none; padding: 14px; border-bottom: 1px solid #3c4f72; background: var(--nav); }
.rail-heading > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.rail-heading > div span { color: #c0cada; font-size: 11px; font-weight: 760; }
.rail-heading > div strong { color: var(--highlight); font-size: 18px; }
.rail-search input { min-height: 36px; padding: 7px 9px; border-color: #4a5c7d; background: #22385f; color: #fff; font-size: 11px; }
.rail-search input::placeholder { color: #aebad0; }
.group-list { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: #657696 #1a2c4e; }
.group-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid #34496f; color: #d1d9e6; text-decoration: none; }
.group-row:last-child { border-bottom: 0; }
.group-row:hover { background: #22385f; }
.group-row.is-selected { background: #243b64; box-shadow: inset 4px 0 0 var(--highlight); color: #fff; }
.group-row > span { min-width: 0; font-size: 11px; font-weight: 650; line-height: 1.3; overflow-wrap: anywhere; }
.group-row small { display: block; margin-top: 4px; color: #99a8c0; font-size: 9px; font-weight: 560; }
.group-row > strong { min-width: 28px; padding: 4px 6px; border-radius: 6px; background: #30496f; color: var(--highlight); font-size: 10px; text-align: center; font-variant-numeric: tabular-nums; }
.group-row.is-selected > strong { background: var(--highlight); color: var(--nav); }
.vendor-register { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.register-heading { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 18px; border-bottom: 1px solid var(--line); }
.register-heading h2 { max-width: 760px; margin: 3px 0 0; color: var(--nav); font-size: 19px; line-height: 1.2; }
.result-count { flex: none; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.result-count strong { margin-right: 3px; color: var(--nav); font-size: 17px; }
.vendor-table-shell { min-width: 0; overflow-x: auto; }
.vendor-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.vendor-table th { padding: 10px 13px; border-bottom: 1px solid var(--line); background: #f7f9f9; color: var(--muted); font-size: 9px; font-weight: 780; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.vendor-table th:nth-child(1) { width: 31%; }
.vendor-table th:nth-child(2) { width: 11%; }
.vendor-table th:nth-child(3) { width: 10%; }
.vendor-table th:nth-child(4) { width: 22%; }
.vendor-table th:nth-child(5) { width: 21%; }
.vendor-table th:nth-child(6) { width: 5%; }
.vendor-table td { min-width: 0; padding: 12px 13px; border-bottom: 1px solid #e9eeef; vertical-align: middle; color: var(--ink-soft); font-size: 11px; overflow-wrap: anywhere; }
.vendor-table tbody tr { transition: background-color 150ms ease, box-shadow 150ms ease; }
.vendor-table tbody tr:hover { background: #f5faf9; box-shadow: inset 3px 0 0 #54a89e; }
.vendor-table tbody tr:last-child td { border-bottom: 0; }
.vendor-table td > small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.vendor-name-link { min-width: 0; display: grid; gap: 3px; color: var(--ink); text-decoration: none; }
.vendor-name-link strong { min-width: 0; font-size: 12px; line-height: 1.32; overflow-wrap: anywhere; }
.vendor-name-link span { color: var(--muted); font-size: 10px; line-height: 1.3; }
.vendor-name-link:hover strong { color: var(--accent-strong); }
.vendor-origin { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 5px; color: var(--muted); font-size: 9px; }
.vendor-origin b { padding: 3px 6px; border-radius: 5px; background: var(--copper-soft); color: #87502a; font-size: 8px; letter-spacing: .04em; text-transform: uppercase; }
.dealer-value { display: inline-flex; max-width: 100%; padding: 4px 7px; border-radius: 6px; background: #e8f3f1; color: var(--accent-strong); font-size: 10px; font-weight: 700; overflow-wrap: anywhere; }
.dealer-value.is-muted { background: #eef2f3; color: var(--muted); font-weight: 560; }
.vendor-adnoc-status { display: inline-flex; max-width: 100%; padding: 4px 7px; border-radius: 6px; font-size: 9px; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
.vendor-adnoc-status.is-confirmed { background: #dcefeb; color: #17675f; }
.vendor-adnoc-status.is-unknown { background: #eef2f3; color: var(--muted); font-weight: 560; }
.dossier-meter { display: grid; grid-template-columns: minmax(70px, 1fr) auto; gap: 8px; align-items: center; }
.dossier-meter > span, .progress-track, .registry-progress, .mini-progress { height: 6px; overflow: hidden; border-radius: 999px; background: #dfe7e8; }
.dossier-meter b, .progress-track span, .registry-progress span, .mini-progress span { display: block; height: 100%; border-radius: inherit; background: var(--highlight); }
.dossier-meter strong { color: var(--ink); font-size: 10px; }
.row-action { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--accent-strong); font-size: 16px; font-weight: 700; text-decoration: none; }
.row-action:hover { border-color: var(--accent); background: var(--accent); color: white; transform: translateX(2px); }
.pagination { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; padding: 13px 17px; border-top: 1px solid var(--line); background: #f8fafa; }
.pagination a, .pagination span { width: fit-content; color: var(--accent-strong); font-size: 11px; font-weight: 700; text-decoration: none; }
.pagination a:last-child, .pagination span:last-child { justify-self: end; }
.pagination a:hover { text-decoration: underline; text-underline-offset: 3px; }
.pagination span[aria-disabled="true"] { color: #a2adb2; }
.pagination strong { color: var(--ink-soft); font-size: 10px; font-variant-numeric: tabular-nums; }
.empty-state { display: grid; justify-items: start; gap: 14px; padding: 42px 18px; color: var(--ink-soft); }
.supplier-create-panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); overflow: hidden; }
.supplier-create-panel > summary { min-width: 0; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 17px 19px; cursor: pointer; list-style: none; }
.supplier-create-panel > summary::-webkit-details-marker { display: none; }
.supplier-create-panel > summary > span:first-child { min-width: 0; display: grid; gap: 4px; }
.supplier-create-panel > summary small { max-width: 780px; color: var(--muted); font-size: 10px; font-weight: 500; }
.supplier-create-panel[open] > summary { border-bottom: 1px solid var(--line); background: #f7f9f9; }
.supplier-create-panel > form, .supplier-create-panel > .error { max-width: 820px; margin: 20px; }
.vendor-create-bottom { margin-top: 14px; }

/* Shared forms, cards & dossier */
.category-picker { min-width: 0; margin: 0; padding: 0; border: 0; }
.category-picker legend { margin-bottom: 7px; color: #30434e; font-size: 12px; font-weight: 680; }
.category-picker .second-legend { margin-top: 17px; }
.category-dropdown { position: relative; min-width: 0; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); }
.category-dropdown > summary { padding: 11px 12px; cursor: pointer; color: var(--ink-soft); font-size: 12px; font-weight: 650; list-style-position: inside; }
.category-dropdown[open] { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(13, 118, 108, .08); }
.category-menu { max-height: 380px; overflow: auto; overscroll-behavior: contain; padding: 5px 11px 13px; border-top: 1px solid var(--line); }
.category-group { padding: 12px 0 5px; border-bottom: 1px solid #edf1f2; }
.category-group:last-child { border-bottom: 0; }
.category-group h3 { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 7px; color: var(--ink-soft); font-size: 10px; letter-spacing: .05em; text-transform: uppercase; }
.checkbox-grid { display: grid; gap: 3px; }
.check-item { min-width: 0; display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; padding: 7px; border-radius: 6px; color: var(--ink-soft); font-weight: 520; }
.check-item:hover { background: var(--surface-soft); }
.check-item input { width: 16px; height: 16px; min-height: auto; margin: 1px 0 0; }
.check-item span { min-width: 0; display: flex; justify-content: space-between; gap: 8px; line-height: 1.35; overflow-wrap: anywhere; }
.check-item small { flex: none; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.new-equipment, .source-choice { display: grid; gap: 11px; padding: 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); }
.new-equipment > strong { font-size: 12px; }
.source-choice > span { color: var(--muted); font-size: 10px; text-align: center; text-transform: uppercase; }
.project-list, .document-list { display: grid; gap: 8px; }
.project-card { min-width: 0; display: grid; gap: 5px; padding: 15px; border: 1px solid var(--line); border-radius: var(--radius); color: inherit; background: var(--surface); text-decoration: none; }
.project-card:hover { border-color: #8fb8b3; background: #f6fbfa; transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.project-card span { min-width: 0; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.project-code { color: var(--accent) !important; font-weight: 750; }
.document-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 16px; align-items: center; padding: 13px 0; border-bottom: 1px solid #e7edef; }
.document-row > div { min-width: 0; display: grid; gap: 4px; }
.document-row strong, .document-row span, .document-row code { overflow-wrap: anywhere; }
.document-row span { color: var(--muted); font-size: 10px; }
.translation-pending { color: #906125 !important; }

.summary-heading, .section-heading { min-width: 0; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.summary-heading > div, .section-heading > div { min-width: 0; }
.summary-heading h2, .section-heading h2 { margin: 3px 0 0; }
.section-heading { margin-bottom: 15px; }
.section-heading > p { max-width: 560px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; text-align: right; }
.supplier-hero { min-width: 0; gap: 28px; }
.supplier-hero > div:first-child { min-width: 0; }
.supplier-hero h1 { overflow-wrap: anywhere; }
.completeness-badge, .catalog-count { flex: none; min-width: 126px; display: grid; justify-items: end; }
.completeness-badge strong, .catalog-count strong { color: var(--accent); font-size: 34px; line-height: 1; }
.completeness-badge span, .catalog-count span { margin-top: 5px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.intake-callout { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 18px; border-left: 4px solid var(--accent); }
.intake-callout > div { min-width: 0; }
.intake-callout h2 { margin: 3px 0 5px; }
.intake-callout p:last-child { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.vendor-source-card, .supplier-photo-gallery, .external-qualification-card, .intake-summary, .dossier-summary { margin-bottom: 16px; }
.progress-track { height: 8px; margin: 17px 0; }
.metric-grid, .intake-facts { min-width: 0; display: grid; grid-template-columns: repeat(6, minmax(80px, 1fr)); gap: 8px; }
.metric-grid div, .intake-facts div { min-width: 0; display: grid; gap: 3px; padding: 11px; border: 1px solid #e8edef; border-radius: 8px; background: var(--surface-soft); }
.metric-grid strong { color: var(--nav); font-size: 20px; overflow-wrap: anywhere; }
.metric-grid span, .intake-facts span { color: var(--muted); font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }
.intake-facts strong { font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
.vendor-source-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vendor-source-metrics div:first-child strong { font-size: 13px; }
.supplier-photo-gallery { position: relative; overflow: hidden; border-top: 3px solid var(--highlight); }
.gallery-summary-heading { align-items: center; }
.gallery-summary-heading h2 { margin-bottom: 0; }
.gallery-count { flex: none; min-width: 74px; display: grid; grid-template-columns: auto auto; align-items: baseline; justify-content: end; gap: 7px; color: var(--nav); }
.gallery-count strong { font-size: 24px; line-height: 1; }
.gallery-count small { color: var(--muted); font-size: 8px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.portfolio-gallery-grid { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin-top: 17px; }
.portfolio-thumb { position: relative; min-width: 0; display: grid; grid-template-rows: auto minmax(52px, auto); overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); color: var(--nav); text-decoration: none; box-shadow: 0 2px 10px rgba(26, 44, 78, .04); }
.portfolio-thumb:hover { border-color: #9baabc; background: #fff; transform: translateY(-2px); box-shadow: 0 12px 24px rgba(26, 44, 78, .12); }
.portfolio-thumb-image { position: relative; aspect-ratio: 4 / 3; display: block; overflow: hidden; background: #dfe5ed; }
.portfolio-thumb-image::after { position: absolute; inset: 0; border: 1px solid rgba(255, 255, 255, .18); content: ""; pointer-events: none; }
.portfolio-thumb-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 260ms ease, filter 260ms ease; }
.portfolio-thumb:hover .portfolio-thumb-image img { transform: scale(1.035); filter: saturate(1.04) contrast(1.02); }
.portfolio-thumb-caption { min-width: 0; display: grid; align-content: center; gap: 4px; padding: 10px 34px 10px 11px; }
.portfolio-thumb-caption strong { font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.portfolio-thumb-caption small { color: var(--muted); font-size: 8px; letter-spacing: .04em; text-transform: uppercase; }
.portfolio-thumb-open { position: absolute; right: 10px; bottom: 11px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--nav); color: #fff; font-size: 9px; }
.gallery-provenance-note { margin: 13px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.portfolio-gallery-empty { min-height: 116px; display: grid; grid-template-columns: 60px minmax(0, 1fr); align-items: center; gap: 17px; margin-top: 16px; padding: 17px 19px; border: 1px dashed #c7d0dc; border-radius: 10px; background: linear-gradient(135deg, #f8fafc, #f3f6f9); }
.portfolio-gallery-empty-frame { position: relative; width: 58px; aspect-ratio: 4 / 3; border: 2px solid #aeb9c8; border-radius: 7px; background: #fff; }
.portfolio-gallery-empty-frame::before { position: absolute; right: 8px; bottom: 8px; left: 8px; height: 20px; background: linear-gradient(145deg, transparent 0 22%, #cdd6e0 23% 48%, transparent 49%), linear-gradient(35deg, #dfe5ec 0 55%, transparent 56%); clip-path: polygon(0 100%, 0 56%, 30% 24%, 51% 54%, 70% 35%, 100% 76%, 100% 100%); content: ""; }
.portfolio-gallery-empty-frame::after { position: absolute; top: 8px; right: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--highlight); content: ""; }
.portfolio-gallery-empty strong { color: var(--nav); font-size: 12px; }
.portfolio-gallery-empty p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.portfolio-lightbox { width: min(1100px, calc(100vw - 40px)); max-width: none; padding: 0; overflow: visible; border: 0; border-radius: 13px; background: #101826; color: #fff; box-shadow: 0 32px 90px rgba(4, 11, 24, .48); }
.portfolio-lightbox::backdrop { background: rgba(7, 14, 26, .82); backdrop-filter: blur(7px); }
.portfolio-lightbox-shell { position: relative; min-width: 0; display: grid; grid-template-columns: 54px minmax(0, 1fr) 54px; align-items: center; padding: 18px 13px 13px; }
.portfolio-lightbox figure { min-width: 0; margin: 0; }
.portfolio-lightbox-image { width: 100%; max-height: min(74vh, 760px); display: grid; place-items: center; overflow: hidden; border-radius: 8px; background: #09101c; }
.portfolio-lightbox-image img { width: 100%; height: 100%; max-height: min(74vh, 760px); display: block; object-fit: contain; }
.portfolio-lightbox figcaption { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 12px 4px 3px; }
.portfolio-lightbox figcaption strong { min-width: 0; font-size: 13px; overflow-wrap: anywhere; }
.portfolio-lightbox figcaption span { flex: none; color: #aebad0; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }
.portfolio-lightbox button { border: 0; background: rgba(255, 255, 255, .08); color: #fff; box-shadow: none; }
.portfolio-lightbox button:hover { background: rgba(255, 255, 255, .16); box-shadow: none; }
.portfolio-lightbox-close { position: absolute; z-index: 2; top: -14px; right: -14px; width: 42px; height: 42px; min-height: 42px; padding: 0; border: 2px solid rgba(255, 255, 255, .28) !important; border-radius: 50%; background: var(--nav) !important; font-size: 23px !important; }
.portfolio-lightbox-nav { width: 40px; height: 62px; min-height: 62px; padding: 0; border-radius: 8px; font-size: 28px; }
.portfolio-lightbox-nav.is-previous { justify-self: start; }
.portfolio-lightbox-nav.is-next { justify-self: end; }
.external-qualification-status { max-width: 52%; padding: 6px 9px; border-radius: 999px; font-size: 9px; font-weight: 750; line-height: 1.3; text-align: right; overflow-wrap: anywhere; }
.external-qualification-status.is-confirmed { background: #dcefeb; color: #17675f; }
.external-qualification-status.is-missing { background: #eef2f3; color: var(--muted); }
.external-qualification-grid { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 16px 0 0; }
.external-qualification-grid div { min-width: 0; padding: 11px; border: 1px solid #e8edef; border-radius: 8px; background: var(--surface-soft); }
.external-qualification-grid .external-qualification-wide { grid-column: 1 / -1; }
.external-qualification-grid dt, .external-evidence > span { color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.external-qualification-grid dd { margin: 4px 0 0; color: var(--nav); font-size: 11px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.external-evidence { min-width: 0; display: grid; gap: 7px; margin-top: 10px; padding: 13px; border-left: 3px solid var(--accent); border-radius: 7px; background: #f5faf9; }
.external-evidence a, .external-evidence strong { width: fit-content; max-width: 100%; color: var(--accent-strong); font-size: 12px; overflow-wrap: anywhere; }
.external-evidence p { margin: 0; color: var(--ink-soft); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.external-qualification-empty { margin-top: 14px; padding: 14px; border: 1px dashed #cbd5d8; border-radius: 8px; background: #f8fafa; }
.external-qualification-empty strong { color: var(--ink-soft); font-size: 12px; }
.external-qualification-empty p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.dossier-checklist { margin: 28px 0; }
.checklist-section { margin-bottom: 9px; padding: 0; overflow: hidden; }
.checklist-section > summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 19px; cursor: pointer; list-style: none; }
.checklist-section > summary::-webkit-details-marker { display: none; }
.checklist-section > summary span:first-child { min-width: 0; display: grid; gap: 3px; }
.checklist-section > summary strong { overflow-wrap: anywhere; }
.checklist-section > summary small { color: var(--muted); font-size: 10px; }
.scope-chip-grid { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 18px 18px; border-top: 1px solid #e8edef; }
.scope-chip { min-width: 0; display: inline-grid; gap: 3px; margin-top: 12px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); color: #30434e; font-size: 10px; overflow-wrap: anywhere; }
.scope-chip small { color: var(--accent); font-size: 8px; font-weight: 700; }

/* Vendor dossier — governed supply scope editor */
.scope-management-panel { margin-bottom: 11px; padding: 0; overflow: hidden; border-top: 3px solid var(--highlight); }
.scope-management-panel > summary { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 17px 19px; cursor: pointer; list-style: none; }
.scope-management-panel > summary::-webkit-details-marker { display: none; }
.scope-management-panel > summary:hover { background: #f8fafc; }
.scope-management-panel[open] > summary { border-bottom: 1px solid var(--line); background: #fbfcfd; }
.scope-management-title { min-width: 0; display: grid; gap: 3px; }
.scope-management-title > strong { color: var(--nav); font-size: 14px; line-height: 1.3; }
.scope-management-title > small { max-width: 760px; color: var(--muted); font-size: 9px; font-weight: 520; line-height: 1.45; }
.scope-management-kicker { color: var(--highlight-ink); font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.scope-management-action { flex: none; min-width: 105px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--nav); font-size: 9px; font-weight: 780; }
.scope-management-close-label { display: none; }
.scope-management-chevron { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--accent-strong); font-size: 15px; line-height: 1; transition: transform 160ms ease; }
.scope-management-panel[open] .scope-management-open-label { display: none; }
.scope-management-panel[open] .scope-management-close-label { display: inline; }
.scope-management-panel[open] .scope-management-chevron { transform: rotate(180deg); }
.scope-management-body { min-width: 0; padding: 19px; }
.scope-management-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0 0 17px; padding: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--line); list-style: none; }
.scope-management-steps li { min-width: 0; display: grid; grid-template-columns: 27px minmax(0, 1fr); gap: 9px; align-items: center; padding: 9px 12px; background: #f5f7fa; color: var(--muted); }
.scope-management-steps li > span { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--ink-soft); font-size: 9px; font-weight: 850; }
.scope-management-steps li > strong { min-width: 0; font-size: 9px; line-height: 1.35; overflow-wrap: anywhere; }
.scope-management-steps li.is-current { background: var(--nav); color: #fff; }
.scope-management-steps li.is-current > span { border-color: var(--highlight); background: var(--highlight); color: var(--nav); }
.scope-management-steps li.is-complete { background: #eef6f4; color: #17675f; }
.scope-management-steps li.is-complete > span { border-color: #90bdb6; color: #17675f; }
.scope-management-notice { margin: 0 0 15px; padding: 10px 12px; border: 1px solid #acd0ca; border-left: 4px solid #34877c; border-radius: 7px; background: #f0f8f6; color: #17675f; font-size: 10px; font-weight: 680; line-height: 1.45; }
.scope-group-form { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.scope-group-form button { min-width: 126px; }
.scope-add-form { min-width: 0; }
.scope-type-heading { min-width: 0; display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 18px 0 12px; }
.scope-type-heading > div { min-width: 0; }
.scope-type-heading h3 { margin: 3px 0 0; color: var(--nav); font-size: 15px; line-height: 1.3; }
.scope-type-group { color: var(--highlight-ink); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.scope-type-search { width: min(330px, 42%); }
.scope-type-search input { min-height: 38px; padding-block: 7px; font-size: 10px; }
.scope-candidate-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.scope-candidate-grid { max-height: 310px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; padding: 6px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); scrollbar-color: #aab5c4 #eef2f6; }
.scope-candidate { min-width: 0; display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; padding: 9px; border: 1px solid transparent; border-radius: 6px; background: #fff; color: var(--ink-soft); cursor: pointer; font-weight: 520; }
.scope-candidate:hover { border-color: var(--line-strong); background: #fbfcfd; }
.scope-candidate:has(input:checked) { border-color: #8b9db8; background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--nav); }
.scope-candidate input { width: 16px; height: 16px; min-height: 0; margin: 1px 0 0; accent-color: var(--nav); }
.scope-candidate > span { min-width: 0; display: grid; gap: 3px; }
.scope-candidate strong { color: #30434e; font-size: 10px; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.scope-candidate small { width: fit-content; color: var(--highlight-ink); font-size: 7px; font-weight: 780; letter-spacing: .04em; text-transform: uppercase; }
.scope-candidate .scope-restore-badge { padding: 2px 5px; border-radius: 4px; background: #e7f3f0; color: #17675f; }
.scope-search-empty, .scope-inline-empty { margin: 8px 0 0; padding: 12px; border: 1px dashed var(--line-strong); border-radius: 7px; background: #fafbfc; color: var(--muted); font-size: 9px; line-height: 1.5; }
.scope-add-actions { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 13px; }
.scope-add-actions p { margin: 0; color: var(--muted); font-size: 9px; font-weight: 680; }
.scope-add-actions button:disabled { border-color: #cbd4dc; background: #e9edf1; color: #7c8a97; cursor: not-allowed; box-shadow: none; transform: none; }
.scope-custom-type { margin-top: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; overflow: hidden; }
.scope-custom-type > summary { padding: 11px 13px; color: var(--nav); cursor: pointer; font-size: 10px; font-weight: 750; list-style-position: inside; }
.scope-custom-type[open] > summary { border-bottom: 1px solid var(--line); background: #f8fafc; }
.scope-custom-type > form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; align-items: end; padding: 13px; }
.scope-custom-type > form > p { grid-column: 1; margin: 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.scope-custom-type > form > button { grid-column: 2; grid-row: 1 / 3; min-width: 168px; }
.scope-step-empty, .scope-empty-state { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: center; }
.scope-step-empty { margin-top: 15px; padding: 13px; border: 1px dashed var(--line-strong); border-radius: 8px; background: #fafbfc; }
.scope-step-empty > span, .scope-empty-state > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; background: var(--nav); color: var(--highlight); font-size: 12px; font-weight: 850; }
.scope-step-empty p, .scope-empty-state p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.scope-step-empty p strong, .scope-empty-state strong { display: block; margin-bottom: 2px; color: var(--nav); font-size: 10px; }
.scope-empty-state { padding: 18px; }
.scope-chip.scope-chip-managed { grid-template-columns: minmax(0, 1fr) auto; gap: 7px; align-items: center; padding: 5px 5px 5px 9px; }
.scope-chip > span { min-width: 0; display: grid; gap: 3px; }
.scope-chip form { display: block; margin: 0; }
.scope-chip-remove { width: 27px; min-width: 27px; height: 27px; min-height: 27px; padding: 0; border-color: transparent; border-radius: 5px; background: transparent; box-shadow: none; color: var(--muted); font-size: 17px; font-weight: 450; line-height: 1; }
.scope-chip-remove:hover { border-color: #e3b8b4; background: var(--danger-soft); box-shadow: none; color: var(--danger); transform: none; }

@media (max-width: 700px) {
  .scope-management-panel > summary { align-items: flex-start; gap: 12px; padding: 15px; }
  .scope-management-title > small { display: none; }
  .scope-management-action { min-width: 24px; }
  .scope-management-open-label, .scope-management-close-label { display: none !important; }
  .scope-management-body { padding: 14px; }
  .scope-group-form { grid-template-columns: 1fr; }
  .scope-group-form button { width: 100%; }
  .scope-type-heading { align-items: stretch; flex-direction: column; gap: 10px; }
  .scope-type-search { width: 100%; }
  .scope-candidate-grid { grid-template-columns: 1fr; max-height: 390px; }
  .scope-add-actions { align-items: stretch; flex-direction: column; }
  .scope-add-actions button { width: 100%; }
  .scope-custom-type > form { grid-template-columns: 1fr; }
  .scope-custom-type > form > p, .scope-custom-type > form > button { grid-column: 1; grid-row: auto; }
  .scope-custom-type > form > button { width: 100%; }
}

/* Supplier intake */
.intake-toolbar { display: flex; justify-content: space-between; gap: 16px; }
.intake-filterbar { position: sticky; z-index: 18; top: 84px; min-width: 0; display: grid; grid-template-columns: minmax(280px, 1fr) auto; gap: 18px; align-items: center; margin-bottom: 16px; padding: 12px 14px; border-left: 4px solid var(--highlight); border-radius: var(--radius); box-shadow: 0 9px 28px rgba(26, 44, 78, .10); }
.intake-filter-heading { min-width: 0; display: grid; grid-template-columns: 5px minmax(0, 1fr); gap: 11px; align-items: stretch; }
.filter-marker { width: 5px; min-height: 34px; border-radius: 999px; background: var(--highlight); box-shadow: 0 0 0 4px rgba(245, 184, 25, .12); }
.intake-filter-heading > div { min-width: 0; align-self: center; }
.intake-filter-heading p:last-child { margin: 3px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; }
.intake-filter-controls { min-width: 0; display: flex; gap: 4px; margin: 0; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); }
.intake-filter-option { position: relative; display: block; min-width: 0; color: var(--ink-soft); cursor: pointer; font-size: 11px; font-weight: 760; }
.intake-filter-option input { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: inherit; background: transparent; box-shadow: none; opacity: 0; cursor: pointer; }
.intake-filter-option span { min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 7px 11px; border: 1px solid transparent; border-radius: 7px; white-space: nowrap; transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease; }
.intake-filter-option b { min-width: 22px; padding: 3px 5px; border-radius: 999px; background: #e3e8ef; color: var(--nav); font-size: 9px; text-align: center; font-variant-numeric: tabular-nums; }
.intake-filter-option:hover span { border-color: var(--line-strong); background: #fff; }
.intake-filter-option input:checked + span { border-color: var(--nav); background: var(--nav); color: #fff; box-shadow: inset 0 -2px var(--highlight); }
.intake-filter-option input:checked + span b { background: var(--highlight); color: var(--nav); }
.intake-filter-option input:focus-visible + span { outline: 3px solid rgba(245, 184, 25, .68); outline-offset: 2px; }
.intake-admin-verification { min-width: 0; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-bottom: 16px; padding: 15px 16px; border: 1px solid #d5dee9; border-left: 4px solid var(--highlight); background: linear-gradient(105deg, #f8fafc 0%, #fff 68%); box-shadow: var(--shadow-sm); }
.verification-seal { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #334966; border-radius: 10px; background: var(--nav); color: var(--highlight); font-size: 19px; font-weight: 850; box-shadow: inset 0 -3px rgba(245, 184, 25, .2); }
.intake-admin-verification-copy { min-width: 0; }
.intake-admin-verification-copy h2 { margin: 2px 0 4px; font-size: 15px; }
.intake-admin-verification-copy > p:last-child { max-width: 720px; margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.intake-verify-form { flex: 0 0 auto; }
.intake-verify-button { min-width: 250px; display: grid; justify-items: start; gap: 2px; padding: 10px 14px; border-color: var(--nav); background: var(--nav); text-align: left; box-shadow: inset 0 -3px var(--highlight); }
.intake-verify-button:hover { border-color: #243b5d; background: #243b5d; box-shadow: 0 8px 18px rgba(23, 41, 68, .2), inset 0 -3px var(--highlight); }
.intake-verify-button span { font-size: 10px; line-height: 1.35; }
.intake-verify-button small { color: #c4cfde; font-size: 8px; font-weight: 680; }
.intake-verify-button:disabled, .intake-section-verify-button:disabled { border-color: #cbd4dc; background: #e9edf1; color: #7c8a97; cursor: not-allowed; box-shadow: none; transform: none; }
.intake-verify-button:disabled small { color: #8b98a4; }
.intake-layout { min-width: 0; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 16px; align-items: start; }
.intake-navigation { position: sticky; top: 88px; padding: 15px; }
.intake-filterbar + .intake-layout .intake-navigation { top: 166px; }
.intake-navigation > strong { color: var(--nav); font-size: 12px; }
.intake-navigation nav { display: grid; gap: 3px; margin-top: 12px; }
.intake-navigation nav a { min-width: 0; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; align-items: center; padding: 8px; border-radius: 7px; color: var(--ink-soft); font-size: 10px; text-decoration: none; }
.intake-navigation nav a:hover { background: var(--surface-soft); color: var(--accent-strong); }
.intake-navigation nav a > span:first-child { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; background: #e7edef; font-size: 9px; font-weight: 800; }
.intake-navigation nav a > span:last-child { min-width: 0; display: grid; gap: 2px; overflow-wrap: anywhere; }
.intake-navigation nav small { color: var(--muted); font-size: 8px; }
.intake-navigation .mini-progress { margin-top: 13px; }
.intake-navigation > p { margin: 10px 0 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.intake-content { min-width: 0; }
.intake-step { margin-bottom: 13px; padding: 20px; scroll-margin-top: 94px; }
.intake-step.document-first { padding: 0; overflow: hidden; }
.intake-documents-disclosure > summary { display: block; padding: 20px; list-style: none; cursor: pointer; transition: background-color 160ms ease; }
.intake-documents-disclosure > summary::-webkit-details-marker { display: none; }
.intake-documents-disclosure > summary:hover { background: #f8fafc; }
.intake-documents-disclosure > summary:focus-visible { outline: 3px solid rgba(245, 184, 25, .68); outline-offset: -4px; }
.intake-documents-disclosure[open] > summary { border-bottom: 1px solid var(--line); background: #fbfcfd; }
.intake-documents-summary-heading { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 13px; align-items: center; margin: 0; }
.intake-documents-summary-copy { min-width: 0; display: grid; gap: 3px; }
.intake-documents-summary-copy .eyebrow { margin: 0; }
.intake-documents-summary-title { color: var(--nav); font-size: 20px; font-weight: 790; line-height: 1.18; overflow-wrap: anywhere; }
.intake-documents-summary-count { width: max-content; max-width: 100%; margin-top: 3px; padding: 4px 8px; border-radius: 999px; background: #e9eef3; color: var(--ink-soft); font-size: 9px; font-weight: 760; letter-spacing: .02em; }
.intake-documents-summary-action { min-width: 126px; display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 8px 10px; border: 1px solid #b6c2ce; border-radius: 8px; background: #fff; color: var(--nav); font-size: 10px; font-weight: 780; }
.documents-collapse-label { display: none; }
.documents-summary-chevron { color: var(--accent-strong); font-size: 18px; line-height: 1; transition: transform 160ms ease; }
.intake-documents-disclosure[open] .documents-expand-label { display: none; }
.intake-documents-disclosure[open] .documents-collapse-label { display: inline; }
.intake-documents-disclosure[open] .documents-summary-chevron { transform: rotate(180deg); }
.intake-documents-body { min-width: 0; padding: 0 20px 20px; }
.intake-documents-intro { margin: 16px 0 0 51px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.intake-step-heading { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 13px; align-items: start; }
.intake-step-heading h2 { margin: 2px 0 5px; }
.intake-step-heading p:last-child { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.intake-verify-form-section { align-self: center; }
.intake-section-verify-button { min-width: 0; max-width: 220px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; align-items: center; justify-content: stretch; padding: 8px 9px 8px 11px; border-color: #aebac8; color: var(--nav); text-align: left; box-shadow: none; }
.intake-section-verify-button span { min-width: 0; font-size: 9px; line-height: 1.3; }
.intake-section-verify-button small { min-width: 23px; padding: 3px 5px; border-radius: 999px; background: #e3e8ef; color: var(--nav); font-size: 8px; text-align: center; font-variant-numeric: tabular-nums; }
.intake-section-verify-button:hover small { background: var(--highlight); }
.step-number { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; background: var(--nav); color: white; font-size: 12px; font-weight: 800; }
.document-intake-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) 150px; gap: 10px; margin: 18px 0 0 51px; }
.document-source-choice { grid-column: 1 / -1; grid-template-columns: 1fr auto 1fr; align-items: end; }
.document-intake-form > button { grid-column: 1 / -1; justify-self: end; }
.intake-document-list, .selected-scope, .intake-section-form { min-width: 0; margin: 18px 0 0 51px; }
.intake-document-list h3, .intake-subsection { margin: 0 0 10px; color: var(--ink-soft); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.intake-document-list article { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid #e8edef; }
.intake-document-list article > div { min-width: 0; display: grid; gap: 3px; }
.intake-document-list strong, .intake-document-list span, .intake-document-list small { overflow-wrap: anywhere; }
.intake-document-list span, .intake-document-list small { color: var(--muted); font-size: 9px; }
.selected-scope { padding: 13px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); }
.selected-scope > strong { font-size: 11px; }
.selected-scope > div { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.selected-scope > div span { padding: 4px 7px; border-radius: 5px; background: white; color: var(--ink-soft); font-size: 9px; }
.selected-scope > p { margin: 9px 0 0; color: var(--muted); font-size: 9px; }
.intake-section-form, .intake-field-group { display: grid; gap: 9px; }
.intake-field-group { min-width: 0; }
.intake-field { min-width: 0; padding: 13px 13px 14px; border: 1px solid #e3e9eb; border-left: 3px solid #aebbc0; border-radius: 0 8px 8px 0; background: #fbfcfc; }
.intake-field-heading { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.intake-field-heading label { min-width: 0; color: var(--ink); overflow-wrap: anywhere; }
.intake-field > p { margin: 5px 0 9px; color: var(--muted); font-size: 9px; }

.supplier-location-picker { min-width: 0; margin-bottom: 6px; padding: 16px; overflow: hidden; border: 1px solid #c8d3e1; border-left: 4px solid var(--highlight); border-radius: 10px; background: #f8fafc; box-shadow: var(--shadow-sm); }
.supplier-location-picker > header { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: end; margin-bottom: 14px; }
.supplier-location-picker > header > div { min-width: 0; }
.supplier-location-picker .eyebrow { margin: 0 0 5px; color: var(--highlight-ink); }
.supplier-location-picker h3 { margin: 0; color: var(--nav); font-size: 18px; letter-spacing: -.025em; }
.supplier-location-picker > header p:last-child { max-width: 750px; margin: 6px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.location-external-link { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 8px 12px; border: 1px solid #aebdce; border-radius: 7px; background: #fff; color: var(--nav); font-size: 9px; font-weight: 760; text-decoration: none; white-space: nowrap; }
.location-external-link:hover { border-color: var(--nav); background: #f1f4f8; }
.location-picker-layout { min-width: 0; display: grid; grid-template-columns: minmax(360px, 1.35fr) minmax(260px, .65fr); gap: 15px; align-items: stretch; }
.location-picker-layout > div { min-width: 0; }
.location-map-board { position: relative; width: 100%; min-height: 250px; display: block; overflow: hidden; border: 1px solid #9cafc4; border-radius: 8px; background-color: #e9eff5; box-shadow: inset 0 0 0 1px rgba(255,255,255,.7); cursor: crosshair; touch-action: none; }
.location-map-board:hover, .location-map-board:focus-visible { border-color: var(--nav); background-color: #e5ecf3; box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 0 0 3px rgba(245,184,25,.22); transform: none; }
.location-grid { position: absolute; inset: 0; opacity: .42; background-image: linear-gradient(#b8c5d4 1px, transparent 1px), linear-gradient(90deg, #b8c5d4 1px, transparent 1px); background-size: 12.5% 16.66%; pointer-events: none; }
.china-outline { position: absolute; inset: 10% 7% 8%; background: #c8d5df; clip-path: polygon(0 42%,8% 53%,11% 67%,15% 72%,24% 72%,27% 75%,32% 69%,39% 75%,42% 83%,48% 89%,55% 92%,58% 100%,61% 94%,65% 89%,68% 89%,71% 83%,74% 81%,77% 69%,77% 64%,81% 64%,79% 50%,84% 39%,94% 31%,98% 17%,90% 14%,87% 3%,76% 3%,71% 14%,63% 14%,56% 25%,48% 33%,42% 36%,35% 31%,29% 25%,24% 17%,16% 19%,10% 14%,3% 19%,2% 33%); box-shadow: inset 0 0 0 2px #6f859d; pointer-events: none; }
.location-city { position: absolute; z-index: 2; padding: 2px 4px; border-radius: 3px; background: rgba(255,255,255,.86); color: #50647d; font-size: 7px; font-weight: 720; line-height: 1; pointer-events: none; }
.location-city::before { position: absolute; top: 50%; left: -4px; width: 4px; height: 4px; border-radius: 50%; background: #526a84; content: ""; transform: translateY(-50%); }
.location-city-beijing { top: 30%; left: 72%; }
.location-city-shanghai { top: 55%; left: 78%; }
.location-city-chengdu { top: 57%; left: 50%; }
.location-city-guangzhou { top: 78%; left: 65%; }
.location-map-marker { position: absolute; z-index: 4; width: 18px; height: 18px; border: 4px solid #fff; border-radius: 50% 50% 50% 0; background: var(--highlight); box-shadow: 0 3px 8px rgba(22,41,75,.35); pointer-events: none; transform: translate(-50%, -100%) rotate(-45deg); }
.location-map-marker::after { position: absolute; inset: 4px; border-radius: 50%; background: var(--nav); content: ""; }
.location-board-note { margin: 7px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.location-tools { display: flex; flex-direction: column; gap: 10px; padding: 13px; border: 1px solid #d5dde7; border-radius: 8px; background: #fff; }
.location-tools label { display: grid; gap: 6px; color: var(--nav); font-size: 9px; font-weight: 750; }
.location-tools textarea { min-height: 88px; resize: vertical; }
.location-tools button { align-self: flex-start; min-height: 38px; }
.location-tools small { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: 8px; line-height: 1.5; }
.location-feedback { min-height: 18px; margin: 0; color: #2c7063; font-size: 9px; font-weight: 680; line-height: 1.45; }
.location-feedback.is-error { color: var(--danger); }
.intake-declaration-control { margin-top: 10px; padding: 13px 14px; border: 1px solid #cfd8e3; border-radius: 8px; background: #f4f7fa; transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease; }
.intake-declaration-control > label { min-width: 0; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 11px; align-items: start; cursor: pointer; }
.intake-declaration-control input[type="checkbox"] { width: 21px; height: 21px; margin: 1px 0 0; accent-color: var(--nav); cursor: pointer; }
.intake-declaration-control label > span { min-width: 0; display: grid; gap: 5px; }
.intake-declaration-control strong { color: var(--nav); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.intake-declaration-control small { color: var(--muted); font-size: 9px; line-height: 1.5; overflow-wrap: anywhere; }
.intake-declaration-control.is-confirmed { border-color: #c69a20; background: #fffaf0; box-shadow: inset 3px 0 var(--highlight); }
.intake-declaration-control:focus-within { outline: 3px solid rgba(26, 114, 106, .16); outline-offset: 2px; }
.contact-route-control { min-width: 0; display: grid; gap: 9px; margin: 9px 0; padding: 10px 11px; border: 1px solid #d7e0e9; border-radius: 8px; background: #f4f7fa; transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease; }
.contact-route-control > label { min-width: 0; grid-template-columns: minmax(112px, .3fr) minmax(220px, 1fr); align-items: center; gap: 12px; }
.contact-route-control > label > span { color: var(--nav); font-size: 9px; font-weight: 810; letter-spacing: .07em; text-transform: uppercase; }
.contact-route-control select { min-height: 39px; padding: 7px 34px 7px 10px; border-color: #b9c5d3; background-color: #fff; color: var(--nav); font-size: 10px; font-weight: 720; }
.contact-route-control.is-via-dealer { border-color: #c69a20; background: #fffaf0; box-shadow: inset 3px 0 var(--highlight); }
.contact-route-note { min-width: 0; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: start; margin: 0; padding: 10px; border-top: 1px solid #ead9a5; color: var(--ink-soft); font-size: 9px; line-height: 1.5; }
.contact-route-note > span:last-child { min-width: 0; display: grid; gap: 3px; }
.contact-route-note strong { color: var(--nav); font-size: 10px; overflow-wrap: anywhere; }
.contact-route-mark { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: var(--highlight); color: var(--nav); font-size: 13px; font-weight: 850; }
.contact-direct-entry { min-width: 0; }
.contact-direct-entry textarea { display: block; }
.status-border-received, .status-border-verified { border-left-color: var(--accent); }
.status-border-requested { border-left-color: var(--copper); }
.status-border-missing { border-left-color: var(--danger); }
.intake-verification { margin-top: 8px; }
.intake-verification > summary { cursor: pointer; color: var(--accent-strong); font-size: 10px; font-weight: 700; }
.intake-verification > div { display: grid; grid-template-columns: .8fr .8fr 1.4fr; gap: 9px; margin-top: 9px; padding: 11px; border-radius: 7px; background: #edf2f2; }
.intake-verification label { font-size: 9px; }
.intake-verification input, .intake-verification select { min-height: 36px; padding: 7px 8px; font-size: 10px; }
.intake-savebar { position: sticky; z-index: 8; bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 13px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: rgba(255, 255, 255, .96); box-shadow: 0 9px 28px rgba(13, 27, 36, .13); backdrop-filter: blur(10px); }
.intake-savebar span { max-width: 620px; color: var(--muted); font-size: 9px; line-height: 1.4; }

/* Data sheets */
.verification-flow { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; margin-bottom: 17px; }
.verification-flow article { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 11px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.verification-flow article > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; background: var(--nav); color: white; font-size: 11px; font-weight: 800; }
.verification-flow strong { font-size: 12px; }
.verification-flow p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.flow-arrow { color: var(--muted); }
.datasheet-tools { position: sticky; z-index: 10; top: 80px; display: grid; grid-template-columns: 1fr 340px; gap: 12px; margin-bottom: 15px; padding: 14px; }
.datasheet-grid { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.datasheet-card { min-width: 0; display: grid; gap: 11px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: inherit; box-shadow: var(--shadow-sm); text-decoration: none; content-visibility: auto; contain-intrinsic-size: 180px; }
.datasheet-card:hover { border-color: #8fb8b3; transform: translateY(-2px); box-shadow: 0 13px 28px rgba(13, 27, 36, .08); }
.datasheet-card-heading { display: flex; justify-content: space-between; gap: 10px; }
.family-tag { padding: 4px 7px; background: var(--accent-soft); color: var(--accent-strong); font-size: 8px; font-weight: 780; text-transform: uppercase; }
.version-tag { padding: 4px 7px; background: #e8edef; color: var(--ink-soft); font-size: 8px; font-weight: 750; }
.datasheet-card h2 { min-width: 0; margin: 0; color: var(--nav); font-size: 15px; line-height: 1.32; overflow-wrap: anywhere; }
.datasheet-card > p { margin: 0; color: var(--muted); font-size: 9px; }
.datasheet-metrics { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 5px 7px; align-items: baseline; }
.datasheet-metrics strong { color: var(--accent); font-size: 16px; }
.datasheet-metrics span { color: var(--muted); font-size: 9px; }
.catalog-note { margin-top: 14px; color: var(--muted); font-size: 10px; text-align: center; }
.datasheet-source { min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 15px; }
.datasheet-source p { margin: 6px 0 0; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.datasheet-section { margin-bottom: 12px; }
.datasheet-field-list { display: grid; gap: 7px; }
.datasheet-field { min-width: 0; display: grid; grid-template-columns: minmax(220px, .8fr) minmax(250px, 1fr); gap: 9px 18px; padding: 13px; border: 1px solid #e5eaec; border-radius: 8px; background: #fbfcfc; }
.datasheet-field h3 { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.datasheet-field p { margin: 3px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; overflow-wrap: anywhere; }
.field-rules { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; justify-content: flex-end; }
.field-rules > span { padding: 4px 6px; border-radius: 5px; background: #edf2f3; color: var(--ink-soft); font-size: 8px; }
.validation-rule, .field-source { grid-column: 1 / -1; }
.inherited-field { box-shadow: inset 3px 0 0 #9bb9b5; }

[dir="rtl"] .intake-field { border-right: 3px solid #aebbc0; border-left: 1px solid #e3e9eb; border-radius: 8px 0 0 8px; }
[dir="rtl"] .supplier-location-picker { border-right: 4px solid var(--highlight); border-left: 1px solid #c8d3e1; }
[dir="rtl"] .intake-admin-verification { border-right: 4px solid var(--highlight); border-left: 1px solid #d5dee9; }
[dir="rtl"] .intake-verify-button, [dir="rtl"] .intake-section-verify-button { text-align: right; }
[dir="rtl"] .contact-route-control.is-via-dealer { box-shadow: inset -3px 0 var(--highlight); }
[dir="rtl"] .intake-declaration-control.is-confirmed { box-shadow: inset -3px 0 var(--highlight); }
[dir="rtl"] .document-intake-form, [dir="rtl"] .intake-document-list, [dir="rtl"] .intake-documents-intro, [dir="rtl"] .selected-scope, [dir="rtl"] .intake-section-form { margin-right: 51px; margin-left: 0; }
[dir="rtl"] .group-row.is-selected { box-shadow: inset -3px 0 0 var(--accent); }

@keyframes page-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1120px) {
  .container { width: min(100% - 32px, 1180px); }
  .workspace-hero { align-items: flex-start; flex-direction: column; }
  .workspace-stats { width: 100%; }
  .vendor-search-form { grid-template-columns: 1.3fr 1fr 1fr auto; }
  .vendor-search-form .button-link { grid-column: 1 / -1; justify-self: start; }
  .vendor-workbench { grid-template-columns: 235px minmax(0, 1fr); }
  .datasheet-grid { grid-template-columns: 1fr 1fr; }
  .metric-grid, .intake-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 840px) {
  .topbar { padding: 0 16px; gap: 14px; }
  .topbar nav { justify-content: center; }
  .topbar nav a { padding-inline: 10px; font-size: 12px; }
  .mode { display: none; }
  .vendor-filterbar { top: 68px; }
  .vendor-search-form { grid-template-columns: 1fr 1fr; }
  .vendor-search-form .search-control { grid-column: 1 / -1; }
  .vendor-search-form .button-link { grid-column: auto; justify-self: stretch; }
  .vendor-workbench { grid-template-columns: 1fr; }
  .group-rail { position: static; max-height: 330px; }
  .group-list { display: grid; grid-template-columns: 1fr 1fr; }
  .group-row { border-right: 1px solid #edf1f2; }
  .intake-layout { grid-template-columns: 1fr; }
  .intake-filterbar { position: static; }
  .intake-navigation { position: static; }
  .intake-navigation nav { grid-template-columns: 1fr 1fr; }
  .document-intake-form { grid-template-columns: 1fr 1fr; }
  .document-intake-form label:last-of-type { grid-column: 1 / -1; }
  .intake-verification > div { grid-template-columns: 1fr 1fr; }
  .intake-admin-verification { grid-template-columns: 42px minmax(0, 1fr); }
  .intake-verify-form-all { grid-column: 2; }
}

@media (max-width: 640px) {
  .topbar { min-height: auto; grid-template-columns: 1fr auto; padding-top: 9px; }
  .brand { align-self: center; }
  .brand-mark { width: 34px; height: 34px; }
  .topbar nav { grid-column: 1 / -1; grid-row: 2; order: 3; justify-content: stretch; align-self: auto; }
  .topbar nav a { flex: 1; justify-content: center; min-height: 40px; padding: 0 7px; font-size: 11px; }
  .topbar nav a[aria-current="page"]::after { right: 8px; left: 8px; }
  .container { width: calc(100% - 22px); margin-top: 19px; }
  .hero, .workspace-hero, .supplier-hero, .summary-heading, .section-heading, .intake-callout { align-items: flex-start; flex-direction: column; }
  .hero h1, .workspace-title h1 { font-size: 34px; }
  .workspace-stats { grid-template-columns: 1fr; }
  .workspace-stats div { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-right: 0; border-bottom: 1px solid var(--line); }
  .workspace-stats div:last-child { border-bottom: 0; }
  .workspace-stats dd { font-size: 21px; }
  .vendor-filterbar { position: static; }
  .vendor-search-form { grid-template-columns: 1fr; }
  .vendor-search-form .search-control { grid-column: auto; }
  .group-list { grid-template-columns: 1fr; }
  .vendor-table-shell { overflow: visible; }
  .vendor-table, .vendor-table tbody { display: block; }
  .vendor-table thead { display: none; }
  .vendor-table tr { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 14px; border-bottom: 1px solid var(--line); }
  .vendor-table td { display: block; padding: 0; border: 0; }
  .vendor-table td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .vendor-table td:nth-child(4), .vendor-table td:nth-child(5) { grid-column: 1 / -1; }
  .vendor-table td:nth-child(2), .vendor-table td:nth-child(3), .vendor-table td:nth-child(4) { display: grid; gap: 3px; }
  .vendor-table td:nth-child(2)::before, .vendor-table td:nth-child(3)::before, .vendor-table td:nth-child(4)::before { color: var(--muted); font-size: 8px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; content: attr(data-label); }
  .vendor-table td:last-child { grid-column: 2; grid-row: 1; }
  .dossier-meter { grid-template-columns: 1fr auto; }
  .pagination { grid-template-columns: 1fr 1fr; }
  .pagination strong { grid-column: 1 / -1; grid-row: 1; text-align: center; }
  .pagination a:first-child, .pagination span:first-child { grid-column: 1; grid-row: 2; }
  .pagination a:last-child, .pagination span:last-child { grid-column: 2; grid-row: 2; }
  .grid, .datasheet-grid, .datasheet-tools, .datasheet-source, .datasheet-field { grid-template-columns: 1fr; }
  .verification-flow { grid-template-columns: 1fr; }
  .flow-arrow { justify-self: center; transform: rotate(90deg); }
  .metric-grid, .intake-facts { grid-template-columns: 1fr 1fr; }
  .vendor-source-metrics { grid-template-columns: 1fr; }
  .portfolio-gallery-grid { grid-template-columns: 1fr 1fr; }
  .portfolio-lightbox { width: calc(100vw - 24px); }
  .portfolio-lightbox-shell { grid-template-columns: 38px minmax(0, 1fr) 38px; padding: 16px 6px 9px; }
  .portfolio-lightbox-nav { width: 32px; height: 52px; min-height: 52px; }
  .portfolio-lightbox figcaption { align-items: flex-start; flex-direction: column; gap: 4px; }
  .portfolio-lightbox-close { top: -9px; right: -6px; }
  .external-qualification-status { max-width: 100%; text-align: left; }
  .external-qualification-grid { grid-template-columns: 1fr; }
  .external-qualification-grid .external-qualification-wide { grid-column: auto; }
  .completeness-badge, .catalog-count { justify-items: start; }
  .section-heading > p { text-align: left; }
  .document-row { grid-template-columns: 1fr; gap: 6px; }
  .document-intake-form, .document-source-choice, .intake-verification > div { grid-template-columns: 1fr; }
  .contact-route-control > label { grid-template-columns: 1fr; gap: 6px; }
  .document-intake-form label:last-of-type, .document-source-choice { grid-column: auto; }
  .document-intake-form, .intake-document-list, .selected-scope, .intake-section-form, [dir="rtl"] .document-intake-form, [dir="rtl"] .intake-document-list, [dir="rtl"] .selected-scope, [dir="rtl"] .intake-section-form { margin-right: 0; margin-left: 0; }
  .intake-navigation nav { grid-template-columns: 1fr; }
  .intake-filterbar { grid-template-columns: 1fr; gap: 11px; padding: 12px; }
  .intake-filter-controls { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .intake-filter-option span { min-height: 44px; padding-inline: 5px; white-space: normal; text-align: center; }
  .intake-admin-verification { grid-template-columns: 36px minmax(0, 1fr); gap: 11px; padding: 13px; }
  .verification-seal { width: 35px; height: 35px; border-radius: 8px; font-size: 16px; }
  .intake-verify-form-all { grid-column: 1 / -1; }
  .intake-verify-button { width: 100%; min-width: 0; }
  .intake-documents-disclosure > summary { padding: 16px; }
  .intake-documents-summary-heading { grid-template-columns: 38px minmax(0, 1fr); align-items: start; }
  .intake-documents-summary-action { grid-column: 2; min-width: 0; justify-self: start; margin-top: 5px; }
  .intake-documents-body { padding: 0 16px 16px; }
  .intake-documents-intro, [dir="rtl"] .intake-documents-intro { margin-right: 0; margin-left: 0; }
  .intake-step-heading { grid-template-columns: 38px minmax(0, 1fr); }
  .intake-verify-form-section { grid-column: 2; width: 100%; }
  .intake-section-verify-button { width: 100%; max-width: none; }
  .intake-savebar { align-items: stretch; flex-direction: column; }
  .field-rules { justify-content: flex-start; }
}

@media (max-width: 520px) {
  .portfolio-gallery-grid { grid-template-columns: 1fr; }
  .portfolio-gallery-empty { grid-template-columns: 48px minmax(0, 1fr); padding: 14px; }
  .portfolio-gallery-empty-frame { width: 46px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* RPS Vendor Desk — role gateway */
.login-page { background: #fff; }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, .88fr) minmax(520px, 1.12fr); }
.login-brand-panel { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 32px clamp(34px, 5vw, 76px) 38px; background: var(--nav); color: #fff; box-shadow: inset 7px 0 var(--highlight); }
.login-brand-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #aebad0; font-size: 9px; font-weight: 780; letter-spacing: .14em; }
.login-brand-top nav { display: flex; gap: 3px; }
.login-brand-top a { min-width: 32px; min-height: 32px; display: grid; place-items: center; border: 1px solid #415474; border-radius: 5px; color: #bfc9d8; font-size: 9px; text-decoration: none; }
.login-brand-top a:hover, .login-brand-top a[aria-current="true"] { border-color: var(--highlight); background: var(--highlight); color: var(--nav); }
.login-identity { max-width: 530px; margin: 84px 0; }
.login-logo { width: min(295px, 75%); aspect-ratio: 1.365; display: grid; place-items: center; margin-bottom: 36px; background: #fff; }
.login-logo img { width: 100%; height: 100%; display: block; object-fit: contain; }
.login-product-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 9px 13px; padding-top: 25px; border-top: 1px solid #465879; }
.login-product-name strong { color: #fff; font-size: clamp(38px, 4.4vw, 68px); font-weight: 820; letter-spacing: -.055em; line-height: .95; }
.login-product-name span { color: var(--highlight); font-size: 11px; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.login-identity > p { max-width: 470px; margin: 25px 0 0; color: #c0cad9; font-size: 15px; line-height: 1.65; }
.login-scope { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; padding-top: 18px; border-top: 1px solid #3a4e70; }
.login-scope span { color: #99a8c0; font-size: 8px; font-weight: 780; letter-spacing: .13em; }
.login-scope strong { color: var(--highlight); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.login-access-panel { min-width: 0; display: grid; place-items: center; padding: 54px clamp(30px, 6vw, 94px); background: #fff; }
.login-access-inner { width: min(670px, 100%); }
.login-access-inner > h1 { max-width: 620px; margin: 10px 0 17px; color: var(--nav); font-size: clamp(37px, 4.2vw, 61px); line-height: .96; letter-spacing: -.052em; }
.login-lead { max-width: 600px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.login-alert { margin-top: 20px; padding: 12px 14px; border: 1px solid #e5c65f; border-left: 4px solid var(--highlight); background: #fff9e8; color: #6e560d; font-size: 12px; }
.role-gateway { display: grid; gap: 9px; margin-top: 34px; }
.role-card { min-width: 0; min-height: 100px; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 16px; align-items: center; margin: 0; padding: 17px 18px; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: none; }
.role-card-active { border-color: #9dabc0; box-shadow: inset 4px 0 var(--highlight), 0 12px 34px rgba(26, 44, 78, .08); }
.role-number { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 6px; background: var(--nav); color: var(--highlight); font-size: 10px; font-weight: 820; font-variant-numeric: tabular-nums; }
.role-copy { min-width: 0; display: grid; gap: 6px; }
.role-copy strong { color: var(--nav); font-size: 16px; }
.role-copy small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.role-card button { min-width: 116px; box-shadow: inset 0 -3px var(--highlight); }
.role-card button span { margin-left: 12px; font-size: 18px; }
.role-card.is-pending { background: #f8f9fb; }
.role-card.is-pending .role-number { background: #dce2ea; color: #768296; }
.role-card.is-pending .role-copy strong { color: #657186; }
.role-state { min-width: 66px; padding: 7px 9px; border: 1px solid #d7dee7; border-radius: 5px; color: #8792a3; font-size: 9px; font-weight: 760; text-align: center; text-transform: uppercase; }
.login-security-note { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0 0; color: #7c8798; font-size: 10px; line-height: 1.5; }
.login-security-note > span { flex: none; width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; background: var(--highlight); box-shadow: 0 0 0 4px #fff3ca; }

/* RPS Operations — selected B2 system */
.eyebrow { color: var(--highlight-ink) !important; }
.vendor-filterbar { top: 72px; background: rgba(255, 255, 255, .96); }
.vendor-register { border-top: 3px solid var(--highlight); }
.vendor-table th { background: #f5f7fa; }
.vendor-table tbody tr:hover { background: #f8fafc; box-shadow: inset 3px 0 0 var(--highlight); }
.vendor-table tbody tr:focus-within { background: #f8fafc; box-shadow: inset 3px 0 0 var(--highlight); }
.dealer-value { background: #edf1f7; color: var(--nav); }
.row-action:hover { border-color: var(--nav); background: var(--nav); }
.status { background: #edf2f8; color: var(--nav) !important; }

@media (max-width: 900px) {
  .login-shell { grid-template-columns: 1fr; }
  .login-brand-panel { min-height: auto; padding: 24px 28px 30px; box-shadow: inset 0 5px var(--highlight); }
  .login-identity { margin: 44px 0 34px; }
  .login-logo { width: 180px; margin-bottom: 24px; }
  .login-product-name strong { font-size: 44px; }
  .login-access-panel { padding: 46px 28px 60px; }
}

@media (max-width: 640px) {
  .topbar { padding-top: 6px; }
  .brand-logo { width: 68px; height: 45px; }
  .brand-copy strong { font-size: 10px; }
  .brand-copy small { font-size: 8px; }
  .role-indicator { padding-inline: 8px; font-size: 9px; }
  .vendor-filterbar { top: auto; }
  .login-brand-top { align-items: flex-start; flex-direction: column; }
  .login-identity { margin-top: 34px; }
  .login-product-name { align-items: flex-start; flex-direction: column; }
  .login-product-name strong { font-size: 39px; }
  .login-access-inner > h1 { font-size: 39px; }
  .role-card { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; }
  .role-card button, .role-state { grid-column: 1 / -1; width: 100%; }
}

@media (max-width: 390px) {
  .brand-copy { display: none; }
  .role-indicator { max-width: 88px; overflow: hidden; text-overflow: ellipsis; }
}

/* RPS Desk 2026 — role-aware supplier operations */
.brand-divider { width: 1px; height: 28px; background: var(--line); }
.brand-copy strong { font-size: 14px; letter-spacing: -.01em; }
.brand-copy small { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.primary-nav { justify-content: flex-start; }

.account-menu { position: relative; }
.account-menu > summary { min-width: 168px; min-height: 42px; display: grid; grid-template-columns: 30px minmax(0, 1fr) 14px; gap: 9px; align-items: center; padding: 5px 8px; border: 1px solid var(--line); border-radius: 8px; background: #f8fafc; cursor: pointer; list-style: none; }
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu[open] > summary { border-color: #8b9ab0; background: #fff; }
.account-avatar { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--nav); color: var(--highlight); font-size: 11px; font-weight: 850; }
.account-summary { min-width: 0; display: grid; gap: 1px; }
.account-summary strong, .account-summary small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-summary strong { color: var(--nav); font-size: 10px; }
.account-summary small { color: var(--muted); font-size: 8px; font-weight: 650; }
.account-chevron { color: var(--muted); font-size: 14px; transition: transform 160ms ease; }
.account-menu[open] .account-chevron { transform: rotate(180deg); }
.account-popover { position: absolute; z-index: 45; top: calc(100% + 9px); right: 0; width: 225px; padding: 7px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: var(--shadow-md); }
.account-popover-head { display: grid; gap: 2px; padding: 9px 10px 11px; border-bottom: 1px solid var(--line); }
.account-popover-head strong { color: var(--nav); font-size: 11px; overflow-wrap: anywhere; }
.account-popover-head span { color: var(--muted); font-size: 9px; overflow-wrap: anywhere; }
.account-popover > a, .account-logout { width: 100%; min-height: 38px; display: flex; align-items: center; justify-content: flex-start; margin-top: 3px; padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; color: var(--ink-soft); font-size: 10px; font-weight: 680; text-decoration: none; }
.account-popover > a:hover, .account-logout:hover { background: var(--surface-soft); box-shadow: none; color: var(--nav); transform: none; }
.account-logout { color: var(--danger); }
[dir="rtl"] .account-popover { right: auto; left: 0; }

.role-scope-banner { position: relative; min-width: 0; display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; gap: 17px; align-items: center; margin-bottom: 20px; padding: 16px 18px; overflow: hidden; border: 1px solid #344d73; border-radius: var(--radius); background: var(--nav); color: #fff; box-shadow: 0 12px 30px rgba(23, 41, 68, .14); }
.scope-marker { align-self: stretch; width: 5px; min-height: 38px; border-radius: 999px; background: var(--highlight); box-shadow: 0 0 0 4px rgba(245, 184, 25, .12); }
.role-scope-banner > div { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 13px; align-items: baseline; }
.role-scope-banner .eyebrow { grid-column: 1 / -1; color: #f8ce64 !important; font-size: 8px; }
.role-scope-banner > div > strong { color: #fff; font-size: 17px; }
.role-scope-banner > div > span { min-width: 0; color: #c5cfdd; font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.role-scope-banner dl { display: grid; grid-template-columns: repeat(2, minmax(95px, 1fr)); margin: 0; border-left: 1px solid #425777; }
.role-scope-banner dl div { min-width: 0; padding: 3px 17px; }
.role-scope-banner dt { color: #aebad0; font-size: 8px; font-weight: 720; letter-spacing: .06em; text-transform: uppercase; }
.role-scope-banner dd { margin: 3px 0 0; color: var(--highlight); font-size: 20px; font-weight: 810; font-variant-numeric: tabular-nums; }

.dossier-access-strip { min-width: 0; display: grid; grid-template-columns: 6px minmax(0, 1fr); gap: 12px; align-items: stretch; margin: 0 0 18px; padding: 12px 14px; border: 1px solid #cad4e1; border-radius: 9px; background: #f7f9fc; }
.dossier-access-strip p { min-width: 0; margin: 0; color: var(--ink-soft); font-size: 10px; line-height: 1.5; }
.dossier-access-strip p strong { display: inline-block; margin-right: 9px; color: var(--nav); }
.intake-access-strip { margin-top: -4px; }

.dealer-search-form { grid-template-columns: minmax(260px, 1.4fr) minmax(220px, 1fr) auto auto; }
.dealer-vendor-table th:nth-child(1) { width: 38%; }
.dealer-vendor-table th:nth-child(2) { width: 13%; }
.dealer-vendor-table th:nth-child(3) { width: 22%; }
.dealer-vendor-table th:nth-child(4) { width: 22%; }
.dealer-vendor-table th:nth-child(5) { width: 5%; }
@media (min-width: 641px) {
  .vendor-table-shell { min-height: 360px; max-height: calc(100vh - 490px); overflow: auto; scrollbar-color: #aab5c4 #eef2f6; }
  .vendor-table th { position: sticky; z-index: 12; top: 0; box-shadow: 0 1px 0 var(--line); }
}

/* Secure entry surface */
.credential-form { display: grid; gap: 17px; margin-top: 32px; }
.credential-form label { color: var(--nav); font-size: 11px; letter-spacing: .01em; }
.credential-form input { min-height: 50px; border-color: #aeb9c8; border-radius: 8px; padding: 12px 14px; font-size: 14px; }
.credential-form input:focus-visible { border-color: var(--nav); box-shadow: 0 0 0 4px rgba(26, 44, 78, .10); }
.password-control { position: relative; display: block; }
.password-control input { padding-right: 92px; }
.password-toggle { position: absolute; top: 6px; right: 6px; min-height: 38px; padding: 6px 11px; border-color: transparent; background: var(--surface-soft); box-shadow: none; color: var(--nav); font-size: 9px; }
.password-toggle:hover { border-color: var(--line); background: #edf1f6; box-shadow: none; color: var(--nav); transform: none; }
.login-submit { min-height: 50px; justify-content: space-between; padding-inline: 17px; font-size: 12px; }
.login-submit span:last-child { font-size: 19px; }
.access-scope-list { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #3a4e70; }
.access-scope-list > span { min-width: 0; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 2px 9px; padding: 17px 18px 0 0; color: #f3f5f8; font-size: 10px; font-weight: 720; }
.access-scope-list > span + span { padding-left: 18px; border-left: 1px solid #3a4e70; }
.access-scope-list b { grid-row: 1 / 3; color: var(--highlight); font-size: 10px; }
.access-scope-list small { color: #9eacc0; font-size: 8px; font-weight: 540; line-height: 1.4; overflow-wrap: anywhere; }
.login-trust-note { display: grid; grid-template-columns: 9px minmax(0, 1fr); gap: 11px; align-items: start; margin-top: 25px; padding-top: 19px; border-top: 1px solid var(--line); }
.login-trust-note > span { width: 8px; height: 8px; margin-top: 3px; border-radius: 50%; background: var(--highlight); box-shadow: 0 0 0 4px var(--copper-soft); }
.login-trust-note p { display: grid; gap: 4px; margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.login-trust-note strong { color: var(--nav); font-size: 10px; }

/* Account security */
.account-page-shell { min-height: calc(100vh - 190px); display: grid; grid-template-columns: minmax(280px, .78fr) minmax(380px, 1fr); gap: clamp(32px, 8vw, 120px); align-items: center; max-width: 1040px; margin: 0 auto; }
.account-page-intro h1 { margin: 8px 0 14px; color: var(--nav); font-size: clamp(35px, 5vw, 58px); line-height: .98; letter-spacing: -.045em; }
.account-page-intro > p:last-of-type { max-width: 500px; margin: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.6; }
.account-page-intro ul { display: grid; gap: 9px; margin: 22px 0 0; padding: 0; list-style: none; }
.account-page-intro li { position: relative; padding-left: 20px; color: var(--muted); font-size: 10px; }
.account-page-intro li::before { position: absolute; top: .35em; left: 0; width: 7px; height: 7px; border-radius: 2px; background: var(--highlight); content: ""; }
.password-panel { border-top: 4px solid var(--highlight); padding: clamp(22px, 4vw, 38px); box-shadow: var(--shadow-md); }
.password-panel h2 { font-size: 23px; }
.password-change-form button { margin-top: 4px; }

@media (max-width: 980px) {
  .account-summary { display: none; }
  .account-menu > summary { min-width: 0; grid-template-columns: 30px 12px; }
  .role-scope-banner { grid-template-columns: 8px minmax(0, 1fr); }
  .role-scope-banner dl { grid-column: 2; border-top: 1px solid #425777; border-left: 0; }
  .role-scope-banner dl div { padding: 10px 0 0; }
  .dealer-search-form { grid-template-columns: minmax(220px, 1fr) minmax(200px, 1fr) auto; }
}

@media (max-width: 640px) {
  .topbar { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .brand { gap: 7px; }
  .brand-divider { height: 23px; }
  .primary-nav { grid-column: 1 / -1; }
  .account-popover { position: fixed; top: 66px; right: 11px; }
  .role-scope-banner { margin-bottom: 16px; padding: 14px; }
  .role-scope-banner > div { grid-template-columns: 1fr; }
  .role-scope-banner .eyebrow { grid-column: auto; }
  .role-scope-banner dl { grid-template-columns: 1fr 1fr; }
  .dealer-search-form { grid-template-columns: 1fr; }
  .dealer-vendor-table tr { grid-template-columns: minmax(0, 1fr) auto; }
  .dealer-vendor-table td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .dealer-vendor-table td:nth-child(2) { grid-column: 1; grid-row: 2; }
  .dealer-vendor-table td:nth-child(3) { grid-column: 1 / -1; grid-row: 3; }
  .dealer-vendor-table td:nth-child(4) { grid-column: 1 / -1; grid-row: 4; }
  .dealer-vendor-table td:nth-child(5) { grid-column: 2; grid-row: 1; }
  .dealer-vendor-table td:nth-child(2)::before, .dealer-vendor-table td:nth-child(3)::before { color: var(--muted); font-size: 8px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; content: attr(data-label); }
  .access-scope-list { grid-template-columns: 1fr; }
  .access-scope-list > span + span { padding-left: 0; border-left: 0; }
  .login-brand-panel { min-height: 0; padding: 20px 22px 24px; }
  .login-identity { margin: 28px 0 18px; }
  .login-logo { width: 132px; margin-bottom: 16px; }
  .login-product-name { padding-top: 14px; }
  .login-product-name strong { font-size: 34px; }
  .login-identity > p { margin-top: 13px; font-size: 11px; line-height: 1.5; }
  .access-scope-list { display: none; }
  .login-access-panel { padding: 38px 22px 54px; }
  .credential-form { margin-top: 26px; }
  .account-page-shell { min-height: auto; grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 390px) {
  .brand-logo { width: 62px; }
  .brand-divider, .brand-copy { display: none; }
  .topbar-actions { gap: 6px; }
  .language-switcher summary { min-width: 38px; padding-inline: 7px; }
  .account-avatar { width: 28px; height: 28px; }
  .account-menu > summary { min-height: 38px; grid-template-columns: 28px 10px; padding-inline: 5px; }
  .role-scope-banner dl { gap: 10px; }
  .login-brand-panel { padding-inline: 22px; }
  .login-logo { width: 155px; }
  .login-product-name strong, .login-access-inner > h1 { font-size: 35px; }
}

/* Change approval ledger — proposals remain outside the working dossier until accepted */
.nav-change-link { gap: 7px; }
.nav-notification-count { min-width: 20px; height: 20px; display: inline-grid; place-items: center; padding: 0 5px; border-radius: 999px; background: var(--highlight); color: var(--nav); font-size: 8px; font-weight: 850; font-variant-numeric: tabular-nums; line-height: 1; box-shadow: 0 0 0 3px rgba(245, 184, 25, .14); }

.changes-hero { position: relative; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: end; margin: 0 0 18px; padding: clamp(22px, 4vw, 38px); overflow: hidden; border: 1px solid #30486d; border-top: 4px solid var(--highlight); border-radius: var(--radius-lg); background: var(--nav); color: #fff; box-shadow: 0 18px 42px rgba(26, 44, 78, .17); }
.changes-hero::after { position: absolute; right: -54px; bottom: -54px; width: 180px; height: 180px; border: 1px solid rgba(245, 184, 25, .22); border-radius: 50%; content: ""; pointer-events: none; }
.changes-hero > div { min-width: 0; position: relative; z-index: 1; }
.changes-hero .eyebrow { color: #f6ce69 !important; }
.changes-hero h1 { max-width: 820px; margin: 7px 0 10px; color: #fff; font-size: clamp(31px, 4vw, 52px); letter-spacing: -.04em; line-height: 1; }
.changes-hero > div > p:last-child { max-width: 760px; margin: 0; color: #c4cfdd; font-size: 12px; line-height: 1.6; }
.change-stats { position: relative; z-index: 1; min-width: 345px; display: grid; grid-template-columns: repeat(3, minmax(92px, 1fr)); margin: 0; border: 1px solid #41577a; border-radius: 10px; background: rgba(11, 27, 52, .26); }
.change-stats > div { min-width: 0; padding: 14px 15px; border-right: 1px solid #41577a; }
.change-stats > div:last-child { border-right: 0; }
.change-stats dt { color: #aebbd0; font-size: 8px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.change-stats dd { margin: 5px 0 0; color: var(--highlight); font-size: 25px; font-weight: 820; font-variant-numeric: tabular-nums; letter-spacing: -.04em; }

.approval-workflow { min-width: 0; margin: 0 0 18px; padding: 18px; border: 1px solid #cbd5e2; border-left: 5px solid var(--highlight); border-radius: 11px; background: #fff; box-shadow: var(--shadow-sm); }
.approval-workflow > header { min-width: 0; display: grid; grid-template-columns: minmax(250px, .8fr) minmax(320px, 1.2fr); gap: 24px; align-items: end; margin-bottom: 16px; }
.approval-workflow > header > div, .approval-workflow-action { min-width: 0; }
.approval-workflow .eyebrow { margin: 0 0 5px; color: var(--highlight-ink); }
.approval-workflow h2 { margin: 0; color: var(--nav); font-size: 18px; letter-spacing: -.025em; line-height: 1.2; }
.approval-workflow > header > p, .approval-workflow-action > p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.approval-workflow-action { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.approval-workflow-action .text-link { flex: none; font-size: 9px; white-space: nowrap; }
.approval-workflow ol { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.approval-workflow li { position: relative; min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 0 16px; }
.approval-workflow li:first-child { padding-left: 0; }
.approval-workflow li:last-child { padding-right: 0; }
.approval-workflow li + li { border-left: 1px solid #d7dee8; }
.approval-workflow li > span { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid #314a70; border-radius: 50%; background: var(--nav); color: var(--highlight); font-size: 9px; font-weight: 850; }
.approval-workflow li strong { display: block; margin: 1px 0 4px; color: var(--nav); font-size: 9px; letter-spacing: .02em; }
.approval-workflow li p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.approval-workflow-compact { margin-top: -6px; }

.change-page-notice { margin: 0 0 14px; padding: 12px 14px; border: 1px solid #c5d8d2; border-left: 4px solid #387b6d; border-radius: 8px; background: #edf7f3; color: #225f54; font-size: 11px; font-weight: 670; line-height: 1.5; }
.change-page-notice.is-submitted { border-color: #dbc782; border-left-color: var(--highlight); background: #fff9e9; color: #6c5300; }
.change-page-notice.is-clarification { border-color: #dbc782; border-left-color: #a67500; background: #fff8e7; color: #745700; }
.change-page-notice.is-error { border-color: #efc8c4; border-left-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
.change-page-notice.is-warning { border-color: #e5d09a; border-left-color: #a67500; background: #fff8e7; color: #745700; }

.change-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, .82); box-shadow: var(--shadow-sm); }
.change-filters a { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 7px; color: var(--ink-soft); font-size: 10px; font-weight: 720; text-decoration: none; }
.change-filters a:hover { background: var(--surface-soft); color: var(--nav); }
.change-filters a[aria-current="page"] { background: var(--nav); color: #fff; box-shadow: inset 0 -3px var(--highlight); }
.change-filters b { min-width: 22px; display: inline-grid; place-items: center; padding: 3px 6px; border-radius: 999px; background: #e6ebf2; color: var(--nav); font-size: 8px; font-variant-numeric: tabular-nums; }
.change-filters a[aria-current="page"] b { background: var(--highlight); }

.change-ledger { position: relative; display: grid; gap: 12px; padding-left: 28px; }
.change-ledger::before { position: absolute; top: 16px; bottom: 16px; left: 10px; width: 2px; background: #c8d1df; content: ""; }
.change-card { position: relative; min-width: 0; overflow: visible; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.change-card::before { position: absolute; top: 24px; left: -23px; width: 11px; height: 11px; border: 3px solid var(--canvas); border-radius: 50%; background: var(--highlight); box-shadow: 0 0 0 2px #acb9ca; content: ""; }
.change-card[data-status="accepted"]::before { background: #3d8877; }
.change-card[data-status="clarification"]::before { background: #b57c00; }
.change-card[data-unread="true"] { border-color: #c4981d; box-shadow: inset 4px 0 var(--highlight), var(--shadow-sm); }
.change-card-header { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 17px 18px 14px; border-bottom: 1px solid var(--line); }
.change-sequence { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 7px; background: var(--nav); color: var(--highlight); font-size: 9px; font-weight: 820; font-variant-numeric: tabular-nums; }
.change-card-title { min-width: 0; }
.change-card-kicker { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-bottom: 4px; color: var(--highlight-ink); font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.change-unread-marker { padding: 3px 6px; border-radius: 4px; background: var(--copper-soft); color: var(--highlight-ink); font-size: 7px; letter-spacing: .03em; }
.change-card-title h2 { margin: 0; color: var(--nav); font-size: 16px; line-height: 1.3; }
.change-card-title > a { display: inline-block; margin-top: 5px; color: var(--muted); font-size: 9px; font-weight: 650; text-decoration: none; }
.change-card-title > a:hover { color: var(--nav); text-decoration: underline; text-underline-offset: 3px; }
.change-status { width: fit-content; padding: 6px 9px; border-radius: 999px; background: #edf1f6; color: var(--nav); font-size: 8px; font-weight: 780; white-space: nowrap; }
.change-status.is-accepted { background: #e0f0ea; color: #276f61; }
.change-status.is-clarification { background: #fff1c9; color: #785700; }

.change-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 12px 18px; border-bottom: 1px solid var(--line); background: #fafbfc; }
.change-meta > div { min-width: 0; padding-right: 16px; }
.change-meta > div + div { padding-left: 16px; border-left: 1px solid var(--line); }
.change-meta dt { color: var(--muted); font-size: 7px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.change-meta dd { margin: 4px 0 0; color: var(--ink-soft); font-size: 9px; font-weight: 620; line-height: 1.4; overflow-wrap: anywhere; }

.change-diff { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 30px minmax(0, 1fr); gap: 12px; align-items: stretch; padding: 16px 18px; }
.change-value { min-width: 0; padding: 12px 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.change-value > span { color: var(--muted); font-size: 7px; font-weight: 790; letter-spacing: .07em; text-transform: uppercase; }
.change-value p { margin: 7px 0 0; color: var(--ink); font-size: 10px; font-weight: 620; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.change-value-after { border-color: #d7c26e; background: #fffbef; box-shadow: inset 3px 0 var(--highlight); }
.change-diff-arrow { align-self: center; justify-self: center; color: #8592a4; font-size: 17px; }
.change-review-note { margin: 0 18px 16px; padding: 11px 13px; border-left: 3px solid #a67500; background: #fff8e7; }
.change-review-note strong { color: #745700; font-size: 9px; }
.change-review-note p { margin: 4px 0 0; color: #665526; font-size: 10px; line-height: 1.5; }

.change-actions { min-width: 0; display: flex; align-items: flex-start; gap: 8px; padding: 13px 18px; border-top: 1px solid var(--line); background: #fafbfc; }
.change-actions form { margin: 0; }
.change-actions button { min-height: 38px; }
.change-request-info { position: relative; }
.change-request-info > summary { min-height: 38px; display: inline-flex; align-items: center; padding: 8px 13px; border: 1px solid #d3b45c; border-radius: var(--radius-sm); background: #fff; color: #745700; cursor: pointer; font-size: 10px; font-weight: 730; list-style: none; }
.change-request-info > summary::-webkit-details-marker { display: none; }
.change-request-info[open] > summary { border-color: #a67500; background: #fff8e7; }
.change-request-info > form { width: min(470px, calc(100vw - 84px)); display: grid; gap: 10px; margin-top: 9px; padding: 13px; border: 1px solid #d8c071; border-radius: 8px; background: #fff; box-shadow: var(--shadow-md); }
.change-request-info textarea { min-height: 82px; }
.clarification-action { border-color: #8f6900; background: #8f6900; box-shadow: none; }
.clarification-action:hover { border-color: #705200; background: #705200; box-shadow: 0 7px 16px rgba(143, 105, 0, .18); }
.change-empty-state { min-height: 190px; display: grid; place-items: center; align-content: center; gap: 12px; text-align: center; }
.change-empty-state > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #e2eee9; color: #2d7768; font-size: 18px; font-weight: 830; }
.change-empty-state p { margin: 0; color: var(--muted); font-size: 11px; }

.pending-change-marker { width: fit-content; display: inline-flex; align-items: center; gap: 6px; margin: 7px 0 1px !important; padding: 5px 8px; border-radius: 6px; background: var(--copper-soft); color: var(--highlight-ink) !important; font-weight: 720; }
.pending-change-marker > span { width: 16px; height: 16px; display: grid; place-items: center; border-radius: 4px; background: var(--highlight); color: var(--nav); font-size: 8px; }
.pending-document-list { margin: 15px 0 0 51px; padding: 11px 12px; border: 1px solid #dfce93; border-left: 4px solid var(--highlight); border-radius: 8px; background: #fffaf0; }
.pending-document-list > strong { color: var(--highlight-ink); font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
.pending-document-list ul { display: grid; gap: 6px; margin: 9px 0 0; padding: 0; list-style: none; }
.pending-document-list li { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding-top: 6px; border-top: 1px solid #eadcb0; }
.pending-document-list li span { min-width: 0; color: var(--ink); font-size: 10px; font-weight: 650; overflow-wrap: anywhere; }
.pending-document-list li small { flex: none; color: var(--highlight-ink); font-size: 8px; }

.intake-photo-qualification { position: relative; overflow: hidden; margin-bottom: 16px; padding: 22px; border-top: 4px solid var(--highlight); }
.intake-photo-qualification::before { position: absolute; top: 0; right: 0; width: 180px; height: 180px; background: linear-gradient(135deg, transparent 52%, rgba(248, 187, 20, .12) 52% 61%, transparent 61%); pointer-events: none; content: ""; }
.photo-qualification-header { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: start; }
.photo-qualification-header h2 { margin: 4px 0 7px; color: var(--nav); font-size: clamp(20px, 2.6vw, 31px); line-height: 1.08; }
.photo-qualification-header > div:first-child > p:last-child { max-width: 790px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.photo-set-meter { min-width: 128px; display: grid; justify-items: end; padding: 12px 14px; border: 1px solid #d6dee8; border-radius: 10px; background: #f7f9fb; }
.photo-set-meter strong { color: var(--nav); font-size: 29px; line-height: 1; font-variant-numeric: tabular-nums; }
.photo-set-meter strong span { color: #7e8998; font-size: 14px; }
.photo-set-meter small { margin-top: 6px; color: var(--muted); font-size: 7px; font-weight: 760; letter-spacing: .06em; text-transform: uppercase; }
.photo-set-meter.is-ready { border-color: #d3b354; background: #fff9e8; }
.photo-set-meter.is-complete { border-color: #8cb7a8; background: #eaf4f0; }
.photo-upload-notice { margin: 16px 0 0; padding: 10px 12px; border-left: 4px solid #3d8877; border-radius: 7px; background: #edf7f3; color: #28685c; font-size: 10px; font-weight: 680; }
.photo-upload-notice.is-error { border-left-color: #b14b44; background: #fff1ef; color: #8a342e; }
.photo-coverage-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 18px; }
.photo-coverage-card { min-width: 0; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 9px; align-items: start; min-height: 112px; padding: 12px; border: 1px solid #d9e0e8; border-radius: 9px; background: #f8fafc; }
.photo-coverage-index { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; background: #e8edf3; color: #778397; font-size: 8px; font-weight: 820; }
.photo-coverage-card strong { color: var(--nav); font-size: 10px; line-height: 1.3; }
.photo-coverage-card p { margin: 5px 0 8px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.photo-coverage-card small { color: #8994a3; font-size: 7px; font-weight: 720; letter-spacing: .03em; text-transform: uppercase; }
.photo-coverage-card > b { min-width: 25px; display: grid; place-items: center; padding: 5px; border-radius: 999px; background: #e9edf2; color: var(--nav); font-size: 9px; font-variant-numeric: tabular-nums; }
.photo-coverage-card > b em { color: #9a7000; font-size: 7px; font-style: normal; }
.photo-coverage-card.is-pending { border-color: #dfc66e; background: #fffaf0; }
.photo-coverage-card.is-pending .photo-coverage-index { background: var(--highlight); color: var(--nav); }
.photo-coverage-card.is-covered { border-color: #9dc4b7; background: #f0f7f4; box-shadow: inset 0 -3px #4a8b7b; }
.photo-coverage-card.is-covered .photo-coverage-index { background: #397c6c; color: #fff; }
.photo-set-status { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 12px; padding: 13px 15px; border-left: 4px solid var(--highlight); border-radius: 8px; background: var(--nav); }
.photo-set-status-mark { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #5a6e8d; border-radius: 50%; color: var(--highlight); font-size: 15px; font-weight: 830; font-variant-numeric: tabular-nums; }
.photo-set-status strong { color: #fff; font-size: 11px; }
.photo-set-status p { margin: 4px 0 0; color: #bec9d9; font-size: 8px; line-height: 1.45; }
.qualification-photo-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.qualification-photo-card { position: relative; min-width: 0; overflow: hidden; display: grid; grid-template-rows: 115px auto; border: 1px solid #d8dfe8; border-radius: 9px; background: #fff; color: inherit; text-decoration: none; }
.qualification-photo-card img { width: 100%; height: 100%; object-fit: cover; background: #e9edf2; transition: transform .2s ease; }
.qualification-photo-card:hover img { transform: scale(1.035); }
.qualification-photo-card > span { min-width: 0; display: grid; gap: 3px; padding: 9px; }
.qualification-photo-card > span strong { min-width: 0; color: var(--nav); font-size: 9px; line-height: 1.3; overflow-wrap: anywhere; }
.qualification-photo-card > span small { color: var(--muted); font-size: 7px; }
.qualification-photo-card > b { position: absolute; top: 7px; left: 7px; padding: 4px 6px; border-radius: 5px; background: rgba(24, 50, 88, .9); color: #fff; font-size: 7px; }
.qualification-photo-card.is-pending > b { background: rgba(178, 127, 0, .92); }
.photo-upload-disclosure { margin-top: 14px; border: 1px solid #d3dce7; border-radius: 9px; background: #f8fafc; }
.photo-upload-disclosure > summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; color: var(--nav); cursor: pointer; font-size: 11px; font-weight: 780; list-style: none; }
.photo-upload-disclosure > summary::-webkit-details-marker { display: none; }
.photo-upload-disclosure > summary::after { color: #718096; content: "⌄"; }
.photo-upload-disclosure[open] > summary::after { transform: rotate(180deg); }
.photo-upload-disclosure > summary span { margin-left: auto; padding: 4px 7px; border-radius: 999px; background: var(--highlight); font-size: 8px; font-variant-numeric: tabular-nums; }
.qualification-photo-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; padding: 0 14px 14px; border-top: 1px solid #dde4ec; }
.qualification-photo-form > label { min-width: 0; display: grid; align-content: start; gap: 6px; margin-top: 13px; color: var(--ink-soft); font-size: 8px; font-weight: 720; }
.qualification-photo-form input, .qualification-photo-form select, .qualification-photo-form textarea { min-width: 0; width: 100%; }
.qualification-photo-form .photo-form-wide { grid-column: 1 / -1; }
.photo-file-field input { padding: 8px; border: 1px dashed #aebac9; background: #fff; }
.photo-permission { display: grid !important; grid-template-columns: 20px minmax(0, 1fr); align-items: start !important; padding: 10px 12px; border: 1px solid #d9c36f; border-radius: 7px; background: #fff9e9; }
.photo-permission input { width: 17px; height: 17px; margin: 0; accent-color: var(--nav); }
.photo-permission span { color: #5f501f; font-size: 8px; line-height: 1.5; }
.photo-form-submit { grid-column: 4; justify-self: end; min-width: 185px; }
.photo-materials-disclosure { margin-top: 12px; border-top: 1px solid #dfe5ec; }
.photo-materials-disclosure summary { padding-top: 11px; color: var(--muted); cursor: pointer; font-size: 8px; font-weight: 730; }
.photo-materials-disclosure p { margin: 7px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
.change-photo-preview { min-height: 170px; display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: stretch; margin: 14px 18px 0; overflow: hidden; border: 1px solid #d4dce6; border-radius: 9px; background: #f7f9fb; color: var(--nav); text-decoration: none; }
.change-photo-preview img { width: 100%; height: 170px; object-fit: cover; background: #e8edf3; }
.change-photo-preview span { display: grid; place-items: center; padding: 14px; font-size: 10px; font-weight: 750; }

[dir="rtl"] .change-card[data-unread="true"] { box-shadow: inset -4px 0 var(--highlight), var(--shadow-sm); }
[dir="rtl"] .change-value-after { box-shadow: inset -3px 0 var(--highlight); }
[dir="rtl"] .approval-workflow { border-right-width: 5px; border-left-width: 1px; }
[dir="rtl"] .approval-workflow li + li { border-right: 1px solid #d7dee8; border-left: 0; }
[dir="rtl"] .change-page-notice, [dir="rtl"] .pending-document-list { border-right-width: 4px; border-left-width: 1px; }
[dir="rtl"] .pending-document-list { margin-right: 51px; margin-left: 0; }

@media (max-width: 980px) {
  .supplier-location-picker > header { grid-template-columns: 1fr; align-items: start; }
  .location-external-link { justify-self: start; }
  .location-picker-layout { grid-template-columns: 1fr; }
  .changes-hero { grid-template-columns: 1fr; align-items: start; }
  .change-stats { min-width: 0; width: 100%; }
  .approval-workflow > header { grid-template-columns: 1fr; gap: 8px; align-items: start; }
  .approval-workflow ol { grid-template-columns: 1fr 1fr; gap: 14px 0; }
  .approval-workflow li:nth-child(3) { padding-left: 0; border-left: 0; }
  .change-meta { grid-template-columns: 1fr 1fr; gap: 10px 0; }
  .change-meta > div:nth-child(3) { grid-column: 1 / -1; padding: 10px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .photo-coverage-grid { grid-template-columns: 1fr 1fr; }
  .qualification-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .qualification-photo-form { grid-template-columns: 1fr 1fr; }
  .photo-form-submit { grid-column: 2; }
}

@media (max-width: 700px) {
  .supplier-location-picker { padding: 13px; }
  .location-picker-layout { grid-template-columns: minmax(0, 1fr); }
  .location-map-board { min-height: 210px; }
  .location-external-link { width: 100%; white-space: normal; text-align: center; }
  .approval-workflow { padding: 15px; }
  .approval-workflow-action { align-items: flex-start; flex-direction: column; gap: 8px; }
  .approval-workflow ol { grid-template-columns: 1fr; gap: 0; }
  .approval-workflow li, .approval-workflow li:first-child, .approval-workflow li:last-child { padding: 10px 0; }
  .approval-workflow li + li, .approval-workflow li:nth-child(3), [dir="rtl"] .approval-workflow li + li { border-top: 1px solid #d7dee8; border-right: 0; border-left: 0; }
  .change-ledger { padding-left: 0; }
  .change-ledger::before, .change-card::before { display: none; }
  .change-card-header { grid-template-columns: 34px minmax(0, 1fr); padding: 14px; }
  .change-sequence { width: 32px; height: 32px; }
  .change-status { grid-column: 2; justify-self: start; }
  .change-meta { grid-template-columns: 1fr; padding: 11px 14px; }
  .change-meta > div, .change-meta > div + div, .change-meta > div:nth-child(3) { grid-column: auto; padding: 7px 0; border-top: 0; border-left: 0; }
  .change-meta > div + div { border-top: 1px solid var(--line); }
  .change-diff { grid-template-columns: 1fr; padding: 14px; }
  .change-diff-arrow { transform: rotate(90deg); }
  .change-review-note { margin: 0 14px 14px; }
  .change-actions { align-items: stretch; flex-direction: column; padding: 12px 14px; }
  .change-actions > form button, .change-request-info, .change-request-info > summary { width: 100%; }
  .change-request-info > summary { justify-content: center; }
  .change-request-info > form { width: 100%; }
  .pending-document-list, [dir="rtl"] .pending-document-list { margin-right: 0; margin-left: 0; }
  .intake-photo-qualification { padding: 15px; }
  .photo-qualification-header { grid-template-columns: 1fr; }
  .photo-set-meter { width: 100%; justify-items: start; }
  .photo-coverage-grid, .qualification-photo-grid, .qualification-photo-form { grid-template-columns: 1fr; }
  .qualification-photo-card { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: 112px; }
  .qualification-photo-card > b { right: 7px; left: auto; }
  .qualification-photo-form .photo-form-wide, .photo-form-submit { grid-column: 1; }
  .photo-form-submit { width: 100%; min-width: 0; }
  .change-photo-preview { grid-template-columns: 1fr; margin: 12px 14px 0; }
  .change-photo-preview img { height: 190px; }
}

@media (max-width: 480px) {
  .change-filters { display: grid; grid-template-columns: 1fr 1fr; }
  .change-filters a { justify-content: space-between; }
  .change-stats { grid-template-columns: 1fr; }
  .change-stats > div { display: flex; align-items: center; justify-content: space-between; border-right: 0; border-bottom: 1px solid #41577a; }
  .change-stats > div:last-child { border-bottom: 0; }
  .change-stats dd { margin: 0; font-size: 21px; }
  .pending-document-list li { align-items: flex-start; flex-direction: column; gap: 3px; }
}