/**
 * Łaszkowicz—design tokens (project overlay)
 *
 * Minttu core, at the commit this repository tracks
 * (packages/minttu, currently 72ca7a9f), already ships the OKLCH ramp
 * generator, the fluid type and space scales, and the semantic role
 * recipe (accent roles at tonal step 80 in light mode, step 20/30 in
 * dark—see colors/tokens.css and colors/tokens.dark.css in core). None
 * of that is reproduced here. This file is a straight copy of what a
 * real project overlay looks like on top of shipping code: hue,
 * chroma and font decisions, nothing else.
 *
 * Every page in design/ loads, in this order:
 *   1. packages/minttu/vite/core/css/minttu.css (core, unmodified)
 *   2. this file (the overlay, layer(theme))
 *   3. base.css (the handful of rules core doesn't provide—see its
 *      own header comment for what those are and why)
 *
 * Cascade layer order is declared once by core; repeating the same
 * declaration here is a no-op, not a conflict, and keeps this file
 * readable on its own.
 */
@layer reset, base, theme, elements, layout, components, utilities;

@layer theme {
	:root {

		/*
		 * Colour harmony—a softened split-complementary.
		 *
		 * Primary and secondary are an analogous pair of warm
		 * materials, 30 degrees apart: primary at 70 degrees
		 * (core's default is 237) and secondary at 40 degrees,
		 * overriding core's complementary-offset default of
		 * primary+180 because analogous, not complementary, is the
		 * relationship this palette wants. Primary carries the one
		 * warm gesture the doorway is allowed, the sign-in
		 * affordance. Secondary sits behind it on containers, close
		 * enough in hue to never compete.
		 *
		 * Tertiary, at 220 degrees, overrides core's triadic-offset
		 * default (primary+120) with a direct value instead: the
		 * genuine split-complementary leg against primary's
		 * complement at 250 degrees, used for links and quiet
		 * informational moments. It reads as sky and distance, the
		 * colour of the places between where the family has lived.
		 * The textbook second split leg, near 280 degrees, was tried
		 * and dropped—at any chroma that still read as part of the
		 * same family it produced the generic violet gradient this
		 * brief rules out.
		 *
		 * Chroma stays moderate throughout (0.07-0.11, against
		 * core's own default of 0.14-0.15) so the palette reads as
		 * pigment—wood, clay, cloth, evening sky—rather than screen
		 * light. Core's default neutral-variant-chroma (0.015) is
		 * left as-is: a whisper of the primary hue is exactly what
		 * keeps every surface on the warm side of neutral, and there
		 * was no reason to move a value that already does the job.
		 *
		 * Verified against core's real ramp formula (its published
		 * --_light, --_taper and --_lift tables, not an approximation
		 * of them): on-surface/surface 12.0:1, on-primary/primary
		 * 7.4:1, on-primary-container/primary-container 10.0:1,
		 * tertiary text on surface 7.6:1, dark-theme on-surface/
		 * surface 14.8:1. Every pair clears WCAG AA by a wide margin;
		 * most clear the AAA threshold of 7:1 too. Full numbers in design/README.md.
		 */
		--color-primary-hue: 70;
		--color-primary-chroma: 0.11;
		--color-secondary-hue: 40;
		--color-secondary-chroma: 0.09;
		--color-tertiary-hue: 220;
		--color-tertiary-chroma: 0.07;

		/*
		 * Typography—two variable families, chosen and verified
		 * against their real glyph coverage rather than reputation.
		 * See design/README.md for the full argument; in short:
		 *
		 * Fraunces (Untitled Type, SIL OFL) carries the family name
		 * and every heading. Variable axes: wght 100-900, opsz 9-144,
		 * SOFT 0-100, WONK 0-1 (roman and italic ship as separate
		 * files, each carrying the full axis set). Confirmed via
		 * Google Fonts' own metadata to cover Polish, Finnish and
		 * Swedish diacritics through its latin-ext coverage.
		 *
		 * Atkinson Hyperlegible Next (Braille Institute, SIL OFL)
		 * carries every word a person has to read. Variable axis:
		 * wght 200-800 only, no opsz. Its Google Fonts metadata
		 * lists coverage as "Latin, Latin Extended"—not just
		 * "Latin" as some font-delivery catalogues summarise it—and
		 * the latin-ext codepoint ranges verified include every
		 * character this brief requires: U+0104-0107, U+0118-0119,
		 * U+0141-0144, U+015A-015B, U+0179-017C (Polish Ą ą Ć ć Ę ę
		 * Ł ł Ń ń Ś ś Ź ź Ż ż); Finnish/Swedish ä ö å live in Latin-1
		 * and are covered by the base latin subset.
		 */
		--font-header-base:
			"Fraunces", Georgia, "Iowan Old Style", "Palatino Linotype",
			"Book Antiqua", Palatino, serif;
		--font-body-base:
			"Atkinson Hyperlegible Next", system-ui, -apple-system,
			BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
			sans-serif;

		--font-header: var(--font-header-base);
		--font-body: var(--font-body-base);

		/*
		 * Variable axis instances.
		 *
		 * font-weight is the high-level property for wght everywhere
		 * it is the only axis being set—which is everywhere in this
		 * design except one element. The doorway wordmark pins wght
		 * and opsz together with font-variation-settings instead,
		 * because it sets two axes at once and a plain font-weight
		 * alongside an opsz override would split one visual decision
		 * across two properties that could disagree. See base.css
		 * for where each is applied.
		 *
		 * --font-header-weight-display is deliberately lighter than
		 * --font-header-weight: at 4.75rem the wordmark has presence
		 * from size alone, and Fraunces at full Black (900) that
		 * large reads as shouting rather than welcoming.
		 *
		 * --font-header-opsz-display is pinned to Fraunces' maximum
		 * (144) rather than left to track the wordmark's fluid
		 * rendered size automatically. This is the one place a
		 * static font could not have done what the variable axis
		 * does: the wordmark commits to Fraunces' sharpest, highest-
		 * contrast display cut at every viewport width, including
		 * the smaller end of its clamp() range where automatic
		 * optical sizing would otherwise interpolate toward a
		 * softer, more text-like cut.
		 *
		 * Every other heading leaves opsz on the browser's automatic
		 * tracking (font-optical-sizing: auto, the CSS default)
		 * rather than pinning it, so it continues to answer the
		 * fluid scale on its own as heading sizes shrink toward
		 * body-adjacent sizes.
		 *
		 * No axis is animated. All motion in this design is the
		 * existing opacity/transform entrance rise, guarded by
		 * prefers-reduced-motion; there was no case where animating
		 * an axis said something that timing and easing did not
		 * already say better.
		 */
		--font-header-weight: 600;
		--font-header-weight-display: 420;
		--font-header-opsz-display: 144;
		--font-body-weight: 400;
		--font-body-weight-emphasis: 600;
	}

	/*
	 * Self-hosted, subsetted, variable. Font files are not vendored in
	 * this design pass—see design/README.md—so every preview here
	 * renders on the fallback stacks above until the woff2 subsets are
	 * built. font-weight is given as the family's true axis range in
	 * both cases (100-900 for Fraunces, 200-800 for Atkinson
	 * Hyperlegible Next) so the browser interpolates the whole range
	 * rather than snapping between named instances.
	 *
	 * One variable file replacing several static weights is a size win
	 * only when a design actually spans a range of weights. Fraunces
	 * earns it on opsz alone: headings run from a specimen table row to
	 * a 4.75rem wordmark, and opsz has to track that continuously (or
	 * be pinned, as above)—no fixed set of static optical sizes could
	 * do that at all. Atkinson Hyperlegible Next is a weaker case by
	 * that test: this design only ever calls two weight instances
	 * (400, 600), which two static files could serve at a smaller
	 * download. It is specified as variable anyway, for the client's
	 * stated preference and so a third weight can be added later as a
	 * CSS value rather than a new asset—an honest trade, not a free one.
	 */
	/**
	 * Face declarations
	 *
	 * Each family ships as two subsets, verified against the files with
	 * fontTools. The latin subset carries the Finnish and Swedish vowels
	 * (a-diaeresis, o-diaeresis, a-ring); the latin-ext subset carries
	 * the Polish set (L-stroke, ogonek, acute and dot-above forms).
	 * Neither contains the other's, so both must be declared or one
	 * language silently falls back.
	 *
	 * Weights are ranges so the variable axis interpolates. Fraunces
	 * also carries opsz 9-144, left on `auto` so the browser compensates
	 * between the doorway headline and small print. Atkinson ships no
	 * optical axis (wght 200-800 only) and needs no opsz declaration.
	 */
	@font-face {
		font-family: "Fraunces";
		src: url("../fonts/fraunces/fraunces-variable-latin.woff2") format("woff2-variations");
		font-weight: 100 900;
		font-style: normal;
		font-optical-sizing: auto;
		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: "Fraunces";
		src: url("../fonts/fraunces/fraunces-variable-latin-ext.woff2") format("woff2-variations");
		font-weight: 100 900;
		font-style: normal;
		font-optical-sizing: auto;
		font-display: swap;
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
			U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
			U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
	}

	@font-face {
		font-family: "Atkinson Hyperlegible Next";
		src: url("../fonts/atkinson-hyperlegible-next/atkinson-hyperlegible-next-latin.woff2") format("woff2-variations");
		font-weight: 200 800;
		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: "Atkinson Hyperlegible Next";
		src: url("../fonts/atkinson-hyperlegible-next/atkinson-hyperlegible-next-latin-ext.woff2") format("woff2-variations");
		font-weight: 200 800;
		font-style: normal;
		font-display: swap;
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
			U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
			U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
	}

	@font-face {
		font-family: "Atkinson Hyperlegible Next";
		src: url("../fonts/atkinson-hyperlegible-next/atkinson-hyperlegible-next-italic-latin.woff2") format("woff2-variations");
		font-weight: 200 800;
		font-style: italic;
		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: "Atkinson Hyperlegible Next";
		src: url("../fonts/atkinson-hyperlegible-next/atkinson-hyperlegible-next-italic-latin-ext.woff2") format("woff2-variations");
		font-weight: 200 800;
		font-style: italic;
		font-display: swap;
		unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
			U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
			U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
	}
}
