feat: smooth view transitions, no skeleton flash

User pain point: skeleton loading.tsx files made the app feel like
a sequence of page reloads, exposing backend latency. Replaced with
a single 1px shimmer bar + crossfade via React's <ViewTransition>.

Changes:
- Enable experimental.viewTransition in next.config.ts
- Add SmoothViewTransition wrapper (ViewTransition name=page-content)
- Add LoadingFade component: thin animated bar instead of skeleton
- Add RouteAnnouncer for a11y (screen readers + focus reset)
- Add ::view-transition-old/new CSS for the crossfade (220ms, no
  jarring slide, respects prefers-reduced-motion)
- Wrap admin/tuxedo/IRD layout children in SmoothViewTransition
  (sidebar/header/footer stay mounted; only the body fades)
- Replace 19 skeleton loading.tsx files with the fade component

Result: navigation now feels like a single app, not a series of
preload-and-render events. The user never sees a 'skeleton of the
page they're about to load.'

next.config.ts

@@ -112,6 +112,11 @@ const nextConfig: NextConfig = {
   experimental: {
     // Enable optimizePackageImports for better bundle size
     optimizePackageImports: ["lucide-react", "@radix-ui/react-icons", "framer-motion"],
+    // Enable React's <ViewTransition> and Next.js' automatic route
+    // transitions. Combined with the smooth-transition wrappers around
+    // page content (see src/components/transitions), navigation feels
+    // like a single continuous app rather than a sequence of page loads.
+    viewTransition: true,
   },
 
   // Compiler options