html {
  /* V */
  min-height: 100vh;
  overscroll-behavior-y: none;
}

body {
  --body-width: 860px;
  --body-padding: 5px;
  /* V */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin-top: 0;
  margin-bottom: 0;
  /* H */
  max-width: var(--body-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--body-padding);
  padding-right: var(--body-padding);
  /* Other */
  background: var(--color-00);
  font-family: system-ui, sans-serif;
}

main {
  /* H */
  display: flex;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  flex-grow: 1; /* to flush the footer at the bootom */
}


p {
  font-family: "Inter", Roboto, "Open Sans", Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem; /* or 16px */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.main-title {
  /* Other */
  text-align: center;
}