# GAB-075 · VisualTypedCard — « Carte typée (commutable) »

**Archétype / renderer_key :** `text_cta` (cartographie) · **module :** EdTechVisualLearning
**Critère validé :** changer le JSON change la carte sans modifier le HTML. ✅ check.py 12/12.

## Pack (structure officielle par-GAB)
```
GAB-075/
  renderer.html            ← moteur carte typée commutable (ne pas modifier par instance)
  instance.example.json    ← SOURCE DE VÉRITÉ (contenu réel, à plat)
  schema.contract.json     ← contrat de validation
  README-contract.md       ← ce fichier
```

## Archétype
Carte informative unique à **type commutable** : l'utilisateur switche entre plusieurs types (définition / formule / date / piège), chaque type changeant la couleur de bordure, le badge et le contenu. Flashcard mémorisable, une info précise par type.

## Champs requis (instance, à plat)
`gab_id` · `card_id` · `cards[]{type, cls, type_label, card_title, card_body}`

Optionnels : `title`, `default_type`, `primary_cta{label,action}`, `accessibility`, `child_safety`.

## Ce qui vient du JSON vs HTML
- **JSON** : chaque type, son cls CSS, son badge type_label, son titre, son corps, le libellé du bouton CTA, le type par défaut.
- **HTML** : switch bar, carte avec bordure gauche colorée, bouton CTA structurel, layout, responsive, BLOCKED.

## Palette DS V2 — couleurs par type
| type | cls | bordure | fond |
|---|---|---|---|
| definition | definition | `--sky` | `--sky-soft` |
| formula | formula | `--violet` | `--violet-soft` |
| date | date | `--gold` | `--gold-soft` |
| trap | trap | `--coral` | `--coral-soft` |

## Garde-fous (child_safety)
- **BLOCKED** si `gab_id` absent / `card_id` absent / `cards` vide ou absent.
- **Aucune ombre noire** (`rgba(0,0,0,...)` interdit — DS V2 couleurs seulement).
- **Anti-invention** : contenu extrait tel quel du HTML source. Aucun contenu inventé.

## QA à vérifier
1. Modifier un `card_title`/`card_body` → rendu change sans toucher au HTML (critère d'or).
2. `cards:[]` → BLOCKED propre.
3. Switch formula → carte violet + Pythagore.
4. Switch trap → carte coral + "Erreur fréquente".
5. CTA → panel ok avec type actif.
6. Responsive 375/768/1024 — switch wrap sans débordement.

## Source
`INDEX-300-visuallearning-GAB-074-080-PLAYABLE.html` (stage `data-tpl="75"`, handler `vtypSwitch`, data object `vtypData`).

## Références intra-lot
- **GAB-074** VisualSummaryCard : pour plusieurs points clés (vs une seule info typée ici).
- **GAB-076** VisualSchemaBlock : pour relations cause→effet.