fix: image sortie 1000x1000 centrée + affichage split avant/après corrigé

src/components/images/ImageCard.tsx

@@ -114,7 +114,7 @@ export function ImageCard({
           <BlobThumbnail blob={item.originalBlob} alt="Original" />
         </div>
         {item.processedBlob && (
-          <div className="absolute inset-0 border-l-2 border-indigo-500 left-1/2 w-1/2">
+          <div className="absolute top-0 bottom-0 right-0 w-1/2 border-l-2 border-indigo-500">
             <BlobThumbnail blob={item.processedBlob} alt="Traité" />
           </div>
         )}

src/lib/client/bgRemover.ts

@@ -63,13 +63,23 @@ export function compositeOnWhite(pngBlob: Blob, feather: number): Promise<Blob>
         fgCtx.globalCompositeOperation = 'source-over'
       }
 
+      // Canvas de sortie 1000×1000 blanc, sujet centré avec padding de 5%
+      const SIZE = 1000
+      const PADDING = 0.05
+      const available = Math.round(SIZE * (1 - PADDING * 2))
+      const scale = Math.min(available / width, available / height)
+      const dw = Math.round(width * scale)
+      const dh = Math.round(height * scale)
+      const dx = Math.round((SIZE - dw) / 2)
+      const dy = Math.round((SIZE - dh) / 2)
+
       const out = document.createElement('canvas')
-      out.width = width
+      out.width = SIZE
-      out.height = height
+      out.height = SIZE
       const ctx = out.getContext('2d')!
       ctx.fillStyle = '#ffffff'
-      ctx.fillRect(0, 0, width, height)
+      ctx.fillRect(0, 0, SIZE, SIZE)
-      ctx.drawImage(fgCanvas, 0, 0)
+      ctx.drawImage(fgCanvas, dx, dy, dw, dh)
 
       URL.revokeObjectURL(objectUrl)
       out.toBlob(