/* ========================================================================== Theme - Dark (default) Scoped to [data-theme="dark"], set on by theme.js from CONFIG.THEME or the visitor's saved preference. Values mirror variables.css defaults so the site is correct even before theme.js finishes running. ========================================================================== */ :root[data-theme="dark"] { --color-primary: var(--brand-teal-500); --color-primary-hover: var(--brand-teal-400); --color-primary-active: var(--brand-teal-700); --color-secondary: var(--brand-teal-300); --color-secondary-hover: var(--brand-teal-400); --color-accent: var(--brand-amber-500); --color-accent-hover: var(--brand-amber-400); --color-bg: #0a0e1a; --color-surface: #12172a; --color-surface-2: #1a2036; --color-surface-3: #222a47; --color-border: #2a3150; --color-border-strong: #3a4368; --color-text-primary: #f5f7fa; --color-text-secondary: #b4bcd0; --color-text-muted: #7b8496; --color-text-inverse: #0a0e1a; --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.35); --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4); --shadow-xl: 0 24px 64px rgba(0, 0, 0, 0.45); --glass-bg: rgba(18, 23, 42, 0.72); --glass-border: rgba(255, 255, 255, 0.08); color-scheme: dark; }