/* Self-hosted typography for static pages, matching the app font roles. */
@font-face {
  font-family: 'Onest';
  src: url('./fonts/onest/onest-latin.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Spline Sans Mono';
  src: url('./fonts/spline-sans-mono/spline-sans-mono-latin.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('./fonts/ibm-plex-sans/IBMPlexSans-Regular.woff2') format('woff2');
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('./fonts/ibm-plex-sans/IBMPlexSans-Italic.woff2') format('woff2');
  font-weight: 100 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('./fonts/syne/syne-latin.woff2') format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('./fonts/playfair-display/playfair-display-latin.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('./fonts/playfair-display/playfair-display-latin-italic.woff2') format('woff2');
  font-weight: 400 900;
  font-style: italic;
  font-display: swap;
}
:root {
  --font-ui: 'Onest', 'Helvetica Neue', Arial, sans-serif;
  --font-brand: 'Syne', 'Helvetica Neue', Arial, sans-serif;
  --font-heading: var(--font-brand);
  --font-editorial: var(--font-ui);
  --font-mono: 'Spline Sans Mono', ui-monospace, monospace;
  --font-reading: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
  --weight-heading: 600;
  --weight-control: 500;
  --weight-body: 400;
  --tracking-heading: -.025em;
}