html {
  color-scheme: light;
}
body {
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-background);
  overflow-wrap: anywhere;
}
h1 {
  font-size: var(--font-size-heading);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -0.025em;
}
h2 {
  font-size: 1.375rem;
  line-height: 1.25;
  font-weight: 700;
}
h3 {
  font-size: 1.125rem;
  line-height: 1.3;
}
a {
  color: var(--color-primary);
  text-underline-offset: 0.2em;
}
a:hover {
  text-decoration-thickness: 0.125rem;
}
:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 4px;
  box-shadow: 0 0 0 3px var(--color-surface);
}
code {
  font-size: 0.875em;
}
@media (forced-colors: active) {
  :focus-visible {
    outline-color: Highlight;
  }
}