fix(theme): align initial theme and visual tokens

src/app/layout.tsx

@@ -15,13 +15,24 @@ export const metadata: Metadata = {
   ],
 };
 
+const themeScript = `
+  try {
+    const savedTheme = localStorage.getItem('portfolio-theme');
+    const systemTheme = matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    document.documentElement.dataset.theme = savedTheme || systemTheme;
+  } catch {}
+`;
+
 export default function RootLayout({
   children,
 }: {
   children: React.ReactNode;
 }) {
   return (
-    <html lang="en" data-theme="light">
+    <html lang="en" suppressHydrationWarning>
+      <head>
+        <script dangerouslySetInnerHTML={{ __html: themeScript }} />
+      </head>
       <body>
         <ThemeProvider>{children}</ThemeProvider>
       </body>