Add timezone preference across time displays

src/lib/ui/components/OperationHistory.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { timeFormat } from '$ui/stores/time-zone.js';
     import type { ActivityEvent, OperationStep } from '$lib/operation-flow.js';
     import Button from './primitives/Button.svelte';
     let { steps, events, active = false }: { steps: OperationStep[]; events: ActivityEvent[]; active?: boolean } = $props();
@@ -22,14 +23,14 @@
     </ol>
 </section>
 <section>
-    {#if latest}<p class="latest"><strong>Latest update</strong> {latest.message}<time datetime={latest.created_at}>{new Date(latest.created_at).toLocaleString()}</time></p>{/if}
+    {#if latest}<p class="latest"><strong>Latest update</strong> {latest.message}<time datetime={latest.created_at}>{$timeFormat.dateTime(latest.created_at)}</time></p>{/if}
     <details>
         <summary>Activity history · {events.length} events{active ? ' · updates automatically' : ''}</summary>
         {#if events.length}
         <div class="tools"><label>Search activity<input type="search" bind:value={query} oninput={() => limit = 25} placeholder="Server, stage, or message" /></label><label>Order<select bind:value={newestFirst}><option value={true}>Newest first</option><option value={false}>Oldest first</option></select></label></div>
         <ol class="timeline">
             {#each visible as event (event.id)}
-                <li><time datetime={event.created_at}>{new Date(event.created_at).toLocaleString()}</time><p>{event.message}</p></li>
+                <li><time datetime={event.created_at}>{$timeFormat.dateTime(event.created_at)}</time><p>{event.message}</p></li>
             {/each}
         </ol>
         {#if !matching.length}<p class="muted">No matching activity.</p>{/if}