/*
 * Font faces live HERE, in a real stylesheet loaded with <link>, and not in
 * global.css. THIS IS LOAD-BEARING. Do not move these rules back into the
 * bundled CSS.
 *
 * astro.config.mjs sets build.inlineStylesheets: 'always', so every page ships
 * its whole stylesheet inside one <style> element in the head, and that block
 * differs per page (59KB on the homepage, 35KB on the blog index). When the
 * View Transitions router swaps the head on a soft navigation it removes the
 * old <style> and inserts the new one. Any @font-face inside it is torn down
 * and re-created, so the browser re-resolves every font: text repaints in the
 * fallback and then swaps back to Poppins a frame later.
 *
 * Measured consequence before this file existed: a 0.2577 layout shift landing
 * ~115ms AFTER astro:page-load on the blog index, where category pills grew
 * from 141px to 144px wide and 39px to 40px tall and re-wrapped onto a second
 * line, dragging every section below them down. Smaller versions of the same
 * shift hit every hub page. That is the "jerk when switching pages".
 *
 * A <link rel="stylesheet"> with an unchanging href is kept in place by the
 * router across navigations, so these faces are never torn down.
 */

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/poppins-400.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/poppins-500.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/poppins-600.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/poppins-700.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/poppins-800.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/fonts/poppins-900.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}

/*
 * Metric-matched fallback, PER WEIGHT.
 *
 * Two things make a single size-adjust wrong here. First, the Poppins/Arial
 * width ratio climbs with weight: 111.07% at 400 up to 116.84% at 900.
 * Second, local('Arial') resolves to Arial REGULAR even inside a face
 * declared for weight 600, so the browser does not synthesise bold and every
 * ratio must be measured against Arial 400, not against synthetic bold. An
 * earlier version measured against synthetic bold and left the weight-600
 * header nav 30px too narrow, which, because that nav is centred, showed up
 * as a 402px horizontal jump the moment Poppins arrived.
 *
 * Poppins at weight 500 does not measure reliably through canvas, so its
 * value is interpolated between 400 and 600 rather than guessed.
 *
 * ascent-override and descent-override are the face metrics (ascent 105,
 * descent 35 per 100px em) divided by each size-adjust.
 */
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 400;
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 111.07%;
  ascent-override: 94.53%;
  descent-override: 31.51%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 500; /* interpolated, see note */
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 112.24%;
  ascent-override: 93.55%;
  descent-override: 31.18%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 600;
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 113.41%;
  ascent-override: 92.58%;
  descent-override: 30.86%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 700;
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 114.69%;
  ascent-override: 91.55%;
  descent-override: 30.52%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 800;
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 115.76%;
  ascent-override: 90.70%;
  descent-override: 30.23%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  font-weight: 900;
  src: local('Arial'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 116.84%;
  ascent-override: 89.87%;
  descent-override: 29.96%;
  line-gap-override: 0%;
}
