Refactor: Implement smooth moderation queue

src/components/moderation/QueueItem.tsx

@@ -38,6 +38,7 @@ interface ModerationItem {
   escalated?: boolean;
   assigned_to?: string;
   locked_until?: string;
+  _removing?: boolean;
 }
 
 import { ValidationSummary } from './ValidationSummary';
@@ -108,7 +109,9 @@ export const QueueItem = memo(({
   return (
     <Card 
       key={item.id} 
-      className={`border-l-4 ${
+      className={`border-l-4 transition-all duration-300 ${
+        item._removing ? 'opacity-0 scale-95 pointer-events-none' : ''
+      } ${
         validationResult?.blockingErrors && validationResult.blockingErrors.length > 0 ? 'border-l-red-600' :
         item.status === 'flagged' ? 'border-l-red-500' :
         item.status === 'approved' ? 'border-l-green-500' :
@@ -117,9 +120,9 @@ export const QueueItem = memo(({
         'border-l-amber-500'
       }`}
       style={{ 
-        opacity: actionLoading === item.id ? 0.5 : 1,
+        opacity: actionLoading === item.id ? 0.5 : (item._removing ? 0 : 1),
         pointerEvents: actionLoading === item.id ? 'none' : 'auto',
-        transition: isInitialRender ? 'none' : 'opacity 200ms'
+        transition: isInitialRender ? 'none' : 'all 300ms ease-in-out'
       }}
     >
       <CardHeader className={isMobile ? "pb-3 p-4" : "pb-4"}>