---
name: mcp-design-system-engineer
description: >
  Build, audit, document, govern, migrate, and maintain design systems for modern and legacy products. Use for design tokens, semantic themes, component contracts, variants and states, responsive behavior, accessibility requirements, multibrand support, adapters, documentation, release governance, adoption plans, and incremental migration from duplicated UI code. Do not use for a one-off page polish that does not change shared contracts; use mcp-ui-design-engineer instead. Use mcp-css-architect for stylesheet architecture independent of component governance.
---

# MCP Design System Engineer

Definire contratti riusabili tra design e codice, con governance e migrazione controllata.

## Ambito

Usare per:

- token e semantic themes
- component API e variant
- governance e versioning
- multibrand
- adozione o migrazione incrementale

Non usare per:

- creare componenti senza inventario
- tokenizzare valori casuali
- rompere consumer esistenti senza deprecation
- confondere design system con una sola libreria CSS

## Workflow operativo

1. Inventariare prodotti, componenti, stili, duplicazioni, consumer, ownership e vincoli legacy.
2. Eseguire `scripts/mcp-design-system-engineer/inspect_design_system.py <project>` per raccogliere segnali statici.
3. Definire foundations e token semantici prima delle API dei componenti.
4. Specificare contratti: anatomy, slots, props, varianti, stati, accessibilita, responsive e contenuto.
5. Stabilire adapter per stack diversi e strategia di compatibilita/deprecazione.
6. Definire documentazione, test, visual regression, release e governance delle decisioni.
7. Pianificare adozione per slice misurabili con rollback e rimozione del debito temporaneo.

## Regole permanenti

- Separare sempre fatti osservati, inferenze, preferenze e assunzioni.
- Conservare compatibilita legacy e comportamento esistente salvo modifica esplicitamente approvata.
- Preferire modifiche piccole, verificabili e reversibili a refactor estesi.
- Citare file, linee, selector, schermate, task o altra evidenza disponibile.
- Dichiarare limiti, aree non testate e dipendenze da validazione runtime o utente.
- Non dichiarare verificato cio che non e stato effettivamente testato.

## Output predefinito

1. inventory e gap
2. token architecture
3. component contracts
4. governance/versioning
5. migration roadmap
6. quality gates
7. ownership e deprecation plan

## References

Caricare solo le reference necessarie al task:

- [accessibility-responsive-and-content](references/accessibility-responsive-and-content.md)
- [audit-and-quality-gates](references/audit-and-quality-gates.md)
- [component-contracts](references/component-contracts.md)
- [documentation-testing-and-tooling](references/documentation-testing-and-tooling.md)
- [foundations-and-scope](references/foundations-and-scope.md)
- [governance-versioning-and-release](references/governance-versioning-and-release.md)
- [implementation-adapters](references/implementation-adapters.md)
- [legacy-migration](references/legacy-migration.md)
- [official-sources](references/official-sources.md)
- [output-formats](references/output-formats.md)
- [theming-and-multibrand](references/theming-and-multibrand.md)
- [token-architecture](references/token-architecture.md)