diff --git a/components/menu.html b/components/menu.html
index 1a8d4a4..d678115 100644
--- a/components/menu.html
+++ b/components/menu.html
@@ -1,5 +1,4 @@
 <nav class="menu">
-  <ul>
   <ul>
     <li><a href="https://github.com/Didictateur/Riichi">
       <svg width="1.5em" height="1.5em" viewBox="0 0 24 24" fill="currentColor" style="vertical-align: middle; margin-right: 0.1rem;">
@@ -16,6 +15,12 @@
         <li><a href="">Chapitre 3 : Les groupes</a></li>
       </ul>
     </li>
+    <li>
+        <a href="#">Partie réelle</a>
+    </li>
+    <li>
+        <a href="#">Variante à trois</a>
+    </li>
   </ul>
 </nav>
 
diff --git a/img/tilineau/explaining.png b/img/tilineau/explaining.png
new file mode 100644
index 0000000..9706a70
Binary files /dev/null and b/img/tilineau/explaining.png differ
diff --git a/img/tilineau/speaking.png b/img/tilineau/speaking.png
new file mode 100644
index 0000000..30106f9
Binary files /dev/null and b/img/tilineau/speaking.png differ
diff --git a/index.html b/index.html
index 632cdea..a123ec0 100644
--- a/index.html
+++ b/index.html
@@ -31,12 +31,27 @@
         opacity: 0;
       }
     }
+
+    #mascotte {
+      position: fixed;
+      bottom: 0px;
+      right: 160px;
+      z-index: 999;
+      transform: scaleX(-1);
+    }
+
+    #mascotte img {
+      width: 250px;
+      height: auto;
+      display: block;
+    }
   </style>
 </head>
 <body>
   <div id="menu"></div>
   <div id="tile-container"></div>
   <div id="tile-rain"></div>
+  <div id="mascotte"></div>
   
   <script>
     // Charger le menu
@@ -44,6 +59,9 @@
       .then(r => r.text())
       .then(html => document.getElementById('menu').innerHTML = html);
 
+    // Afficher la mascotte
+    document.getElementById('mascotte').innerHTML = '<img src="img/tilineau/speaking.png" alt="Tilineau">';
+
     let allTiles = [];
 
     // Récupérer les tuiles
