/*
 * Design tokens.
 *
 * The light set is the base: it defines every token, including layout and
 * type. The dark set overrides COLORS ONLY, when <html> has data-theme="dark",
 * so both themes lay out identically.
 *
 * Rule: never add a non-color token to the dark block, and never write a
 * [data-theme="dark"] rule outside this file except to swap an icon.
 * All text/background pairs pass WCAG AA; re-check before adding a pairing.
 */

:root,
[data-theme="light"] {
	color-scheme: light;

	/* type */
	--serif: "Brygada 1918", Georgia, "Times New Roman", serif;
	--fs: 18px;                 /* body text */
	--lh: 1.5;
	--weight-bold: 600;
	--fs-site-title: 32px;
	--fs-tagline: 14.5px;
	--fs-page-title: 31px;      /* page titles (h1) on inner pages */
	--fs-section: 25.58px;      /* h2/h3 section headings in the text */
	--fs-subsection: 18.95px;   /* h4 */
	--fs-widget-title: 14.68px;
	--fs-widget: 13.26px;
	--fs-toc: 13.74px;
	--fs-caption: 12.32px;
	--fs-footer: 13.26px;

	/* desktop layout: sidebar + gap + text column = body frame */
	--side: 232px;
	--gap: 56px;
	--col: 580px;               /* about 69 characters per line */
	--frame: 868px;
	--gutter: 40px;
	--head-h: 88px;             /* header row, above the double rule */

	/* colors */
	--bg: #F8F5EE;
	--text: #1F2620;            /* headings, titles, bold */
	--body: #2E352F;            /* running text */
	--muted: #5F675F;           /* tagline, captions, footer */
	--accent: #2F6346;          /* links, tracker, list markers, citations */
	--hairline: #E0D9CB;
	--rule: #B9AE98;            /* header double rule, heading underline */
	--control: #B5AD9C;         /* button outlines */
	--mount: #FFFFFF;           /* photo mounts */
	--mount-shadow: 0 1px 2px rgba(60, 50, 30, .12), 0 10px 24px -14px rgba(60, 50, 30, .35);
	--img-bg: #ECE6DA;          /* behind images while they load */
	--register-ink: rgba(70, 58, 38, .40);
	--editor-red: #A3352B;      /* the editor's pure red (#ff0000), tuned to the paper */
	--target: rgba(47, 99, 70, .10);
	--scrim: rgba(0, 0, 0, .25);
	--panel-shadow: 0 18px 30px -18px rgba(0, 0, 0, .35);
	--focus: #2F6346;
}

[data-theme="dark"] {
	/* Colors only. */
	color-scheme: dark;

	--bg: #121612;
	--text: #ECE8DC;
	--body: #D4D0C4;
	--muted: #A3A195;
	--accent: #8FC6A1;
	--hairline: rgba(236, 232, 220, .13);
	--rule: rgba(236, 232, 220, .30);
	--control: rgba(236, 232, 220, .30);
	--mount: #262C26;
	--mount-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 24px -14px rgba(0, 0, 0, .7);
	--img-bg: #1F251F;
	--register-ink: rgba(236, 232, 220, .24);
	--editor-red: #EE8A78;
	--target: rgba(143, 198, 161, .14);
	--scrim: rgba(0, 0, 0, .45);
	--panel-shadow: 0 18px 30px -18px rgba(0, 0, 0, .8);
	--focus: #8FC6A1;
}