Add i18n (RU/EN), dark/light themes, enhanced tracker/target forms (Phase 7a)

Frontend enhancements:
- i18n: Full Russian and English translations (~170 keys each),
  language switcher in sidebar and login page, auto-detect from
  browser, persists to localStorage
- Themes: Light/dark mode with CSS custom properties, system
  preference detection, toggle in sidebar header, smooth transitions
- Dark theme: Full color palette (background, card, muted, border,
  success, warning, error variants)

Enhanced forms:
- Tracker creation: asset type filtering (images/videos), favorites
  only, include people/details toggles, sort by/order selects,
  max assets to show
- Target creation: Telegram media settings (collapsible) with
  max media, group size, chunk delay, max asset size, URL preview
  disable, large photos as documents
- Template creation: event_type selector (all/added/removed/renamed/deleted)

All pages use t() for translations, var(--color-*) for theme-safe
colors, and proper label-for-input associations.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/routes/servers/+page.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
 	import { api } from '$lib/api';
+	import { t } from '$lib/i18n';
 	import PageHeader from '$lib/components/PageHeader.svelte';
 	import Card from '$lib/components/Card.svelte';
 
@@ -11,67 +12,55 @@
 	let submitting = $state(false);
 
 	onMount(load);
-
-	async function load() {
-		try { servers = await api('/servers'); } catch { /* ignore */ }
-	}
+	async function load() { try { servers = await api('/servers'); } catch {} }
 
 	async function create(e: SubmitEvent) {
-		e.preventDefault();
-		error = '';
-		submitting = true;
+		e.preventDefault(); error = ''; submitting = true;
 		try {
 			await api('/servers', { method: 'POST', body: JSON.stringify(form) });
-			form = { name: 'Immich', url: '', api_key: '' };
-			showForm = false;
-			await load();
+			form = { name: 'Immich', url: '', api_key: '' }; showForm = false; await load();
 		} catch (err: any) { error = err.message; }
 		submitting = false;
 	}
 
 	async function remove(id: number) {
-		if (!confirm('Delete this server?')) return;
-		try {
-			await api(`/servers/${id}`, { method: 'DELETE' });
-			await load();
-		} catch (err: any) { error = err.message; }
+		if (!confirm(t('servers.confirmDelete'))) return;
+		try { await api(`/servers/${id}`, { method: 'DELETE' }); await load(); } catch (err: any) { error = err.message; }
 	}
 </script>
 
-<PageHeader title="Servers" description="Manage Immich server connections">
+<PageHeader title={t('servers.title')} description={t('servers.description')}>
 	<button onclick={() => showForm = !showForm}
 		class="px-3 py-1.5 bg-[var(--color-primary)] text-[var(--color-primary-foreground)] rounded-md text-sm font-medium hover:opacity-90">
-		{showForm ? 'Cancel' : 'Add Server'}
+		{showForm ? t('servers.cancel') : t('servers.addServer')}
 	</button>
 </PageHeader>
 
 {#if showForm}
 	<Card class="mb-6">
-		{#if error}
-			<div class="bg-red-50 text-red-700 text-sm rounded-md p-3 mb-4">{error}</div>
-		{/if}
+		{#if error}<div class="bg-[var(--color-error-bg)] text-[var(--color-error-fg)] text-sm rounded-md p-3 mb-4">{error}</div>{/if}
 		<form onsubmit={create} class="space-y-3">
 			<div>
-				<label class="block text-sm font-medium mb-1">Name</label>
-				<input bind:value={form.name} required class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
+				<label for="srv-name" class="block text-sm font-medium mb-1">{t('servers.name')}</label>
+				<input id="srv-name" bind:value={form.name} required class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
 			</div>
 			<div>
-				<label class="block text-sm font-medium mb-1">Immich URL</label>
-				<input bind:value={form.url} required placeholder="http://immich:2283" class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
+				<label for="srv-url" class="block text-sm font-medium mb-1">{t('servers.url')}</label>
+				<input id="srv-url" bind:value={form.url} required placeholder={t('servers.urlPlaceholder')} class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
 			</div>
 			<div>
-				<label class="block text-sm font-medium mb-1">API Key</label>
-				<input bind:value={form.api_key} required type="password" class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
+				<label for="srv-key" class="block text-sm font-medium mb-1">{t('servers.apiKey')}</label>
+				<input id="srv-key" bind:value={form.api_key} required type="password" class="w-full px-3 py-2 border border-[var(--color-border)] rounded-md text-sm bg-[var(--color-background)]" />
 			</div>
 			<button type="submit" disabled={submitting} class="px-4 py-2 bg-[var(--color-primary)] text-[var(--color-primary-foreground)] rounded-md text-sm font-medium hover:opacity-90 disabled:opacity-50">
-				{submitting ? 'Connecting...' : 'Add Server'}
+				{submitting ? t('servers.connecting') : t('servers.addServer')}
 			</button>
 		</form>
 	</Card>
 {/if}
 
 {#if servers.length === 0 && !showForm}
-	<Card><p class="text-sm text-[var(--color-muted-foreground)]">No servers configured yet.</p></Card>
+	<Card><p class="text-sm text-[var(--color-muted-foreground)]">{t('servers.noServers')}</p></Card>
 {:else}
 	<div class="space-y-3">
 		{#each servers as server}
@@ -81,7 +70,7 @@
 						<p class="font-medium">{server.name}</p>
 						<p class="text-sm text-[var(--color-muted-foreground)]">{server.url}</p>
 					</div>
-					<button onclick={() => remove(server.id)} class="text-xs text-[var(--color-destructive)] hover:underline">Delete</button>
+					<button onclick={() => remove(server.id)} class="text-xs text-[var(--color-destructive)] hover:underline">{t('servers.delete')}</button>
 				</div>
 			</Card>
 		{/each}