:root {
  /* Base palette */
  --kmx-bg0: #F9FAFB;          /* Background 0 */
  --kmx-bg1: #EEF2F6;          /* Background 1 */
  --kmx-surface-even: #DCE8F7; /* Surface 0 (even levels) */
  --kmx-surface-odd: #F7E9DC;  /* Surface 1 (odd levels) */
  --kmx-text-primary: #1A1C1E; /* Text primary */
  --kmx-text-secondary: #4C5563; /* Text secondary */
  --kmx-border-subtle: #C5CDD8; /* Border subtle */
  --kmx-accent-primary: #3B82F6; /* Accent primary */
  --kmx-accent-secondary: #10B981; /* Accent secondary */
  --kmx-accent-warning: #F59E0B; /* Accent warning */
  --kmx-accent-danger: #EF4444; /* Accent danger */
  --kmx-accent-info: #426dca;   /* Accent info */
  --kmx-highlight: #00B4D8;     /* Highlight (selection) */

  /* Canvas/grid bridge */
  --kmx-bg: var(--kmx-bg0);
  --kmx-bg-alt: var(--kmx-bg1);
  --kmx-grid: #E1E7F0;

  /* Text bridges for existing usage */
  --kmx-text: var(--kmx-text-primary);
  --kmx-text-weak: var(--kmx-text-secondary);
  --kmx-text-disabled: #9AA3AF;
  --kmx-text-oncolor: #FFFFFF;

  /* Links / Connectors */
  --kmx-connector: color-mix(in oklab, var(--kmx-accent-primary) 55%, transparent);
  --kmx-connector-strong: color-mix(in oklab, var(--kmx-accent-primary) 85%, black 15%);
  --kmx-connector-ghost: color-mix(in oklab, var(--kmx-accent-primary) 20%, transparent);

  /* Node chrome and selection */
  --kmx-node-border: var(--kmx-border-subtle);
  --kmx-node-border-hover: color-mix(in oklab, var(--kmx-accent-primary) 45%, white 55%);
  --kmx-node-border-selected: var(--kmx-highlight);
  --kmx-selection-bg: color-mix(in oklab, var(--kmx-highlight) 12%, transparent);
  --kmx-selection-border: var(--kmx-highlight);

  /* Controls / Icons */
  --kmx-icon: var(--kmx-accent-info);
  --kmx-icon-hover: color-mix(in oklab, var(--kmx-accent-info) 85%, black 15%);
  --kmx-icon-disabled: #AFC9ED;
  --kmx-focus: var(--kmx-highlight);

  /* Semantic bridge */
  --kmx-accent: var(--kmx-accent-primary);
  --kmx-accent-hover: color-mix(in oklab, var(--kmx-accent-primary) 85%, black 15%);
  --kmx-accent-active: color-mix(in oklab, var(--kmx-accent-primary) 65%, black 35%);
  --kmx-success: var(--kmx-accent-secondary);
  --kmx-warning: var(--kmx-accent-warning);
  --kmx-error: var(--kmx-accent-danger);
  --kmx-info: var(--kmx-accent-primary);

  /* Bridge into existing vars */
  --page-bg: var(--kmx-bg);
}

