feat: replace text loading messages with PageSpinner component

Add a shared PageSpinner (spinning ring + optional label) and use it
in all pages that previously showed a plain text loading message:
home, stats, player, team, and tournament pages.

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

app/tournaments/[year]/client.tsx

@@ -3,6 +3,7 @@ import { useQuery, gql } from '@/lib/graphql/hooks'
 import { use, useEffect } from 'react'
 import Link from 'next/link'
 import { TeamFlag } from '@/components/team-flag'
+import { PageSpinner } from '@/components/page-spinner'
 import { MatchCard } from '@/components/match-card'
 import { LiveBadge } from '@/components/live-badge'
 
@@ -114,12 +115,7 @@ export function TournamentClient({ params }: { params: Promise<{ year: string }>
   const maxScorer = Math.max(...(t?.topScorers?.map((s: { goals: number }) => s.goals) ?? [1]), 1)
 
   if (loading && !data) {
-    return (
-      <div className="max-w-[1200px] mx-auto px-7 py-10">
-        <div className="h-24 w-48 rounded-xl animate-pulse mb-6 bg-card" />
-        <div className="text-green-muted text-sm">Loading {year} World Cup…</div>
-      </div>
-    )
+    return <PageSpinner label={`${year} World Cup`} />
   }
 
   if (!t) return <div className="max-w-[1200px] mx-auto px-7 py-10 text-green-muted">Tournament {year} not found.</div>