/*
 * uBind design tokens - the single source of truth.
 *
 * Declared once, on :root, and enqueued as a real stylesheet. Nothing else on the
 * site may declare these: a copy on a page wrapper class sits on an ancestor of the
 * content and therefore shadows :root for that whole subtree, which is invisible by
 * eye and is how the persona pages drifted onto pre-rebrand fonts.
 *
 * Generated by tools/wordpress/build-canonical-tokens.ts from the 17 page copies.
 */

:root {
	/* Palette - emerald */
	--emerald-100: #d8f7e8;
	--emerald-1000: #03130d;
	--emerald-200: #a8eecf;
	--emerald-300: #69e0b0;
	--emerald-400: #39b591;
	--emerald-50: #ecfaf3;
	--emerald-500: #198562;
	--emerald-600: #0f7551;
	--emerald-700: #0f5c47;
	--emerald-800: #0a3d31;
	--emerald-900: #062b22;
	--emerald-950: #051f17;

	/* Palette - ink */
	--ink-100: #e7ece9;
	--ink-1000: #050807;
	--ink-200: #c8d2cd;
	--ink-300: #9aa9a3;
	--ink-400: #687974;
	--ink-450: #5d6d68;
	--ink-50: #f2f5f3;
	--ink-500: #4b5b54;
	--ink-600: #2a3833;
	--ink-700: #1a2520;
	--ink-800: #111a17;
	--ink-900: #0b110f;

	/* Palette - accents */
	--amber: #f5a524;
	--citrus: #d8ff5a;
	--coral: #ff6b5b;
	--magenta: #e879f9;
	--paper: #fbfaf6;
	--sky: #61c5ff;
	--violet: #8b5cf6;
	--white: #ffffff;

	/*
	 * Typography
	 *
	 * 'Montserrat Fallback' / 'Montserrat Fallback Android' are not typefaces. They are the same
	 * system sans the stack would have reached anyway, re-boxed by `ubind-webfonts` to Montserrat's
	 * exact metrics, so the `font-display: swap` handover cannot move anything. They must sit
	 * immediately after 'Montserrat' and before the plain system entries: they are what paints
	 * during the swap window, and the unadjusted entries behind them are only reached on a platform
	 * that has neither Arial nor Roboto. Removing them reinstates the homepage's 0.086 CLS.
	 */
	--body: 'Montserrat', 'Montserrat Fallback', 'Montserrat Fallback Android', -apple-system, BlinkMacSystemFont, sans-serif;
	--font-display: 'Soho Gothic Pro', 'Montserrat', 'Montserrat Fallback', 'Montserrat Fallback Android', -apple-system, BlinkMacSystemFont, sans-serif;
	--mono: 'Montserrat', 'Montserrat Fallback', 'Montserrat Fallback Android', -apple-system, BlinkMacSystemFont, sans-serif;

	/* Layout */
	--maxw: 1320px;
	--r-lg: 22px;
	--r-md: 14px;
	--r-sm: 8px;
	--r-xl: 32px;

	/* Motion */
	--ease-back: cubic-bezier(.68, -0.55, .27, 1.55);
	--ease-in-out: cubic-bezier(.65, 0, .35, 1);
	--ease-out: cubic-bezier(.2, .8, .2, 1);
	--ease-spring: cubic-bezier(.34, 1.56, .64, 1);

	/* Other */
	--crit: #ff5757;
	--high: #ff9142;
	--ink: #eef7f2;
	--low: #61c5ff;
	--med: #f5cd42;
	--muted: #9bb7aa;

	/* Aliases - alternate vocabularies used by pages and templates. */
	--ef-font-body: var(--body);
	--ef-font-display: var(--font-display);
	--ef-font-mono: var(--mono);
	--font-montserrat: var(--body);
	--font-soho-gothic-pro: var(--font-display);
	--sans: var(--body);
	--ub-body: var(--body);
	--ub-ease-out: var(--ease-out);
	--ub-emerald-400: var(--emerald-400);
	--ub-emerald-500: var(--emerald-500);
	--ub-emerald-600: var(--emerald-600);
	--ub-font-body: var(--body);
	--ub-font-display: var(--font-display);
	--ub-font-mono: var(--mono);
	--ub-ink-1000: var(--ink-1000);
	--ub-mono: var(--mono);
	--ub-white: var(--white);
	--ubind-font-body: var(--body);
	--ubind-font-display: var(--font-display);
	--ubind-font-mono: var(--mono);
}
