@font-face {
  font-family: "Waiting for the Sunrise";
  font-style: normal;
  font-display: swap;
  src: url("/fonts/Waiting_for_the_Sunrise/WaitingfortheSunrise-Regular.woff") format("woff");
}

html {
  font-size: var(--font-size-base);
  writing-mode: horizontal-tb;
}

body {
  font-size: 1rem;
  font-family: var(--font-system);
  font-weight: var(--font-weight-light);
  font-feature-settings: "liga" on, "ss06";
  font-variant-ligatures: common-ligatures;
  letter-spacing: normal;
}

.has-emoji {
  font-family: sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-system);
  font-weight: var(--font-weight-base);
  font-feature-settings: "salt" on;
}

h1 {
  font-size: 2rem;
}

@media (min-width: 1024px) {
  h1 {
    font-size: 3rem;
  }
}

h2 {
  font-size: 2rem;
}

@media (min-width: 1024px) {
  h2 {
    font-size: 2.5rem;
  }
}

h3 {
  font-size: 1.5rem;
}

@media (min-width: 1024px) {
  h3 {
    font-size: 2rem;
  }
}

h4 {
  font-size: 1.25rem;
}

h5,
h6 {
  font-size: 1.05rem;
}

::target-text {
  background-color: var(--colour-granite-gray);
  color: var(--colour-white);
}

.theme-dark ::target-text {
  background-color: var(--colour-pastel-orange);
  color: var(--colour-black-olive);
}

p {
  font-feature-settings: "onum" on;
  font-variant-numeric: oldstyle-nums;
}

aside {
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.6;
}

blockquote {
  font-size: 90%;
  font-style: italic;
  line-height: 1.6;
}

strong,
.heavy {
  font-weight: 500;
}

em {
  font-style: italic;
}

sup {
  font-variant-position: super;
  font-size: 0.7rem;
}

sub {
  font-variant-position: sub;
  font-size: 0.7rem;
}

.frac {
  font-feature-settings: "frac" on;
  font-variant-numeric: diagonal-fractions;
}

.end-of-story {
  font-size: 1rem;
}

.main-content__page p code,
.main-content__page li code {
  font-size: 0.75rem;
}
