/* Bundled Segoe UI — applied site-wide so the font renders even where it isn't installed. */

@font-face {
	font-family: "Segoe UI";
	src: url("../fonts/segoe-ui.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Segoe UI";
	src: url("../fonts/segoe-ui-italic.ttf") format("truetype");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Segoe UI";
	src: url("../fonts/segoe-ui-bold.ttf") format("truetype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Segoe UI";
	src: url("../fonts/segoe-ui-bold-italic.ttf") format("truetype");
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}

/* Bundled SF Pro Display (San Francisco) — used on mobile (see media query below). */

@font-face {
	font-family: "SF Pro Display";
	src: url("../fonts/SFPRODISPLAYREGULAR.OTF") format("opentype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "SF Pro Display";
	src: url("../fonts/SFPRODISPLAYMEDIUM.OTF") format("opentype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "SF Pro Display";
	src: url("../fonts/SFPRODISPLAYBOLD.OTF") format("opentype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* Optimistic — a single variable font (OptimisticVF).
 * Axes: wght 300–800, wdth 80–100, ital 0/1, DRKM 0/1 (dark mode).
 * One @font-face covers the whole weight + width range; use font-weight 300..800,
 * font-stretch 80%..100%, font-style italic, or font-variation-settings: "DRKM" 1.
 */
@font-face {
	font-family: "Optimistic";
	src: url("../fonts/optimistic.ttf") format("truetype");
	font-weight: 300 800;
	font-stretch: 80% 100%;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Optimistic";
	src: url("../fonts/optimistic.ttf") format("truetype");
	font-weight: 300 800;
	font-stretch: 80% 100%;
	font-style: italic;
	font-display: swap;
}

/* Baseline so any view that links this file inherits the font, including form controls. */
body {
	font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
}

button, input, select, textarea {
	font-family: inherit;
}

/* Mobile: use SF Pro (San Francisco). Desktop keeps Segoe UI. */
@media (max-width: 768px) {
	body {
		font-family: "Optimistic", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	}
}
