chore: update CHANGELOG.md and DESIGN_SYSTEM.md to reflect footer layout alignment and new color variable usage for SVG/Recharts

CHANGELOG.md

@@ -15,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 - **Hardcoded brand colors.** Uptime page chart uses CSS variable var(--color-brand-orange) instead of #FD5E0F.
 - **Selection styling.** Removed redundant selection:bg-brand-orange/20 from page wrappers; relies on ciphera-ui base styles.
 - **Inline spinners.** Dashboard widgets (TopReferrers, Locations, TechSpecs, Campaigns, ContentStats), notifications page, and OrganizationSettings now use Spinner from ciphera-ui.
+- **Footer layout.** Authenticated footer container aligned to max-w-6xl (matches site dashboard and page-container-app).
 
 ### Removed
 

docs/DESIGN_SYSTEM.md

@@ -21,10 +21,15 @@ This document defines the visual language and design patterns for Pulse Analytic
 --brand-orange: #FD5E0F;
 --brand-orange-hover: #E54E00; /* Darker for hover states */
 
+/* Injected by @ciphera-net/ui preset — use in SVG, Recharts, rgba() */
+--color-brand-orange: #FD5E0F;
+--color-brand-orange-rgb: 253, 94, 15; /* For rgba(var(--color-brand-orange-rgb), 0.5) */
+
 /* Usage */
 - Primary CTAs, links, focus rings
 - Accent elements, badges
 - Never use for large backgrounds (too vibrant)
+- var(--color-brand-orange) for SVG/Recharts where Tailwind classes don't apply
 ```
 
 ### Neutral Scale