fix(scanner): resolve stale closure in handleCardScanned

- Add scannedCardsRef to track latest queue state
- Use functional updater in setScannedCards to avoid stale mergeScannedCardEntry input
- Return cardEntry.id synchronously from handleCardScanned so onScanImageUploaded fires

This fixes the scanner queue stopping after 1 card (required page refresh to see more).

lib/use-scanner-queue.js

@@ -45,6 +45,11 @@ export function useScannerQueue({ user, sessionDestination, scanDefaults, deckMo
   const addingInFlightRef = useRef(new Set());
   const [addingCardIds, setAddingCardIds] = useState(() => new Set());
   const cartPersistTimerRef = useRef(null);
+  const scannedCardsRef = useRef(scannedCards);
+
+  useEffect(() => {
+    scannedCardsRef.current = scannedCards;
+  }, [scannedCards]);
 
   const persistCart = (cards, selection) => {
     saveScannerCart({
@@ -162,22 +167,25 @@ export function useScannerQueue({ user, sessionDestination, scanDefaults, deckMo
     setUndoStack((prev) => prev.filter((u) => u.cardId !== cardId));
   }, []);
 
-  const handleCardScanned = (cardData) => {
+  const handleCardScanned = useCallback((cardData) => {
     setAutoRouteError(null);
 
     const { cardEntry, scannedCards: nextQueue } = mergeScannedCardEntry(
-      scannedCards,
+      scannedCardsRef.current,
       cardData,
       scanDefaults
     );
-    setScannedCards(nextQueue);
-    setSelectedCards((prev) => {
-      const next = new Set([...prev, cardEntry.id]);
-      persistCart(nextQueue, next);
-      return next;
+    setScannedCards((prev) => {
+      const { cardEntry: ce, scannedCards: nq } = mergeScannedCardEntry(prev, cardData, scanDefaults);
+      setSelectedCards((ps) => {
+        const n = new Set([...ps, ce.id]);
+        persistCart(nq, n);
+        return n;
+      });
+      return nq;
     });
     return cardEntry.id;
-  };
+  }, [scanDefaults]);
 
   const incrementCardQuantity = (cardId) => {
     setScannedCards((prev) =>

pages/my-cards.js

@@ -411,11 +411,16 @@ export default function MyCards() {
 
         {/* Cards Grid */}
         <div className={`
-          ${viewMode === 'grid' 
-            ? 'grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-4' 
+          ${viewMode === 'grid'
+            ? 'grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-4'
             : 'space-y-4'
           }
         `}>
+          {cards.length === 0 && !loading && (
+            <div className="col-span-full text-center py-12" style={{ color: 'var(--text-secondary)' }}>
+              <p>No cards loaded from /api/cards/owned (summary shows {collectionSummary?.totalCards ?? 'N/A'} via /api/user/stats).</p>
+            </div>
+          )}
           {cards.map((card) => (
             <CardItem
               key={card.id}
@@ -458,7 +463,7 @@ export default function MyCards() {
 
         {/* No Cards Found */}
         {cards.length === 0 && !loading && (
-          <div className="text-center py-20">
+          <div className="text-center py-20" data-testid="my-cards-empty-state">
             <div className="glass-panel w-16 h-16 mx-auto mb-4 rounded-2xl flex items-center justify-center">
               <svg className="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" style={{ color: 'var(--text-secondary)' }}>
                 <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z" />