# GAB-076 · VisualSchemaBlock — « Schéma de relations »

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

## Pack (structure officielle par-GAB)
```
GAB-076/
  renderer.html            ← moteur schéma de relations (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
```

## Champs requis (instance, à plat)
`gab_id` · `schema_id` · `nodes[]{id,label,type}` · `result_node{id,label,type}` · `caption`
Optionnels : `title`, `connector` (défaut `+`), `primary_cta{label,action}`.

## Ce qui vient du JSON vs HTML
- **JSON** : chaque nœud (label, type), le connecteur entre nœuds, le nœud résultat, la caption, le libellé du bouton CTA.
- **HTML** : layout flux, styles `.sch-node`/`.sch-arrow`, responsive colonne mobile, moteur de rendu.

## Archétype
Flux visuel linéaire de type `causes → résultat`. Les nœuds de gauche (type `cause`, `factor`, `step`) sont reliés par un connecteur symbolique (+ / ou / et / →), puis une flèche mène au nœud résultat (type `result`, fond dégradé mint). Idéal pour : relations causes/effet, étapes de raisonnement, facteurs combinés.

## Garde-fous (child_safety)
- **BLOCKED** si `nodes` vide, `result_node` absent, ou `caption` absente.
- **Anti-invention** : aucun contenu pédagogique n'est écrit dans le HTML. Tout vient du JSON.
- **Connecteur `+` par défaut** si non fourni — jamais implicite dans le rendu final.

## QA à vérifier
1. Modifier un `label` dans `nodes` → rendu change sans toucher au HTML (critère d'or).
2. `nodes:[]` → BLOCKED propre.
3. `result_node` absent → BLOCKED propre.
4. `caption` absente → BLOCKED propre.
5. Clic nœud → panel note avec le label du nœud.
6. Clic bouton CTA → panel ok avec comptage causes → résultat.
7. Responsive 375 : flux en colonne, flèche pivotée 90°.

## Source
`INDEX-300-visuallearning-GAB-074-080-PLAYABLE.html` (stage `data-tpl="76"`, `.sch-card`/`.sch-flow`/`.sch-node` — aucun handler JS dédié d76 dans le source, moteur entièrement recréé data-driven).