Upload COLOR-SYSTEM.md with huggingface_hub

COLOR-SYSTEM.md

@@ -0,0 +1,137 @@
+# Verdigris & Ember color system
+
+Revision 2.0 supersedes the prior Earthy Oasis / Nocturnal Oasis mappings.
+Reference mood: deep ink-teal foundations, oxidized verdigris interaction,
+metered brass warmth, kiln-ember danger, and cool porcelain neutrals.
+
+This is a purely chromatic migration. Layout, spacing, typography, structure,
+copy, imagery, motion, interaction patterns, dimensions, breakpoints, and
+stacking order remain unchanged.
+
+## 1. Primitive palette
+
+The complete 9-step scales live in `src/index.css`. Existing compatibility
+aliases are retained so component APIs and utility names do not change.
+
+| Family | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 |
+| --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
+| Deep Ink | `#060a0c` | `#0c1518` | `#142126` | `#1e3036` | `#2b434b` | `#47646b` | `#6f8a8e` | `#9db4b4` | `#cfdedd` |
+| Verdigris | `#05130e` | `#0c2a20` | `#124433` | `#1a5f47` | `#257d68` | `#3f9c84` | `#6fbca4` | `#a2d8c5` | `#d4efe4` |
+| Molten Brass | `#171104` | `#322609` | `#523f10` | `#745a19` | `#a8842c` | `#c2a04a` | `#d8bc72` | `#ecd8a4` | `#f8eecb` |
+| Porcelain | `#1e231e` | `#3d463d` | `#616c61` | `#8a968a` | `#b4bfae` | `#c9d2c3` | `#dde3d8` | `#ecf0e8` | `#f6f8f2` |
+| Kiln Ember | `#200e07` | `#421d0f` | `#662e18` | `#8b4123` | `#b25731` | `#cb7550` | `#dd9a78` | `#ecc2ab` | `#f8e5d9` |
+
+## 2. Semantic aliases
+
+| Token | Source | Usage |
+| --- | --- | --- |
+| `--bg-canvas` / `--nt-bg-root` | Deep Ink 200 `#0c1518` | Page canvas |
+| `--bg-surface` / `--nt-bg-surface` | Deep Ink 300 `#142126` | Cards and panels |
+| `--bg-sunken` / `--nt-bg-sunken` | Deep Ink 200 `#0c1518` | Inputs and nested surfaces |
+| `--bg-deep` / `--nt-bg-app` | Deep Ink 100 `#060a0c` | Headers, footers, modal chrome |
+| `--text-primary` / `--nt-text-primary` | Porcelain 800 `#ecf0e8` | Headings |
+| `--text-secondary` / `--nt-text-body` | Porcelain 600 `#c9d2c3` | Body text |
+| `--text-muted` / `--nt-text-muted` | Porcelain 400 `#8a968a` | Captions and placeholders |
+| `--accent-primary` / `--nt-accent` | Verdigris 500 `#257d68` | Buttons, links, active states |
+| `--accent-hover` / `--nt-accent-hover` | Verdigris 600 `#3f9c84` | Hover states |
+| `--accent-warm` | Molten Brass 500 `#a8842c` | Warm CTA, warning, labels |
+| `--border-default` / `--nt-border-default` | Deep Ink 600 `#47646b` | Standard borders |
+| `--border-focus` / `--nt-focus-ring` | Verdigris 500 `#257d68` | Focus and selection |
+| `--shadow-color` / `--nt-shadow-color` | `rgba(6,10,12,.50)` | Elevation shadows |
+
+## 3. Component application matrix
+
+| Component | Surface | Text / icons | States |
+| --- | --- | --- | --- |
+| Header / top bar | Deep Ink 100–200 | Porcelain 500 / 400 | Verdigris active, Ember alert |
+| Navigation | Deep Ink 100–200 | Porcelain 500 / 400 | Verdigris hover and active |
+| Page lead-ins | Deep Ink 200 → 100 | Porcelain 800 / 600 | Verdigris and Brass accents |
+| Primary buttons | Verdigris 500 | Porcelain 900 | Verdigris 600 hover, 400 active |
+| Secondary buttons | Deep Ink 400 | Porcelain 600 | Deep Ink 300 hover |
+| Inputs / forms | Deep Ink 200 | Porcelain 800 / 600 | Verdigris focus, Ember error |
+| Cards / panels | Deep Ink 300 | Porcelain 800 / 600 | Verdigris highlights, Ink borders |
+| Tables | Deep Ink 300–400 | Porcelain 800 / 600 | Verdigris selection, Ink dividers |
+| Tabs | Transparent / Deep Ink | Porcelain 400 / Verdigris active | Verdigris indicator |
+| Badges | Ink / Verdigris low tints | Porcelain / Verdigris 700 | Brass warning, Ember danger |
+| Alerts / toasts | Ink / warm tint | Porcelain / Porcelain 600 | Teal info/success, Brass warning, Ember error |
+| Modals / drawers | Deep Ink 100–200 | Porcelain 800 / 600 | Ink overlay, Verdigris actions |
+| Charts | Deep Ink surfaces | Verdigris, Brass, Ember | Same palette in legends/tooltips |
+| Scrollbar | Deep Ink 200 track | Deep Ink 600 thumb | Ink 700 hover, Verdigris active |
+| Footer | Not present in the app | — | — |
+
+## 4. Old → new mapping
+
+| Previous role | Verdigris & Ember token | Value |
+| --- | --- | --- |
+| Nocturnal page canvas | `--nt-bg-root` | `#0c1518` |
+| Nocturnal app shell | `--nt-bg-app` | `#060a0c` |
+| Nocturnal panel surface | `--nt-bg-surface` | `#142126` |
+| Nocturnal raised surface | `--nt-bg-surface-raised` | `#1e3036` |
+| Nocturnal primary text | `--nt-text-primary` | `#ecf0e8` |
+| Nocturnal body text | `--nt-text-body` | `#c9d2c3` |
+| Nocturnal muted text | `--nt-text-muted` | `#8a968a` |
+| Nocturnal teal links | `--nt-text-link` | `#3f9c84` |
+| Nocturnal teal primary action | `--nt-btn-primary-bg` | `#257d68` |
+| Nocturnal success | `--nt-success` | `#3f9c84` |
+| Nocturnal warning | `--nt-warning` | `#c2a04a` |
+| Nocturnal danger | `--nt-danger` | `#cb7550` |
+| Nocturnal shadows | `--nt-shadow-color` | `#060a0c` |
+| Chart accent | chart tokens | Verdigris / Brass / Ember |
+| Pure black | Deep Ink 100 | `#060a0c` |
+| Pure white | Porcelain 900 | `#f6f8f2` |
+
+Warning and error remain distinct: warning uses Molten Brass; danger/error uses
+Kiln Ember. No red, purple, or leftover blue hues remain.
+
+## 5. Contrast adjustments
+
+The specified pairs were checked against actual luminance values:
+
+- Porcelain 600 on Deep Ink 200: **11.92:1** (AAA body text).
+- Porcelain 800 on Deep Ink 200: **16.1:1** (AAA headings).
+- Verdigris 600 on Deep Ink 200: **5.57:1** (AA links/status text).
+- Porcelain 400 on Deep Ink 300: **5.34:1** (AA muted text).
+- Porcelain 900 on Verdigris 500: **4.66:1** (AA button labels).
+- Deep Ink 100 on Molten Brass 500: **5.68:1** (AA warm button labels).
+- Ember 600 on Deep Ink 200: **5.48:1** (AA error text).
+- Brass 600 on Deep Ink 200: **7.45:1** (AAA labels/overlines).
+
+Muted and body text use the supplied lighter Porcelain stops rather than the
+darker neutral stops where required for AA. Link text uses Verdigris 600;
+Verdigris 500 remains the interactive fill and focus color.
+
+## 6. Files touched and known leftovers
+
+Color-bearing files:
+
+- `src/index.css` — primitive scales, semantic aliases, utility remapping,
+  focus, selection, caret, disabled states, and scrollbar colors
+- `src/App.tsx` — semantic toast colors
+- `src/components/AnimatedLogo.tsx` — SVG gradients
+- `src/components/GeometricBackground.tsx` — grid and mask colors
+- `src/components/GlassCard.tsx`, `Sidebar.tsx`, `StatCard.tsx`,
+  `StatusBadge.tsx`, `TopBar.tsx` — surfaces, borders, states, shadows
+- `src/pages/Analytics.tsx`, `CampaignDetail.tsx`, `Campaigns.tsx`,
+  `Dashboard.tsx`, `Leads.tsx` — charts, gradients, controls, glows
+- `COLOR-SYSTEM.md` — this mapping record
+
+No raster assets, separate design-token file, Tailwind config, SCSS theme, or
+light-mode theme is present. Existing utility names remain in place and are
+remapped through `@theme`. The unused `GlassCard` file retains its pre-existing
+missing non-color `../lib/utils` import and was not changed under this protocol.
+
+## 7. Maintainer rules
+
+- Add future colors only through `--nt-*` or the protocol aliases.
+- Use only the five supplied Verdigris & Ember families and listed stops.
+- Preserve existing opacity, blur, spread, radius, spacing, and dimensions.
+- Check WCAG contrast before adding text/background or UI-border pairs.
+- Keep success/info = Verdigris, warning = Molten Brass, danger/error = Kiln Ember.
+- Shadows use Deep Ink 100 as their base; warm glows use Brass only where specified.
+- Do not add light/dark switching unless it already exists.
+
+## Explicit scope confirmation
+
+Only color values and color-bearing token references were changed. Layout,
+spacing, typography, copy, imagery, structure, API behavior, interaction
+patterns, animation timing, and motion remain unchanged.