Merge branch 'memory-results' : classement Memory en ligne

Passe le classement Memory en ligne (ASP.NET + SQL Server)
Le classement du jeu Memory était stocké en localStorage (visible d'un seul joueur, sur un seul poste). Il est désormais partagé en ligne via une API ASP.NET/SQL Server adaptée à l'hébergement bsite.net. - API scores.ashx (C#, compilée au vol par IIS) : lecture GET et enregistrement POST, création automatique de la table, ne conserve que le top 10 de chaque mode (facile / normal / difficile). - leaderboard.js : le classement passe par fetch vers l'API (états chargement/erreur/vide, surbrillance de la ligne du joueur). Les statistiques personnelles restent stockées localement. - memory-game.js : rafraîchit le classement après l'enregistrement (async). - Style .is-me pour la ligne du joueur courant. - web.config.example fourni ; le web.config réel (mot de passe) est ignoré.
2026-07-15 22:35:33 +02:00 · 2026-07-15 22:35:24 +02:00
17 changed files with 2759 additions and 4504 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,6 @@

 .DS_Store

-# Contient le mot de passe SQL Server — à éditer uniquement sur bsite.net
+# Contient le mot de passe de la base SQL Server — à créer sur le serveur
+# à partir de web.config.example (ne jamais versionner)
 exercices/memory-pictogrammes/api/web.config
--- a/data/ghs05-corrosif.jpg
+++ b/data/ghs05-corrosif.jpg
--- a/data/ghs07-nocif.jpg
+++ b/data/ghs07-nocif.jpg
--- a/data/ghs09-environnement.jpg
+++ b/data/ghs09-environnement.jpg
--- a/exercices/Exo_BioCID.html
+++ b/exercices/Exo_BioCID.html
--- a/exercices/Exo_FDS.html
+++ b/exercices/Exo_FDS.html
--- a/exercices/TP_Nuisibles.html
+++ b/exercices/TP_Nuisibles.html
@@ -17,7 +17,7 @@
  justify-content: center;
  padding: 2rem;
  padding-top: calc(70px + 2rem);
-  padding-bottom: calc(84px + 2rem);
+  padding-bottom: calc(52px + 2rem);
  opacity: 0;
  transition: opacity 0.4s ease;
  overflow-y: auto;
@@ -38,67 +38,73 @@
  transition: width 0.4s ease;
 }

+/* PHASE INDICATOR */
+.phase-badge {
+  position: fixed;
+  top: 80px; right: 16px;
+  font-family: 'Syne', sans-serif;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  padding: 4px 12px;
+  border-radius: 20px;
+  z-index: 100;
+}
+
 /* BOTTOM BAR */
 .bottom-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
-  height: 84px;
+  height: 52px;
  background: rgba(250, 238, 218, 0.98);
  border-top: 2px solid var(--amber);
  display: flex;
  align-items: center;
-  justify-content: center;
+  justify-content: space-between;
  padding: 0 20px;
  z-index: 100;
  backdrop-filter: blur(10px);
 }
-.bottom-actions {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  flex-wrap: wrap;
-  justify-content: center;
-}
-.footer-btn {
-  font-family: 'Syne', sans-serif;
-  font-size: 13px;
-  font-weight: 600;
-  padding: 11px 24px;
-  border-radius: 40px;
-  border: 1.5px solid var(--amber);
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  line-height: 1;
-  transition: all 0.2s;
-}
-.footer-btn:hover { transform: translateY(-1px); }
-.footer-btn:active { transform: scale(0.98); }
-.footer-btn.is-primary { background: var(--amber); color: #fff; }
-.footer-btn.is-primary:hover { background: var(--amber-dark); }
-.footer-btn.is-secondary { background: transparent; color: var(--amber-dark); }
-.footer-btn.is-secondary:hover { background: rgba(186,117,23,0.08); }
+
+/* SLIDE NAV */
 .slide-counter {
-  position: absolute;
-  left: 20px;
  font-size: 12px;
  font-family: 'Syne', sans-serif;
  font-weight: 600;
  color: var(--amber-dark);
 }
-@media (max-width: 560px) {
-  .slide-counter { display: none; }
+
+/* BACK BUTTON */
+.back-btn {
+  background: none;
+  border: 0.5px solid var(--amber);
+  border-radius: 20px;
+  padding: 6px 16px;
+  font-size: 12px;
+  color: var(--amber-dark);
+  cursor: pointer;
+  transition: all 0.2s;
+  font-family: 'DM Sans', sans-serif;
 }
+.back-btn:hover { background: rgba(186,117,23,0.08); }

 /* FORMATEUR SELECTOR */
 .formateur-btn {
-  flex: 1; font-family: 'DM Sans', sans-serif; font-size: 13.5px;
-  padding: 9px 13px; border: 1px solid var(--border); border-radius: 10px;
-  background: var(--bg); color: var(--text); cursor: pointer; transition: all 0.2s ease;
+  font-family: 'Syne', sans-serif;
+  font-size: 14px;
+  font-weight: 600;
+  padding: 10px 24px;
+  border-radius: 30px;
+  border: 1.5px solid var(--border);
+  background: white;
+  color: var(--text-muted);
+  cursor: pointer;
+  transition: all 0.2s;
+  flex: 1;
 }
-.formateur-btn:hover { border-color: var(--amber); }
-.formateur-btn.selected { background: var(--amber); border-color: var(--amber); color: #fff; }
+.formateur-btn:hover { border-color: var(--amber); color: var(--amber); }
+.formateur-btn.selected { background: var(--amber-light); border-color: var(--amber); color: var(--amber-dark); font-weight: 700; }

 /* CARDS & BUTTONS */
 .btn {
@@ -240,42 +246,40 @@
 .q-item { flex-direction: column; align-items: stretch; }
 .q-item .q-head { display: flex; align-items: flex-start; gap: 12px; }

-/* IDENTIFICATION SCREEN — carte modèle BioCID / FDS */
-.identity-card {
-  background: white;
-  border: 0.5px solid var(--border);
-  border-radius: 14px;
-  padding: 16px 18px;
-  max-width: 460px;
+/* IDENTIFICATION SCREEN */
+.id-form {
  width: 100%;
-  margin: 1.25rem auto;
-  text-align: left;
+  max-width: 420px;
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+  margin: 1.25rem 0;
 }
-.identity-card .identity-title {
+.id-field label {
+  display: block;
  font-family: 'Syne', sans-serif;
-  font-size: 12px;
+  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
-  color: var(--amber-dark);
-  margin-bottom: 10px;
-  display: flex; align-items: center; gap: 6px;
+  color: var(--text-muted);
+  margin-bottom: 6px;
+  text-align: left;
 }
-.identity-fields { display: flex; flex-direction: column; gap: 8px; }
-.identity-fields input {
-  font-family: 'DM Sans', sans-serif;
-  font-size: 13.5px;
-  color: var(--text);
-  background: var(--bg);
-  border: 1px solid var(--border);
-  border-radius: 10px;
-  padding: 9px 13px;
+.id-field input {
  width: 100%;
-  box-sizing: border-box;
+  font-family: 'DM Sans', sans-serif;
+  font-size: 15px;
+  padding: 12px 16px;
+  border: 1.5px solid var(--border);
+  border-radius: 10px;
+  background: white;
+  color: var(--text);
+}
+.id-field input:focus {
+  outline: none;
+  border-color: var(--amber);
 }
-.identity-fields input:focus { outline: none; border-color: var(--amber); background: white; }
-.formateur-label { font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-muted); margin: 4px 0 2px; }
-.formateur-row { display: flex; gap: 8px; }

 /* TABLE FORM CONTROLS */
 .risk-table input, .risk-table textarea {
@@ -492,19 +496,6 @@
  line-height: 1.6;
  margin-bottom: 1.5rem;
 }
-.info-card {
-  background: var(--amber-light);
-  border-radius: 12px;
-  padding: 16px 20px;
-  max-width: 620px;
-  width: 100%;
-  font-size: 14px;
-  color: var(--amber-dark);
-  line-height: 1.6;
-  display: flex;
-  gap: 10px;
-  align-items: flex-start;
-}
 .steps-row {
  display: flex;
  gap: 8px;
@@ -583,7 +574,7 @@
  gap: 12px;
  max-width: 640px;
  width: 100%;
-  margin: 1.5rem auto;
+  margin: 1.5rem 0;
 }
 .final-card {
  background: white;
@@ -615,7 +606,7 @@
 /* SCROLLABLE AREA */
 .scroll-area {
  overflow-y: auto;
-  max-height: calc(100vh - 200px);
+  max-height: calc(100vh - 232px);
  width: 100%;
  display: flex;
  flex-direction: column;
@@ -656,14 +647,13 @@
 <!-- Progress bar -->
 <div class="progress-bar"><div class="progress-fill" id="progressFill"></div></div>

+<!-- Phase badge -->
+<div class="phase-badge" id="phaseBadge" style="display:none"></div>
+
 <!-- Bottom bar -->
 <div class="bottom-bar" id="bottomBar" style="display:none;">
+  <button class="back-btn" id="backBtn" onclick="goBack()" style="display:none;">← Retour</button>
  <div class="slide-counter" id="slideCounter"></div>
-  <div class="bottom-actions">
-    <button class="footer-btn is-secondary" id="backBtn" onclick="goBack()" style="display:none;">← Retour</button>
-    <button class="footer-btn is-secondary" id="footerHintBtn" onclick="showHintCurrent()" style="display:none;">💡 Besoin d'aide ?</button>
-    <button class="footer-btn is-primary" id="footerNextBtn" onclick="goNext()" style="display:none;">Étape suivante →</button>
-  </div>
 </div>

 <!-- Modal overlay -->
@@ -676,40 +666,48 @@
  </div>
 </div>

-<!-- ======================== SLIDE 0 — ACCUEIL ======================== -->
+<!-- ======================== SLIDE 0 — IDENTIFICATION ======================== -->
 <div class="slide active fade-in" id="slide-0">
-  <div class="deco-circle" style="width:400px;height:400px;background:var(--amber-light);top:-100px;right:-80px;opacity:0.6;"></div>
-  <div class="deco-circle" style="width:200px;height:200px;background:var(--amber-light);bottom:60px;left:-60px;opacity:0.5;"></div>
-  <div style="text-align:center;">
-    <div class="hero-label">Certibiocide — Travaux pratiques</div>
-    <div class="hero-title">Étude de cas<br>Nuisibles</div>
-    <p class="hero-sub">Votre mission, si vous l'acceptez : maîtriser l'identification, le traitement et la sécurité face aux nuisibles.</p>
-    <button class="btn btn-amber" onclick="goTo(1)">Démarrer la mission →</button>
+  <div class="deco-circle" style="width:320px;height:320px;background:var(--amber-light);top:-80px;left:-80px;opacity:0.5;"></div>
+  <div style="text-align:center; z-index:1; width:100%;">
+    <div class="section-tag" style="background:var(--amber-light);color:var(--amber-dark);">Avant de commencer</div>
+    <div class="slide-title">Identification du groupe</div>
+    <p class="slide-intro" style="margin:0.5rem auto 0;max-width:420px;">Ces informations permettront au formateur de retrouver vos réponses.</p>
+    <div class="id-form" style="margin-left:auto;margin-right:auto;">
+      <div class="id-field">
+        <label for="inputNom">Nom du stagiaire ou du groupe</label>
+        <input type="text" id="inputNom" placeholder="Ex : Groupe 3 - Dupont / Martin" autocomplete="off">
+      </div>
+      <div class="id-field">
+        <label for="inputDate">Date de la session</label>
+        <input type="date" id="inputDate">
+      </div>
+      <div class="id-field">
+        <label>Formateur de la session</label>
+        <div style="display:flex;gap:10px;margin-top:2px;">
+          <button type="button" class="formateur-btn" id="btnNathan" onclick="selectFormateur('Nathan')">Nathan</button>
+          <button type="button" class="formateur-btn" id="btnGauthier" onclick="selectFormateur('Gauthier')">Gauthier</button>
+        </div>
+      </div>
+    </div>
+    <div id="idError" style="color:var(--coral);font-size:13px;margin-bottom:0.5rem;display:none;">Merci de renseigner au moins le nom du groupe.</div>
+    <div style="display:flex;gap:12px;justify-content:center;flex-wrap:wrap;">
+      <button class="btn btn-teal" onclick="confirmIdentite()">Continuer →</button>
+      <a href="correction-tp-nuisibles.html" class="btn btn-outline btn-teal">Corriger</a>
+    </div>
  </div>
 </div>

-<!-- ======================== SLIDE 1 — CONTEXTE & IDENTIFICATION ======================== -->
+<!-- ======================== SLIDE 1 — ACCUEIL ======================== -->
 <div class="slide" id="slide-1">
-  <div class="deco-circle" style="width:300px;height:300px;background:var(--amber-light);top:-60px;left:-60px;opacity:0.4;"></div>
-  <div class="section-tag" style="background:var(--amber-light);color:var(--amber-dark);">Avant de commencer</div>
-  <div class="slide-title">Contexte & accès</div>
-  <p class="slide-intro">3 travaux pratiques vous attendent : protocole d'intervention, recherche produit sur BioCID, puis analyse de risques. Ces informations permettront au formateur de retrouver vos réponses.</p>
-  <div class="info-card" style="max-width:620px;">
-    <span>🎯</span>
-    <div>Vous allez définir un <strong>protocole d'intervention</strong>, trouver votre <strong>produit sur BioCID</strong>, puis réaliser l'<strong>analyse de risques</strong>.</div>
-  </div>
-  <div class="identity-card" style="max-width:620px;margin-top:0.5rem;">
-    <div class="identity-title">👥 Identification du groupe</div>
-    <div class="identity-fields">
-      <input type="text" id="inputNom" placeholder="Nom du groupe / stagiaires (ex : Groupe 3 — Dupont / Martin)" autocomplete="off">
-      <input type="date" id="inputDate">
-      <div class="formateur-label">Formateur de la session</div>
-      <div class="formateur-row">
-        <button type="button" class="formateur-btn" id="btnNathan" onclick="selectFormateur('Nathan')">Nathan</button>
-        <button type="button" class="formateur-btn" id="btnGauthier" onclick="selectFormateur('Gauthier')">Gauthier</button>
-      </div>
-    </div>
-    <div id="idError" style="color:var(--coral);font-size:13px;margin-top:8px;display:none;">Merci de renseigner au moins le nom du groupe.</div>
+  <div class="deco-circle" style="width:400px;height:400px;background:var(--amber-light);top:-100px;right:-80px;opacity:0.6;"></div>
+  <div class="deco-circle" style="width:200px;height:200px;background:var(--amber-light);bottom:60px;left:-60px;opacity:0.5;"></div>
+  <div style="text-align:center; z-index:1;">
+    <div class="hero-label">Formation</div>
+    <div class="hero-title">CERTIBIOCIDE</div>
+    <div style="font-family:'Syne',sans-serif;font-size:clamp(14px,2.5vw,22px);font-weight:600;color:var(--amber-mid);letter-spacing:0.04em;margin-bottom:1.5rem;">TRAVAUX PRATIQUES</div>
+    <p class="hero-sub">Votre mission, si vous l'acceptez : maîtriser l'identification, le traitement et la sécurité face aux nuisibles.</p>
+    <button class="btn btn-teal" onclick="goTo(2)">Démarrer la mission →</button>
  </div>
 </div>

@@ -717,12 +715,8 @@
 <div class="slide" id="slide-2">
  <div class="deco-circle" style="width:300px;height:300px;background:var(--amber-light);top:-60px;left:-60px;opacity:0.4;"></div>
  <div class="section-tag" style="background:var(--amber-light);color:var(--amber-dark);">Étape 1 / 3</div>
-  <div class="slide-title">🎯 Choisissez votre mission</div>
+  <div class="slide-title">Choisissez votre mission</div>
  <p class="slide-intro">Chaque groupe choisit un cas pratique. Vous travaillerez avec ce scénario tout au long des 3 exercices.</p>
-  <div class="info-card" style="margin-bottom:1.25rem;">
-    <span>💡</span>
-    <div>Le cas retenu conditionne <strong>tous les exercices suivants</strong> et apparaît dans le PDF final. Choisissez celui qui se rapproche le plus de votre pratique.</div>
-  </div>
  <div class="case-grid">
    <div class="case-card" onclick="selectCase('punaises','🛏️','Hôtel — Punaises de lit','Infestation importante dans un hôtel')">
      <div class="case-icon">🛏️</div>
@@ -750,6 +744,9 @@
      <div class="case-sub">Camping</div>
    </div>
  </div>
+  <div class="actions-row">
+    <button class="btn btn-teal" id="btnConfirmCase" onclick="goTo(3)" style="display:none">Confirmer le choix →</button>
+  </div>
 </div>

 <!-- ======================== SLIDE 3 — CONSIGNES ======================== -->
@@ -777,6 +774,7 @@
    <span>💡</span>
    <div>À tout moment, cliquez sur <strong>« Besoin d'aide ? »</strong> pour accéder à un indice. Le formateur corrigera à l'oral en fin de séance.</div>
  </div>
+  <button class="btn btn-teal" onclick="goTo(4)">Commencer le TP 1 →</button>
 </div>

 <!-- ======================== SLIDE 4 — TP1 INTRO ======================== -->
@@ -794,6 +792,7 @@
    <div class="step-pill">2. Intervention</div>
    <div class="step-pill">3. Évaluation</div>
  </div>
+  <button class="btn btn-amber" onclick="goTo(5)">Commencer →</button>
 </div>

 <!-- ======================== SLIDE 5 — TP1 PREVENTION ======================== -->
@@ -834,6 +833,10 @@
        <textarea class="answer-field" id="ans_prevention_4" placeholder="Votre réponse…" data-question="Éléments observés / preuve de présence du nuisible"></textarea>
      </li>
    </ul>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('prevention')">💡 Besoin d'aide ?</button>
+      <button class="btn btn-amber" onclick="goTo(6)">Étape suivante →</button>
+    </div>
  </div>
 </div>

@@ -868,6 +871,10 @@
        <textarea class="answer-field" id="ans_intervention_3" placeholder="Votre réponse…" data-question="Type de produit (TP) et mode de traitement"></textarea>
      </li>
    </ul>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('intervention')">💡 Besoin d'aide ?</button>
+      <button class="btn btn-amber" onclick="goTo(7)">Étape suivante →</button>
+    </div>
  </div>
 </div>

@@ -898,6 +905,10 @@
    <div style="background:var(--amber-light);border-radius:12px;padding:14px 18px;max-width:680px;width:100%;font-size:13px;color:var(--amber-dark);margin:0.75rem 0;">
      ✅ <strong>TP 1 terminé !</strong> Préparez-vous à identifier le produit adapté à votre cas sur biocid-anses.fr.
    </div>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('evaluation')">💡 Besoin d'aide ?</button>
+      <button class="btn btn-coral" onclick="goTo(8)">Passer au TP 2 →</button>
+    </div>
  </div>
 </div>

@@ -919,6 +930,7 @@
    </div>
    <a href="https://biocid-anses.fr" target="_blank" class="resource-link">Ouvrir le site ↗</a>
  </div>
+  <button class="btn btn-coral" onclick="goTo(9)">Commencer →</button>
 </div>

 <!-- ======================== SLIDE 9 — TP2 FDS & AMM ======================== -->
@@ -959,6 +971,10 @@
        <textarea class="answer-field" id="ans_fds_4" placeholder="Votre réponse…" data-question="Risques pour la santé"></textarea>
      </li>
    </ul>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('fds')">💡 Besoin d'aide ?</button>
+      <button class="btn btn-coral" onclick="goTo(10)">Partie suivante →</button>
+    </div>
  </div>
 </div>

@@ -1003,6 +1019,10 @@
    <div style="background:var(--amber-light);border-radius:12px;padding:14px 18px;max-width:680px;width:100%;font-size:13px;color:var(--amber-dark);margin:0.75rem 0;">
      ✅ <strong>TP 2 terminé !</strong> Passez maintenant à l'analyse de risques complète.
    </div>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('epi')">💡 Besoin d'aide ?</button>
+      <button class="btn btn-purple" onclick="goTo(11)">Passer au TP 3 →</button>
+    </div>
  </div>
 </div>

@@ -1019,6 +1039,9 @@
    <div class="pyr-level" style="width:320px;background:#D85A30;">Communication</div>
    <div class="pyr-level" style="width:360px;background:#BA7517;">EPI (dernier recours)</div>
  </div>
+  <div class="actions-row" style="margin-top:1rem;">
+    <button class="btn btn-purple" onclick="goTo(12)">Remplir le tableau →</button>
+  </div>
 </div>

 <!-- ======================== SLIDE 12 — TP3 TABLEAU ======================== -->
@@ -1087,6 +1110,10 @@
    <div style="background:var(--amber-light);border-radius:12px;padding:14px 18px;max-width:780px;width:100%;font-size:13px;color:var(--amber-dark);margin:0.25rem 0;">
      ✅ <strong>TP 3 terminé !</strong> Présentez vos réponses au formateur pour la correction.
    </div>
+    <div class="actions-row">
+      <button class="hint-btn" onclick="showHint('analyse')">💡 Aide générale</button>
+      <button class="btn btn-blue" onclick="goTo(13)">Terminer la mission →</button>
+    </div>
  </div>
 </div>

@@ -1116,10 +1143,15 @@
        <div class="final-card-sub">Analyse de risques</div>
      </div>
    </div>
-    <div class="actions-row">
-      <button class="btn btn-amber" onclick="exporterPDF()">⬇ Télécharger mes réponses (PDF)</button>
-      <a href="corriger-exercice.html?exo=tp" class="btn btn-outline btn-teal">✔ Corriger un rendu</a>
-      <button class="btn btn-outline btn-teal" onclick="restartAll()">↺ Recommencer</button>
+    <div class="submit-zone">
+      <div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap;">
+        <button class="btn btn-teal" onclick="exporterPDF()">⬇ Télécharger en PDF</button>
+        <a href="correction-tp-nuisibles.html" class="btn btn-outline btn-teal">Corriger</a>
+      </div>
+    </div>
+    <div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:0.75rem;">
+      <a href="https://biocid-anses.fr" target="_blank" class="btn btn-outline btn-teal" style="font-size:13px;padding:10px 20px;">biocid-anses.fr ↗</a>
+      <button class="btn btn-teal" onclick="restartAll()">↺ Recommencer depuis le début</button>
    </div>
  </div>
 </div>
@@ -1132,22 +1164,6 @@ const totalSlides = 13;
 const selectedCase = { key: '', icon: '', title: '', desc: '' };
 const stagiaire = { nom: '', date: '', formateur: '' };

-// Configuration des boutons du footer par slide (modèle BioCID)
-const slideConfig = {
-  1:  { next: 2,  nextLabel: 'Continuer →' },
-  2:  { next: 3,  nextLabel: 'Confirmer le choix →' },
-  3:  { next: 4,  nextLabel: 'Commencer le TP 1 →' },
-  4:  { next: 5,  nextLabel: 'Commencer →' },
-  5:  { next: 6,  nextLabel: 'Étape suivante →', hint: 'prevention' },
-  6:  { next: 7,  nextLabel: 'Étape suivante →', hint: 'intervention' },
-  7:  { next: 8,  nextLabel: 'Passer au TP 2 →', hint: 'evaluation' },
-  8:  { next: 9,  nextLabel: 'Commencer →' },
-  9:  { next: 10, nextLabel: 'Partie suivante →', hint: 'fds' },
-  10: { next: 11, nextLabel: 'Passer au TP 3 →', hint: 'epi' },
-  11: { next: 12, nextLabel: 'Remplir le tableau →' },
-  12: { next: 13, nextLabel: 'Terminer la mission →', hint: 'analyse' }
-};
-
 const hints = {
  prevention: {
    icon: '💡',
@@ -1234,28 +1250,11 @@ function goTo(n) {
  currentSlide = n;
  next.style.display = 'flex';
  setTimeout(() => { next.classList.add('active', 'fade-in'); }, 10);
-  const sa = next.querySelector('.scroll-area');
-  if (sa) sa.scrollTop = 0;
  if (n === 13) setTimeout(launchConfetti, 200);
  updateUI();
  updateCaseBanners();
 }

-function goNext() {
-  const cfg = slideConfig[currentSlide];
-  if (!cfg || cfg.next == null) return;
-  // Slide 1 : validation du nom du groupe avant de continuer
-  if (currentSlide === 1) { confirmIdentite(); return; }
-  // Slide 2 : un cas doit être sélectionné
-  if (currentSlide === 2 && !selectedCase.key) return;
-  goTo(cfg.next);
-}
-
-function showHintCurrent() {
-  const cfg = slideConfig[currentSlide];
-  if (cfg && cfg.hint) showHint(cfg.hint);
-}
-
 function goBack() {
  if (history.length === 0) return;
  const prev = history.pop();
@@ -1280,31 +1279,37 @@ function updateUI() {
  if (bottomBar) bottomBar.style.display = currentSlide === 0 ? 'none' : 'flex';

  const backBtn = document.getElementById('backBtn');
-  backBtn.style.display = history.length > 0 ? 'inline-flex' : 'none';
+  backBtn.style.display = history.length > 0 ? 'block' : 'none';

-  const cfg = slideConfig[currentSlide] || {};
-  const hintBtn = document.getElementById('footerHintBtn');
-  const nextBtn = document.getElementById('footerNextBtn');
-  hintBtn.style.display = cfg.hint ? 'inline-flex' : 'none';
-  if (cfg.next != null) {
-    // Slide 2 : le bouton n'apparaît qu'une fois le cas choisi
-    const gated = currentSlide === 2 && !selectedCase.key;
-    nextBtn.style.display = gated ? 'none' : 'inline-flex';
-    nextBtn.textContent = cfg.nextLabel;
-  } else {
-    nextBtn.style.display = 'none';
+  const badge = document.getElementById('phaseBadge');
+  if (currentSlide === 0 || currentSlide === 1 || currentSlide === 2 || currentSlide === 3 || currentSlide === 13) {
+    badge.style.display = 'none';
+  } else if (currentSlide >= 4 && currentSlide <= 7) {
+    badge.style.display = 'block';
+    badge.style.background = 'var(--amber-light)';
+    badge.style.color = 'var(--amber-dark)';
+    badge.textContent = 'TP 1 — Protocole';
+  } else if (currentSlide >= 8 && currentSlide <= 10) {
+    badge.style.display = 'block';
+    badge.style.background = 'var(--coral-light)';
+    badge.style.color = 'var(--coral)';
+    badge.textContent = 'TP 2 — Produit';
+  } else if (currentSlide >= 11 && currentSlide <= 12) {
+    badge.style.display = 'block';
+    badge.style.background = 'var(--amber-light)';
+    badge.style.color = 'var(--amber-dark)';
+    badge.textContent = 'TP 3 — Risques';
  }
 }

 function selectCase(key, icon, title, desc) {
-  marquerModifie();
  selectedCase.key = key;
  selectedCase.icon = icon;
  selectedCase.title = title;
  selectedCase.desc = desc;
  document.querySelectorAll('.case-card').forEach(c => c.classList.remove('selected'));
  event.currentTarget.classList.add('selected');
-  updateUI();
+  document.getElementById('btnConfirmCase').style.display = 'inline-flex';
 }

 function updateCaseBanners() {
@@ -1374,7 +1379,7 @@ function confirmIdentite() {
  document.getElementById('idError').style.display = 'none';
  stagiaire.nom = nom;
  stagiaire.date = date || new Date().toISOString().slice(0, 10);
-  goTo(2);
+  goTo(1);
 }

 /* ======================== TABLEAU TP3 — LIGNES DYNAMIQUES ======================== */
@@ -1601,156 +1606,6 @@ function escapeHtml(str) {
  return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
 }

-/* ======================== SAUVEGARDE AUTOMATIQUE ======================== */
-/* Les réponses sont enregistrées dans le navigateur au fil de la saisie, puis
-   proposées à la restauration au rechargement. En file://, localStorage peut être
-   indisponible (Safari) : dans ce cas la page fonctionne normalement, sans filet. */
-const CLE_SAUVEGARDE = 'certibiocide:tp-nuisibles:v1';
-
-let reponsesModifiees = false;
-function marquerModifie() { reponsesModifiees = true; sauvegarder(); }
-
-document.addEventListener('input', marquerModifie, true);
-document.addEventListener('change', marquerModifie, true);
-
-// Avertit avant tout rechargement ou départ. Le texte de la boîte est imposé
-// par le navigateur, il n'est pas personnalisable.
-window.addEventListener('beforeunload', e => {
-  if (!reponsesModifiees) return;
-  e.preventDefault();
-  e.returnValue = '';
-});
-
-function etatCourant() {
-  const champs = {};
-  document.querySelectorAll('input[id], textarea[id]').forEach(el => {
-    if (el.value) champs[el.id] = el.value;
-  });
-  // Les cellules du tableau TP3 n'ont pas d'id : on les repère par leur position.
-  const risques = Array.from(document.querySelectorAll('#riskTableBody .risk-row'))
-    .map(row => Array.from(row.querySelectorAll('.risk-cell')).map(c => c.value));
-
-  return {
-    savedAt: new Date().toISOString(),
-    slide: currentSlide,
-    champs,
-    risques,
-    cas: selectedCase.key || '',
-    formateur: stagiaire.formateur || '',
-    nom: stagiaire.nom || '',
-    date: stagiaire.date || '',
-  };
-}
-
-let minuteurSauvegarde = null;
-function sauvegarder() {
-  clearTimeout(minuteurSauvegarde);
-  minuteurSauvegarde = setTimeout(() => {
-    try {
-      localStorage.setItem(CLE_SAUVEGARDE, JSON.stringify(etatCourant()));
-    } catch (e) { /* navigation privée ou quota : on continue sans sauvegarde */ }
-  }, 400);
-}
-
-function lireSauvegarde() {
-  try { return JSON.parse(localStorage.getItem(CLE_SAUVEGARDE)); }
-  catch (e) { return null; }
-}
-function effacerSauvegarde() {
-  try { localStorage.removeItem(CLE_SAUVEGARDE); } catch (e) {}
-}
-
-function appliquerSauvegarde(data) {
-  Object.entries(data.champs || {}).forEach(([id, v]) => {
-    const el = document.getElementById(id);
-    if (el) el.value = v;
-  });
-
-  // Recrée autant de lignes de risques que nécessaire avant de les remplir
-  const risques = data.risques || [];
-  const tbody = document.getElementById('riskTableBody');
-  while (tbody.querySelectorAll('.risk-row').length < risques.length) addRiskRow();
-  tbody.querySelectorAll('.risk-row').forEach((row, i) => {
-    const valeurs = risques[i] || [];
-    row.querySelectorAll('.risk-cell').forEach((cell, j) => { cell.value = valeurs[j] || ''; });
-  });
-
-  // Le cas pratique et le formateur passent par leurs boutons, qui remettent
-  // aussi l'interface (carte sélectionnée, bouton de confirmation) dans le bon état.
-  if (data.cas) {
-    const carte = Array.from(document.querySelectorAll('.case-card'))
-      .find(c => (c.getAttribute('onclick') || '').includes("'" + data.cas + "'"));
-    if (carte) carte.click();
-  }
-  if (data.formateur) {
-    const btn = document.getElementById('btn' + data.formateur);
-    if (btn) btn.click();
-  }
-  stagiaire.nom = data.nom || stagiaire.nom;
-  stagiaire.date = data.date || stagiaire.date;
-
-  reponsesModifiees = true;
-  if (typeof data.slide === 'number' && data.slide > 0) goTo(data.slide);
-  updateUI();
-}
-
-/* Bandeau de restauration : on ne restaure jamais sans demander, pour qu'un
-   nouveau groupe n'hérite pas des réponses du précédent sur un poste partagé. */
-function injecterStylesBandeau() {
-  const style = document.createElement('style');
-  style.textContent = `
-    .restore-bar {
-      position: fixed; top: 84px; left: 50%; transform: translateX(-50%);
-      z-index: 900; max-width: min(680px, calc(100vw - 32px));
-      display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
-      background: var(--white); border: 1.5px solid var(--amber);
-      border-radius: 14px; padding: 14px 18px;
-      box-shadow: 0 8px 28px rgba(0,0,0,0.12); font-size: 13.5px;
-    }
-    .restore-bar .restore-text { flex: 1; min-width: 220px; line-height: 1.5; }
-    .restore-bar .restore-actions { display: flex; gap: 8px; flex-shrink: 0; }
-    .restore-bar button {
-      font-family: 'Syne', sans-serif; font-weight: 700; font-size: 12.5px;
-      padding: 8px 16px; border-radius: 20px; cursor: pointer;
-      border: 1px solid var(--border); background: transparent; color: var(--text-muted);
-    }
-    .restore-bar button:hover { border-color: var(--amber); color: var(--amber); }
-    .restore-bar button.primary {
-      background: var(--amber); border-color: var(--amber); color: #fff;
-    }
-    .restore-bar button.primary:hover { background: var(--amber-dark); border-color: var(--amber-dark); color: #fff; }
-  `;
-  document.head.appendChild(style);
-}
-
-function proposerRestauration() {
-  const data = lireSauvegarde();
-  if (!data) return;
-  const aDesReponses = (data.champs && Object.keys(data.champs).length > 0)
-    || (data.risques || []).some(r => r.some(v => v));
-  if (!aDesReponses) return;
-
-  const quand = new Date(data.savedAt);
-  const libelle = isNaN(quand.getTime()) ? '' :
-    ` du ${quand.toLocaleDateString('fr-FR')} à ${quand.toLocaleTimeString('fr-FR', { hour: '2-digit', minute: '2-digit' })}`;
-
-  injecterStylesBandeau();
-  const bar = document.createElement('div');
-  bar.className = 'restore-bar';
-  bar.innerHTML = `
-    <span class="restore-text">💾 Des réponses enregistrées${libelle} ont été retrouvées sur ce poste.</span>
-    <span class="restore-actions">
-      <button type="button" class="primary" id="btnRestaurer">Restaurer</button>
-      <button type="button" id="btnRepartir">Repartir de zéro</button>
-    </span>`;
-  document.body.appendChild(bar);
-
-  document.getElementById('btnRestaurer').onclick = () => { appliquerSauvegarde(data); bar.remove(); };
-  document.getElementById('btnRepartir').onclick = () => { effacerSauvegarde(); bar.remove(); };
-}
-
-proposerRestauration();
-
 updateUI();
 </script>
 </body>
--- a/exercices/correction-tp-nuisibles.html
+++ b/exercices/correction-tp-nuisibles.html
@@ -0,0 +1,650 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Correction TP Nuisibles — Certibiocide</title>
+<link href="https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=DM+Sans:ital,wght@0,400;0,500;1,400&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="../header-style.css"/>
+<style>
+body {
+  padding: calc(36px + 70px) 20px 80px;
+}
+.wrap { max-width: 820px; margin: 0 auto; }
+.syne { font-family: 'Syne', sans-serif; }
+.eyebrow {
+  font-family: 'Syne', sans-serif;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--amber);
+  margin-bottom: 6px;
+}
+h1 {
+  font-family: 'Syne', sans-serif;
+  font-size: 28px;
+  font-weight: 800;
+  letter-spacing: -0.5px;
+  margin-bottom: 28px;
+}
+
+/* DROPZONE */
+#dropzone {
+  background: #fff;
+  border: 2px dashed rgba(186,117,23,0.35);
+  border-radius: 16px;
+  padding: 56px 24px;
+  text-align: center;
+  cursor: pointer;
+  transition: border-color 0.2s, background 0.2s;
+}
+#dropzone.drag { border-color: var(--amber); background: var(--amber-light); }
+#dropzone .icon { font-size: 40px; margin-bottom: 12px; }
+#dropzone p.title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; margin-bottom: 6px; }
+#dropzone p.sub { color: var(--text-muted); font-size: 13.5px; margin-bottom: 20px; }
+#filePicker { display: none; }
+.btn-pick {
+  font-family: 'Syne', sans-serif;
+  display: inline-block;
+  background: var(--amber);
+  color: #fff;
+  font-weight: 700;
+  font-size: 13px;
+  padding: 10px 26px;
+  border-radius: 30px;
+  cursor: pointer;
+  border: none;
+}
+#status { margin-top: 16px; font-size: 13px; }
+#status.loading { color: var(--amber); }
+#status.error { color: var(--coral); }
+
+/* RESULT */
+#result { display: none; }
+.toprow {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 18px;
+}
+#fileName { font-size: 12.5px; color: var(--text-muted); }
+.btn-reset {
+  font-family: 'Syne', sans-serif;
+  background: transparent;
+  border: 1px solid var(--border);
+  border-radius: 20px;
+  padding: 6px 16px;
+  font-size: 12px;
+  font-weight: 600;
+  cursor: pointer;
+  color: var(--text-muted);
+}
+.btn-reset:hover { border-color: var(--amber); color: var(--amber); }
+
+.id-card { display: none; }
+
+/* BANDEAU PARTICIPANTS */
+#participantsBanner {
+  background: linear-gradient(135deg, var(--amber) 0%, #D8923A 100%);
+  border-radius: 16px;
+  padding: 20px 26px;
+  margin-bottom: 24px;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  color: #fff;
+}
+#participantsBanner .pb-icon {
+  width: 48px; height: 48px;
+  border-radius: 12px;
+  background: rgba(255,255,255,0.2);
+  display: flex; align-items: center; justify-content: center;
+  font-size: 24px;
+  flex-shrink: 0;
+}
+#participantsBanner .pb-group {
+  font-family: 'Syne', sans-serif;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  opacity: 0.85;
+  margin-bottom: 4px;
+}
+#participantsBanner .pb-names {
+  font-family: 'Syne', sans-serif;
+  font-size: 18px;
+  font-weight: 700;
+}
+.id-card .label {
+  font-family: 'Syne', sans-serif;
+  font-size: 10.5px;
+  font-weight: 700;
+  color: var(--amber-dark);
+  letter-spacing: 0.05em;
+  text-transform: uppercase;
+}
+.id-card .value { font-size: 14.5px; margin-top: 2px; }
+
+.progress-row { display: flex; align-items: center; gap: 10px; margin-bottom: 30px; font-size: 13px; color: var(--text-muted); }
+.progress-track { flex: 1; height: 7px; background: rgba(0,0,0,0.08); border-radius: 6px; overflow: hidden; }
+.progress-fill { height: 100%; background: var(--teal); transition: width 0.4s ease; }
+.progress-row strong { font-family: 'Syne', sans-serif; color: var(--text); }
+
+/* CARROUSEL DE THEMES */
+.carousel-wrap { margin-bottom: 36px; }
+.carousel-nav {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 16px;
+}
+.nav-btn {
+  width: 38px; height: 38px;
+  border-radius: 50%;
+  border: 1px solid var(--border);
+  background: #fff;
+  font-size: 16px;
+  cursor: pointer;
+  display: flex; align-items: center; justify-content: center;
+  transition: background 0.15s, border-color 0.15s;
+}
+.nav-btn:hover { background: var(--amber-light); border-color: var(--amber); }
+.nav-btn:disabled { opacity: 0.3; cursor: default; }
+.nav-btn:disabled:hover { background: #fff; border-color: var(--border); }
+.dots { display: flex; gap: 7px; }
+.dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(0,0,0,0.15); cursor: pointer; transition: background 0.15s, transform 0.15s; }
+.dot.active { background: var(--amber); transform: scale(1.3); }
+
+.theme-panel {
+  background: #fff;
+  border: 1px solid var(--border);
+  border-radius: 18px;
+  padding: 26px 28px;
+  min-height: 420px;
+}
+.theme-head {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 18px;
+}
+.theme-icon {
+  width: 44px; height: 44px;
+  border-radius: 12px;
+  display: flex; align-items: center; justify-content: center;
+  font-size: 22px;
+  flex-shrink: 0;
+}
+.theme-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 17px; }
+.theme-count { font-size: 12.5px; color: var(--text-muted); margin-left: auto; }
+
+.cards { display: flex; flex-direction: column; gap: 10px; }
+.qcard {
+  background: var(--bg);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  padding: 14px 18px;
+  display: flex;
+  gap: 12px;
+  align-items: flex-start;
+  transition: box-shadow 0.2s;
+}
+.qcard:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
+.qcard .badge {
+  width: 22px; height: 22px;
+  border-radius: 50%;
+  display: flex; align-items: center; justify-content: center;
+  font-size: 12px;
+  flex-shrink: 0;
+  margin-top: 1px;
+}
+.qcard .badge.ok { background: var(--teal-light); color: var(--teal); }
+.qcard .badge.miss { background: var(--coral-light); color: var(--coral); }
+.qcard .qtext { flex: 1; }
+.qcard .qlabel { font-weight: 600; font-size: 13.5px; margin-bottom: 4px; }
+.qcard .qanswer { font-size: 13.5px; white-space: pre-wrap; }
+.qcard .qanswer.empty { color: var(--coral); font-style: italic; }
+
+.table-wrap {
+  background: #fff;
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  padding: 16px 18px;
+  font-size: 13px;
+  margin-bottom: 14px;
+}
+
+/* TABLEAU ANALYSE DE RISQUES */
+.risk-table { width: 100%; border-collapse: collapse; font-size: 13px; }
+.risk-table th {
+  font-family: 'Syne', sans-serif;
+  text-align: left;
+  font-size: 11.5px;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  color: var(--amber-dark);
+  background: var(--amber-light);
+  padding: 10px 12px;
+}
+.risk-table th:first-child { border-radius: 8px 0 0 8px; }
+.risk-table th:last-child { border-radius: 0 8px 8px 0; }
+.risk-table td {
+  padding: 10px 12px;
+  border-bottom: 1px solid var(--border);
+  vertical-align: top;
+  white-space: pre-wrap;
+}
+.risk-table tr:last-child td { border-bottom: none; }
+.meta-line { font-size: 12.5px; color: var(--text-muted); margin-top: 20px; }
+.meta-line strong { color: var(--text); }
+</style>
+</head>
+<body>
+<header>
+    <div class="logo">Gauthier Chombart & Nathan Chauwin</div>
+    <nav>
+        <a href="../index.html">Accueil</a>
+        <a href="../index.html#formations">Exercices</a>
+        <a href="../index.html#documentation">Documentation</a>
+        <a href="../index.html#rapports">Rapports</a>
+        <a href="../index.html#about">À propos</a>
+        <a href="../index.html#contact">Contact</a>
+    </nav>
+</header>
+
+<div class="wrap">
+  <div id="participantsBanner" style="display:none;"></div>
+  <div class="eyebrow">Certibiocide — Correction de TP</div>
+  <h1>TP Nuisibles — Lecture du rendu</h1>
+
+  <div id="dropzone">
+    <div class="icon">📄</div>
+    <p class="title">Déposez le PDF du stagiaire ici</p>
+    <p class="sub">ou cliquez pour sélectionner le fichier exporté depuis le TP</p>
+    <label class="btn-pick">Choisir un fichier
+      <input type="file" id="filePicker" accept="application/pdf">
+    </label>
+    <div id="status"></div>
+  </div>
+
+  <div id="result">
+    <div class="toprow">
+      <span id="fileName"></span>
+      <button class="btn-reset" onclick="resetAll()">↺ Charger un autre PDF</button>
+    </div>
+
+    <div class="id-card" id="idCard"></div>
+
+    <div class="progress-row">
+      <div class="progress-track"><div class="progress-fill" id="progressFill"></div></div>
+      <span><strong id="progressCount"></strong> questions répondues</span>
+    </div>
+
+    <div class="carousel-wrap">
+      <div class="carousel-nav">
+        <button class="nav-btn" id="prevBtn" onclick="goTo(currentTheme - 1)">←</button>
+        <div class="dots" id="dots"></div>
+        <button class="nav-btn" id="nextBtn" onclick="goTo(currentTheme + 1)">→</button>
+      </div>
+      <div id="themePanel"></div>
+    </div>
+
+    <h2 class="syne" style="font-size:16px;font-weight:800;margin-bottom:12px;color:var(--amber-dark);">Analyse de risques</h2>
+    <div class="table-wrap" id="tp3Meta"></div>
+    <div class="table-wrap" id="tp3Table" style="display:none;"></div>
+    <p class="meta-line" id="suiviLine"></p>
+  </div>
+</div>
+
+<footer>
+    <p>&copy; 2026 Gauthier Chombart & Nathan Chauwin<br>Tous droits réservés — Formations Certibiocide & Techniques — Formateurs indépendants</p>
+    <p style="margin-top: 10px; opacity: 0.6;">Tous droits réservés — Gauthier Chombart & Nathan Chauwin — Formateurs indépendants</p>
+</footer>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
+<script>
+pdfjsLib.GlobalWorkerOptions.workerSrc = "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.worker.min.js";
+
+// Thèmes regroupant les sections du TP, avec icône et couleur
+const THEMES = [
+  {
+    title: "Premier contact & diagnostic",
+    icon: "🗣️", color: "purple",
+    items: [
+      "Questions posées au client lors du premier contact",
+      "Conseils donnés en premier lieu",
+      "Actions de prévention menées sur le site",
+      "Éléments observés / preuve de présence du nuisible",
+    ]
+  },
+  {
+    title: "Solutions envisagées",
+    icon: "🧰", color: "blue",
+    items: [
+      "Solutions alternatives non-biocides",
+      "Solutions biocides mises en place",
+      "Type de produit (TP) et mode de traitement",
+      "Suivi mis en place et durée",
+      "Gestion des déchets",
+    ]
+  },
+  {
+    title: "Produit & traçabilité",
+    icon: "🧪", color: "teal",
+    items: [
+      "FDS trouvée (éléments principaux)",
+      "Nom du produit et fabricant/fournisseur",
+      "Numéro AMM",
+    ]
+  },
+  {
+    title: "Sécurité & santé",
+    icon: "🛡️", color: "coral",
+    items: [
+      "Risques pour la santé",
+      "EPI à porter",
+      "Risques environnement / dispersion accidentelle",
+      "DL50 substance(s) active(s)",
+      "Gestes de premiers secours",
+    ]
+  },
+];
+
+const ALL_SECTIONS = THEMES.flatMap(t => t.items);
+
+const COLOR_MAP = {
+  purple: { bg: "var(--purple-light)", fg: "var(--purple)" },
+  blue:   { bg: "var(--blue-light)",   fg: "var(--blue)" },
+  teal:   { bg: "var(--teal-light)",   fg: "var(--teal)" },
+  coral:  { bg: "var(--coral-light)",  fg: "var(--coral)" },
+};
+
+function escapeRx(s) { return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); }
+function escapeHtml(s) {
+  if (!s) return "";
+  return s.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");
+}
+function isEmpty(v) {
+  if (!v) return true;
+  const t = v.trim();
+  return t === "" || /^\(sans réponse\)$/i.test(t);
+}
+
+function captureBetween(text, label, nextLabels) {
+  const startRx = new RegExp(escapeRx(label) + "\\s*:?\\s*", "i");
+  const m = startRx.exec(text);
+  if (!m) return "";
+  const from = m.index + m[0].length;
+  let to = text.length;
+  for (const nl of nextLabels) {
+    const endRx = new RegExp(escapeRx(nl), "i");
+    const m2 = endRx.exec(text.slice(from));
+    if (m2 && from + m2.index < to) to = from + m2.index;
+  }
+  return text.slice(from, to).trim();
+}
+
+function parsePdfText(raw) {
+  let clean = raw.replace(/\r/g, "").replace(/[ \t]+\n/g, "\n").replace(/\s+/g, " ").trim();
+  // Retire les répétitions d'en-tête de page (ex: "17/06/2026 15:42 Résultats TP — ... about:blank 1/2")
+  clean = clean.replace(/\d{1,2}\/\d{1,2}\/\d{4}\s+\d{1,2}:\d{2}\s+Résultats TP[^]*?about:blank\s*\d\/\d/gi, " ");
+
+  const meta = {
+    nom: captureBetween(clean, "Groupe / Stagiaire", ["Date de session"]),
+    date_session: captureBetween(clean, "Date de session", ["Formateur"]),
+    formateur: captureBetween(clean, "Formateur", ["Cas pratique"]),
+    cas: captureBetween(clean, "Cas pratique", ["Réponses TP1"]),
+  };
+
+  // Sépare "Groupe N" du nom des participants (ex: "Groupe 1 Romain Kevin Valere Greg P")
+  const groupMatch = /^Groupe\s*(\d+)\s*(.*)$/i.exec(meta.nom.trim());
+  if (groupMatch) {
+    meta.groupe = "Groupe " + groupMatch[1];
+    meta.participants = groupMatch[2].trim();
+  } else {
+    meta.groupe = "";
+    meta.participants = meta.nom.trim();
+  }
+
+  const startIdx = clean.search(/Réponses TP1\s*&?\s*TP2/i);
+  const endIdx = clean.search(/TP3\s*[—-]\s*Analyse de risques/i);
+  const block = startIdx >= 0 ? clean.slice(startIdx, endIdx >= 0 ? endIdx : clean.length) : clean;
+
+  const answers = {};
+  for (let i = 0; i < ALL_SECTIONS.length; i++) {
+    const label = ALL_SECTIONS[i];
+    const nextLabel = ALL_SECTIONS[i + 1];
+    answers[label] = captureBetween(block, label, nextLabel ? [nextLabel] : []);
+  }
+
+  const tp3Zone = endIdx >= 0 ? clean.slice(endIdx) : "";
+  const tp3 = {
+    intitule: captureBetween(tp3Zone, "Intitulé", ["Description"]),
+    description: captureBetween(tp3Zone, "Description", ["Lieu"]),
+    lieu: captureBetween(tp3Zone, "Lieu", ["Début prévu le"]),
+    debut: captureBetween(tp3Zone, "Début prévu le", ["Étapes"]),
+  };
+
+  // Tableau de risques : on découpe en s'appuyant sur les intitulés d'étapes connus du TP
+  const KNOWN_STEPS = [
+    "remplir la poudreuse",
+    "sécurisation du site",
+    "application traitements",
+    "rangement du matériel. purger la perche",
+    "retrait du nid",
+    "gestion des déchets. élimination par des filiaires spé.",
+  ];
+  let riskRows = [];
+  const tableMatch = /Étapes\s*Risques\s*Mesures de prévention([\s\S]*?)(Réalisée par|$)/i.exec(tp3Zone);
+  if (tableMatch) {
+    let raw = tableMatch[1].trim();
+    if (raw) {
+      // Repère les positions de chaque étape connue dans le texte aplati
+      const positions = [];
+      KNOWN_STEPS.forEach(step => {
+        const idx = raw.toLowerCase().indexOf(step.toLowerCase());
+        if (idx >= 0) positions.push({ step, idx });
+      });
+      positions.sort((a, b) => a.idx - b.idx);
+
+      if (positions.length > 0) {
+        for (let i = 0; i < positions.length; i++) {
+          const from = positions[i].idx + positions[i].step.length;
+          const to = i + 1 < positions.length ? positions[i + 1].idx : raw.length;
+          let rest = raw.slice(from, to).trim();
+          // rest contient "risque... mesure..." -> on coupe sur les mots clés de mesures (gants/masques, barrieres, etc.)
+          const measureRx = /(gants\s*\/\s*masques\s*\/\s*lunettes[^.]*|barrieres\.?\s*epi)/i;
+          const mm = measureRx.exec(rest);
+          let risque = rest, mesure = "";
+          if (mm) {
+            risque = rest.slice(0, mm.index).trim();
+            mesure = rest.slice(mm.index).trim();
+          }
+          risque = risque.replace(/^[\s\-–.]+/, "").trim();
+          riskRows.push({ etape: positions[i].step, risque: risque || "—", mesure: mesure || "—" });
+        }
+      } else {
+        riskRows.push({ etape: raw, risque: "", mesure: "" });
+      }
+    }
+  }
+
+  const mReal = clean.match(/Réalisée par\s*:\s*([^—\n]*)/i);
+  const mVerif = clean.match(/Vérifiée par\s*:\s*([^—\n]*)/i);
+  const mMaj = clean.match(/Mise à jour par\s*:\s*([^—\n]*)/i);
+
+  return {
+    meta, answers, tp3, riskRows,
+    suivi: {
+      realise: mReal ? mReal[1].trim() : "",
+      verifie: mVerif ? mVerif[1].trim() : "",
+      maj: mMaj ? mMaj[1].trim() : "",
+    }
+  };
+}
+
+let currentThemeData = null;
+let currentTheme = 0;
+
+function renderThemePanel() {
+  const theme = THEMES[currentTheme];
+  const data = currentThemeData;
+  const colors = COLOR_MAP[theme.color];
+  const themeAnswered = theme.items.filter(s => !isEmpty(data.answers[s])).length;
+
+  document.getElementById("themePanel").innerHTML = `
+    <div class="theme-panel">
+      <div class="theme-head">
+        <div class="theme-icon" style="background:${colors.bg};color:${colors.fg};">${theme.icon}</div>
+        <div class="theme-title">${theme.title}</div>
+        <div class="theme-count">${themeAnswered}/${theme.items.length}</div>
+      </div>
+      <div class="cards">
+        ${theme.items.map(label => {
+          const value = data.answers[label] || "";
+          const empty = isEmpty(value);
+          return `
+            <div class="qcard">
+              <div class="badge ${empty ? 'miss' : 'ok'}">${empty ? '!' : '✓'}</div>
+              <div class="qtext">
+                <div class="qlabel">${escapeHtml(label)}</div>
+                <div class="qanswer ${empty ? 'empty' : ''}">${empty ? 'Sans réponse' : escapeHtml(value)}</div>
+              </div>
+            </div>
+          `;
+        }).join("")}
+      </div>
+    </div>
+  `;
+
+  document.getElementById("prevBtn").disabled = currentTheme === 0;
+  document.getElementById("nextBtn").disabled = currentTheme === THEMES.length - 1;
+  document.querySelectorAll(".dot").forEach((d, i) => d.classList.toggle("active", i === currentTheme));
+}
+
+function goTo(idx) {
+  if (idx < 0 || idx >= THEMES.length) return;
+  currentTheme = idx;
+  renderThemePanel();
+}
+
+function renderResult(data) {
+  currentThemeData = data;
+  currentTheme = 0;
+
+  const banner = document.getElementById("participantsBanner");
+  if (data.meta.participants) {
+    banner.style.display = "flex";
+    banner.innerHTML = `
+      <div class="pb-icon">👥</div>
+      <div>
+        <div class="pb-group">${escapeHtml(data.meta.groupe) || "Participants"}</div>
+        <div class="pb-names">${escapeHtml(data.meta.participants)}</div>
+      </div>
+    `;
+  } else {
+    banner.style.display = "none";
+  }
+
+  document.getElementById("idCard").innerHTML = `
+    <div><div class="label">Groupe / Stagiaire</div><div class="value">${escapeHtml(data.meta.nom) || "—"}</div></div>
+    <div><div class="label">Date de session</div><div class="value">${escapeHtml(data.meta.date_session) || "—"}</div></div>
+    <div><div class="label">Formateur</div><div class="value">${escapeHtml(data.meta.formateur) || "—"}</div></div>
+    <div><div class="label">Cas pratique</div><div class="value">${escapeHtml(data.meta.cas) || "—"}</div></div>
+  `;
+
+  const answeredCount = ALL_SECTIONS.filter(s => !isEmpty(data.answers[s])).length;
+  document.getElementById("progressFill").style.width = (answeredCount / ALL_SECTIONS.length * 100) + "%";
+  document.getElementById("progressCount").textContent = `${answeredCount} / ${ALL_SECTIONS.length}`;
+
+  document.getElementById("dots").innerHTML = THEMES.map((_, i) =>
+    `<div class="dot${i === 0 ? ' active' : ''}" onclick="goTo(${i})"></div>`
+  ).join("");
+
+  renderThemePanel();
+
+  document.getElementById("tp3Meta").innerHTML = `
+    <p style="margin-bottom:6px;"><strong>Intitulé :</strong> ${escapeHtml(data.tp3.intitule) || '<em style="color:var(--coral)">—</em>'}</p>
+    <p style="margin-bottom:6px;"><strong>Description :</strong> ${escapeHtml(data.tp3.description) || '<em style="color:var(--coral)">—</em>'}</p>
+    <p style="margin-bottom:6px;"><strong>Lieu :</strong> ${escapeHtml(data.tp3.lieu) || '<em style="color:var(--coral)">—</em>'}</p>
+    <p><strong>Début prévu le :</strong> ${escapeHtml(data.tp3.debut) || '<em style="color:var(--coral)">—</em>'}</p>
+  `;
+
+  const tp3TableEl = document.getElementById("tp3Table");
+  if (data.riskRows && data.riskRows.length > 0) {
+    tp3TableEl.style.display = "block";
+    tp3TableEl.innerHTML = `
+      <table class="risk-table">
+        <thead><tr><th>Étapes</th><th>Risques</th><th>Mesures de prévention</th></tr></thead>
+        <tbody>
+          ${data.riskRows.map(r => `
+            <tr>
+              <td>${escapeHtml(r.etape) || "—"}</td>
+              <td>${escapeHtml(r.risque) || "—"}</td>
+              <td>${escapeHtml(r.mesure) || "—"}</td>
+            </tr>
+          `).join("")}
+        </tbody>
+      </table>
+    `;
+  } else {
+    tp3TableEl.style.display = "none";
+  }
+
+  document.getElementById("suiviLine").innerHTML =
+    `Réalisée par : <strong>${escapeHtml(data.suivi.realise) || "—"}</strong> — Vérifiée par : <strong>${escapeHtml(data.suivi.verifie) || "—"}</strong> — Mise à jour par : <strong>${escapeHtml(data.suivi.maj) || "—"}</strong>`;
+
+  document.getElementById("dropzone").style.display = "none";
+  document.getElementById("result").style.display = "block";
+}
+
+async function handleFile(file) {
+  if (!file) return;
+  const statusEl = document.getElementById("status");
+  statusEl.className = "loading";
+  statusEl.textContent = "Lecture du PDF en cours…";
+  document.getElementById("fileName").textContent = file.name;
+
+  try {
+    const arrayBuffer = await file.arrayBuffer();
+    const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
+    let fullText = "";
+    for (let p = 1; p <= pdf.numPages; p++) {
+      const page = await pdf.getPage(p);
+      const content = await page.getTextContent();
+      fullText += content.items.map(it => it.str).join(" ") + "\n";
+    }
+    const data = parsePdfText(fullText);
+    renderResult(data);
+    statusEl.textContent = "";
+  } catch (e) {
+    console.error(e);
+    statusEl.className = "error";
+    statusEl.textContent = "Impossible de lire ce PDF. Vérifiez qu'il s'agit bien d'un export du TP.";
+  }
+}
+
+function resetAll() {
+  document.getElementById("result").style.display = "none";
+  document.getElementById("dropzone").style.display = "block";
+  document.getElementById("participantsBanner").style.display = "none";
+  document.getElementById("status").textContent = "";
+  document.getElementById("filePicker").value = "";
+  document.getElementById("tp3Table").style.display = "none";
+}
+
+const dropzone = document.getElementById("dropzone");
+dropzone.addEventListener("dragover", e => { e.preventDefault(); dropzone.classList.add("drag"); });
+dropzone.addEventListener("dragleave", () => dropzone.classList.remove("drag"));
+dropzone.addEventListener("drop", e => {
+  e.preventDefault();
+  dropzone.classList.remove("drag");
+  const file = e.dataTransfer.files?.[0];
+  if (file) handleFile(file);
+});
+document.getElementById("filePicker").addEventListener("change", e => handleFile(e.target.files?.[0]));
+</script>
+</body>
+</html>
--- a/exercices/corriger-exercice.html
+++ b/exercices/corriger-exercice.html
--- a/exercices/memory-pictogrammes/api/README.md
+++ b/exercices/memory-pictogrammes/api/README.md
@@ -0,0 +1,55 @@
+# API du classement Memory (ASP.NET + SQL Server)
+
+Petit service **ASP.NET (C#) + SQL Server** qui héberge en ligne le
+**classement partagé** du jeu Memory. Tous les joueurs enregistrent leurs
+scores au même endroit et voient le même top 10 par mode (facile / normal /
+difficile).
+
+> Adapté à l'hébergement **FreeASPHosting.net / bsite.net** (Windows, IIS,
+> base MSSQL 2016). Le fichier `scores.ashx` est compilé au vol par IIS :
+> **aucune étape de build**, il suffit de le déposer.
+
+## Contenu
+
+| Fichier | Rôle |
+|---|---|
+| `scores.ashx` | Point d'entrée de l'API (GET pour lire, POST pour enregistrer). Crée la table automatiquement au premier appel. |
+| `web.config.example` | Modèle de configuration à copier en `web.config`. |
+| `web.config` | **À créer sur le serveur** avec le mot de passe SQL Server (clé `MemoryDb`). Non versionné. |
+| `README.md` | Ce fichier. |
+
+## Installation sur bsite.net
+
+1. **Récupérer le mot de passe** de la base dans le panneau
+   *Manage Databases*. La base existe déjà :
+   - Serveur : `sql.bsite.net\MSSQL2016`
+   - Base / utilisateur : `nextgnformation_reponses_exercices`
+
+2. **Créer `web.config`** à partir du modèle (`cp web.config.example web.config`),
+   puis remplacer `VOTRE_MOT_DE_PASSE` par le mot de passe réel dans la clé
+   `MemoryDb`.
+
+3. **Déposer le dossier `api/`** via *My Files*, au même endroit que
+   `memory.html` (chemin attendu par le jeu :
+   `exercices/memory-pictogrammes/api/scores.ashx`).
+
+4. C'est prêt : au premier score enregistré (ou premier appel GET), la table
+   `memory_scores` est créée automatiquement.
+
+## Vérification rapide
+
+- Lecture du classement :
+  `GET https://nextgnformation.bsite.net/exercices/memory-pictogrammes/api/scores.ashx?difficulty=all`
+  doit renvoyer `{"ok":true,"scores":[...]}`.
+
+- Seuls les 10 meilleurs de chaque mode sont conservés : après chaque
+  enregistrement, les scores hors top 10 du mode concerné sont supprimés.
+
+## Points d'attention
+
+- **Ne poussez jamais `web.config` avec le vrai mot de passe dans un dépôt
+  public.** Éditez-le directement sur le serveur via *My Files*.
+- Les statistiques personnelles (« Vos statistiques ») restent stockées
+  localement dans le navigateur de chaque joueur ; seul le classement est en ligne.
+- Le score étant calculé côté navigateur, l'API valide les types et les bornes
+  mais ne garantit pas l'absence de triche (recalcul serveur possible plus tard).
--- a/exercices/memory-pictogrammes/api/scores.ashx
+++ b/exercices/memory-pictogrammes/api/scores.ashx
@@ -0,0 +1,329 @@
+<%@ WebHandler Language="C#" Class="ScoresHandler" %>
+/*
+ * API du classement Memory (pictogrammes de sécurité) — ASP.NET + SQL Server.
+ *
+ *   GET  scores.ashx?difficulty=easy|normal|hard|all[&limit=10]
+ *        -> renvoie le classement (top N) trié par score décroissant.
+ *
+ *   POST scores.ashx   (corps JSON)
+ *        { playerName, userId, score, moves, timeSeconds, difficulty, isPerfect }
+ *        -> enregistre le score, ne conserve que le top N par difficulté,
+ *           renvoie { ok, saved, rank, isTop }.
+ *
+ * Seul le top N (défaut 10) de chaque mode est conservé : les scores plus
+ * faibles sont supprimés après chaque insertion.
+ *
+ * Fichier compilé au vol par IIS : il suffit de le déposer, aucune build.
+ * La chaîne de connexion est lue dans web.config (clé "MemoryDb").
+ */
+
+using System;
+using System.Collections.Generic;
+using System.Data;
+using System.Data.SqlClient;
+using System.IO;
+using System.Text;
+using System.Web;
+using System.Web.Configuration;
+using System.Web.Script.Serialization;
+
+public class ScoresHandler : IHttpHandler
+{
+    static readonly string[] Difficulties = { "easy", "normal", "hard" };
+    const int TopN = 10;
+
+    public bool IsReusable { get { return false; } }
+
+    public void ProcessRequest(HttpContext ctx)
+    {
+        ctx.Response.ContentType = "application/json; charset=utf-8";
+        ctx.Response.AddHeader("X-Content-Type-Options", "nosniff");
+
+        var connString = WebConfigurationManager.ConnectionStrings["MemoryDb"] != null
+            ? WebConfigurationManager.ConnectionStrings["MemoryDb"].ConnectionString
+            : null;
+
+        if (string.IsNullOrEmpty(connString))
+        {
+            Fail(ctx, 500, "Configuration manquante (connectionString 'MemoryDb' dans web.config).");
+            return;
+        }
+
+        try
+        {
+            using (var conn = new SqlConnection(connString))
+            {
+                conn.Open();
+                EnsureTable(conn);
+
+                if (ctx.Request.HttpMethod == "GET")
+                {
+                    HandleGet(ctx, conn);
+                }
+                else if (ctx.Request.HttpMethod == "POST")
+                {
+                    HandlePost(ctx, conn);
+                }
+                else
+                {
+                    ctx.Response.StatusCode = 405;
+                    ctx.Response.AddHeader("Allow", "GET, POST");
+                    Write(ctx, new Dictionary<string, object> {
+                        { "ok", false }, { "error", "Méthode non autorisée." }
+                    });
+                }
+            }
+        }
+        catch (Exception)
+        {
+            Fail(ctx, 500, "Erreur serveur.");
+        }
+    }
+
+    // --- Création de la table si besoin -------------------------------------
+    void EnsureTable(SqlConnection conn)
+    {
+        const string sql =
+            "IF NOT EXISTS (SELECT 1 FROM sys.tables WHERE name = 'memory_scores') " +
+            "CREATE TABLE memory_scores (" +
+            "  id INT IDENTITY(1,1) PRIMARY KEY," +
+            "  player_name NVARCHAR(40) NOT NULL," +
+            "  user_id NVARCHAR(64) NOT NULL," +
+            "  score INT NOT NULL," +
+            "  moves INT NOT NULL," +
+            "  time_seconds INT NOT NULL," +
+            "  difficulty NVARCHAR(16) NOT NULL," +
+            "  is_perfect BIT NOT NULL DEFAULT 0," +
+            "  created_at DATETIME NOT NULL" +
+            ");";
+        using (var cmd = new SqlCommand(sql, conn)) { cmd.ExecuteNonQuery(); }
+    }
+
+    // --- GET : renvoie le classement ----------------------------------------
+    void HandleGet(HttpContext ctx, SqlConnection conn)
+    {
+        var difficulty = (ctx.Request.QueryString["difficulty"] ?? "all").Trim();
+        int limit;
+        if (!int.TryParse(ctx.Request.QueryString["limit"], out limit)) limit = TopN;
+        if (limit < 1) limit = 1;
+        if (limit > TopN) limit = TopN;
+
+        var rows = new List<Dictionary<string, object>>();
+
+        if (difficulty == "all")
+        {
+            foreach (var diff in Difficulties)
+                rows.AddRange(FetchTop(conn, diff, TopN));
+
+            rows.Sort(CompareRows);
+            if (rows.Count > limit) rows = rows.GetRange(0, limit);
+        }
+        else
+        {
+            if (Array.IndexOf(Difficulties, difficulty) < 0)
+            {
+                Fail(ctx, 400, "Difficulté inconnue.");
+                return;
+            }
+            rows = FetchTop(conn, difficulty, limit);
+        }
+
+        Write(ctx, new Dictionary<string, object> { { "ok", true }, { "scores", rows } });
+    }
+
+    // --- POST : enregistre un score puis élague au top N --------------------
+    void HandlePost(HttpContext ctx, SqlConnection conn)
+    {
+        string body;
+        using (var reader = new StreamReader(ctx.Request.InputStream, Encoding.UTF8))
+            body = reader.ReadToEnd();
+
+        Dictionary<string, object> data = null;
+        try { data = new JavaScriptSerializer().Deserialize<Dictionary<string, object>>(body); }
+        catch { data = null; }
+
+        if (data == null)
+        {
+            Fail(ctx, 400, "Corps JSON invalide.");
+            return;
+        }
+
+        var difficulty = Str(data, "difficulty");
+        if (Array.IndexOf(Difficulties, difficulty) < 0)
+        {
+            Fail(ctx, 400, "Difficulté inconnue.");
+            return;
+        }
+
+        // Nettoyage / bornage des entrées
+        var playerName = Str(data, "playerName").Trim();
+        playerName = StripControlChars(playerName);
+        if (playerName.Length == 0) playerName = "Anonyme";
+        if (playerName.Length > 40) playerName = playerName.Substring(0, 40);
+
+        var userId = OnlyIdChars(Str(data, "userId"));
+        if (userId.Length > 64) userId = userId.Substring(0, 64);
+        if (userId.Length == 0) userId = "anon";
+
+        int score = Clamp(Int(data, "score"), 0, 100000000);
+        int moves = Clamp(Int(data, "moves"), 0, 100000);
+        int time = Clamp(Int(data, "timeSeconds"), 0, 1000000);
+        int isPerfect = Bool(data, "isPerfect") ? 1 : 0;
+
+        int insertedId;
+        using (var cmd = new SqlCommand(
+            "INSERT INTO memory_scores " +
+            "(player_name, user_id, score, moves, time_seconds, difficulty, is_perfect, created_at) " +
+            "OUTPUT INSERTED.id " +
+            "VALUES (@name, @uid, @score, @moves, @time, @diff, @perfect, GETUTCDATE())", conn))
+        {
+            cmd.Parameters.Add("@name", SqlDbType.NVarChar, 40).Value = playerName;
+            cmd.Parameters.Add("@uid", SqlDbType.NVarChar, 64).Value = userId;
+            cmd.Parameters.Add("@score", SqlDbType.Int).Value = score;
+            cmd.Parameters.Add("@moves", SqlDbType.Int).Value = moves;
+            cmd.Parameters.Add("@time", SqlDbType.Int).Value = time;
+            cmd.Parameters.Add("@diff", SqlDbType.NVarChar, 16).Value = difficulty;
+            cmd.Parameters.Add("@perfect", SqlDbType.Bit).Value = isPerfect;
+            insertedId = (int)cmd.ExecuteScalar();
+        }
+
+        // Ne conserver que le top N pour ce mode
+        using (var cmd = new SqlCommand(
+            "WITH ranked AS (" +
+            "  SELECT id, ROW_NUMBER() OVER (" +
+            "    PARTITION BY difficulty ORDER BY score DESC, time_seconds ASC, id ASC) AS rn" +
+            "  FROM memory_scores WHERE difficulty = @diff" +
+            ") DELETE FROM memory_scores WHERE id IN (SELECT id FROM ranked WHERE rn > @topN)", conn))
+        {
+            cmd.Parameters.Add("@diff", SqlDbType.NVarChar, 16).Value = difficulty;
+            cmd.Parameters.Add("@topN", SqlDbType.Int).Value = TopN;
+            cmd.ExecuteNonQuery();
+        }
+
+        // Le score inséré a-t-il survécu à l'élagage ? Quel rang ?
+        var top = FetchTop(conn, difficulty, TopN);
+        int? rank = null;
+        for (int i = 0; i < top.Count; i++)
+        {
+            if ((int)top[i]["id"] == insertedId) { rank = i + 1; break; }
+        }
+
+        Write(ctx, new Dictionary<string, object> {
+            { "ok", true },
+            { "saved", true },
+            { "isTop", rank.HasValue },
+            { "rank", rank.HasValue ? (object)rank.Value : null }
+        });
+    }
+
+    // --- Accès données -------------------------------------------------------
+    List<Dictionary<string, object>> FetchTop(SqlConnection conn, string difficulty, int limit)
+    {
+        var result = new List<Dictionary<string, object>>();
+        using (var cmd = new SqlCommand(
+            "SELECT TOP (@limit) id, player_name, user_id, score, moves, time_seconds, " +
+            "difficulty, is_perfect, created_at " +
+            "FROM memory_scores WHERE difficulty = @diff " +
+            "ORDER BY score DESC, time_seconds ASC, id ASC", conn))
+        {
+            cmd.Parameters.Add("@limit", SqlDbType.Int).Value = limit;
+            cmd.Parameters.Add("@diff", SqlDbType.NVarChar, 16).Value = difficulty;
+            using (var r = cmd.ExecuteReader())
+            {
+                while (r.Read())
+                {
+                    result.Add(new Dictionary<string, object> {
+                        { "id", (int)r["id"] },
+                        { "playerName", r["player_name"].ToString() },
+                        { "userId", r["user_id"].ToString() },
+                        { "score", (int)r["score"] },
+                        { "moves", (int)r["moves"] },
+                        { "timeSeconds", (int)r["time_seconds"] },
+                        { "difficulty", r["difficulty"].ToString() },
+                        { "isPerfect", Convert.ToBoolean(r["is_perfect"]) },
+                        { "date", ((DateTime)r["created_at"]).ToString("yyyy-MM-ddTHH:mm:ss") + "Z" }
+                    });
+                }
+            }
+        }
+        return result;
+    }
+
+    int CompareRows(Dictionary<string, object> a, Dictionary<string, object> b)
+    {
+        int sa = (int)a["score"], sb = (int)b["score"];
+        if (sa != sb) return sb - sa;
+        return (int)a["timeSeconds"] - (int)b["timeSeconds"];
+    }
+
+    // --- Sérialisation / helpers --------------------------------------------
+    void Write(HttpContext ctx, object payload)
+    {
+        // On retire la clé "id" (interne) des lignes avant l'envoi.
+        var scrubbed = Scrub(payload);
+        ctx.Response.Write(new JavaScriptSerializer().Serialize(scrubbed));
+    }
+
+    object Scrub(object payload)
+    {
+        var dict = payload as Dictionary<string, object>;
+        if (dict != null && dict.ContainsKey("scores"))
+        {
+            var list = dict["scores"] as List<Dictionary<string, object>>;
+            if (list != null)
+                foreach (var row in list) row.Remove("id");
+        }
+        return payload;
+    }
+
+    void Fail(HttpContext ctx, int status, string message)
+    {
+        ctx.Response.StatusCode = status;
+        ctx.Response.Write(new JavaScriptSerializer().Serialize(
+            new Dictionary<string, object> { { "ok", false }, { "error", message } }));
+    }
+
+    static string Str(Dictionary<string, object> d, string key)
+    {
+        object v; return (d.TryGetValue(key, out v) && v != null) ? v.ToString() : "";
+    }
+
+    static int Int(Dictionary<string, object> d, string key)
+    {
+        object v; int n;
+        if (d.TryGetValue(key, out v) && v != null && int.TryParse(v.ToString(), out n)) return n;
+        return 0;
+    }
+
+    static bool Bool(Dictionary<string, object> d, string key)
+    {
+        object v;
+        if (!d.TryGetValue(key, out v) || v == null) return false;
+        if (v is bool) return (bool)v;
+        var s = v.ToString().ToLowerInvariant();
+        return s == "true" || s == "1";
+    }
+
+    static int Clamp(int value, int min, int max)
+    {
+        if (value < min) return min;
+        if (value > max) return max;
+        return value;
+    }
+
+    static string StripControlChars(string s)
+    {
+        var sb = new StringBuilder(s.Length);
+        foreach (var c in s) if (!char.IsControl(c)) sb.Append(c);
+        return sb.ToString();
+    }
+
+    static string OnlyIdChars(string s)
+    {
+        var sb = new StringBuilder(s.Length);
+        foreach (var c in s)
+            if ((c >= 'A' && c <= 'Z') || (c >= 'a' && c <= 'z') || (c >= '0' && c <= '9') || c == '-')
+                sb.Append(c);
+        return sb.ToString();
+    }
+}
--- a/exercices/memory-pictogrammes/api/web.config.example
+++ b/exercices/memory-pictogrammes/api/web.config.example
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<configuration>
+  <!--
+    MODÈLE de configuration. Sur le serveur bsite.net :
+      1. Copiez ce fichier en « web.config ».
+      2. Renseignez le mot de passe fourni par le panneau « Manage Databases ».
+
+    Le vrai « web.config » n'est PAS versionné (voir .gitignore) afin de ne
+    jamais exposer le mot de passe dans l'historique Git.
+  -->
+  <connectionStrings>
+    <add name="MemoryDb"
+         connectionString="Server=sql.bsite.net\MSSQL2016;Database=nextgnformation_reponses_exercices;User Id=nextgnformation_reponses_exercices;Password=VOTRE_MOT_DE_PASSE;"
+         providerName="System.Data.SqlClient" />
+  </connectionStrings>
+</configuration>
--- a/exercices/memory-pictogrammes/assets/css/leaderboard.css
+++ b/exercices/memory-pictogrammes/assets/css/leaderboard.css
@@ -93,6 +93,13 @@
    overflow: hidden;
 }

+/* Ligne du joueur courant dans le classement */
+.rank-item.is-me {
+    border-left-color: var(--amber-dark);
+    background: linear-gradient(135deg, var(--amber-light), var(--white));
+    box-shadow: 0 2px 8px rgba(186, 117, 23, 0.15);
+}
+
 .rank-top {
    display: flex;
    align-items: center;
--- a/exercices/memory-pictogrammes/assets/js/leaderboard.js
+++ b/exercices/memory-pictogrammes/assets/js/leaderboard.js
@@ -1,90 +1,114 @@
 /* ============================================
   LEADERBOARD & PLAYER STATISTICS
+   ============================================
+   Le CLASSEMENT est désormais partagé EN LIGNE : tous les joueurs
+   enregistrent leurs scores via l'API PHP (api/scores.php) et voient le
+   même top 10 par mode de jeu.
+
+   Les STATISTIQUES PERSONNELLES (« Vos statistiques ») restent stockées
+   localement dans le navigateur du joueur, car le serveur ne conserve que
+   le top 10 de chaque mode (et non l'historique complet de chacun).
   ============================================ */

 /**
 * Manager du classement
 */
 class LeaderboardManager {
-    static KEY_LEADERBOARD = 'nextgn_leaderboard';
-    static MAX_SCORES = 100;
-    
+    // Point d'entrée de l'API (relatif à memory.html) — ASP.NET + SQL Server
+    static API_URL = 'api/scores.ashx';
+    // Historique local des parties du joueur (pour ses stats perso)
+    static KEY_HISTORY = 'nextgn_player_history';
+    static MAX_HISTORY = 500;
+
+    // Cache mémoire du dernier classement récupéré (par difficulté)
+    static _cache = {};
+
    /**
-     * Ajouter un score au classement
+     * Enregistrer une partie :
+     *  - envoie le score au classement en ligne
+     *  - conserve la partie dans l'historique local (stats perso)
+     * @returns {Promise<Object>} résultat de l'API ({ ok, isTop, rank } ou { ok:false })
     */
-    static addScore(gameData) {
-        const scores = this.getAllScores();
-        
-        const newScore = {
-            sessionId: generateUUID(),
+    static async addScore(gameData) {
+        const record = {
            playerName: getPlayerName(),
            userId: getUserId(),
            score: gameData.score,
            moves: gameData.moves,
            timeSeconds: gameData.duration,
            difficulty: gameData.difficulty,
-            date: new Date().toISOString(),
            isPerfect: gameData.moves === DIFFICULTY_MODES[gameData.difficulty].paires,
-            won: gameData.won !== false
+            won: gameData.won !== false,
+            date: new Date().toISOString()
        };
-        
-        scores.push(newScore);
-        
-        // Limiter à MAX_SCORES (garder les plus récents)
-        if (scores.length > this.MAX_SCORES) {
-            scores.sort((a, b) => new Date(b.date) - new Date(a.date));
-            scores.splice(this.MAX_SCORES);
-        }
-        
-        localStorage.setItem(this.KEY_LEADERBOARD, JSON.stringify(scores));
-        
-        DEBUG.log('Score added:', newScore);
-        
-        return newScore;
-    }
-    
-    /**
-     * Obtenir tous les scores
-     */
-    static getAllScores() {
+
+        // 1) Historique local (statistiques personnelles)
+        this._recordLocalHistory(record);
+
+        // 2) Classement en ligne
        try {
-            const scores = JSON.parse(localStorage.getItem(this.KEY_LEADERBOARD)) || [];
-            return scores;
+            const res = await fetch(this.API_URL, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify(record)
+            });
+            const data = await res.json();
+            DEBUG.log('Score submitted:', data);
+            return data;
+        } catch (e) {
+            console.error('Leaderboard submit error:', e);
+            return { ok: false, error: 'network' };
+        }
+    }
+
+    /**
+     * Ajouter la partie à l'historique local du joueur
+     */
+    static _recordLocalHistory(record) {
+        const history = this._getLocalHistory();
+        history.push(record);
+        if (history.length > this.MAX_HISTORY) {
+            history.splice(0, history.length - this.MAX_HISTORY);
+        }
+        try {
+            localStorage.setItem(this.KEY_HISTORY, JSON.stringify(history));
+        } catch (e) {
+            console.error('History save error:', e);
+        }
+    }
+
+    /**
+     * Historique local des parties du joueur
+     */
+    static _getLocalHistory() {
+        try {
+            return JSON.parse(localStorage.getItem(this.KEY_HISTORY)) || [];
        } catch (e) {
-            console.error('Leaderboard error:', e);
            return [];
        }
    }
-    
+
    /**
-     * Obtenir le classement (top X)
+     * Récupérer le classement en ligne (top X) pour un mode donné.
+     * @returns {Promise<Array>}
     */
-    static getLeaderboard(difficulty = 'all', limit = 10) {
-        let scores = this.getAllScores();
-        
-        // Filtrer par difficulté
-        if (difficulty !== 'all') {
-            scores = scores.filter(s => s.difficulty === difficulty);
+    static async getLeaderboard(difficulty = 'all', limit = 10) {
+        const url = `${this.API_URL}?difficulty=${encodeURIComponent(difficulty)}&limit=${limit}`;
+        const res = await fetch(url, { headers: { 'Accept': 'application/json' } });
+        const data = await res.json();
+        if (!data || data.ok !== true || !Array.isArray(data.scores)) {
+            throw new Error('Réponse invalide du serveur');
        }
-        
-        // Trier par score (décroissant)
-        scores.sort((a, b) => {
-            if (b.score !== a.score) {
-                return b.score - a.score;
-            }
-            // En cas d'égalité, par temps
-            return a.timeSeconds - b.timeSeconds;
-        });
-        
-        return scores.slice(0, limit);
+        this._cache[difficulty] = data.scores;
+        return data.scores;
    }
-    
+
    /**
-     * Obtenir les stats d'un joueur
+     * Statistiques du joueur, calculées à partir de son historique LOCAL.
     */
-    static getPlayerStats(userId) {
-        const scores = this.getAllScores().filter(s => s.userId === userId);
-        
+    static getPlayerStats() {
+        const scores = this._getLocalHistory();
+
        if (scores.length === 0) {
            return {
                totalGames: 0,
@@ -96,14 +120,14 @@ class LeaderboardManager {
                perfectGames: 0
            };
        }
-        
+
        const bestScore = Math.max(...scores.map(s => s.score), 0);
        const totalScore = scores.reduce((a, b) => a + b.score, 0);
        const totalTime = scores.reduce((a, b) => a + b.timeSeconds, 0);
        const bestTime = Math.min(...scores.map(s => s.timeSeconds), Infinity);
        const perfectGames = scores.filter(s => s.isPerfect).length;
        const winRate = (perfectGames / scores.length) * 100;
-        
+
        return {
            totalGames: scores.length,
            bestScore: bestScore,
@@ -114,63 +138,37 @@ class LeaderboardManager {
            perfectGames: perfectGames
        };
    }
-    
+
    /**
-     * Obtenir le rang d'un score
+     * Mettre à jour l'affichage du classement (asynchrone).
     */
-    static getPlayerRank(userId, difficulty = 'all') {
-        const leaderboard = this.getLeaderboard(difficulty, Infinity);
-        const rank = leaderboard.findIndex(s => s.userId === userId) + 1;
-        return rank > 0 ? rank : null;
-    }
-    
-    /**
-     * Vérifier si c'est un nouveau record personnel
-     */
-    static isPersonalRecord(userId, newScore) {
-        const stats = this.getPlayerStats(userId);
-        return newScore > stats.bestScore;
-    }
-    
-    /**
-     * Obtenir les statistiques globales
-     */
-    static getGlobalStats() {
-        const scores = this.getAllScores();
-        
-        if (scores.length === 0) {
-            return {
-                totalGames: 0,
-                totalPlayers: 0,
-                averageScore: 0,
-                highestScore: 0,
-                fastestCompletion: Infinity
-            };
-        }
-        
-        const uniquePlayers = new Set(scores.map(s => s.userId));
-        const totalScore = scores.reduce((a, b) => a + b.score, 0);
-        const highestScore = Math.max(...scores.map(s => s.score), 0);
-        const fastestCompletion = Math.min(...scores.map(s => s.timeSeconds), Infinity);
-        
-        return {
-            totalGames: scores.length,
-            totalPlayers: uniquePlayers.size,
-            averageScore: Math.round(totalScore / scores.length),
-            highestScore: highestScore,
-            fastestCompletion: fastestCompletion === Infinity ? 0 : fastestCompletion
-        };
-    }
-    
-    /**
-     * Mettre à jour l'affichage du classement
-     */
-    static updateDisplay(difficulty = 'all') {
-        const leaderboard = this.getLeaderboard(difficulty, 10);
+    static async updateDisplay(difficulty = 'all') {
        const leaderboardList = document.getElementById('leaderboard-list');
-        
        if (!leaderboardList) return;
-        
+
+        // État de chargement
+        leaderboardList.innerHTML = `
+            <div class="empty-state">
+                <div class="empty-state-icon">⏳</div>
+                <div class="empty-state-text">Chargement du classement…</div>
+            </div>
+        `;
+
+        let leaderboard;
+        try {
+            leaderboard = await this.getLeaderboard(difficulty, 10);
+        } catch (e) {
+            console.error('Leaderboard load error:', e);
+            leaderboardList.innerHTML = `
+                <div class="empty-state">
+                    <div class="empty-state-icon">⚠️</div>
+                    <div class="empty-state-text">Classement indisponible</div>
+                    <div class="empty-state-hint">Vérifiez votre connexion et réessayez.</div>
+                </div>
+            `;
+            return;
+        }
+
        if (leaderboard.length === 0) {
            leaderboardList.innerHTML = `
                <div class="empty-state">
@@ -181,16 +179,20 @@ class LeaderboardManager {
            `;
            return;
        }
-        
+
+        const myUserId = getUserId();
        leaderboardList.innerHTML = '';
-        
+
        leaderboard.forEach((score, index) => {
            const rankItem = document.createElement('div');
            rankItem.className = 'rank-item';
-            
+            if (score.userId === myUserId) {
+                rankItem.classList.add('is-me');
+            }
+
            const rankNumber = this.getRankDisplay(index);
            const medal = index < 3 ? `class="rank-number medal-${index + 1}"` : 'class="rank-number"';
-            
+
            rankItem.innerHTML = `
                <div class="rank-top">
                    <div ${medal}>${rankNumber}</div>
@@ -205,96 +207,53 @@ class LeaderboardManager {
                    </div>
                </div>
            `;
-            
+
            leaderboardList.appendChild(rankItem);
        });
-        
-        analyticsManager.track('leaderboard_viewed', { filter: difficulty });
+
+        if (typeof analyticsManager !== 'undefined') {
+            analyticsManager.track('leaderboard_viewed', { filter: difficulty });
+        }
    }
-    
+
    /**
-     * Mettre à jour les statistiques du joueur
+     * Mettre à jour les statistiques du joueur (locales).
     */
    static updatePlayerStats() {
-        const userId = getUserId();
-        const stats = this.getPlayerStats(userId);
-        
-        // Remplir les éléments HTML
-        document.getElementById('total-games').textContent = stats.totalGames;
-        document.getElementById('best-score').textContent = formatNumber(stats.bestScore);
-        document.getElementById('best-time').textContent = stats.bestTime === Infinity ? '--' : formatTime(stats.bestTime);
-        document.getElementById('win-rate').textContent = `${stats.winRate}%`;
-        
-        // Ajouter des classes pour animation si valeurs élevées
-        if (stats.bestScore > 5000) {
-            document.getElementById('best-score').parentElement.classList.add('high-value');
+        const stats = this.getPlayerStats();
+
+        const totalGamesEl = document.getElementById('total-games');
+        const bestScoreEl = document.getElementById('best-score');
+        const bestTimeEl = document.getElementById('best-time');
+        const winRateEl = document.getElementById('win-rate');
+
+        if (totalGamesEl) totalGamesEl.textContent = stats.totalGames;
+        if (bestScoreEl) bestScoreEl.textContent = formatNumber(stats.bestScore);
+        if (bestTimeEl) bestTimeEl.textContent = stats.bestTime === Infinity || stats.bestTime === 0 ? '--' : formatTime(stats.bestTime);
+        if (winRateEl) winRateEl.textContent = `${stats.winRate}%`;
+
+        if (bestScoreEl && stats.bestScore > 5000) {
+            bestScoreEl.parentElement.classList.add('high-value');
        }
-        
-        if (stats.winRate >= 50) {
-            document.getElementById('win-rate').parentElement.classList.add('high-value');
+        if (winRateEl && stats.winRate >= 50) {
+            winRateEl.parentElement.classList.add('high-value');
        }
    }
-    
+
    /**
-     * Afficher le rang du joueur
+     * Effacer l'historique local du joueur (DEBUG).
+     * N'affecte PAS le classement en ligne partagé.
     */
-    static updatePlayerRank(difficulty = 'all') {
-        const userId = getUserId();
-        const rank = this.getPlayerRank(userId, difficulty);
-        
-        if (rank) {
-            const rankDisplay = document.getElementById('player-rank');
-            if (rankDisplay) {
-                rankDisplay.textContent = `Vous êtes #{rank}`;
-            }
-        }
-    }
-    
-    /**
-     * Afficher les statistiques globales
-     */
-    static displayGlobalStats() {
-        const globalStats = this.getGlobalStats();
-        DEBUG.log('Global Statistics:', globalStats);
-        
-        return globalStats;
-    }
-    
-    /**
-     * Nettoyer les scores (DEBUG)
-     */
-    static clearAll() {
-        if (confirm('Êtes-vous ABSOLUMENT certain de vouloir supprimer TOUS les scores?')) {
-            localStorage.removeItem(this.KEY_LEADERBOARD);
-            this.updateDisplay();
+    static clearLocalHistory() {
+        if (confirm('Effacer VOS statistiques locales ? (le classement en ligne n\'est pas touché)')) {
+            localStorage.removeItem(this.KEY_HISTORY);
            this.updatePlayerStats();
-            DEBUG.log('✓ Tous les scores ont été supprimés');
+            DEBUG.log('✓ Historique local effacé');
            return true;
        }
        return false;
    }
-    
-    /**
-     * Exporter les scores en CSV
-     */
-    static exportCSV() {
-        const scores = this.getAllScores();
-        
-        let csv = 'Rang,Joueur,Score,Difficulté,Temps (s),Mouvements,Parfait,Date\n';
-        
-        scores.forEach((score, index) => {
-            csv += `${index + 1},"${score.playerName}",${score.score},"${score.difficulty}",${score.timeSeconds},${score.moves},${score.isPerfect ? 'Oui' : 'Non'},"${score.date}"\n`;
-        });
-        
-        const blob = new Blob([csv], { type: 'text/csv' });
-        const url = URL.createObjectURL(blob);
-        const link = document.createElement('a');
-        link.href = url;
-        link.download = `leaderboard-${new Date().toISOString().slice(0, 10)}.csv`;
-        link.click();
-        URL.revokeObjectURL(url);
-    }
-    
+
    /**
     * Obtenir l'affichage du rang (numéro ou médaille)
     */
@@ -302,7 +261,7 @@ class LeaderboardManager {
        const medals = ['🥇', '🥈', '🥉'];
        return medals[index] || `${index + 1}`;
    }
-    
+
    /**
     * Échapper le HTML (sécurité)
     */
@@ -313,78 +272,11 @@ class LeaderboardManager {
    }
 }

-/**
- * Statistiques avancées
- */
-class AdvancedStats {
-    /**
-     * Obtenir la distribution des scores par difficulté
-     */
-    static getDistributionByDifficulty() {
-        const scores = LeaderboardManager.getAllScores();
-        const distribution = {};
-        
-        Object.keys(DIFFICULTY_MODES).forEach(difficulty => {
-            distribution[difficulty] = scores.filter(s => s.difficulty === difficulty).length;
-        });
-        
-        return distribution;
-    }
-    
-    /**
-     * Obtenir la tendance temporelle
-     */
-    static getTimelineTrend(days = 7) {
-        const scores = LeaderboardManager.getAllScores();
-        const now = new Date();
-        const timeline = {};
-        
-        for (let i = 0; i < days; i++) {
-            const date = new Date(now);
-            date.setDate(date.getDate() - i);
-            const dateStr = date.toISOString().slice(0, 10);
-            timeline[dateStr] = scores.filter(s => s.date.slice(0, 10) === dateStr).length;
-        }
-        
-        return timeline;
-    }
-    
-    /**
-     * Obtenir la moyenne de temps par difficulté
-     */
-    static getAverageTimeByDifficulty() {
-        const scores = LeaderboardManager.getAllScores();
-        const averages = {};
-        
-        Object.keys(DIFFICULTY_MODES).forEach(difficulty => {
-            const diffScores = scores.filter(s => s.difficulty === difficulty);
-            if (diffScores.length > 0) {
-                const totalTime = diffScores.reduce((a, b) => a + b.timeSeconds, 0);
-                averages[difficulty] = Math.round(totalTime / diffScores.length);
-            }
-        });
-        
-        return averages;
-    }
-    
-    /**
-     * Taux de réussite global
-     */
-    static getGlobalSuccessRate() {
-        const scores = LeaderboardManager.getAllScores();
-        if (scores.length === 0) return 0;
-        
-        const perfectGames = scores.filter(s => s.isPerfect).length;
-        return Math.round((perfectGames / scores.length) * 100);
-    }
-}
-
 // ============================================
 // INITIALISATION
 // ============================================

 // Exporter pour utilisation globale
 window.LeaderboardManager = LeaderboardManager;
-window.AdvancedStats = AdvancedStats;

-DEBUG.log('Leaderboard Manager initialized');
+DEBUG.log('Leaderboard Manager initialized (online mode)');
--- a/exercices/memory-pictogrammes/assets/js/memory-game.js
+++ b/exercices/memory-pictogrammes/assets/js/memory-game.js
@@ -347,12 +347,16 @@ class MemoryGameEngine {
            achievements: achievements.map(a => a.id)
        });
        
-        // Sauvegarder score
+        // Sauvegarder le score (classement en ligne) puis rafraîchir l'affichage
        LeaderboardManager.addScore({
            ...gameData,
            score: finalScore.totalScore
+        }).then(() => {
+            const activeFilter = document.querySelector('.tab-btn.active')?.getAttribute('data-filter') || 'all';
+            LeaderboardManager.updateDisplay(activeFilter);
+            LeaderboardManager.updatePlayerStats();
        });
-        
+
        // Afficher modal victoire
        this.showVictoryModal(finalScore, achievements, isWon);
    }
--- a/exercices/memory-pictogrammes/assets/js/utils.js
+++ b/exercices/memory-pictogrammes/assets/js/utils.js
@@ -292,10 +292,10 @@ function getRank(index) {
 }

 /**
- * Vérifier si le score est dans le top 10
+ * Vérifier si le score est dans le top 10 (classement en ligne, asynchrone)
 */
-function isTopScore(score, difficulty = 'all') {
-    const scores = LeaderboardManager.getLeaderboard(difficulty, 10);
+async function isTopScore(score, difficulty = 'all') {
+    const scores = await LeaderboardManager.getLeaderboard(difficulty, 10);
    return scores.some(s => s.score === score.score && s.userId === score.userId);
 }

@@ -318,57 +318,25 @@ function formatDate(isoDate) {
 }

 /**
- * Obtenir les statistiques d'un joueur
+ * Obtenir les statistiques locales du joueur
 */
-function getPlayerStatistics(userId) {
-    const scores = LeaderboardManager.getAllScores().filter(s => s.userId === userId);
-    
-    if (scores.length === 0) {
-        return {
-            totalGames: 0,
-            bestScore: 0,
-            averageScore: 0,
-            averageTime: 0,
-            bestTime: Infinity,
-            winRate: 0,
-            perfectGames: 0
-        };
-    }
-    
-    const bestScore = Math.max(...scores.map(s => s.score), 0);
-    const totalScore = scores.reduce((a, b) => a + b.score, 0);
-    const totalTime = scores.reduce((a, b) => a + b.timeSeconds, 0);
-    const bestTime = Math.min(...scores.map(s => s.timeSeconds), Infinity);
-    const perfectGames = scores.filter(s => s.isPerfect).length;
-    const winRate = (perfectGames / scores.length) * 100;
-    
-    return {
-        totalGames: scores.length,
-        bestScore: bestScore,
-        averageScore: Math.round(totalScore / scores.length),
-        averageTime: Math.round(totalTime / scores.length),
-        bestTime: bestTime === Infinity ? 0 : bestTime,
-        winRate: Math.round(winRate),
-        perfectGames: perfectGames
-    };
+function getPlayerStatistics() {
+    return LeaderboardManager.getPlayerStats();
 }

 /**
- * Déboguer : afficher tous les scores en console
+ * Déboguer : afficher l'historique local du joueur en console
 */
 function debugScores() {
-    console.table(LeaderboardManager.getAllScores());
+    console.table(LeaderboardManager._getLocalHistory());
 }

 /**
- * Déboguer : nettoyer tous les scores
+ * Déboguer : effacer les statistiques locales du joueur
+ * (le classement en ligne partagé n'est pas affecté)
 */
 function clearAllScores() {
-    if (confirm('Êtes-vous sûr de vouloir supprimer tous les scores?')) {
-        localStorage.removeItem('nextgn_leaderboard');
-        console.log('✓ Tous les scores ont été supprimés');
-        location.reload();
-    }
+    LeaderboardManager.clearLocalHistory();
 }

 /**
--- a/index.html
+++ b/index.html
@@ -103,7 +103,7 @@
                <div class="formation-card">
                    <div class="formation-header">
                        <div class="formation-icon">📋</div>
-                        <h3 class="formation-title">FDS, FT & Étiquettes</h3>
+                        <h3 class="formation-title">FDS & Étiquettes</h3>
                        <p class="formation-subtitle">Aller plus loin</p>
                    </div>
                    <div class="formation-body">
@@ -137,19 +137,6 @@
                        <a href="exercices/memory-pictogrammes/memory.html" class="formation-link">Jouer</a>
                    </div>
                </div>
-
-                <!-- Correction : page unique pour tous les exercices -->
-                <div class="formation-card">
-                    <div class="formation-header">
-                        <div class="formation-icon">✅</div>
-                        <h3 class="formation-title">Corriger un exercice</h3>
-                        <p class="formation-subtitle">Correction des rendus</p>
-                    </div>
-                    <div class="formation-body">
-                        <p class="formation-description">Déposez le PDF exporté par un groupe et obtenez la lecture de son rendu. Page unique de correction pour l'ensemble des exercices.</p>
-                        <a href="exercices/corriger-exercice.html" class="formation-link">Corriger</a>
-                    </div>
-                </div>
            </div>
        </section>