:root {
  --ink: #252c32;
  --paper: #fcf8ee;
  --yellow: #f4dc78;
  --coral: #ec7966;
  --teal: #0d5049;
  --rose-paper: #fbe5dc;
  --mint-paper: #e0eee7;
  --body-font: "DM Sans", Arial, sans-serif;
  --heading-font: "Nunito Sans", "DM Sans", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { color: var(--ink); background: var(--paper); font-size: 100%; }
body { margin: 0; font-family: var(--body-font); font-size: 18px; line-height: 1.65; }
button, textarea, input, select { font: inherit; }
a { color: inherit; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
a, button, summary { -webkit-tap-highlight-color: #ec796655; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; }
[hidden] { display: none !important; }
img { max-width: 100%; }
h1, h2, h3, p, ul, figure { margin: 0; }
h1, h2, h3 { font-family: var(--heading-font); }
button, a, summary { touch-action: manipulation; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}