:root {
  color-scheme: light dark;
  --theme-page: #f5f1e7;
  --theme-surface: #fffcf4;
  --theme-ink: #304c3c;
  --theme-body: #53604f;
  --theme-muted: #626d60;
  --theme-border: #d9d9ca;
  --theme-link: #8e4434;
  --theme-focus: #9a4230;
  --theme-button: #304c3c;
  --theme-button-text: #ffffff;
  --theme-button-hover: #233a2d;
  --theme-highlight: #dce3a8;
  --theme-photo: #e9e5da;
  --rewards-gold: #eeddb7;
  --rewards-gold-end: #f6e9cc;
  --rewards-edge: #dec898;
  --rewards-rust: #895036;
  --rewards-caption: #716043;
  --theme-quote: #7c896e;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --theme-page: #171c18;
    --theme-surface: #202920;
    --theme-ink: #e4e9dc;
    --theme-body: #cad2c3;
    --theme-muted: #b6bcae;
    --theme-border: #465246;
    --theme-link: #e4b89a;
    --theme-focus: #e4b89a;
    --theme-button: #d5dfc7;
    --theme-button-text: #1c2b20;
    --theme-button-hover: #e8efdf;
    --theme-highlight: #68723b80;
    --theme-photo: #2e362e;
    --rewards-gold: #433827;
    --rewards-gold-end: #51422c;
    --rewards-edge: #917b59;
    --rewards-rust: #e4b89a;
    --rewards-caption: #cfbea1;
    --theme-quote: #aebda1;
  }
}
:root, body {
  --paper: var(--theme-page);
  --ink: var(--theme-ink);
  --ink-2: var(--theme-muted);
  --muted: var(--theme-muted);
  --rule: var(--theme-border);
  --line: var(--theme-border);
  --link: var(--theme-link);
  --hl: var(--theme-highlight);
  --rewards-note: var(--theme-surface);
}
body { background: var(--theme-page); color: var(--theme-ink); }
.intro, .feature-copy > p:not(.eyebrow), .faq details p,
.wrap p, .wrap li { color: var(--theme-body); }
.wrap .sub, .wrap .en, .wrap footer p { color: var(--theme-muted); }
.text-link { border-color: var(--theme-border); }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline-color: var(--theme-focus);
}
.download, .site-header .nav-download, .skip, .rewards-cta, .cta {
  background: var(--theme-button);
  color: var(--theme-button-text);
}
.download:hover, .site-header .nav-download:hover, .rewards-cta:hover, .cta:hover {
  background: var(--theme-button-hover);
  color: var(--theme-button-text);
  filter: none;
}
.card, .shot, kbd { background: var(--theme-surface); }
.rewards-highlight {
  background: linear-gradient(transparent 64%, var(--theme-highlight) 64%, var(--theme-highlight) 90%, transparent 90%);
}
.rewards-note { border-top-color: var(--theme-highlight); }
.rewards-quote { color: var(--theme-quote); }
.rewards-photo, .rewards-widget { background: var(--theme-photo); }
.rewards-mini-paper { background: #fffcf4; }
