/** * @file dark-mode.css * Dark mode token overrides — respects both system preference * and the manual toggle (data-theme="dark" on ). */ @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --mp-bg: #1A1208; --mp-bg-alt: #251B0C; --mp-bg-card: #201508; --mp-bg-header: #1A1208; --mp-bg-nav: #120C04; --mp-text: #F0E8DC; --mp-text-secondary: #C8B09A; --mp-text-muted: #8A7060; --mp-text-link: #F07030; --mp-text-link-hover: #E8A020; --mp-border: #3A2A1C; --mp-border-light: #2C1E10; --mp-table-row-odd: #201508; --mp-table-row-even: #251B0C; --mp-table-row-hover: #3A2218; --mp-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4); --mp-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); --mp-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6); --mp-bg-footer: #0A0704; } } /* Manual dark mode toggle */ [data-theme="dark"] { --mp-bg: #1A1208; --mp-bg-alt: #251B0C; --mp-bg-card: #201508; --mp-bg-header: #1A1208; --mp-bg-nav: #120C04; --mp-text: #F0E8DC; --mp-text-secondary: #C8B09A; --mp-text-muted: #8A7060; --mp-text-link: #F07030; --mp-text-link-hover: #E8A020; --mp-border: #3A2A1C; --mp-border-light: #2C1E10; --mp-table-row-odd: #201508; --mp-table-row-even: #251B0C; --mp-table-row-hover: #3A2218; --mp-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4); --mp-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); --mp-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6); --mp-bg-footer: #0A0704; } /* Manual light override */ [data-theme="light"] { /* Inherits all :root defaults — no override needed */ }