/*
 * Design tokens. Colours from the approved designs (docs/design/pages/),
 * named by role, not by page. Keep in step with theme.json.
 *
 * Fonts are self-hosted (no Google Fonts at run time), all under the SIL OFL
 * (assets/fonts/*\/OFL.txt):
 * - Alice, regular only (the brand has no bold Alice), for headings and titles.
 *   The woff2 is Google Fonts' latin subset; the full .ttf stays as the
 *   fallback for any character outside that range.
 * - EB Garamond 400, 400 italic and 500, for story text and italic lines.
 *   Google Fonts serves 400 and 500 roman as one variable file (wght axis).
 * - DM Sans 400/700, for UI and small labels.
 */

@font-face {
	font-family: "Alice";
	src: url("../fonts/alice/Alice-Regular.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Declared after the .ttf so it wins for the characters it covers. */
@font-face {
	font-family: "Alice";
	src: url("../fonts/alice/Alice-Regular-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "EB Garamond";
	src: url("../fonts/eb-garamond/EBGaramond-Roman-latin.woff2") format("woff2");
	font-weight: 400 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "EB Garamond";
	src: url("../fonts/eb-garamond/EBGaramond-Italic-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/dm-sans/DMSans-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/dm-sans/DMSans-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Brand purples */
	--fe-ink: #1a0533;              /* dark surfaces, headings on light */
	--fe-ink-deep: #150227;         /* footer */
	--fe-primary: #610c9f;          /* links, drop cap, punchlines */
	--fe-primary-hover: #3e0868;
	--fe-plum: #37104f;             /* secondary text on light, card lines */
	--fe-eyebrow: #6a1fa0;          /* uppercase labels on light */
	--fe-eyebrow-soft: #8a3fc0;     /* numbers, row labels */
	--fe-accent: #c084fc;           /* buttons and ornaments on dark */
	--fe-on-accent: #220631;        /* text on an accent button */
	--fe-lilac: #e2c2fb;            /* soft text on dark */
	--fe-lilac-pale: #f3e8ff;       /* links on dark */

	/* Light surfaces and text */
	--fe-cream: #f9f6f4;
	--fe-white: #ffffff;
	--fe-text: #271936;
	--fe-muted: #5e5266;
	--fe-line: #e6dceb;             /* hairlines on cream */
	--fe-line-soft: #dccbe8;        /* ornament rules */
	--fe-divider: #c9b6d6;          /* separators in meta lines */

	/* Text on the dark brand surfaces */
	--fe-on-dark: #ffffff;
	--fe-on-dark-muted: #d9c6e8;
	--fe-on-dark-faint: #cdb8de;
	--fe-footer-text: #cdbdd9;
	--fe-footer-link: #e4d6ee;
	--fe-footer-muted: #a896ba;      /* copyright line (footer design, D54) */

	/* Warm darks and golds (library, challenge) */
	--fe-warm-dark: #120a0d;
	--fe-warm-dark-2: #140a0c;
	--fe-gold: #e8c882;
	--fe-gold-muted: #d8b877;
	--fe-gold-pale: #ffe6b0;
	--fe-gold-light: #f6e3b4;       /* royal button text on hover (D55) */
	--fe-on-gold: #2a1029;

	/* Type */
	--fe-font-serif: Alice, Georgia, serif;
	--fe-font-reading: "EB Garamond", Georgia, serif;
	--fe-font-sans: "DM Sans", system-ui, sans-serif;
	--fe-size-small: 0.875rem;
	--fe-size-medium: 1.0625rem;
	--fe-size-large: 1.375rem;
	--fe-size-x-large: 1.75rem;

	/* Layout */
	--fe-wide-width: 72.5rem;       /* 1160px */
	--fe-reading-width: 42.5rem;    /* 680px */
	--fe-gutter: 1.5rem;
	--fe-radius-card: 24px;
	--fe-pill: 999px;
}