feat: replace emoji icons with Heroicons SVG set

Install @heroicons/react and replace all emoji usage across stats, history,
search, and team pages with proper SVG icons (outline style, w-3 to w-4).
SectionTitle in stats page refactored to accept an icon component prop.

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

app/history/page.tsx

@@ -3,6 +3,7 @@ import { useQuery, gql } from '@/lib/graphql/hooks'
 import { useEffect } from 'react'
 import Link from 'next/link'
 import { TeamFlag } from '@/components/team-flag'
+import { FireIcon, CalendarDaysIcon, TrophyIcon } from '@heroicons/react/24/outline'
 
 const HISTORY_QUERY = gql`
   query History {
@@ -92,14 +93,14 @@ export default function HistoryPage() {
                   )}
 
                   <div className="flex gap-3.5 text-[11px] text-[#2a5c35] flex-wrap">
-                    {t.totalGoals != null && <span>⚽ {t.totalGoals}</span>}
-                    {t.matchesCount != null && <span>🗓 {t.matchesCount} games</span>}
+                    {t.totalGoals != null && <span className="inline-flex items-center gap-1"><FireIcon className="w-3 h-3" />{t.totalGoals}</span>}
+                    {t.matchesCount != null && <span className="inline-flex items-center gap-1"><CalendarDaysIcon className="w-3 h-3" />{t.matchesCount} games</span>}
                     {t.teamsCount != null && <span>🏳 {t.teamsCount} teams</span>}
                   </div>
 
                   {topScorer && (
                     <div className="mt-2 text-[10px] text-[#1a3a22]">
-                      Golden Boot: <span className="text-[#2a5c35]">{topScorer.playerName} ({topScorer.goals}⚽)</span>
+                      Golden Boot: <span className="text-[#2a5c35]">{topScorer.playerName} (<span className="inline-flex items-center gap-0.5"><FireIcon className="w-2.5 h-2.5 inline" />{topScorer.goals}</span>)</span>
                     </div>
                   )}
                 </div>