feat(web): redesign task rail — Plan/Event log polish, entity graph resize fix

- Plan/Activity panels: humanize step titles, richer icons, empty states
  matching Scope's illustration style, pretty-printed expandable detail
- Activity log renamed to Event log; every step now expandable
- Chat: middle-truncate header title, remove redundant task-list rail and
  header stat cluster (duplicated in the sidebar), simplify markdown styling
- Fix --font-mono actually being a monospace font (was aliased to DM Sans)
- Replace rotating loader-circle spinner with a smoother fading-blade Spinner
- SessionGraph entity detail panel: resizable and self-clamping against its
  live container size (was overflowing into sibling sections), close button
- Dev launch config: fetch bearer token from the running api container so
  `npm run dev` works against the local compose stack without a hardcoded
  secret in a tracked file

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

web/src/App.svelte

@@ -10,15 +10,14 @@
   import Config from './pages/Config.svelte'
   import { newChat } from '$lib/stores/chat'
   import { summary, subscribeContext, openSignalCount } from '$lib/stores/context'
-  import { connectionState } from '$lib/stores/events'
   import { currentTask } from '$lib/stores/workspace'
   import { isConfigured } from '$lib/config'
+  import { truncateMiddle } from '$lib/utils'
   import { onMount } from 'svelte'
   import { processPendingCallback, initOIDC } from '$lib/oidc'
   import * as Sidebar from '$lib/components/ui/sidebar'
   import * as Sheet from '$lib/components/ui/sheet'
   import { Button } from '$lib/components/ui/button'
-  import { Badge } from '$lib/components/ui/badge'
   import { Separator } from '$lib/components/ui/separator'
   import { VERSION } from '$lib/version'
   import { Toaster } from '$lib/components/ui/sonner'
@@ -206,37 +205,15 @@
       <Sidebar.Trigger class="-ms-1" />
       <Separator orientation="vertical" class="mx-2 data-[orientation=vertical]:h-4" />
       {#if page === 'chat'}
-        <button type="button" class="text-sm text-muted-foreground hover:text-foreground" onclick={() => navigate('overview')}>Tasks</button>
-        <span class="text-muted-foreground">/</span>
-        <span class="text-base font-medium">
-          {$currentTask?.goal ? $currentTask.goal.replace(/[*_`~#]|\[.*?\]\(.*?\)/g, '') : 'New Task'}
+        {@const goalText = $currentTask?.goal ? $currentTask.goal.replace(/[*_`~#]|\[.*?\]\(.*?\)/g, '') : 'New Task'}
+        <button type="button" class="shrink-0 text-sm text-muted-foreground hover:text-foreground" onclick={() => navigate('overview')}>Tasks</button>
+        <span class="shrink-0 text-muted-foreground">/</span>
+        <span class="min-w-0 flex-1 truncate text-base font-medium" title={goalText}>
+          {truncateMiddle(goalText, 100)}
         </span>
       {:else}
         <span class="text-base font-medium capitalize">{page === 'entity' ? routeParam : page === 'kb' ? 'Knowledge Base' : page === 'overview' ? 'Tasks' : page}</span>
       {/if}
-      <div class="ms-auto flex items-center gap-2.5">
-      {#if $summary}
-        <div class="hidden items-center gap-2.5 text-xs text-muted-foreground sm:flex">
-          <span class="flex items-center gap-1" title="healthy"><span class="size-2 rounded-full bg-success"></span>{$summary.health.healthy}</span>
-          <span class="flex items-center gap-1" title="degraded"><span class="size-2 rounded-full bg-warning"></span>{$summary.health.degraded}</span>
-          <span class="flex items-center gap-1" title="down"><span class="size-2 rounded-full bg-destructive"></span>{$summary.health.down}</span>
-        </div>
-        {#if approvalsPending}
-          <button type="button" onclick={() => navigate('ops')}>
-            <Badge variant="destructive" class="cursor-pointer">{approvalsPending} approval{approvalsPending === 1 ? '' : 's'}</Badge>
-          </button>
-        {/if}
-        {#if openSignals}
-          <button type="button" onclick={() => navigate('signals')}>
-            <Badge variant="secondary" class="cursor-pointer">{openSignals} signal{openSignals === 1 ? '' : 's'}</Badge>
-          </button>
-        {/if}
-      {/if}
-      <span
-        class="size-2 rounded-full {$connectionState === 'open' ? 'bg-success' : $connectionState === 'connecting' ? 'animate-pulse bg-warning' : 'bg-destructive'}"
-        title="event stream: {$connectionState}"
-      ></span>
-      </div>
     </header>
     <main class="min-h-0 flex-1 overflow-hidden">
       {#if page === 'overview'}