Shrink prediction buttons

Adjust the prediction option buttons to be smaller and fit on one line:
- reduce gap from 2 to 1.5
- make each button 8x8 with extra small text and padding removed

X-Lovable-Edit-ID: edt-decfb124-7935-4ae9-bfd0-f42c3b1cfe81

src/components/LadybugClockPuzzle.tsx

@@ -409,10 +409,10 @@ const LadybugClockPuzzle: React.FC<LadybugClockPuzzleProps> = ({
                 <p className="text-sm text-muted-foreground mb-3">
                   Which number do you think is most likely to be painted last?
                 </p>
-                <div className="flex flex-wrap gap-2">
+                <div className="flex flex-wrap gap-1.5">
                   {Array.from({
                 length: numPositions - 1
-              }, (_, i) => i + 1).map(pos => <Button key={pos} onClick={() => setUserPrediction(pos)} variant={userPrediction === pos ? "default" : "outline"} size="sm" className="w-10 h-10">
+              }, (_, i) => i + 1).map(pos => <Button key={pos} onClick={() => setUserPrediction(pos)} variant={userPrediction === pos ? "default" : "outline"} size="sm" className="w-8 h-8 text-xs p-0">
                       {positionToNumber(pos)}
                     </Button>)}
                 </div>