/* Design tokens -- single source of truth for palette/spacing primitives. Faithful port of the approved mockup's token set. Light is the default, dark applies via prefers-color-scheme, and either can be forced with data-theme="dark" / data-theme="light" on (see js/theme.js). */ :root { --ground: #f5efe5; --surface: #fffdf8; --surface2: #efe6d7; --line: #ddd0bb; --ink: #2a2118; --ink2: #6b5d4a; --muted: #98876e; --hot: #d3540a; --hot-ink: #fff6ee; --good: #1e7a4c; --warn: #8a6d14; --crit: #b3261e; --good-bg: rgba(30, 122, 76, 0.12); --warn-bg: rgba(138, 109, 20, 0.12); --crit-bg: rgba(179, 38, 30, 0.1); --hot-bg: rgba(211, 84, 10, 0.1); --glow: 0 0 0 transparent; } @media (prefers-color-scheme: dark) { :root { --ground: #17120e; --surface: #211913; --surface2: #2a2119; --line: #3a2e22; --ink: #f3eadc; --ink2: #b5a48e; --muted: #7e6f5c; --hot: #f76b15; --hot-ink: #1c0e04; --good: #2fa96e; --warn: #d9b23a; --crit: #e5484d; --good-bg: rgba(47, 169, 110, 0.14); --warn-bg: rgba(217, 178, 58, 0.13); --crit-bg: rgba(229, 72, 77, 0.13); --hot-bg: rgba(247, 107, 21, 0.14); --glow: 0 0 26px rgba(247, 107, 21, 0.28); } } :root[data-theme="dark"] { --ground: #17120e; --surface: #211913; --surface2: #2a2119; --line: #3a2e22; --ink: #f3eadc; --ink2: #b5a48e; --muted: #7e6f5c; --hot: #f76b15; --hot-ink: #1c0e04; --good: #2fa96e; --warn: #d9b23a; --crit: #e5484d; --good-bg: rgba(47, 169, 110, 0.14); --warn-bg: rgba(217, 178, 58, 0.13); --crit-bg: rgba(229, 72, 77, 0.13); --hot-bg: rgba(247, 107, 21, 0.14); --glow: 0 0 26px rgba(247, 107, 21, 0.28); } :root[data-theme="light"] { --ground: #f5efe5; --surface: #fffdf8; --surface2: #efe6d7; --line: #ddd0bb; --ink: #2a2118; --ink2: #6b5d4a; --muted: #98876e; --hot: #d3540a; --hot-ink: #fff6ee; --good: #1e7a4c; --warn: #8a6d14; --crit: #b3261e; --good-bg: rgba(30, 122, 76, 0.12); --warn-bg: rgba(138, 109, 20, 0.12); --crit-bg: rgba(179, 38, 30, 0.1); --hot-bg: rgba(211, 84, 10, 0.1); --glow: 0 0 0 transparent; }