# Status color audit

Version 0.2 audits the badge language currently established in Superviso and promotes its coherent portion into the shared design system.

## Finding

`Components/Badges/Status.vue` uses six muted background/text pairs across 66 explicit workflow mappings. The pattern is internally coherent:

| Tone | Surface | Text | Meaning |
| --- | --- | --- | --- |
| Success | `#EDF5EF` | `#3A6A4A` | Successful, active, approved, completed |
| Danger | `#FAEEEE` | `#7D3A3A` | Failed, suspended, declined, denied, returned, overdue |
| Warning | `#F8F1E7` | `#7A5A2E` | Draft, open, onboarding |
| Information | `#EEF2F8` | `#486289` | Pending, in progress, reviewing, provisioning |
| Milestone | `#F3EEF8` | `#684A7D` | Submitted, reviewed, provisioned, offboarding |
| Neutral | `#F6F6F4` | `#4A4A46` | None, inactive, canceled, incomplete, closed, archived |

The same blue, violet, amber, red, and neutral pairs are reused by classification badges. Risk badges use neutral, green, amber, red, plus one coherent intermediate high-severity pair: `#FAEFE7` / `#8A4C2E`.

All canonical light pairs exceed a 4.5:1 text contrast ratio. The v0.2 dark pairs also exceed 4.5:1.

## Context matters

Labels determine meaning. `Pending` can be neutral when a scheduled task has not started, but blue when a request is actively waiting for a decision. Do not map labels mechanically without considering the workflow state.

## Migration targets

These older implementations should move to semantic tokens when their product code is next touched:

- connector-log statuses in `Status.vue` still use raw Tailwind blue, green, and red;
- `Badges/Default.vue` exposes raw color names rather than semantic tones;
- function-group and maturity badges use legacy Tailwind palettes.

They remain valid product behavior, but they are not additional canonical design-system colors.
