feat(observability): phase 8 - container stats, notifications & dashboard

Add container monitoring and notification system:
- Docker Stats API: real-time CPU/memory for running containers
- Webhook notifications for errors (deploy failures, stale, proxy unhealthy)
- Event log auto-pruning (daily, 30-day retention)
- ContainerStats component with auto-polling progress bars
- SystemHealthCard dashboard widget with running/proxy/error counts
- Full EN/RU i18n for stats and system health

web/src/lib/components/SystemHealthCard.svelte

@@ -0,0 +1,113 @@
+<!--
+  Dashboard summary card: container counts, proxy health, recent errors.
+-->
+<script lang="ts">
+	import type { Instance, ProxyView, EventLogStats } from '$lib/types';
+	import * as api from '$lib/api';
+	import { IconServer, IconProxies, IconAlert } from '$lib/components/icons';
+	import { t } from '$lib/i18n';
+
+	let runningCount = $state(0);
+	let stoppedCount = $state(0);
+	let healthyProxies = $state(0);
+	let unhealthyProxies = $state(0);
+	let recentErrors = $state(0);
+	let loading = $state(true);
+
+	$effect(() => {
+		let cancelled = false;
+
+		async function load() {
+			try {
+				const [projects, proxies, eventStats] = await Promise.all([
+					api.listProjects(),
+					api.listAllProxies().catch(() => [] as ProxyView[]),
+					api.fetchEventLogStats().catch(() => ({ info: 0, warn: 0, error: 0, total: 0 }) as EventLogStats)
+				]);
+
+				// Gather all instances across projects/stages.
+				const allInstances: Instance[] = [];
+				for (const project of projects) {
+					try {
+						const detail = await api.getProject(project.id);
+						for (const stage of detail.stages ?? []) {
+							const instances = await api.listInstances(project.id, stage.id);
+							allInstances.push(...instances);
+						}
+					} catch {
+						// Skip projects that fail to load.
+					}
+				}
+
+				if (!cancelled) {
+					runningCount = allInstances.filter((i) => i.status === 'running').length;
+					stoppedCount = allInstances.filter((i) => i.status !== 'running').length;
+					healthyProxies = proxies.filter((p) => p.health_status === 'healthy').length;
+					unhealthyProxies = proxies.filter((p) => p.health_status === 'unhealthy').length;
+					recentErrors = eventStats.error;
+					loading = false;
+				}
+			} catch {
+				if (!cancelled) {
+					loading = false;
+				}
+			}
+		}
+
+		load();
+
+		return () => {
+			cancelled = true;
+		};
+	});
+</script>
+
+{#if !loading}
+	<div class="rounded-xl border border-[var(--border-primary)] bg-[var(--surface-card)] p-5 shadow-[var(--shadow-sm)]">
+		<h3 class="mb-4 text-sm font-semibold text-[var(--text-primary)]">{$t('systemHealth.title')}</h3>
+		<div class="grid grid-cols-1 gap-3 sm:grid-cols-3">
+			<!-- Containers -->
+			<a href="/projects" class="flex items-center gap-3 rounded-lg p-3 transition-colors hover:bg-[var(--surface-card-hover)]">
+				<div class="flex h-9 w-9 items-center justify-center rounded-lg bg-emerald-50 text-emerald-600">
+					<IconServer size={18} />
+				</div>
+				<div>
+					<p class="text-xs text-[var(--text-secondary)]">{$t('systemHealth.containers')}</p>
+					<p class="text-sm font-semibold text-[var(--text-primary)]">
+						<span class="text-emerald-600">{runningCount}</span>
+						<span class="text-[var(--text-tertiary)]"> / </span>
+						<span class="text-[var(--text-tertiary)]">{stoppedCount}</span>
+					</p>
+				</div>
+			</a>
+
+			<!-- Proxies -->
+			<a href="/proxies" class="flex items-center gap-3 rounded-lg p-3 transition-colors hover:bg-[var(--surface-card-hover)]">
+				<div class="flex h-9 w-9 items-center justify-center rounded-lg {unhealthyProxies > 0 ? 'bg-red-50 text-red-600' : 'bg-blue-50 text-blue-600'}">
+					<IconProxies size={18} />
+				</div>
+				<div>
+					<p class="text-xs text-[var(--text-secondary)]">{$t('systemHealth.proxies')}</p>
+					<p class="text-sm font-semibold text-[var(--text-primary)]">
+						<span class="text-emerald-600">{healthyProxies}</span>
+						{#if unhealthyProxies > 0}
+							<span class="text-[var(--text-tertiary)]"> / </span>
+							<span class="text-red-600">{unhealthyProxies}</span>
+						{/if}
+					</p>
+				</div>
+			</a>
+
+			<!-- Recent errors -->
+			<a href="/events" class="flex items-center gap-3 rounded-lg p-3 transition-colors hover:bg-[var(--surface-card-hover)]">
+				<div class="flex h-9 w-9 items-center justify-center rounded-lg {recentErrors > 0 ? 'bg-red-50 text-red-600' : 'bg-gray-50 text-gray-400'}">
+					<IconAlert size={18} />
+				</div>
+				<div>
+					<p class="text-xs text-[var(--text-secondary)]">{$t('systemHealth.recentErrors')}</p>
+					<p class="text-sm font-semibold {recentErrors > 0 ? 'text-red-600' : 'text-[var(--text-primary)]'}">{recentErrors}</p>
+				</div>
+			</a>
+		</div>
+	</div>
+{/if}