default.css

:root {
  --main-bg-color: #202124;
  --main-bg-color-lighter: #4e5159;
  --main-fg-color: #e8eaed;
}
body {
  font-family: "Noto Serif", serif;
  background-color: var(--main-bg-color);
  color: var(--main-fg-color);
  margin: 0;
  /* margin: 2rem auto; */
  /* max-width: 640px; */
  line-height: 1.4;
  /* font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu; */
  /* font-size: 2.5vmin; */
  /* font-size: 3.5vmin; */
  font-size: calc(15px + 0.390625vw);
  /* overflow-y: hidden; */

  /* prevent body from scrolling */
  /* margin: 0; */
  overflow: hidden;
  /* height: 100vh; */

  /* display: flex;
  justify-content: center;
  align-items: center; */
}

/* this is so we don't rely on the page's scrollbars, which are buggy on ios/itch */
#scroll-container {
  /* overflow-y: scroll; */
  /* padding: 20pt; */
  /* width: 100%; */
  /* width: 640px; */
  height: 100%;
  /* padding: 20px; */
  /* margin: 10px; */
  overflow-y: auto;
}

#scroll-placeholder {
  height: 10%;
}

#content-container {
  max-width: 640px;
  margin-inline: auto;
  padding: 30px;
  padding-top: 50px;
}


/* for minimum margin */
/* html {
  padding: 20pt;
} */

/* fix relayout on scrollbars appearing */
/* html {
  overflow-y: hidden;
} */

a,
a:visited {
  color: var(--main-fg-color);
}

/* for paragraphs, maybe make more specific later */
.para {
  padding-bottom: 1em;
}

.choice {
  margin-top: 0px;
  margin-bottom: 1em;
}

.fadein {
  animation: fadein 0.5s;
}

/* this is used to have the end of the page near the middle of the screen */
/* #content {
  height: 75%;
  overflow-y: scroll;
} */

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.old {
  filter: brightness(0.65);
  /* animation: darken 0.3s; */
}

/* @keyframes darken {
  from {
    filter: brightness(1);
  }
  to {
    filter: brightness(0.65);
  }
} */

* {
  scrollbar-color: var(--main-bg-color-lighter) var(--main-bg-color);
  scrollbar-width: thin;
}