/**
 * Curel — self-hosted variable web fonts.
 *
 * Four variable WOFF2 files cover the entire weight range used across the
 * design, with italic axes included for both families:
 *   - Geist          (wght 100..900, normal + italic)
 *   - JetBrains Mono (wght 100..800, normal + italic)
 *
 * Source TTFs (Google Fonts release) are kept in _workbench/notes/
 * fonts-source/ outside the deployed plugin for future re-conversion.
 * WOFF2 conversion uses fontTools.ttLib + brotli, preserving the wght
 * variation axis intact (no subsetting, full Latin + extended).
 *
 * The CSS custom properties on :root expose the two font stacks for any
 * CSS the plugin ships (component partials, inline styles, future widgets)
 * without depending on Winden / Tailwind being loaded. The same tokens
 * are also declared inside Winden's @theme block so Tailwind utilities
 * (font-sans / font-mono) pick them up.
 *
 * font-display: swap → text renders in the fallback immediately, then swaps
 * to the web font once loaded. Best UX trade-off for non-blocking paint.
 */

@font-face {
	font-family: "Geist";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/geist.woff2") format("woff2-variations");
}

@font-face {
	font-family: "Geist";
	font-style: italic;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/geist-italic.woff2") format("woff2-variations");
}

@font-face {
	font-family: "JetBrains Mono";
	font-style: normal;
	font-weight: 100 800;
	font-display: swap;
	src: url("../fonts/jetbrains-mono.woff2") format("woff2-variations");
}

@font-face {
	font-family: "JetBrains Mono";
	font-style: italic;
	font-weight: 100 800;
	font-display: swap;
	src: url("../fonts/jetbrains-mono-italic.woff2") format("woff2-variations");
}

:root {
	--font-sans: "Geist", system-ui, sans-serif;
	--font-mono: "JetBrains Mono", ui-monospace, monospace;
}

/* ------------------------------------------------------------------ *
 * Apply the brand fonts.
 *
 * Oxygen ships unlayered theme rules that set a system font stack on the body,
 * headings, links and buttons. Those beat Winden's layered font-sans /
 * font-mono utilities, so on their own the utilities (and the :root tokens)
 * never take effect and the whole front end falls back to system-ui. Assert
 * the brand fonts here, unlayered and specific enough to win, to match the
 * staging reference: Geist for content, JetBrains Mono for buttons and any
 * element the design tags mono.
 * ------------------------------------------------------------------ */

/* Base content font: Geist. `html body` (0,0,2) beats Oxygen's `body` rule on
   specificity, so no !important is needed; headings, paragraphs and the slider
   inherit it. */
html body {
	font-family: var(--font-sans);
}

/* Make the Tailwind font utilities win over Oxygen so the design's font-sans /
   font-mono classes take effect wherever they are used (e.g. the mono language
   switcher, mono nav links, mono labels). */
.font-sans {
	font-family: var(--font-sans) !important;
}
.font-mono {
	font-family: var(--font-mono) !important;
}

/* Buttons use the mono accent, like staging (their text only; the slider
   prev/next circles hold an SVG, so this is harmless there). */
html body button {
	font-family: var(--font-mono) !important;
}
