body > header nav {
  --pico-primary: var(--pico-contrast);
  align-items: center;
  justify-content: end;

  > big {
    padding-right: 1rem;
    margin-inline-end: auto;
    text-wrap: nowrap;

    a {
      text-decoration: none;
      font-weight: bold;
      font-size: larger;
      align-items: baseline;
    }
  }
  li.nav-docs {
    text-wrap: balance;
    text-align: end;

    &::before {
      display: none;
    }
    > *:not(:first-child) {
      margin-inline-start: 0.5rem;

      @media (width < 1024px) {
        display: none;
      }
    }
    summary {
      padding-block-end: 0;

      &::after {
        display: none;
      }
      &:not(:hover) {
        text-decoration: underline dashed var(--pico-secondary-focus);
      }
    }
    ul {
      text-align: start;
    }
  }
}
body > main {
  padding-block-start: 2rem;
}
.hero {
  display: flex;
  flex-direction: column;
  text-wrap: balance;
  @media (width >= 768px) {
    justify-content: center;
    text-align: center;
    min-height: calc(100dvh - 200px);
  }

  nav {
    gap: 1rem;
    margin-block-start: 2em;
    justify-content: normal;
    @media (width >= 768px) {
      justify-content: center;
    }
    a {
      align-items: center;
    }
  }
}
h1 sup {
  color: #8b4f00;
}
*:is(h1, h2, h3) mark {
  background: linear-gradient(
    to right,
    rgb(215.4, 140.8, 210.2),
    rgb(184.5, 153, 237.75),
    rgb(156.6, 165.3, 232.6),
    rgb(142.75, 168.95, 240.05)
  );
  background-clip: text;
  color: transparent;
  padding: 0;
}
*:is(a, summary) mark {
  font-size: 12px;
  vertical-align: text-bottom;
  font-weight: 600;
  border-radius: 0.125rem;
}

/* Colorize FA icons */
.fa-tailwind-css {
  color: deepskyblue;
}
.fa-bootstrap {
  color: blueviolet;
}
/* ... except hovered buttons */
[role="button"]:not(:hover, :focus-visible) {
  [class^="fa-"] {
    color: inherit;
  }
}

/* Beautify markup fetched from https://picocss.com/ */
:is(h1, h2, h3, h4, h5, h6) > a[id], /*TODO: via blades */
.code > a.copy-to-clipboard,
a:has(svg.icon-edit) {
  display: none;
}
