/* Fenced code blocks rendered by Rouge (`.highlighter-rouge` / `.highlight`). */
.highlighter-rouge {
  margin: 1.5em 0;
  break-inside: avoid;
}

div.highlight,
pre.highlight {
  margin: 0;
}

pre.highlight,
.highlighter-rouge pre {
  padding: 1em 1.25em;
  border-radius: 0.4rem;
  overflow-x: auto;
  background-color: rgb(var(--color-code-background));
  border: 0.1rem solid rgba(var(--color-text), 0.1);
  line-height: 1.5;
  -webkit-overflow-scrolling: touch;
}

pre.highlight code,
.highlighter-rouge pre code {
  display: block;
  padding: 0;
  border-radius: 0;
  background-color: transparent;
  font-size: var(--type-x-small);
  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
  color: rgb(var(--color-text));
  white-space: pre;
}

/* Syntax tokens. */
.highlight .c,
.highlight .c1,
.highlight .cm,
.highlight .cd,
.highlight .cp,
.highlight .cs { color: rgb(var(--color-syntax-comment)); font-style: italic; }

.highlight .k,
.highlight .kc,
.highlight .kd,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kt,
.highlight .kv { color: rgb(var(--color-syntax-keyword)); }

.highlight .s,
.highlight .s1,
.highlight .s2,
.highlight .sb,
.highlight .sc,
.highlight .sd,
.highlight .se,
.highlight .sh,
.highlight .si,
.highlight .sr,
.highlight .ss,
.highlight .sx,
.highlight .dl { color: rgb(var(--color-syntax-string)); }

.highlight .m,
.highlight .mb,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .mo,
.highlight .il { color: rgb(var(--color-syntax-number)); }

.highlight .na,
.highlight .nt,
.highlight .nl,
.highlight .py { color: rgb(var(--color-syntax-attribute)); }

.highlight .nv,
.highlight .vc,
.highlight .vg,
.highlight .vi,
.highlight .nb,
.highlight .bp { color: rgb(var(--color-syntax-variable)); }

.highlight .nf,
.highlight .nd,
.highlight .nc,
.highlight .nn,
.highlight .nx { color: rgb(var(--color-syntax-function)); }

.highlight .o,
.highlight .ow,
.highlight .p,
.highlight .pi { color: rgba(var(--color-text), 0.7); }

.highlight .gu,
.highlight .gh { color: rgb(var(--color-syntax-keyword)); font-weight: bold; }
.highlight .gs { font-weight: bold; }
.highlight .ge { font-style: italic; }
.highlight .gd { color: rgb(var(--color-syntax-variable)); }
.highlight .gi { color: rgb(var(--color-syntax-string)); }
.highlight .gt,
.highlight .gp { color: rgb(var(--color-syntax-comment)); }
.highlight .err { color: rgb(var(--color-syntax-variable)); }