diff --git a/app/layout.tsx b/app/layout.tsx
new file mode 100644
index 0000000..d421a74
--- /dev/null
+++ b/app/layout.tsx
@@ -0,0 +1,188 @@
+import type { Metadata } from "next";
+import "./globals.css";
+// Tailwind CSS v4 - Empty on CodeSandbox (uses CDN), filled by postinstall on Vercel
+// import "./tailwind.css";
+import { GeistSans } from "geist/font/sans";
+import { cn } from "@/lib/utils";
+import { ThemeProvider } from "@/context/theme-provider";
+import { NavBar } from "@/components/navbar";
+import { Footer } from "@/components/footer";
+import { KleapScripts } from "@/components/kleap-scripts";
+import { DevToolsGuard } from "./devtools-guard";
+import { TailwindCDNClient } from "@/components/tailwind-cdn-client";
+
+import { Playfair_Display, Libre_Baskerville } from "next/font/google";
+
+const playfair = Playfair_Display({
+ subsets: ["latin"],
+ variable: "--font-playfair",
+});
+
+const baskerville = Libre_Baskerville({
+ weight: ["400", "700"],
+ subsets: ["latin"],
+ variable: "--font-baskerville",
+});
+
+export const metadata: Metadata = {
+ title: {
+ default: "Mnémosyne - Portfolio d'Érudition & Innovation",
+ template: "%s | Mnémosyne",
+ },
+ description:
+ "Découvrez le portfolio de Mnémosyne, alliant recherches historiques, littérature classique et innovations technologiques modernes.",
+ keywords: ["SaaS", "AI", "Template", "Next.js", "React", "TypeScript"],
+ authors: [{ name: "Mnémosyne" }],
+ creator: "Mnémosyne",
+ publisher: "Mnémosyne",
+ icons: {
+ icon: "/favicon.ico",
+ shortcut: "/favicon.ico",
+ apple: "/favicon.ico",
+ },
+ robots: {
+ index: true,
+ follow: true,
+ googleBot: {
+ index: true,
+ follow: true,
+ "max-video-preview": -1,
+ "max-image-preview": "large",
+ "max-snippet": -1,
+ },
+ },
+ openGraph: {
+ type: "website",
+ locale: "en_US",
+ url: process.env.NEXT_PUBLIC_URL || "https://kleap.co",
+ siteName: "Mnémosyne",
+ title: "Mnémosyne - Histoire, Littérature et Érudition",
+ description:
+ "Mnémosyne est une plateforme collaborative dédiée à l'histoire, la littérature et l'érudition. Partagez vos idées et découvrez des contenus riches.",
+ images: [
+ {
+ url: "/og-image.png",
+ width: 1200,
+ height: 630,
+ alt: "Mnémosyne",
+ },
+ ],
+ },
+ twitter: {
+ card: "summary_large_image",
+ title: "Mnémosyne - Portfolio d'Érudition & Innovation",
+ description:
+ "Découvrez le portfolio de Mnémosyne, alliant recherches historiques, littérature classique et innovations technologiques modernes.",
+ images: ["/og-image.png"],
+ creator: "@yourtwitter",
+ },
+ metadataBase: new URL(process.env.NEXT_PUBLIC_URL || "https://kleap.co"),
+ alternates: {
+ canonical: "/",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+ return (
+
+
+ {/*
+ Tailwind CSS v4:
+ - CodeSandbox: Uses CDN (loaded here in BEFORE React)
+ - Vercel: Uses compiled CSS via @tailwindcss/postcss (imported above)
+ */}
+
+ {/*
+ CRITICAL: Base styles to prevent FOUC and hydration errors
+ ⚠️ DO NOT REMOVE OR MODIFY WITHOUT CAREFUL TESTING ⚠️
+ React 19 requires href and precedence attributes on style tags
+ */}
+
+
+
+
+
+
+
+
+
+ {children}
+
+
+
+
+
+ );
+}