/* Design tokens shared with the demo Space (space/style.css, space/viewer.css): one monospace face, near-monochrome,
   1px hairlines, radii 0-2px, two data accents (ours teal / ACL orange). Keep the values in step with the Space.
   Theme: follows the OS; data-theme="light"/"dark" on <html> (set by the toggle) wins. */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400..700;1,400..700&display=swap');

:root {
  --font: "JetBrains Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --ease: cubic-bezier(.2, .7, .2, 1);

  --ours: #0f766e; --acl: #c2410c; --raw: #6b7280;
  --page: #ffffff; --ink: #111111; --ink-2: #333333; --muted: #6b6b6b; --faint: #9b9b9b;
  --rule: #e8e8e8; --rule-strong: #d0d0d0; --hover: #f6f6f6; --tile: #f4f4f1;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 72px; --s9: 112px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ours: #2dd4bf; --acl: #fb923c; --raw: #9ca3af;
    --page: #0a0a0a; --ink: #ededed; --ink-2: #c8c8c8; --muted: #8f8f8f; --faint: #666666;
    --rule: #222222; --rule-strong: #363636; --hover: #151515; --tile: #0f0f12;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ours: #2dd4bf; --acl: #fb923c; --raw: #9ca3af;
  --page: #0a0a0a; --ink: #ededed; --ink-2: #c8c8c8; --muted: #8f8f8f; --faint: #666666;
  --rule: #222222; --rule-strong: #363636; --hover: #151515; --tile: #0f0f12;
  color-scheme: dark;
}