TradeFlow Quantum — Brand Color Palette (June 2026 rebrand)
=============================================================

Mirrors lib/brand.ts (BRAND.colors + BRAND.gradient). If you change a
value here, also update lib/brand.ts AND app/icon.svg, then re-run
tests/unit/brand-consistency.test.ts to keep the SVG icon and the
runtime constants aligned.


GRADIENT (logomark mark colors — also used in primary CTAs, header accents)
---------------------------------------------------------------------------
135°  start   #5eead4   rgb( 94, 234, 212)    hsl(166, 73%, 64%)   Teal
      end     #a78bfa   rgb(167, 139, 250)    hsl(252, 91%, 76%)   Violet


SOLID COLORS
------------
Primary       #5eead4   rgb( 94, 234, 212)    Teal — wordmark "Quantum",
                                              CTA accents, brand mark stroke #1
Accent        #a78bfa   rgb(167, 139, 250)    Violet — brand mark stroke #2
Background    #05070d   rgb(  5,   7,  13)    Page background — near-black
                                              with slight blue tint
Foreground    #ffffff   rgb(255, 255, 255)    Wordmark "TradeFlow", icon
                                              text where used
Foreground-dark #0b0b0e rgb( 11,  11,  14)    Wordmark "TradeFlow" on light
                                              backgrounds (press kit, print)
Quantum-dark  #0ea48f   rgb( 14, 164, 143)    Teal-600 — "Quantum" wordmark
                                              on light backgrounds (sufficient
                                              contrast vs the lighter #5eead4
                                              which would fail WCAG-AA on
                                              white)


WORDMARK COMPOSITION
--------------------
The wordmark is "TradeFlow Quantum" rendered as two tspans:
  - "TradeFlow" → white on dark, near-black on light
  - "Quantum"   → teal #5eead4 on dark, darker teal #0ea48f on light

Don't recolor the wordmark text outside these two color pairs. Use
public/brand/wordmark-light.svg on dark backgrounds and
public/brand/wordmark-dark.svg on light. Don't tint, gradient-fill,
or invert.

The mark colors (teal stroke #5eead4 + violet stroke #a78bfa) stay
the same on both light and dark backgrounds — both colors maintain
legibility against #ffffff and #05070d alike.


BRAND ASSETS
------------
public/brand/mark.svg          — mark only, 100×100 viewBox
public/brand/logo-stacked.svg  — mark + wordmark stacked, 400×480 viewBox
                                  (dark-navy background baked in)
public/brand/wordmark-light.svg — mark + wordmark horizontal, dark bg use
public/brand/wordmark-dark.svg  — mark + wordmark horizontal, light bg use


USAGE
-----
* Don't overlay body text on the gradient — contrast is poor for
  paragraph-length content.
* The gradient is for the brand mark + the primary CTA button only.
* On dark surfaces (#05070d), use Foreground (#ffffff) for body text.
* On light press surfaces, use Foreground-dark (#0b0b0e) for body
  text + #6b7280 for muted.
* The brand mark works at every size from 16×16 (browser favicon)
  to 512×512 (app store icon) — the geometry is intentionally simple
  enough that the two-diamond shape stays readable at small sizes.