div.code,
div.repl_input,
div.repl_output,
div.repl_prompt {
  text-align: left;
}

.code-lang {
  font-style: italic;
  color: white;
}

.code-header {
  background-color: #303;
}

.code-elipsis {
  padding-left: 2em;
  color: #0f0;
  font-style: italic;
  font-family: "Iosevka Fixed Web", monospace;
  background-color: #002b36;
}

div.code_block {
  background-color: #002b36;
  border-style: solid;
  border-color: black;
  border-width: 1rem;
  color: white;
  max-width: 100vw;
  overflow-x: auto;
}

@media (prefers-color-scheme: light) {
  div.code_block {
    border-color: #002b36;
  }
}

div.repl_prompt,
div.repl_input,
div.code {
  font-size: 1.2rem;
  line-height: 1.5rem;
  display: inline-block;
}

.repl_prompt::before {
  color: cyan;
  background-color: #300;
}

div.repl_input,
div.code {
  vertical-align: top;
}

div.repl_output {
  color: magenta;
  background-color: #030;
}

.filename {
  font-family: "Iosevka Fixed Web", monospace;
  color: #0f0;
  padding-right: 2em;
}

.checker:hover {
  background: repeating-linear-gradient(
    to right,
    #002b99,
    #002b99 1ch,
    #002b60 1ch,
    #002b60 2ch
  );
  background-attachment: scroll, local;
}

.checker:hover:after {
  font-weight: bold;
  color: #0af;
  content: "↵";
}

.lineno {
  counter-increment: line;
}

.lineno::before {
  background-color: black;
  content: counter(line);
  color: #0af;
}

.dig-0::before {
  padding-right: 1ch;
}

.dig-1::before {
  padding-right: 2ch;
}

.dig-2::before {
  padding-right: 3ch;
}

.dig-3::before {
  padding-right: 4ch;
}

.dig-4::before {
  padding-right: 5ch;
}