@font-face {
  font-family: "Literata";
  src: url("Literata-Variable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
}
@font-face {
  font-family: "Literata";
  src: url("Literata-Italic-Variable.woff2") format("woff2-variations");
  font-style: italic;
  font-weight: 100 900;
  font-display: block;
}
:root {
  color-scheme: light dark;
  hyphens: auto;
  scroll-behavior: smooth;
  font-family: "Literata";
  text-rendering: optimizeLegibility;
  --fg-color: #333333;
  --bg-color: #FFFFFF;
  --accent-color: #F76D65;
  --highlight-color: #F76D6555;
}
::selection {
  background-color: var(--highlight-color);
}
* {
  box-sizing: border-box;
}
body {
  background-color: var(--bg-color);
  color: var(--fg-color);
}
a {
  color: inherit;
  text-decoration: var(--accent-color) underline;
}
a:hover {
  color: var(--accent-color);
}
a::selection {
  color: var(--fg-color);
  text-decoration: var(--fg-color) underline;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fg-color: #CCCCCC;
    --bg-color: #000000;
  }
  img {
    opacity: 90%;
  }
}