/*
 * Self-hosted typography. No external font requests are made at runtime.
 * DINish and IBM Plex Mono are distributed under SIL OFL 1.1.
 * Source revisions, binary hashes and full licenses: ./assets/fonts/
 * Load after styles.css so the existing --sans / --mono tokens are replaced.
 */
@font-face {
  font-family: "DINish";
  src: url("./assets/fonts/DINish-Variable.woff2") format("woff2");
  font-weight: 300 900;
  font-stretch: 75% 125%;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DINish";
  src: url("./assets/fonts/DINish-Variable.woff2") format("woff2");
  font-weight: 300 900;
  font-stretch: 75% 125%;
  font-style: oblique 0deg 12deg;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("./assets/fonts/IBMPlexMono-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("./assets/fonts/IBMPlexMono-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-cjk: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --sans: "DINish", var(--font-cjk);
  --mono: "IBM Plex Mono", "PingFang SC", "Microsoft YaHei", monospace;
  --font-display: var(--sans);
  --font-navigation: var(--mono);
  --dinish-width: 125;
}

body {
  font-family: var(--sans);
  font-stretch: 125%;
  /* Keep wght/slnt automatic so each component's weight/style still works. */
  font-variation-settings: "wdth" var(--dinish-width);
}

.desktop-nav,
.mobile-nav,
.nav-contact,
.reader-mobile-bar,
.reader-back {
  font-family: var(--font-navigation);
  font-stretch: normal;
  font-variation-settings: normal;
}