:root {
  color-scheme: light dark;
}

body {
  background-color: light-dark(#ffffff, #212121);
  color: light-dark(#000000, #cccccc);
  font-family: -apple-system, sans-serif;
  font-size: 1.25rem;
  line-height: 1.5;
  padding: 1rem;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

main {
  margin-inline: auto;
  max-width: 65ch;
}

a {
  color: light-dark(#0066cc, #41ff00);
  text-decoration: underline;
  text-decoration-style: wavy;
  text-underline-offset: 0.25em;
  text-decoration-thickness: 0.1em;
}

a:hover,
a:focus-visible {
  color: #ef4444;
  text-decoration-style: solid;
}

h1 {
  color: light-dark(#000000, #eeeeee);
  font-variation-settings: "wdth" 70, "wght" 900;
}