fix(web): integrate composer "working/queued" strip into the terminal aesthetic

The background-working hint was a plain muted text line bolted above the
textarea — misaligned with the input column and off-idiom. Restyle it as a
terminal status strip: spinner + uppercase fg "Working" label + muted detail,
hairline primary-tinted border (matching .trace.running), square, aligned to
the textarea's max-w-3xl column. Reads as part of the working state now.

VERSION: 0.17.1 -> 0.17.2

web/src/lib/components/ChatThread.svelte

@@ -11,6 +11,7 @@
   import { Textarea } from '$lib/components/ui/textarea'
   import AgentTrace from './AgentTrace.svelte'
   import OperatorQuestion from './OperatorQuestion.svelte'
+  import Spinner from './Spinner.svelte'
   import CornerDownLeftIcon from '@lucide/svelte/icons/corner-down-left'
   import RefreshCwIcon from '@lucide/svelte/icons/refresh-cw'
   import SquareIcon from '@lucide/svelte/icons/square'
@@ -418,9 +419,17 @@
         {#if working && !streaming}
           <!-- Background/autonomous turn in progress (no live stream to watch):
                keep the composer open so the operator can queue a follow-up
-               (plan 2026-08-03 F1/F2). -->
-          <div class="mb-1 px-1 text-[10px] text-muted-foreground">
-            Nomos is working in the background — your message will queue and run when it's free.
+               (plan 2026-08-03 F1/F2). Styled as a terminal status strip that
+               mirrors AgentTrace's running idiom (spinner + fg label + a
+               primary-tinted hairline border) and aligns to the textarea's
+               column, so it reads as part of the working state rather than a
+               floating footnote. -->
+          <div class="composer-status mx-auto mb-2 w-full max-w-3xl">
+            <Spinner class="size-3 shrink-0 text-primary" />
+            <span class="composer-status-label">Working</span>
+            <span class="composer-status-text"
+              >message will queue — runs when Nomos is free</span
+            >
           </div>
         {/if}
         <form
@@ -640,6 +649,30 @@
     opacity: 0.3;
   }
 
+  /* Composer "working/queued" status strip — terminal status-bar idiom: a
+     hairline primary-tinted border (matching .trace.running), square corners,
+     a spinner + an uppercase fg label + muted detail. Border-driven, no
+     shadow — same language as the rest of the cyberspace surfaces. */
+  .composer-status {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.3rem 0.6rem;
+    border: 1px solid color-mix(in oklab, var(--primary) 35%, var(--border));
+    border-radius: 0;
+    background: color-mix(in oklab, var(--primary) 6%, var(--card));
+    font-size: 11px;
+    color: var(--muted-foreground);
+  }
+  .composer-status-label {
+    color: var(--foreground);
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+  }
+  .composer-status-text {
+    color: var(--muted-foreground);
+  }
+
   /* Code copy button — global: injected via render() into {html} blocks */
   .prose-chat :global(.code-block-wrapper) {
     position: relative;