/*
 * The three faces, served from this origin.
 *
 * Not from Google. The privacy page says "no fonts or scripts from another
 * company's servers" and that sentence is worth more than the convenience: a
 * webfont request is a request, it carries an address and a referrer, and a
 * promise that holds everywhere except the typeface is not a promise.
 *
 * Latin only, one weight per role. The variable Fraunces is a hundred and
 * thirty kilobytes for one heading face, and latin-ext doubles every file for
 * characters this copy will never draw. What is here is four files and about a
 * hundred and twenty five kilobytes, which is the price of the whole look.
 *
 * Only the weights below exist. Asking CSS for a weight that is not here makes
 * the browser draw a synthetic one, which is the smeared bold that gives away
 * a site that did this carelessly.
 */

@font-face {
  font-family: "Fraunces";
  font-style: normal;
  /* A range, not a weight, for the same reason Instrument Sans carries one:
     this file is variable and holds the axis. Declared at 600 alone it was
     the only face in the family, so anything asking for 400 got 600 drawn
     back at it - which is how the brandline description ended up as heavy
     as the wordmark beside it. Every heading still asks for 600 and still
     gets exactly what it got before. */
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/fraunces-var.woff2?v=88e17be0") format("woff2");
}

@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  /* A range, not a weight. This file is variable: it carries every weight from
     400 to 700 on one axis, and asking for 600 moves the axis. Declared as two
     fixed faces it was the same file fetched twice under two names, which is
     how the duplicate was found - both had the same content hash. */
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/instrument-sans-var.woff2?v=6219bc4b") format("woff2");
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/jetbrains-mono-400.woff2?v=2c32b9b3") format("woff2");
}

/*
 * What the browser draws in the window before those four arrive.
 *
 * Left alone it draws the first family in the stack, and the first family in
 * the stack is the system font, which is nowhere near the same size. Measured
 * at the sizes this page actually uses: the headline in the system serif is
 * 19.7% wider than in Fraunces, body copy 11.9% wider than Instrument Sans,
 * the system monospace 29% narrower than JetBrains Mono. So the page was laid
 * out once in the wrong metrics and again in the right ones, and everything
 * moved. That is the jump on refresh.
 *
 * Each face below is a font already on the machine, stretched by size-adjust
 * and the vertical overrides to the metrics of the one it stands in for. The
 * numbers were measured in the browser, in the DOM rather than on a canvas,
 * against these exact families - which is why each is named singly. One
 * size-adjust cannot be right for two different fonts.
 *
 * The bold stand-ins name the bold file itself. Pointing them at the regular
 * one looks equivalent and is not: naming a family inside @font-face suppresses
 * the synthetic bold the browser would otherwise draw, so the face renders at
 * regular width while the number here assumes bold. That was worth 5%.
 *
 * Nothing is fetched for any of this. local() only ever looks at the disk.
 */

@font-face {
  font-family: "Fraunces Fallback";
  font-weight: 600;
  src: local("Times New Roman Bold"), local("TimesNewRomanPS-BoldMT");
  size-adjust: 109.83%;
  ascent-override: 89.23%;
  descent-override: 23.22%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Instrument Sans Fallback";
  font-weight: 400;
  src: local("Arial"), local("ArialMT");
  size-adjust: 100.16%;
  ascent-override: 96.85%;
  descent-override: 24.96%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Instrument Sans Fallback";
  font-weight: 600;
  src: local("Arial Bold"), local("Arial-BoldMT");
  size-adjust: 97.47%;
  ascent-override: 99.51%;
  descent-override: 25.65%;
  line-gap-override: 0%;
}

/* Courier New matched the metrics exactly and looked like a typewriter, which
   is the one thing JetBrains Mono is not. Avi saw it on the buttons and said
   the type was not crisp; he was looking at Courier.
   Menlo is 0.34% off on width and looks like what it stands in for. Note the
   name: local("Menlo") finds nothing, because the lookup is by full name and
   PostScript name, not by family. It failed silently and fell through to the
   system mono, which is how a wrong number got measured for it once already. */
@font-face {
  font-family: "JetBrains Mono Fallback";
  src: local("Menlo-Regular"), local("Menlo Regular");
  size-adjust: 99.66%;
  ascent-override: 102.35%;
  descent-override: 30.10%;
  line-gap-override: 0%;
}