/* ============================================================================ M1 DESIGN SYSTEM — PER-SYSTEM BRAND The ONLY tokens a system may override. Everything else — spacing, type, radius, elevation, motion, components, both themes, RTL — stays identical, which is what makes eleven verticals one platform rather than eleven products. Set data-brand on . Omit it and you get M1 default (from m1timepilot, the reference site in Build Plan §2). The four brands below are the palettes those systems ALREADY ship, recovered from their live stylesheets on 2026-08-09 — so adopting the design system does not force a rebrand on anything already in front of a client. NOTE: each new brand must be re-verified with tools/contrast.mjs. A hue that passes AA as a fill is not automatically legible as text, and the reverse. ========================================================================= */ /* ---- M1 TimePilot — blue / emerald (the default, stated here for clarity) -- */ [data-brand='timepilot'] { --brand-50:#eff6ff; --brand-100:#dbeafe; --brand-200:#bfdbfe; --brand-300:#93c5fd; --brand-400:#60a5fa; --brand-500:#2563eb; --brand-600:#1d4ed8; --brand-700:#1e40af; --brand-800:#1e3a8a; --brand-900:#172554; --accent-500:#10b981; --accent-600:#059669; } /* ---- M1 FM — brighter blue / cyan ---------------------------------------- */ [data-brand='fm'] { --brand-50:#eef4ff; --brand-100:#d9e6ff; --brand-200:#b6ceff; --brand-300:#84aeff; --brand-400:#4f8bff; --brand-500:#1e5eff; --brand-600:#0b3bb0; --brand-700:#0a3193; --brand-800:#092776; --brand-900:#071d59; --accent-500:#00c2ff; --accent-600:#0099cc; } /* ---- FeedPilot — teal / violet. Its live site is DARK by default. That is now a starting theme, not a separate design language: set data-theme="dark" and this brand. ---------- */ [data-brand='feedpilot'] { --brand-50:#f0fdfa; --brand-100:#ccfbf1; --brand-200:#99f6e4; --brand-300:#5eead4; --brand-400:#2dd4bf; --brand-500:#0f9488; --brand-600:#0d7d73; --brand-700:#0f6660; --brand-800:#115e56; --brand-900:#134e48; --accent-500:#7c3aed; --accent-600:#6d28d9; } /* ---- Momentum Bizz — gold / navy. Gold is the hard case: a mid gold fails AA as text on white and cannot carry white as a fill. The ramp is pulled darker at 600+ so the TEXT tokens have something legible to point at, while 500 stays close to the brand gold. ---- */ [data-brand='bizz'] { --brand-50:#fdf8ec; --brand-100:#faf0d4; --brand-200:#f3e0a8; --brand-300:#e8c96f; --brand-400:#d9b249; --brand-500:#c9a13b; --brand-600:#8a6a1f; --brand-700:#6b5115; --brand-800:#4d3a0f; --brand-900:#2f230a; --accent-500:#1b2a4a; --accent-600:#111c33; } /* ---- M1 default (explicit) ------------------------------------------------ */ [data-brand='m1'] { --brand-50:#eff6ff; --brand-100:#dbeafe; --brand-200:#bfdbfe; --brand-300:#93c5fd; --brand-400:#60a5fa; --brand-500:#2563eb; --brand-600:#1d4ed8; --brand-700:#1e40af; --brand-800:#1e3a8a; --brand-900:#172554; --accent-500:#10b981; --accent-600:#059669; }