pre {
  counter-reset: line;
}
.code-loc {
  counter-increment: line;
}
.code-loc:before {
  content: counter(line, decimal-leading-zero);
  margin: 0 10px 0 0;
  padding: 0 5px 0 5px;
  display: inline-block;
}
.code-loc {
  color: #161619;
}
.code-loc:before {
  background-color: #f0f5f7;
}
.code-cns, .code-glb {
  color: #383A42;
}
.code-cmt {
  color: #636468;
}
.code-str {
  color: #3b763a;
}
.code-num {
  color: #986801;
}
.code-kwd {
  color: #A626A4;
}
.code-ops {
  color: #0184BC;
}

@media (prefers-color-scheme: dark) {
  .code-loc {
    color: #bbc0ca;
  }
  .code-loc:before {
    background-color: #1a2225;
  }
  .code-cns, .code-glb {
    color: #E5C07B;
  }
  .code-cmt {
    color: #7F848E;
  }
  .code-str {
    color: #98C379;
  }
  .code-num {
    color: #D19A66;
  }
  .code-kwd {
    color: #C678DD;
  }
  .code-ops {
    color: #56B6C2;
  }
}