diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/error-overlay-layout/error-overlay-layout.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/error-overlay-layout/error-overlay-layout.tsx
index 445b0cf92c294..a7d4aabdfb206 100644
--- a/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/error-overlay-layout/error-overlay-layout.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/error-overlay-layout/error-overlay-layout.tsx
@@ -5,7 +5,6 @@ import type { ErrorMessageType } from '../error-message/error-message'
 import type { ErrorType } from '../error-type-label/error-type-label'
 
 import { DialogContent, DialogFooter } from '../../Dialog'
-import { Overlay } from '../../Overlay'
 import {
   ErrorOverlayToolbar,
   styles as toolbarStyles,
@@ -33,6 +32,7 @@ import {
 } from '../dialog/header'
 import { ErrorOverlayDialogBody, DIALOG_BODY_STYLES } from '../dialog/body'
 import { CALL_STACK_STYLES } from '../call-stack/call-stack'
+import { OVERLAY_STYLES, ErrorOverlayOverlay } from '../overlay/overlay'
 
 type ErrorOverlayLayoutProps = {
   errorMessage: ErrorMessageType
@@ -69,7 +69,7 @@ export function ErrorOverlayLayout({
   isTurbopack,
 }: ErrorOverlayLayoutProps) {
   return (
-    <Overlay fixed={isBuildError}>
+    <ErrorOverlayOverlay fixed={isBuildError}>
       <ErrorOverlayDialog onClose={onClose} isTurbopack={isTurbopack}>
         <DialogContent>
           <ErrorOverlayFloatingHeader
@@ -106,11 +106,12 @@ export function ErrorOverlayLayout({
           </DialogFooter>
         </DialogContent>
       </ErrorOverlayDialog>
-    </Overlay>
+    </ErrorOverlayOverlay>
   )
 }
 
 export const styles = css`
+  ${OVERLAY_STYLES}
   ${DIALOG_STYLES}
   ${DIALOG_HEADER_STYLES}
   ${DIALOG_BODY_STYLES}
diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/overlay/overlay.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/overlay/overlay.tsx
new file mode 100644
index 0000000000000..4df3f15dca018
--- /dev/null
+++ b/packages/next/src/client/components/react-dev-overlay/_experimental/internal/components/Errors/overlay/overlay.tsx
@@ -0,0 +1,12 @@
+import { noop as css } from '../../../helpers/noop-template'
+import { Overlay, type OverlayProps } from '../../Overlay/Overlay'
+
+export function ErrorOverlayOverlay({ children, ...props }: OverlayProps) {
+  return <Overlay {...props}>{children}</Overlay>
+}
+
+export const OVERLAY_STYLES = css`
+  [data-nextjs-dialog-overlay] {
+    top: var(--size-8_5);
+  }
+`