Keep flattener header visible and auto-copy pull ref after push

Cap scrollable centered modals so only the body scrolls when push
options expand, and copy the image pull ref to the clipboard on success.

ui/modern.css

@@ -3665,13 +3665,48 @@ table.pd-col-table td.pd-col-hidden {
   --pd-modal-pad-x: 1.5rem;
 }
 
-/* Scrollable bodies keep header/footer chrome intact */
+/* Scrollable bodies keep header/footer chrome intact.
+   BS5 sets max-height:none on centered+scrollable, which lets tall forms
+   re-center and shove the header above the viewport when sections expand
+   (e.g. Flatten → Push to registry). Force a viewport cap + body scroll. */
+.modal-dialog-scrollable {
+  max-height: calc(100vh - var(--titlebar-h, 42px) - 1.75rem);
+}
+
 .modal-dialog-scrollable .modal-content {
-  max-height: calc(100vh - var(--titlebar-h, 42px) - 2.5rem);
+  max-height: calc(100vh - var(--titlebar-h, 42px) - 1.75rem) !important;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.modal-dialog-centered.modal-dialog-scrollable {
+  /* Prefer top-aligned within the viewport once content is tall, so header stays visible */
+  height: calc(100% - var(--titlebar-h, 42px) - 1.5rem);
+  max-height: calc(100vh - var(--titlebar-h, 42px) - 1.5rem);
+  margin-top: max(0.75rem, calc(var(--titlebar-h, 42px) * 0.35 + 0.35rem));
+  margin-bottom: 0.75rem;
+  /* Still center short modals; tall ones cap and scroll body */
+  align-items: flex-start;
+  justify-content: flex-start;
+  padding-top: 0.25rem;
+}
+
+.modal-dialog-centered.modal-dialog-scrollable .modal-content {
+  max-height: calc(100vh - var(--titlebar-h, 42px) - 2.25rem) !important;
+  width: 100%;
+}
+
+.modal-dialog-scrollable .modal-header,
+.modal-dialog-scrollable .modal-footer {
+  flex-shrink: 0;
 }
 
 .modal-dialog-scrollable .modal-body {
+  overflow-y: auto;
   overscroll-behavior: contain;
+  min-height: 0; /* allow flex child to shrink and scroll */
+  -webkit-overflow-scrolling: touch;
 }
 
 /* Accordion inside modals (duplicate form etc.) */
@@ -4349,6 +4384,20 @@ table.pd-col-table td.pd-col-hidden {
 /* ── Container Flattener modal ── */
 .flatten-modal {
   border-radius: 16px !important;
+  /* Ensure flex chain from dialog → content → body always scrolls body only */
+  max-height: inherit;
+}
+
+#containerFlattenerModal .modal-header {
+  flex-shrink: 0;
+  z-index: 1;
+  background: linear-gradient(180deg, rgba(18, 26, 36, 0.98) 0%, rgba(18, 26, 36, 0.92) 100%) !important;
+}
+
+#containerFlattenerModal .modal-footer {
+  flex-shrink: 0;
+  z-index: 1;
+  background: linear-gradient(0deg, rgba(13, 19, 28, 0.98) 0%, rgba(13, 19, 28, 0.9) 100%) !important;
 }
 
 .flatten-callout {