@layer base {
  * {
    box-sizing: border-box;
  }

  :root {
    color-scheme: light dark;
    --light-font-color: #000000;
    --dark-font-color: #ffffff;
  }
  html {
    background-color: light-dark(#fcf8e3, rgb(25, 3, 27));
    color: light-dark(var(--light-font-color), var(--dark-font-color));
  }

  img {
    display: block;
    max-width: 100%;
  }

  h1,
  h2,
  h3,
  h4,
  h5 {
    line-height: 2rem;
  }

  main,
  footer,
  nav {
    max-width: 800px;
    padding: 10px;
    margin: 0 auto;
  }

  .projects div {
    margin: 5px 0;
  }

  li {
    margin: 5px 0;
  }
}