/* Typography belongs to the document, not browser defaults. Components may
 * opt into the mono token for code and editorial labels. */
body {
  font-family: var(--font-sans);
}

button,
input,
textarea,
select {
  font: inherit;
}

code,
kbd,
pre,
samp {
  font-family: var(--font-mono);
}

/* Text links read as editorial references. Page-level navigation can still
 * deliberately remove the decoration. */
a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition:
    color 180ms cubic-bezier(0.2, 0, 0, 1),
    text-decoration-color 180ms cubic-bezier(0.2, 0, 0, 1);
}

a:hover {
  text-decoration-color: currentcolor;
}

@media (prefers-reduced-motion: reduce) {
  a {
    transition: none;
  }
}

@media (width >= 2560px) {
  body {
    zoom: 1.5;
  }
}

@media (width >= 3840px) {
  body {
    zoom: 1.75;
  }
}
