diff --git a/package-lock.json b/package-lock.json
index 9f51ed3d0..c4e0b3a87 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,7 +27,7 @@
 				"@wordpress/notices": "^5.44.0",
 				"@wordpress/plugins": "^7.44.0",
 				"@wordpress/primitives": "^4.45.0",
-				"@wordpress/ui": "^0.11.0",
+				"@wordpress/ui": "^0.12.0",
 				"@wordpress/url": "^4.44.0",
 				"@wordpress/wordcount": "^4.44.0",
 				"react": "^18.3.1"
@@ -10194,97 +10194,6 @@
 				"react": "^18.0.0"
 			}
 		},
-		"node_modules/@wordpress/admin-ui/node_modules/@wordpress/ui": {
-			"version": "0.12.0",
-			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.12.0.tgz",
-			"integrity": "sha512-n/xfyagM90CcikLtlvNcjsFZtpt1wTpboOZPyCp9wqF6akAyJ4SUg9hXb/UA7pC8JqGe1Dg/hXJnFn/td8pvRA==",
-			"license": "GPL-2.0-or-later",
-			"dependencies": {
-				"@base-ui/react": "^1.4.1",
-				"@wordpress/a11y": "^4.45.0",
-				"@wordpress/compose": "^7.45.0",
-				"@wordpress/element": "^6.45.0",
-				"@wordpress/i18n": "^6.18.0",
-				"@wordpress/icons": "^13.0.0",
-				"@wordpress/keycodes": "^4.45.0",
-				"@wordpress/primitives": "^4.45.0",
-				"@wordpress/private-apis": "^1.45.0",
-				"@wordpress/theme": "^0.12.0",
-				"clsx": "^2.1.1",
-				"tabbable": "^6.4.0"
-			},
-			"engines": {
-				"node": ">=20.10.0",
-				"npm": ">=10.2.3"
-			},
-			"peerDependencies": {
-				"react": "^18.0.0",
-				"react-dom": "^18.0.0"
-			}
-		},
-		"node_modules/@wordpress/admin-ui/node_modules/@wordpress/ui/node_modules/@base-ui/react": {
-			"version": "1.4.1",
-			"resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.4.1.tgz",
-			"integrity": "sha512-Ab5/LIhcmL8BQcsBUYiOfkSDRdLpvgUBzMK30cu684JPcLclYlztharvCZyNNgzJtbAiREzI9q0pI5erHCMgCw==",
-			"license": "MIT",
-			"dependencies": {
-				"@babel/runtime": "^7.29.2",
-				"@base-ui/utils": "0.2.8",
-				"@floating-ui/react-dom": "^2.1.8",
-				"@floating-ui/utils": "^0.2.11",
-				"use-sync-external-store": "^1.6.0"
-			},
-			"engines": {
-				"node": ">=14.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/mui-org"
-			},
-			"peerDependencies": {
-				"@date-fns/tz": "^1.2.0",
-				"@types/react": "^17 || ^18 || ^19",
-				"date-fns": "^4.0.0",
-				"react": "^17 || ^18 || ^19",
-				"react-dom": "^17 || ^18 || ^19"
-			},
-			"peerDependenciesMeta": {
-				"@date-fns/tz": {
-					"optional": true
-				},
-				"@types/react": {
-					"optional": true
-				},
-				"date-fns": {
-					"optional": true
-				}
-			}
-		},
-		"node_modules/@wordpress/admin-ui/node_modules/@wordpress/ui/node_modules/@floating-ui/react-dom": {
-			"version": "2.1.8",
-			"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
-			"integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
-			"license": "MIT",
-			"dependencies": {
-				"@floating-ui/dom": "^1.7.6"
-			},
-			"peerDependencies": {
-				"react": ">=16.8.0",
-				"react-dom": ">=16.8.0"
-			}
-		},
-		"node_modules/@wordpress/admin-ui/node_modules/@wordpress/ui/node_modules/date-fns": {
-			"version": "4.1.0",
-			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
-			"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
-			"license": "MIT",
-			"optional": true,
-			"peer": true,
-			"funding": {
-				"type": "github",
-				"url": "https://github.com/sponsors/kossnocorp"
-			}
-		},
 		"node_modules/@wordpress/api-fetch": {
 			"version": "7.44.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-7.44.0.tgz",
@@ -11045,6 +10954,85 @@
 				"react-dom": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/dataviews/node_modules/@base-ui/react": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.4.1.tgz",
+			"integrity": "sha512-Ab5/LIhcmL8BQcsBUYiOfkSDRdLpvgUBzMK30cu684JPcLclYlztharvCZyNNgzJtbAiREzI9q0pI5erHCMgCw==",
+			"license": "MIT",
+			"dependencies": {
+				"@babel/runtime": "^7.29.2",
+				"@base-ui/utils": "0.2.8",
+				"@floating-ui/react-dom": "^2.1.8",
+				"@floating-ui/utils": "^0.2.11",
+				"use-sync-external-store": "^1.6.0"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/mui-org"
+			},
+			"peerDependencies": {
+				"@date-fns/tz": "^1.2.0",
+				"@types/react": "^17 || ^18 || ^19",
+				"date-fns": "^4.0.0",
+				"react": "^17 || ^18 || ^19",
+				"react-dom": "^17 || ^18 || ^19"
+			},
+			"peerDependenciesMeta": {
+				"@date-fns/tz": {
+					"optional": true
+				},
+				"@types/react": {
+					"optional": true
+				},
+				"date-fns": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@wordpress/dataviews/node_modules/@floating-ui/react-dom": {
+			"version": "2.1.8",
+			"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+			"integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
+			"license": "MIT",
+			"dependencies": {
+				"@floating-ui/dom": "^1.7.6"
+			},
+			"peerDependencies": {
+				"react": ">=16.8.0",
+				"react-dom": ">=16.8.0"
+			}
+		},
+		"node_modules/@wordpress/dataviews/node_modules/@wordpress/ui": {
+			"version": "0.11.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.11.0.tgz",
+			"integrity": "sha512-V1R3CTQ8MltuajZ53PCHGe9mmRwyx1RpjHA2wWOv+79dV0qQ1Y/psL0YTMY4eteL4SNAlBcjJVP66zD5O6yF8Q==",
+			"license": "GPL-2.0-or-later",
+			"dependencies": {
+				"@base-ui/react": "^1.4.0",
+				"@wordpress/a11y": "^4.44.0",
+				"@wordpress/compose": "^7.44.0",
+				"@wordpress/element": "^6.44.0",
+				"@wordpress/i18n": "^6.17.0",
+				"@wordpress/icons": "^12.2.0",
+				"@wordpress/keycodes": "^4.44.0",
+				"@wordpress/primitives": "^4.44.0",
+				"@wordpress/private-apis": "^1.44.0",
+				"@wordpress/theme": "^0.11.0",
+				"clsx": "^2.1.1",
+				"tabbable": "^6.4.0"
+			},
+			"engines": {
+				"node": ">=20.10.0",
+				"npm": ">=10.2.3"
+			},
+			"peerDependencies": {
+				"react": "^18.0.0",
+				"react-dom": "^18.0.0"
+			}
+		},
 		"node_modules/@wordpress/dataviews/node_modules/date-fns": {
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
@@ -11201,6 +11189,57 @@
 				"react-dom": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/edit-post/node_modules/@base-ui/react": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.4.1.tgz",
+			"integrity": "sha512-Ab5/LIhcmL8BQcsBUYiOfkSDRdLpvgUBzMK30cu684JPcLclYlztharvCZyNNgzJtbAiREzI9q0pI5erHCMgCw==",
+			"license": "MIT",
+			"dependencies": {
+				"@babel/runtime": "^7.29.2",
+				"@base-ui/utils": "0.2.8",
+				"@floating-ui/react-dom": "^2.1.8",
+				"@floating-ui/utils": "^0.2.11",
+				"use-sync-external-store": "^1.6.0"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/mui-org"
+			},
+			"peerDependencies": {
+				"@date-fns/tz": "^1.2.0",
+				"@types/react": "^17 || ^18 || ^19",
+				"date-fns": "^4.0.0",
+				"react": "^17 || ^18 || ^19",
+				"react-dom": "^17 || ^18 || ^19"
+			},
+			"peerDependenciesMeta": {
+				"@date-fns/tz": {
+					"optional": true
+				},
+				"@types/react": {
+					"optional": true
+				},
+				"date-fns": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@wordpress/edit-post/node_modules/@floating-ui/react-dom": {
+			"version": "2.1.8",
+			"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+			"integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
+			"license": "MIT",
+			"dependencies": {
+				"@floating-ui/dom": "^1.7.6"
+			},
+			"peerDependencies": {
+				"react": ">=16.8.0",
+				"react-dom": ">=16.8.0"
+			}
+		},
 		"node_modules/@wordpress/edit-post/node_modules/@wordpress/admin-ui": {
 			"version": "1.12.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/admin-ui/-/admin-ui-1.12.0.tgz",
@@ -11224,6 +11263,46 @@
 				"react": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/edit-post/node_modules/@wordpress/ui": {
+			"version": "0.11.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.11.0.tgz",
+			"integrity": "sha512-V1R3CTQ8MltuajZ53PCHGe9mmRwyx1RpjHA2wWOv+79dV0qQ1Y/psL0YTMY4eteL4SNAlBcjJVP66zD5O6yF8Q==",
+			"license": "GPL-2.0-or-later",
+			"dependencies": {
+				"@base-ui/react": "^1.4.0",
+				"@wordpress/a11y": "^4.44.0",
+				"@wordpress/compose": "^7.44.0",
+				"@wordpress/element": "^6.44.0",
+				"@wordpress/i18n": "^6.17.0",
+				"@wordpress/icons": "^12.2.0",
+				"@wordpress/keycodes": "^4.44.0",
+				"@wordpress/primitives": "^4.44.0",
+				"@wordpress/private-apis": "^1.44.0",
+				"@wordpress/theme": "^0.11.0",
+				"clsx": "^2.1.1",
+				"tabbable": "^6.4.0"
+			},
+			"engines": {
+				"node": ">=20.10.0",
+				"npm": ">=10.2.3"
+			},
+			"peerDependencies": {
+				"react": "^18.0.0",
+				"react-dom": "^18.0.0"
+			}
+		},
+		"node_modules/@wordpress/edit-post/node_modules/date-fns": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
+			"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
+			"license": "MIT",
+			"optional": true,
+			"peer": true,
+			"funding": {
+				"type": "github",
+				"url": "https://github.com/sponsors/kossnocorp"
+			}
+		},
 		"node_modules/@wordpress/editor": {
 			"version": "14.44.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/editor/-/editor-14.44.0.tgz",
@@ -11666,6 +11745,57 @@
 				"react-dom": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/interface/node_modules/@base-ui/react": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.4.1.tgz",
+			"integrity": "sha512-Ab5/LIhcmL8BQcsBUYiOfkSDRdLpvgUBzMK30cu684JPcLclYlztharvCZyNNgzJtbAiREzI9q0pI5erHCMgCw==",
+			"license": "MIT",
+			"dependencies": {
+				"@babel/runtime": "^7.29.2",
+				"@base-ui/utils": "0.2.8",
+				"@floating-ui/react-dom": "^2.1.8",
+				"@floating-ui/utils": "^0.2.11",
+				"use-sync-external-store": "^1.6.0"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/mui-org"
+			},
+			"peerDependencies": {
+				"@date-fns/tz": "^1.2.0",
+				"@types/react": "^17 || ^18 || ^19",
+				"date-fns": "^4.0.0",
+				"react": "^17 || ^18 || ^19",
+				"react-dom": "^17 || ^18 || ^19"
+			},
+			"peerDependenciesMeta": {
+				"@date-fns/tz": {
+					"optional": true
+				},
+				"@types/react": {
+					"optional": true
+				},
+				"date-fns": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@wordpress/interface/node_modules/@floating-ui/react-dom": {
+			"version": "2.1.8",
+			"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+			"integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
+			"license": "MIT",
+			"dependencies": {
+				"@floating-ui/dom": "^1.7.6"
+			},
+			"peerDependencies": {
+				"react": ">=16.8.0",
+				"react-dom": ">=16.8.0"
+			}
+		},
 		"node_modules/@wordpress/interface/node_modules/@wordpress/admin-ui": {
 			"version": "1.12.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/admin-ui/-/admin-ui-1.12.0.tgz",
@@ -11689,6 +11819,46 @@
 				"react": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/interface/node_modules/@wordpress/ui": {
+			"version": "0.11.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.11.0.tgz",
+			"integrity": "sha512-V1R3CTQ8MltuajZ53PCHGe9mmRwyx1RpjHA2wWOv+79dV0qQ1Y/psL0YTMY4eteL4SNAlBcjJVP66zD5O6yF8Q==",
+			"license": "GPL-2.0-or-later",
+			"dependencies": {
+				"@base-ui/react": "^1.4.0",
+				"@wordpress/a11y": "^4.44.0",
+				"@wordpress/compose": "^7.44.0",
+				"@wordpress/element": "^6.44.0",
+				"@wordpress/i18n": "^6.17.0",
+				"@wordpress/icons": "^12.2.0",
+				"@wordpress/keycodes": "^4.44.0",
+				"@wordpress/primitives": "^4.44.0",
+				"@wordpress/private-apis": "^1.44.0",
+				"@wordpress/theme": "^0.11.0",
+				"clsx": "^2.1.1",
+				"tabbable": "^6.4.0"
+			},
+			"engines": {
+				"node": ">=20.10.0",
+				"npm": ">=10.2.3"
+			},
+			"peerDependencies": {
+				"react": "^18.0.0",
+				"react-dom": "^18.0.0"
+			}
+		},
+		"node_modules/@wordpress/interface/node_modules/date-fns": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
+			"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
+			"license": "MIT",
+			"optional": true,
+			"peer": true,
+			"funding": {
+				"type": "github",
+				"url": "https://github.com/sponsors/kossnocorp"
+			}
+		},
 		"node_modules/@wordpress/is-shallow-equal": {
 			"version": "5.45.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/is-shallow-equal/-/is-shallow-equal-5.45.0.tgz",
@@ -11859,6 +12029,97 @@
 				"react": "^18.0.0"
 			}
 		},
+		"node_modules/@wordpress/media-utils/node_modules/@base-ui/react": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/@base-ui/react/-/react-1.4.1.tgz",
+			"integrity": "sha512-Ab5/LIhcmL8BQcsBUYiOfkSDRdLpvgUBzMK30cu684JPcLclYlztharvCZyNNgzJtbAiREzI9q0pI5erHCMgCw==",
+			"license": "MIT",
+			"dependencies": {
+				"@babel/runtime": "^7.29.2",
+				"@base-ui/utils": "0.2.8",
+				"@floating-ui/react-dom": "^2.1.8",
+				"@floating-ui/utils": "^0.2.11",
+				"use-sync-external-store": "^1.6.0"
+			},
+			"engines": {
+				"node": ">=14.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/mui-org"
+			},
+			"peerDependencies": {
+				"@date-fns/tz": "^1.2.0",
+				"@types/react": "^17 || ^18 || ^19",
+				"date-fns": "^4.0.0",
+				"react": "^17 || ^18 || ^19",
+				"react-dom": "^17 || ^18 || ^19"
+			},
+			"peerDependenciesMeta": {
+				"@date-fns/tz": {
+					"optional": true
+				},
+				"@types/react": {
+					"optional": true
+				},
+				"date-fns": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@wordpress/media-utils/node_modules/@floating-ui/react-dom": {
+			"version": "2.1.8",
+			"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+			"integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
+			"license": "MIT",
+			"dependencies": {
+				"@floating-ui/dom": "^1.7.6"
+			},
+			"peerDependencies": {
+				"react": ">=16.8.0",
+				"react-dom": ">=16.8.0"
+			}
+		},
+		"node_modules/@wordpress/media-utils/node_modules/@wordpress/ui": {
+			"version": "0.11.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.11.0.tgz",
+			"integrity": "sha512-V1R3CTQ8MltuajZ53PCHGe9mmRwyx1RpjHA2wWOv+79dV0qQ1Y/psL0YTMY4eteL4SNAlBcjJVP66zD5O6yF8Q==",
+			"license": "GPL-2.0-or-later",
+			"dependencies": {
+				"@base-ui/react": "^1.4.0",
+				"@wordpress/a11y": "^4.44.0",
+				"@wordpress/compose": "^7.44.0",
+				"@wordpress/element": "^6.44.0",
+				"@wordpress/i18n": "^6.17.0",
+				"@wordpress/icons": "^12.2.0",
+				"@wordpress/keycodes": "^4.44.0",
+				"@wordpress/primitives": "^4.44.0",
+				"@wordpress/private-apis": "^1.44.0",
+				"@wordpress/theme": "^0.11.0",
+				"clsx": "^2.1.1",
+				"tabbable": "^6.4.0"
+			},
+			"engines": {
+				"node": ">=20.10.0",
+				"npm": ">=10.2.3"
+			},
+			"peerDependencies": {
+				"react": "^18.0.0",
+				"react-dom": "^18.0.0"
+			}
+		},
+		"node_modules/@wordpress/media-utils/node_modules/date-fns": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
+			"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
+			"license": "MIT",
+			"optional": true,
+			"peer": true,
+			"funding": {
+				"type": "github",
+				"url": "https://github.com/sponsors/kossnocorp"
+			}
+		},
 		"node_modules/@wordpress/notices": {
 			"version": "5.44.0",
 			"resolved": "https://registry.npmjs.org/@wordpress/notices/-/notices-5.44.0.tgz",
@@ -12723,21 +12984,21 @@
 			}
 		},
 		"node_modules/@wordpress/ui": {
-			"version": "0.11.0",
-			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.11.0.tgz",
-			"integrity": "sha512-V1R3CTQ8MltuajZ53PCHGe9mmRwyx1RpjHA2wWOv+79dV0qQ1Y/psL0YTMY4eteL4SNAlBcjJVP66zD5O6yF8Q==",
+			"version": "0.12.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/ui/-/ui-0.12.0.tgz",
+			"integrity": "sha512-n/xfyagM90CcikLtlvNcjsFZtpt1wTpboOZPyCp9wqF6akAyJ4SUg9hXb/UA7pC8JqGe1Dg/hXJnFn/td8pvRA==",
 			"license": "GPL-2.0-or-later",
 			"dependencies": {
-				"@base-ui/react": "^1.4.0",
-				"@wordpress/a11y": "^4.44.0",
-				"@wordpress/compose": "^7.44.0",
-				"@wordpress/element": "^6.44.0",
-				"@wordpress/i18n": "^6.17.0",
-				"@wordpress/icons": "^12.2.0",
-				"@wordpress/keycodes": "^4.44.0",
-				"@wordpress/primitives": "^4.44.0",
-				"@wordpress/private-apis": "^1.44.0",
-				"@wordpress/theme": "^0.11.0",
+				"@base-ui/react": "^1.4.1",
+				"@wordpress/a11y": "^4.45.0",
+				"@wordpress/compose": "^7.45.0",
+				"@wordpress/element": "^6.45.0",
+				"@wordpress/i18n": "^6.18.0",
+				"@wordpress/icons": "^13.0.0",
+				"@wordpress/keycodes": "^4.45.0",
+				"@wordpress/primitives": "^4.45.0",
+				"@wordpress/private-apis": "^1.45.0",
+				"@wordpress/theme": "^0.12.0",
 				"clsx": "^2.1.1",
 				"tabbable": "^6.4.0"
 			},
@@ -12801,6 +13062,24 @@
 				"react-dom": ">=16.8.0"
 			}
 		},
+		"node_modules/@wordpress/ui/node_modules/@wordpress/icons": {
+			"version": "13.0.0",
+			"resolved": "https://registry.npmjs.org/@wordpress/icons/-/icons-13.0.0.tgz",
+			"integrity": "sha512-+CLbvNdzMUHxQK5I6gFdHb3X6EVAH6SOSIj0xtMWm6PZO+Nnf7tXHfNBuxqTnGfxT5grtfb6D3A9ZMBU+Tpv+Q==",
+			"license": "GPL-2.0-or-later",
+			"dependencies": {
+				"@wordpress/element": "^6.45.0",
+				"@wordpress/primitives": "^4.45.0",
+				"change-case": "4.1.2"
+			},
+			"engines": {
+				"node": ">=18.12.0",
+				"npm": ">=8.19.2"
+			},
+			"peerDependencies": {
+				"react": "^18.0.0"
+			}
+		},
 		"node_modules/@wordpress/ui/node_modules/date-fns": {
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
diff --git a/package.json b/package.json
index 5c8e683b0..744faffd9 100644
--- a/package.json
+++ b/package.json
@@ -83,7 +83,7 @@
 		"@wordpress/notices": "^5.44.0",
 		"@wordpress/plugins": "^7.44.0",
 		"@wordpress/primitives": "^4.45.0",
-		"@wordpress/ui": "^0.11.0",
+		"@wordpress/ui": "^0.12.0",
 		"@wordpress/url": "^4.44.0",
 		"@wordpress/wordcount": "^4.44.0",
 		"react": "^18.3.1"
diff --git a/routes/ai-home/stage.tsx b/routes/ai-home/stage.tsx
index 2ed21bb2b..2e12a56f3 100644
--- a/routes/ai-home/stage.tsx
+++ b/routes/ai-home/stage.tsx
@@ -4,10 +4,15 @@
 import { Page } from '@wordpress/admin-ui';
 import {
 	Button,
-	ExternalLink,
-	Spinner,
-	ToggleControl,
-} from '@wordpress/components';
+	Card,
+	Icon,
+	Link,
+	Notice,
+	Popover,
+	Stack,
+	VisuallyHidden,
+} from '@wordpress/ui';
+import { Spinner, ToggleControl } from '@wordpress/components';
 import { store as coreStore } from '@wordpress/core-data';
 import { useDispatch, useRegistry, useSelect } from '@wordpress/data';
 import type { DataFormControlProps, Field, Form } from '@wordpress/dataviews';
@@ -16,7 +21,6 @@ import { useCallback, useMemo, useState } from '@wordpress/element';
 import { __, _n, sprintf } from '@wordpress/i18n';
 import { info as infoIcon } from '@wordpress/icons';
 import { store as noticesStore } from '@wordpress/notices';
-import { Icon, Notice, Popover, VisuallyHidden } from '@wordpress/ui';
 
 /**
  * Internal dependencies
@@ -394,9 +398,9 @@ function SectionActions( {
 	}, [ experimentSettings, data, onBulkChange ] );
 
 	return (
-		<div className="ai-section-actions">
+		<Stack className="ai-section-actions" direction="row" gap="sm">
 			<Button
-				variant="secondary"
+				variant="outline"
 				size="compact"
 				onClick={ handleEnableAll }
 				disabled={ ! globalEnabled || allEnabled }
@@ -404,14 +408,14 @@ function SectionActions( {
 				{ __( 'Enable all', 'ai' ) }
 			</Button>
 			<Button
-				variant="secondary"
+				variant="outline"
 				size="compact"
 				onClick={ handleDisableAll }
 				disabled={ ! globalEnabled || allDisabled }
 			>
 				{ __( 'Disable all', 'ai' ) }
 			</Button>
-		</div>
+		</Stack>
 	);
 }
 
@@ -510,7 +514,7 @@ function InlineFeatureSettings( { feature }: { feature: FeatureData } ) {
 	] );
 
 	return (
-		<div className="ai-feature-settings-form">
+		<Stack direction="column" gap="md" className="ai-feature-settings-form">
 			<DataForm< Record< string, unknown > >
 				data={ data }
 				fields={ fields }
@@ -518,11 +522,10 @@ function InlineFeatureSettings( { feature }: { feature: FeatureData } ) {
 				onChange={ handleChange }
 			/>
 			{ isDirty && (
-				<div className="ai-feature-settings-form__actions">
+				<Stack align="flex-end" direction="row">
 					<Button
-						variant="primary"
+						variant="solid"
 						onClick={ handleSave }
-						isBusy={ isSaving }
 						disabled={ isSaving }
 						size="compact"
 						aria-label={ sprintf(
@@ -530,12 +533,16 @@ function InlineFeatureSettings( { feature }: { feature: FeatureData } ) {
 							__( 'Save %s settings', 'ai' ),
 							feature.label
 						) }
+						loadingAnnouncement={
+							isSaving ? __( 'Saving settings…', 'ai' ) : ''
+						}
+						loading={ isSaving }
 					>
 						{ __( 'Save', 'ai' ) }
 					</Button>
-				</div>
+				</Stack>
 			) }
-		</div>
+		</Stack>
 	);
 }
 
@@ -586,17 +593,15 @@ function VisualCardToggle( {
 	const checked = !! field.getValue( { item: data } );
 
 	return (
-		<div
-			className={ `ai-showcase-card${
+		<Card.Root
+			className={ `${
 				! globalEnabled ? ' ai-showcase-card--disabled' : ''
 			}` }
 		>
 			{ feature?.image && (
-				<div className="ai-showcase-card__image">
-					<img src={ feature.image } alt="" loading="lazy" />
-				</div>
+				<img alt="" loading="lazy" src={ feature.image } />
 			) }
-			<div className="ai-showcase-card__content">
+			<Card.Content>
 				<ToggleControl
 					label={ field.label }
 					checked={ checked }
@@ -606,8 +611,8 @@ function VisualCardToggle( {
 					disabled={ ! globalEnabled }
 					help={ field.description }
 				/>
-			</div>
-		</div>
+			</Card.Content>
+		</Card.Root>
 	);
 }
 
@@ -907,14 +912,20 @@ function AISettingsPage() {
 				'ai'
 			) }
 			actions={
-				<div className="ai-settings-page__actions">
-					<ExternalLink href="https://github.com/WordPress/ai/tree/develop/docs">
+				<>
+					<Link
+						href="https://github.com/WordPress/ai/tree/develop/docs"
+						openInNewTab
+					>
 						{ __( 'Docs', 'ai' ) }
-					</ExternalLink>
-					<ExternalLink href="https://github.com/WordPress/ai/blob/develop/CONTRIBUTING.md">
+					</Link>
+					<Link
+						href="https://github.com/WordPress/ai/blob/develop/CONTRIBUTING.md"
+						openInNewTab
+					>
 						{ __( 'Contribute', 'ai' ) }
-					</ExternalLink>
-					<div className="ai-settings-page__global-toggle">
+					</Link>
+					<Stack align="center" gap="xs">
 						<ToggleControl
 							label={ __( 'Enable AI', 'ai' ) }
 							checked={ globalEnabled }
@@ -926,16 +937,13 @@ function AISettingsPage() {
 							disabled={ isLoading }
 						/>
 						<InfoTip content={ globalToggleDescription } />
-					</div>
-				</div>
+					</Stack>
+				</>
 			}
 		>
-			<div className="ai-settings-page">
+			<Stack className="ai-settings-page" direction="column" gap="md">
 				{ ! PAGE_DATA.hasValidCredentials && (
-					<Notice.Root
-						className="ai-settings-page__notice"
-						intent="error"
-					>
+					<Notice.Root intent="error">
 						<Notice.Description>
 							{ ! PAGE_DATA.hasCredentials
 								? __(
@@ -959,7 +967,13 @@ function AISettingsPage() {
 					</Notice.Root>
 				) }
 				{ isLoading ? (
-					<Spinner />
+					<Stack
+						align="center"
+						className="ai-settings-page__loading"
+						justify="center"
+					>
+						<Spinner />
+					</Stack>
 				) : (
 					<DataForm< AISettings >
 						data={ data }
@@ -968,7 +982,7 @@ function AISettingsPage() {
 						onChange={ handleChange }
 					/>
 				) }
-			</div>
+			</Stack>
 		</Page>
 	);
 }
diff --git a/routes/ai-home/style.scss b/routes/ai-home/style.scss
index 15f36b4e1..211d5d92a 100644
--- a/routes/ai-home/style.scss
+++ b/routes/ai-home/style.scss
@@ -8,32 +8,6 @@
 	@media (max-width: 480px) {
 		padding: 8px;
 	}
-
-	.dataforms-layouts-card__field-header-label {
-		font-size: 1rem;
-		font-weight: 600;
-	}
-
-	.dataforms-layouts-card__field-description {
-		margin-bottom: 36px;
-	}
-}
-
-.ai-settings-page__notice {
-	margin-bottom: 24px;
-}
-
-.ai-settings-page__actions {
-	display: flex;
-	flex-wrap: wrap;
-	align-items: center;
-	gap: 16px;
-}
-
-.ai-settings-page__global-toggle {
-	display: flex;
-	align-items: center;
-	gap: 4px;
 }
 
 .ai-settings-page__infotip-trigger {
@@ -60,68 +34,23 @@
 	line-height: 1.5;
 }
 
-.ai-settings-page__link {
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-
-	svg {
-		fill: currentColor;
-	}
-}
 
 .ai-feature-settings-form {
-	margin-top: 4px;
+	margin-top: var(--wpds-dimension-padding-xs);
 	padding-left: 40px;
 	max-width: 480px;
-
-	.components-base-control__label,
-	.components-input-control__label,
-	.dataforms-layouts-regular__field-label {
-		text-transform: none !important;
-	}
-}
-
-.ai-feature-settings-form__actions {
-	display: flex;
-	justify-content: flex-end;
-	margin-top: 12px;
 }
 
 .ai-section-actions {
-	border-top: 1px solid var(--wp-components-color-gray-200);
-	display: flex;
-	gap: 8px;
-	margin-top: 16px;
-	padding-top: 12px;
-}
-
-.ai-showcase-card {
-	display: flex;
-	flex-direction: column;
-	border: 1px solid #ddd;
-	border-radius: 8px;
-	overflow: hidden;
-	background: #fff;
-}
-
-.ai-showcase-card__image {
-	width: 100%;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	overflow: hidden;
-
-	img {
-		width: 100%;
-		height: 100%;
-	}
-}
-
-.ai-showcase-card__content {
-	padding: 24px;
+	border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak);
+	margin-top: var(--wpds-dimension-padding-md);
+	padding-top: var(--wpds-dimension-padding-sm);
 }
 
 .ai-showcase-card--disabled {
 	opacity: 0.6;
 }
+
+.ai-settings-page__loading {
+	min-height: calc(50vh); // Leave space for the page header.
+}
diff --git a/tests/e2e/utils/helpers.ts b/tests/e2e/utils/helpers.ts
index 8c1849487..164a90806 100644
--- a/tests/e2e/utils/helpers.ts
+++ b/tests/e2e/utils/helpers.ts
@@ -198,42 +198,17 @@ export const enableExperiment = async (
 ) => {
 	await visitSettingsPage( admin );
 
-	// Visual-card features use a showcase card with an Enable/Disable button
-	// instead of a toggle input.
-	const showcaseCard = page.locator( '.ai-showcase-card', {
-		has: page.locator( '.ai-showcase-card__title', {
-			hasText: experimentLabel,
-		} ),
-	} );
-
-	// Wait for either the showcase card or the toggle to appear.
 	const toggle = page.getByLabel( experimentLabel );
-	await expect( showcaseCard.or( toggle ) ).toBeVisible( {
-		timeout: 10000,
-	} );
-
-	if ( await showcaseCard.isVisible() ) {
-		// Already enabled if the "Enabled" badge is visible.
-		if (
-			await showcaseCard
-				.locator( '.ai-showcase-card__enabled-badge' )
-				.isVisible()
-		) {
-			return;
-		}
+	await expect( toggle ).toBeVisible( { timeout: 10000 } );
+	await expect( toggle ).toBeEnabled( { timeout: 10000 } );
 
-		await showcaseCard
-			.locator( '.ai-showcase-card__actions button' )
-			.click();
-	} else {
-		// Nothing to do if this experiment is already enabled.
-		if ( await toggle.isChecked() ) {
-			return;
-		}
-
-		await toggle.check();
+	// Nothing to do if this experiment is already enabled.
+	if ( await toggle.isChecked() ) {
+		return;
 	}
 
+	await toggle.check();
+
 	// Ensure the save was successful.
 	await expect(
 		page.locator( '.components-snackbar__content', {
@@ -256,42 +231,17 @@ export const disableExperiment = async (
 ) => {
 	await visitSettingsPage( admin );
 
-	// Visual-card features use a showcase card with an Enable/Disable button
-	// instead of a toggle input.
-	const showcaseCard = page.locator( '.ai-showcase-card', {
-		has: page.locator( '.ai-showcase-card__title', {
-			hasText: experimentLabel,
-		} ),
-	} );
-
-	// Wait for either the showcase card or the toggle to appear.
 	const toggle = page.getByLabel( experimentLabel );
-	await expect( showcaseCard.or( toggle ) ).toBeVisible( {
-		timeout: 10000,
-	} );
-
-	if ( await showcaseCard.isVisible() ) {
-		// Already disabled if there's no "Enabled" badge.
-		if (
-			! ( await showcaseCard
-				.locator( '.ai-showcase-card__enabled-badge' )
-				.isVisible() )
-		) {
-			return;
-		}
+	await expect( toggle ).toBeVisible( { timeout: 10000 } );
+	await expect( toggle ).toBeEnabled( { timeout: 10000 } );
 
-		await showcaseCard
-			.locator( '.ai-showcase-card__actions button' )
-			.click();
-	} else {
-		// Nothing to do if this experiment is already disabled.
-		if ( ! ( await toggle.isChecked() ) ) {
-			return;
-		}
-
-		await toggle.uncheck();
+	// Nothing to do if this experiment is already disabled.
+	if ( ! ( await toggle.isChecked() ) ) {
+		return;
 	}
 
+	await toggle.uncheck();
+
 	// Ensure the save was successful.
 	await expect(
 		page.locator( '.components-snackbar__content', {