::selection {
  background-color: hsl(var(--color-selection-bg) / 0.5);
  color: hsl(var(--color-selection-text));
}
body {
  color: hsl(var(--color-text) / 0.8);
}
body > header,
body > footer,
body > main > section.site-nav,
body > main > section.flash {
  a { text-decoration: none; color: inherit; }
  color: hsl(var(--color-text-faded));
}
body > header.site-header > section.banner {
  &> span {
    a {
      transition:
        text-decoration-color var(--transition-base),
        color var(--transition-base);
      text-decoration: underline;
      text-decoration-color: hsl(var(--color-text-faded) / 0.5);
      &:hover, &:focus-visible {
        text-decoration-color: hsl(var(--color-text-faded));
      }
    }
    &:not(.current).matched-namespace a {
      color: hsl(var(--color-accent));
      text-decoration: overline;
      text-decoration-color: hsl(var(--color-accent) / 0.5);
      &:hover, &:focus-visible {
        text-decoration-color: hsl(var(--color-accent));
      }
    }
    &.current {
      color: hsl(var(--color-accent) / 0.5);
    }
  }
}
body > main > section.page-content {
  .text-faded { color: hsl(var(--color-text-faded)); opacity: 0.75; }
  .text-subtle { color: hsl(var(--color-text-subtle)); opacity: 0.75; }
  a:not(.button-like) {
    transition: color var(--transition-base);
    color: hsl(var(--color-link));
  }
  a:not(.button-like):hover {
    color: hsl(var(--color-link-hover));
    text-decoration: underline;
  }
  span.current {
    color: hsl(var(--color-link) / 0.5);
  }
  h1, h2, h3, h4, h5, h6 {
    color: hsl(var(--color-headings));
  }
  h1 a:not(.button-like),
  h2 a:not(.button-like),
  h3 a:not(.button-like),
  h4 a:not(.button-like),
  h5 a:not(.button-like),
  h6 a:not(.button-like) {
    transition: color var(--transition-base), text-decoration-color var(--transition-base), text-decoration-style var(--transition-base);
    color: hsl(var(--color-headings));
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: hsl(var(--color-headings));
    text-underline-offset: var(--page-headings-font-size-scale);
    &:hover, &:focus {
      color: hsl(var(--color-text));
      text-decoration-color: hsl(var(--color-text));
      text-decoration-style: solid;
    }
  }
}
