diff --git a/src/styles/mapMarkers.css b/src/styles/mapMarkers.css
index e69de29..854bdd7 100644
--- a/src/styles/mapMarkers.css
+++ b/src/styles/mapMarkers.css
@@ -0,0 +1,56 @@
+/* Ne PAS toucher au transform du marker : MapLibre gère la position. */
+.post-pin {
+  pointer-events: auto;
+}
+
+/* Bulle principale (état compact) */
+.post-pin-bubble {
+  display: inline-flex;
+  align-items: center;
+  padding: 4px 8px;
+  border-radius: 999px;
+  background: rgba(6, 40, 80, 0.95);
+  border: 1px solid rgba(80, 180, 255, 0.9);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+}
+
+/* Petit rond à gauche */
+.post-pin-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: 999px;
+  background: #ff8a00;
+  margin-right: 6px;
+}
+
+/* Texte compact */
+.post-pin-text {
+  color: #e8f5ff;
+  font-size: 11px;
+  font-weight: 500;
+  max-width: 120px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* Petite pointe qui touche la coordonnée */
+.post-pin-pointer {
+  width: 0;
+  height: 0;
+  margin: 0 auto;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-top: 7px solid rgba(6, 40, 80, 0.95);
+}
+
+/* ÉTAT AGRANDI */
+.post-pin.post-pin-expanded .post-pin-bubble {
+  border-radius: 10px;
+  max-width: 220px;
+}
+
+.post-pin.post-pin-expanded .post-pin-text {
+  white-space: normal;
+  max-width: 220px;
+}