/* Syntax Highlighting — Monochromator */
.chroma {
    color: var(--text);
    background-color: var(--surface-code);
}

/* --- Comments: dim italic --- */
.chroma .c {
    color: var(--text-muted);
    font-style: italic
}

.chroma .ch {
    color: var(--text-muted);
    font-style: italic
}

.chroma .cm {
    color: var(--text-muted);
    font-style: italic
}

.chroma .c1 {
    color: var(--text-muted);
    font-style: italic
}

.chroma .cs {
    color: var(--text-muted);
    font-style: italic
}

.chroma .cp {
    color: var(--text-muted);
    font-weight: bold;
    font-style: italic
}

.chroma .cpf {
    color: var(--text-muted);
    font-weight: bold;
    font-style: italic
}

/* --- Punctuation & Operators: dim --- */
.chroma .o {
    color: var(--text-muted)
}

.chroma .p {
    color: var(--text-muted)
}

/* --- Keywords: white bold --- */
.chroma .k {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .kd {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .kn {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .kp {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .kr {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .kt {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .ow {
    color: var(--text-bright);
    font-weight: bold
}

/* --- Keyword constants (true, false, nil): accent bold --- */
.chroma .kc {
    color: var(--accent);
    font-weight: bold
}

/* --- Names: default --- */
.chroma .n {
    color: var(--text)
}

.chroma .na {
    color: var(--text);
    font-style: italic
}

.chroma .nc {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .no {
    color: var(--text)
}

.chroma .ne {
    color: var(--text)
}

.chroma .nx {
    color: var(--text)
}

.chroma .nn {
    color: var(--text)
}

/* --- Names bold: tags, decorators, storage --- */
.chroma .nt {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .nd {
    color: var(--text-bright);
    font-weight: bold
}

/* --- Builtins: self/this bold, print/len italic --- */
.chroma .bp {
    color: var(--text-bright);
    font-weight: bold
}

.chroma .nb {
    color: var(--text);
    font-style: italic
}

/* --- Functions: italic --- */
.chroma .nf {
    color: var(--text);
    font-style: italic
}

.chroma .fm {
    color: var(--text);
    font-style: italic
}

/* --- Literals: accent --- */
.chroma .l {
    color: var(--accent)
}

.chroma .ld {
    color: var(--accent)
}

.chroma .s {
    color: var(--accent)
}

.chroma .sa {
    color: var(--accent)
}

.chroma .sb {
    color: var(--accent)
}

.chroma .sc {
    color: var(--accent)
}

.chroma .dl {
    color: var(--accent)
}

.chroma .sd {
    color: var(--text-muted);
    font-style: italic
}

.chroma .s2 {
    color: var(--accent)
}

.chroma .sh {
    color: var(--accent)
}

.chroma .si {
    color: var(--accent)
}

.chroma .sx {
    color: var(--accent)
}

.chroma .sr {
    color: var(--accent)
}

.chroma .s1 {
    color: var(--accent)
}

.chroma .ss {
    color: var(--accent)
}

.chroma .m {
    color: var(--accent)
}

.chroma .mb {
    color: var(--accent)
}

.chroma .mf {
    color: var(--accent)
}

.chroma .mh {
    color: var(--accent)
}

.chroma .mi {
    color: var(--accent)
}

.chroma .il {
    color: var(--accent)
}

.chroma .mo {
    color: var(--accent)
}

/* --- Bold literals: escapes, language constants, interpolation --- */
.chroma .se {
    color: var(--accent);
    font-weight: bold
}

/* --- Errors & Diffs --- */
.chroma .err {
    color: var(--syntax-err)
}

.chroma .gd {
    color: var(--syntax-err)
}

.chroma .gi {
    color: var(--syntax-add)
}

.chroma .ge {
    font-style: italic
}

.chroma .gs {
    font-weight: bold
}

.chroma .gu {
    color: var(--text-muted)
}

/* --- Line numbers --- */
.chroma .lnlinks {
    outline: none;
    text-decoration: none;
    color: inherit
}

.chroma .lntd {
    vertical-align: top;
    padding: 0;
    margin: 0;
    border: 0;
}

.chroma .lntable {
    border-spacing: 0;
    padding: 0;
    margin: 0;
    border: 0;
}

.chroma .hl {
    background-color: var(--bg-surface)
}

.chroma .lnt {
    white-space: pre;
    -webkit-user-select: none;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
    color: var(--text-muted)
}

.chroma .ln {
    white-space: pre;
    -webkit-user-select: none;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
    color: var(--text-muted)
}

.chroma .line {
    display: flex;
}