/*
 * Inter, self-hosted as in the app (beacon-ui src/renderer/src/tokens/type.css).
 * No Google Fonts: theme.font is false in mkdocs.yml, which also stops
 * Material from loading Roboto.
 *
 * Three faces, the same ones the app bundles: 400, 500 and a real 400
 * italic. Inter's italic is a redrawn face, so a synthesised slant of the
 * upright would be the wrong shape. See assets/fonts/NOTICE.txt for the
 * version and licence.
 *
 * `swap` rather than the app's `block`. The app loads its fonts from disk, so
 * its block period is imperceptible. Over a network, block means invisible
 * text until the file arrives; swap shows the fallback at once.
 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-latin-400-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/inter-latin-500-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-latin-400-italic.woff2') format('woff2');
}

/*
 * Material builds its font stacks as var(--md-text-font), then its own
 * system fallbacks, so these slot in at the front. Code has no bundled face:
 * each platform's own monospace is used.
 */
:root {
  --font-ui: 'Inter', sans-serif;
  --md-text-font: 'Inter';
  --md-code-font: 'Cascadia Mono';
}

/*
 * Only 400 and 500 exist. Without this, anything Material sets at 700 would
 * be drawn as a smeared fake bold of the 500. With it, 700 falls back to
 * the 500 face, which is the heaviest weight the design uses.
 */
body {
  font-synthesis-weight: none;
}