style(web): fix prettier config, format entire web/ tree

.prettierrc.json was missing "semi": false, so prettier wanted to add
semicolons to a codebase written without them (763 semicolon-free
statements vs. 150 with, in hand-written .ts; zero hand-written .svelte
files use them at all). That's why prettier --check failed on 249 files
— not because the code was unformatted, but because the config didn't
match the actual house style. Added "semi": false; left printWidth/etc
as configured (printWidth barely moves the failure count: 218/213/212
files at 100/120/140).

Ran `prettier --write .` with the corrected config. Verified
semantics-preserving before and after:
- eslint: 142 problems both before and after, byte-identical
- build passes, 38/38 tests pass
- token-stream diff (whitespace/semicolons/quotes normalized) on all
  218 changed files: only 52 had any remaining token change, all either
  trailing-comma removal (matching trailingComma: "none") or import/
  ternary reflow — no semantic changes
- live smoke test: Knowledge, Tasks, Fleet map, and a chat window
  (AgentTrace, markdown, Scope graph, activity rail) all render
  correctly, no console errors

Most of the diff is shadcn/ui vendor files (lib/components/ui/) moving
from the CLI's own style (double quotes, tabs, semicolons) to house
style; re-running `shadcn-svelte add` on a component will need a
follow-up format pass.

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

web/src/lib/components/UnifiedTimeline.svelte

@@ -30,7 +30,11 @@
   //   current step visible while the agent works (follow mode disengages if
   //   the operator scrolls down into history, re-engages when streaming
   //   starts again)
-  let { entries, planSteps: steps, streaming = false }: {
+  let {
+    entries,
+    planSteps: steps,
+    streaming = false
+  }: {
     entries: ActivityEntry[]
     planSteps: PlanStep[]
     streaming?: boolean
@@ -75,7 +79,9 @@
         continue
       }
       const tools = entries.filter(
-        (e) => e.stepSeq === s.seq && (e.type === 'tool_running' || e.type === 'tool_done' || e.type === 'tool_error')
+        (e) =>
+          e.stepSeq === s.seq &&
+          (e.type === 'tool_running' || e.type === 'tool_done' || e.type === 'tool_error')
       )
       const stepEntry = entries.find((e) => e.id === s.id)
       // Timed from the step's own entry, else its earliest tool — so a step
@@ -134,7 +140,8 @@
   // entries land while following (instant, to avoid scroll-queue jank).
   $effect(() => {
     if (!currentId || !follow || !container) return
-    container.querySelector(`[data-tl-id="${CSS.escape(currentId)}"]`)
+    container
+      .querySelector(`[data-tl-id="${CSS.escape(currentId)}"]`)
       ?.scrollIntoView({ behavior: 'smooth', block: 'nearest' })
   })
   let lastEntryCount = 0
@@ -157,7 +164,12 @@
   // height so tools inside an expanded step stay on the line; first/last
   // items clip theirs to their node/tool centers so the line never dangles
   // past the timeline's ends.
-  function segClass(status: string, isFirst: boolean, isLast: boolean, expandedWithTools: boolean): string {
+  function segClass(
+    status: string,
+    isFirst: boolean,
+    isLast: boolean,
+    expandedWithTools: boolean
+  ): string {
     let color = 'bg-border'
     if (status === 'done') color = 'bg-primary/60'
     else if (status === 'running') color = 'bg-primary/40'
@@ -172,11 +184,16 @@
 
   function entryIcon(entry: ActivityEntry) {
     switch (entry.type) {
-      case 'goal': return MilestoneIcon
-      case 'knowledge': return SparklesIcon
-      case 'complete': return FlagIcon
-      case 'question': return HelpCircleIcon
-      default: return WrenchIcon
+      case 'goal':
+        return MilestoneIcon
+      case 'knowledge':
+        return SparklesIcon
+      case 'complete':
+        return FlagIcon
+      case 'question':
+        return HelpCircleIcon
+      default:
+        return WrenchIcon
     }
   }
   function hhmm(ts: number): string {
@@ -185,10 +202,18 @@
   }
   function hhmmss(ts: number): string {
     if (!ts) return ''
-    return new Date(ts).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' })
+    return new Date(ts).toLocaleTimeString([], {
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit'
+    })
   }
   function prettyPrint(raw: string): string {
-    try { return JSON.stringify(JSON.parse(raw), null, 2) } catch { return raw }
+    try {
+      return JSON.stringify(JSON.parse(raw), null, 2)
+    } catch {
+      return raw
+    }
   }
 </script>
 
@@ -197,19 +222,57 @@
     {#if items.length === 0}
       <div class="flex flex-col items-center gap-2 px-3 py-6 text-center">
         <svg viewBox="0 0 64 110" class="h-14 w-auto text-muted-foreground/40" fill="none">
-          <line x1="32" y1="8" x2="32" y2="102" stroke="currentColor" stroke-width="1" stroke-dasharray="2.5 4" opacity="0.35" />
+          <line
+            x1="32"
+            y1="8"
+            x2="32"
+            y2="102"
+            stroke="currentColor"
+            stroke-width="1"
+            stroke-dasharray="2.5 4"
+            opacity="0.35"
+          />
           <circle cx="32" cy="22" r="4" fill="currentColor">
-            <animate attributeName="opacity" values="0.25;0.9;0.25" dur="2.4s" repeatCount="indefinite" />
+            <animate
+              attributeName="opacity"
+              values="0.25;0.9;0.25"
+              dur="2.4s"
+              repeatCount="indefinite"
+            />
           </circle>
           <circle cx="32" cy="55" r="4" fill="currentColor">
-            <animate attributeName="opacity" values="0.25;0.9;0.25" dur="2.4s" begin="0.6s" repeatCount="indefinite" />
+            <animate
+              attributeName="opacity"
+              values="0.25;0.9;0.25"
+              dur="2.4s"
+              begin="0.6s"
+              repeatCount="indefinite"
+            />
           </circle>
           <circle cx="32" cy="55" r="4" fill="none" stroke="currentColor" stroke-width="1.5">
-            <animate attributeName="r" values="4;11;4" dur="2.4s" begin="0.6s" repeatCount="indefinite" />
-            <animate attributeName="opacity" values="0.6;0;0.6" dur="2.4s" begin="0.6s" repeatCount="indefinite" />
+            <animate
+              attributeName="r"
+              values="4;11;4"
+              dur="2.4s"
+              begin="0.6s"
+              repeatCount="indefinite"
+            />
+            <animate
+              attributeName="opacity"
+              values="0.6;0;0.6"
+              dur="2.4s"
+              begin="0.6s"
+              repeatCount="indefinite"
+            />
           </circle>
           <circle cx="32" cy="88" r="4" fill="currentColor">
-            <animate attributeName="opacity" values="0.25;0.9;0.25" dur="2.4s" begin="1.2s" repeatCount="indefinite" />
+            <animate
+              attributeName="opacity"
+              values="0.25;0.9;0.25"
+              dur="2.4s"
+              begin="1.2s"
+              repeatCount="indefinite"
+            />
           </circle>
         </svg>
         <p class="text-[11px] leading-relaxed text-muted-foreground">Waiting for activity…</p>
@@ -227,24 +290,42 @@
             {@const expandedWithTools = open && item.tools.length > 0}
             <!-- Step node on the backbone -->
             <div class="relative" data-tl-id={item.step.id}>
-              <span class="pointer-events-none absolute left-[17px] w-px {segClass(st, isFirst, isLast, expandedWithTools)}" aria-hidden="true"></span>
+              <span
+                class="pointer-events-none absolute left-[17px] w-px {segClass(
+                  st,
+                  isFirst,
+                  isLast,
+                  expandedWithTools
+                )}"
+                aria-hidden="true"
+              ></span>
               <button
                 type="button"
-                class="relative flex w-full items-center gap-2 rounded px-3 py-1.5 text-left text-xs {expandable ? 'cursor-pointer hover:bg-muted/30' : 'cursor-default'} {st === 'running' ? 'bg-primary/5' : ''}"
+                class="relative flex w-full items-center gap-2 rounded px-3 py-1.5 text-left text-xs {expandable
+                  ? 'cursor-pointer hover:bg-muted/30'
+                  : 'cursor-default'} {st === 'running' ? 'bg-primary/5' : ''}"
                 onclick={() => expandable && toggleStep(item.step)}
                 aria-expanded={open}
                 disabled={!expandable}
               >
                 <!-- Filled status node -->
-                <span class="relative z-10 flex size-3.5 shrink-0 items-center justify-center rounded-full
-                  {st === 'done' ? 'bg-primary'
-                  : st === 'running' ? 'bg-background'
-                  : st === 'failed' ? 'bg-destructive'
-                  : st === 'blocked' ? 'bg-warning/25 border border-warning'
-                  : st === 'skipped' || st === 'replaced' ? 'bg-muted'
-                  : 'bg-background border border-muted-foreground/40'}">
+                <span
+                  class="relative z-10 flex size-3.5 shrink-0 items-center justify-center rounded-full
+                  {st === 'done'
+                    ? 'bg-primary'
+                    : st === 'running'
+                      ? 'bg-background'
+                      : st === 'failed'
+                        ? 'bg-destructive'
+                        : st === 'blocked'
+                          ? 'bg-warning/25 border border-warning'
+                          : st === 'skipped' || st === 'replaced'
+                            ? 'bg-muted'
+                            : 'bg-background border border-muted-foreground/40'}"
+                >
                   {#if st === 'running'}
-                    <span class="absolute -inset-0.5 animate-ping rounded-full bg-primary/30"></span>
+                    <span class="absolute -inset-0.5 animate-ping rounded-full bg-primary/30"
+                    ></span>
                     <Spinner class="relative size-3.5 text-primary" />
                   {:else if st === 'done'}
                     <CheckIcon class="size-2.5 text-primary-foreground" strokeWidth={3.5} />
@@ -256,15 +337,28 @@
                     <SlashIcon class="size-2 text-muted-foreground" strokeWidth={3} />
                   {/if}
                 </span>
-                <span title={item.step.title} class="min-w-0 flex-1 leading-snug {open ? 'whitespace-normal' : 'truncate'} {st === 'done' ? 'text-muted-foreground' : st === 'running' ? 'font-medium text-foreground' : 'text-muted-foreground'}">
+                <span
+                  title={item.step.title}
+                  class="min-w-0 flex-1 leading-snug {open
+                    ? 'whitespace-normal'
+                    : 'truncate'} {st === 'done'
+                    ? 'text-muted-foreground'
+                    : st === 'running'
+                      ? 'font-medium text-foreground'
+                      : 'text-muted-foreground'}"
+                >
                   {item.step.title}
                 </span>
                 {#if hhmm(item.ts)}
-                  <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/60">{hhmm(item.ts)}</span>
+                  <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/60"
+                    >{hhmm(item.ts)}</span
+                  >
                 {/if}
                 {#if item.tools.length > 0}
                   <span class="shrink-0 text-muted-foreground/60">
-                    {#if open}<ChevronDownIcon class="size-3" />{:else}<ChevronRightIcon class="size-3" />{/if}
+                    {#if open}<ChevronDownIcon class="size-3" />{:else}<ChevronRightIcon
+                        class="size-3"
+                      />{/if}
                   </span>
                 {/if}
               </button>
@@ -275,10 +369,19 @@
                     {@const tOpen = expandedTools.has(tool.id)}
                     <div class="relative" data-tl-id={tool.id}>
                       <!-- Branch stub: backbone → tool -->
-                      <span class="pointer-events-none absolute left-[17px] top-[9.5px] h-px w-[17px] {tool.status === 'failed' ? 'bg-destructive/40' : 'bg-border'}" aria-hidden="true"></span>
+                      <span
+                        class="pointer-events-none absolute left-[17px] top-[9.5px] h-px w-[17px] {tool.status ===
+                        'failed'
+                          ? 'bg-destructive/40'
+                          : 'bg-border'}"
+                        aria-hidden="true"
+                      ></span>
                       <button
                         type="button"
-                        class="flex w-full items-center gap-1.5 py-1 pl-9 pr-3 text-left text-[11px] {(tool.args || tool.detail) ? 'cursor-pointer hover:bg-muted/20' : 'cursor-default'}"
+                        class="flex w-full items-center gap-1.5 py-1 pl-9 pr-3 text-left text-[11px] {tool.args ||
+                        tool.detail
+                          ? 'cursor-pointer hover:bg-muted/20'
+                          : 'cursor-default'}"
                         onclick={() => (tool.args || tool.detail) && toggleTool(tool.id)}
                       >
                         <span class="flex size-3 shrink-0 items-center justify-center">
@@ -290,24 +393,47 @@
                             <CheckIcon class="size-2.5 text-primary/70" strokeWidth={3.5} />
                           {/if}
                         </span>
-                        <span title={tool.description} class="min-w-0 flex-1 truncate leading-snug {tool.status === 'done' ? 'text-muted-foreground' : tool.status === 'failed' ? 'text-destructive' : 'text-foreground/80'}">
+                        <span
+                          title={tool.description}
+                          class="min-w-0 flex-1 truncate leading-snug {tool.status === 'done'
+                            ? 'text-muted-foreground'
+                            : tool.status === 'failed'
+                              ? 'text-destructive'
+                              : 'text-foreground/80'}"
+                        >
                           {tool.description}
                         </span>
-                        <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/50">{hhmm(tool.timestamp)}</span>
+                        <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/50"
+                          >{hhmm(tool.timestamp)}</span
+                        >
                       </button>
                       {#if tOpen}
-                        <div transition:slide={{ duration: 120 }} class="flex flex-col gap-1 pb-1.5 pl-[52px] pr-3">
-                          <div class="flex items-center gap-1.5 text-[9px] text-muted-foreground/70">
+                        <div
+                          transition:slide={{ duration: 120 }}
+                          class="flex flex-col gap-1 pb-1.5 pl-[52px] pr-3"
+                        >
+                          <div
+                            class="flex items-center gap-1.5 text-[9px] text-muted-foreground/70"
+                          >
                             <span class="capitalize">{tool.status}</span>
                             <span aria-hidden="true">·</span>
                             <span>{hhmmss(tool.timestamp)}</span>
-                            {#if tool.toolName}<span aria-hidden="true">·</span><code class="font-mono">{tool.toolName}</code>{/if}
+                            {#if tool.toolName}<span aria-hidden="true">·</span><code
+                                class="font-mono">{tool.toolName}</code
+                              >{/if}
                           </div>
                           {#if tool.args}
-                            <pre class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed text-muted-foreground">{prettyPrint(tool.args)}</pre>
+                            <pre
+                              class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed text-muted-foreground">{prettyPrint(
+                                tool.args
+                              )}</pre>
                           {/if}
                           {#if tool.detail}
-                            <pre class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed {tool.status === 'failed' ? 'text-destructive' : 'text-muted-foreground'}">{prettyPrint(tool.detail)}</pre>
+                            <pre
+                              class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed {tool.status ===
+                              'failed'
+                                ? 'text-destructive'
+                                : 'text-muted-foreground'}">{prettyPrint(tool.detail)}</pre>
                           {/if}
                         </div>
                       {/if}
@@ -322,14 +448,31 @@
             {@const Icon = entryIcon(e)}
             {@const eOpen = expandedTools.has(e.id)}
             <div class="relative" data-tl-id={e.id}>
-              <span class="pointer-events-none absolute left-[17px] w-px {segClass(e.status, isFirst, isLast, false)}" aria-hidden="true"></span>
+              <span
+                class="pointer-events-none absolute left-[17px] w-px {segClass(
+                  e.status,
+                  isFirst,
+                  isLast,
+                  false
+                )}"
+                aria-hidden="true"
+              ></span>
               <button
                 type="button"
-                class="flex w-full items-center gap-2 px-3 py-1.5 text-left text-[11px] {(e.args || e.detail) ? 'cursor-pointer hover:bg-muted/30' : 'cursor-default'}"
+                class="flex w-full items-center gap-2 px-3 py-1.5 text-left text-[11px] {e.args ||
+                e.detail
+                  ? 'cursor-pointer hover:bg-muted/30'
+                  : 'cursor-default'}"
                 onclick={() => (e.args || e.detail) && toggleTool(e.id)}
               >
-                <span class="relative z-10 flex size-3.5 shrink-0 items-center justify-center rounded-full border bg-background
-                  {e.status === 'failed' ? 'border-destructive text-destructive' : e.status === 'running' ? 'border-primary text-primary' : 'border-border text-primary'}">
+                <span
+                  class="relative z-10 flex size-3.5 shrink-0 items-center justify-center rounded-full border bg-background
+                  {e.status === 'failed'
+                    ? 'border-destructive text-destructive'
+                    : e.status === 'running'
+                      ? 'border-primary text-primary'
+                      : 'border-border text-primary'}"
+                >
                   {#if e.status === 'running'}
                     <Spinner class="size-2.5" />
                   {:else if e.status === 'failed'}
@@ -338,24 +481,43 @@
                     <Icon class="size-2" strokeWidth={2.5} />
                   {/if}
                 </span>
-                <span title={e.description} class="min-w-0 flex-1 truncate leading-snug {e.status === 'done' ? 'text-muted-foreground' : 'text-foreground/80'}">
+                <span
+                  title={e.description}
+                  class="min-w-0 flex-1 truncate leading-snug {e.status === 'done'
+                    ? 'text-muted-foreground'
+                    : 'text-foreground/80'}"
+                >
                   {e.description}
                 </span>
-                <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/60">{hhmm(e.timestamp)}</span>
+                <span class="shrink-0 text-[9px] tabular-nums text-muted-foreground/60"
+                  >{hhmm(e.timestamp)}</span
+                >
               </button>
               {#if eOpen}
-                <div transition:slide={{ duration: 120 }} class="flex flex-col gap-1 pb-1.5 pl-9 pr-3">
+                <div
+                  transition:slide={{ duration: 120 }}
+                  class="flex flex-col gap-1 pb-1.5 pl-9 pr-3"
+                >
                   <div class="flex items-center gap-1.5 text-[9px] text-muted-foreground/70">
                     <span class="capitalize">{e.status}</span>
                     <span aria-hidden="true">·</span>
                     <span>{hhmmss(e.timestamp)}</span>
-                    {#if e.toolName}<span aria-hidden="true">·</span><code class="font-mono">{e.toolName}</code>{/if}
+                    {#if e.toolName}<span aria-hidden="true">·</span><code class="font-mono"
+                        >{e.toolName}</code
+                      >{/if}
                   </div>
                   {#if e.args}
-                    <pre class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed text-muted-foreground">{prettyPrint(e.args)}</pre>
+                    <pre
+                      class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed text-muted-foreground">{prettyPrint(
+                        e.args
+                      )}</pre>
                   {/if}
                   {#if e.detail}
-                    <pre class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed {e.status === 'failed' ? 'text-destructive' : 'text-muted-foreground'}">{prettyPrint(e.detail)}</pre>
+                    <pre
+                      class="max-h-36 overflow-auto whitespace-pre-wrap break-words rounded bg-muted/50 p-1.5 font-mono text-[9px] leading-relaxed {e.status ===
+                      'failed'
+                        ? 'text-destructive'
+                        : 'text-muted-foreground'}">{prettyPrint(e.detail)}</pre>
                   {/if}
                 </div>
               {/if}