nav {
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  user-select: none;
  -webkit-user-select: none;

  ul {
    list-style: none;
    padding: 0;
  }

  > ul > li {
    text-transform: uppercase;

    & + * {
      margin-top: 1.25rem;
    }

    > details,
    > label {
      ul {
        margin-left: 0.25rem;
      }
    }

    a,
    summary {
      padding: 0.25rem 0;
    }

    ul {
      color: var(--off-color);
      overflow: hidden;

      li {
        text-transform: lowercase;
        display: block;
        position: relative;
        padding-left: 0.75rem;
        border-left: 1px;
      }
    }
  }

  li[data-highlight] {
    > details > summary,
    > a {
      text-transform: uppercase;
      color: var(--color);
    }

    > details > summary > small {
      opacity: 1;
    }

    > a::after,
    > details:not([open]) > summary::after {
      color: var(--orange) !important;
      content: "";
      background-color: var(--orange);
      width: 0.375rem;
      height: 0.375rem;
      border-radius: 9999px;
      display: inline-block;
      margin-bottom: 0.125rem;
      margin-left: 0.375rem;
    }
  }
}