@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;1,500&display=swap";
/* borrowed from https://codepen.io/jakob-e/pen/doMoML */
/* context-aware lighten: darkens if dark, lightens if light */
/* blend two colors together */
/* context-aware blend: blends towards color1 if dark, color2 if light */
/* change the opacity of a color */
/* get CSS variable based on variable-prefix */
@font-face {
  font-family: "Menlo Regular", monospace;
  src: local("Menlo Regular"), local("Menlo-Regular"), url(../fonts/Menlo-Regular.eot?#iefix) format("embedded-opentype"), url(../fonts/Menlo-Regular.woff2) format("woff2"), url(../fonts/Menlo-Regular.woff) format("woff"), url(../fonts/Menlo-Regular.ttf) format("truetype"), url(../fonts/Menlo-Regular.svg#Menlo-Regular) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
:root {
  --variable-prefix: ;
  /* --- base --- */
  --font: 'Menlo Regular', 'IBM Plex Mono', monospace;
  --font-size: 16px;
  --border-radius: 0;
  --border-radius-medium: 0;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --is-dark-theme: true;
    /* --- colors --- */
    --color-white: rgb(255, 255, 255);
    --color-black: rgb(0, 0, 0);
    --color-lightgrey: rgb(211, 211, 211);
    --color-grey: rgb(128, 128, 128);
    --color-navy: rgb(0, 0, 229);
    --color-green: rgb(0, 255, 0);
    --color-red: rgb(255, 0, 0);
    --color-brown: rgb(183, 47, 47);
    --color-purple: rgb(186, 104, 255);
    --color-orange: rgb(255, 165, 0);
    --color-yellow: rgb(255, 255, 0);
    --color-lime: rgb(0, 255, 0);
    --color-teal: rgb(0, 185, 168);
    --color-cyan: rgb(0, 195, 255);
    --color-blue: rgb(97, 107, 255);
    --color-fuchsia: rgb(255, 0, 255);
    --color-white-light: rgb(255, 255, 255);
    --color-white-dark: rgb(204, 204, 204);
    --color-white-dark-2: rgb(153, 153, 153);
    --color-black-light: rgb(0, 0, 0);
    --color-black-dark: rgb(0, 0, 0);
    --color-black-dark-2: rgb(0, 0, 0);
    --color-lightgrey-light: rgb(253, 253, 253);
    --color-lightgrey-dark: rgb(169, 169, 169);
    --color-lightgrey-dark-2: rgb(127, 127, 127);
    --color-grey-light: rgb(154, 154, 154);
    --color-grey-dark: rgb(102, 102, 102);
    --color-grey-dark-2: rgb(77, 77, 77);
    --color-navy-light: rgb(0, 0, 255);
    --color-navy-dark: rgb(0, 0, 183);
    --color-navy-dark-2: rgb(0, 0, 137);
    --color-green-light: rgb(0, 255, 0);
    --color-green-dark: rgb(0, 204, 0);
    --color-green-dark-2: rgb(0, 153, 0);
    --color-red-light: rgb(255, 0, 0);
    --color-red-dark: rgb(204, 0, 0);
    --color-red-dark-2: rgb(153, 0, 0);
    --color-brown-light: rgb(220, 56, 56);
    --color-brown-dark: rgb(146, 38, 38);
    --color-brown-dark-2: rgb(110, 28, 28);
    --color-purple-light: rgb(225, 125, 255);
    --color-purple-dark: rgb(150, 83, 204);
    --color-purple-dark-2: rgb(112, 62, 153);
    --color-orange-light: rgb(255, 200, 0);
    --color-orange-dark: rgb(204, 133, 0);
    --color-orange-dark-2: rgb(153, 99, 0);
    --color-yellow-light: rgb(255, 255, 0);
    --color-yellow-dark: rgb(204, 204, 0);
    --color-yellow-dark-2: rgb(153, 153, 0);
    --color-lime-light: rgb(0, 255, 0);
    --color-lime-dark: rgb(0, 204, 0);
    --color-lime-dark-2: rgb(0, 153, 0);
    --color-teal-light: rgb(0, 222, 200);
    --color-teal-dark: rgb(0, 148, 133);
    --color-teal-dark-2: rgb(0, 111, 100);
    --color-cyan-light: rgb(0, 234, 255);
    --color-cyan-dark: rgb(0, 156, 204);
    --color-cyan-dark-2: rgb(0, 117, 153);
    --color-blue-light: rgb(116, 130, 255);
    --color-blue-dark: rgb(78, 86, 204);
    --color-blue-dark-2: rgb(58, 64, 153);
    --color-fuchsia-light: rgb(255, 0, 255);
    --color-fuchsia-dark: rgb(204, 0, 204);
    --color-fuchsia-dark-2: rgb(153, 0, 153);
    --color-bright-green: rgb(0, 255, 0);
    --color-dark-green: rgb(0, 179, 0);
    --color-gold: rgb(255, 255, 0);
    --color-olive: rgb(0, 179, 0);
    --color-violet: rgb(0, 195, 255);
    --color-pink: rgb(255, 0, 255);
    --color-bright-green-light: rgb(0, 255, 0);
    --color-bright-green-dark: rgb(0, 204, 0);
    --color-bright-green-dark-2: rgb(0, 153, 0);
    --color-dark-green-light: rgb(0, 215, 0);
    --color-dark-green-dark: rgb(0, 143, 0);
    --color-dark-green-dark-2: rgb(0, 107, 0);
    --color-gold-light: rgb(255, 255, 0);
    --color-gold-dark: rgb(204, 204, 0);
    --color-gold-dark-2: rgb(153, 153, 0);
    --color-olive-light: rgb(0, 215, 0);
    --color-olive-dark: rgb(0, 143, 0);
    --color-olive-dark-2: rgb(0, 107, 0);
    --color-violet-light: rgb(0, 234, 255);
    --color-violet-dark: rgb(0, 156, 204);
    --color-violet-dark-2: rgb(0, 117, 153);
    --color-pink-light: rgb(255, 0, 255);
    --color-pink-dark: rgb(204, 0, 204);
    --color-pink-dark-2: rgb(153, 0, 153);
    /* --- theme --- */
    --color-selection: rgba(0, 255, 0, 0.4);
    --color-text: var(--color-lightgrey);
    --color-background: var(--color-black);
    --color-links: var(--color-cyan);
    --color-accent: var(--color-lime);
    --color-selection-text: var(--color-yellow-light);
    /* --- levels --- */
    --color-primary-hover: rgb(51, 255, 0);
    --color-primary-active: rgb(102, 255, 0);
    --color-secondary-hover: rgb(200, 83, 204);
    --color-secondary-active: rgb(214, 62, 255);
    --color-tertiary-hover: rgb(255, 183, 0);
    --color-tertiary-active: rgb(255, 201, 0);
    --color-primary: var(--color-lime);
    --color-primary-focus: var(--color-yellow);
    --color-secondary: var(--color-purple);
    --color-secondary-focus: var(--color-fuchsia);
    --color-tertiary: var(--color-orange);
    --color-tertiary-focus: var(--color-yellow);
  }
}
@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --is-dark-theme: false;
    /* --- colors --- */
    --color-white: rgb(0, 0, 0);
    --color-black: rgb(255, 255, 255);
    --color-lightgrey: rgb(128, 128, 128);
    --color-grey: rgb(211, 211, 211);
    --color-navy: rgb(97, 107, 255);
    --color-green: rgb(0, 255, 0);
    --color-red: rgb(183, 47, 47);
    --color-brown: rgb(255, 0, 0);
    --color-purple: rgb(103, 0, 187);
    --color-orange: rgb(182, 119, 0);
    --color-yellow: rgb(180, 180, 0);
    --color-lime: rgb(0, 179, 0);
    --color-teal: rgb(0, 130, 117);
    --color-cyan: rgb(0, 134, 175);
    --color-blue: rgb(0, 0, 229);
    --color-fuchsia: rgb(177, 0, 177);
    --color-white-light: rgb(0, 0, 0);
    --color-white-dark: rgb(0, 0, 0);
    --color-white-dark-2: rgb(0, 0, 0);
    --color-black-light: rgb(204, 204, 204);
    --color-black-dark: rgb(255, 255, 255);
    --color-black-dark-2: rgb(255, 255, 255);
    --color-lightgrey-light: rgb(102, 102, 102);
    --color-lightgrey-dark: rgb(154, 154, 154);
    --color-lightgrey-dark-2: rgb(179, 179, 179);
    --color-grey-light: rgb(169, 169, 169);
    --color-grey-dark: rgb(253, 253, 253);
    --color-grey-dark-2: rgb(255, 255, 255);
    --color-navy-light: rgb(78, 86, 204);
    --color-navy-dark: rgb(116, 130, 255);
    --color-navy-dark-2: rgb(136, 152, 255);
    --color-green-light: rgb(0, 204, 0);
    --color-green-dark: rgb(0, 255, 0);
    --color-green-dark-2: rgb(0, 255, 0);
    --color-red-light: rgb(146, 38, 38);
    --color-red-dark: rgb(220, 56, 56);
    --color-red-dark-2: rgb(255, 66, 66);
    --color-brown-light: rgb(204, 0, 0);
    --color-brown-dark: rgb(255, 0, 0);
    --color-brown-dark-2: rgb(255, 0, 0);
    --color-purple-light: rgb(82, 0, 150);
    --color-purple-dark: rgb(123, 0, 224);
    --color-purple-dark-2: rgb(144, 0, 255);
    --color-orange-light: rgb(146, 95, 0);
    --color-orange-dark: rgb(218, 142, 0);
    --color-orange-dark-2: rgb(255, 166, 0);
    --color-yellow-light: rgb(144, 144, 0);
    --color-yellow-dark: rgb(216, 216, 0);
    --color-yellow-dark-2: rgb(252, 252, 0);
    --color-lime-light: rgb(0, 143, 0);
    --color-lime-dark: rgb(0, 215, 0);
    --color-lime-dark-2: rgb(0, 251, 0);
    --color-teal-light: rgb(0, 104, 94);
    --color-teal-dark: rgb(0, 156, 140);
    --color-teal-dark-2: rgb(0, 182, 164);
    --color-cyan-light: rgb(0, 107, 140);
    --color-cyan-dark: rgb(0, 161, 210);
    --color-cyan-dark-2: rgb(0, 188, 245);
    --color-blue-light: rgb(0, 0, 183);
    --color-blue-dark: rgb(0, 0, 255);
    --color-blue-dark-2: rgb(0, 0, 255);
    --color-fuchsia-light: rgb(142, 0, 142);
    --color-fuchsia-dark: rgb(212, 0, 212);
    --color-fuchsia-dark-2: rgb(248, 0, 248);
    --color-bright-green: rgb(0, 179, 0);
    --color-dark-green: rgb(0, 255, 0);
    --color-gold: rgb(180, 180, 0);
    --color-olive: rgb(0, 179, 0);
    --color-violet: rgb(0, 134, 175);
    --color-pink: rgb(177, 0, 177);
    --color-bright-green-light: rgb(0, 143, 0);
    --color-bright-green-dark: rgb(0, 215, 0);
    --color-bright-green-dark-2: rgb(0, 251, 0);
    --color-dark-green-light: rgb(0, 204, 0);
    --color-dark-green-dark: rgb(0, 255, 0);
    --color-dark-green-dark-2: rgb(0, 255, 0);
    --color-gold-light: rgb(144, 144, 0);
    --color-gold-dark: rgb(216, 216, 0);
    --color-gold-dark-2: rgb(252, 252, 0);
    --color-olive-light: rgb(0, 143, 0);
    --color-olive-dark: rgb(0, 215, 0);
    --color-olive-dark-2: rgb(0, 251, 0);
    --color-violet-light: rgb(0, 107, 140);
    --color-violet-dark: rgb(0, 161, 210);
    --color-violet-dark-2: rgb(0, 188, 245);
    --color-pink-light: rgb(142, 0, 142);
    --color-pink-dark: rgb(212, 0, 212);
    --color-pink-dark-2: rgb(248, 0, 248);
    /* --- theme --- */
    --color-selection: rgba(0, 179, 0, 0.4);
    --color-text: var(--color-lightgrey);
    --color-background: var(--color-black);
    --color-links: var(--color-cyan);
    --color-accent: var(--color-lime);
    --color-selection-text: var(--color-yellow-light);
    /* --- levels --- */
    --color-primary-hover: rgb(36, 179, 0);
    --color-primary-active: rgb(72, 179, 0);
    --color-secondary-hover: rgb(119, 9, 159);
    --color-secondary-active: rgb(133, 0, 183);
    --color-tertiary-hover: rgb(182, 131, 0);
    --color-tertiary-active: rgb(181, 143, 0);
    --color-primary: var(--color-lime);
    --color-primary-focus: var(--color-yellow);
    --color-secondary: var(--color-purple);
    --color-secondary-focus: var(--color-fuchsia);
    --color-tertiary: var(--color-orange);
    --color-tertiary-focus: var(--color-yellow);
  }
}
:root {
  --body-sans-font: var(--font);
  --body-preformatted-font: var(--font);
  --body-title-font: var(--font);
  --text: var(--color-text);
  --background: var(--color-background);
  --text-selection: var(--color-selection);
  --preformatted-background: var(--color-background);
  --link-foreground: var(--color-links);
  --link-background: var(--color-background);
  --blockquote-border-left: var(--color-secondary);
  --progress-bar-outline: var(--color-tertiary) solid 4px;
  --progress-bar-fill: var(--color-tertiary);
}

main {
  font-family: var(--body-sans-font);
  max-width: 50rem;
  padding: 2rem;
  margin: auto;
}

::selection {
  background: var(--color-selection) !important;
  color: var(--color-selection-text) !important;
}

body {
  background: var(--background);
  color: var(--text);
}

body,
html {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}

.centered-div {
  text-align: center;
}

#status {
  font-variant-numeric: tabular-nums;
}

.centered-div {
  text-align: center;
}

#status {
  font-variant-numeric: tabular-nums;
}

#progress {
  display: none;
  width: min(20rem, 90%);
  height: 2rem;
  border-radius: var(--border-radius);
  overflow: hidden;
  margin: 1rem 0 2rem;
  outline-offset: 2px;
  outline: var(--progress-bar-outline) !important;
}

.bar-inner {
  background-color: var(--progress-bar-fill) !important;
  height: 100%;
  width: 0;
  transition: width 0.25s ease-in;
}

@media (prefers-reduced-motion: no-preference) {
  .bar-inner {
    transition: width 0.25s ease-in;
  }
}
pre {
  background-color: var(--preformatted-background);
  padding: 1em;
  border: 0;
  font-family: var(--body-preformatted-font);
}

a, a:active, a:visited {
  color: var(--link-foreground);
  background-color: var(--link-background);
}

h1, h2, h3, h4, h5 {
  margin-bottom: 0.1rem;
  font-family: var(--body-title-font);
}

blockquote {
  border-left: var(--blockquote-border-left);
  margin: 0.5em 10px;
  padding: 0.5em 10px;
}

footer {
  text-align: center;
}