/* ========================================================================= PUCO theme palettes ----------------------------------------------------------------------- Five palettes are swappable at runtime via . A tiny inline script in base.html applies the stored preference before paint; the footer toggler writes to localStorage and updates the attribute. ========================================================================= */ :root, [data-theme="warm"] { --bg: #15110c; --surface: #1f1912; --surface-hover: #2a2218; --border: #3a2f22; --border-active: #7a5a2a; --text: #f4ecde; --text-muted: #b9a992; --accent: #f59e0b; /* amber-500 */ --accent-light: #fbbf24; /* amber-400 */ --accent-deep: #d97706; /* amber-600 */ --accent-glow: rgba(245, 158, 11, 0.22); --success: #10b981; --danger: #ef4444; --radius: 14px; --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --mono: "JetBrains Mono", "SF Mono", Consolas, "Liberation Mono", monospace; color-scheme: dark; } [data-theme="neutral"] { --bg: #0d0f14; --surface: #161923; --surface-hover: #1e2233; --border: #2a2f42; --border-active: #5b4a2a; --text: #e4e6f0; --text-muted: #8890a8; --accent: #f59e0b; --accent-light: #fbbf24; --accent-deep: #d97706; --accent-glow: rgba(245, 158, 11, 0.20); --success: #10b981; --danger: #ef4444; color-scheme: dark; } [data-theme="light"] { --bg: #fdf6e3; --surface: #ffffff; --surface-hover: #f5ecd0; --border: #e6d9b5; --border-active: #d4941e; --text: #2a1d0a; --text-muted: #78604a; --accent: #d97706; --accent-light: #f59e0b; --accent-deep: #b45309; --accent-glow: rgba(217, 119, 6, 0.14); --success: #059669; --danger: #b91c1c; color-scheme: light; } [data-theme="emerald"] { --bg: #0a140f; --surface: #0f1f16; --surface-hover: #162b1e; --border: #1e3d2a; --border-active: #0e7a4a; --text: #e0f2e9; --text-muted: #7fb898; --accent: #10b981; /* emerald-500 */ --accent-light: #34d399; /* emerald-400 */ --accent-deep: #059669; /* emerald-600 */ --accent-glow: rgba(16, 185, 129, 0.22); --success: #34d399; --danger: #ef4444; color-scheme: dark; } [data-theme="red"] { --bg: #140a0a; --surface: #1f0f0f; --surface-hover: #2b1616; --border: #3d1e1e; --border-active: #991b1b; --text: #f2e0e0; --text-muted: #b87f7f; --accent: #ef4444; /* red-500 */ --accent-light: #f87171; /* red-400 */ --accent-deep: #dc2626; /* red-600 */ --accent-glow: rgba(239, 68, 68, 0.22); --success: #10b981; --danger: #f87171; color-scheme: dark; }