/* ============================================================ Resonant System — self-hosted fonts The same files Google was serving: the latin subsets of Source Serif 4 and Inter, byte for byte, now coming from this domain instead of fonts.gstatic .com. Why: the browser rendered in a system font and swapped when the fonts arrived from Google, which is the flicker on a refresh. From the same origin there's no extra DNS lookup, TLS handshake or round trip — they arrive with everything else and the swap window mostly closes. It also removes the site's only third-party request. privacy.html had to disclose that Google receives a visitor's IP address as part of delivering a font. It doesn't any more. Three files, not eight. Google's stylesheet declares a separate @font-face for every weight, but they all point at the same URL: these are variable fonts, and one file carries every weight on its axis. Declaring the axis range here is what the per-weight rules were standing in for. Both families are under the SIL Open Font License 1.1, which permits redistribution — see OFL.txt in the fonts directory. font-display: optional, not swap. swap draws the text in a system font and then replaces it, and the replacement changes the text's size — the shift you see on a refresh. optional gives the browser a short window: if the font is ready it's used, and if it isn't the fallback is used for that page load and never swapped. Nothing changes after it's drawn. The cost is that a first-ever visit on a slow connection can render in the system font. It's cached from then on, and on any refresh — where this was visible — the font is already there. The preload tags in each page's are the other half. Without them the browser has to read the HTML, fetch this file, parse it, discover the font URLs and only then fetch them: two round trips in sequence, which is most of what optional's window gets spent on. ============================================================ */ @font-face { font-family: 'Source Serif 4'; font-style: normal; font-weight: 200 900; font-display: optional; src: url('/assets/fonts/source-serif-4-latin.woff2') format('woff2'); 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: 'Source Serif 4'; font-style: italic; font-weight: 200 900; font-display: optional; src: url('/assets/fonts/source-serif-4-italic-latin.woff2') format('woff2'); 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'; font-style: normal; font-weight: 100 900; font-display: optional; src: url('/assets/fonts/inter-latin.woff2') format('woff2'); 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; }