html {
  scroll-behavior: smooth;
}
@media (min-width: 32em) {
  body > header:not([class]) {
    padding: var(--s-2) var(--s0);
    border-bottom: var(--s-5) dashed var(--border);
    position: sticky;
    top: 0;
    background: var(--background);
  }
}
body > header nav a {
  font-size: 1.1rem;
  font-weight: 400;
}
.brand {
  text-decoration: none;
}
.brand:hover {
  text-decoration: underline;
}
.brand picture,
.brand img {
  height: 1.125em;
  height: 1.5cap;
  width: 1.125em;
  width: 1.5cap;
  display: inline;
}

/* code hacks */
.token.punctuation {
  color: unset;
}
pre {
  padding: var(--s0);
}