/* A single semantic palette drives the page, diagrams, and both playgrounds. */
:root {
  color-scheme: dark;
  --paper: #182335; --ink: #f0f5ff; --muted: #b9c8dd; --line: #3c526e; --line-strong: #7590b6;
  --surface: #22324a; --surface-raised: #2c405c; --surface-inset: #1c2a40;
  --accent: #ff8b9b; --dark: #afccff; --blue: #243853; --blue-ink: #bfd5ff;
  --action: #4065dc; --action-hover: #5277e9; --on-action: #ffffff;
  --graph-blue: #88b5ff; --graph-red: #ff829b; --graph-output: #d3e3ff;
}
:root[data-theme=light] {
  color-scheme: light;
  --paper: #f4f7fc; --ink: #152741; --muted: #52647d; --line: #cbd6e7; --line-strong: #8196b7;
  --surface: #ffffff; --surface-raised: #e4edf9; --surface-inset: #eaf0f9;
  --accent: #b92e4b; --dark: #2c54b4; --blue: #e3ecfa; --blue-ink: #254b9c;
  --action: #3159d2; --action-hover: #2549b9; --on-action: #ffffff;
  --graph-blue: #3362c9; --graph-red: #bd3158; --graph-output: #183d8f;
}