:root {
  color-scheme: light;
  --font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --surface-selected: #e4f1ec;
  --action-hover: #064f44;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --radius-control: 4px;
  --radius-panel: 8px;
  --surface-page: #eff2ef;
  --surface-panel: #fff;
  --surface-muted: #e6eeea;
  --surface-border: #d8e1dc;
  --text-strong: #13201b;
  --text-body: #34443d;
  --text-muted: #52645b;
  --action: #086355;
  --action-text: #fff;
  --status-success: #086355;
  --status-warning: #8a4b08;
  --status-error: #a62828;
}

html.dark {
  --surface-selected: #203d37;
  --action-hover: #62ccb7;
  color-scheme: dark;
  --surface-page: #101a1e;
  --surface-panel: #17242a;
  --surface-muted: #203238;
  --surface-border: #293940;
  --text-strong: #edf3f4;
  --text-body: #c2d0d6;
  --text-muted: #94a6ae;
  --action: #45c0a8;
  --action-text: #101a1e;
  --status-success: #55c9b0;
  --status-warning: #f3ad55;
  --status-error: #ff8b8b;
}

/* Screen-change headings remain focus targets for assistive technology, not controls.
   Keep keyboard focus rings on their interactive descendants and all real controls. */
html:root body :is(h1,h2,h3,h4,h5,h6)[tabindex="-1"]:focus {
  outline: none !important;
  outline-offset: 0 !important;
}