Carnet d'adresses : ajout/modification via une popup modale

- Formulaire de création/modification affiché dans une fenêtre modale
  (bouton « Ajouter une adresse » + action « Modifier » d'une ligne)
- Fermeture au succès, sur « Annuler » ou clic sur l'arrière-plan
- Suggestions BAN rendues dans le flux du panneau pour éviter la troncature
- Specs : Exigence 15 (nouveau critère 17) + description CarnetAdressesComponent

frontend/src/app/features/carnet-adresses/carnet-adresses.component.scss

@@ -17,14 +17,57 @@
   }
 }
 
+.carnet__entete {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1rem;
+}
+
+.btn--ajouter {
+  background: #0074b8;
+  color: #fff;
+  white-space: nowrap;
+
+  &:hover {
+    background: #f28c28;
+  }
+}
+
+.modale-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem;
+  background: rgba(0, 0, 0, 0.45);
+}
+
+.modale-panneau {
+  width: 100%;
+  max-width: 480px;
+  max-height: 90vh;
+  overflow-y: auto;
+  background: #fff;
+  border-radius: 10px;
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
+}
+
+// Dans la popup, l'overlay 'overflow-y: auto' du panneau tronque un menu
+// positionné en absolu : on affiche donc les suggestions dans le flux normal.
+.modale-panneau .suggestions {
+  position: static;
+  box-shadow: none;
+  max-height: 180px;
+}
+
 .carnet__form {
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  padding: 1rem;
-  border: 1px solid #dcdcdc;
-  border-radius: 8px;
-  background: #fafafa;
+  padding: 1.25rem;
 }
 
 .field {