/* Colors and type. Dark is the default look; light follows the device, or the switch in the footer
   (which sets data-theme on <html>). Every color on the site comes from these tokens. */
:root {
  --bg: #000;
  --ink: #ecfcff;
  --ink-2: rgba(222, 242, 247, 0.8);
  --dim: rgba(170, 212, 222, 0.62);
  --cyan: #3fe7ff;
  --cyan-ink: #3fe7ff;
  --cyan-soft: rgba(63, 231, 255, 0.13);
  --cyan-edge: rgba(63, 231, 255, 0.3);
  --edge: rgba(140, 235, 255, 0.13);
  --glass-bg: rgba(18, 28, 32, 0.55);
  --glass-edge: rgba(255, 255, 255, 0.12);
  --glass-hi: rgba(255, 255, 255, 0.14);
  --glass-shadow: rgba(0, 0, 0, 0.95);
  --menu-bg: rgba(12, 20, 24, 0.95);
  --warn: #ff7a7a;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --display: "Tektur", var(--sans);
  color-scheme: dark;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #f6f9fa;
    --ink: #0c1a1f;
    --ink-2: rgba(12, 26, 31, 0.8);
    --dim: rgba(12, 26, 31, 0.6);
    --cyan: #00a6c2;
    --cyan-ink: #007489;
    --cyan-soft: rgba(0, 150, 180, 0.1);
    --cyan-edge: rgba(0, 120, 150, 0.3);
    --edge: rgba(12, 26, 31, 0.1);
    --glass-bg: rgba(255, 255, 255, 0.72);
    --glass-edge: rgba(12, 26, 31, 0.1);
    --glass-hi: rgba(255, 255, 255, 0.95);
    --glass-shadow: rgba(20, 40, 50, 0.28);
    --menu-bg: rgba(255, 255, 255, 0.97);
    --warn: #c4302b;
    color-scheme: light;
  }
}

:root[data-theme="light"] {
  --bg: #f6f9fa;
  --ink: #0c1a1f;
  --ink-2: rgba(12, 26, 31, 0.8);
  --dim: rgba(12, 26, 31, 0.6);
  --cyan: #00a6c2;
  --cyan-ink: #007489;
  --cyan-soft: rgba(0, 150, 180, 0.1);
  --cyan-edge: rgba(0, 120, 150, 0.3);
  --edge: rgba(12, 26, 31, 0.1);
  --glass-bg: rgba(255, 255, 255, 0.72);
  --glass-edge: rgba(12, 26, 31, 0.1);
  --glass-hi: rgba(255, 255, 255, 0.95);
  --glass-shadow: rgba(20, 40, 50, 0.28);
  --menu-bg: rgba(255, 255, 255, 0.97);
  --warn: #c4302b;
  color-scheme: light;
}