/* Canonical Pane Grid tokens. Dark is the brand default; light is an equal theme. */
:root {
  color-scheme: dark;
  --tp-navy-950: #101820;
  --tp-navy-900: #17232d;
  --tp-navy-800: #22323e;
  --tp-teal-300: #8acfc2;
  --tp-teal-400: #69b8a9;
  --tp-teal-700: #236b60;
  --tp-paper: #f5f7f6;
  --tp-ink: #17232d;
  --tp-bg: var(--tp-navy-950);
  --tp-surface: var(--tp-navy-900);
  --tp-text: #edf2f3;
  --tp-muted: #adbac3;
  --tp-line: #3d515f;
  --tp-accent: var(--tp-teal-400);
  --tp-link: var(--tp-teal-300);
  --tp-on-accent: var(--tp-navy-950);
  --tp-focus: #8acfc2;
  --tp-font: Inter, "Segoe UI", system-ui, sans-serif;
  --tp-mono: "Cascadia Code", Consolas, monospace;
  --tp-space-1: 4px;
  --tp-space-2: 8px;
  --tp-space-3: 12px;
  --tp-space-4: 16px;
  --tp-space-6: 24px;
  --tp-space-8: 32px;
  --tp-space-12: 48px;
  --tp-space-16: 64px;
  --tp-space-24: 96px;
  --tp-radius-control: 4px;
  --tp-radius-panel: 8px;
  --tp-content-width: 1160px;
}
:root[data-theme="light"] {
  color-scheme: light;
  --tp-bg: var(--tp-paper);
  --tp-surface: #ffffff;
  --tp-text: var(--tp-ink);
  --tp-muted: #51636f;
  --tp-line: #a5b4bb;
  --tp-accent: var(--tp-teal-700);
  --tp-link: #1b6258;
  --tp-on-accent: #ffffff;
  --tp-focus: #236b60;
}