:root {
  /* Colors */
  --color-primary: #2B3318;
  --color-accent: #5A7D0E;
  --color-surface: #FBFCEB;
  --color-muted: #6E7346;
  --color-tinted-surface: rgba(60, 46, 46, 0.05);

  /* Typography colors*/
  --color-on-surface: var(--color-primary);
  --color-on-accent: var(--color-surface);
  --color-border: var(--color-muted);
  --color-focus-ring: var(--color-accent);

  /* 4 px grid when using browser defaults */
  --spacing-unit: 0.25rem;

  --space-xs: calc(var(--spacing-unit) * 2);
  --space-sm: calc(var(--spacing-unit) * 4);
  --space-md: calc(var(--spacing-unit) * 8);
  --space-lg: calc(var(--spacing-unit) * 12);
  --space-xl: calc(var(--spacing-unit) * 16);
  --space-2xl: calc(var(--spacing-unit) * 24);

  /* Typography Scale (Major Third 1.25)
   * (see: https://www.typographymaster.com/guide/type-scale-systems) */
  --font-size-base: 1rem;
  --font-size-sm: 0.8rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.563rem;
  --font-size-2xl: 1.953rem;
  --font-size-3xl: 2.441rem;
  --font-size-4xl: 3.052rem;
  --font-size-5xl: 3.815rem;

  --line-height-tight: 1.1;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;

  /* Use nunito, and fall back to the system font stack */
  --font-family-sans: Nunito, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-weight-regular: 400;
  --font-weight-bold: 700;

  /* Layout */
  --container-max-width: 72rem;
  --border-radius-sm: 0.25rem;
  --border-radius-md: 0.5rem;
}

/**/
/* @media (prefers-color-scheme: dark) {
/*   :root {
/*     --color-surface: #1A1F0E;
/*     --color-primary: #F2F5D0;
/*     --color-accent: #A8CC4A;
/*     --color-muted: #9DA36B;
/*     --color-border: #3A4220;
/*     --color-focus-ring: var(--color-accent);
/*   }
/* } */