/* BEGIN NORMALIZE */
/* @link https://www.joshwcomeau.com/css/custom-css-reset/ */

/* 1. Use a more-intuitive box-sizing model */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
* {
  margin: 0;
}

/* 3. Enable keyword animations */
@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  /* 4. Add accessible line-height */
  line-height: 1.5;
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
}

/* 6. Improve media defaults */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls */
input,
button,
textarea,
select {
  font: inherit;
}

/* 8. Avoid text overflows */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
  font-size: inherit;
  font-weight: inherit;
}

/*
  10. Create a root stacking context
*/
#root,
#__next {
  isolation: isolate;
}

/* END NORMALIZE */

:root {
  --text-color: light-dark(oklch(0.2 0 0), oklch(1 0 0));
  --text-muted: light-dark(oklch(0.4 0 0), oklch(0.8 0 0));
  --font-lg: 1.414rem;
  scrollbar-gutter: stable;
}

body {
  font-family: system-ui;
  color: var(--text-color);
  font-size: 1rem;
  max-width: 80ch;
  margin-inline: auto;
}

menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

li {
  color: var(--text-muted);
  margin-block: 0.5rem;
}

a {
  color: var(--text-color);
  text-underline-offset: 0.25rem;
  overflow-wrap: break-word;
}

p {
  color: var(--text-muted);
  margin-block: 1.5rem;
}

h1 {
  font-weight: bold;
  font-size: var(--font-lg);
  line-height: 2rem;
  margin-bottom: 1rem;

  + * {
    margin-top: 0;
  }
}

h2 {
  font-weight: bold;
  font-size: var(--font-lg);
  line-height: 2rem;
  margin-top: 2.5rem;
  margin-bottom: 1rem;

  + * {
    margin-top: 0;
  }
}

pre {
  padding-inline: 1.25rem;
  padding-block: 1rem;
  border-radius: 0.5rem;
  overflow: auto;
}

/* :root { */
/*   --step--2: clamp(0.5002rem, 0.5002rem + 0vw, 0.5002rem); */
/*   --step--1: clamp(0.7072rem, 0.7072rem + 0vw, 0.7072rem); */
/*   --step-0: clamp(1rem, 1rem + 0vw, 1rem); */
/*   --step-1: clamp(1.414rem, 1.414rem + 0vw, 1.414rem); */
/*   --step-2: clamp(1.9994rem, 1.9994rem + 0vw, 1.9994rem); */
/*   --step-3: clamp(2.8271rem, 2.8271rem + 0vw, 2.8271rem); */
/*   --step-4: clamp(3.9976rem, 3.9976rem + 0vw, 3.9976rem); */
/*   --step-5: clamp(5.6526rem, 5.6526rem + 0vw, 5.6526rem); */
/* } */
