diff --git a/proto/src/app/layout.tsx b/proto/src/app/layout.tsx
index 5d2ce2d..c62e553 100755
--- a/proto/src/app/layout.tsx
+++ b/proto/src/app/layout.tsx
@@ -1,4 +1,4 @@
-import type { Metadata } from "next";
+import type { Metadata, Viewport } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 
@@ -57,11 +57,17 @@ export const metadata: Metadata = {
   },
 };
 
+// Keep Safari's browser chrome neutral; only the in-page staging strip is amber.
+export const viewport: Viewport = {
+  themeColor: '#ffffff',
+};
+
 export default function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
+  const isStaging = process.env.NEXT_PUBLIC_DEPLOY_ENV === 'staging';
   return (
     <html lang="hu" suppressHydrationWarning>
       <head>
@@ -85,6 +91,11 @@ export default function RootLayout({
         style={{ background: 'var(--color-background)', color: 'var(--color-foreground)' }}
       >
         <ThemeProvider>
+          {isStaging && (
+            <div className="bg-amber-400 px-4 py-2 text-center text-xs font-extrabold tracking-[0.18em] text-amber-950 sm:text-sm">
+              ⚠ STAGING / TESZTKÖRNYEZET — A STAGING OLDALT LÁTOD
+            </div>
+          )}
           <Header />
           <main className="flex-1">
             {children}
