:root {
  --color-ink: #10201d;
  --color-ink-soft: #284b44;
  --color-muted: #52635f;
  --color-paper: #f2f2eb;
  --color-paper-deep: #e4e5da;
  --color-white: #f7f7f2;
  --color-rule: #8ca59e;
  --color-forest: #3d5f58;
  --color-forest-deep: #2e4742;
  --color-orange: #e53927;
  --color-orange-deep: #b8301f;
  --color-orange-light: #f9c9c2;
  --color-pink: #e97b77;
  --color-pink-light: #f6c4c1;
  --color-sky: #8bb2de;
  --color-sky-light: #d7e5f4;
  --color-sky-deep: #1f4e6b;
  --color-ochre: #f5b726;
  --color-ochre-deep: #8a5d13;
  --color-maroon: #671912;

  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Barlow Semi Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Martian Mono", ui-monospace, "SFMono-Regular", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  --border: 2px solid var(--color-ink);
  --shadow-action: 5px 5px 0 var(--color-maroon);
  --shadow-panel: 7px 7px 0 var(--color-maroon);
  --content-max: 1280px;
}