<style>
  :root {
    --font-size: 18px;
    --font-family-headings: 'Sour Gummy', sans-serif;
    --font-family-copy: 'Poppins', serif;

    --page-spacing: 1em;

    --container-spacing-top-safe: max(1rem, env(safe-area-inset-top));
    --container-spacing-right-safe: max(1rem, env(safe-area-inset-right));
    --container-spacing-bottom-safe: max(1rem, env(safe-area-inset-bottom));
    --container-spacing-left-safe: max(1rem, env(safe-area-inset-left));

    --border-thin: 0.0625em;
    --border-radius: 0.75em;

    @media (min-height: 64em) {
      --page-spacing: 3em;
    }

    @media (min-width: 80em) {
      --font-size: 20px;
    }

    @media (min-width: 120em) {
      --font-size: 24px;
    }
  }
</style>
