/* rateapp.co — admin theme tokens. * * Locked palette: Slate & Cyan (DECISIONS.md 2026-05-12). * Source of truth for admin colors. Admin HTML/CSS imports this file and * uses the CSS custom properties below. Raw hex values are NOT used * elsewhere — change a color here, every page updates. * * Hard rule: --color-text is off-white, never pure white. Joe finds * pure white physically uncomfortable. Do NOT override with #ffffff. */ :root { /* ── Surface scale (darkest → lightest in the admin theme) ─────────── */ --color-bg: #1a2230; /* page background */ --color-surface: #242e40; /* cards, panels, raised elements */ --color-border: #2a3445; /* dividers, input borders, separators */ /* ── Text ──────────────────────────────────────────────────────────── */ --color-text: #e2e8f0; /* primary text — off-white, NOT #ffffff */ --color-muted: #94a3b8; /* secondary text, captions, timestamps */ /* ── Accent (primary action, active nav, focus rings, RateApp badge) ─ */ --color-accent: #06b6d4; --color-accent-on: #0f141c; /* text/icon color on accent backgrounds */ /* ── Rating stars (universal review-rating gold; do not change) ──── */ --color-stars: #f59e0b; /* ── Source brand colors (locked — always source-native, never themed) */ --color-source-google: #4285f4; --color-source-facebook: #1877f2; --color-source-yelp: #d32323; --color-source-rateapp: var(--color-accent); /* RateApp = platform accent */ /* ── Typography ────────────────────────────────────────────────────── */ --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; /* ── Radius (buttons, cards, inputs in step 7) ─────────────────────── */ --radius-sm: 4px; --radius-md: 6px; --radius-lg: 12px; } /* Base body styles. Imported once at the admin layout root. Adding the * class `rateapp-admin` to opts in — keeps the theme scoped so a * future public root page on the same domain can use a different palette. */ body.rateapp-admin { margin: 0; background: var(--color-bg); color: var(--color-text); font-family: var(--font-sans); line-height: 1.5; -webkit-font-smoothing: antialiased; }