Cleanup and remove "Best Scores" label

src/components/stats/jacob/cropstats.svelte

@@ -27,11 +27,8 @@
 	);
 </script>
 
-<div class="flex flex-col items-start">
-	<h3 class="my-2 text-left text-2xl">Best Scores</h3>
-	<div class="flex max-w-6xl flex-wrap items-center justify-start gap-4">
-		{#each highest as [crop, amount] (crop)}
-			<JacobCropStats {jacob} {crop} count={amount} />
-		{/each}
-	</div>
+<div class="flex max-w-6xl flex-wrap items-center justify-center gap-4">
+	{#each highest as [crop, amount] (crop)}
+		<JacobCropStats {jacob} {crop} count={amount} />
+	{/each}
 </div>

src/components/stats/jacob/jacob-crop-stats.svelte

@@ -20,9 +20,9 @@
 	}
 
 	function pb(crop: string) {
-		const amount = jacob?.stats?.personalBests?.[crop.replace(' ', '') as keyof typeof jacob.stats.personalBests];
-		const timestamp =
-			jacob?.stats?.crops?.[crop.replace(' ', '') as keyof typeof jacob.stats.crops]?.personalBestTimestamp;
+		const key = crop.replace(' ', '');
+		const amount = jacob?.stats?.personalBests?.[key as keyof typeof jacob.stats.personalBests];
+		const timestamp = jacob?.stats?.crops?.[key as keyof typeof jacob.stats.crops]?.personalBestTimestamp;
 		return { amount: amount ? +amount : undefined, timestamp: timestamp ? +timestamp : undefined };
 	}
 
@@ -45,16 +45,12 @@
 		<img src={PROPER_CROP_TO_IMG[crop]} alt="Crop" class="pixelated h-12 w-12 p-1" />
 
 		<div class="flex flex-col items-start gap-1">
-			<div>
-				<div>
-					<a
-						href="/contest/{pbData.timestamp}"
-						class="text-lg font-semibold leading-none no-underline hover:underline"
-					>
-						{pbData.amount?.toLocaleString() ?? 'Not Set!'}
-					</a>
-				</div>
-			</div>
+			<a
+				href="/contest/{pbData.timestamp}"
+				class="text-lg font-semibold leading-none no-underline hover:underline"
+			>
+				{pbData.amount?.toLocaleString() ?? 'Not Set!'}
+			</a>
 
 			<Popover.Mobile>
 				{#snippet trigger()}