# GAB-092 · VisualVocabularySet — « Set de vocabulaire »

**Archétype / renderer_key :** `text_cta` (cartographie) · **module :** EdTechVisualLearning
**Critère validé :** changer le JSON change les flashcards sans modifier le HTML.

## Pack (structure officielle par-GAB)
```
GAB-092/
  renderer.html            ← moteur flashcards recto/verso (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
**VisualVocabularySet** : grille de flashcards avec retournement 3D (recto = terme, verso = définition). Bouton CTA « Tout retourner » pour révéler/masquer toutes les définitions d'un coup. Conçu pour la mémorisation de vocabulaire de chapitre (brevet, collège).

## Champs requis (instance, à plat)
`gab_id` · `vocabulary_set_id` · `items[]{id, term, definition}`

Optionnels : `title`, `subject`, `chapter`, `hint`, `primary_cta{label, action}`.

## Ce qui vient du JSON vs HTML
- **JSON** : chaque terme, chaque définition, le libellé du bouton CTA, le titre, le texte d'invite.
- **HTML** : grille 2 colonnes, logique de flip 3D, bouton structurel, layout responsif, fallback BLOCKED.

## Garde-fous (anti-invention)
- Tout contenu extrait du HTML source `INDEX-300-visuallearning-GAB-091-095-PLAYABLE.html` (stage `data-tpl="92"`).
- Aucun contenu inventé. Champ absent dans la source → `_TODO` dans l'instance.
- **BLOCKED** si `items` absent/vide ou `vocabulary_set_id` absent.

## QA à vérifier
1. Modifier un `term`/`definition` → rendu change sans toucher au HTML (critère d'or).
2. `items:[]` → BLOCKED propre.
3. Clic carte → flip 3D correct.
4. Bouton → toutes cartes retournées / rétablies.
5. Responsive 375/768/1024 : 1 colonne mobile, 2 colonnes desktop.
6. Clavier : Tab → focus visible, Enter/Space → flip.

## Source
`INDEX-300-visuallearning-GAB-091-095-PLAYABLE.html` (stage `data-tpl="92"`, styles `.voc-*`).
