:root {
  /* Code highlighting (Shiki css-variables theme) */
  --code-foreground: var(--grey-900);
  --code-token-keyword: var(--plum-700);
  --code-token-string: var(--pine-500);
  --code-token-string-expression: var(--pine-500);
  --code-token-constant: var(--plum-500);
  --code-token-function: var(--grey-950);
  --code-token-parameter: var(--grey-700);
  --code-token-comment: var(--grey-500);
  --code-token-punctuation: var(--grey-500);
  --code-token-link: var(--plum-700);

  /* Font families. The @font-face declarations above register Geist and
     Geist Mono for product UI and code/data surfaces. */
  --font-sans:
    "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono:
    "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-heading: var(--font-sans);

  /* Background */
  --bg: #ffffff;
  --bg-secondary: #fafafa;
  --bg-inverse: #0a0a0a;

  /* Foreground / Text */
  --text: #0a0a0a;
  --text-secondary: #525252;
  --text-disabled: #a3a3a3;
  --text-inverse: #f4ebf1;
  --text-inverse-secondary: #f2e0ec;

  /* Border */
  --border: #d4d4d4;
  --border-hover: #a3a3a3;
  --border-contrast: rgba(0, 0, 0, 0.06);

  /* Grey scale */
  --grey-50: #fafafa;
  --grey-100: #f5f5f5;
  --grey-200: #e5e5e5;
  --grey-300: #d4d4d4;
  --grey-400: #a3a3a3;
  --grey-500: #737373;
  --grey-600: #525252;
  --grey-700: #404040;
  --grey-800: #262626;
  --grey-900: #171717;
  --grey-950: #0a0a0a;

  /* Plum scale (brand) */
  --plum-50: #f4ebf1;
  --plum-100: #f2e0ec;
  --plum-200: #e3bdd6;
  --plum-300: #d59dc3;
  --plum-400: #b86da3;
  --plum-500: #9a4082;
  --plum-600: #7a2d66;
  --plum-700: #5e1f4e;
  --plum-800: #4b163d;
  --plum-900: #380f2d;
  --plum-950: #1e0517;

  /* Node identity tones */
  --honey-100: #ede2c9;
  --honey-500: #dba943;
  --honey-600: #c18d25;
  --slate-100: #d7dbe4;
  --slate-400: #6b89c0;
  --rust-100: #edd9d4;
  --rust-400: #da8660;
  --pine-100: #d2dfd9;
  --pine-500: #46a579;
  --pine-600: #34845f;

  /* Button tokens */
  --button-cta-bg: var(--plum-800);
  --button-cta-bg-hover: var(--plum-900);
  --button-cta-label: var(--plum-50);
  --button-primary-bg: var(--plum-50);
  --button-primary-bg-hover: var(--plum-100);
  --button-primary-label: var(--plum-800);
  --button-secondary-bg: #ffffff;
  --button-secondary-bg-hover: var(--grey-50);
  --button-secondary-border: var(--grey-300);
  --button-secondary-border-hover: var(--grey-400);
  --button-secondary-label: var(--grey-950);
  --button-secondary-label-hover: var(--grey-700);
  --button-tertiary-bg-hover: var(--grey-100);
  --button-tertiary-label: var(--grey-600);
  --button-tertiary-label-hover: var(--grey-700);
  --button-destructive-bg: #dc2626;
  --button-destructive-bg-hover: #b91c1c;
  --button-destructive-label: #ffffff;

  /* Status semantic tokens */
  --status-destructive: #dc2626;
  --status-destructive-light: #fef2f2;
  --status-destructive-text: #91252b;
  --status-destructive-hover: #b91c1c;
  --status-success: #16a34a;
  --status-success-light: #f0fdf4;
  --status-success-text: #15803d;
  --status-warning: #d97706;
  --status-warning-light: #fffbeb;
  --status-warning-text: #92400e;

  /* Diff tokens: removed text on light red, added text on light green */
  --diff-removed-bg: rgba(211, 91, 97, 0.18);
  --diff-removed-text: #6b171b;
  --diff-added-bg: rgba(70, 165, 121, 0.2);
  --diff-added-text: #143d2a;

  /* Confidence semantic tokens — workflow palette (pine/honey/carmine 500)
     used by extraction-confidence indicators. Distinct from status tokens
     because confidence reads as a quality scale, not an alert level. */
  --confidence-high: #46a579;
  --confidence-med: #dba943;
  --confidence-low: #b33c41;

  /* Table tokens */
  --table-cell-bg: #ffffff;
  --table-cell-bg-hover: var(--grey-50);
  --table-cell-border: var(--grey-200);
  --table-cell-border-active: var(--plum-500);
  --table-header-bg: var(--grey-100);
  --table-header-border: var(--grey-200);
  --table-row-selected-bg: var(--grey-100);
  --table-row-selected-bg-hover: var(--grey-100);
  --table-row-selected-sticky-bg: var(--grey-200);
  --table-row-selected-fg: var(--grey-900);
  --table-selection-strong: var(--grey-900);

  /* Input tokens */
  --input-bg: #ffffff;
  --input-bg-hover: var(--grey-50);
  --input-bg-disabled: var(--grey-200);
  --input-bg-readonly: var(--grey-100);
  --input-border: var(--grey-300);
  --input-border-hover: var(--grey-400);
  --input-border-active: #6f255b;
  --input-border-error: #b33c41;
  --input-border-disabled: var(--grey-200);
  --input-text: var(--grey-900);
  --input-text-placeholder: var(--grey-500);
  --input-text-disabled: var(--grey-400);
  --input-text-readonly: var(--grey-500);
  --input-text-error: #91252b;
  --input-icon: var(--grey-600);
  --input-icon-disabled: var(--grey-400);
  --input-label: var(--grey-900);
  --input-label-disabled: var(--grey-500);
  --input-label-readonly: var(--grey-500);
  --input-help: var(--grey-500);
  --input-focus-ring: var(--plum-200);
  --input-focus-ring-error: #dbabae;

  /* Sidebar tokens */
  --sidebar-bg: var(--bg);
  --sidebar-item-active-bg: var(--grey-100);
  --sidebar-item-active-text: var(--grey-950);
  --sidebar-item-inactive-text: var(--grey-500);
  --sidebar-item-hover-bg: var(--grey-100);
  --sidebar-item-hover-text: var(--grey-800);
  --sidebar-item-disabled-text: var(--grey-300);
  --sidebar-folder-bg: var(--grey-50);
  --sidebar-folder-active-bg: var(--grey-100);
  --sidebar-folder-text: var(--grey-500);
  --sidebar-folder-hover-bg: var(--grey-100);
  --sidebar-folder-hover-text: var(--grey-800);
  --sidebar-badge-bg: var(--grey-300);
  --sidebar-badge-text: var(--grey-500);

  /* Icon tokens */
  --icon: var(--grey-950);
  --icon-hover: var(--grey-600);
  --icon-disabled: var(--grey-400);
  --icon-inverse: #ffffff;

  /* Avatar palette (accent colors for reference) */
  --avatar-stone: #d6d3d1;
  --avatar-slate: #94a3b8;
  --avatar-pine: #4ade80;
  --avatar-rust: #f97316;
  --avatar-honey: #eab308;
  --avatar-plum: #c084fc;
  --avatar-carmine: #f43f5e;

  /* Avatar background & label colors (from Figma tag tokens) */
  --avatar-stone-bg: #e5e5e5;
  --avatar-stone-label: #0a0a0a;
  --avatar-slate-bg: #d7dbe4;
  --avatar-slate-label: #142b4b;
  --avatar-pine-bg: #e9edea;
  --avatar-pine-label: #143d2a;
  --avatar-rust-bg: #efe8e3;
  --avatar-rust-label: #7a3d14;
  --avatar-honey-bg: #ede2c9;
  --avatar-honey-label: #835f16;
  --avatar-plum-bg: #f4ebf1;
  --avatar-plum-label: #4b163d;
  --avatar-carmine-bg: #ebe3e2;
  --avatar-carmine-label: #6b171b;

  /* Spacing scale */
  --space-0: 0px;
  --space-0-5: 2px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-3-5: 14px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;

  /* Border radius */
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-full: 9999px;

  /* Overlay stacking: floating surfaces must clear modals, toasts clear everything */
  --z-modal: 9999;
  --z-floating: 10000;
  --z-tooltip: 10001;
  --z-toast: 10002;

  /* Border width */
  --border-width-none: 0px;
  --border-width-xs: 0.5px;
  --border-width-sm: 1px;
  --border-width-md: 2px;
  --border-width-lg: 4px;

  /* Checkbox tokens */
  --checkbox-bg: #ffffff;
  --checkbox-border: var(--border);
  --checkbox-border-hover: var(--border-hover);
  --checkbox-active-bg: #f5f5f5;
  --checkbox-active-border: var(--border-hover);
  --checkbox-checked-bg: var(--grey-950);
  --checkbox-checked-bg-hover: var(--grey-800);
  --checkbox-checked-bg-active: var(--grey-950);
  --checkbox-disabled-bg: var(--grey-50);
  --checkbox-disabled-border: #e5e5e5;
  --checkbox-disabled-checked-bg: var(--grey-100);
  --checkbox-indicator-color: #ffffff;
  --checkbox-disabled-indicator-color: var(--grey-300);

  /* Radio tokens */
  --radio-bg: #ffffff;
  --radio-border: var(--border);
  --radio-border-hover: var(--border-hover);
  --radio-active-bg: #f5f5f5;
  --radio-active-border: var(--border-hover);
  --radio-checked-bg: var(--plum-800);
  --radio-checked-bg-hover: var(--plum-900);
  --radio-checked-bg-active: var(--plum-800);
  --radio-disabled-bg: var(--grey-50);
  --radio-disabled-border: #e5e5e5;
  --radio-disabled-checked-bg: var(--plum-50);
  --radio-dot-color: #ffffff;
  --radio-disabled-dot-color: var(--plum-200);

  /* Switch tokens */
  --switch-track-bg: #e5e5e5;
  --switch-track-bg-hover: #d4d4d4;
  --switch-track-bg-active: #a3a3a3;
  --switch-track-checked-bg: var(--plum-800);
  --switch-track-checked-bg-hover: var(--plum-900);
  --switch-track-checked-bg-active: var(--plum-800);
  --switch-track-disabled-bg: #e5e5e5;
  --switch-track-disabled-checked-bg: var(--plum-50);
  --switch-thumb-bg: var(--grey-50);
  --switch-thumb-checked-bg: var(--plum-50);
  --switch-thumb-disabled-bg: var(--grey-300);
  --switch-thumb-disabled-checked-bg: var(--plum-100);

  /* Golden dataset tokens: only for the golden state, never warnings */
  --golden: #c99212;
  --golden-bg: #fdf6e3;
  --golden-text: #845400;
  --golden-border: #ecd28c;

  /* Tag tokens */
  --tag-plum-bg: #f4ebf1;
  --tag-plum-text: #4b163d;
  --tag-pine-bg: #e9edea;
  --tag-pine-text: #143d2a;
  --tag-rust-bg: #efe8e3;
  --tag-rust-text: #7a3d14;
  --tag-slate-bg: #e2e7ec;
  --tag-slate-text: #142b4b;
  --tag-grey-bg: #e5e5e5;
  --tag-grey-text: #0a0a0a;

  /* Link tokens */
  --link-text: #6f255b;
  --link-text-hover: #4b163d;
  --link-text-active: #380f2d;
  --link-inverse-text: #be7dac;
  --link-inverse-text-hover: var(--plum-200);
  --link-inverse-text-active: #8a3d76;

  /* Select tokens */
  --select-focus-border: #6f255b;
  --select-focus-ring: var(--plum-200);
  --select-error-focus-ring: #dbabae;
  --select-disabled-bg: #e5e5e5;
  --select-disabled-border: #e5e5e5;
  --select-error-text: #91252b;

  /* Tooltip tokens */
  --tooltip-bg: var(--grey-950);
  --tooltip-text: #ffffff;
  --tooltip-shadow: 0 4px 12px rgba(15, 16, 20, 0.15);

  /* Shadows */
  --shadow-xs: 0px 1px 2px 0px hsla(60, 2%, 10%, 0.05);
  --shadow-sm: 0 8px 24px -4px rgba(15, 16, 20, 0.1);
  --shadow-md: 0 12px 32px 4px rgba(15, 16, 20, 0.1);
  --shadow-popover:
    0 1px 2px rgba(15, 16, 20, 0.04), 0 8px 24px -6px rgba(15, 16, 20, 0.14);

  /* Flow tab tokens */
  --flow-tab-active-bg: var(--plum-50);
  --flow-tab-active-border: var(--plum-200);
  --flow-tab-active-text: var(--plum-900);
  --flow-tab-active-hover-bg: var(--plum-100);
  --flow-tab-hover-bg: var(--grey-100);

  /* Segmented control tokens */
  --segmented-bg: var(--grey-100);
  --segmented-border: var(--grey-200);
  --segmented-text: var(--grey-600);
  --segmented-text-hover: var(--grey-950);
  --segmented-hover-bg: var(--grey-50);
  --segmented-active-bg: #ffffff;
  --segmented-active-text: var(--grey-950);
  --segmented-active-shadow: var(--shadow-xs);
  --segmented-focus-ring: var(--plum-200);

  /* Toast tokens */
  --toast-default-bg: #e5e5e5;
  --toast-default-text: #0a0a0a;
  --toast-default-icon: #0a0a0a;
  --toast-default-action: #1c1917;
  --toast-default-close: #0a0a0a;
  --toast-highlight-bg: #4b163d;
  --toast-highlight-text: #f4ebf1;
  --toast-highlight-icon: #f4ebf1;
  --toast-highlight-action: #ffffff;
  --toast-highlight-close: #f4ebf1;
  --toast-success-bg: #143d2a;
  --toast-success-text: #e9edea;
  --toast-success-icon: #e9edea;
  --toast-success-action: #ffffff;
  --toast-success-close: #e9edea;
  --toast-warning-bg: #7a3d14;
  --toast-warning-text: #efe8e3;
  --toast-warning-icon: #efe8e3;
  --toast-warning-action: #ffffff;
  --toast-warning-close: #efe8e3;
  --toast-error-bg: #91252b;
  --toast-error-text: #ebe3e2;
  --toast-error-icon: #ebe3e2;
  --toast-error-action: #ffffff;
  --toast-error-close: #ebe3e2;
  --toast-inverted-bg: #0a0a0a;
  --toast-inverted-text: #fafafa;
  --toast-inverted-border: #fafafa;
  --toast-inverted-icon: #fafafa;
  --toast-inverted-action: #fafafa;
  --toast-inverted-close: #fafafa;

  /* Dialog tokens */
  --dialog-bg: #ffffff;
  --dialog-shadow:
    0px 2px 8px 0px rgba(15, 16, 20, 0.08),
    0px 16px 48px 0px rgba(15, 16, 20, 0.16);
  --dialog-light-shadow: 0px 4px 12px 0px rgba(15, 16, 20, 0.06);
  --dialog-title: #171717;
  --dialog-description: #737373;
  --dialog-close: var(--grey-950);

  /* Menu tokens */
  --menu-destructive-text: #91252b;

  /* Resource card tokens */
  --resource-card-thumb-bg: var(--grey-100);

  /* Resource list tokens */
  --resource-list-row-hover-bg: var(--grey-50);
  --resource-list-action-hover-bg: var(--grey-100);
  --resource-list-page-active-bg: var(--plum-50);
  --resource-list-page-active-text: var(--plum-800);
  --resource-list-page-hover-bg: var(--grey-100);

  /* Result tokens */
  --result-selected-bg: var(--plum-50);
  --result-selected-border: var(--plum-200);

  /* Search match tokens */
  --search-match-bg: color-mix(in srgb, var(--honey-500) 28%, transparent);
  --search-match-active-bg: color-mix(
    in srgb,
    var(--honey-500) 60%,
    transparent
  );

  /* Selected document box tokens. A box keeps its own hue (`--bbox-color`),
     shaded toward --bbox-selected-shade and filled more densely; its result row is neutral. */
  --bbox-selected-shade: var(--grey-950);
  --bbox-selected-shade-amount: 25%;
  --bbox-selected-fill-alpha: 45%;
  --bbox-selected-halo-alpha: 55%;
  --bbox-selected-stroke: color-mix(in srgb, var(--grey-500) 45%, transparent);
  --bbox-selected-row-bg: color-mix(in srgb, var(--grey-500) 12%, transparent);
  --bbox-dimmed-opacity: 0.3;

  /* Run bar tokens */
  --run-bar-stop-bg: var(--grey-200);
  --run-bar-stop-text: var(--grey-800);
  --run-bar-stop-hover-bg: var(--grey-300);
  --run-bar-run-bg: var(--plum-50);
  --run-bar-run-text: var(--plum-800);
  --run-bar-run-hover-bg: var(--plum-100);

  /* Table tokens */
  --table-footer-hover-bg: var(--grey-100);

  /* Font sizes */
  --text-xs-2: 13px;
  --text-xs: 14px;
  --text-sm: 15px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 20px;

  /* Line heights */
  --leading-xs: 16px;
  --leading-sm: 20px;
  --leading-base: 24px;
  --leading-lg: 28px;
}

.dark {
  --code-foreground: var(--grey-100);
  --code-token-keyword: var(--plum-300);
  --code-token-string: var(--pine-100);
  --code-token-string-expression: var(--pine-100);
  --code-token-constant: var(--plum-200);
  --code-token-function: var(--grey-50);
  --code-token-parameter: var(--grey-300);
  --code-token-punctuation: var(--grey-400);
  --code-token-link: var(--plum-300);

  /* Background */
  --bg: #0a0a0a;
  --bg-secondary: #171717;
  --bg-inverse: #fafafa;

  /* Foreground / Text */
  --text: #fafafa;
  --text-secondary: #a3a3a3;
  --text-disabled: #525252;
  --text-inverse: #1e0517;
  --text-inverse-secondary: #380f2d;

  /* Border */
  --border: #262626;
  --border-hover: #404040;
  --border-contrast: rgba(255, 255, 255, 0.06);

  /* Button tokens (dark mode) */
  --button-cta-bg: var(--plum-50);
  --button-cta-bg-hover: #ffffff;
  --button-cta-label: var(--plum-900);
  --button-primary-bg: var(--plum-900);
  --button-primary-bg-hover: var(--plum-800);
  --button-primary-label: var(--plum-50);
  --button-secondary-bg: var(--grey-900);
  --button-secondary-bg-hover: var(--grey-800);
  --button-secondary-border: var(--grey-700);
  --button-secondary-border-hover: var(--grey-600);
  --button-secondary-label: var(--grey-100);
  --button-secondary-label-hover: var(--grey-200);
  --button-tertiary-bg-hover: var(--grey-800);
  --button-tertiary-label: var(--grey-400);
  --button-tertiary-label-hover: var(--grey-300);
  --button-destructive-bg: #dc2626;
  --button-destructive-bg-hover: #ef4444;
  --button-destructive-label: #ffffff;

  /* Status semantic tokens (dark) */
  --status-destructive: #ef4444;
  --status-destructive-light: #450a0a;
  --status-destructive-text: #fca5a5;
  --status-destructive-hover: #dc2626;
  --status-success: #4ade80;
  --status-success-light: #052e16;
  --status-success-text: #86efac;
  --status-warning: #fbbf24;
  --status-warning-light: #451a03;
  --status-warning-text: #fde68a;

  /* Diff tokens (dark) */
  --diff-removed-bg: rgba(211, 91, 97, 0.28);
  --diff-removed-text: #f5c2c4;
  --diff-added-bg: rgba(70, 165, 121, 0.28);
  --diff-added-text: #bfe3d1;

  /* Confidence semantic tokens (dark) — workflow palette pine/honey/carmine
     400 for slightly brighter readout on dark surfaces. */
  --confidence-high: #66b892;
  --confidence-med: #ebbd60;
  --confidence-low: #d35b61;

  /* Input tokens (dark mode) */
  --input-bg: var(--grey-950);
  --input-bg-hover: var(--grey-900);
  --input-bg-disabled: var(--grey-800);
  --input-bg-readonly: var(--grey-900);
  --input-border: var(--grey-800);
  --input-border-hover: var(--grey-700);
  --input-border-active: var(--plum-400);
  --input-border-error: #e5484d;
  --input-border-disabled: var(--grey-800);
  --input-text: var(--grey-100);
  --input-text-placeholder: var(--grey-500);
  --input-text-disabled: var(--grey-600);
  --input-text-readonly: var(--grey-500);
  --input-text-error: #e5484d;
  --input-icon: var(--grey-400);
  --input-icon-disabled: var(--grey-600);
  --input-label: var(--grey-100);
  --input-label-disabled: var(--grey-500);
  --input-label-readonly: var(--grey-500);
  --input-help: var(--grey-500);
  --input-focus-ring: var(--plum-800);
  --input-focus-ring-error: #522b29;

  /* Sidebar tokens */
  --sidebar-bg: var(--grey-900);
  --sidebar-item-active-bg: var(--grey-800);
  --sidebar-item-active-text: var(--grey-100);
  --sidebar-item-inactive-text: var(--grey-500);
  --sidebar-item-hover-bg: var(--grey-800);
  --sidebar-item-hover-text: var(--grey-400);
  --sidebar-item-disabled-text: var(--grey-700);
  --sidebar-folder-bg: var(--grey-900);
  --sidebar-folder-active-bg: var(--grey-800);
  --sidebar-folder-text: var(--grey-400);
  --sidebar-folder-hover-bg: var(--grey-800);
  --sidebar-folder-hover-text: var(--grey-300);
  --sidebar-badge-bg: var(--grey-700);
  --sidebar-badge-text: var(--grey-400);

  /* Icon tokens */
  --icon: var(--grey-100);
  --icon-hover: var(--grey-300);
  --icon-disabled: var(--grey-600);
  --icon-inverse: #0a0a0a;

  /* Checkbox tokens (dark) */
  --checkbox-bg: var(--grey-900);
  --checkbox-border: var(--grey-700);
  --checkbox-border-hover: var(--grey-600);
  --checkbox-active-bg: var(--grey-800);
  --checkbox-active-border: var(--grey-600);
  --checkbox-checked-bg: var(--grey-50);
  --checkbox-checked-bg-hover: var(--grey-200);
  --checkbox-checked-bg-active: var(--grey-50);
  --checkbox-disabled-bg: var(--grey-800);
  --checkbox-disabled-border: var(--grey-700);
  --checkbox-disabled-checked-bg: var(--grey-700);
  --checkbox-indicator-color: var(--grey-950);
  --checkbox-disabled-indicator-color: var(--grey-500);

  /* Radio tokens (dark) */
  --radio-bg: var(--grey-900);
  --radio-border: var(--grey-700);
  --radio-border-hover: var(--grey-600);
  --radio-active-bg: var(--grey-800);
  --radio-active-border: var(--grey-600);
  --radio-checked-bg: var(--plum-200);
  --radio-checked-bg-hover: var(--plum-100);
  --radio-checked-bg-active: var(--plum-200);
  --radio-disabled-bg: var(--grey-800);
  --radio-disabled-border: var(--grey-700);
  --radio-disabled-checked-bg: var(--plum-900);
  --radio-dot-color: var(--plum-800);
  --radio-disabled-dot-color: var(--plum-700);

  /* Switch tokens (dark) */
  --switch-track-bg: var(--grey-700);
  --switch-track-bg-hover: var(--grey-600);
  --switch-track-bg-active: var(--grey-500);
  --switch-track-checked-bg: var(--plum-200);
  --switch-track-checked-bg-hover: var(--plum-100);
  --switch-track-checked-bg-active: var(--plum-200);
  --switch-track-disabled-bg: var(--grey-700);
  --switch-track-disabled-checked-bg: var(--plum-900);
  --switch-thumb-bg: var(--grey-200);
  --switch-thumb-checked-bg: var(--plum-800);
  --switch-thumb-disabled-bg: var(--grey-600);
  --switch-thumb-disabled-checked-bg: var(--plum-700);

  /* Golden dataset tokens (dark) */
  --golden: #e0b24a;
  --golden-bg: #2a2210;
  --golden-text: #f0d48a;
  --golden-border: #6b5320;

  /* Tag tokens (dark) */
  --tag-plum-bg: #4b163d;
  --tag-plum-text: #f4ebf1;
  --tag-pine-bg: #143d2a;
  --tag-pine-text: #e9edea;
  --tag-rust-bg: #7a3d14;
  --tag-rust-text: #efe8e3;
  --tag-slate-bg: #142b4b;
  --tag-slate-text: #e2e7ec;
  --tag-grey-bg: #404040;
  --tag-grey-text: #e5e5e5;

  /* Link tokens (dark) */
  --link-text: var(--plum-400);
  --link-text-hover: var(--plum-200);
  --link-text-active: #8a3d76;
  --link-inverse-text: var(--plum-600);
  --link-inverse-text-hover: var(--plum-800);
  --link-inverse-text-active: var(--plum-400);

  /* Select tokens (dark) */
  --select-focus-border: var(--plum-200);
  --select-focus-ring: var(--plum-800);
  --select-error-focus-ring: #5c2b2e;
  --select-disabled-bg: var(--grey-800);
  --select-disabled-border: var(--grey-800);
  --select-error-text: #f2a3a7;

  /* Tooltip tokens (dark) */
  --tooltip-bg: var(--grey-800);
  --tooltip-text: var(--grey-50);
  --tooltip-shadow:
    0px 1px 6px 0px rgba(0, 0, 0, 0.24), 0px 1px 2px 0px rgba(0, 0, 0, 0.32);

  /* Shadows (dark) */
  --shadow-xs:
    0 0 0 1px rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.08),
    0 2px 4px 0 rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 8px 24px -4px rgba(0, 0, 0, 0.24);
  --shadow-md: 0 12px 32px 4px rgba(0, 0, 0, 0.32);
  --shadow-popover:
    0 1px 2px rgba(0, 0, 0, 0.2), 0 8px 24px -6px rgba(0, 0, 0, 0.4);

  /* Flow tab tokens (dark) */
  --flow-tab-active-bg: var(--plum-900);
  --flow-tab-active-border: var(--plum-800);
  --flow-tab-active-text: var(--plum-100);
  --flow-tab-active-hover-bg: var(--plum-800);
  --flow-tab-hover-bg: var(--grey-800);

  /* Segmented control tokens (dark) */
  --segmented-bg: var(--grey-900);
  --segmented-border: var(--grey-700);
  --segmented-text: var(--grey-400);
  --segmented-text-hover: var(--grey-100);
  --segmented-hover-bg: var(--grey-800);
  --segmented-active-bg: var(--grey-800);
  --segmented-active-text: var(--grey-100);
  --segmented-active-shadow: var(--shadow-xs);
  --segmented-focus-ring: var(--plum-800);

  /* Toast tokens (dark) */
  --toast-default-bg: #404040;
  --toast-default-text: #e5e5e5;
  --toast-default-icon: #e5e5e5;
  --toast-default-action: #ffffff;
  --toast-default-close: #e5e5e5;
  --toast-highlight-bg: #f4ebf1;
  --toast-highlight-text: #4b163d;
  --toast-highlight-icon: #4b163d;
  --toast-highlight-action: #4b163d;
  --toast-highlight-close: #4b163d;
  --toast-success-bg: #e9edea;
  --toast-success-text: #143d2a;
  --toast-success-icon: #143d2a;
  --toast-success-action: #143d2a;
  --toast-success-close: #143d2a;
  --toast-warning-bg: #efe8e3;
  --toast-warning-text: #7a3d14;
  --toast-warning-icon: #7a3d14;
  --toast-warning-action: #7a3d14;
  --toast-warning-close: #7a3d14;
  --toast-error-bg: #ebe3e2;
  --toast-error-text: #91252b;
  --toast-error-icon: #91252b;
  --toast-error-action: #91252b;
  --toast-error-close: #91252b;
  --toast-inverted-bg: #fafafa;
  --toast-inverted-text: #0a0a0a;
  --toast-inverted-border: #0a0a0a;
  --toast-inverted-icon: #0a0a0a;
  --toast-inverted-action: #0a0a0a;
  --toast-inverted-close: #0a0a0a;

  /* Dialog tokens (dark) */
  --dialog-bg: var(--grey-900);
  --dialog-shadow: 0px 12px 32px 4px rgba(0, 0, 0, 0.32);
  --dialog-light-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.18);
  --dialog-title: var(--grey-50);
  --dialog-description: var(--grey-400);
  --dialog-close: var(--grey-100);

  /* Menu tokens (dark) */
  --menu-destructive-text: #f2a3a7;

  /* Resource card tokens (dark) */
  --resource-card-thumb-bg: var(--grey-800);

  /* Resource list tokens (dark) */
  --resource-list-row-hover-bg: var(--grey-900);
  --resource-list-action-hover-bg: var(--grey-800);
  --resource-list-page-active-bg: var(--plum-900);
  --resource-list-page-active-text: var(--plum-50);
  --resource-list-page-hover-bg: var(--grey-800);

  /* Result tokens (dark) */
  --result-selected-bg: var(--plum-900);
  --result-selected-border: var(--plum-800);

  /* Search match tokens (dark) */
  --search-match-bg: color-mix(in srgb, var(--honey-500) 30%, transparent);
  --search-match-active-bg: color-mix(
    in srgb,
    var(--honey-500) 62%,
    transparent
  );

  /* Selected document box tokens (dark) */
  --bbox-selected-shade: var(--grey-950);
  --bbox-selected-shade-amount: 10%;
  --bbox-selected-fill-alpha: 55%;
  --bbox-selected-halo-alpha: 65%;
  --bbox-selected-stroke: color-mix(in srgb, var(--grey-500) 55%, transparent);
  --bbox-selected-row-bg: color-mix(in srgb, var(--grey-500) 22%, transparent);
  --bbox-dimmed-opacity: 0.35;

  /* Run bar tokens (dark) */
  --run-bar-stop-bg: var(--grey-700);
  --run-bar-stop-text: var(--grey-200);
  --run-bar-stop-hover-bg: var(--grey-600);
  --run-bar-run-bg: var(--plum-900);
  --run-bar-run-text: var(--plum-50);
  --run-bar-run-hover-bg: var(--plum-800);

  /* Table tokens (dark) */
  --table-footer-hover-bg: var(--grey-800);
  --table-row-selected-bg: var(--grey-800);
  --table-row-selected-bg-hover: var(--grey-800);
  --table-row-selected-sticky-bg: var(--grey-700);
  --table-row-selected-fg: var(--grey-100);
  --table-selection-strong: var(--grey-100);
}

/* ───────────────────────────────────────────────────────────────────────
   Workflow tone classes
   Set `--node-c-*` cascade vars based on a node's tint. Mirrors the design
   bundle's `colors_and_type.css` `.tone-*` pattern. Apply to a wrapper
   element to tone its descendants (icons, hover bg, guide lines).
   Inline hex fallbacks match `tintStyles` in
   `src/domain/nodes/nodeKinds.ts` so colors render
   correctly while only the plum palette is fully tokenized.
   ─────────────────────────────────────────────────────────────────────── */
.tone-plum {
  --node-c: var(--plum-500);
  --node-c-ink: var(--plum-800);
  --node-c-bg: var(--plum-50);
  --node-c-border: var(--plum-200);
}
.tone-pine {
  --node-c: var(--pine-500, #46a579);
  --node-c-ink: var(--pine-700, #236145);
  --node-c-bg: var(--pine-50, #e9edea);
  --node-c-border: var(--pine-200, #b2d1c3);
}
.tone-honey {
  --node-c: var(--honey-500, #dba943);
  --node-c-ink: var(--honey-800, #835f16);
  --node-c-bg: var(--honey-50, #f1ede2);
  --node-c-border: var(--honey-200, #ecd6ac);
}
.tone-slate {
  --node-c: var(--slate-500, #5270a4);
  --node-c-ink: var(--slate-700, #274067);
  --node-c-bg: var(--slate-50, #e2e7ec);
  --node-c-border: var(--slate-200, #b2bbd2);
}
.tone-carmine {
  --node-c: var(--carmine-500, #b33c41);
  --node-c-ink: var(--carmine-700, #6b171b);
  --node-c-bg: var(--carmine-50, #ebe3e2);
  --node-c-border: var(--carmine-200, #dbabae);
}
.tone-rust {
  --node-c: var(--rust-500, #c5744b);
  --node-c-ink: var(--rust-700, #934f27);
  --node-c-bg: var(--rust-50, #efe8e3);
  --node-c-border: var(--rust-200, #edbaa9);
}
