Colors — Semantic
Token aliases and status colors used throughout the UI.
| --bg | page background | |
| --bg-surface | hairlines, card outlines | |
| --bg-elev | elevated surfaces, preview panels | |
| --ink | accent, buttons, icons, active states | |
| --ink-hover | button hover / deepened accent | |
| --surface-tint | highlight-row fill (orange tint) | |
| --fg | body copy | |
| --fg-heading | headings | |
| --fg-muted | secondary / caption text | |
| --fg-inverse | text on orange buttons / dark heroes | |
| --hairline-strong | orange-tinted borders | |
| success | positive indicators (Bootstrap default) | |
| warning | caution states | |
| danger | error / loss states |