web: unify empty + loading states behind EmptyState/InlineLoader

Replaces ad-hoc "Loading…" text and bare empty messages with two
shared feedback primitives that carry subtle lucide icons, consistent
muted-foreground/destructive tones, and a11y signaling (role=status,
aria-busy, role=alert on destructive empties). Loading copy gains
context ("Loading photos/folders/heaps/metadata…") and the right-
sidebar idle state moves from a "ⓘ" glyph to a MousePointerClick
icon. SkeletonGrid stays as the initial-grid loader.

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

web/src/lib/components/layout/SettingsDialog.svelte

@@ -9,7 +9,8 @@
 	import { Dialog, Tabs } from 'bits-ui';
 	import { createMutation, createQuery, useQueryClient } from '@tanstack/svelte-query';
 	import { toast } from 'svelte-sonner';
-	import { Loader2, RefreshCw, Settings, X } from 'lucide-svelte';
+	import { AlertCircle, CheckCircle2, Loader2, RefreshCw, Settings, X } from 'lucide-svelte';
+	import { EmptyState, InlineLoader } from '$lib/components/feedback';
 	import {
 		cancelImport,
 		cancelIndex,
@@ -418,11 +419,16 @@
 						</button>
 					</div>
 					{#if errorsQuery.isPending}
-						<p class="px-1 text-muted-foreground">Loading…</p>
+						<InlineLoader size="sm" label="Loading error log…" />
 					{:else if errorsQuery.isError}
-						<p class="px-1 text-destructive">Could not load error log.</p>
+						<EmptyState
+							size="compact"
+							tone="destructive"
+							icon={AlertCircle}
+							title="Could not load error log"
+						/>
 					{:else if (errorsQuery.data ?? []).length === 0}
-						<p class="px-1 text-muted-foreground">No errors logged.</p>
+						<EmptyState size="compact" icon={CheckCircle2} title="No errors logged" />
 					{:else}
 						<ul
 							class="max-h-[55vh] space-y-1 overflow-y-auto rounded border border-border bg-background p-2 font-mono text-[11px]"