feat(gherkin): ajouter features UI/Admin pour modération complète

Création de 6 nouvelles features Gherkin + documentation :

Features UI mobile (Flutter) :
- signalement-ui.feature : interface signalement avec 7 catégories
- historique-signalements.feature : suivi personnel des signalements
- badges-statistiques.feature : gamification Bronze/Argent/Or
- sanctions-appel.feature : notifications et processus d'appel

Features Admin dashboard (React) :
- dashboard-moderateur.feature : files d'attente et SLA temps réel
- outils-moderateur.feature : player Wavesurfer.js, transcription, historique créateur

Documentation :
- gherkin-moderation-overview.md : mapping complet règles métier, stats, coûts

Couverture :
- 190 scénarios couvrant 100% sections 14 (moderation-flows) et 19 (badges)
- Conformité DSA/RGPD/WCAG testée
- Stack : Go/Flutter/React avec Godog/flutter_gherkin/Cucumber.js

features/ui/moderation/badges-statistiques.feature

@@ -0,0 +1,391 @@
+# language: fr
+
+@ui @moderation @badges @gamification
+Fonctionnalité: Badges et statistiques de modération communautaire (Mobile)
+  En tant qu'utilisateur contributeur
+  Je veux voir mes badges et statistiques de modération
+  Afin d'être motivé à continuer à signaler du contenu pertinent
+
+  # 19.1.4 - Affichage badges et statistiques
+
+  Contexte:
+    Étant donné que je suis connecté à l'application mobile
+    Et que j'ai envoyé des signalements
+
+  # Affichage des statistiques personnelles
+
+  Scénario: Accéder aux statistiques de modération
+    Étant donné que je suis dans mon profil
+    Quand je clique sur "Mes signalements"
+    Alors je vois en haut de page une carte "📊 Vos statistiques de modération"
+    Et la carte affiche:
+      | élément                    | valeur                  | couleur     |
+      | Signalements envoyés       | 27                      | Bleu        |
+      | Validés                    | 23 ✅                   | Vert        |
+      | Rejetés                    | 4 ❌                    | Rouge       |
+      | Taux de pertinence         | 85%                     | Vert/Orange |
+      | Badge actuel               | 🥈 Contributeur Argent  | Argent      |
+      | Prochain palier            | 🥇 Contributeur Or      | Or          |
+      | Progression vers prochain  | 27 signalements restants| Bleu        |
+    Et les données sont mises à jour en temps réel
+
+  Scénario: Design de la carte statistiques
+    Étant donné que j'affiche mes statistiques
+    Quand je vérifie le design
+    Alors la carte a un fond dégradé subtil (blanc → gris clair)
+    Et les icônes sont colorées et expressives
+    Et les nombres sont en gras et mis en évidence
+    Et le taux de pertinence a une jauge visuelle (progress bar)
+    Et l'ensemble est visuellement attrayant et motivant
+
+  Plan du Scénario: Couleur du taux de pertinence selon performance
+    Étant donné que mon taux de pertinence est de <taux>%
+    Quand j'affiche mes statistiques
+    Alors la jauge de pertinence est de couleur "<couleur>"
+    Et le message associé est "<message>"
+
+    Exemples:
+      | taux | couleur      | message                           |
+      | 95   | Vert         | Excellent !                       |
+      | 82   | Vert clair   | Très bon                          |
+      | 72   | Orange       | Bon, continuez vos efforts        |
+      | 55   | Rouge        | Améliorez la qualité de vos signalements |
+
+  # Affichage du badge actuel
+
+  Scénario: Badge Bronze visible
+    Étant donné que j'ai le badge 🥉 Contributeur Bronze
+    Quand j'affiche mon profil public
+    Alors le badge 🥉 s'affiche à côté de mon pseudo
+    Et un tooltip s'affiche au survol/appui long:
+      """
+      🥉 Contributeur Bronze
+      Signale du contenu inapproprié pour améliorer la communauté
+      """
+    Et le badge est discret mais visible
+
+  Scénario: Badge Argent visible avec priorité
+    Étant donné que j'ai le badge 🥈 Contributeur Argent
+    Quand j'affiche mon profil
+    Alors le badge 🥈 s'affiche de manière plus proéminente
+    Et le badge est affiché avec une animation subtile (brille légèrement)
+    Et le tooltip indique:
+      """
+      🥈 Contributeur Argent
+      Utilisateur de confiance - Signalements traités en priorité
+      """
+    Et le badge inspire confiance aux autres utilisateurs
+
+  Scénario: Badge Or visible avec effet premium
+    Étant donné que j'ai le badge 🥇 Contributeur Or
+    Quand j'affiche mon profil
+    Alors le badge 🥇 s'affiche avec un effet brillant/doré
+    Et une animation subtile attire l'attention
+    Et le tooltip indique:
+      """
+      🥇 Contributeur Or
+      Top contributeur - Aide précieuse à la communauté
+      """
+    Et le badge est prestigieux et reconnu
+
+  # Toast après validation/rejet de signalement
+
+  Scénario: Toast après validation avec progression vers badge
+    Étant donné que j'ai 3 signalements validés sur 5 pour le badge Bronze
+    Et que j'envoie un nouveau signalement
+    Quand le modérateur valide mon signalement
+    Alors je reçois un toast:
+      """
+      ✅ Bravo ! Votre signalement a aidé la communauté.
+      Progression : 4/5 pour badge Bronze 🥉
+      """
+    Et une mini progress bar s'affiche dans le toast (80%)
+    Et le toast s'affiche pendant 6 secondes
+    Et je me sens motivé à continuer
+
+  Scénario: Toast célébration obtention badge Bronze
+    Étant donné que j'ai 4 signalements validés
+    Quand mon 5ème signalement est validé
+    Alors je reçois un toast spécial avec animation:
+      """
+      🎉 Félicitations !
+      Vous êtes désormais Contributeur Bronze 🥉
+      Merci de rendre RoadWave meilleur !
+      """
+    Et le toast a une animation de confettis
+    Et un son de célébration est joué (vibration haptique)
+    Et le toast reste affiché 8 secondes
+    Et je peux cliquer pour voir mes nouveaux avantages
+
+  Scénario: Toast célébration obtention badge Argent
+    Étant donné que j'obtiens le badge 🥈 Contributeur Argent
+    Quand la notification est affichée
+    Alors je reçois un toast premium:
+      """
+      🎉 Impressionnant !
+      Badge Contributeur Argent obtenu 🥈
+      Votre engagement fait la différence !
+      """
+    Et l'animation est plus spectaculaire (confettis argentés)
+    Et un son de réussite est joué
+    Et le badge est ajouté à mon profil instantanément
+
+  Scénario: Toast célébration obtention badge Or avec offre Premium
+    Étant donné que j'obtiens le badge 🥇 Contributeur Or
+    Quand la notification est affichée
+    Alors je reçois un toast VIP:
+      """
+      🎉 Exceptionnel !
+      Badge Contributeur Or obtenu 🥇
+      + Offre Premium -50% pendant 3 mois !
+
+      [Voir l'offre]
+      """
+    Et l'animation est spectaculaire (confettis dorés)
+    Et un son de victoire est joué
+    Et le toast reste affiché 10 secondes
+    Et je peux cliquer pour accéder à l'offre Premium
+
+  Scénario: Toast après rejet avec encouragement
+    Étant donné que mon taux de pertinence est de 65%
+    Quand un signalement est rejeté
+    Alors je reçois un toast constructif:
+      """
+      ❌ Signalement non retenu.
+      Taux de pertinence : 60%
+      Continuez vos efforts !
+      """
+    Et le ton est encourageant, pas décourageant
+    Et un lien "Améliorer mes signalements" est affiché
+    Et je peux consulter les bonnes pratiques
+
+  # Progression visuelle vers le prochain badge
+
+  Scénario: Barre de progression vers badge Argent
+    Étant donné que j'ai le badge Bronze
+    Et que j'ai 12 signalements validés (sur 20 requis pour Argent)
+    Quand j'affiche mes statistiques
+    Alors je vois une barre de progression:
+      """
+      Prochain palier : 🥈 Contributeur Argent
+      [████████░░░░░░░░] 60% (12/20)
+      8 signalements validés restants
+      """
+    Et la barre est animée progressivement
+    Et je vois clairement combien il me reste à faire
+
+  Scénario: Progression avec délai minimum
+    Étant donné que j'ai obtenu le badge Bronze il y a 15 jours
+    Et que j'ai déjà 20 signalements validés
+    Quand j'affiche ma progression vers Argent
+    Alors je vois un message:
+      """
+      ✓ Critères atteints (20 signalements validés)
+      ⏰ Délai minimum : encore 15 jours
+
+      Les badges nécessitent une contribution régulière sur la durée.
+      """
+    Et je comprends que le délai minimum est anti-farming
+
+  # Page dédiée "En savoir plus" sur les badges
+
+  Scénario: Accéder à la page d'explication des badges
+    Étant donné que je vois mes statistiques
+    Quand je clique sur "En savoir plus" sur les badges
+    Alors une page dédiée s'affiche avec:
+      | section                          | contenu                                      |
+      | Introduction                     | Pourquoi nous récompensons les contributeurs |
+      | Les 3 badges                     | Bronze, Argent, Or avec critères détaillés   |
+      | Calcul taux de pertinence        | Formule et exemples                          |
+      | Avantages de chaque badge        | Priorisation, visibilité, réduction Premium  |
+      | Délais entre badges              | 30j Bronze→Argent, 60j Argent→Or             |
+      | Règles anti-abus                 | Limite 10/24h, audit trimestriel             |
+      | FAQ                              | Questions fréquentes                         |
+    Et la page est bien structurée et facile à lire
+
+  Scénario: Design de la page badges
+    Étant donné que j'affiche la page "En savoir plus"
+    Quand je vérifie le design
+    Alors chaque badge a une illustration attrayante
+    Et les critères sont affichés en tableaux clairs
+    Et des exemples concrets sont fournis
+    Et le ton est motivant et positif
+    Et je peux facilement comprendre le système
+
+  # Affichage sur profil public
+
+  Scénario: Badge visible sur mon profil public
+    Étant donné que j'ai le badge 🥈 Contributeur Argent
+    Quand un autre utilisateur consulte mon profil
+    Alors il voit le badge 🥈 à côté de mon pseudo
+    Et il peut cliquer sur le badge pour voir la description
+    Et cela renforce ma crédibilité
+    Et les autres utilisateurs me font davantage confiance
+
+  Scénario: Badge visible sur mes commentaires/interactions
+    Étant donné que j'ai le badge 🥇 Contributeur Or
+    Quand je laisse un commentaire sur un contenu
+    Alors le badge 🥇 s'affiche à côté de mon pseudo
+    Et cela montre que je suis un membre actif de la communauté
+    Et mes interactions ont plus de poids
+
+  # Notification email pour badges
+
+  Scénario: Email de félicitations pour badge Bronze
+    Étant donné que j'obtiens le badge 🥉 Contributeur Bronze
+    Quand le badge est attribué
+    Alors je reçois un email de félicitations:
+      """
+      Objet: 🎉 Vous êtes maintenant Contributeur Bronze !
+
+      Bravo [Pseudo] !
+
+      Vous avez obtenu le badge Contributeur Bronze grâce à
+      vos 5 signalements validés et votre taux de pertinence de 72%.
+
+      Vos avantages:
+      - Signalements traités en priorité (+10 points)
+      - Badge visible sur votre profil
+
+      Continuez à nous aider à maintenir une communauté saine ! 🙏
+
+      L'équipe RoadWave
+      """
+    Et l'email contient un lien vers mes statistiques
+
+  Scénario: Email de félicitations pour badge Or avec offre Premium
+    Étant donné que j'obtiens le badge 🥇 Contributeur Or
+    Quand le badge est attribué
+    Alors je reçois un email VIP:
+      """
+      Objet: 🎉 Badge Or obtenu ! Offre Premium -50% offerte
+
+      Exceptionnel [Pseudo] !
+
+      Vous faites partie des meilleurs contributeurs de RoadWave.
+      Grâce à vos 50 signalements validés (90% pertinence), vous
+      aidez des milliers d'utilisateurs.
+
+      🎁 En reconnaissance, vous bénéficiez de:
+      ✨ 3 mois d'abonnement Premium à -50%
+      → 2.49€/mois au lieu de 4.99€
+
+      [Profiter de l'offre]
+
+      Cette offre est valable pendant 30 jours.
+
+      Merci de contribuer à rendre RoadWave meilleur ! 🏆
+
+      L'équipe RoadWave
+      """
+    Et l'email contient un CTA mis en évidence
+
+  # Rappels expiration offre Premium
+
+  Scénario: Rappel J-7 expiration offre Premium
+    Étant donné que j'ai obtenu le badge Or il y a 23 jours
+    Et que je n'ai pas activé l'offre Premium -50%
+    Quand le système envoie les rappels
+    Alors je reçois un email + push:
+      """
+      ⏰ Il vous reste 7 jours !
+
+      Votre offre Premium -50% expire bientôt.
+      Profitez de 3 mois à 2.49€/mois au lieu de 4.99€.
+
+      [Activer maintenant]
+      """
+    Et le CTA est mis en évidence en orange
+
+  Scénario: Rappel J-1 expiration offre Premium
+    Étant donné que j'ai obtenu le badge Or il y a 29 jours
+    Et que je n'ai pas activé l'offre
+    Quand le dernier rappel est envoyé
+    Alors je reçois un email + push urgent:
+      """
+      ⚠️ Dernière chance !
+
+      Votre offre Premium -50% expire DEMAIN.
+      Ne manquez pas cette opportunité !
+
+      [Activer avant expiration]
+      """
+    Et le CTA est en rouge pour l'urgence
+
+  # Affichage après expiration offre
+
+  Scénario: Message d'expiration de l'offre Premium
+    Étant donné que l'offre Premium a expiré (31 jours)
+    Quand j'accède à mes statistiques
+    Alors je vois un message:
+      """
+      Votre offre Premium -50% a expiré.
+      Votre badge Or est conservé.
+      """
+    Et le message est informatif, sans regret excessif
+
+  # Animation et gamification
+
+  Scénario: Animation lors de la montée de niveau
+    Étant donné que je passe de Bronze à Argent
+    Quand le changement est effectué
+    Alors une animation "level up" s'affiche à l'écran
+    Et mon nouveau badge apparaît avec un effet de brillance
+    Et un son de réussite est joué
+    Et l'UX est gratifiante et mémorable
+
+  Scénario: Confettis pour badge Or
+    Étant donné que j'obtiens le badge Or
+    Quand la notification s'affiche
+    Alors des confettis dorés tombent sur l'écran
+    Et l'animation dure 3 secondes
+    Et le badge Or apparaît avec un effet "shine"
+    Et je me sens valorisé et reconnu
+
+  # Dark mode et accessibilité
+
+  Scénario: Support du dark mode pour les badges
+    Étant donné que j'ai activé le dark mode
+    Quand j'affiche mes statistiques et badges
+    Alors les couleurs s'adaptent:
+      | élément                 | couleur light    | couleur dark      |
+      | Badge Bronze            | #CD7F32          | #D4A574           |
+      | Badge Argent            | #C0C0C0          | #E8E8E8           |
+      | Badge Or                | #FFD700          | #FFC700           |
+      | Fond carte stats        | Blanc            | Gris foncé        |
+      | Jauge pertinence verte  | #28A745          | #34D058           |
+      | Jauge pertinence orange | #FF8C00          | #FFA500           |
+    Et le contraste reste optimal
+
+  Scénario: Accessibilité lecteur d'écran pour badges
+    Étant donné que j'utilise un lecteur d'écran
+    Quand je navigue dans mes statistiques
+    Alors le lecteur annonce clairement:
+      """
+      Vos statistiques de modération.
+      Signalements envoyés: 27.
+      Validés: 23.
+      Rejetés: 4.
+      Taux de pertinence: 85%.
+      Badge actuel: Contributeur Argent.
+      Prochain palier: Contributeur Or, 27 signalements validés restants.
+      """
+    Et tous les éléments visuels ont des équivalents textuels
+
+  # Coût et performance
+
+  Scénario: Performance de l'affichage des statistiques
+    Étant donné que j'affiche mes statistiques
+    Quand je mesure les performances
+    Alors les données se chargent en <300ms
+    Et les animations sont fluides (60 FPS)
+    Et la mémoire utilisée est <50 MB
+    Et l'UX est instantanée
+
+  Scénario: Coût de la fonctionnalité
+    Étant donné que le système de badges est en place
+    Quand on évalue le coût
+    Alors le développement est 100% interne (Flutter)
+    Et les calculs sont effectués côté backend (0€ côté app)
+    Et les notifications sont gratuites (Firebase)
+    Et le coût opérationnel est de 0€ (MVP)

features/ui/moderation/historique-signalements.feature

@@ -0,0 +1,304 @@
+# language: fr
+
+@ui @moderation @historique
+Fonctionnalité: Historique des signalements utilisateur (Mobile)
+  En tant qu'utilisateur
+  Je veux consulter l'historique de mes signalements
+  Afin de suivre leur traitement et comprendre les décisions prises
+
+  # 14.1.3 - Historique personnel des signalements
+
+  Contexte:
+    Étant donné que je suis connecté à l'application mobile
+    Et que j'ai envoyé des signalements précédemment
+
+  # Accès à l'historique
+
+  Scénario: Accéder à l'historique depuis le profil
+    Étant donné que je suis dans mon profil utilisateur
+    Quand je scroll vers le bas
+    Alors je vois une section "📊 Modération"
+    Et je vois l'option "Mes signalements"
+    Et je vois le nombre de signalements en badge: "(12)"
+    Et je peux cliquer pour accéder à l'historique
+
+  Scénario: Accéder à l'historique depuis le toast de confirmation
+    Étant donné que je viens d'envoyer un signalement
+    Et que le toast de confirmation est affiché
+    Quand je clique sur "Voir mes signalements"
+    Alors je suis redirigé vers la page "Mes signalements"
+    Et la page s'affiche en moins de 500ms
+    Et mon dernier signalement est en tête de liste
+
+  # Affichage de la liste des signalements
+
+  Scénario: Affichage de l'historique vide
+    Étant donné que je n'ai jamais envoyé de signalement
+    Quand j'ouvre "Mes signalements"
+    Alors je vois un message:
+      """
+      Aucun signalement pour le moment
+
+      Vous pouvez signaler un contenu inapproprié
+      depuis le menu de n'importe quel contenu.
+      """
+    Et je vois une illustration vide sympathique
+    Et un bouton "Découvrir les règles de la communauté"
+
+  Scénario: Liste des signalements avec informations clés
+    Étant donné que j'ai envoyé 5 signalements
+    Quand j'ouvre "Mes signalements"
+    Alors je vois une liste de 5 cartes de signalements
+    Et chaque carte affiche:
+      | information           | exemple                              | position       |
+      | Statut badge          | "En cours 🔍" (orange)               | Haut à droite  |
+      | Titre du contenu      | "Podcast #42"                        | Titre          |
+      | Créateur              | "@pseudo_createur"                   | Sous-titre     |
+      | Catégorie             | "🚫 Haine & violence"                | Ligne 1        |
+      | Date                  | "Il y a 2 jours" ou "15/01/2026"     | Ligne 2        |
+      | Mon commentaire       | "Propos discriminatoires à 2:30"     | Ligne 3 (si rempli) |
+    Et les cartes sont triées par date décroissante (plus récent en haut)
+
+  Plan du Scénario: Couleur du badge selon statut
+    Étant donné que j'ai un signalement avec le statut "<statut>"
+    Quand j'affiche l'historique
+    Alors le badge affiché est "<badge>"
+    Et la couleur du badge est "<couleur>"
+
+    Exemples:
+      | statut      | badge           | couleur      |
+      | En cours    | En cours 🔍     | Orange       |
+      | Traité      | Traité ✓        | Vert         |
+      | Rejeté      | Rejeté ✗        | Rouge        |
+
+  Scénario: Affichage de la date relative
+    Étant donné que j'ai envoyé des signalements à différentes dates
+    Quand j'affiche l'historique
+    Alors les dates récentes s'affichent en format relatif:
+      | date signalement        | affichage        |
+      | Il y a 5 minutes        | "À l'instant"    |
+      | Il y a 2 heures         | "Il y a 2h"      |
+      | Il y a 1 jour           | "Hier"           |
+      | Il y a 3 jours          | "Il y a 3j"      |
+      | Il y a 10 jours         | "15/01/2026"     |
+    Et les dates anciennes (>7 jours) sont en format absolu
+
+  # Détails d'un signalement
+
+  Scénario: Consulter les détails d'un signalement
+    Étant donné que j'ai envoyé un signalement il y a 3 jours
+    Quand je clique sur la carte du signalement
+    Alors une page de détails s'affiche
+    Et je vois toutes les informations:
+      | section              | contenu                                    |
+      | En-tête              | Titre du contenu + lien vers le contenu    |
+      | Créateur             | Pseudo + lien vers profil créateur         |
+      | Ma catégorie         | 🚫 Haine & violence                        |
+      | Mon commentaire      | "Propos discriminatoires à 2:30"           |
+      | Date d'envoi         | "Envoyé le 15/01/2026 à 14:32"             |
+      | Statut actuel        | "En cours 🔍 - En attente de traitement"   |
+      | Délai estimé         | "Traitement sous 24-48h"                   |
+    Et je vois un bouton "Retour à mes signalements"
+
+  Scénario: Lien vers le contenu signalé
+    Étant donné que je consulte les détails d'un signalement
+    Et que le contenu signalé est toujours en ligne
+    Quand je clique sur le titre du contenu
+    Alors je suis redirigé vers la page du contenu
+    Et je peux réécouter le contenu si besoin
+    Et un badge "Signalé par vous" s'affiche discrètement
+
+  Scénario: Contenu supprimé suite au signalement
+    Étant donné que le contenu que j'ai signalé a été supprimé
+    Quand je consulte les détails du signalement
+    Alors le titre du contenu est affiché en gris barré
+    Et un message s'affiche: "Ce contenu a été retiré de la plateforme"
+    Et je ne peux pas accéder au contenu
+    Et le statut est "Traité ✓"
+
+  # Notifications de changement de statut
+
+  Scénario: Notification quand un signalement est traité
+    Étant donné que j'ai signalé un contenu il y a 24h
+    Quand le modérateur traite mon signalement
+    Et que le contenu est retiré
+    Alors je reçois une notification push:
+      """
+      ✓ Votre signalement a été traité
+      Le contenu a été retiré de la plateforme.
+      """
+    Et je reçois une notification in-app identique
+    Et le statut dans mon historique passe à "Traité ✓"
+    Et un badge (1) apparaît sur l'onglet "Mes signalements"
+
+  Scénario: Notification quand un signalement est rejeté
+    Étant donné que j'ai signalé un contenu
+    Quand le modérateur rejette mon signalement
+    Alors je reçois une notification:
+      """
+      Votre signalement a été examiné
+      Le contenu ne viole pas les règles de la communauté.
+      """
+    Et le statut dans mon historique passe à "Rejeté ✗"
+    Et je peux voir la raison du rejet dans les détails
+
+  Scénario: Affichage de la raison du rejet
+    Étant donné que mon signalement a été rejeté
+    Quand je consulte les détails du signalement
+    Alors je vois une section "Raison du rejet":
+      """
+      Après examen, le contenu ne viole pas nos règles.
+      Le passage mentionné est dans un contexte éducatif.
+      """
+    Et la raison est claire et compréhensible
+    Et je peux apprendre pour améliorer mes futurs signalements
+
+  # Filtres et recherche
+
+  Scénario: Filtrer les signalements par statut
+    Étant donné que j'ai 20 signalements avec différents statuts
+    Quand j'ouvre l'historique
+    Alors je vois des onglets de filtres:
+      | onglet      | nombre |
+      | Tous (20)   | 20     |
+      | En cours (8)| 8      |
+      | Traités (9) | 9      |
+      | Rejetés (3) | 3      |
+    Et je peux cliquer sur un onglet pour filtrer
+    Et la liste se met à jour instantanément
+
+  Scénario: Rechercher dans mes signalements
+    Étant donné que j'ai 50 signalements
+    Quand j'ouvre la barre de recherche
+    Et que je tape "podcast"
+    Alors seuls les signalements contenant "podcast" s'affichent:
+      | recherche dans       |
+      | Titre du contenu     |
+      | Pseudo du créateur   |
+      | Mon commentaire      |
+    Et les résultats sont mis en évidence
+    Et la recherche est instantanée (pas de délai)
+
+  # Pull-to-refresh
+
+  Scénario: Actualiser la liste des signalements
+    Étant donné que je suis sur la page "Mes signalements"
+    Quand je tire vers le bas (pull-to-refresh)
+    Alors un spinner de chargement s'affiche
+    Et la liste est actualisée depuis le serveur
+    Et les nouveaux statuts sont affichés
+    Et un toast s'affiche: "✓ Mis à jour"
+
+  # Pagination et performance
+
+  Scénario: Chargement progressif des signalements (pagination)
+    Étant donné que j'ai 100 signalements
+    Quand j'ouvre "Mes signalements"
+    Alors seuls les 20 premiers signalements sont chargés
+    Et quand je scroll en bas de liste
+    Alors les 20 suivants sont chargés automatiquement
+    Et un loader discret s'affiche pendant le chargement
+    Et l'UX est fluide sans saccade
+
+  Scénario: Performance de la liste
+    Étant donné que j'ai 100 signalements
+    Quand j'ouvre l'historique
+    Alors le premier affichage prend <500ms
+    Et le scroll est fluide (60 FPS)
+    Et les images/avatars se chargent en lazy loading
+    Et la mémoire utilisée reste <100 MB
+
+  # État vide pour chaque filtre
+
+  Scénario: Aucun signalement "En cours"
+    Étant donné que tous mes signalements ont été traités
+    Quand je clique sur l'onglet "En cours"
+    Alors je vois un message:
+      """
+      Aucun signalement en cours
+
+      Tous vos signalements ont été traités.
+      """
+    Et je vois une illustration vide
+
+  Scénario: Aucun signalement "Rejeté"
+    Étant donné que tous mes signalements ont été acceptés
+    Quand je clique sur l'onglet "Rejetés"
+    Alors je vois un message:
+      """
+      Aucun signalement rejeté
+
+      Tous vos signalements étaient pertinents ! 🎉
+      """
+    Et je vois un message encourageant
+
+  # Dark mode et accessibilité
+
+  Scénario: Support du dark mode
+    Étant donné que j'ai activé le dark mode
+    Quand j'affiche "Mes signalements"
+    Alors les couleurs s'adaptent:
+      | élément                | couleur light    | couleur dark      |
+      | Fond page              | Blanc            | Noir (#121212)    |
+      | Cartes                 | Gris clair       | Gris foncé        |
+      | Texte principal        | Noir             | Blanc             |
+      | Badge "En cours"       | Orange (#FF8C00) | Orange (#FFA500)  |
+      | Badge "Traité"         | Vert (#28A745)   | Vert (#34D058)    |
+      | Badge "Rejeté"         | Rouge (#DC3545)  | Rouge (#F85149)   |
+    Et le contraste reste suffisant (WCAG AA)
+
+  Scénario: Accessibilité pour lecteur d'écran
+    Étant donné que j'utilise un lecteur d'écran
+    Quand je navigue dans l'historique
+    Alors chaque carte est annoncée clairement:
+      """
+      Signalement du contenu "Podcast #42" par @pseudo.
+      Catégorie: Haine et violence.
+      Statut: En cours d'examen.
+      Envoyé il y a 2 jours.
+      """
+    Et je peux naviguer au clavier entre les cartes
+    Et tous les boutons ont des labels descriptifs
+
+  # Gestion d'erreur
+
+  Scénario: Erreur réseau lors du chargement
+    Étant donné que je n'ai pas de connexion internet
+    Quand j'ouvre "Mes signalements"
+    Alors un message d'erreur s'affiche:
+      """
+      Impossible de charger vos signalements
+      Vérifiez votre connexion internet
+      """
+    Et un bouton "Réessayer" est affiché
+    Et je peux cliquer pour réessayer
+
+  Scénario: Cache local pour consultation hors ligne
+    Étant donné que j'ai consulté mes signalements hier
+    Et que je n'ai pas de connexion internet aujourd'hui
+    Quand j'ouvre "Mes signalements"
+    Alors les signalements en cache s'affichent
+    Et un message discret indique:
+      """
+      📡 Mode hors ligne - Données mises en cache
+      """
+    Et je peux consulter les détails
+    Mais les statuts peuvent ne pas être à jour
+
+  # Coût et conformité
+
+  Scénario: Coût de la fonctionnalité
+    Étant donné que l'historique des signalements est en place
+    Quand on évalue le coût
+    Alors le développement est 100% interne (Flutter)
+    Et aucun service tiers n'est utilisé
+    Et le coût opérationnel est de 0€
+    Et les notifications in-app sont gratuites
+
+  Scénario: Conformité RGPD
+    Étant donné que mes données de signalement sont stockées
+    Quand je supprime mon compte
+    Alors tous mes signalements sont anonymisés
+    Et mes commentaires personnels sont supprimés
+    Et seules les métadonnées nécessaires sont conservées (conformité DSA)
+    Et je suis informé de cette procédure

features/ui/moderation/sanctions-appel.feature

@@ -0,0 +1,410 @@
+# language: fr
+
+@ui @moderation @sanctions @appel
+Fonctionnalité: Interface sanctions et processus d'appel (Mobile)
+  En tant que créateur de contenu
+  Je veux consulter mes sanctions et faire appel si nécessaire
+  Afin de comprendre les décisions et contester si je pense qu'il y a erreur
+
+  # 14.3 - Interface sanctions et appel
+
+  Contexte:
+    Étant donné que je suis un créateur de contenu
+    Et que je suis connecté à l'application mobile
+
+  # Notifications multi-canal
+
+  Scénario: Notification push immédiate après sanction
+    Étant donné que mon contenu vient d'être modéré
+    Quand la sanction est appliquée
+    Alors je reçois une notification push immédiate:
+      """
+      ⚠️ Votre contenu a été modéré
+      Appuyez pour voir les détails
+      """
+    Et la notification est marquée comme importante (son + vibration)
+    Et je peux cliquer pour accéder aux détails
+    Et la notification reste visible jusqu'à ce que je la lise
+
+  Scénario: Popup in-app au prochain lancement
+    Étant donné que mon contenu a été modéré
+    Et que je n'ai pas encore consulté la sanction
+    Quand j'ouvre l'application
+    Alors une popup modale s'affiche automatiquement avant tout:
+      """
+      ⚠️ Attention
+
+      Votre contenu "Mon podcast #42" a été modéré.
+
+      Catégorie violée: 🚫 Haine & violence
+      Sanction: Strike 2/4 - Suspension 7 jours
+
+      [Voir les détails] [Plus tard]
+      """
+    Et la popup est prioritaire (affichée avant le contenu de l'app)
+    Et je ne peux pas la fermer sans l'avoir lue (pas de bouton X)
+    Et je dois cliquer sur un bouton pour continuer
+
+  Scénario: Design de la popup de sanction
+    Étant donné que la popup de sanction s'affiche
+    Quand je vérifie le design
+    Alors le fond est rouge clair (#FFEBEE) pour signaler la gravité
+    Et l'icône ⚠️ est proéminente
+    Et le texte est clair et concis
+    Et les boutons sont bien visibles:
+      | bouton          | style              | couleur |
+      | Voir les détails| Primaire (plein)   | Rouge   |
+      | Plus tard       | Secondaire (border)| Gris    |
+    Et le design est professionnel et sérieux
+
+  # Page détaillée de la sanction
+
+  Scénario: Affichage de la page détails sanction
+    Étant donné que je clique sur "Voir les détails"
+    Quand la page s'affiche
+    Alors je vois toutes les informations obligatoires:
+      | section                    | contenu exemple                             |
+      | En-tête avec icône         | ⚠️ Contenu modéré                           |
+      | Titre du contenu           | "Mon podcast #42"                           |
+      | Date de publication        | "Publié le 15/01/2026"                      |
+      | Catégorie violée           | 🚫 Haine & violence (Article 3.2 CGU)      |
+      | Raison détaillée           | "Propos discriminatoires envers un groupe"  |
+      | Passage problématique      | "3:42-4:15" (avec player audio)             |
+      | Transcription surlignée    | "[texte problématique en rouge]"            |
+      | Gravité de la sanction     | Strike 2/4 - Suspension 7 jours             |
+      | Conséquences futures       | "Strike 3: 30j / Strike 4: Ban définitif"   |
+      | Délai d'appel              | "7 jours pour faire appel"                  |
+      | Bouton Contester           | [Contester cette décision]                  |
+      | Lien CGU                   | [Voir les règles de la communauté]          |
+    Et toutes les sections sont clairement séparées
+
+  Scénario: Player audio du passage problématique
+    Étant donné que je consulte les détails de la sanction
+    Quand je vois la section "Passage problématique"
+    Alors un player audio s'affiche avec le timestamp "3:42-4:15"
+    Et je peux écouter uniquement cette portion de l'audio
+    Et les contrôles sont simples: Play/Pause + volume
+    Et la waveform visualise le passage
+    Et je peux comprendre exactement ce qui pose problème
+
+  Scénario: Transcription avec mise en évidence
+    Étant donné que je consulte la transcription du passage
+    Quand j'affiche la transcription
+    Alors les mots/phrases problématiques sont surlignés en rouge
+    Et le contexte autour est affiché en gris
+    Et je peux voir exactement quels mots ont posé problème:
+      """
+      [contexte gris]... et c'est pourquoi je pense que
+      [ROUGE: phrase discriminatoire problématique]
+      [contexte gris]... mais c'est mon opinion.
+      """
+    Et la mise en évidence est claire
+
+  Scénario: Lien vers l'article des CGU
+    Étant donné que la sanction référence "Article 3.2 CGU"
+    Quand je clique sur le lien
+    Alors je suis redirigé vers les CGU
+    Et la section "Article 3.2 - Haine & violence" est mise en évidence
+    Et je peux lire exactement ce qui est interdit
+    Et je comprends mieux ma violation
+
+  # Escalade des sanctions
+
+  Scénario: Affichage de l'escalade des strikes
+    Étant donné que j'ai reçu le Strike 2
+    Quand je consulte la section "Gravité"
+    Alors je vois clairement l'escalade:
+      """
+      Vous avez reçu le Strike 2/4
+
+      Historique:
+      ✓ Strike 1: Avertissement (il y a 3 mois)
+      ⚠️ Strike 2: Suspension 7 jours (aujourd'hui)
+
+      Prochaines étapes si récidive:
+      ⚠️ Strike 3: Suspension 30 jours
+      ❌ Strike 4: Ban définitif
+
+      Réhabilitation:
+      -1 strike tous les 6 mois sans incident
+      """
+    Et je comprends la progression des sanctions
+    Et je suis motivé à ne pas récidiver
+
+  Scénario: Compteur de suspension visible
+    Étant donné que je suis suspendu pour 7 jours
+    Quand j'ouvre l'application
+    Alors une bannière persistante s'affiche en haut:
+      """
+      ⏸️ Compte suspendu - 5 jours restants
+      """
+    Et la bannière est visible sur toutes les pages
+    Et je vois le décompte en temps réel
+    Et je ne peux pas publier de nouveau contenu
+
+  # Accès à l'historique des sanctions
+
+  Scénario: Consulter l'historique des sanctions
+    Étant donné que je suis dans mon profil créateur
+    Quand je clique sur "Mes sanctions"
+    Alors je vois la liste de toutes mes sanctions passées:
+      | colonne              | contenu exemple                  |
+      | Date                 | 15/01/2026                       |
+      | Contenu              | "Mon podcast #42"                |
+      | Catégorie            | 🚫 Haine & violence              |
+      | Sanction             | Strike 2 - Suspension 7j         |
+      | Statut               | Active / Terminée / Annulée      |
+      | Appel                | Aucun / En cours / Accepté / Rejeté |
+      | Action               | [Faire appel] / [Détails]        |
+    Et les sanctions sont triées par date décroissante
+
+  Scénario: Sanctions actives vs terminées
+    Étant donné que j'ai 3 sanctions dans mon historique
+    Quand j'affiche "Mes sanctions"
+    Alors les sanctions actives sont mises en évidence (fond rouge clair)
+    Et les sanctions terminées sont en gris
+    Et les sanctions annulées (après appel) sont en vert clair
+    Et je vois clairement l'état de chaque sanction
+
+  # Formulaire d'appel
+
+  Scénario: Accéder au formulaire d'appel depuis la notification
+    Étant donné que je consulte les détails d'une sanction
+    Et que le délai d'appel n'est pas dépassé (<7 jours)
+    Quand je clique sur "Contester cette décision"
+    Alors le formulaire d'appel s'affiche en plein écran
+    Et le formulaire est pré-rempli avec les informations de la sanction
+    Et je peux commencer à rédiger mon appel
+
+  Scénario: Structure du formulaire d'appel
+    Étant donné que le formulaire d'appel est affiché
+    Quand je vérifie les champs
+    Alors je vois la structure suivante:
+      | champ                  | type                    | limite          | obligatoire |
+      | Sanction contestée     | Texte (readonly)        | -               | oui         |
+      | Raison de l'appel      | Texte court             | 50-1000 car.    | oui         |
+      | Arguments détaillés    | Zone texte enrichie     | 1000-5000 car.  | oui         |
+      | Preuves                | Upload fichiers         | 5 max, 10MB tot.| non         |
+      | Bouton Annuler         | Secondaire              | -               | -           |
+      | Bouton Soumettre       | Primaire                | -               | -           |
+    Et tous les champs obligatoires sont marqués d'un astérisque rouge
+
+  Scénario: Validation du formulaire d'appel
+    Étant donné que je remplis le formulaire d'appel
+    Quand je clique sur "Soumettre l'appel"
+    Alors le système valide:
+      | règle                                  | message d'erreur si non respecté              |
+      | Raison >50 caractères                  | "La raison doit faire au moins 50 caractères" |
+      | Arguments >100 caractères              | "Développez vos arguments (min 100 car.)"     |
+      | Total fichiers <10 MB                  | "Taille totale des fichiers >10 MB"           |
+      | Formats fichiers acceptés (PDF, JPG)   | "Format de fichier non accepté"               |
+    Et si une erreur existe, le champ est surligné en rouge
+    Et je dois corriger avant de pouvoir soumettre
+
+  Scénario: Upload de preuves
+    Étant donné que je veux joindre des preuves
+    Quand je clique sur "Ajouter des preuves"
+    Alors je peux choisir depuis:
+      | source                  | types acceptés        |
+      | Galerie photos          | JPG, PNG              |
+      | Fichiers                | PDF                   |
+      | Caméra (nouveau)        | JPG                   |
+    Et je peux uploader jusqu'à 5 fichiers
+    Et la taille totale ne peut pas dépasser 10 MB
+    Et une progress bar s'affiche pendant l'upload
+
+  Scénario: Confirmation après soumission de l'appel
+    Étant donné que j'ai soumis un appel valide
+    Quand l'appel est enregistré
+    Alors une page de confirmation s'affiche:
+      """
+      ✓ Appel envoyé avec succès
+
+      Numéro de ticket: #MOD-2026-00142
+
+      Votre appel sera examiné par un modérateur senior
+      sous 72h maximum (3 jours ouvrés).
+
+      Vous serez notifié de la décision par:
+      - Notification push
+      - Email
+      - Notification in-app
+
+      [Retour à mes sanctions]
+      """
+    Et je reçois un email de confirmation identique
+    Et le statut dans "Mes sanctions" passe à "Appel en cours 🔍"
+
+  # Délai d'appel et compteur
+
+  Scénario: Compteur de jours restants pour faire appel
+    Étant donné que j'ai reçu une sanction il y a 3 jours
+    Quand je consulte les détails de la sanction
+    Alors je vois un compteur en haut de page:
+      """
+      ⏰ 4 jours restants pour faire appel
+      """
+    Et le compteur est en orange pour attirer l'attention
+    Et il se met à jour en temps réel (chaque jour)
+
+  Scénario: Délai d'appel dépassé
+    Étant donné que j'ai reçu une sanction il y a 8 jours
+    Quand je consulte les détails de la sanction
+    Alors le bouton "Contester cette décision" est désactivé (grisé)
+    Et un message s'affiche:
+      """
+      ⚠️ Le délai de 7 jours pour faire appel est dépassé.
+      Cette décision est désormais définitive.
+      """
+    Et je ne peux plus contester la sanction
+
+  # Suivi de l'appel
+
+  Scénario: Statut de l'appel dans l'historique
+    Étant donné que j'ai soumis un appel
+    Quand je consulte "Mes sanctions"
+    Alors je vois le statut de l'appel:
+      | statut appel           | badge                      | couleur |
+      | Aucun appel            | -                          | -       |
+      | Appel en cours         | En cours 🔍                | Orange  |
+      | Appel accepté          | Accepté ✓                  | Vert    |
+      | Appel rejeté           | Rejeté ✗                   | Rouge   |
+      | Sanction réduite       | Partiellement accepté 🟡   | Bleu    |
+    Et un badge de notification m'alerte si le statut change
+
+  Scénario: Notification quand l'appel est traité - Accepté
+    Étant donné que mon appel a été accepté
+    Quand le modérateur prend la décision
+    Alors je reçois une notification push + in-app:
+      """
+      ✓ Appel accepté
+
+      Votre sanction a été annulée.
+      Le strike a été retiré et votre contenu a été rétabli.
+
+      [Voir les détails]
+      """
+    Et je reçois un email détaillé avec la justification
+    Et le statut dans mes sanctions passe à "Annulée"
+
+  Scénario: Notification quand l'appel est traité - Rejeté
+    Étant donné que mon appel a été rejeté
+    Quand le modérateur prend la décision
+    Alors je reçois une notification:
+      """
+      Appel rejeté
+
+      Votre appel a été examiné et la sanction est maintenue.
+      Cette décision est définitive.
+
+      [Voir la justification]
+      """
+    Et je reçois un email avec la justification détaillée
+    Et le statut reste "Active"
+    Et je ne peux pas faire de second appel
+
+  Scénario: Notification intermédiaire si délai >72h
+    Étant donné que mon appel complexe est en cours depuis 3 jours
+    Quand le délai de 72h est dépassé
+    Alors je reçois une notification intermédiaire:
+      """
+      Appel #MOD-2026-00142 en cours
+
+      Votre appel nécessite un examen approfondi.
+      Réponse sous 2 jours maximum.
+
+      Merci de votre patience.
+      """
+    Et je suis rassuré que mon appel n'est pas oublié
+
+  # Page détails de la réponse à l'appel
+
+  Scénario: Détails de la réponse - Appel accepté
+    Étant donné que mon appel a été accepté
+    Quand je consulte les détails de la réponse
+    Alors je vois:
+      """
+      Décision: Annulation de la sanction ✓
+
+      Justification:
+      Après examen de votre appel, nous reconnaissons que le
+      passage mentionné était dans un contexte éducatif et ne
+      constitue pas une violation des règles de la communauté.
+
+      Actions prises:
+      ✓ Strike retiré de votre compte
+      ✓ Suspension annulée
+      ✓ Contenu rétabli sur la plateforme
+
+      Cette décision est définitive.
+      """
+    Et je suis satisfait de la transparence
+
+  Scénario: Détails de la réponse - Sanction réduite
+    Étant donné que mon appel a été partiellement accepté
+    Quand je consulte les détails
+    Alors je vois:
+      """
+      Décision: Réduction de la sanction 🟡
+
+      Justification:
+      Nous reconnaissons des circonstances atténuantes.
+
+      Sanction initiale: Strike 2 - Suspension 7 jours
+      Sanction réduite: Strike 1 - Suspension 3 jours
+
+      Cette décision est définitive.
+      """
+    Et je vois le compteur de suspension mis à jour (3 jours au lieu de 7)
+
+  # Dark mode et accessibilité
+
+  Scénario: Support du dark mode
+    Étant donné que j'ai activé le dark mode
+    Quand j'affiche la page de sanction
+    Alors les couleurs s'adaptent:
+      | élément                | couleur light    | couleur dark      |
+      | Fond page              | Blanc            | Noir (#121212)    |
+      | Carte sanction         | Rouge clair      | Rouge foncé       |
+      | Texte principal        | Noir             | Blanc             |
+      | Passage problématique  | Rouge            | Rouge (#FF6B6B)   |
+      | Bouton Contester       | Rouge (#DC3545)  | Rouge (#F85149)   |
+    Et le contraste reste suffisant
+
+  Scénario: Accessibilité lecteur d'écran
+    Étant donné que j'utilise un lecteur d'écran
+    Quand je navigue dans la page de sanction
+    Alors chaque section est clairement annoncée:
+      """
+      Contenu modéré. Attention.
+      Votre contenu "Mon podcast numéro 42" a été modéré.
+      Catégorie violée: Haine et violence, Article 3 point 2.
+      Raison: Propos discriminatoires envers un groupe.
+      Passage problématique: 3 minutes 42 secondes à 4 minutes 15 secondes.
+      Sanction: Strike 2 sur 4. Suspension 7 jours.
+      Bouton: Contester cette décision.
+      """
+    Et tous les éléments sont accessibles au clavier
+
+  # Coût et conformité
+
+  Scénario: Coût de la fonctionnalité
+    Étant donné que l'interface sanctions et appel est en place
+    Quand on évalue le coût
+    Alors le développement est 100% interne (Flutter)
+    Et aucun service tiers n'est utilisé
+    Et le coût opérationnel est de 0€
+    Et les emails de notification coûtent ~0.001€/email
+
+  Scénario: Conformité DSA - Transparence
+    Étant donné que le système de sanction est en place
+    Quand on vérifie la conformité DSA
+    Alors chaque sanction contient:
+      | élément DSA requis                   | présent |
+      | Référence précise à la règle violée  | ✓       |
+      | Explication claire                   | ✓       |
+      | Preuve (extrait + transcription)     | ✓       |
+      | Possibilité de recours               | ✓       |
+      | Délai de recours clairement indiqué  | ✓       |
+      | Réponse motivée au recours           | ✓       |
+    Et le système est conforme au Digital Services Act

features/ui/moderation/signalement-ui.feature

@@ -0,0 +1,291 @@
+# language: fr
+
+@ui @moderation @signalement
+Fonctionnalité: Interface de signalement de contenu (Mobile)
+  En tant qu'utilisateur de l'application mobile
+  Je veux pouvoir signaler un contenu inapproprié facilement
+  Afin de contribuer à améliorer la qualité de la plateforme
+
+  # 14.1 - Interface de signalement utilisateur
+
+  Contexte:
+    Étant donné que je suis connecté à l'application mobile
+    Et que je suis en train d'écouter un contenu
+
+  # Accès au formulaire de signalement
+
+  Scénario: Accéder au signalement depuis le player audio
+    Étant donné que j'écoute un contenu audio
+    Quand j'ouvre le menu "⋮" du player
+    Alors je vois l'option "🚫 Signaler ce contenu"
+    Et l'option est facilement accessible (3ème position)
+    Et l'icône est rouge pour la visibilité
+
+  Scénario: Accéder au signalement depuis la page de détails
+    Étant donné que je consulte la page de détails d'un contenu
+    Quand j'ouvre le menu "⋮" en haut à droite
+    Alors je vois l'option "🚫 Signaler ce contenu"
+    Et je peux ouvrir le formulaire de signalement
+
+  Scénario: Accéder au signalement depuis l'historique d'écoute
+    Étant donné que je consulte mon historique d'écoute
+    Quand je fais un appui long sur un contenu
+    Alors un menu contextuel s'affiche
+    Et je vois l'option "🚫 Signaler"
+    Et je peux signaler le contenu même si je ne l'écoute plus
+
+  # Formulaire de signalement - Design et UX
+
+  Scénario: Affichage du formulaire de signalement
+    Étant donné que je clique sur "Signaler ce contenu"
+    Quand le formulaire s'affiche
+    Alors il apparaît en modal plein écran (iOS) ou bottom sheet (Android)
+    Et le titre est "Signaler ce contenu"
+    Et je vois le nom du contenu et le créateur en haut
+    Et le formulaire contient:
+      | élément                    | type                  | obligatoire |
+      | Catégorie du problème      | Liste déroulante      | oui         |
+      | Commentaire                | Zone texte            | non*        |
+      | Bouton Annuler             | Secondaire (gris)     | -           |
+      | Bouton Envoyer             | Primaire (rouge)      | -           |
+    Et le bouton "Envoyer" est désactivé tant qu'aucune catégorie n'est sélectionnée
+
+  Scénario: Design responsive du formulaire
+    Étant donné que le formulaire de signalement est affiché
+    Quand je vérifie l'adaptation de l'interface
+    Alors sur petit écran (<375px), le texte est réduit mais lisible
+    Et sur grand écran (>414px), le formulaire utilise l'espace disponible
+    Et le clavier ne masque pas le bouton "Envoyer"
+    Et je peux scroller si le contenu dépasse la hauteur de l'écran
+
+  # Liste des catégories avec icônes
+
+  Scénario: Affichage des 7 catégories prédéfinies
+    Étant donné que le formulaire de signalement est affiché
+    Quand je clique sur "Catégorie du problème"
+    Alors une liste déroulante s'affiche avec 7 options:
+      | icône | catégorie               | description visible en sous-titre       |
+      | 🚫    | Haine & violence        | Incitation à la haine, discrimination   |
+      | 🔞    | Contenu sexuel          | Pornographie, contenu explicite         |
+      | ⚖️    | Illégalité              | Terrorisme, apologie de crimes          |
+      | 🎵    | Droits d'auteur         | Musique/contenu protégé non autorisé    |
+      | 📧    | Spam                    | Publicité non sollicitée, répétition    |
+      | ❌    | Fausse information      | Désinformation santé, sécurité routière |
+      | 🔧    | Autre                   | Champ texte obligatoire si sélectionné  |
+    Et chaque option affiche l'icône, le titre et la description
+    Et la description est en gris clair pour la hiérarchie visuelle
+
+  Scénario: Sélection d'une catégorie
+    Étant donné que la liste des catégories est affichée
+    Quand je sélectionne "🚫 Haine & violence"
+    Alors la liste se ferme
+    Et le champ "Catégorie du problème" affiche "🚫 Haine & violence"
+    Et le bouton "Envoyer" s'active (devient rouge)
+    Et je peux passer au champ commentaire (optionnel)
+
+  Scénario: Animation visuelle lors de la sélection
+    Étant donné que je suis sur le formulaire de signalement
+    Quand je sélectionne une catégorie
+    Alors une animation de validation subtile s'affiche (✓ vert)
+    Et le champ commentaire s'anime légèrement pour attirer l'attention
+    Et l'UX est fluide et encourageante
+
+  # Catégorie "Autre" avec commentaire obligatoire
+
+  Scénario: Catégorie "Autre" rend le commentaire obligatoire
+    Étant donné que le formulaire de signalement est affiché
+    Quand je sélectionne "🔧 Autre"
+    Alors le champ "Commentaire" affiche un astérisque rouge (*)
+    Et le placeholder change en "Décrivez le problème (obligatoire)"
+    Et une étiquette "Obligatoire" apparaît en rouge
+    Et le bouton "Envoyer" reste désactivé tant que je n'ai pas saisi de commentaire
+
+  Scénario: Validation du commentaire obligatoire pour "Autre"
+    Étant donné que j'ai sélectionné "🔧 Autre"
+    Et que je n'ai pas rempli le champ commentaire
+    Quand je clique sur "Envoyer"
+    Alors un message d'erreur s'affiche sous le champ:
+      """
+      Veuillez décrire le problème (minimum 10 caractères)
+      """
+    Et le champ commentaire est mis en évidence en rouge
+    Et le signalement n'est pas envoyé
+
+  # Champ commentaire - UX et validation
+
+  Scénario: Commentaire optionnel avec incitation
+    Étant donné que j'ai sélectionné une catégorie autre que "Autre"
+    Quand je consulte le champ "Commentaire"
+    Alors le placeholder indique "Décrivez le problème (optionnel mais recommandé)"
+    Et aucun astérisque rouge n'est affiché
+    Et un compteur "0/500" s'affiche en bas à droite
+    Et l'incitation encourage à fournir des détails sans obliger
+
+  Scénario: Compteur de caractères en temps réel
+    Étant donné que je suis dans le champ commentaire
+    Quand je tape du texte
+    Alors le compteur se met à jour en temps réel: "42/500"
+    Et quand j'atteins 450 caractères, le compteur passe en orange
+    Et quand j'atteins 490 caractères, le compteur passe en rouge
+    Et à 500 caractères, le clavier bloque la saisie
+    Et un message s'affiche: "Limite atteinte"
+
+  Scénario: Limite stricte de 500 caractères
+    Étant donné que j'ai saisi 500 caractères dans le commentaire
+    Quand j'essaie de taper un caractère supplémentaire
+    Alors le caractère n'est pas accepté
+    Et le clavier vibre légèrement (feedback haptique)
+    Et le compteur reste à "500/500" en rouge
+
+  # Envoi du signalement
+
+  Scénario: Envoi d'un signalement sans commentaire
+    Étant donné que j'ai sélectionné "📧 Spam"
+    Et que je n'ai pas rempli le champ commentaire
+    Quand je clique sur "Envoyer"
+    Alors un loader s'affiche sur le bouton "Envoyer"
+    Et le formulaire se ferme après 1 seconde
+    Et le signalement est envoyé avec succès
+    Et aucune erreur ne s'affiche
+
+  Scénario: Envoi d'un signalement avec commentaire
+    Étant donné que j'ai sélectionné "🚫 Haine & violence"
+    Et que j'ai saisi "Propos discriminatoires à 2:30"
+    Quand je clique sur "Envoyer"
+    Alors un loader s'affiche pendant l'envoi
+    Et le formulaire se ferme
+    Et le signalement est envoyé avec le commentaire
+    Et le commentaire sera visible par les modérateurs
+
+  Scénario: Gestion d'erreur lors de l'envoi
+    Étant donné que j'ai rempli le formulaire de signalement
+    Et que ma connexion réseau est perdue
+    Quand je clique sur "Envoyer"
+    Alors un message d'erreur s'affiche:
+      """
+      Impossible d'envoyer le signalement.
+      Vérifiez votre connexion internet.
+      """
+    Et le formulaire reste ouvert avec mes données
+    Et je peux réessayer sans perdre ma saisie
+
+  # Toast de confirmation
+
+  Scénario: Toast de confirmation après envoi réussi
+    Étant donné que j'ai envoyé un signalement
+    Quand le signalement est enregistré avec succès
+    Alors un toast notification s'affiche en bas de l'écran
+    Et le toast contient:
+      | élément              | contenu                                      |
+      | Icône                | ✓ (vert)                                     |
+      | Message              | Signalement envoyé. Examen sous 24-48h.     |
+      | Bouton               | Voir mes signalements                        |
+      | Bouton fermer        | × (croix en haut à droite)                   |
+    Et le toast s'affiche pendant 5 secondes
+    Et je peux le fermer manuellement
+
+  Scénario: Animation du toast
+    Étant donné que le signalement est envoyé
+    Quand le toast s'affiche
+    Alors il apparaît avec une animation slide-up depuis le bas
+    Et après 5 secondes, il disparaît avec une animation fade-out
+    Et l'animation est fluide et professionnelle
+
+  Scénario: Redirection vers l'historique depuis le toast
+    Étant donné que le toast de confirmation est affiché
+    Quand je clique sur "Voir mes signalements"
+    Alors le toast se ferme
+    Et je suis redirigé vers "Profil > Mes signalements"
+    Et je vois mon nouveau signalement en tête de liste
+    Et le statut est "En cours 🔍"
+
+  # Modal de découverte au premier signalement
+
+  Scénario: Découverte du système de badges au 1er signalement
+    Étant donné que je viens d'envoyer mon tout premier signalement
+    Et que le toast de confirmation s'est affiché
+    Quand 2 secondes se sont écoulées
+    Alors une modal d'information s'affiche par-dessus
+    Et la modal contient le titre "🎯 Bravo ! Vous contribuez à une communauté plus saine"
+    Et la modal explique le système de badges:
+      """
+      🥉 Bronze : 5 signalements validés
+      🥈 Argent : 20 signalements validés
+      🥇 Or : 50 signalements validés → -50% Premium 3 mois
+      """
+    Et la modal contient 2 boutons:
+      | bouton           | action                              |
+      | En savoir plus   | Ouvre page dédiée badges            |
+      | J'ai compris     | Ferme la modal                      |
+    Et cette modal ne se réaffiche jamais
+
+  Scénario: Modal responsive et accessible
+    Étant donné que la modal de découverte s'affiche
+    Quand je vérifie l'accessibilité
+    Alors la modal est centrée sur l'écran
+    Et le fond est assombri (overlay semi-transparent)
+    Et je ne peux pas interagir avec l'écran en arrière-plan
+    Et je peux fermer en cliquant hors de la modal
+    Et le texte est lisible (contraste WCAG AA)
+
+  # Limite de signalements déjà effectués
+
+  Scénario: Impossible de signaler deux fois le même contenu
+    Étant donné que j'ai déjà signalé ce contenu il y a 3 jours
+    Quand j'ouvre le menu "⋮" du contenu
+    Alors l'option "Signaler" est désactivée (grisée)
+    Et un tooltip s'affiche: "Vous avez déjà signalé ce contenu"
+    Et je peux consulter mon signalement précédent via le tooltip (lien)
+
+  Scénario: Redirection vers le signalement existant
+    Étant donné que j'ai déjà signalé ce contenu
+    Et que l'option "Signaler" est désactivée
+    Quand je clique sur le tooltip "Vous avez déjà signalé ce contenu"
+    Alors je suis redirigé vers "Mes signalements"
+    Et le signalement concerné est mis en évidence
+    Et je vois le statut actuel: "En cours 🔍" / "Traité ✓" / "Rejeté ✗"
+
+  # Accessibilité et dark mode
+
+  Scénario: Support du dark mode
+    Étant donné que j'ai activé le dark mode sur mon téléphone
+    Quand j'ouvre le formulaire de signalement
+    Alors le formulaire s'adapte au dark mode:
+      | élément                | couleur dark mode        |
+      | Fond de la modal       | Gris foncé (#1E1E1E)     |
+      | Texte principal        | Blanc (#FFFFFF)          |
+      | Texte secondaire       | Gris clair (#B0B0B0)     |
+      | Bordures               | Gris moyen (#3E3E3E)     |
+      | Bouton Envoyer         | Rouge (#FF4444)          |
+    Et le contraste reste suffisant (WCAG AA)
+
+  Scénario: Accessibilité pour lecteur d'écran
+    Étant donné que j'utilise un lecteur d'écran (VoiceOver/TalkBack)
+    Quand je navigue dans le formulaire de signalement
+    Alors chaque élément a un label descriptif:
+      | élément                    | label lecteur d'écran                     |
+      | Bouton menu                | "Menu du contenu"                         |
+      | Option signaler            | "Signaler ce contenu"                     |
+      | Liste catégories           | "Sélectionner une catégorie de problème"  |
+      | Champ commentaire          | "Commentaire optionnel, 500 caractères maximum" |
+      | Bouton Envoyer             | "Envoyer le signalement"                  |
+    Et je peux naviguer au clavier (tab/shift-tab)
+    Et tous les états (activé/désactivé) sont annoncés
+
+  # Coût et performance
+
+  Scénario: Performance de l'interface
+    Étant donné que j'ouvre le formulaire de signalement
+    Quand je mesure les performances
+    Alors le formulaire s'affiche en <300ms
+    Et l'animation est fluide (60 FPS)
+    Et l'envoi du signalement prend <2 secondes
+    Et l'UX est instantanée et réactive
+
+  Scénario: Coût de développement
+    Étant donné que l'interface de signalement est développée
+    Quand on évalue le coût
+    Alors le développement est 100% interne (Flutter)
+    Et aucun service tiers n'est utilisé
+    Et le coût opérationnel est de 0€
+    Et l'interface est native iOS et Android