Add pre-commit hooks for linting and formatting

Set up pre-commit framework with ruff (backend) and ESLint/Prettier/tsc
(frontend) hooks to catch issues locally before CI. Auto-format all
frontend files with Prettier to comply with the new check.

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

frontend/src/components/GenlockeGraveyard.tsx

@@ -134,7 +134,8 @@ export function GenlockeGraveyard({ genlockeId }: GenlockeGraveyardProps) {
         </span>
         {data.deadliestLeg && (
           <span className="text-gray-500 dark:text-gray-400">
-            Deadliest: Leg {data.deadliestLeg.legOrder} &mdash; {data.deadliestLeg.gameName} ({data.deadliestLeg.deathCount})
+            Deadliest: Leg {data.deadliestLeg.legOrder} &mdash;{' '}
+            {data.deadliestLeg.gameName} ({data.deadliestLeg.deathCount})
           </span>
         )}
       </div>
@@ -143,7 +144,9 @@ export function GenlockeGraveyard({ genlockeId }: GenlockeGraveyardProps) {
       <div className="flex flex-wrap items-center gap-3">
         <select
           value={filterLeg ?? ''}
-          onChange={(e) => setFilterLeg(e.target.value ? Number(e.target.value) : null)}
+          onChange={(e) =>
+            setFilterLeg(e.target.value ? Number(e.target.value) : null)
+          }
           className="text-sm border border-gray-300 dark:border-gray-600 rounded-lg px-3 py-1.5 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100"
         >
           <option value="">All Legs</option>