diff --git a/apps/web/src/features/planning/recipe-picker-dialog.scss b/apps/web/src/features/planning/recipe-picker-dialog.scss
index 7eb5d19..9ef18f7 100644
--- a/apps/web/src/features/planning/recipe-picker-dialog.scss
+++ b/apps/web/src/features/planning/recipe-picker-dialog.scss
@@ -6,6 +6,32 @@
 
 .recipe-picker-dialog {
   max-width: 56rem;
+
+  // `.dialog-panel__body` (dialog.scss) is a plain block-flow scroll
+  // container by default — fine for every other dialog's small form, but
+  // this one's browsing step embeds the same components `/recettes` uses
+  // (`RecipeTable`'s `.recipe-table-wrap`, `RecipeSourcesPanel`'s
+  // `.recipes-page__catalog`), both of which size themselves with
+  // `flex: 1; min-height: 0` and need a `display: flex` ancestor for that
+  // to mean anything — on the real page that ancestor is `.recipes-page`
+  // itself (see its own doc comment for the identical fix that page
+  // needed once); this dialog never renders that wrapper, so without this
+  // the catalog/table just grew to its full content height instead of
+  // being clipped and independently scrollable within the dialog's own
+  // bounds — harmless for the handful of rows a personal recipe tab
+  // usually has, but a source tab's ~25-item browse list made it obvious:
+  // everything past the dialog's fixed height rendered, technically, just
+  // never inside the visible/scrollable area. Scoped to this dialog only
+  // — every other `Dialog` caller keeps the plain block layout.
+  .dialog-panel__body {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .recipe-table-wrap {
+    flex: 1;
+    min-height: 0;
+  }
 }
 
 .recipe-picker__filters {