:root {
  /* https://coolors.co/palette/006d77-83c5be-edf6f9-ffddd2-e29578 */
  --color-teal-dark: #006d77;
  --color-teal-medium: #83c5be;
  --color-teal-light: #edf6f9;
  --color-pink-light: #ffddd2;
  --color-pink-dark: #e29578;

  --color-dark: #333;
  --color-light: #eee;

  --font-base: 18px;
  --font-mono: "SFMono-Regular", Consolas, Liberation Mono, Menlo, Courier,
    monospace;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

  --radius-base: var(--font-base);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.body {
  background-color: var(--color-teal-medium);
  color: var(--color-dark);
  font-family: var(--font-sans);
  font-size: var(--font-base);
}

h1 {
  font-family: var(--font-mono);
}