/*
  Design tokens for mattchambers.uk — "website × e-reader".
  Single self-hosted variable serif (Literata) carries both registers:
  body copy at reading weight, nav/metadata at a tracked, smaller cut of
  the same face — one voice, two registers, no second font request.

  Dark mode contract for issue #3's toggle: it only needs to set
  documentElement.dataset.theme to "light" or "dark" and persist that
  choice — this file does the rest. Absent an explicit choice, the OS
  preference (prefers-color-scheme) decides.
*/

@font-face {
  font-family: "Literata";
  font-style: normal;
  font-weight: 380 700;
  font-display: swap;
  src: url("/fonts/literata-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Literata";
  font-style: italic;
  font-weight: 380 700;
  font-display: swap;
  src: url("/fonts/literata-italic.woff2") format("woff2");
}

:root {
  color-scheme: light;

  /* color — paper (light, default) */
  --color-bg: #f1ead9;
  --color-text: #2b2620;
  --color-text-muted: #6b6255;
  --color-accent: #3d5c43;
  --color-selection: #d9cfae;

  /* type */
  --font-serif: "Literata", ui-serif, Georgia, serif;
  --font-size-base: 1.125rem;
  --line-height-base: 1.65;
  --measure: 68ch;

  --font-size-nav: 0.8125rem;
  --tracking-nav: 0.08em;
  --weight-nav: 500;

  --weight-heading: 650;
  --line-height-heading: 1.2;

  /* space */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1.25rem;
  --space-m: 2rem;
  --space-l: 3.5rem;
  --space-xl: 6rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --color-bg: #1e1b16;
    --color-text: #e8e1d2;
    --color-text-muted: #9c9284;
    --color-accent: #7fae84;
    --color-selection: #3a4a3c;
  }
}

[data-theme="dark"] {
  color-scheme: dark;

  --color-bg: #1e1b16;
  --color-text: #e8e1d2;
  --color-text-muted: #9c9284;
  --color-accent: #7fae84;
  --color-selection: #3a4a3c;
}
