/* =============================================================================
   Kaipability — TYPE TOKENS. One file. Every page.
   -----------------------------------------------------------------------------
   Loaded by every page in <head>, BEFORE any page-local <style> block:

       <link rel="stylesheet" href="/assets/styles/tokens.css">

   WHY THIS FILE EXISTS
   Before it, --font-mono was declared in 31 separate places and the Google
   Fonts <link> appeared in 65. Changing one typeface meant editing 65 files
   and hoping none was missed. Now it is the two edits below.

   TO CHANGE A TYPEFACE
     1. Edit the @import so the new family is fetched.
     2. Edit the matching token in :root.
   That is the whole job. The ~400 places that say var(--font-mono) never
   need touching — they already resolve through the token.

   AFTER CHANGING THE MONO FACE, CHECK THE TABLES.
   Mono faces differ in character width. The lexicon comparison tables are the
   tightest thing on the site and a wider face pushes them past a 320px
   viewport. /x/jxr0rmkg/ is the switcher that shows this live and prints the
   table width for each candidate.
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,300..700;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  /* Display — system Georgia, zero font-bytes. h1–h4 across the site. */
  --font-display: Georgia,"Georgia Pro","Times New Roman",serif;

  /* Body — Source Sans 3. All reading text. */
  --font-body: "Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* Mono accent — kickers, eyebrows, section numbers, bylines, table headers,
     nav, figures. The one that gets swapped most often. */
  --font-mono: "IBM Plex Mono","SF Mono",Menlo,Consolas,monospace;
}
