/*
 * Letters, self-hosted.
 *
 * Harde regel in dit thema: geen enkele externe font- of beeldhost. Het vorige
 * thema laadde Fraunces en Inter bij fonts.googleapis.com, waarmee elke bezoeker
 * zijn IP naar een Amerikaanse server stuurde zonder grondslag en zonder
 * vermelding in de privacyverklaring.
 *
 * Fraunces en Inter zijn variabele letters, met de gewichtsas 100 tot 900.
 * Daarmee dekken twee bestanden per stijl elk gewicht uit het brandbook
 * (Fraunces 600, 700, 900 plus italic 400 en 600; Inter 300, 400, 500, 600) in
 * plaats van negen losse statische bestanden.
 *
 * Videopac, hieronder als derde, is dat niet. Dat is een statisch font met een
 * gewicht, en daarom staat er font-weight: 400 en format('woff2') in plaats van
 * 100 900 en format('woff2-variations'). Hier stond tot 7 september 2026 "beide
 * families zijn variabele letters", en dat klopte tot dat bestand erbij kwam.
 *
 * Bron van de bestanden: @fontsource-variable/fraunces 5.2.9 en
 * @fontsource-variable/inter 5.2.5, beide upstream uit github.com/google/fonts.
 * Videopac komt van Pixel Sagas en is hier zelf gesubset. Licenties staan naast
 * de bestanden in assets/fonts/; bij Videopac is dat geen licentietekst maar een
 * notitie, want die heeft er geen.
 *
 * Fraunces draait op de "standard"-variant, met naast de gewichtsas ook de
 * optische-grootte-as. Die is hier nodig en niet cosmetisch: de hero-titel loopt
 * tot 128px en Fraunces tekent op die maat een fijnere, contrastrijkere letter
 * dan op 14px. De browser stuurt die as zelf aan via font-optical-sizing: auto,
 * wat de standaardwaarde is.
 *
 * Let op bij het vervangen van een van deze bestanden: toets nooit op een
 * laadstatus. document.fonts.check() geeft true bij een woff2 die geen enkele
 * glyph zet. Meet met canvas measureText per gewicht tegen een fontnaam die
 * gegarandeerd niet bestaat.
 */

/* --- Fraunces, koppen en de erfgoed-stem ------------------------------- */

@font-face {
	font-family: 'Fraunces Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/fraunces-latin-standard-normal.woff2') format('woff2-variations');
	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;
}

/* Latin-extended, voor de Poolse en Duitse namen in de historie-tekst. */
@font-face {
	font-family: 'Fraunces Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/fraunces-latin-ext-standard-normal.woff2') format('woff2-variations');
	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;
}

/*
 * De italic is een merksignaal en geen incident: hij draagt sectielabels,
 * storytelling-titels, het mobiele menu en de pull quotes. Daarom een echt
 * italic-bestand, want een door de browser schuingetrokken serif ziet er
 * aantoonbaar slechter uit.
 */
@font-face {
	font-family: 'Fraunces Variable';
	font-style: italic;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/fraunces-latin-standard-italic.woff2') format('woff2-variations');
	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;
}

/* --- Inter, body en interface ------------------------------------------ */

@font-face {
	font-family: 'Inter Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/inter-latin-wght-normal.woff2') format('woff2-variations');
	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: 'Inter Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('../fonts/inter-latin-ext-wght-normal.woff2') format('woff2-variations');
	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;
}

/* --- Videopac, alleen de 59 in de hero ---------------------------------- */

/*
 * Elf glyphs, 1.080 bytes: de cijfers 0 tot en met 9 plus .notdef. Zelf gesubset
 * uit Videopac.ttf met pyftsubset op --unicodes=U+0030-0039.
 *
 * De unicode-range hieronder is geen detail maar het hele veiligheidsmechanisme.
 * De browser haalt dit bestand alleen op als er een cijfer in deze familie gezet
 * moet worden. Een letter valt daarmee vanzelf terug op de serif uit
 * --font-stencil, en op een binnenpagina zonder hero-foto wordt er niets
 * gedownload. Verbreed die range dus nooit "voor de zekerheid": er zitten geen
 * letters in het bestand, dus je zou een terugval inruilen voor een lege glyph.
 *
 * font-weight: 400 staat er expliciet omdat .stencil om var(--weight-bold)
 * vraagt. Zonder deze regel verzint de browser een vet, en dat verdikt de glyph
 * voordat de -webkit-text-stroke eroverheen gaat, waarmee de tracking die in
 * components.css is nagemeten niet meer klopt.
 */

@font-face {
	font-family: 'Videopac';
	font-style: normal;
	font-display: swap;
	font-weight: 400;
	src: url('../fonts/videopac-cijfers.woff2') format('woff2');
	unicode-range: U+0030-0039;
}