fix: prevent mobile form and quick win overflow

app/static/css/style.css

@@ -410,6 +410,11 @@ p {
   gap: 14px;
 }
 
+.form-actions {
+  flex-wrap: wrap;
+  min-width: 0;
+}
+
 .progress {
   margin-top: 12px;
   height: 14px;
@@ -1442,6 +1447,8 @@ p {
   .form-panel h2 {
     font-size: 1.85rem;
     line-height: 1.08;
+    overflow-wrap: break-word;
+    hyphens: auto;
   }
 
   .complete-dialog__surface {
@@ -1478,11 +1485,12 @@ p {
   }
 
   .quick-win-tag span {
-    width: auto;
+    width: 100%;
     max-width: 100%;
     padding: 6px 11px;
     font-size: 0.84rem;
-    white-space: nowrap;
+    white-space: normal;
+    overflow-wrap: anywhere;
     text-align: center;
     justify-content: center;
   }
@@ -1491,6 +1499,17 @@ p {
     width: auto;
   }
 
+  .form-actions {
+    display: grid;
+    grid-template-columns: 1fr;
+    align-items: stretch;
+  }
+
+  .form-actions .button,
+  .form-actions a.button {
+    width: 100%;
+  }
+
   .quick-win-list__toolbar {
     justify-content: stretch;
   }
@@ -1586,6 +1605,9 @@ p {
   border: 0;
   padding: 0;
   background: transparent;
+  width: min(520px, calc(100vw - 16px));
+  max-width: calc(100vw - 16px);
+  overflow: visible;
 }
 
 .complete-dialog::backdrop {
@@ -1595,17 +1617,19 @@ p {
 
 .complete-dialog__surface {
   width: min(460px, calc(100vw - 24px));
+  max-width: calc(100vw - 24px);
   padding: 24px;
   border-radius: 28px;
   background: var(--surface-strong);
   box-shadow: var(--shadow);
   display: grid;
   gap: 18px;
+  min-width: 0;
 }
 
 .complete-dialog__surface--task {
-  width: min(520px, calc(100vw - 24px));
-  max-width: calc(100vw - 24px);
+  width: 100%;
+  max-width: 100%;
   overflow-x: hidden;
   overscroll-behavior-x: contain;
   touch-action: pan-y;