:root {
  --syntax-bg: #f6f8fa;
  --syntax-border: #d0d7de;
  --syntax-muted: #6e7781;
  --syntax-text: #24292f;
  --syntax-comment: #6e7781;
  --syntax-keyword: #cf222e;
  --syntax-string: #0a3069;
  --syntax-number: #0550ae;
  --syntax-function: #8250df;
  --syntax-type: #953800;
  --syntax-constant: #0550ae;
  --syntax-variable: #24292f;
  --syntax-tag: #116329;
  --syntax-operator: #0550ae;
}

@media (prefers-color-scheme: dark) {
  :root {
    --syntax-bg: #161b22;
    --syntax-border: #30363d;
    --syntax-muted: #8b949e;
    --syntax-text: #e6edf3;
    --syntax-comment: #8b949e;
    --syntax-keyword: #ff7b72;
    --syntax-string: #a5d6ff;
    --syntax-number: #79c0ff;
    --syntax-function: #d2a8ff;
    --syntax-type: #ffa657;
    --syntax-constant: #79c0ff;
    --syntax-variable: #e6edf3;
    --syntax-tag: #7ee787;
    --syntax-operator: #ff7b72;
  }
}

pre,
code,
.highlight,
.highlighter-rouge {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

div.highlighter-rouge {
  margin: 1.25rem 0;
  padding: 1rem 1.25rem;
  overflow-x: auto;
  border: 1px solid var(--syntax-border);
  border-radius: 12px;
  background: var(--syntax-bg);
  color: var(--syntax-text);
  line-height: 1.6;
  font-size: 0.9rem;
}

.highlight,
pre.highlight,
.highlight pre,
.highlighter-rouge pre {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}

p code.highlighter-rouge,
li code.highlighter-rouge,
blockquote code.highlighter-rouge,
td code.highlighter-rouge,
code.language-plaintext.highlighter-rouge {
  padding: 0.12rem 0.35rem;
  border: 1px solid var(--syntax-border);
  border-radius: 6px;
  background: color-mix(in srgb, var(--syntax-bg) 88%, white 12%);
  color: var(--syntax-text);
  font-size: 0.9em;
}

@media (prefers-color-scheme: dark) {
  p code.highlighter-rouge,
  li code.highlighter-rouge,
  blockquote code.highlighter-rouge,
  td code.highlighter-rouge,
  code.language-plaintext.highlighter-rouge {
    background: color-mix(in srgb, var(--syntax-bg) 92%, black 8%);
  }
}

.highlight .w { color: var(--syntax-text); }
.highlight .err { color: #ffffff; background: #cf222e; }
.highlight .c,
.highlight .ch,
.highlight .cd,
.highlight .cm,
.highlight .cpf,
.highlight .c1,
.highlight .cs { color: var(--syntax-comment); font-style: italic; }
.highlight .cp { color: var(--syntax-keyword); }
.highlight .k,
.highlight .kc,
.highlight .kd,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kt,
.highlight .nt { color: var(--syntax-keyword); }
.highlight .o,
.highlight .ow { color: var(--syntax-operator); }
.highlight .m,
.highlight .mb,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .il,
.highlight .mo { color: var(--syntax-number); }
.highlight .s,
.highlight .sa,
.highlight .sb,
.highlight .sc,
.highlight .dl,
.highlight .sd,
.highlight .s2,
.highlight .se,
.highlight .sh,
.highlight .sx,
.highlight .sr,
.highlight .s1,
.highlight .ss { color: var(--syntax-string); }
.highlight .na,
.highlight .nc,
.highlight .ne,
.highlight .nf,
.highlight .fm { color: var(--syntax-function); }
.highlight .nb,
.highlight .bp,
.highlight .bv,
.highlight .vc,
.highlight .vg,
.highlight .vi,
.highlight .vm { color: var(--syntax-variable); }
.highlight .no,
.highlight .mh,
.highlight .gu { color: var(--syntax-constant); }
.highlight .nd,
.highlight .nl,
.highlight .nn,
.highlight .nx,
.highlight .py { color: var(--syntax-type); }
.highlight .p { color: var(--syntax-text); }
.highlight .gd { color: #82071e; background: rgba(248, 81, 73, 0.15); }
.highlight .gi { color: #116329; background: rgba(46, 160, 67, 0.15); }
.highlight .gh,
.highlight .gp,
.highlight .gs { font-weight: 600; }
.highlight .ge { font-style: italic; }
.highlight .gt { color: #82071e; }