diff --git a/app/public/dashboard.css b/app/public/dashboard.css
new file mode 100644
index 0000000..900ab9e
--- /dev/null
+++ b/app/public/dashboard.css
@@ -0,0 +1,105 @@
+:root {
+  --bg: #0f1115;
+  --bg-card: #161a22;
+  --text: #e6e6eb;
+  --muted: #9aa0b4;
+  --primary: #5865F2; /* couleur Discord */
+  --primary-hover: #4752c4;
+  --border: #23283a;
+}
+
+* {
+  box-sizing: border-box;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+  margin: 0;
+  padding: 0;
+}
+
+/* BODY */
+body {
+  background-color: var(--bg);
+  color: var(--text);
+  min-height: 100vh;
+  padding: 0 20px;
+}
+
+/* NAVBAR */
+nav {
+  display: flex;
+  gap: 20px;
+  padding: 16px 24px;
+  background: var(--bg-card);
+  border-bottom: 1px solid var(--border);
+}
+
+nav a {
+  color: var(--muted);
+  text-decoration: none;
+  font-weight: 500;
+}
+
+nav a:hover {
+  color: var(--text);
+}
+
+/* TITRES */
+h1, h2 {
+  text-align: center;
+  margin-top: 30px;
+}
+
+h2 {
+  margin-bottom: 20px;
+  color: var(--muted);
+}
+
+/* AVATAR */
+#avatar {
+  display: block;
+  margin: 20px auto;
+  width: 120px;
+  height: 120px;
+  border-radius: 50%;
+  border: 3px solid var(--primary);
+}
+
+/* BOUTON INVITE */
+#invite-link {
+  display: block;
+  width: fit-content;
+  margin: 20px auto;
+  padding: 12px 24px;
+  background: var(--primary);
+  color: white;
+  text-decoration: none;
+  border-radius: 10px;
+  font-weight: 600;
+  transition: background 0.2s ease, transform 0.1s ease;
+}
+
+#invite-link:hover {
+  background: var(--primary-hover);
+  transform: translateY(-1px);
+}
+
+/* LISTE DES GUILDS */
+#guilds-list {
+  max-width: 600px;
+  margin: 0 auto 40px auto;
+  list-style: none;
+}
+
+#guilds-list li {
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  padding: 10px 15px;
+  margin: 5px 0;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: background 0.2s ease;
+}
+
+#guilds-list li:hover {
+  background: var(--primary);
+  color: white;
+}
\ No newline at end of file
diff --git a/app/public/dashboard.html b/app/public/dashboard.html
index 3d19dea..ec12da7 100644
--- a/app/public/dashboard.html
+++ b/app/public/dashboard.html
@@ -2,6 +2,9 @@
 <html>
 <head>
   <title>Tableau de bord</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="/dashboard.css">
 </head>
 <body>
   <nav>
@@ -13,7 +16,7 @@
 
   <a id="invite-link" href="#">Ajouter le bot à votre serveur</a>
   
-  <h2>Mes serveurs :</h2>
+  <h2>Mes serveurs qui ont le bot :</h2>
   <ul id="guilds-list"></ul> <!-- Ici on va lister les guilds -->
 
   <script>
@@ -39,15 +42,47 @@
         } else {
           guilds.forEach(g => {
             const li = document.createElement("li");
-            li.textContent = g.name;
-            li.style.cursor = "pointer"; // change le curseur pour montrer que c'est cliquable
-            li.style.padding = "5px";
+            li.style.cursor = "pointer";
+            li.style.padding = "8px";
             li.style.border = "1px solid #ccc";
             li.style.margin = "5px 0";
+            li.style.display = "flex";
+            li.style.alignItems = "center";
+            li.style.gap = "10px";
+            li.style.borderRadius = "8px";
+            li.style.backgroundColor = "#161a22"; // fond sombre pour chaque item
+            li.style.transition = "background 0.2s";
+
             li.addEventListener("click", () => {
-              // Action quand on clique : exemple, redirection vers une page de configuration pour ce serveur
               window.location.href = `/guild/${g.id}`;
             });
+
+            li.addEventListener("mouseover", () => {
+              li.style.backgroundColor = "#5865F2"; // couleur Discord au hover
+              li.style.color = "white";
+            });
+
+            li.addEventListener("mouseout", () => {
+              li.style.backgroundColor = "#161a22";
+              li.style.color = "";
+            });
+
+            // Logo de la guild
+            if (g.icon) {
+              const img = document.createElement("img");
+              img.src = `https://cdn.discordapp.com/icons/${g.id}/${g.icon}.png`;
+              img.alt = `${g.name} logo`;
+              img.style.width = "40px";
+              img.style.height = "40px";
+              img.style.borderRadius = "50%";
+              li.appendChild(img);
+            }
+
+            // Nom de la guild
+            const span = document.createElement("span");
+            span.textContent = g.name;
+            li.appendChild(span);
+
             list.appendChild(li);
           });
         }
diff --git a/app/public/guild.css b/app/public/guild.css
new file mode 100644
index 0000000..5598f6f
--- /dev/null
+++ b/app/public/guild.css
@@ -0,0 +1,142 @@
+:root {
+  --bg: #0f1115;
+  --bg-card: #161a22;
+  --text: #e6e6eb;
+  --muted: #9aa0b4;
+  --primary: #5865F2;
+  --primary-hover: #4752c4;
+  --border: #23283a;
+  --input-bg: #1f222b;
+  --input-border: #2a2e3e;
+}
+
+/* RESET & BASE */
+* {
+  box-sizing: border-box;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+}
+
+body {
+  background-color: var(--bg);
+  color: var(--text);
+  margin: 0;
+  padding: 20px;
+  min-height: 100vh;
+}
+
+/* NAVBAR */
+nav {
+  display: flex;
+  gap: 20px;
+  padding: 16px 24px;
+  background: var(--bg-card);
+  border-bottom: 1px solid var(--border);
+  border-radius: 8px;
+  margin-bottom: 30px;
+}
+
+nav a {
+  color: var(--muted);
+  text-decoration: none;
+  font-weight: 500;
+}
+
+nav a:hover {
+  color: var(--text);
+}
+
+/* TITRE PRINCIPAL */
+h1 {
+  text-align: center;
+  margin-bottom: 30px;
+}
+
+/* FORMS */
+form {
+  max-width: 700px;
+  margin: 0 auto 40px auto;
+  padding: 20px;
+  background: var(--bg-card);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+}
+
+form label {
+  display: block;
+  margin-bottom: 15px;
+  font-weight: 500;
+  color: var(--text);
+}
+
+input[type="checkbox"] {
+  margin-right: 10px;
+}
+
+select,
+textarea {
+  width: 100%;
+  padding: 10px;
+  margin-top: 5px;
+  border: 1px solid var(--input-border);
+  border-radius: 8px;
+  background-color: var(--input-bg);
+  color: var(--text);
+  font-size: 1rem;
+  resize: vertical;
+}
+
+textarea::placeholder {
+  color: var(--muted);
+}
+
+button[type="submit"] {
+  display: block;
+  padding: 12px 24px;
+  margin-top: 10px;
+  background: var(--primary);
+  color: white;
+  border: none;
+  border-radius: 10px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background 0.2s ease, transform 0.1s ease;
+}
+
+button[type="submit"]:hover {
+  background: var(--primary-hover);
+  transform: translateY(-1px);
+}
+
+/* PETIT TEXTE / VARIABLES */
+small {
+  display: block;
+  margin-top: 10px;
+  color: var(--muted);
+}
+
+small ul {
+  margin-top: 5px;
+  padding-left: 20px;
+}
+
+small code {
+  background: var(--input-bg);
+  padding: 2px 5px;
+  border-radius: 4px;
+  font-family: monospace;
+  color: var(--text);
+}
+
+/* STATUS FORM */
+#status-welcome-form,
+#status-goodbye-form {
+  margin-top: 10px;
+  font-weight: 600;
+}
+
+/* RESPONSIVE */
+@media (max-width: 768px) {
+  form {
+    padding: 15px;
+  }
+}
\ No newline at end of file
diff --git a/app/public/guild.html b/app/public/guild.html
index dfd00b9..20fe235 100644
--- a/app/public/guild.html
+++ b/app/public/guild.html
@@ -2,6 +2,9 @@
 <html>
   <head>
     <title>Dashboard du serveur</title>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="/guild.css">
   </head>
   <body>
     <nav>
diff --git a/app/public/index.html b/app/public/index.html
index 211f6cf..2fb155c 100644
--- a/app/public/index.html
+++ b/app/public/index.html
@@ -4,7 +4,7 @@
   <title>LazyBot - Bot Discord</title>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="index.css">
+  <link rel="stylesheet" href="/index.css">
 </head>
 <body>
   <nav>
