:root {
  color-scheme: light dark;
}

body {
  font-family: "IBM Plex Mono", monospace;
}

a {
  color: #00a0ff;
  &:visited {
    color:  #00a0ff;
  }
}

pre.show-demo-code {
  /* font-size: 0.8rem; */
  background: light-dark(#f5f5f5, #333);
  text-wrap: auto;
  line-height: 1.4em;
  padding: 0.5rem 0.75rem;
}

header {
  padding: 1rem;
  position: absolute;
  width: calc(100% - 2rem);
  nav {
    display: flex;
    justify-content: end;
    position: relative;
    z-index: 999;
    ul {
      padding: 0;
      margin: 0;
      display: flex;
      gap: 1rem;
      align-items: center;
      margin-right: 2rem;
      font-size: 0.8rem;
      li {
        list-style: none;
        padding: 0;
      }
    }
  }
  #github {
    svg {
      width: 2rem;
      fill: #999;
      @media (prefers-color-scheme: dark) {
        fill: #eee;
      }
    }
  }
}