fix: remove dark backgrounds causing black rectangles

- PageLoader: remove bg-dark-950, use transparent background
- AdminLayout: remove motion animations
- Now lazy-loaded pages show Aurora background during loading

src/components/admin/AdminLayout.tsx

@@ -1,61 +1,14 @@
-import { motion } from 'framer-motion';
-import type { Transition, Variants } from 'framer-motion';
 import type { ReactNode } from 'react';
 
-/**
- * Centralized animation config for all admin pages.
- * Change animations here to affect all admin pages at once.
- */
-export const adminPageTransition: Transition = {
-  duration: 0.15,
-  ease: [0.16, 1, 0.3, 1] as const, // easeOutExpo
-};
-
-export const adminPageVariants: Variants = {
-  initial: { opacity: 0 },
-  animate: { opacity: 1 },
-  exit: { opacity: 0 },
-};
-
 interface AdminLayoutProps {
   children: ReactNode;
   className?: string;
 }
 
 /**
- * AdminLayout - wrapper for all admin pages with consistent animations.
+ * AdminLayout - wrapper for all admin pages.
- * Use this to wrap admin page content for unified transitions.
+ * Animations removed to prevent black flash during transitions.
  */
 export function AdminLayout({ children, className }: AdminLayoutProps) {
-  return (
+  return <div className={className}>{children}</div>;
-    <motion.div
-      variants={adminPageVariants}
-      initial="initial"
-      animate="animate"
-      exit="exit"
-      transition={adminPageTransition}
-      className={className}
-    >
-      {children}
-    </motion.div>
-  );
 }
-
-/**
- * Admin content animations for lists and cards.
- * Use with staggered children.
- */
-export const adminStaggerContainer: Variants = {
-  initial: {},
-  animate: {
-    transition: {
-      staggerChildren: 0.03,
-    },
-  },
-};
-
-export const adminStaggerItem: Variants = {
-  initial: { opacity: 0 },
-  animate: { opacity: 1 },
-  exit: { opacity: 0 },
-};

src/components/common/PageLoader.tsx

@@ -3,11 +3,10 @@ interface PageLoaderProps {
 }
 
 export default function PageLoader({ variant = 'dark' }: PageLoaderProps) {
-  const bgClass = variant === 'dark' ? 'bg-dark-950' : 'bg-gray-50';
   const spinnerColor = variant === 'dark' ? 'border-accent-500' : 'border-blue-500';
 
   return (
-    <div className={`flex min-h-screen items-center justify-center ${bgClass}`}>
+    <div className="flex min-h-[50vh] items-center justify-center">
       <div
         className={`h-10 w-10 border-[3px] ${spinnerColor} animate-spin rounded-full border-t-transparent`}
       />