fix: left stops at a grid's first column

app/browse/Catalog.jsx

@@ -65,7 +65,8 @@ import { FocusScope, Image, Text, View, VirtualList, useIsFocused } from '@ps5-r
           game,
           width: CARD_WIDTH,
           detailed: true,
-          rowEnd: index % COLUMNS === COLUMNS - 1,
+          rowEnd: index % COLUMNS === COLUMNS - 1 || index === all.current.length - 1,
+          rowStart: index % COLUMNS === 0,
           enterDelay: entering.current ? index * STAGGER : void 0,
           onFocus: () => prefetchBelow(all.current, index),
           onPress: () => openGame(game.id, `card:${game.id}`)

app/search/Suggestions.jsx

@@ -68,7 +68,8 @@ import { FocusScope, ScrollView, Text, View, useIsFocused } from '@ps5-react/cor
             game,
             width: CARD_WIDTH3,
             onPress: () => onOpenGame(game),
-            rowEnd: index % COLUMNS3 === COLUMNS3 - 1
+            rowEnd: index % COLUMNS3 === COLUMNS3 - 1,
+            rowStart: index % COLUMNS3 === 0
           },
           game.id
         )

app/search/index.jsx

@@ -66,7 +66,8 @@ import { FocusScope, ScrollView, Text, View, VirtualList, motion } from '@ps5-re
                 game,
                 width: CARD_WIDTH3,
                 onPress: () => onOpenGame(game),
-                rowEnd: index % COLUMNS3 === COLUMNS3 - 1 || index === results.length - 1
+                rowEnd: index % COLUMNS3 === COLUMNS3 - 1 || index === results.length - 1,
+                rowStart: index % COLUMNS3 === 0
               }
             )
           )

app/ui/GameCard.jsx

@@ -5,7 +5,7 @@ import '../assets/Inter-Regular.ttf';
 import { Fragment, jsx, jsxs } from 'react/jsx-runtime';
 import { useEffect, useRef, useState } from 'react';
 import { prefetchWhenSettled } from '../game/art.js';
-import { focusEnd, latin, useLocale } from '../i18n/index.js';
+import { focusEnd, focusStart, latin, useLocale } from '../i18n/index.js';
 import { genreLabel, onCdn } from '../state/catalog.js';
 import { formatSize } from '../state/size.js';
 import { useStoreActions, useWishlist } from '../state/store.jsx';
@@ -111,6 +111,7 @@ import { Text, View, motion, transitions, useIsFocused } from '@ps5-react/core';
     width = 150,
     focusKey = `card:${game.id}`,
     rowEnd,
+    rowStart,
     enterDelay,
     caption,
     detailed,
@@ -139,6 +140,8 @@ import { Text, View, motion, transitions, useIsFocused } from '@ps5-react/core';
       motion.View,
       {
         ...focusEnd(rtl, rowEnd ? focusKey : void 0),
+        // A grid's first column: Left stops there instead of looking up the page for something to its left.
+        ...focusStart(rtl, rowStart ? focusKey : void 0),
         ...rest2,
         focusKey,
         onPress,