docs(#173): contrat API id_evenement (ex-id_absence) dans mini-spec bulles

Alignement post-#205 ; note front pour parser id_evenement.

Co-authored-by: Cursor <cursoragent@cursor.com>

backend/src/modules/cards/cards.service.spec.ts

@@ -80,7 +80,6 @@ describe('CardsService (#194)', () => {
       audience_resolver: 'couple_parents',
       response_mode: CardResponseModeType.ACCEPT_REFUSE,
       retention_days: 14,
-      couleur: 'lavender',
     });
     amChildrenRepo.findOne.mockResolvedValue({
       id: 'pl-1',
@@ -111,7 +110,6 @@ describe('CardsService (#194)', () => {
       modifie_le: new Date(),
       type: {
         titre: 'Congé AM',
-        couleur: 'lavender',
         response_mode: CardResponseModeType.ACCEPT_REFUSE,
         retention_days: 14,
       },
@@ -157,4 +155,75 @@ describe('CardsService (#194)', () => {
       }),
     ).rejects.toBeInstanceOf(ForbiddenException);
   });
+
+  it('parent crée absence_enfant → audience AM + co-parent', async () => {
+    typesRepo.findOne.mockResolvedValue({
+      code: 'absence_enfant',
+      system: true,
+      titre: 'Absence enfant',
+      emitter_roles: [RoleType.PARENT],
+      recipient_roles: [RoleType.ASSISTANTE_MATERNELLE],
+      audience_resolver: 'couple_am',
+      response_mode: CardResponseModeType.NONE,
+      retention_days: 7,
+    });
+    amChildrenRepo.findOne.mockResolvedValue({
+      id: 'pl-1',
+      amId: 'am-1',
+      enfantId: 'e-1',
+      date_fin: null,
+    });
+    parentsChildrenRepo.findOne.mockResolvedValue({
+      parentId: 'p-1',
+      enfantId: 'e-1',
+    });
+    parentsChildrenRepo.find.mockResolvedValue([
+      { parentId: 'p-1', enfantId: 'e-1' },
+      { parentId: 'p-2', enfantId: 'e-1' },
+    ]);
+    evenementsService.creer.mockResolvedValue({
+      id: 'abs-1',
+      type: TypeEvenementAgendaType.ABSENCE_ENFANT,
+      statut: StatutEvenementAgendaType.ACCEPTE,
+    });
+    cardsRepo.findOne.mockResolvedValue({
+      id: 'card-abs',
+      type_code: 'absence_enfant',
+      id_placement: 'pl-1',
+      id_evenement: 'abs-1',
+      cree_par: 'p-1',
+      operation: CardOperationType.CREATE,
+      statut: CardInstanceStatutType.OUVERTE,
+      payload: { date_debut: '2026-10-28', date_fin: '2026-10-29' },
+      purge_at: new Date(),
+      cree_le: new Date(),
+      modifie_le: new Date(),
+      type: {
+        titre: 'Absence enfant',
+        response_mode: CardResponseModeType.NONE,
+        retention_days: 7,
+      },
+      responses: [],
+      audience: [
+        { id_utilisateur: 'p-1' },
+        { id_utilisateur: 'am-1' },
+        { id_utilisateur: 'p-2' },
+      ],
+    });
+
+    await service.creer('p-1', RoleType.PARENT, {
+      type_code: 'absence_enfant',
+      id_placement: 'pl-1',
+      date_debut: '2026-10-28',
+      date_fin: '2026-10-29',
+    });
+
+    const saved = audienceRepo.save.mock.calls[0][0] as Array<{
+      id_utilisateur: string;
+      is_creator: boolean;
+    }>;
+    const ids = saved.map((m) => m.id_utilisateur).sort();
+    expect(ids).toEqual(['am-1', 'p-1', 'p-2']);
+    expect(saved.find((m) => m.id_utilisateur === 'p-2')?.is_creator).toBe(false);
+  });
 });

backend/src/modules/cards/cards.service.ts

@@ -53,9 +53,32 @@ export class CardsService {
     private readonly realtime: CardsRealtimeService,
   ) {}
 
-  async listerTypes(role: RoleType): Promise<CardType[]> {
+  async listerTypes(role: RoleType): Promise<
+    Pick<
+      CardType,
+      | 'code'
+      | 'system'
+      | 'titre'
+      | 'emitter_roles'
+      | 'recipient_roles'
+      | 'audience_resolver'
+      | 'response_mode'
+      | 'retention_days'
+    >[]
+  > {
     const all = await this.typesRepo.find({ where: { system: true } });
-    return all.filter((t) => t.emitter_roles.includes(role));
+    return all
+      .filter((t) => t.emitter_roles.includes(role))
+      .map((t) => ({
+        code: t.code,
+        system: t.system,
+        titre: t.titre,
+        emitter_roles: t.emitter_roles,
+        recipient_roles: t.recipient_roles,
+        audience_resolver: t.audience_resolver,
+        response_mode: t.response_mode,
+        retention_days: t.retention_days,
+      }));
   }
 
   async lister(
@@ -372,12 +395,25 @@ export class CardsService {
     ];
 
     if (type.audience_resolver === 'couple_am') {
+      // Destinataire métier = AM + miroir foyer : tous les co-parents de l’enfant
       members.push({
         id_card: card.id,
         id_utilisateur: placement.amId,
         role_snapshot: RoleType.ASSISTANTE_MATERNELLE,
         is_creator: false,
       });
+      const liensAm = await this.parentsChildrenRepo.find({
+        where: { enfantId: placement.enfantId },
+      });
+      for (const l of liensAm) {
+        if (l.parentId === creatorId) continue;
+        members.push({
+          id_card: card.id,
+          id_utilisateur: l.parentId,
+          role_snapshot: RoleType.PARENT,
+          is_creator: false,
+        });
+      }
     } else if (type.audience_resolver === 'couple_parents') {
       const liens = await this.parentsChildrenRepo.find({
         where: { enfantId: placement.enfantId },
@@ -469,7 +505,6 @@ export class CardsService {
       id: card.id,
       type_code: card.type_code,
       titre: card.type?.titre ?? card.type_code,
-      couleur: card.type?.couleur ?? null,
       id_placement: card.id_placement,
       id_evenement: card.id_evenement ?? null,
       operation: card.operation,

backend/src/modules/cards/dto/cards.dto.ts

@@ -91,9 +91,6 @@ export class CarteDto {
   @ApiProperty()
   titre: string;
 
-  @ApiPropertyOptional()
-  couleur?: string | null;
-
   @ApiProperty()
   id_placement: string;
 

docs/24_DECISIONS-PROJET.md

@@ -572,14 +572,28 @@ POST /repos/jmartin/petitspas/pulls/{index}/merge
 
 ### 32. Module Absences + Cartes (séparation back / collecte)
 
-**Décision** : ✅ **Back `evenements_agenda` = vérité métier** ; **Cartes = file d’attention / collecte** (plugin isolé). Types SYSTEM (absence, congé, arrêt) indéboulonnables ; types OPTIONNELS (sondages…) plus tard. Annulation = DELETE. `expire_at` dès V1.
+**Décision** : ✅ **Back `evenements_agenda` = vérité métier / agenda** ; **Cartes = file d’attention** (plugin isolé). Types SYSTEM (absence, congé, arrêt) indéboulonnables ; types OPTIONNELS (sondages, soins enfant, école, mairie, sorties…) plus tard. Annulation = DELETE. `expire_at` dès V1.
 
 **Justification** :
 - Premier vrai module d’interaction multi-acteurs
-- Évite de stocker l’historique congés dans des bulles éphémères
+- Évite de stocker l’historique dans des bulles éphémères
-- Portabilité / généricité des cartes sans coupler le métier garde
+- Portabilité / généricité des cartes sans coupler le métier
+- **Différence avec le blog** : les cartes du fil = **événements d’agenda** (période + placement + historique) ; le blog = récit narratif du jour
 
-**Flux V1** : BDD absences → API liste/CRUD → module Cartes SYSTEM → front bulles (séparé).
+**Modèle données** :
+- Table **`evenements_agenda`** (ex-`absences_garde`, rename [#205](https://git.ptits-pas.fr/jmartin/petitspas/issues/205)) — nom volontairement ouvert
+
+**UI** : la **couleur** des bulles est un mapping **front** (`type_code` → teinte). L’API n’expose pas `couleur`.
+
+**Flux V1** : BDD agenda → API liste/CRUD → module Cartes SYSTEM → front bulles (séparé).
+
+**V1 cartes (réponses)** :
+- `absence_enfant` → info (`none`) — pas d’ack AM ; audience **AM + tous les parents du foyer** (co-parent inclus)
+- `arret_maladie_am` → ack parent (« Bien reçu »)
+- `conge_am` → accept / refuse (+ motivation refus)
+- **Modifs d’absence** → via **agenda / calendrier**, pas via bulle `absence_enfant_modif` (reporté au ticket calendrier)
+
+**Réf. détail** : `docs/32_MINI-SPEC-BULLES-CARTES.md`
 
 ---
 

docs/31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md

@@ -103,7 +103,7 @@ Avec données peuplées, sur au moins 2 supports :
 
 - Parent : `frontend/lib/screens/home/parent_screen/ParentDashboardScreen.dart` + `dashbord_parent/`
 - AM : `frontend/lib/screens/am/am_dashboard_screen.dart` (placeholder)
-- Cartes couleurs : `frontend/assets/cards/` (7 teintes max)
+- Cartes couleurs : `frontend/assets/cards/` (8 teintes max)
 
 ## 9. Ordre de build suggéré
 

docs/32_MINI-SPEC-BULLES-CARTES.md

@@ -0,0 +1,195 @@
+# Mini-spec · Bulles / file d’attention (#173)
+
+*Front · octobre 2026 — alignement product / API.*
+
+---
+
+## 1. Contexte / objectif
+
+Les bulles (cartes) sont la **file d’attention** du quotidien parent / AM : décisions et infos proches (congés, arrêt maladie AM, absences, soins / bobos enfant…).
+
+**Différence fondamentale avec le blog :**  
+les cartes de ce fil sont des **événements d’agenda** (période, placement, historique métier loggé).  
+Le **blog** = récit / mémoire narrative du jour (photos, texte) — pas une ligne d’agenda.
+
+Les cartes restent une **mémoire courte** de file (`purge_at` sur la bulle) ; la **source de vérité agenda** reste le back métier.
+
+Table agenda : **`evenements_agenda`** (ex-`absences_garde`, [#205](https://git.ptits-pas.fr/jmartin/petitspas/issues/205) fait) — conteneur ouvert (absences, congés, soins, école, mairie, sorties…). Les bulles notifient ; l’agenda historise.
+
+Voir aussi `31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md`.
+
+Cette note formalise :
+1. Ce qui est en place côté front (#173).
+2. Le contrat API (sans couleur).
+3. La **palette UI** (front only, dérivée du `type_code`).
+4. La nouvelle famille **soins / bobo enfant** (rose) — AM → parents.
+5. Idées futures.
+
+---
+
+## 2. Contrat API
+
+Endpoint principal : `GET /api/v1/cards` (filtre couple / placement).
+
+| Champ | Rôle UI |
+|-------|---------|
+| `type_code` | Layout + libellé + **couleur / icône (mapping front)** |
+| `titre` | Fallback si `type_code` inconnu |
+| `statut` | `ouverte` · `refusee` · `traitee` |
+| `response_mode` | `none` · `ack` · `accept_refuse` |
+| `is_creator` | Masque les boutons réponse pour le créateur |
+| `payload.date_debut` / `date_fin` | Période (agenda) |
+| `payload.motif` | Texte libre / détail |
+| `last_refuse_comment` | Si `refusee` |
+| `id_evenement` | Lien métier agenda (`evenements_agenda`, si applicable) — ex-`id_absence` (#205) |
+| `purge_at` | Péremption de la bulle dans la file |
+
+> **Front** : parser `id_evenement` (fallback éventuel `id_absence` uniquement pour anciennes fixtures / caches). Ne plus documenter ni dépendre de `id_absence` comme contrat.
+
+**Pas de champ `couleur` dans l’API.**  
+La teinte pastel est **100 % front** : table de mapping `type_code` → asset (`card_*_h.png`). Le back ne gère pas la charte graphique.
+
+**Règle front :** le destinataire peut répondre si `!is_creator && statut == ouverte && response_mode != none`.
+
+---
+
+## 3. Évolutions front déjà livrées (#173)
+
+### 3.1 Feed
+
+- Widget partagé `CartesFeed` (parent + AM).
+- Fond via widget `Carte` (9-slice horizontal) selon mapping local.
+- Actions via **modales** accepter / refuser / ack.
+- Libellés UI :
+  - `conge_am` → « Demande de congés »
+  - `arret_maladie_am` → « Arrêt maladie »
+  - `absence_enfant` → « Notification d’absence »
+
+### 3.2 Carte **congés** (`conge_am`)
+
+| Élément | Comportement |
+|---------|----------------|
+| Fond | **Aqua** (mapping front) |
+| Encre | Pétrole `#315F63` / dates `#4A7276` |
+| Icône | Valise |
+| Période | « Du … au … » + calendrier |
+| Actions | Pilules ✓ / ✕ si `accept_refuse` |
+| Lien | « Ouvrir dans l’agenda ↗ » |
+| Opacité | Atténuée si `traitee` (sauf règle arrêt ci-dessous) |
+
+### 3.3 Arrêt maladie AM (`arret_maladie_am`)
+
+- Reste **visible / opaque** tant que `date_fin` (jour inclus) n’est pas passée, même si `traitee`.
+- Fond **bleu** (mapping front).
+
+### 3.4 Assets
+
+Teintes UI : `red` · `pink` · `peach` · `lime` · `lavender` · `green` · `blue` · `aqua`.  
+Clé = **choix front**, pas une valeur API.
+
+---
+
+## 4. Palette UI (front only — dérivée du `type_code`)
+
+| Couleur UI | Famille | Types |
+|------------|---------|--------|
+| **`aqua`** | Congés AM | `conge_am` |
+| **`blue`** | Arrêt maladie AM | `arret_maladie_am` |
+| **`peach`** | Absence enfant / info pratique | `absence_enfant` |
+| **`pink`** | Soins / bobo / problème **enfant** (AM → parents) | `soin_enfant` *(nouveau — voir §5)* |
+| **`lavender`** | Admin / divers | futurs types admin |
+
+**Hors scope V1 cartes** : `absence_enfant_modif` (ack AM sur modif).  
+Les **modifications d’absence** se font via l’**agenda / calendrier**, pas via une bulle dédiée. On rebranchera une notif éventuelle quand le calendrier sera implémenté.
+
+**Principes**
+
+- Couleur = famille visuelle (lisible sans tout lire).
+- Icône précise l’événement (surtout sur rose : thermomètre, pansement, flacon…).
+- Rose = doux / rassurant, **pas** une alerte médicale forte.
+- Congés ≠ lavande (trop « admin »).
+
+---
+
+## 5. Nouvelle bulle rose — soins / bobo enfant (AM → parents)
+
+### Intention produit
+
+La nounou signale un **événement concernant l’enfant** (maladie légère, bobo, crème, température, souci du jour…) **vers les parents**.
+
+Pourquoi **pas seulement la messagerie** ?
+- C’est **loggé** dans la file d’attention.
+- C’est un **événement d’agenda** (période / jour, placement, historique).
+- Les parents peuvent **acquitter** (`ack`) sans noyer le chat.
+
+### Proposition V1 (à brancher ultérieurement)
+
+| | |
+|--|--|
+| `type_code` | `soin_enfant` (nom exact à figer) |
+| Émetteur | AM |
+| Destinataires | parents du couple / placement |
+| `response_mode` | `ack` |
+| Couleur UI | `pink` |
+| Back métier | ligne agenda liée (même esprit que `absences_garde` : période + placement + motif) ; la bulle = collecte / notification |
+| Payload | `date_debut` / `date_fin` (+ motif / sous-type optionnel : temperature, bobo, medicament…) |
+
+**Hors scope immédiat #173** : implémentation complète ; cette section fige l’intention pour le contrat types + UI.
+
+---
+
+## 6. Idées futures (hors scope)
+
+| Famille | Couleur UI | Exemples | `response_mode` |
+|---------|------------|----------|-----------------|
+| Soins (détail) | `pink` | `soin_temperature`, `soin_medicament`, `soin_bobo` — ou sous-types dans payload | `ack` |
+| Modif absence | `peach` | `absence_enfant_modif` — **via calendrier** d’abord ; bulle ack AM éventuelle ensuite | `ack` |
+| Sortie | `peach` / `lavender` | `sortie_a_valider` | `accept_refuse` |
+| Admin | `lavender` | `info_admin`, `document_a_fournir` | `ack` / `none` |
+
+Variante soins : un seul fond rose ; l’icône / sous-type change.
+
+---
+
+## 7. Comportements métier à ne pas casser
+
+- Créateur : pas de boutons réponse ; éventuel « En attente de réponse ».
+- Refus : afficher `last_refuse_comment`.
+- Congé : `accept_refuse` côté destinataire.
+- Absence enfant : **info seule** (`response_mode: none`) — pas de veto ni ack AM en V1.
+- Absence enfant : audience = **AM + tous les parents du foyer** (créateur + co-parent), pas seulement le déclarant.
+- Modif / édition d’absence : **agenda**, pas les cartes (V1).
+- File courte : `purge_at` ; l’**agenda** conserve l’historique métier.
+
+---
+
+## 8. Fichiers front de référence
+
+- `frontend/lib/models/carte_bulle.dart` — mapping type → libellé / icône / fond
+- `frontend/lib/widgets/quotidien/cartes_feed.dart`
+- `frontend/lib/models/card_assets.dart`
+- Assets : `frontend/assets/cards/`, `valise.png`, `btn_*_pilule.png`
+
+---
+
+## 9. Recettes
+
+- [ ] API cartes **sans** champ `couleur` (ni feed ni `/types`).
+- [ ] Contrat lien agenda : champ API `id_evenement` (plus `id_absence`).
+- [ ] Front mappe `conge_am` → aqua, `arret_maladie_am` → blue, `absence_enfant` → peach.
+- [ ] Accept / refuse congé OK.
+- [ ] Arrêt : ack parent « Bien reçu » ; traité + période en cours → reste visible.
+- [ ] Absence enfant : pas de bouton (info).
+- [ ] Filtre couple / placement.
+- [ ] (Plus tard) `soin_enfant` rose AM → parents + ligne agenda.
+- [ ] (Plus tard / calendrier) modifs d’absence + éventuel `absence_enfant_modif`.
+
+---
+
+## 10. Références
+
+- Ticket front : **#173**
+- Module cartes : **#194**
+- Quotidien : `docs/31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md`
+- Décision projet : `docs/24_DECISIONS-PROJET.md` §32
+- Maquette congés : `ressources/bulle_congés.jpg`

frontend/lib/models/card_assets.dart

@@ -5,7 +5,8 @@ enum CardColorVertical {
   lime('assets/cards/card_lime.png'),
   lavender('assets/cards/card_lavender.png'),
   green('assets/cards/card_green.png'),
-  blue('assets/cards/card_blue.png');
+  blue('assets/cards/card_blue.png'),
+  aqua('assets/cards/card_aqua.png');
 
   final String path;
   const CardColorVertical(this.path);
@@ -18,7 +19,8 @@ enum CardColorHorizontal {
   lime('assets/cards/card_lime_h.png'),
   lavender('assets/cards/card_lavender_h.png'),
   green('assets/cards/card_green_h.png'),
-  blue('assets/cards/card_blue_h.png');
+  blue('assets/cards/card_blue_h.png'),
+  aqua('assets/cards/card_aqua_h.png');
 
   final String path;
   const CardColorHorizontal(this.path);

frontend/lib/models/carte_bulle.dart

@@ -0,0 +1,205 @@
+import 'package:p_tits_pas/models/card_assets.dart';
+
+/// Statut d'une instance de carte (file d'attention) — contrat #194 / #173.
+enum CarteStatut {
+  ouverte('ouverte'),
+  refusee('refusee'),
+  traitee('traitee');
+
+  final String apiValue;
+  const CarteStatut(this.apiValue);
+
+  static CarteStatut fromApi(String? raw) {
+    switch (raw) {
+      case 'refusee':
+        return CarteStatut.refusee;
+      case 'traitee':
+        return CarteStatut.traitee;
+      case 'ouverte':
+      default:
+        return CarteStatut.ouverte;
+    }
+  }
+}
+
+/// Mode de réponse attendu selon le type SYSTEM.
+enum CarteResponseMode {
+  none('none'),
+  ack('ack'),
+  acceptRefuse('accept_refuse');
+
+  final String apiValue;
+  const CarteResponseMode(this.apiValue);
+
+  static CarteResponseMode fromApi(String? raw) {
+    switch (raw) {
+      case 'ack':
+        return CarteResponseMode.ack;
+      case 'accept_refuse':
+        return CarteResponseMode.acceptRefuse;
+      case 'none':
+      default:
+        return CarteResponseMode.none;
+    }
+  }
+}
+
+/// Bulle / carte de la file d'attention.
+class CarteBulle {
+  final String id;
+  final String typeCode;
+  final String titre;
+  final String idPlacement;
+  final String? idAbsence;
+  final String operation;
+  final CarteStatut statut;
+  final Map<String, dynamic> payload;
+  final DateTime? purgeAt;
+  final String? creePar;
+  final bool isCreator;
+  final CarteResponseMode responseMode;
+  final String? lastRefuseComment;
+  final DateTime? creeLe;
+  final DateTime? modifieLe;
+
+  const CarteBulle({
+    required this.id,
+    required this.typeCode,
+    required this.titre,
+    required this.idPlacement,
+    this.idAbsence,
+    this.operation = 'create',
+    required this.statut,
+    this.payload = const {},
+    this.purgeAt,
+    this.creePar,
+    this.isCreator = false,
+    this.responseMode = CarteResponseMode.none,
+    this.lastRefuseComment,
+    this.creeLe,
+    this.modifieLe,
+  });
+
+  String? get dateDebut => payload['date_debut']?.toString();
+  String? get dateFin => payload['date_fin']?.toString();
+  String? get motif => payload['motif']?.toString();
+
+  /// Motif de refus : réponse API, sinon motif payload (co-parent / reload).
+  String? get motifRefus {
+    final fromResponse = lastRefuseComment?.trim();
+    if (fromResponse != null && fromResponse.isNotEmpty) return fromResponse;
+    final fromPayload = motif?.trim();
+    if (fromPayload != null && fromPayload.isNotEmpty) return fromPayload;
+    return null;
+  }
+
+  /// Libellé UI (sémantique produit) — pas le titre brut API.
+  String get titreAffiche {
+    switch (typeCode) {
+      case 'conge_am':
+        return 'Demande de congés';
+      case 'arret_maladie_am':
+        return 'Arrêt maladie';
+      case 'absence_enfant':
+      case 'absence_enfant_modif':
+        return 'Notification d’absence';
+      case 'soin_enfant':
+        return 'Soin / bobo';
+      default:
+        return titre;
+    }
+  }
+
+  bool get isArretMaladie => typeCode == 'arret_maladie_am';
+  bool get isCongeAm => typeCode == 'conge_am';
+  bool get isSoinEnfant => typeCode == 'soin_enfant';
+
+  /// Icône dessin (haut droite) selon le type de bulle.
+  String? get iconAsset {
+    switch (typeCode) {
+      case 'conge_am':
+        return 'assets/images/valise.png';
+      case 'arret_maladie_am':
+        return 'assets/images/thermo_croix.png';
+      case 'absence_enfant':
+      case 'absence_enfant_modif':
+        return 'assets/images/sac_lapin.png';
+      // soin_enfant : icône selon sous-type payload — à brancher plus tard
+      default:
+        return null;
+    }
+  }
+
+  /// Fin de période (jour inclus). Null si dates absentes / invalides.
+  DateTime? get dateFinJour {
+    final raw = dateFin;
+    if (raw == null || raw.isEmpty) return null;
+    final dt = DateTime.tryParse(raw);
+    if (dt == null) return null;
+    return DateTime(dt.year, dt.month, dt.day);
+  }
+
+  /// Vrai tant que la date de fin n’est pas dépassée (jour courant inclus).
+  bool get periodeEncoreActive {
+    final fin = dateFinJour;
+    if (fin == null) return true;
+    final today = DateTime.now();
+    final todayDay = DateTime(today.year, today.month, today.day);
+    return !todayDay.isAfter(fin);
+  }
+
+  /// Teinte pastel UI dérivée du `type_code` (pas de `couleur` API).
+  /// Voir `docs/32_MINI-SPEC-BULLES-CARTES.md` §4.
+  CardColorHorizontal get colorFamily {
+    switch (typeCode) {
+      case 'conge_am':
+        return CardColorHorizontal.aqua;
+      case 'arret_maladie_am':
+        return CardColorHorizontal.blue;
+      case 'absence_enfant':
+      case 'absence_enfant_modif':
+        return CardColorHorizontal.peach;
+      case 'soin_enfant':
+        return CardColorHorizontal.pink;
+      default:
+        return CardColorHorizontal.lavender;
+    }
+  }
+
+  /// Asset horizontal pastel (palette `assets/cards/` uniquement).
+  String get backgroundAsset => colorFamily.path;
+
+  /// Le destinataire peut répondre (pas le créateur, carte ouverte).
+  bool get peutRepondre =>
+      !isCreator &&
+      statut == CarteStatut.ouverte &&
+      responseMode != CarteResponseMode.none;
+
+  factory CarteBulle.fromJson(Map<String, dynamic> json) {
+    final rawPayload = json['payload'];
+    return CarteBulle(
+      id: (json['id'] ?? '').toString(),
+      typeCode: (json['type_code'] ?? '').toString(),
+      titre: (json['titre'] ?? json['type_code'] ?? 'Carte').toString(),
+      idPlacement: (json['id_placement'] ?? '').toString(),
+      idAbsence: json['id_absence']?.toString(),
+      operation: (json['operation'] ?? 'create').toString(),
+      statut: CarteStatut.fromApi(json['statut']?.toString()),
+      payload: rawPayload is Map
+          ? Map<String, dynamic>.from(rawPayload)
+          : const {},
+      purgeAt: _parseDate(json['purge_at']),
+      creePar: json['cree_par']?.toString(),
+      isCreator: json['is_creator'] == true,
+      responseMode: CarteResponseMode.fromApi(json['response_mode']?.toString()),
+      lastRefuseComment: json['last_refuse_comment']?.toString(),
+      creeLe: _parseDate(json['cree_le']),
+      modifieLe: _parseDate(json['modifie_le']),
+    );
+  }
+
+  static DateTime? _parseDate(dynamic v) {
+    if (v == null) return null;
+    return DateTime.tryParse(v.toString());
+  }
+}

frontend/lib/screens/auth/parent_register_step3_screen.dart

@@ -41,6 +41,7 @@ class _ParentRegisterStep3ScreenState extends State<ParentRegisterStep3Screen> {
     CardColorVertical.red,
     CardColorVertical.green,
     CardColorVertical.blue,
+    CardColorVertical.aqua,
   ];
 
   // Garder une trace des couleurs déjà utilisées

frontend/lib/screens/home/parent_screen/ParentDashboardScreen.dart

@@ -3,14 +3,14 @@ import 'package:p_tits_pas/models/couple_garde.dart';
 import 'package:p_tits_pas/models/user.dart';
 import 'package:p_tits_pas/services/auth_service.dart';
 import 'package:p_tits_pas/services/couple_garde_service.dart';
+import 'package:p_tits_pas/widgets/quotidien/cartes_feed.dart';
 import 'package:p_tits_pas/widgets/quotidien/couple_selector_bandeau.dart';
 import 'package:p_tits_pas/widgets/quotidien/quotidien_shell.dart';
 import 'package:p_tits_pas/widgets/quotidien/quotidien_theme.dart';
 import 'package:p_tits_pas/screens/home/parent_screen/agenda_absences_stub.dart';
 
 /// Tableau de bord parent — coquille 3 colonnes quotidien (#166).
-/// Colonne gauche : sélecteur de couple enfant–nounou (#167).
+/// Colonne gauche : sélecteur de couple (#167) + feed bulles (#173).
-/// Métier cartes / blog / messagerie : tickets C/D/E.
 class ParentDashboardScreen extends StatefulWidget {
   const ParentDashboardScreen({super.key});
 
@@ -63,7 +63,6 @@ class _ParentDashboardScreenState extends State<ParentDashboardScreen> {
 
   Future<void> _selectCouple(CoupleGarde couple) async {
     if (couple.id == _selectedCoupleId) return;
-    // Optimiste : on bascule tout de suite, l'API persiste ensuite.
     setState(() => _selectedCoupleId = couple.id);
     try {
       final res = await CoupleGardeService.definirCoupleCourant(couple.id);
@@ -116,6 +115,7 @@ class _ParentDashboardScreenState extends State<ParentDashboardScreen> {
         error: _couplesError,
         onRetry: _loadCouples,
         onCoupleSelected: _selectCouple,
+        onAjouterBulle: () => _soon('Ajouter une bulle'),
       ),
       centerColumn: const QuotidienColumnPlaceholder(
         title: 'Blog',
@@ -138,7 +138,7 @@ class _ParentDashboardScreenState extends State<ParentDashboardScreen> {
   }
 }
 
-/// Colonne gauche : bandeau couple (#167) puis flux de cartes (#173 à venir).
+/// Colonne gauche : bandeau couple (#167) puis flux de cartes (#173).
 class _LeftColumn extends StatelessWidget {
   final List<CoupleGarde> couples;
   final String? selectedCoupleId;
@@ -146,6 +146,7 @@ class _LeftColumn extends StatelessWidget {
   final String? error;
   final VoidCallback onRetry;
   final ValueChanged<CoupleGarde> onCoupleSelected;
+  final VoidCallback onAjouterBulle;
 
   const _LeftColumn({
     required this.couples,
@@ -154,6 +155,7 @@ class _LeftColumn extends StatelessWidget {
     required this.error,
     required this.onRetry,
     required this.onCoupleSelected,
+    required this.onAjouterBulle,
   });
 
   @override
@@ -172,12 +174,10 @@ class _LeftColumn extends StatelessWidget {
             onCoupleSelected: onCoupleSelected,
           ),
           const SizedBox(height: 14),
-          const Expanded(
+          Expanded(
-            child: QuotidienColumnPlaceholder(
+            child: CartesFeed(
-              title: 'Cartes',
+              placementId: selectedCoupleId,
-              subtitle:
+              onAjouterBulle: onAjouterBulle,
-                  'Absences, congés AM, sorties à valider\n(à brancher — ticket #173).',
-              icon: Icons.style_outlined,
             ),
           ),
         ],

frontend/lib/services/api/api_config.dart

@@ -93,6 +93,10 @@ class ApiConfig {
   static const String conversations = '/conversations';
   static const String notifications = '/notifications';
 
+  /// File d'attention / bulles (#173 / #194).
+  static const String cards = '/cards';
+  static const String cardsStream = '/cards/stream';
+
   // Headers
   static Map<String, String> get headers => {
         'Content-Type': 'application/json',

frontend/lib/services/api/cards_service.dart

@@ -0,0 +1,87 @@
+import 'dart:convert';
+
+import 'package:http/http.dart' as http;
+import 'package:p_tits_pas/models/carte_bulle.dart';
+import 'package:p_tits_pas/services/api/api_config.dart';
+import 'package:p_tits_pas/services/api/tokenService.dart';
+
+/// Accès API Cartes (file d'attention) — tickets #173 / #194.
+/// - GET    /cards?placementId=
+/// - POST   /cards/:id/respond
+class CardsService {
+  static Future<Map<String, String>> _headers() async {
+    final token = await TokenService.getToken();
+    return token != null
+        ? ApiConfig.authHeaders(token)
+        : Map<String, String>.from(ApiConfig.headers);
+  }
+
+  static String _extractError(String body, String fallback) {
+    try {
+      final decoded = jsonDecode(body);
+      if (decoded is Map<String, dynamic>) {
+        final message = decoded['message'];
+        if (message is String && message.trim().isNotEmpty) {
+          return message;
+        }
+        if (message is Map && message['message'] is String) {
+          return message['message'] as String;
+        }
+      }
+    } catch (_) {}
+    return fallback;
+  }
+
+  /// Feed de bulles pour l'utilisateur (filtré par couple / placement).
+  static Future<List<CarteBulle>> lister({String? placementId}) async {
+    final query = <String, String>{};
+    if (placementId != null && placementId.isNotEmpty) {
+      query['placementId'] = placementId;
+    }
+    final uri = Uri.parse(
+      '${ApiConfig.baseUrl}${ApiConfig.cards}',
+    ).replace(queryParameters: query.isEmpty ? null : query);
+
+    final response = await http.get(uri, headers: await _headers());
+    if (response.statusCode != 200) {
+      throw Exception(
+        _extractError(response.body, 'Erreur chargement des cartes'),
+      );
+    }
+
+    final decoded = jsonDecode(response.body);
+    final list = (decoded is Map ? decoded['items'] as List? : null) ?? const [];
+    return list
+        .whereType<Map>()
+        .map((e) => CarteBulle.fromJson(Map<String, dynamic>.from(e)))
+        .toList();
+  }
+
+  /// Répondre : accept | refuse | ack.
+  static Future<CarteBulle> repondre({
+    required String cardId,
+    required String action,
+    String? comment,
+  }) async {
+    final response = await http.post(
+      Uri.parse(
+        '${ApiConfig.baseUrl}${ApiConfig.cards}/$cardId/respond',
+      ),
+      headers: await _headers(),
+      body: jsonEncode({
+        'action': action,
+        if (comment != null && comment.trim().isNotEmpty)
+          'comment': comment.trim(),
+      }),
+    );
+
+    if (response.statusCode != 200) {
+      throw Exception(
+        _extractError(response.body, 'Erreur lors de la réponse'),
+      );
+    }
+
+    final decoded = jsonDecode(response.body);
+    return CarteBulle.fromJson(Map<String, dynamic>.from(decoded as Map));
+  }
+}

frontend/lib/utils/reprise_mapper.dart

@@ -17,6 +17,7 @@ class RepriseMapper {
     CardColorVertical.red,
     CardColorVertical.green,
     CardColorVertical.blue,
+    CardColorVertical.aqua,
   ];
 
   static ParentData parentFromDossier(ParentDossier p) {

frontend/lib/widgets/base_form_screen.dart

@@ -185,6 +185,8 @@ class BaseFormScreen extends StatelessWidget {
         return CardColorVertical.pink.path;
       case CardColorHorizontal.red:
         return CardColorVertical.red.path;
+      case CardColorHorizontal.aqua:
+        return CardColorVertical.aqua.path;
     }
   }
 

frontend/lib/widgets/child_card_widget.dart

@@ -205,9 +205,14 @@ class _ChildCardWidgetState extends State<ChildCardWidget> {
       );
     }
 
-    final Color baseCardColorForShadow = widget.childData.cardColor == CardColorVertical.lavender 
+    final Color baseCardColorForShadow =
-        ? Colors.purple.shade200 
+        widget.childData.cardColor == CardColorVertical.lavender
-        : (widget.childData.cardColor == CardColorVertical.pink ? Colors.pink.shade200 : Colors.grey.shade200);
+            ? Colors.purple.shade200
+            : (widget.childData.cardColor == CardColorVertical.pink
+                ? Colors.pink.shade200
+                : (widget.childData.cardColor == CardColorVertical.aqua
+                    ? Colors.teal.shade200
+                    : Colors.grey.shade200));
     final double photoSide = 200.0 * (config.isMobile ? 0.8 : 1.0);
     final double editableCardWidth = config.isMobile
         ? double.infinity
@@ -340,6 +345,7 @@ class _ChildCardWidgetState extends State<ChildCardWidget> {
     
     // Mapping manuel simple
     if (widget.childData.cardColor.path.contains('lavender')) horizontalCardAsset = CardColorHorizontal.lavender.path;
+    else if (widget.childData.cardColor.path.contains('aqua')) horizontalCardAsset = CardColorHorizontal.aqua.path;
     else if (widget.childData.cardColor.path.contains('blue')) horizontalCardAsset = CardColorHorizontal.blue.path;
     else if (widget.childData.cardColor.path.contains('green')) horizontalCardAsset = CardColorHorizontal.green.path;
     else if (widget.childData.cardColor.path.contains('lime')) horizontalCardAsset = CardColorHorizontal.lime.path;

frontend/lib/widgets/personal_info_form_screen.dart

@@ -1302,6 +1302,8 @@ class _PersonalInfoFormScreenState extends State<PersonalInfoFormScreen> {
         return CardColorVertical.pink.path;
       case CardColorHorizontal.red:
         return CardColorVertical.red.path;
+      case CardColorHorizontal.aqua:
+        return CardColorVertical.aqua.path;
     }
   }
 }

frontend/lib/widgets/presentation_form_screen.dart

@@ -642,6 +642,8 @@ class _PresentationFormScreenState extends State<PresentationFormScreen> {
         return CardColorVertical.pink.path;
       case CardColorHorizontal.red:
         return CardColorVertical.red.path;
+      case CardColorHorizontal.aqua:
+        return CardColorVertical.aqua.path;
     }
   }
 }

frontend/lib/widgets/professional_info_form_screen.dart

@@ -1196,6 +1196,8 @@ class _ProfessionalInfoFormScreenState extends State<ProfessionalInfoFormScreen>
         return CardColorVertical.pink.path;
       case CardColorHorizontal.red:
         return CardColorVertical.red.path;
+      case CardColorHorizontal.aqua:
+        return CardColorVertical.aqua.path;
     }
   }
 }

frontend/lib/widgets/quotidien/carte.dart

@@ -0,0 +1,251 @@
+import 'dart:ui' as ui;
+
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+
+/// Mode d’extension du fond pastel.
+enum CarteStretch {
+  /// 9 zones (bulles / cartes content).
+  both,
+
+  /// Uniquement horizontal — bouts en demi-cercle (bandeau couple).
+  horizontal,
+}
+
+/// Fond pastel extensible (capacité par défaut des « cartes » UI).
+///
+/// Coins / bouts à taille logique fixe ; le reste s’étire selon [stretch].
+class Carte extends StatefulWidget {
+  final String assetPath;
+  final CarteStretch stretch;
+  final Rect centerSlice;
+  final double cornerWidth;
+  final double cornerHeight;
+  final Widget? child;
+  final EdgeInsetsGeometry? padding;
+  final BoxConstraints? constraints;
+  final double? width;
+  final double? height;
+
+  /// Carte / bulle content (`card_*_h.png`, ~1024×512).
+  const Carte({
+    super.key,
+    required this.assetPath,
+    this.child,
+    this.padding,
+    this.constraints,
+    this.width,
+    this.height,
+    this.stretch = CarteStretch.both,
+    this.centerSlice = const Rect.fromLTRB(160, 90, 864, 422),
+    this.cornerWidth = 56,
+    this.cornerHeight = 40,
+  });
+
+  /// Bandeau couple enfant / nounou (`bandeau_*.png`, ~1024×160).
+  /// Étirement horizontal seul pour garder les bouts ronds.
+  const Carte.bandeau({
+    super.key,
+    required this.assetPath,
+    this.child,
+    this.padding,
+    this.constraints,
+    this.width,
+    this.height,
+  })  : stretch = CarteStretch.horizontal,
+        // Demi-cercle source ≈ moitié de la hauteur (160/2 = 80).
+        centerSlice = const Rect.fromLTRB(80, 0, 944, 160),
+        cornerWidth = 45,
+        cornerHeight = 45;
+
+  @override
+  State<Carte> createState() => _CarteState();
+}
+
+class _CarteImageCache {
+  static final Map<String, Future<ui.Image>> _futures = {};
+
+  static Future<ui.Image> load(String path) {
+    return _futures.putIfAbsent(path, () async {
+      final data = await rootBundle.load(path);
+      final codec = await ui.instantiateImageCodec(
+        data.buffer.asUint8List(),
+      );
+      final frame = await codec.getNextFrame();
+      return frame.image;
+    });
+  }
+}
+
+class _CarteState extends State<Carte> {
+  ui.Image? _image;
+  String? _loadedPath;
+
+  @override
+  void initState() {
+    super.initState();
+    _load();
+  }
+
+  @override
+  void didUpdateWidget(covariant Carte oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (oldWidget.assetPath != widget.assetPath) {
+      _load();
+    }
+  }
+
+  Future<void> _load() async {
+    final path = widget.assetPath;
+    final image = await _CarteImageCache.load(path);
+    if (!mounted) return;
+    setState(() {
+      _image = image;
+      _loadedPath = path;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final img = _image;
+    final ready = img != null && _loadedPath == widget.assetPath;
+
+    return SizedBox(
+      width: widget.width,
+      height: widget.height,
+      child: Container(
+        constraints: widget.constraints,
+        child: CustomPaint(
+          painter: ready
+              ? _CartePainter(
+                  image: img!,
+                  stretch: widget.stretch,
+                  centerSlice: widget.centerSlice,
+                  cornerWidth: widget.cornerWidth,
+                  cornerHeight: widget.cornerHeight,
+                )
+              : null,
+          child: Padding(
+            padding: widget.padding ?? EdgeInsets.zero,
+            child: widget.child,
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+class _CartePainter extends CustomPainter {
+  final ui.Image image;
+  final CarteStretch stretch;
+  final Rect centerSlice;
+  final double cornerWidth;
+  final double cornerHeight;
+
+  _CartePainter({
+    required this.image,
+    required this.stretch,
+    required this.centerSlice,
+    required this.cornerWidth,
+    required this.cornerHeight,
+  });
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    if (size.width <= 0 || size.height <= 0) return;
+
+    final paint = Paint()..filterQuality = FilterQuality.high;
+    final srcW = image.width.toDouble();
+    final srcH = image.height.toDouble();
+
+    void draw(Rect src, Rect dst) {
+      if (src.width <= 0 || src.height <= 0) return;
+      if (dst.width <= 0 || dst.height <= 0) return;
+      canvas.drawImageRect(image, src, dst, paint);
+    }
+
+    if (stretch == CarteStretch.horizontal) {
+      // 3 bandes pleine hauteur : bout | milieu | bout (pilule).
+      // Largeur du bout = moitié de la hauteur → demi-cercle propre.
+      final tip = (size.height / 2).clamp(1.0, size.width / 2);
+      final srcTip = centerSlice.left.clamp(1.0, srcW / 2);
+      final midW = (size.width - tip * 2).clamp(0.0, size.width);
+
+      draw(
+        Rect.fromLTWH(0, 0, srcTip, srcH),
+        Rect.fromLTWH(0, 0, tip, size.height),
+      );
+      draw(
+        Rect.fromLTWH(srcTip, 0, (srcW - srcTip * 2).clamp(1.0, srcW), srcH),
+        Rect.fromLTWH(tip, 0, midW, size.height),
+      );
+      draw(
+        Rect.fromLTWH(srcW - srcTip, 0, srcTip, srcH),
+        Rect.fromLTWH(tip + midW, 0, tip, size.height),
+      );
+      return;
+    }
+
+    // 9 zones (bulles).
+    final srcLeft = centerSlice.left.clamp(0.0, srcW);
+    final srcTop = centerSlice.top.clamp(0.0, srcH);
+    final srcRight = centerSlice.right.clamp(0.0, srcW);
+    final srcBottom = centerSlice.bottom.clamp(0.0, srcH);
+
+    final srcLeftW = srcLeft;
+    final srcTopH = srcTop;
+    final srcRightW = srcW - srcRight;
+    final srcBottomH = srcH - srcBottom;
+    final srcCenterW = (srcRight - srcLeft).clamp(1.0, srcW);
+    final srcCenterH = (srcBottom - srcTop).clamp(1.0, srcH);
+
+    final dstLeftW = cornerWidth.clamp(1.0, size.width / 2);
+    final dstRightW = cornerWidth.clamp(1.0, size.width / 2);
+    final dstTopH = cornerHeight.clamp(1.0, size.height / 2);
+    final dstBottomH = cornerHeight.clamp(1.0, size.height / 2);
+    final dstCenterW =
+        (size.width - dstLeftW - dstRightW).clamp(0.0, size.width);
+    final dstCenterH =
+        (size.height - dstTopH - dstBottomH).clamp(0.0, size.height);
+
+    // Haut
+    draw(Rect.fromLTWH(0, 0, srcLeftW, srcTopH),
+        Rect.fromLTWH(0, 0, dstLeftW, dstTopH));
+    draw(Rect.fromLTWH(srcLeft, 0, srcCenterW, srcTopH),
+        Rect.fromLTWH(dstLeftW, 0, dstCenterW, dstTopH));
+    draw(Rect.fromLTWH(srcRight, 0, srcRightW, srcTopH),
+        Rect.fromLTWH(dstLeftW + dstCenterW, 0, dstRightW, dstTopH));
+
+    // Milieu
+    draw(Rect.fromLTWH(0, srcTop, srcLeftW, srcCenterH),
+        Rect.fromLTWH(0, dstTopH, dstLeftW, dstCenterH));
+    draw(Rect.fromLTWH(srcLeft, srcTop, srcCenterW, srcCenterH),
+        Rect.fromLTWH(dstLeftW, dstTopH, dstCenterW, dstCenterH));
+    draw(Rect.fromLTWH(srcRight, srcTop, srcRightW, srcCenterH),
+        Rect.fromLTWH(dstLeftW + dstCenterW, dstTopH, dstRightW, dstCenterH));
+
+    // Bas
+    draw(Rect.fromLTWH(0, srcBottom, srcLeftW, srcBottomH),
+        Rect.fromLTWH(0, dstTopH + dstCenterH, dstLeftW, dstBottomH));
+    draw(Rect.fromLTWH(srcLeft, srcBottom, srcCenterW, srcBottomH),
+        Rect.fromLTWH(dstLeftW, dstTopH + dstCenterH, dstCenterW, dstBottomH));
+    draw(
+      Rect.fromLTWH(srcRight, srcBottom, srcRightW, srcBottomH),
+      Rect.fromLTWH(
+        dstLeftW + dstCenterW,
+        dstTopH + dstCenterH,
+        dstRightW,
+        dstBottomH,
+      ),
+    );
+  }
+
+  @override
+  bool shouldRepaint(covariant _CartePainter oldDelegate) {
+    return oldDelegate.image != image ||
+        oldDelegate.stretch != stretch ||
+        oldDelegate.centerSlice != centerSlice ||
+        oldDelegate.cornerWidth != cornerWidth ||
+        oldDelegate.cornerHeight != cornerHeight;
+  }
+}

frontend/lib/widgets/quotidien/couple_selector_bandeau.dart

@@ -3,6 +3,7 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:p_tits_pas/models/couple_garde.dart';
 import 'package:p_tits_pas/services/api/api_config.dart';
 import 'package:p_tits_pas/widgets/common/auth_network_image.dart';
+import 'package:p_tits_pas/widgets/quotidien/carte.dart';
 import 'package:p_tits_pas/widgets/quotidien/quotidien_theme.dart';
 
 /// Rôle qui consulte le bandeau : côté parent (enfant | nounou) ou côté AM
@@ -174,14 +175,10 @@ class _CoupleCard extends StatelessWidget {
       );
     }
 
-    return Container(
+    return Carte.bandeau(
+      assetPath: QuotidienTheme
+          .bandeauColors[colorIndex % QuotidienTheme.bandeauColors.length],
       height: 90,
-      decoration: BoxDecoration(
-        image: DecorationImage(
-          image: AssetImage(QuotidienTheme.bandeauColors[colorIndex % QuotidienTheme.bandeauColors.length]), 
-          fit: BoxFit.fill,
-        ),
-      ),
       padding: const EdgeInsets.symmetric(horizontal: 24),
       child: Row(
         children: [
@@ -190,7 +187,8 @@ class _CoupleCard extends StatelessWidget {
               padding: const EdgeInsets.only(right: 12),
               child: _MembreTile(
                 photoUrl: couple.enfant.photoUrl,
-                name: (couple.enfant.prenom != null && couple.enfant.prenom!.isNotEmpty)
+                name: (couple.enfant.prenom != null &&
+                        couple.enfant.prenom!.isNotEmpty)
                     ? couple.enfant.prenom!
                     : couple.enfant.displayName(fallback: 'Enfant'),
                 fallbackIcon: Icons.child_care,
@@ -216,11 +214,11 @@ class _CoupleCard extends StatelessWidget {
           SizedBox(
             width: 28,
             child: showChevron
-              ? const Icon(
+                ? const Icon(
-                  Icons.keyboard_arrow_down,
+                    Icons.keyboard_arrow_down,
-                  color: QuotidienTheme.ink,
+                    color: QuotidienTheme.ink,
-                )
+                  )
-              : null,
+                : null,
           ),
         ],
       ),
@@ -306,24 +304,22 @@ class _CoupleBandeauSkeleton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return ColorFiltered(
-      height: 90,
+      colorFilter: ColorFilter.mode(
-      decoration: BoxDecoration(
+        Colors.white.withValues(alpha: 0.5),
-        image: DecorationImage(
+        BlendMode.lighten,
-          image: const AssetImage(QuotidienTheme.bandeauLime), // Un asset existant
+      ),
-          fit: BoxFit.fill,
+      child: Carte.bandeau(
-          colorFilter: ColorFilter.mode(
+        assetPath: QuotidienTheme.bandeauLime,
-            Colors.white.withValues(alpha: 0.5),
+        height: 90,
-            BlendMode.lighten,
+        child: const Center(
+          child: SizedBox(
+            width: 26,
+            height: 26,
+            child: CircularProgressIndicator(strokeWidth: 2),
           ),
         ),
       ),
-      alignment: Alignment.center,
-      child: const SizedBox(
-        width: 26,
-        height: 26,
-        child: CircularProgressIndicator(strokeWidth: 2),
-      ),
     );
   }
 }
@@ -333,14 +329,9 @@ class _CoupleBandeauEmpty extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return Carte.bandeau(
+      assetPath: QuotidienTheme.bandeauLime,
       height: 90,
-      decoration: const BoxDecoration(
-        image: DecorationImage(
-          image: AssetImage(QuotidienTheme.bandeauLime), // Un asset existant par défaut
-          fit: BoxFit.fill,
-        ),
-      ),
       padding: const EdgeInsets.symmetric(horizontal: 24),
       child: Row(
         children: [
@@ -369,38 +360,35 @@ class _CoupleBandeauError extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return ColorFiltered(
-      height: 90,
+      colorFilter: ColorFilter.mode(
-      decoration: BoxDecoration(
+        QuotidienTheme.coral.withValues(alpha: 0.3),
-        image: DecorationImage(
+        BlendMode.srcATop,
-          image: const AssetImage(QuotidienTheme.bandeauLime), // Un asset existant
-          fit: BoxFit.fill,
-          colorFilter: ColorFilter.mode(
-            QuotidienTheme.coral.withValues(alpha: 0.3),
-            BlendMode.srcATop,
-          ),
-        ),
       ),
-      padding: const EdgeInsets.symmetric(horizontal: 24),
+      child: Carte.bandeau(
-      child: Row(
+        assetPath: QuotidienTheme.bandeauLime,
-        children: [
+        height: 90,
-          const Icon(Icons.error_outline, color: QuotidienTheme.ink),
+        padding: const EdgeInsets.symmetric(horizontal: 24),
-          const SizedBox(width: 12),
+        child: Row(
-          Expanded(
+          children: [
-            child: Text(
+            const Icon(Icons.error_outline, color: QuotidienTheme.ink),
-              message,
+            const SizedBox(width: 12),
-              style: GoogleFonts.merriweather(
+            Expanded(
-                fontSize: 13,
+              child: Text(
-                color: QuotidienTheme.ink,
+                message,
+                style: GoogleFonts.merriweather(
+                  fontSize: 13,
+                  color: QuotidienTheme.ink,
+                ),
               ),
             ),
-          ),
+            if (onRetry != null)
-          if (onRetry != null)
+              TextButton(
-            TextButton(
+                onPressed: onRetry,
-              onPressed: onRetry,
+                child: const Text('Réessayer'),
-              child: const Text('Réessayer'),
+              ),
-            ),
+          ],
-        ],
+        ),
       ),
     );
   }

frontend/lib/widgets/quotidien/quotidien_theme.dart

@@ -49,6 +49,7 @@ abstract final class QuotidienTheme {
       'assets/images/bg_turquoise_pill.png';
   static const String pillLavenderAsset =
       'assets/images/bg_lavender_pill.png';
+  static const String pillCorailAsset = 'assets/images/bg_corail_pill.png';
 
   /// Trait crayon gris (2400×28, transparent) : séparateurs bandeau / corps /
   /// footer. Version verticale (28×2400) entre les colonnes.

frontend/pubspec.yaml

@@ -50,8 +50,9 @@ flutter:
   uses-material-design: true
   
   assets:
-    - assets/images/ # Déclarer le dossier entier
+    - assets/images/
-    - assets/cards/ # Nouveau dossier de cartes
+    - assets/images/cartes/
+    - assets/cards/
     - assets/documents/
     
   fonts: