diff --git a/exercices/memory-pictogrammes/assets/css/animations.css b/exercices/memory-pictogrammes/assets/css/animations.css
index f8e8856..b323578 100644
--- a/exercices/memory-pictogrammes/assets/css/animations.css
+++ b/exercices/memory-pictogrammes/assets/css/animations.css
@@ -44,15 +44,15 @@
 @keyframes matchSuccess {
     0% {
         transform: scale(1);
-        filter: drop-shadow(0 0 0px rgba(76, 175, 80, 0.6));
+        filter: drop-shadow(0 0 0px rgba(29, 158, 117, 0.6));
     }
     50% {
         transform: scale(1.15) rotate(5deg);
-        filter: drop-shadow(0 0 12px rgba(76, 175, 80, 0.8));
+        filter: drop-shadow(0 0 12px rgba(29, 158, 117, 0.8));
     }
     100% {
         transform: scale(1);
-        filter: drop-shadow(0 0 0px rgba(76, 175, 80, 0));
+        filter: drop-shadow(0 0 0px rgba(29, 158, 117, 0));
     }
 }
 
@@ -101,10 +101,10 @@
 /* Pulse Progress Bar */
 @keyframes progressPulse {
     0%, 100% {
-        box-shadow: 0 0 8px rgba(29, 158, 117, 0.4);
+        box-shadow: 0 0 8px rgba(186, 117, 23, 0.4);
     }
     50% {
-        box-shadow: 0 0 24px rgba(29, 158, 117, 0.8);
+        box-shadow: 0 0 24px rgba(186, 117, 23, 0.8);
     }
 }
 
@@ -189,7 +189,7 @@
 @keyframes statUpdate {
     0% {
         transform: scale(0.8);
-        background: rgba(29, 158, 117, 0.2);
+        background: rgba(186, 117, 23, 0.2);
     }
     100% {
         transform: scale(1);
@@ -255,10 +255,10 @@
 /* Card glow hover */
 @keyframes glowCard {
     0% {
-        box-shadow: 0 0 0px rgba(29, 158, 117, 0);
+        box-shadow: 0 0 0px rgba(186, 117, 23, 0);
     }
     100% {
-        box-shadow: 0 0 16px rgba(29, 158, 117, 0.3);
+        box-shadow: 0 0 16px rgba(186, 117, 23, 0.3);
     }
 }
 
@@ -281,10 +281,10 @@
 /* Pulse button */
 @keyframes buttonPulse {
     0%, 100% {
-        box-shadow: 0 0 0px rgba(29, 158, 117, 0.7);
+        box-shadow: 0 0 0px rgba(186, 117, 23, 0.7);
     }
     50% {
-        box-shadow: 0 0 16px rgba(29, 158, 117, 0.4);
+        box-shadow: 0 0 16px rgba(186, 117, 23, 0.4);
     }
 }
 
diff --git a/exercices/memory-pictogrammes/assets/css/hud.css b/exercices/memory-pictogrammes/assets/css/hud.css
index dff16c8..ea217d7 100644
--- a/exercices/memory-pictogrammes/assets/css/hud.css
+++ b/exercices/memory-pictogrammes/assets/css/hud.css
@@ -14,8 +14,8 @@
 }
 
 .stat-box {
-    background: linear-gradient(135deg, var(--teal-light), var(--white));
-    border: 2px solid var(--teal-mid);
+    background: linear-gradient(135deg, var(--amber-light), var(--white));
+    border: 2px solid var(--amber-mid);
     border-radius: 12px;
     padding: 20px;
     text-align: center;
@@ -38,7 +38,7 @@
 .stat-box:hover {
     transform: translateY(-4px);
     box-shadow: var(--shadow-lg);
-    border-color: var(--teal-dark);
+    border-color: var(--amber-dark);
 }
 
 .stat-box:hover::before {
@@ -57,7 +57,7 @@
 .stat-box .value {
     font-size: 32px;
     font-weight: 800;
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
@@ -73,7 +73,7 @@
    PROGRESS BAR (Paires trouvées)
    ============================================ */
 .progress-container {
-    background: var(--teal-light);
+    background: var(--amber-light);
     border-radius: 12px;
     overflow: hidden;
     height: 12px;
@@ -84,7 +84,7 @@
 
 .game-progress-fill {
     height: 100%;
-    background: linear-gradient(90deg, var(--teal-mid), var(--teal-dark));
+    background: linear-gradient(90deg, var(--amber-mid), var(--amber-dark));
     width: 0%;
     transition: width 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
 }
@@ -148,15 +148,15 @@
 }
 
 .modal-content {
-    background: linear-gradient(135deg, var(--white), var(--teal-light));
+    background: linear-gradient(135deg, var(--white), var(--amber-light));
     border-radius: 12px;
     padding: 48px;
     max-width: 500px;
     width: 100%;
     text-align: center;
     animation: slideUp 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
-    border: 2px solid var(--teal-mid);
-    box-shadow: 0 32px 64px rgba(15, 110, 86, 0.3);
+    border: 2px solid var(--amber-mid);
+    box-shadow: 0 32px 64px rgba(186, 117, 23, 0.3);
     position: relative;
     overflow: hidden;
 }
@@ -177,7 +177,7 @@
     font-family: 'Syne', sans-serif;
     font-size: 42px;
     font-weight: 800;
-    color: var(--teal);
+    color: var(--amber);
     margin: 32px 0 12px;
     position: relative;
     z-index: 1;
@@ -186,7 +186,7 @@
 .modal-content .score-display {
     font-size: 64px;
     font-weight: 800;
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
@@ -203,10 +203,10 @@
 }
 
 .stats-summary .stat {
-    background: var(--teal-light);
+    background: var(--amber-light);
     padding: 12px;
     border-radius: 8px;
-    border: 1px solid var(--teal-mid);
+    border: 1px solid var(--amber-mid);
     animation: popIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
 }
 
@@ -217,7 +217,7 @@
 
 .stats-summary .stat-value {
     font-weight: 700;
-    color: var(--teal-dark);
+    color: var(--amber-dark);
     font-size: 16px;
     font-family: 'Syne', sans-serif;
 }
@@ -308,14 +308,14 @@
     border-radius: 12px;
     padding: 40px;
     text-align: center;
-    border: 2px solid var(--teal-mid);
+    border: 2px solid var(--amber-mid);
     animation: slideUp 0.4s ease-out;
 }
 
 .pause-content h2 {
     font-family: 'Syne', sans-serif;
     font-size: 32px;
-    color: var(--teal);
+    color: var(--amber);
     margin-bottom: 24px;
 }
 
@@ -323,7 +323,7 @@
     font-size: 48px;
     font-family: 'Syne', sans-serif;
     font-weight: 800;
-    color: var(--teal-dark);
+    color: var(--amber-dark);
     margin-bottom: 24px;
     animation: timerTick 0.5s ease-out;
 }
diff --git a/exercices/memory-pictogrammes/assets/css/leaderboard.css b/exercices/memory-pictogrammes/assets/css/leaderboard.css
index 80cd9c8..32e1a7d 100644
--- a/exercices/memory-pictogrammes/assets/css/leaderboard.css
+++ b/exercices/memory-pictogrammes/assets/css/leaderboard.css
@@ -16,7 +16,7 @@
     color: var(--text);
     margin: 0 auto 32px;
     padding-bottom: 12px;
-    border-bottom: 3px solid var(--teal-mid);
+    border-bottom: 3px solid var(--amber-mid);
     display: inline-block;
 }
 
@@ -34,7 +34,7 @@
 .tab-btn {
     padding: 10px 20px;
     background: var(--white);
-    border: 2px solid var(--teal-light);
+    border: 2px solid var(--amber-light);
     border-radius: 8px;
     font-family: 'Syne', sans-serif;
     font-size: 12px;
@@ -47,13 +47,13 @@
 }
 
 .tab-btn:hover {
-    border-color: var(--teal-mid);
-    color: var(--teal-mid);
+    border-color: var(--amber-mid);
+    color: var(--amber-mid);
 }
 
 .tab-btn.active {
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
-    border-color: var(--teal-dark);
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
+    border-color: var(--amber-dark);
     color: var(--white);
     box-shadow: var(--shadow-md);
 }
@@ -62,10 +62,10 @@
    LEADERBOARD LIST
    ============================================ */
 .leaderboard {
-    background: linear-gradient(135deg, var(--teal-light), var(--white));
+    background: linear-gradient(135deg, var(--amber-light), var(--white));
     border-radius: 12px;
     padding: 24px;
-    border: 2px solid var(--teal-mid);
+    border: 2px solid var(--amber-mid);
     margin-bottom: 48px;
     box-shadow: var(--shadow-sm);
     text-align: left;
@@ -86,7 +86,7 @@
     padding: 16px;
     border-radius: 8px;
     transition: all 0.3s ease;
-    border-left: 4px solid var(--teal-light);
+    border-left: 4px solid var(--amber-light);
     position: relative;
     overflow: hidden;
 }
@@ -98,14 +98,14 @@
     left: -100%;
     width: 100%;
     height: 100%;
-    background: linear-gradient(90deg, transparent, rgba(29, 158, 117, 0.1), transparent);
+    background: linear-gradient(90deg, transparent, rgba(186, 117, 23, 0.1), transparent);
     transition: left 0.5s ease;
 }
 
 .rank-item:hover {
     transform: translateX(8px);
-    box-shadow: 0 4px 12px rgba(15, 110, 86, 0.15);
-    border-left-color: var(--teal-mid);
+    box-shadow: 0 4px 12px rgba(186, 117, 23, 0.15);
+    border-left-color: var(--amber-mid);
 }
 
 .rank-item:hover::before {
@@ -116,7 +116,7 @@
 .rank-number {
     font-weight: 800;
     font-size: 18px;
-    color: var(--teal-mid);
+    color: var(--amber-mid);
     text-align: center;
     font-family: 'Syne', sans-serif;
 }
@@ -171,7 +171,7 @@
 /* Score et difficulté */
 .rank-score {
     font-weight: 700;
-    color: var(--teal-dark);
+    color: var(--amber-dark);
     font-size: 18px;
     font-family: 'Syne', sans-serif;
     min-width: 60px;
@@ -185,8 +185,8 @@
     letter-spacing: 0.05em;
     padding: 4px 8px;
     border-radius: 4px;
-    background: var(--teal-light);
-    color: var(--teal-dark);
+    background: var(--amber-light);
+    color: var(--amber-dark);
     min-width: 60px;
     text-align: center;
 }
@@ -197,8 +197,8 @@
 }
 
 .rank-difficulty.normal {
-    background: var(--teal-light);
-    color: var(--teal-dark);
+    background: var(--amber-light);
+    color: var(--amber-dark);
 }
 
 .rank-difficulty.hard {
@@ -232,17 +232,17 @@
    PLAYER STATS SECTION
    ============================================ */
 .player-stats {
-    background: linear-gradient(135deg, rgba(15, 110, 86, 0.05), transparent);
+    background: linear-gradient(135deg, rgba(186, 117, 23, 0.05), transparent);
     border-radius: 12px;
     padding: 24px;
-    border: 2px solid var(--teal-light);
+    border: 2px solid var(--amber-light);
 }
 
 .player-stats h3 {
     font-family: 'Syne', sans-serif;
     font-size: 18px;
     font-weight: 700;
-    color: var(--teal);
+    color: var(--amber);
     margin-bottom: 16px;
     text-align: center;
 }
@@ -255,7 +255,7 @@
 
 .stat-card {
     background: var(--white);
-    border: 2px solid var(--teal-light);
+    border: 2px solid var(--amber-light);
     border-radius: 10px;
     padding: 14px 8px;
     text-align: center;
@@ -268,7 +268,7 @@
 .stat-card:hover {
     transform: translateY(-4px);
     box-shadow: var(--shadow-md);
-    border-color: var(--teal-mid);
+    border-color: var(--amber-mid);
 }
 
 .stat-icon {
@@ -288,7 +288,7 @@
 .stat-value {
     font-size: 20px;
     font-weight: 800;
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
diff --git a/exercices/memory-pictogrammes/assets/css/memory-game.css b/exercices/memory-pictogrammes/assets/css/memory-game.css
index f3c2950..1900199 100644
--- a/exercices/memory-pictogrammes/assets/css/memory-game.css
+++ b/exercices/memory-pictogrammes/assets/css/memory-game.css
@@ -5,7 +5,7 @@
 
 :root {
     /* Gamification Colors */
-    --success: #4CAF50;
+    --success: var(--teal-mid);
     --warning: #FF9800;
     --info: #2196F3;
     --accent: #FFD700;
@@ -21,7 +21,7 @@
    ============================================ */
 main {
     margin-top: 70px;
-    padding: 64px 40px 40px;
+    padding: 96px 40px 40px;
     min-height: calc(100vh - 70px);
 }
 
@@ -43,7 +43,7 @@ main {
     font-family: 'Syne', sans-serif;
     font-size: clamp(28px, 5vw, 44px);
     font-weight: 800;
-    color: var(--teal);
+    color: var(--amber);
     margin-bottom: 8px;
     text-align: center;
 }
@@ -57,8 +57,8 @@ main {
 }
 
 .intro-box {
-    background: linear-gradient(135deg, var(--teal-light), var(--white));
-    border-left: 4px solid var(--teal-mid);
+    background: linear-gradient(135deg, var(--amber-light), var(--white));
+    border-left: 4px solid var(--amber-mid);
     border-radius: 8px;
     padding: 20px;
     font-size: 0.95em;
@@ -113,8 +113,8 @@ main {
 }
 
 .btn-difficulty {
-    background: var(--teal-light);
-    background: linear-gradient(135deg, rgba(225, 245, 238, 0.5), transparent);
+    background: var(--amber-light);
+    background: linear-gradient(135deg, rgba(250, 238, 218, 0.5), transparent);
     border: 2px solid transparent;
     border-radius: 12px;
     padding: 14px 12px;
@@ -128,14 +128,14 @@ main {
 }
 
 .btn-difficulty:hover {
-    border-color: var(--teal-mid);
+    border-color: var(--amber-mid);
     transform: translateY(-3px);
     box-shadow: var(--shadow-md);
 }
 
 .btn-difficulty.active {
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
-    border-color: var(--teal-dark);
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
+    border-color: var(--amber-dark);
     box-shadow: var(--shadow-md);
 }
 
@@ -153,7 +153,7 @@ main {
 .btn-label {
     font-size: 14px;
     font-weight: 700;
-    color: var(--teal);
+    color: var(--amber);
 }
 
 .btn-desc {
@@ -173,9 +173,9 @@ main {
     max-width: 900px;
     margin: 0 auto 32px;
     padding: 20px;
-    background: linear-gradient(135deg, rgba(225, 245, 238, 0.4), transparent);
+    background: linear-gradient(135deg, rgba(250, 238, 218, 0.4), transparent);
     border-radius: 12px;
-    border: 1px solid var(--teal-light);
+    border: 1px solid var(--amber-light);
 }
 
 /* MEMORY CARD STYLES */
@@ -209,8 +209,8 @@ main {
 .card-face.front {
     background:
         radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.6), transparent 60%),
-        linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
-    border: 2px solid var(--teal-dark);
+        linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
+    border: 2px solid var(--amber-dark);
     color: var(--white);
     box-shadow: var(--shadow-sm);
     text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
@@ -218,8 +218,8 @@ main {
 
 .card-face.back {
     transform: rotateY(180deg);
-    background: linear-gradient(135deg, var(--white), var(--teal-light));
-    border: 2px solid var(--teal-mid);
+    background: linear-gradient(135deg, var(--white), var(--amber-light));
+    border: 2px solid var(--amber-mid);
     flex-direction: column;
     gap: 8px;
     padding: 8px;
@@ -268,7 +268,7 @@ main {
 }
 
 .memory-card.matched .card-face.back {
-    background: linear-gradient(135deg, var(--white), rgba(76, 175, 80, 0.2));
+    background: linear-gradient(135deg, var(--white), rgba(29, 158, 117, 0.2));
     border-color: var(--success);
 }
 
@@ -302,7 +302,7 @@ footer {
 }
 
 .btn-primary {
-    background: linear-gradient(135deg, var(--teal-mid), var(--teal-dark));
+    background: linear-gradient(135deg, var(--amber-mid), var(--amber-dark));
     color: var(--white);
 }
 
@@ -313,13 +313,13 @@ footer {
 
 .btn-secondary {
     background: var(--white);
-    border: 2px solid var(--teal-mid);
-    color: var(--teal-mid);
+    border: 2px solid var(--amber-mid);
+    color: var(--amber-mid);
 }
 
 .btn-secondary:hover {
-    background: var(--teal-light);
-    border-color: var(--teal-dark);
+    background: var(--amber-light);
+    border-color: var(--amber-dark);
 }
 
 /* ============================================
@@ -327,7 +327,7 @@ footer {
    ============================================ */
 @media (max-width: 768px) {
     main {
-        padding: 32px 20px 20px;
+        padding: 56px 20px 20px;
     }
 
     .intro-section h1 {
@@ -357,7 +357,7 @@ footer {
 
 @media (max-width: 480px) {
     main {
-        padding: 24px 16px 16px;
+        padding: 40px 16px 16px;
     }
 
     .intro-section h1 {
diff --git a/exercices/memory-pictogrammes/memory.html b/exercices/memory-pictogrammes/memory.html
index 1596520..f3cfbb4 100644
--- a/exercices/memory-pictogrammes/memory.html
+++ b/exercices/memory-pictogrammes/memory.html
@@ -8,10 +8,10 @@
     
     <!-- Styles -->
     <link rel="stylesheet" href="../../header-style.css"/>
-    <link rel="stylesheet" href="assets/css/memory-game.css">
-    <link rel="stylesheet" href="assets/css/hud.css">
-    <link rel="stylesheet" href="assets/css/animations.css">
-    <link rel="stylesheet" href="assets/css/leaderboard.css">
+    <link rel="stylesheet" href="assets/css/memory-game.css?v=3">
+    <link rel="stylesheet" href="assets/css/hud.css?v=3">
+    <link rel="stylesheet" href="assets/css/animations.css?v=3">
+    <link rel="stylesheet" href="assets/css/leaderboard.css?v=3">
 </head>
 <body>
     <!-- HEADER NextGN Formation -->
@@ -36,7 +36,7 @@
     <main class="game-container">
         <!-- INTRO SECTION -->
         <section class="intro-section">
-            <h1>Memory Pictogrammes GHS</h1>
+            <h1>Memory pictogrammes</h1>
             <p class="subtitle">Maîtrisez les 9 symboles de danger</p>
 
             <div class="intro-box">