feat: implement lazy loading for LoginPage and add Suspense to IntranetLayout

nest-intra/src/components/layout/IntranetLayout.tsx

@@ -1,6 +1,6 @@
 import { NavLink, Outlet, useNavigate } from 'react-router-dom';
 import { useAuth } from '../../contexts/AuthContext';
-import { useCallback } from 'react';
+import { useCallback, Suspense } from 'react';
 
 const INTRANET_LINKS = [
   { to: '/intranet',            label: 'Dashboard',   icon: '[>]', end: true },
@@ -21,7 +21,7 @@ export function IntranetLayout() {
   }, [logout, navigate]);
 
   return (
-    <div style={{ display: 'flex', minHeight: '100vh', background: 'var(--color-bg)' }}>
+    <div style={{ display: 'flex', height: '100vh', overflow: 'hidden', background: 'var(--color-bg)' }}>
       {/* Sidebar */}
       <aside
         style={{
@@ -141,9 +141,19 @@ export function IntranetLayout() {
         </div>
       </aside>
 
-      {/* Main content */}
+      {/* Main content — only this area scrolls */}
       <main style={{ flex: 1, overflowY: 'auto', padding: '2rem', background: 'var(--color-bg)' }}>
-        <Outlet />
+        <Suspense
+          fallback={
+            <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' }}>
+              <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.8rem', letterSpacing: '0.1em' }}>
+                LOADING...
+              </div>
+            </div>
+          }
+        >
+          <Outlet />
+        </Suspense>
       </main>
     </div>
   );