/**
 * Mönster — design tokens
 *
 * The values below come from the Mönster design handoff. Where a token
 * deviates from the handoff it is because the handoff value failed WCAG 2.1
 * AA contrast at the size it is actually used; every such deviation is
 * marked DEVIATION with the measured ratios. Nothing else has been changed.
 *
 * Rule of the direction: flat colour and rules only. No shadows, no
 * gradients. Do not add elevation.
 */

:root {
	/* ── Ground ─────────────────────────────────────────────── */
	--mn-cream: #FBF6EC;        /* page background */
	--mn-surface: #EFE6D6;      /* cards, sidebar modules, section bands */
	--mn-surface-deep: #E2D7C3; /* thumbnails inside a surface band */
	--mn-ink: #1E1A17;          /* body text, buttons, footer, dark sections */
	--mn-ink-soft: #2E2822;     /* dark cards on dark, lead paragraph */

	/* ── Type colours on light ──────────────────────────────── */
	--mn-body: #4A423A;         /* long-form copy */
	--mn-body-alt: #5A5147;     /* secondary copy in cards */

	/* DEVIATION: handoff muted is #8A7F72 — 3.64:1 on cream and 3.36:1 on
	   surface, and it is used almost exclusively at 10px. Darkened along its
	   own hue to 4.61:1 on surface / 5.30:1 on cream. */
	--mn-muted: #6E655B;
	--mn-muted-quiet: #8A7F72;  /* handoff value; decorative rules/dividers only */

	/* ── Accents ────────────────────────────────────────────── */
	/* DEVIATION: tomato #D9552F and sky #3E7FA8 carry cream text as flat
	   fills (badges, quote panels, hub headers) at 3.68:1 and 4.06:1.
	   Both darkened along their own hue until cream clears 4.5:1. Leaf and
	   plum are the handoff values untouched. */
	--mn-tomato: #C04B2A;       /* accent 1 — neighbourhoods    (cream 4.55:1) */
	--mn-sky: #3A779E;          /* accent 2 — on the water      (cream 4.52:1) */
	--mn-leaf: #4E7A3A;         /* accent 3 — outdoors / free   (cream 4.68:1) */
	--mn-amber: #E5A800;        /* accent 4 — seasons, CTAs     (ink 8.17:1)  */
	--mn-plum: #7A3E5E;         /* accent 5 — reserve           (cream 7.28:1) */

	/* Accents as *type* on cream or surface. An accent used as a fill and the
	   same accent used as small text cannot be one value: amber in particular
	   is unreadable as type on cream (1.96:1). These clear 4.5:1 on both
	   grounds at any size. */
	--mn-tomato-text: #AF4426;
	--mn-sky-text: #346B8E;
	--mn-leaf-text: #487035;
	--mn-amber-text: #836000;
	--mn-plum-text: #7A3E5E;

	/* Accents as large display type only (>=24px bold). Clears 3:1 on cream
	   and on surface. Amber is the only one that has to move: the handoff
	   value is 1.96:1 on cream, unreadable at any size. */
	--mn-tomato-display: #C04B2A;
	--mn-sky-display: #3A779E;
	--mn-leaf-display: #4E7A3A;
	--mn-amber-display: #A57900;
	--mn-plum-display: #7A3E5E;

	/* ── Type colours on dark ───────────────────────────────── */
	--mn-on-dark: #FBF6EC;
	--mn-on-dark-body: #C4B9AA;
	--mn-on-dark-caption: #B9AC9B;
	--mn-on-dark-desc: #9C9082;
	/* DEVIATION: handoff on-dark muted is #8A7F72 — 4.41:1 on ink at 10px. */
	--mn-on-dark-muted: #8C8174;

	/* ── Type colours on an accent fill ─────────────────────── */
	/* DEVIATION: the handoff tints (#C6DCEA on sky, #DCE8D4 on leaf,
	   #FBD9C9 on tomato, #7A5F00 on amber) run 2.87–3.31:1. Each has been
	   pulled toward its ground until it clears 4.6:1, keeping the hue cast. */
	--mn-on-sky: #FBF6EC;
	--mn-on-sky-soft: #F5F9FC;
	--mn-on-leaf: #FBF6EC;
	--mn-on-leaf-soft: #F2F6EF;
	--mn-on-tomato: #FBF6EC;
	--mn-on-tomato-soft: #FDF7F4;
	--mn-on-plum: #FBF6EC;
	--mn-on-plum-soft: #E3C7D6;
	--mn-on-amber: #1E1A17;
	--mn-on-amber-soft: #4A3B12;
	--mn-on-amber-label: #53420A;

	/* ── Rules ──────────────────────────────────────────────── */
	--mn-rule: rgba(30, 26, 23, .18);
	--mn-rule-faint: rgba(30, 26, 23, .1);
	--mn-rule-edge: rgba(30, 26, 23, .16);
	--mn-rule-mid: rgba(30, 26, 23, .2);
	--mn-rule-strong: rgba(30, 26, 23, .22);
	--mn-rule-heavy: 2px solid var(--mn-ink);
	--mn-rule-dark: rgba(251, 246, 236, .16);
	--mn-rule-dark-mid: rgba(251, 246, 236, .28);
	--mn-tint-hover: rgba(30, 26, 23, .03);
	--mn-tint-ghost: rgba(30, 26, 23, .07);

	/* ── Type ───────────────────────────────────────────────── */
	--mn-display: "Bricolage Grotesque", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--mn-serif: Newsreader, Georgia, "Times New Roman", serif;
	--mn-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

	/* ── Measure and rhythm ─────────────────────────────────── */
	--mn-container: 1180px;
	--mn-gutter: 32px;
	--mn-measure: 720px;
	--mn-sidebar: 300px;
	--mn-sticky-top: 78px;

	/* ── Radii ──────────────────────────────────────────────── */
	--mn-r-pill: 100px;
	--mn-r-thumb: 12px;
	--mn-r-sm: 14px;
	--mn-r-md: 16px;
	--mn-r-lg: 18px;
	--mn-r-xl: 20px;

	/* ── Motion ─────────────────────────────────────────────── */
	--mn-ease: 130ms ease;

	/* Fallback mat for a card with no image yet. Flat, per the direction. */
	--mn-mat: repeating-linear-gradient(135deg, rgba(30, 26, 23, .1) 0 7px, transparent 7px 15px);
	--mn-mat-dark: repeating-linear-gradient(135deg, rgba(251, 246, 236, .12) 0 7px, transparent 7px 15px);
}

/**
 * Per-accent surface. A section, card or badge sets --mn-accent-* once and
 * every child reads from it, so a category's colour is resolved in exactly
 * one place. See mn_accent_attr() in inc/accents.php.
 */
[data-mn-accent] {
	--mn-accent: var(--mn-tomato);
	--mn-accent-text: var(--mn-tomato-text);
	--mn-accent-display: var(--mn-tomato-display);
	--mn-on-accent: var(--mn-on-tomato);
	--mn-on-accent-soft: var(--mn-on-tomato-soft);
}

[data-mn-accent="tomato"] {
	--mn-accent: var(--mn-tomato);
	--mn-accent-text: var(--mn-tomato-text);
	--mn-accent-display: var(--mn-tomato-display);
	--mn-on-accent: var(--mn-on-tomato);
	--mn-on-accent-soft: var(--mn-on-tomato-soft);
}

[data-mn-accent="sky"] {
	--mn-accent: var(--mn-sky);
	--mn-accent-text: var(--mn-sky-text);
	--mn-accent-display: var(--mn-sky-display);
	--mn-on-accent: var(--mn-on-sky);
	--mn-on-accent-soft: var(--mn-on-sky-soft);
}

[data-mn-accent="leaf"] {
	--mn-accent: var(--mn-leaf);
	--mn-accent-text: var(--mn-leaf-text);
	--mn-accent-display: var(--mn-leaf-display);
	--mn-on-accent: var(--mn-on-leaf);
	--mn-on-accent-soft: var(--mn-on-leaf-soft);
}

[data-mn-accent="amber"] {
	--mn-accent: var(--mn-amber);
	--mn-accent-text: var(--mn-amber-text);
	--mn-accent-display: var(--mn-amber-display);
	--mn-on-accent: var(--mn-on-amber);
	--mn-on-accent-soft: var(--mn-on-amber-soft);
}

[data-mn-accent="plum"] {
	--mn-accent: var(--mn-plum);
	--mn-accent-text: var(--mn-plum-text);
	--mn-accent-display: var(--mn-plum-display);
	--mn-on-accent: var(--mn-on-plum);
	--mn-on-accent-soft: var(--mn-on-plum-soft);
}