Support both PNG and JPG box art images

Try .png first, then .jpg, falling back to the color swatch only if
neither format exists for a game slug.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/GameCard.tsx

@@ -11,8 +11,8 @@ interface GameCardProps {
 
 export function GameCard({ game, selected, onSelect }: GameCardProps) {
   const backgroundColor = game.color ?? DEFAULT_COLOR
-  const [imgError, setImgError] = useState(false)
-  const boxArtSrc = `/boxart/${game.slug}.png`
+  const [imgIdx, setImgIdx] = useState(0)
+  const boxArtSrcs = [`/boxart/${game.slug}.png`, `/boxart/${game.slug}.jpg`]
 
   return (
     <button
@@ -22,12 +22,12 @@ export function GameCard({ game, selected, onSelect }: GameCardProps) {
         selected ? 'ring-2 ring-blue-500 scale-105 shadow-lg' : 'shadow'
       }`}
     >
-      {!imgError ? (
+      {imgIdx < boxArtSrcs.length ? (
         <img
-          src={boxArtSrc}
+          src={boxArtSrcs[imgIdx]}
           alt={game.name}
           className="w-full h-48 object-cover"
-          onError={() => setImgError(true)}
+          onError={() => setImgIdx((i) => i + 1)}
         />
       ) : (
         <div

frontend/src/pages/NewRun.tsx

@@ -223,10 +223,11 @@ export function NewRun() {
 }
 
 function SelectedGameThumb({ game }: { game: Game }) {
-  const [imgError, setImgError] = useState(false)
+  const [imgIdx, setImgIdx] = useState(0)
   const backgroundColor = game.color ?? DEFAULT_COLOR
+  const boxArtSrcs = [`/boxart/${game.slug}.png`, `/boxart/${game.slug}.jpg`]
 
-  if (imgError) {
+  if (imgIdx >= boxArtSrcs.length) {
     return (
       <div
         className="w-10 h-10 rounded flex items-center justify-center flex-shrink-0"
@@ -241,10 +242,10 @@ function SelectedGameThumb({ game }: { game: Game }) {
 
   return (
     <img
-      src={`/boxart/${game.slug}.png`}
+      src={boxArtSrcs[imgIdx]}
       alt={game.name}
       className="w-10 h-10 rounded object-cover flex-shrink-0"
-      onError={() => setImgError(true)}
+      onError={() => setImgIdx((i) => i + 1)}
     />
   )
 }