diff --git a/frontend/style.css b/frontend/style.css
index 62bb864..3118e34 100644
--- a/frontend/style.css
+++ b/frontend/style.css
@@ -7700,6 +7700,8 @@ body.popup-mode .content-area {
   display: flex;
   align-items: center;
   justify-content: center;
+  padding: 16px;
+  box-sizing: border-box;
   opacity: 0;
   pointer-events: none;
   transition: opacity 200ms ease;
@@ -7715,8 +7717,16 @@ body.popup-mode .content-area {
   border: 1px solid var(--border);
   border-radius: 12px;
   box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
-  min-width: 400px;
-  max-width: 600px;
+  /* Correctif Phase 2 (modale de création de secret coupée en haut) :
+     sans max-height ni scroll interne, un formulaire long dépassait le
+     viewport. La modale est désormais bornée au viewport, en colonne
+     flex, avec seul le corps qui défile ; l'en-tête et le pied restent
+     toujours visibles. Sur petit écran, la largeur est bornée aussi. */
+  min-width: min(400px, calc(100vw - 32px));
+  max-width: min(600px, calc(100vw - 32px));
+  max-height: calc(100dvh - 32px);
+  display: flex;
+  flex-direction: column;
   transform: scale(0.9);
   transition: transform 200ms ease;
 }
@@ -7731,6 +7741,7 @@ body.popup-mode .content-area {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  flex-shrink: 0;
 }
 
 .obsigate-modal-title {
@@ -7742,6 +7753,8 @@ body.popup-mode .content-area {
 
 .obsigate-modal-body {
   padding: 20px;
+  overflow-y: auto;
+  min-height: 0;
 }
 
 .obsigate-modal-footer {
@@ -7750,6 +7763,7 @@ body.popup-mode .content-area {
   display: flex;
   gap: 10px;
   justify-content: flex-end;
+  flex-shrink: 0;
 }
 
 .modal-input {