/* Quiet Editorial — the site theme.
 *
 * This file is owned by the website repo. It started from woodcut's
 * themes/quiet-editorial.css and adds the page-only tokens that
 * woodcut has no opinion about.
 *
 * Load order: woodcut tokens.css, then this file, then post.css.
 *
 * --wc-*  is woodcut's contract. Figures read these.
 * --qe-*  is ours. Only the page reads these.
 *
 * Source of truth for the palette: docs/design-language.md.
 * Fonts (Newsreader, IBM Plex Mono) load in the page head.
 */

:root {
  /* woodcut contract — light */
  --wc-paper: #faf6ec;
  --wc-ink: #211d16;
  --wc-body: #332b20;
  --wc-muted: #6b6150;
  --wc-faint: #9a8f77;
  --wc-line: #e3dbc8;
  --wc-line-strong: #d8cdb4;
  --wc-accent: #9a5b2d;
  --wc-panel: #f3ecd9;
  --wc-card: #ffffff;
  --wc-serif: 'Newsreader', Georgia, serif;
  --wc-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --wc-dur-fast: 150ms;
  --wc-dur-base: 220ms;

  /* page only — light */
  --qe-accent-deep: #7c4620;
  --qe-nav: #5d5443;
  --qe-highlight: #f3e2c2;
  --qe-highlight-2: #e8cf9e;
  --qe-highlight-focus: #e0b878;
  --qe-highlight-focus-2: #ddc08a;
  --qe-chip: #d9c9a8;
  --qe-chip-ink: #7c4620;
  --qe-chip-2: #c9b389;
  --qe-chip-2-ink: #5d4a2a;
  --qe-shadow: rgba(60, 48, 20, 0.1);
  /* the masthead's own colour — a nameplate red, used nowhere else */
  --qe-mast: #c8332b;
  --qe-tip-bg: #211d16;
  --qe-tip-ink: #faf6ec;
  --qe-ease: cubic-bezier(.23, 1, .32, 1);
}

[data-theme='dark'] {
  /* woodcut contract — dark */
  --wc-paper: #191612;
  --wc-ink: #ece5d8;
  --wc-body: #cfc6b4;
  --wc-muted: #9a8f77;
  --wc-faint: #6e6552;
  --wc-line: #3d362b;
  --wc-line-strong: #4a4234;
  --wc-accent: #d99a4e;
  --wc-panel: #2e2921;
  --wc-card: #2e2921;

  /* page only — dark */
  --qe-accent-deep: #b87f3a;
  --qe-nav: #a89c85;
  --qe-highlight: #3d3220;
  --qe-highlight-2: #574627;
  --qe-highlight-focus: #7a5f2e;
  --qe-highlight-focus-2: #6b5228;
  --qe-chip: #4a4234;
  --qe-chip-ink: #e0b878;
  --qe-chip-2: #574c3a;
  --qe-chip-2-ink: #d9c9a8;
  --qe-shadow: rgba(0, 0, 0, 0.45);
  --qe-mast: #e05a4c;
  --qe-tip-bg: #ece5d8;
  --qe-tip-ink: #191612;
}