diff --git a/frontend/pages/chap1.html b/frontend/pages/chap1.html
index 2978684..7b7e4fd 100644
--- a/frontend/pages/chap1.html
+++ b/frontend/pages/chap1.html
@@ -167,7 +167,7 @@
 
     // Afficher la mascotte
     const mascolteEl = document.getElementById('mascotte');
-    mascolteEl.innerHTML = '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
+    mascolteEl.innerHTML = '<img src="/img/tilineau/idle.png" alt="Tilineau">';
 
     // Afficher le texte de bienvenue
     document.getElementById('speech-text').innerHTML = texts.riichi.chap1;
@@ -179,7 +179,7 @@
       if (speechBubble.classList.contains('visible')) {
         mascolteEl.innerHTML = '<img class="explaining" src="/img/tilineau/explaining.png" alt="Tilineau">';
       } else {
-        mascolteEl.innerHTML = '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
+        mascolteEl.innerHTML = '<img src="/img/tilineau/idle.png" alt="Tilineau">';
       }
     });
 
diff --git a/frontend/pages/chap2.html b/frontend/pages/chap2.html
index f793c0c..78d4262 100644
--- a/frontend/pages/chap2.html
+++ b/frontend/pages/chap2.html
@@ -141,7 +141,7 @@
 
     // Afficher la mascotte
     const mascolteEl = document.getElementById('mascotte');
-    mascolteEl.innerHTML = '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
+    mascolteEl.innerHTML = '<img src="/img/tilineau/idle.png" alt="Tilineau">';
 
     // Afficher le texte de bienvenue
     document.getElementById('speech-text').innerHTML = texts.riichi.chap2;
@@ -153,7 +153,7 @@
       if (speechBubble.classList.contains('visible')) {
         mascolteEl.innerHTML = '<img class="explaining" src="/img/tilineau/speaking.png" alt="Tilineau">';
       } else {
-        mascolteEl.innerHTML = '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
+        mascolteEl.innerHTML = '<img src="/img/tilineau/idle.png" alt="Tilineau">';
       }
     });
 
diff --git a/frontend/pages/chap3.html b/frontend/pages/chap3.html
index 734acf3..4990b1b 100644
--- a/frontend/pages/chap3.html
+++ b/frontend/pages/chap3.html
@@ -28,7 +28,7 @@
     }
 
     .speech-bubble {
-      position: fixed;
+      position: absolute;
       bottom: 200px;
       right: 170px;
       z-index: 1;
@@ -99,7 +99,7 @@
 
     // Afficher la mascotte et le texte
     const mascolteEl = document.getElementById('mascotte');
-    mascolteEl.innerHTML = '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
+    mascolteEl.innerHTML = '<img src="/img/tilineau/idle.png" alt="Tilineau">';
     document.getElementById('speech-text').innerHTML = texts.riichi.chap3;
 
     // Toggle bulle de dialogue au clic sur la mascotte
@@ -107,7 +107,7 @@
     mascolteEl.addEventListener('click', () => {
       speechBubble.classList.toggle('visible');
       mascolteEl.innerHTML = speechBubble.classList.contains('visible')
-        ? '<img class="explaining" src="/img/tilineau/explaining.png" alt="Tilineau">'
+        ? '<img class="explaining" src="/img/tilineau/idle.png" alt="Tilineau">'
         : '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
     });
 
diff --git a/img/tilineau/idle.png b/img/tilineau/idle.png
new file mode 100644
index 0000000..5e33bdb
Binary files /dev/null and b/img/tilineau/idle.png differ
diff --git a/index.html b/index.html
index e71d385..09c1ae1 100644
--- a/index.html
+++ b/index.html
@@ -90,6 +90,9 @@
     const speechBubble = document.querySelector('.speech-bubble');
     mascolteEl.addEventListener('click', () => {
       speechBubble.classList.toggle('hidden');
+      mascolteEl.innerHTML = speechBubble.classList.contains('hidden')
+        ? '<img class="explaining" src="/img/tilineau/idle.png" alt="Tilineau">'
+        : '<img src="/img/tilineau/speaking.png" alt="Tilineau">';
     });
 
     let allTiles = [];