feat: Implement Phase 1 critical features and fix API integration

This commit completes the first phase of feature parity implementation and
resolves all API integration issues to match the backend API format.

## API Integration Fixes

- Remove all hardcoded default values from transformers (tick_rate, kast, player_count, steam_updated)
- Update TypeScript types to make fields optional where backend doesn't guarantee them
- Update Zod schemas to validate optional fields correctly
- Fix mock data to match real API response format (plain arrays, not wrapped objects)
- Update UI components to handle undefined values with proper fallbacks
- Add comprehensive API documentation for Match and Player endpoints

## Phase 1 Features Implemented (3/6)

### 1. Player Tracking System ✅
- Created TrackPlayerModal.svelte with auth code input
- Integrated track/untrack player API endpoints
- Added UI for providing optional share code
- Displays tracked status on player profiles
- Full validation and error handling

### 2. Share Code Parsing ✅
- Created ShareCodeInput.svelte component
- Added to matches page for easy match submission
- Real-time validation of share code format
- Parse status feedback with loading states
- Auto-redirect to match page on success

### 3. VAC/Game Ban Status ✅
- Added VAC and game ban count/date fields to Player type
- Display status badges on player profile pages
- Show ban count and date when available
- Visual indicators using DaisyUI badge components

## Component Improvements

- Modal.svelte: Added Svelte 5 Snippet types, actions slot support
- ThemeToggle.svelte: Removed deprecated svelte:component usage
- Tooltip.svelte: Fixed type safety with Snippet type
- All new components follow Svelte 5 runes pattern ($state, $derived, $bindable)

## Type Safety & Linting

- Fixed all ESLint errors (any types → proper types)
- Fixed form label accessibility issues
- Replaced error: any with error: unknown + proper type guards
- Added Snippet type imports where needed
- Updated all catch blocks to use instanceof Error checks

## Static Assets

- Migrated all files from public/ to static/ directory per SvelteKit best practices
- Moved 200+ map icons, screenshots, and other assets
- Updated all import paths to use /images/ (served from static/)

## Documentation

- Created IMPLEMENTATION_STATUS.md tracking all 15 missing features
- Updated API.md with optional field annotations
- Created MATCHES_API.md with comprehensive endpoint documentation
- Added inline comments marking optional vs required fields

## Testing

- Updated mock fixtures to remove default values
- Fixed mock handlers to return plain arrays like real API
- Ensured all components handle undefined gracefully

## Remaining Phase 1 Tasks

- [ ] Add VAC status column to match scoreboard
- [ ] Create weapons statistics tab for matches
- [ ] Implement recently visited players on home page

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

src/lib/components/match/MatchCard.svelte

@@ -1,12 +1,15 @@
 <script lang="ts">
 	import Badge from '$lib/components/ui/Badge.svelte';
 	import type { MatchListItem } from '$lib/types';
+	import { storeMatchesState } from '$lib/utils/navigation';
+	import { getMapBackground, formatMapName } from '$lib/utils/mapAssets';
 
 	interface Props {
 		match: MatchListItem;
+		loadedCount?: number;
 	}
 
-	let { match }: Props = $props();
+	let { match, loadedCount = 0 }: Props = $props();
 
 	const formattedDate = new Date(match.date).toLocaleString('en-US', {
 		month: 'short',
@@ -15,26 +18,53 @@
 		minute: '2-digit'
 	});
 
-	const mapName = match.map.replace('de_', '').toUpperCase();
+	const mapName = formatMapName(match.map);
+	const mapBg = getMapBackground(match.map);
+
+	function handleClick() {
+		// Store navigation state before navigating
+		storeMatchesState(match.match_id, loadedCount);
+	}
+
+	function handleImageError(event: Event) {
+		const img = event.target as HTMLImageElement;
+		img.src = '/images/map_screenshots/default.webp';
+	}
 </script>
 
-<a href={`/match/${match.match_id}`} class="block transition-transform hover:scale-[1.02]">
+<a
+	href={`/match/${match.match_id}`}
+	class="block transition-transform hover:scale-[1.02]"
+	data-match-id={match.match_id}
+	onclick={handleClick}
+>
 	<div
 		class="overflow-hidden rounded-lg border border-base-300 bg-base-100 shadow-md transition-shadow hover:shadow-xl"
 	>
-		<!-- Map Header -->
-		<div class="relative h-32 bg-gradient-to-br from-base-300 to-base-200">
-			<div class="absolute inset-0 flex items-center justify-center">
-				<span class="text-5xl font-bold text-base-content/10">{mapName}</span>
-			</div>
-			<div class="absolute bottom-3 left-3">
-				<Badge variant="default">{match.map}</Badge>
-			</div>
-			{#if match.demo_parsed}
-				<div class="absolute right-3 top-3">
-					<Badge variant="success" size="sm">Parsed</Badge>
+		<!-- Map Header with Background Image -->
+		<div class="relative h-32 overflow-hidden">
+			<!-- Background Image -->
+			<img
+				src={mapBg}
+				alt={mapName}
+				class="absolute inset-0 h-full w-full object-cover"
+				loading="lazy"
+				onerror={handleImageError}
+			/>
+			<!-- Overlay for better text contrast -->
+			<div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-black/20"></div>
+			<!-- Content -->
+			<div class="relative flex h-full items-end justify-between p-3">
+				<div class="flex flex-col gap-1">
+					{#if match.map}
+						<Badge variant="default">{match.map}</Badge>
+					{/if}
+					<span class="text-lg font-bold text-white drop-shadow-lg">{mapName}</span>
 				</div>
-			{/if}
+				{#if match.demo_parsed}
+					<Badge variant="success" size="sm">Parsed</Badge>
+				{/if}
+			</div>
 		</div>
 
 		<!-- Match Info -->