@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap'); :root { /* Default theme: Midnight Gold (the original look) */ --bg-primary: #080e1a; --bg-secondary: #0d1b2e; --bg-card: #111f38; --bg-input: #162d52; --bg-table-alt: #0f1e35; --gold: #c9a84c; --gold-light: #e8c96b; --gold-dark: #9a7a2a; --text-primary: #e2e8f0; --text-muted: #7a90a8; --success: #38d499; --warning: #f5a623; --danger: #e74c3c; --border: #1e3a5f; /* Text color for content sitting ON TOP of a gold/accent button. Dark themes have a light gold accent → near-black text reads well. Light themes override this to white because their accent is dark. */ --on-gold: #080e1a; } /* ── ALTERNATE THEMES ─────────────────────────────────────────────────────── Each theme overrides the same variables. data-theme is set on by js/theme.js (or a tiny inline boot script) BEFORE first paint — see the FOUC-prevention