add leaderboard component

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

packages/client/src/components/leaderboard.tsx

@@ -0,0 +1,37 @@
+import type { LeaderboardEntry } from "@celebrate-esc/shared"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+
+interface LeaderboardProps {
+	entries: LeaderboardEntry[]
+}
+
+export function Leaderboard({ entries }: LeaderboardProps) {
+	if (entries.length === 0) return null
+
+	return (
+		<Card>
+			<CardHeader>
+				<CardTitle>Leaderboard</CardTitle>
+			</CardHeader>
+			<CardContent>
+				<div className="flex flex-col gap-1">
+					{entries.map((entry, i) => (
+						<div key={entry.playerId} className="flex items-center justify-between border-b py-1.5 last:border-0">
+							<div className="flex items-center gap-2">
+								<span className="w-6 text-center text-sm font-bold text-muted-foreground">
+									{i + 1}
+								</span>
+								<span className="text-sm font-medium">{entry.displayName}</span>
+							</div>
+							<div className="flex items-center gap-3 text-xs text-muted-foreground">
+								<span title="Jury points">J:{entry.juryPoints}</span>
+								<span title="Bingo points">B:{entry.bingoPoints}</span>
+								<span className="text-sm font-bold text-foreground">{entry.totalPoints}</span>
+							</div>
+						</div>
+					))}
+				</div>
+			</CardContent>
+		</Card>
+	)
+}