/* Fe syntax highlighting — CSS custom properties define all colors.
Default: Catppuccin Mocha (dark). Light override via prefers-color-scheme
or data-theme="light". Host pages can override any --fe-* variable. */
/* ============================================================================
Color variables
============================================================================ */
/* Default: Catppuccin Mocha (dark) */
:root {
--fe-hl-keyword: #cba6f7;
--fe-hl-variable-builtin: #94e2d5;
--fe-hl-type: #f9e2af;
--fe-hl-type-interface: #cba6f7;
--fe-hl-type-variant: #f9e2af;
--fe-hl-function: #89b4fa;
--fe-hl-string: #a6e3a1;
--fe-hl-string-escape: #94e2d5;
--fe-hl-number: #94e2d5;
--fe-hl-comment: #6c7086;
--fe-hl-operator: #94e2d5;
--fe-hl-variable: #a6e3a1;
--fe-hl-attribute: #cba6f7;
--fe-hl-constant: #94e2d5;
--fe-hl-punctuation: #6c7086;
--fe-code-bg: #1e1e2e;
--fe-code-border: #313244;
--fe-code-text: #cdd6f4;
--fe-code-line-number: #6c7086;
--fe-code-font: "JetBrains Mono", "Fira Code", monospace;
--fe-code-size: 0.8rem;
--fe-code-line-height: 1.6;
--fe-code-radius: 6px;
}
/* Light override: Catppuccin Latte — via OS preference */
@media (prefers-color-scheme: light) {
:root:not([data-theme="dark"]) {
--fe-hl-keyword: #7c3aed;
--fe-hl-variable-builtin: #0891b2;
--fe-hl-type: #b08800;
--fe-hl-type-interface: #7c3aed;
--fe-hl-type-variant: #b08800;
--fe-hl-function: #2563eb;
--fe-hl-string: #16a34a;
--fe-hl-string-escape: #0d9488;
--fe-hl-number: #0891b2;
--fe-hl-comment: #9ca0b0;
--fe-hl-operator: #0891b2;
--fe-hl-variable: #0d9488;
--fe-hl-attribute: #7c3aed;
--fe-hl-constant: #0891b2;
--fe-hl-punctuation: #6b7280;
--fe-code-bg: #eff1f5;
--fe-code-border: #ccd0da;
--fe-code-text: #4c4f69;
--fe-code-line-number: #9ca0b0;
}
}
/* Light override: explicit toggle */
:root[data-theme="light"] {
--fe-hl-keyword: #7c3aed;
--fe-hl-variable-builtin: #0891b2;
--fe-hl-type: #b08800;
--fe-hl-type-interface: #7c3aed;
--fe-hl-type-variant: #b08800;
--fe-hl-function: #2563eb;
--fe-hl-string: #16a34a;
--fe-hl-string-escape: #0d9488;
--fe-hl-number: #0891b2;
--fe-hl-comment: #9ca0b0;
--fe-hl-operator: #0891b2;
--fe-hl-variable: #0d9488;
--fe-hl-attribute: #7c3aed;
--fe-hl-constant: #0891b2;
--fe-hl-punctuation: #6b7280;
--fe-code-bg: #eff1f5;
--fe-code-border: #ccd0da;
--fe-code-text: #4c4f69;
--fe-code-line-number: #9ca0b0;
}
/* ============================================================================
Syntax highlight rules — read variables, no fallbacks
============================================================================ */
.hl-keyword { color: var(--fe-hl-keyword); }
.hl-variable-builtin { color: var(--fe-hl-variable-builtin); font-style: italic; }
.hl-type, .hl-type-builtin { color: var(--fe-hl-type); }
.hl-type-interface { color: var(--fe-hl-type-interface); }
.hl-type-enum-variant { color: var(--fe-hl-type-variant); }
.hl-function, .hl-function-definition, .hl-function-method { color: var(--fe-hl-function); }
.hl-string { color: var(--fe-hl-string); }
.hl-string-escape { color: var(--fe-hl-string-escape); }
.hl-number { color: var(--fe-hl-number); }
.hl-comment, .hl-comment-doc { color: var(--fe-hl-comment); font-style: italic; }
.hl-operator { color: var(--fe-hl-operator); }
.hl-property, .hl-variable-parameter { color: var(--fe-hl-variable); }
.hl-variable { color: var(--fe-hl-variable); }
.hl-attribute { color: var(--fe-hl-attribute); }
.hl-constant { color: var(--fe-hl-constant); font-weight: bold; }
.hl-punctuation-bracket, .hl-punctuation-delimiter, .hl-punctuation-special { color: var(--fe-hl-punctuation); }
/* SCIP symbol hover highlight transitions */
[class*="sym-"] {
transition: background 0.2s ease-out, text-decoration 0.2s ease-out,
text-decoration-color 0.2s ease-out;
}
/* ============================================================================