/* SELF-HOSTED FONTS. Latin subset, woff2, 60KB on disk for all four files. * * These used to come from Google's font CDN, which is two render-blocking round * trips to a third party before first paint: one for the CSS, then one per font * file it names. On a phone on venue wifi that is the slowest thing on the page, * and this audience is almost entirely on phones. * * OUTFIT IS DECLARED ONCE WITH A WEIGHT RANGE, not four times. It is a variable * font and all four weights are the same file, so four @font-face blocks naming * it had the browser fetch that 32KB file TWICE on the home page. One face with * font-weight:400 700 covers the range from a single download. * * font-display:swap is kept: text paints immediately in the fallback and * reflows when the face arrives. Served from our own origin now, so that window * is short. * * These files were pulled from Google's CSS API with a modern User-Agent (which * is what makes it serve woff2 rather than ttf) and committed. fetch-fonts.sh is * a DIFFERENT job: it caches ttf copies for the OG image generator. Adding a * weight here means fetching the new file by hand and adding a face below. */ @font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap; src:url(/assets/fonts/outfit-UYLknw.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:'Space Mono';font-style:normal;font-weight:400;font-display:swap; src:url(/assets/fonts/space-mono-Xi4EwQ.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:'Space Mono';font-style:normal;font-weight:700;font-display:swap; src:url(/assets/fonts/space-mono-i6WZ3Q.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:'Titan One';font-style:normal;font-weight:400;font-display:swap; src:url(/assets/fonts/titan-one--khykw.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} /* --------------------------------------------------------------------------- * METRIC-MATCHED FALLBACKS, added 24 August 2026, the day the site went live. * * WHAT THEY FIX. Every face above is font-display:swap, so text paints in the * system fallback and RE-LAYS-OUT when the real file lands. A performance audit * on the live site traced every layout shift on the whole site to that one * moment, at t = 1700-1860ms, about 50-100ms after first paint: nav.nav-links * narrowing 460 -> 433px, the Subscribe label 110 -> 104px, headings * re-measuring. Worst page /topps-card-values.html at CLS 0.0789 on desktop, * where a paragraph grows 42 -> 66px and pushes a column down. * * A fallback declared with size-adjust and ascent/descent overrides occupies * the SAME SPACE as the real face, so when the swap happens the glyphs change * and nothing moves. * * EVERY NUMBER HERE WAS MEASURED, NOT COPIED FROM A GENERATOR. Canvas * measureText over a 128-character sample of the site's own copy at 100px, on * the live site with document.fonts.ready awaited, against the same string in * the fallback family: * * Outfit 6620.8px real / 6771.3px Arial -> size-adjust 97.78% * Titan One 7789.2px real / 6771.3px Arial -> size-adjust 115.03% * Space Mono 6312.9px real / 7766.5px mono -> size-adjust 81.28% * * Ascent and descent come from fontBoundingBox on the same probe: Outfit * 1.00/0.26, Titan One 0.97/0.18, Arial 0.91/0.21, all in em. The overrides are * expressed against the ALREADY SCALED em, which is why each is the real value * divided by its own size-adjust rather than the raw ratio. Getting that * division backwards is the usual way this is done wrong and it looks nearly * right, so re-derive rather than tweaking by eye. * * SPACE MONO IS DELIBERATELY NOT GIVEN ONE. At 81.28% the fallback would be * squeezed hard enough to read as a different typeface during the swap window, * and Space Mono is used for small labels where the shift it causes is * measured in single pixels. A cure worse than the disease. * * local() ONLY, SO THIS COSTS NOTHING. No file is fetched; it re-describes a * font already on the device. Arial is used as the source because it is present * on every platform this site sees, and Helvetica resolves to it on Apple. * ------------------------------------------------------------------------- */ @font-face{font-family:'Outfit Fallback';src:local('Arial'),local('Helvetica'),local('Roboto'); size-adjust:97.78%;ascent-override:102.27%;descent-override:26.59%;line-gap-override:0%} /* ARIAL, NOT ARIAL BLACK, AND THAT IS THE WHOLE BUG THIS LINE FIXES. The first draft listed Arial Black first because Titan One is a heavy display face and a heavy fallback looked like the closer match. It is 20.32% WIDER than Titan One once size-adjust is applied, because the 115.03% above was measured against ARIAL. A size-adjust is only valid against the family it was measured from, so the source list must not offer a different one first. Measured on the built page: Arial Black fallback 9371.7px against 7789.2px real. */ @font-face{font-family:'Titan One Fallback';src:local('Arial'),local('Helvetica'),local('Liberation Sans'),local('Roboto'); size-adjust:115.03%;ascent-override:84.33%;descent-override:15.65%;line-gap-override:0%}