/* ============================================================================ * /public/css/root.css * ---------------------------------------------------------------------------- * Canonical platform :root variables (light-theme defaults). * * This file is the future single source of truth for all CSS custom * properties consumed by the platform shell + shared components. It was * created during CSS Architecture Phase 1 (2026-05-10) by extracting the * :root block from /public/css/styles.css verbatim — byte-identical for * variable definitions. * * STATUS (Phase 1): Scaffolding only. NOT linked from any HTML yet. * The runtime still resolves variables from styles.css. This file exists * so subsequent phases can wire it in additively. * * See: DOCUMENTS_CODETRUTH/04_PLATFORM/CSS-ARCHITECTURE/audit-2026-05-10.md * ============================================================================ */ :root { /* Sidebar variables are defined in /css/sidebar.css */ /* Phase 9: Global light theme (default for all tenants). `--accent-primary` and `--accent-secondary` are aliased to `--accent` / `--accent-hover` further down — these initial declarations are kept for backward source-order safety when downstream rules look at the cascade order. */ --accent-primary: #0b5c89; --accent-secondary: #3b82f6; /* Gradient: canonical name `--gradient-accent` (3 consumers in audit); `--accent-gradient` is the alias (0 consumers). */ --gradient-accent: linear-gradient(135deg, #0b5c89, #3b82f6); --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; /* Light Background Colors (GLOBAL DEFAULT) */ --card-bg: #f4f4f4; --bg-card: #f4f4f4; --bg-primary: #ffffff; --bg-secondary: #f8fafc; --bg-tertiary: #e3ebf7; --bg-light: #f8fafc; --bg-fifth: #21456b; --bg-sixth: #1779a166; --bg-kg:#40b9c5; --bg-information: #0069d9; --tab-primary: #e3ebf7; --tab-secondary: #4c9ff3; --tab-tertiary: #e3ebf7; --tab-light: #f8fafc; --tab-fifth: #21456b; --tab-sixth: #1779a166; --tab-kg:#40b9c5; --tab-information: #0069d9; --tab-text-primary: #111a25; --tab-text-secondary: #414447; --tab-text-tertiary: #e3ebf7; --tab-text-light: #f8fafc; --tab-text-fifth: #21456b; --tab-text-sixth: #1779a166; --tab-text-kg:#40b9c5; --tab-text-information: #0069d9; /* Light Text Colors (GLOBAL DEFAULT) */ --text-primary: #0f172a; --text-secondary: #64748b; --text-primary-btn: #f4f4f4; --text-secondary-btn: #b3bdcb; /* Accent Colors */ --accent: #0b5c89; --accent-hover: #084263; /* "r, g, b" tuple of --accent — used by `rgba(var(--accent-rgb), 0.X)` consumers (~6 callsites). Branding-preload.js overwrites this with a tuple derived from the tenant's theme_color. */ --accent-rgb: 11, 92, 137; /* Aliases — `--primary-color` / `--primary-hover` predate the `--accent` family but remain consumed by 14+1 callsites. Alias them so they follow the tenant accent automatically. */ --primary-color: var(--accent); --primary-hover: var(--accent-hover); --secondary-color: var(--accent-hover); /* Message Colors (light theme friendly) */ --user-msg: #1192a8; --assistant-msg: #f1f5f9; /* Status Colors */ --success-color: #10b981; --error-color: #ef4444; --warning-color: #f59e0b; /* Light Border Colors (GLOBAL DEFAULT) */ --border: #e2e8f0; --border-color: #40b9c5; /* Stronger border for emphasized dividers (e.g., predictions section boundaries). Tenant brands may override. */ --border-strong: #cbd5e1; /* Hover/Muted (GLOBAL DEFAULT — light theme) Modules (prop-trading, predictions, trades) use these heavily for row/card hover states + secondary metadata. Without them in :root, any tenant choosing light theme renders broken. */ --text-muted: #94a3b8; --bg-hover: #f1f5f9; /* Module palette (GLOBAL DEFAULT — light theme). Used by all 3 trading modules for status pills, badges, and accent surfaces. Mirrored in [data-theme-mode="dark"] with darker variants. `--success-color` / `--error-color` / `--warning-color` above are the SEMANTIC names; the names below are the COLOR-FAMILY names that the trading modules reference directly. Aliasing keeps them in sync. */ --green: var(--success-color); --green-dim: rgba(16, 185, 129, 0.10); --yellow: var(--warning-color); --yellow-dim: rgba(245, 158, 11, 0.10); --orange: #f97316; --orange-dim: rgba(249, 115, 22, 0.10); --red: var(--error-color); --red-dim: rgba(239, 68, 68, 0.10); --purple: #8b5cf6; --purple-dim: rgba(139, 92, 246, 0.10); /* Secondary accent (purple-family) — used by predictions for venue badges + outcome tags. Tenant brands may override. `--accent-dim` is the light-alpha tint of --accent, used for subtle hover/focus surfaces across all modules. */ --accent-2: #7c3aed; --accent-dim: rgba(11, 92, 137, 0.08); /* Layout */ --radius: 12px; --shadow-sm: 0 2px 8px rgba(0,0,0,.08); --container-max: 1200px; /* Radius scale (R-4.2, 2026-05-11) ------------------------------------------------------------------- Canonical geometric primitives. Use these instead of literal pixel values for all NEW border-radius declarations. Existing literals are GRANDFATHERED — they are not mass-rewritten in this pass; they converge over time as files are touched for other reasons. The legacy `--radius: 12px;` above is preserved as-is. It predates the scale and has 0 consumers in /public/ today (grep 2026-05-11); it stays declared so any external/Site-Templates consumer keeps resolving. It converges with `--radius-md` by value. Authorized by: docs/css-architecture/R-3.1-founder-decisions.md §6 Enforced (warning-only) by: scripts/css-arch/check-radius-tokens.cjs Allowed-automatically literals (the script does NOT flag these): 0, 50%, 999px (pill), inherit/unset/initial. */ --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-pill: 999px; /* ── Variable name aliases (cleanup of two parallel naming systems) Audit (2026-05-09) found 185+ consumers of `--accent`, 12 of `--accent-primary`, 23 of `--accent-hover`, 2 of `--accent-secondary`, 237 of `--border`, 40 of `--border-color`. Canonical names are the SHORT ones; the long-form aliases below resolve to the same value so any consumer of either name stays in sync — no more flash where some elements update via the synchronous `