:root {
  color-scheme: dark;

  --color-bg: #070706;
  --color-surface: #0d0d0c;
  --color-line: #2a2a28;
  --color-ink: #f2f1ed;
  --color-muted: #96958f;
  --color-subtle: #7f7e78;
  --color-seal: #b7353d;
  --color-seal-deep: #7d2027;
  --color-accent: #d05a5e;
  --color-misregister: #7d989a;

  --font-display-en: "Archivo Black Local", "Arial Black", "Helvetica Neue", Arial, sans-serif;
  --font-display-cn: "Noto Sans SC Local", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-body: "Noto Sans SC Local", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono: "JetBrains Mono Local", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --rail: clamp(1.25rem, 3.8vw, 4rem);
  --section-space: clamp(5.5rem, 10vw, 9rem);
  --page-max: 112rem;
  --page-pad: max(var(--rail), calc((100vw - var(--page-max)) / 2 + var(--rail)));

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-standard: cubic-bezier(0.2, 0.65, 0.3, 1);

  --z-ambient: 2;
  --z-nav: 40;
  --z-overlay: 80;
  --z-blackout: 100;
}

@media (prefers-color-scheme: light) {
  :root {
    --color-bg: #070706;
    --color-surface: #0d0d0c;
    --color-ink: #f2f1ed;
    --color-muted: #96958f;
  }
}