/* CoreReflex — theme tokens (single source of truth for every page). * * Injected LAST in by src/server.js, so this block overrides each * page's legacy inline :root palette. Switch looks by setting data-theme on * ("cobalt" | "teal" | "indigo"); /js/theme.js persists the choice and * writes any per-token custom overrides as inline styles on (which beat * everything here). Legacy names (--lime/--cyan/--coral/--brand) are aliased to * the semantic tokens so existing markup re-themes with zero edits. * * White-label note: presets are the seed looks. A tenant's saved brand * (preset + overrides) will later be served per-workspace from this same seam. */ /* ============================ Cobalt Trust (default) ====================== */ :root, :root[data-theme="cobalt"] { color-scheme: dark; /* surfaces */ --bg: #0a0e16; --bg-1: #10151f; --bg-2: #161d2b; --bg-3: #1e2637; /* text */ --ink: #eef2f8; --muted: #9aa6b8; --faint: #6b7688; /* hairlines */ --line: rgba(174, 190, 214, 0.12); --line-2: rgba(174, 190, 214, 0.18); --line-strong: rgba(174, 190, 214, 0.24); /* primary action */ --accent: #3d8bff; --accent-hover: #5aa0ff; --accent-fg: #04101f; /* text/icon on top of --accent */ --accent-rgb: 61, 139, 255; /* channels for rgba() glows & tints */ /* secondary / info / timeline */ --secondary: #38d6e6; --secondary-rgb: 56, 214, 230; /* semantic states (shared across presets) */ --danger: #ff5c7a; --danger-rgb: 255, 92, 122; --warn: #ffe14d; --warn-rgb: 255, 225, 77; /* legacy aliases — keep old var() references working, re-pointed to new palette */ --lime: var(--accent); --cyan: var(--secondary); --coral: var(--danger); --brand: var(--accent); } /* ================================ Quantum Teal =========================== */ :root[data-theme="teal"] { --bg: #0b1113; --bg-1: #10181a; --bg-2: #172224; --bg-3: #1f2c2e; --ink: #ecf3f2; --muted: #93a7a5; --faint: #66787a; --line: rgba(160, 200, 196, 0.12); --line-2: rgba(160, 200, 196, 0.18); --line-strong: rgba(160, 200, 196, 0.24); --accent: #2dd4bf; --accent-hover: #4ee0cd; --accent-fg: #04201c; --accent-rgb: 45, 212, 191; --secondary: #7c86ff; --secondary-rgb: 124, 134, 255; } /* ================================ Indigo Signal ========================== */ :root[data-theme="indigo"] { --bg: #0b0b12; --bg-1: #131320; --bg-2: #1a1a2b; --bg-3: #232338; --ink: #eeecf8; --muted: #9a99b0; --faint: #6c6b84; --line: rgba(190, 188, 220, 0.12); --line-2: rgba(190, 188, 220, 0.18); --line-strong: rgba(190, 188, 220, 0.24); --accent: #7c6cff; --accent-hover: #9384ff; --accent-fg: #0a0820; --accent-rgb: 124, 108, 255; --secondary: #4dd6ff; --secondary-rgb: 77, 214, 255; } /* --------------------------------------------------------------------------- Brand lockup — the wordmark with the tagline set beneath it. Loaded on every served page (server.js injects this sheet), so the lockup is defined once rather than in each page's own