feat: Introduce new AI skills, core application layout, and cinematic UI components for the portfolio.

app/layout.tsx

@@ -242,6 +242,19 @@ export default function RootLayout({ children }: Readonly<RootLayoutProps>) {
     >
       <head>
         <link rel="canonical" href={siteUrl} />
+        {/* Blocking script: creates immediate black overlay BEFORE any paint.
+            This prevents the flash of real content before React hydrates
+            and PageIntro mounts. PageIntro removes the #__loading-blocker div. */}
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `(function(){
+  var el=document.createElement('div');
+  el.id='__loading-blocker';
+  el.style.cssText='position:fixed;inset:0;background:#0a0a0a;z-index:99998;pointer-events:none;';
+  document.documentElement.appendChild(el);
+})();`,
+          }}
+        />
       </head>
       <body>
         <SmoothScrollProvider>