[DevOverlay] Fix floating header invisble on small screen (#74886)

This PR fixed the floating header being invisible when the screen height was small.

### Before

![CleanShot 2025-01-15 at 07 35 46](https://github.com/user-attachments/assets/0badd86c-2585-4b26-ba13-a62db4746f79)

### After

![CleanShot 2025-01-15 at 07 35 57](https://github.com/user-attachments/assets/68cd8f9b-25ea-4cdb-862a-7e504f8b67e3)

Closes NDX-661

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}

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);
+  }
+`