/* Design tokens (ui.md §2.2). */
:root {
  color-scheme: light;

  /* Palette (raw) */
  --sv-white: #ffffff;
  --sv-gray-50: #f5f7f8;  --sv-gray-100: #eceff2; --sv-gray-200: #dde2e6;
  --sv-gray-300: #c3cad1; --sv-gray-400: #8a949e; --sv-gray-500: #6b7682;
  --sv-gray-600: #5b6672; --sv-gray-700: #3d4752; --sv-gray-800: #27303a;
  --sv-gray-900: #1f2933;
  --sv-green-50: #edf7ef; --sv-green-100: #e6f2e8; --sv-green-600: #1d7a35;
  --sv-green-700: #196b24; --sv-green-800: #12521b; --sv-green-900: #12321a;
  --sv-blue-50: #eef5fd;  --sv-blue-600: #2563eb; --sv-blue-700: #1a5fb4;
  --sv-red-700: #b42318;  --sv-red-800: #912018;

  /* Semantic colors */
  --sv-color-bg: var(--sv-gray-50);                 /* page background */
  --sv-color-surface: var(--sv-white);              /* cards, tables, inputs */
  --sv-color-surface-muted: var(--sv-gray-50);      /* table header, zebra, read-only fields */
  --sv-color-surface-sunken: var(--sv-gray-100);
  --sv-color-text: var(--sv-gray-900);              /* 14.76:1 on white */
  --sv-color-text-muted: var(--sv-gray-600);        /* 5.85:1 on white, 5.45:1 on gray-50 */
  --sv-color-border: var(--sv-gray-200);            /* decorative separators only */
  --sv-color-border-strong: var(--sv-gray-400);     /* form control borders, 3.08:1 (1.4.11) */
  --sv-color-primary: var(--sv-green-700);          /* 6.62:1 both ways with white */
  --sv-color-primary-hover: var(--sv-green-800);    /* 9.34:1 with white */
  --sv-color-primary-subtle: var(--sv-green-100);   /* active nav bg; primary text on it 5.75:1 */
  --sv-color-on-primary: var(--sv-white);
  --sv-color-link: var(--sv-blue-700);              /* 6.29:1 */
  --sv-color-danger: var(--sv-red-700);             /* 6.57:1 both ways with white */
  --sv-color-danger-hover: var(--sv-red-800);
  --sv-color-success-text: var(--sv-green-600);     /* "Saved" 5.40:1 */
  --sv-color-focus: var(--sv-blue-600);             /* 5.17:1 vs white */
  --sv-color-topbar: var(--sv-white);               /* white top bar like the back office's header, 1px border below */
  --sv-color-on-topbar: var(--sv-color-text);       /* 14.76:1 on white */
  --sv-color-nav-text: var(--sv-gray-700);          /* side navigation items, 9.45:1 on white */
  --sv-color-nav-icon: var(--sv-gray-500);          /* side navigation icons, 4.63:1 on white */
  --sv-color-overlay: rgb(17 24 39 / 0.5);          /* dialog backdrop */

  /* Inspection / analysis result (InspectionResult, AnalysisResult) fg/bg ≥ 6.6:1 */
  --sv-result-pending-fg: #4a5561;       --sv-result-pending-bg: #eef1f4;       --sv-result-pending-border: #c3cad1;
  --sv-result-suspected-fg: #7a4a00;     --sv-result-suspected-bg: #fff1cc;     --sv-result-suspected-border: #e0a800;
  --sv-result-negative-fg: #1d5c2a;      --sv-result-negative-bg: #e1f3e5;      --sv-result-negative-border: #8fcb9b;
  --sv-result-positive-fg: #a11b1b;      --sv-result-positive-bg: #fde7e7;      --sv-result-positive-border: #ef9a9a;
  --sv-result-not-evaluable-fg: #5c3270; --sv-result-not-evaluable-bg: #efe4f5; --sv-result-not-evaluable-border: #c4a3d6;

  /* Site status (SiteStatus; also derived program status) */
  --sv-status-preparation-fg: #4a5561; --sv-status-preparation-bg: #eef1f4; --sv-status-preparation-border: #c3cad1;
  --sv-status-planning-fg: #6f5200;    --sv-status-planning-bg: #fcf6dc;    --sv-status-planning-border: #e3c75a;
  --sv-status-in-progress-fg: #1c4f8c; --sv-status-in-progress-bg: #dcecfc; --sv-status-in-progress-border: #93bdf0;
  --sv-status-closed-fg: #1d5c2a;      --sv-status-closed-bg: #e1f3e5;      --sv-status-closed-border: #8fcb9b;

  /* Sample status (SampleStatus) */
  --sv-sample-draft-fg: #4a5561;           --sv-sample-draft-bg: #eef1f4;           --sv-sample-draft-border: #c3cad1;
  --sv-sample-at-lab-fg: #1c4f8c;          --sv-sample-at-lab-bg: #dcecfc;          --sv-sample-at-lab-border: #93bdf0;
  --sv-sample-results-entered-fg: #0d5c58; --sv-sample-results-entered-bg: #d8f1ef; --sv-sample-results-entered-border: #86cfc8;
  --sv-sample-closed-fg: #1d5c2a;          --sv-sample-closed-bg: #e1f3e5;          --sv-sample-closed-border: #8fcb9b;

  /* Alerts / messages / toasts */
  --sv-info-fg: #1c4f8c;    --sv-info-bg: #eef5fd;    --sv-info-border: #93bdf0;     /* 7.51:1 */
  --sv-success-fg: #1d5c2a; --sv-success-bg: #e1f3e5; --sv-success-border: #8fcb9b;
  --sv-warning-fg: #7a4a00; --sv-warning-bg: #fff8e6; --sv-warning-border: #e0a800;  /* 7.06:1 */
  --sv-error-fg: #a11b1b;   --sv-error-bg: #fde7e7;   --sv-error-border: #ef9a9a;

  /* Review marker (legacy "blue-violet box") */
  --sv-review-fg: #3f3a8c; --sv-review-bg: #ecebfb; --sv-review-border: #a7a3e6;

  /* Typography */
  --sv-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --sv-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --sv-text-xs: 0.75rem;     /* 12px: meta, table captions */
  --sv-text-dense: 0.8125rem;/* 13px: dense tables (worklist, overview) */
  --sv-text-sm: 0.875rem;    /* 14px: tables, secondary text, buttons-sm */
  --sv-text-md: 1rem;        /* 16px: body, inputs (prevents iOS zoom) */
  --sv-text-lg: 1.125rem;    /* 18px: card titles (h3) */
  --sv-text-xl: 1.25rem;     /* 20px: section titles (h2) */
  --sv-text-2xl: 1.5rem;     /* 24px: page title (h1) mobile */
  --sv-text-3xl: 1.875rem;   /* 30px: page title (h1) ≥ 64em */
  --sv-leading-tight: 1.25;  --sv-leading-normal: 1.5;
  --sv-weight-regular: 400;  --sv-weight-medium: 500; --sv-weight-semibold: 600; --sv-weight-bold: 700;

  /* Spacing (4 px scale) */
  --sv-space-0: 0; --sv-space-1: 0.25rem; --sv-space-2: 0.5rem; --sv-space-3: 0.75rem; --sv-space-4: 1rem;
  --sv-space-5: 1.25rem; --sv-space-6: 1.5rem; --sv-space-8: 2rem; --sv-space-10: 2.5rem; --sv-space-12: 3rem; --sv-space-16: 4rem;

  /* Radius, shadows, focus */
  --sv-radius-sm: 4px; --sv-radius-md: 6px; --sv-radius-lg: 10px; --sv-radius-pill: 999px;
  --sv-shadow-sm: 0 1px 2px rgb(16 24 40 / 0.06);
  --sv-shadow-md: 0 4px 8px -2px rgb(16 24 40 / 0.10), 0 2px 4px -2px rgb(16 24 40 / 0.06);
  --sv-shadow-lg: 0 12px 24px -4px rgb(16 24 40 / 0.14), 0 4px 8px -4px rgb(16 24 40 / 0.08);
  --sv-focus-ring: 0 0 0 2px var(--sv-white), 0 0 0 4px var(--sv-color-focus);

  /* Sizes */
  --sv-control-height: 2.25rem;    /* 36px; 44px on coarse pointers */
  --sv-control-height-sm: 1.875rem;
  --sv-topbar-height: 3.5rem;
  --sv-sidenav-width: 14.375rem; --sv-sidenav-width-collapsed: 4rem;
  --sv-content-max: 90rem;  --sv-form-max: 48rem; --sv-dialog-sm: 28rem; --sv-dialog-md: 40rem; --sv-dialog-lg: 56rem;
  --sv-map-height: 20rem;   --sv-map-height-expanded: 70vh;

  /* Layering, motion */
  --sv-z-sticky: 10; --sv-z-sidenav: 90; --sv-z-topbar: 100; --sv-z-dropdown: 200; --sv-z-toast: 1000;
  --sv-duration-fast: 120ms; --sv-duration: 200ms; --sv-ease: cubic-bezier(0.2, 0, 0, 1);
}
@media (pointer: coarse) {
  :root { --sv-control-height: 2.75rem; --sv-control-height-sm: 2.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  :root { --sv-duration-fast: 0ms; --sv-duration: 0ms; }
}