:root {
  --bg: #f0f0f0;
  --fg: #333;
  /* set by main.js by measuring .rejoice */
  --hang: 1em;
  --hang-strong: 0;
}
@media (prefers-color-scheme: dark) {
  body {
    --fg: #f2f2f2;
    --bg: #171a1b;
  }
}
body {
  color: var(--fg);
  background: var(--bg);
  /*font-family: Imprint MT Std;*/
  font-family: serif;
  font-size: 12pt;
  max-width: 400pt;
  padding: 1em;
  margin: 0 auto;
  margin-bottom: 50vh;
  line-height: 1.4;
}
a {
  color: inherit;
}
div#toc {
  margin-top: 4em;
}
nav {
  text-align: center;
}
p {
  text-align: justify;
  hyphens: auto;
  text-wrap: pretty; /* prevent orphans */
}
h2 {
  font-weight: normal;
  font-style: italic;
  margin-top: 3em;
  font-size: 1rem;
  text-align: center;
  text-wrap: balance;
}
li.strong {
  --hang: var(--hang-strong);
  margin-top: 1em;
  font-weight: bold;
}
li {
  list-style-type: none;
  margin-left: calc(2em + var(--hang));
  text-indent: calc(-1  * var(--hang));
  text-wrap: balance;
}
header {
  width: 100%;
  background: var(--bg);
  position: sticky;
  top: 0;
  margin-bottom: 1em;
  outline: 0.5em solid var(--bg);
}
header img {
  max-width: 100%;
  max-height: 40vh;
  display: block;
  margin: 0 auto;
}