# GAB-026 · CalloutLearningNote — « Note pédagogique transverse »

**Archétype / renderer_key :** `text_cta` (cartographie) · **module :** EdTechPlayKit
**Critère validé :** changer le JSON change le callout (ton, icône, titre, corps) sans modifier le HTML. check.py 12/12.

## Pack (structure officielle par-GAB)
```
GAB-026/
  renderer.html            ← moteur callout (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` · `callout_id` · `default_tone` · `tones{exam_focus?,calm?,warning?,encouraging?}`
Optionnel : `accessibility{keyboard_navigable, focus_visible, prefers_reduced_motion}`.

## Ce qui vient du JSON vs HTML
- **JSON** : ton par défaut, icône, titre et corps de chaque ton, identifiant du callout.
- **HTML** : layout flex, bordure colorée, fond de ton, boutons de commutation, logique de rendu.

## Garde-fous
- **Anti-invention** : tout le contenu (textes, icônes) est extrait verbatim du HTML source `INDEX-300-playkit-GAB-026-030-PLAYABLE.html`, objet `calloutData`.
- **BLOCKED** si `tones` absent ou vide / `default_tone` absent / `callout_id` absent.
- Aucun contenu pédagogique en dur dans le renderer.

## Archétype
- Gabarit **XS · P0** : note transverse courte, insertible dans n'importe quel module.
- 4 tons nommés par la source : `exam_focus` (gold), `calm` (sky), `warning` (coral), `encouraging` (mint).
- Usage : attirer l'attention sur un point clé, astuce, rappel, mise en garde.
- Ne pas utiliser pour : erreur technique (→ GAB-030), contenu principal, transition de phase (→ GAB-027).

## QA à vérifier
1. Modifier un `title`/`body`/`icon` → rendu change sans toucher au HTML (critère d'or).
2. `tones:{}` ou `tones` absent → BLOCKED propre.
3. Clic bouton de ton → icône + titre + corps + couleur changent.
4. `default_tone` absent de `tones` → BLOCKED propre.
5. Responsive 375/768/1024 — aucun débordement.

## Source
`INDEX-300-playkit-GAB-026-030-PLAYABLE.html` (stage `data-tpl="26"`, objet `calloutData`, fonction `calloutTone()`).