diff --git a/projects/js-packages/base-styles/admin-page-layout.scss b/projects/js-packages/base-styles/admin-page-layout.scss
index 5effd6e6bcce..22454d7c2c0a 100644
--- a/projects/js-packages/base-styles/admin-page-layout.scss
+++ b/projects/js-packages/base-styles/admin-page-layout.scss
@@ -206,8 +206,14 @@ $jp-breakpoint-mobile: 782px;
 	// admin-ui 2.0.0 moved internals to CSS Modules (no `.admin-ui-page*`
 	// class hooks anymore). We pass `className="jp-admin-page__page"` from
 	// <AdminPage>; admin-ui forwards it onto the page's outer node. The
-	// header is a stable `<header>` element directly inside that node, so
-	// we anchor to `> header` instead of a class.
+	// page's <Header> is always rendered as the first child of that node, so
+	// we anchor structurally to `> :first-child` instead of a class. We used
+	// to target `> header`, but @wordpress/admin-ui 2.1.0 (Gutenberg PR
+	// WordPress/gutenberg#78001, "Fix nested landmark in header") removed
+	// `render={ <header /> }` from the page header's Stack so the rendered
+	// element changed from `<header>` to `<div>`. `:first-child` matches
+	// regardless of element type, keeping us forward-compatible with 2.1+
+	// AND backward-compatible with 2.0's `<header>`.
 	.jp-admin-page__page {
 		flex: 1 1 auto;
 		min-height: 0;
@@ -216,7 +222,7 @@ $jp-breakpoint-mobile: 782px;
 		flex-direction: column;
 	}
 
-	.jp-admin-page__page > header {
+	.jp-admin-page__page > :first-child {
 		flex-shrink: 0;              // pinned at top of the flex column.
 	}
 
@@ -225,7 +231,7 @@ $jp-breakpoint-mobile: 782px;
 	// strip's own hairline becomes the only divider between header and tab
 	// content. Same `:has()` pattern used elsewhere in this mixin to react
 	// to the page's content shape.
-	.jp-admin-page__page:has(.jp-admin-page-tabs) > header {
+	.jp-admin-page__page:has(.jp-admin-page-tabs) > :first-child {
 		border-bottom: none;
 		padding-bottom: 0;
 	}
@@ -253,7 +259,7 @@ $jp-breakpoint-mobile: 782px;
 	// fill their bounded slot. Form-style pages keep working: their
 	// children stay content-sized (default `flex: 0 1 auto`) and any
 	// overflow still falls back to Container's `overflow: auto`.
-	.jp-admin-page__page > :not(header):not(.jetpack-footer) {
+	.jp-admin-page__page > :not(:first-child):not(.jetpack-footer) {
 		flex: 1 1 auto;
 		min-height: 0;
 		min-width: 0;
diff --git a/projects/js-packages/base-styles/changelog/fix-admin-page-layout-header-selector b/projects/js-packages/base-styles/changelog/fix-admin-page-layout-header-selector
new file mode 100644
index 000000000000..002a7e011c5b
--- /dev/null
+++ b/projects/js-packages/base-styles/changelog/fix-admin-page-layout-header-selector
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Base styles: Update admin-page-layout mixin's header selector from `> header` to `> :first-child` so it keeps matching after @wordpress/admin-ui 2.1 changed the page header element from `<header>` to `<div>`.