From cb9b9d72d65cfe794ff8bc9ffdcf826ecf2bf4ae Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 5 Sep 2026 00:14:03 +0000
Subject: [PATCH 1/4] feat(chat): add the Chat surface at /chat beside RFQ,
 Mailbox and Counterparties

Chat reads the mailbox's own device-local records one counterparty at a time:
Sent copies, imported payment links, and the OTC, payment and escrow state
Mailbox persisted while it read the chain, grouped by contact. Nothing is
fetched or posted from the page, and it is not settlement authority.

- The header gains a Chat tab; RFQ, Mailbox, Counterparties and Pay are
  unchanged.
- Left rail: contact name, latest record, unread count, search, and a
  needs-action filter over open offers, unpaid requests and fillable escrows.
- Centre: chronological incoming and outgoing entries with compact record
  cards (offer, invoice, escrow, payment memo) that disclose the full Mailbox
  card, plus a composer that sends a body-only encrypted letter through the
  same policy, helper funding, key lookup, encryption and submit path as
  Compose. Value actions stay in Mailbox.
- Right rail: wallet identity with the RFQ and Mail handoffs, open RFQs
  (bilateral offers, and workspace RFQs naming the contact as maker), pending
  payments and escrows; selecting an entry shows its detail in place and can
  locate it in the conversation.

The eager application shell stays inside its recorded 450 kB budget by
deferring the proposal-only market view and the dry cross-chain review, two
secondary read-only tools; Chat itself loads with its sibling surfaces.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01DL5RB43eSUCvsor8uVPfUa
---
 README.md                             |    4 +
 docs/APP20_PRIVATE_DESK.md            |    5 +
 src/app/chat/ChatComposer.tsx         |  150 +++
 src/app/chat/ChatContextPanel.tsx     |  312 ++++++
 src/app/chat/ChatConversationRail.tsx |  237 +++++
 src/app/chat/ChatRecordCard.tsx       |  118 +++
 src/app/chat/ChatTimeline.tsx         |  132 +++
 src/app/chat/chat-model.test.ts       |  353 +++++++
 src/app/chat/chat-model.ts            | 1026 +++++++++++++++++++
 src/app/chat/chat-send.test.ts        |  135 +++
 src/app/chat/chat-send.ts             |  365 +++++++
 src/app/chat/chat.module.css          | 1340 +++++++++++++++++++++++++
 src/app/chat/page.tsx                 |  702 +++++++++++++
 src/app/components/AppShell.tsx       |   20 +-
 src/app/globals.css                   |   12 +
 src/app/routes.test.ts                |    2 +
 src/app/routes.ts                     |    1 +
 src/main.tsx                          |   54 +-
 18 files changed, 4956 insertions(+), 12 deletions(-)
 create mode 100644 src/app/chat/ChatComposer.tsx
 create mode 100644 src/app/chat/ChatContextPanel.tsx
 create mode 100644 src/app/chat/ChatConversationRail.tsx
 create mode 100644 src/app/chat/ChatRecordCard.tsx
 create mode 100644 src/app/chat/ChatTimeline.tsx
 create mode 100644 src/app/chat/chat-model.test.ts
 create mode 100644 src/app/chat/chat-model.ts
 create mode 100644 src/app/chat/chat-send.test.ts
 create mode 100644 src/app/chat/chat-send.ts
 create mode 100644 src/app/chat/chat.module.css
 create mode 100644 src/app/chat/page.tsx

diff --git a/README.md b/README.md
index 32ac2ac..50d8aa5 100644
--- a/README.md
+++ b/README.md
@@ -10,6 +10,9 @@ Three surfaces form one workflow:
 2. **Mailbox** — encrypted correspondence, structured evidence, invoice completion, and backup recovery
 3. **Counterparties** — a device-encrypted directory with RFQ and Mail handoffs
 
+**Chat** (`/chat`) complements them: it reads the same device-local records one
+counterparty at a time. Multi-maker requests stay in the RFQ workspace.
+
 Users connect once in the header. The Ready Wallet API path does not expose a
 viewing key to APP20; the optional Privy browser-owned SDK derives/holds its
 viewing key on the user's device. Mailbox keys also stay on-device. The STRK20
@@ -36,6 +39,7 @@ origin is live. This is not a Mainnet value-moving release.
 | Private RFQ     | `/rfq`                                                                              | Two localnet fixture makers, collateralized quotes, browser selection, and atomic Take. No production maker network.     |
 | Mailbox         | `/mail/inbox`                                                                       | Encrypted correspondence, payment handoffs, and self-backups. Evidence and recovery transport, not settlement authority. |
 | Counterparties  | `/contacts`                                                                         | Device-encrypted labels and addresses with RFQ/Mail handoffs and optional encrypted backup.                              |
+| Chat            | `/chat`                                                                             | One counterparty at a time: device-local letters, offers, invoices, and escrows with that contact, plus their open RFQs, pending payments, and escrows. Reads Mailbox's records; value actions stay in Mailbox. |
 | Separate tools  | `/funding`, `/send`, `/cross-chain-review`, `/recovery/privy`, `/pay`               | Funding readiness, unavailable public send, dry cross-chain review, Privy recovery, and unsigned payment links.          |
 | Read-only views | `/rfq/operations`, `/rfq/markets/:tokenA/:tokenB/proposal`, `/swap/:tokenA/:tokenB` | Operations status, proposal-only market planning, and non-executable pair handoffs.                                      |
 
diff --git a/docs/APP20_PRIVATE_DESK.md b/docs/APP20_PRIVATE_DESK.md
index 463881c..52a9593 100644
--- a/docs/APP20_PRIVATE_DESK.md
+++ b/docs/APP20_PRIVATE_DESK.md
@@ -6,6 +6,11 @@ APP20 joins three surfaces into one workflow:
 2. **Mailbox** — encrypted correspondence, authenticated backup, and non-authoritative evidence.
 3. **Counterparties** — a device-encrypted address book with RFQ and Mail handoffs.
 
+**Chat** (`/chat`) reads the same device-local Mailbox records one counterparty at a
+time: letters, offers, invoices, and escrows with that contact beside their open RFQs,
+pending payments, and escrows. It complements the multi-maker RFQ workspace and takes
+no value action of its own.
+
 APP20 is a bookless invited-maker venue using the existing STRK20 privacy pool. It does not create a pool, AMM, public order book, or automatic public fallback. See [`GAPS.md`](GAPS.md) for open engineering work.
 
 ## Localnet-only boundary
diff --git a/src/app/chat/ChatComposer.tsx b/src/app/chat/ChatComposer.tsx
new file mode 100644
index 0000000..0aaa123
--- /dev/null
+++ b/src/app/chat/ChatComposer.tsx
@@ -0,0 +1,150 @@
+import { Link } from "@tanstack/react-router";
+import { useState, type FormEvent, type KeyboardEvent } from "react";
+import { ProvingProgress } from "@/components/mail/OperationProgress";
+import {
+  CHAT_LETTER_MAX_CHARS,
+  type ChatLetterBudget,
+  type ChatSendBlocker,
+} from "./chat-send";
+import styles from "./chat.module.css";
+
+export type ChatKeyState =
+  | { kind: "ready" }
+  | { kind: "missing" }
+  | { kind: "locked"; busy: boolean; error?: string };
+
+export type ChatComposerStatus = Readonly<{
+  kind: "sending" | "ok" | "error";
+  message: string;
+  startedAt?: number;
+}> | null;
+
+type ChatComposerProps = {
+  contactName: string;
+  value: string;
+  onChange: (value: string) => void;
+  blocker: ChatSendBlocker | null;
+  keyState: ChatKeyState;
+  onUnlock: (passphrase: string) => void;
+  sending: boolean;
+  status: ChatComposerStatus;
+  budget: ChatLetterBudget;
+  onSend: () => void;
+};
+
+export default function ChatComposer({
+  contactName,
+  value,
+  onChange,
+  blocker,
+  keyState,
+  onUnlock,
+  sending,
+  status,
+  budget,
+  onSend,
+}: ChatComposerProps) {
+  const [passphrase, setPassphrase] = useState("");
+  const disabled = Boolean(blocker) || sending;
+  const canSend = !disabled && value.trim().length > 0 && budget.fits;
+
+  function submit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    if (canSend) onSend();
+  }
+
+  function onKeyDown(event: KeyboardEvent<HTMLTextAreaElement>) {
+    if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+      event.preventDefault();
+      if (canSend) onSend();
+    }
+  }
+
+  return (
+    <form
+      className={styles.composer}
+      aria-label={`Write to ${contactName}`}
+      onSubmit={submit}
+    >
+      <label className={styles.srOnly} htmlFor="chat-composer">
+        Message to {contactName}
+      </label>
+      <textarea
+        id="chat-composer"
+        className={styles.composerInput}
+        value={value}
+        rows={3}
+        maxLength={CHAT_LETTER_MAX_CHARS}
+        placeholder={`Write an encrypted letter to ${contactName}…`}
+        disabled={sending}
+        onChange={(event) => onChange(event.target.value)}
+        onKeyDown={onKeyDown}
+      />
+      {keyState.kind === "locked" ? (
+        <div className={styles.unlockForm}>
+          <span>
+            This mailbox is passphrase-wrapped on this device. Unlock it for
+            this tab to sign and send.
+            {keyState.error ? ` ${keyState.error}` : ""}
+          </span>
+          <input
+            type="password"
+            aria-label="Mailbox passphrase"
+            autoComplete="current-password"
+            value={passphrase}
+            disabled={keyState.busy}
+            onChange={(event) => setPassphrase(event.target.value)}
+          />
+          <button
+            type="button"
+            disabled={keyState.busy || passphrase.length < 8}
+            onClick={() => {
+              onUnlock(passphrase);
+              setPassphrase("");
+            }}
+          >
+            {keyState.busy ? "Unlocking…" : "Unlock for this tab"}
+          </button>
+        </div>
+      ) : null}
+      <div className={styles.composerRow}>
+        <span className={styles.composerMeta}>
+          {blocker ? (
+            <>
+              {blocker.message}
+              {blocker.kind === "key" && keyState.kind === "missing" ? (
+                <>
+                  {" "}
+                  <Link to="/mail/inbox">Set one up in Mailbox</Link>
+                </>
+              ) : null}
+            </>
+          ) : (
+            <>
+              {budget.plaintextBytes} / {budget.maxPlaintextBytes} bytes ·
+              sealed on this device · 1 wallet approval · recipient count and
+              timing are public
+            </>
+          )}
+        </span>
+        <button type="submit" className={styles.sendButton} disabled={!canSend}>
+          {sending ? "Sending…" : "Send encrypted"}
+        </button>
+      </div>
+      {status ? (
+        <p
+          className={styles.composerStatus}
+          data-kind={status.kind}
+          role={status.kind === "error" ? "alert" : "status"}
+        >
+          {status.message}
+        </p>
+      ) : null}
+      <ProvingProgress
+        active={sending}
+        startedAt={status?.startedAt}
+        label="Sealing and submitting the letter"
+      />
+    </form>
+  );
+}
diff --git a/src/app/chat/ChatContextPanel.tsx b/src/app/chat/ChatContextPanel.tsx
new file mode 100644
index 0000000..b8317f1
--- /dev/null
+++ b/src/app/chat/ChatContextPanel.tsx
@@ -0,0 +1,312 @@
+import { Link } from "@tanstack/react-router";
+import type { ReactNode } from "react";
+import type { AliasRecord } from "@/lib/aliases";
+import { storeDeskHandoff } from "@/lib/desk-handoff";
+import { ChatRecordFull } from "./ChatRecordCard";
+import {
+  contactDisplayName,
+  type ChatContactContext,
+  type ChatContextEntry,
+  type ChatContextSection,
+  type ChatConversation,
+} from "./chat-model";
+import styles from "./chat.module.css";
+
+const SECTION_LABELS: Readonly<Record<ChatContextSection, string>> = {
+  rfq: "Open RFQ",
+  payment: "Pending payment",
+  escrow: "Escrow",
+};
+
+function identityNote(conversation: ChatConversation): string {
+  switch (conversation.contact.nameSource) {
+    case "address-book":
+      return "Saved counterparty. The label is device-encrypted and is never authentication.";
+    case "alias":
+      return "Local alias. A label on this device, never authentication.";
+    default:
+      return "No local name. This address came from a Sent copy or an unauthenticated payload claim.";
+  }
+}
+
+function expiryLabel(at: number): string {
+  if (at === 0) return "No expiry";
+  return new Date(at * 1_000).toLocaleString();
+}
+
+function ContextSection({
+  title,
+  entries,
+  empty,
+  selectedEntryId,
+  onSelectEntry,
+}: {
+  title: string;
+  entries: readonly ChatContextEntry[];
+  empty: ReactNode;
+  selectedEntryId: string | null;
+  onSelectEntry: (id: string) => void;
+}) {
+  return (
+    <section className={styles.contextSection} aria-label={title}>
+      <div className={styles.contextSectionHead}>
+        <h3>{title}</h3>
+        <span>{entries.length}</span>
+      </div>
+      {entries.length ? (
+        <ul className={styles.contextList}>
+          {entries.map((entry) => (
+            <li key={entry.id}>
+              <button
+                type="button"
+                className={styles.contextEntry}
+                data-tone={entry.tone}
+                aria-pressed={selectedEntryId === entry.id}
+                onClick={() => onSelectEntry(entry.id)}
+              >
+                <span className={styles.contextEntryTop}>
+                  <strong>
+                    {entry.title}
+                    {entry.direction === "workspace"
+                      ? ""
+                      : entry.direction === "outgoing"
+                        ? " · sent"
+                        : " · received"}
+                  </strong>
+                  <em>{entry.open ? "open" : "closed"}</em>
+                </span>
+                <span className={styles.contextEntryTerms}>{entry.terms}</span>
+                <span className={styles.contextEntryStatus}>{entry.status}</span>
+              </button>
+            </li>
+          ))}
+        </ul>
+      ) : (
+        <p className={styles.contextEmpty}>{empty}</p>
+      )}
+    </section>
+  );
+}
+
+type ChatContextPanelProps = {
+  conversation: ChatConversation;
+  context: ChatContactContext;
+  selectedEntry: ChatContextEntry | null;
+  onSelectEntry: (id: string | null) => void;
+  onLocate: (itemId: string) => void;
+  selfAddress: string;
+  chainId: string;
+  handoffsEnabled: boolean;
+  aliases: readonly AliasRecord[];
+  onClose: () => void;
+};
+
+export default function ChatContextPanel({
+  conversation,
+  context,
+  selectedEntry,
+  onSelectEntry,
+  onLocate,
+  selfAddress,
+  chainId,
+  handoffsEnabled,
+  aliases,
+  onClose,
+}: ChatContextPanelProps) {
+  const { contact } = conversation;
+  const name = contactDisplayName(contact);
+  const handoff = (kind: "rfq" | "mail") => {
+    try {
+      storeDeskHandoff(window.sessionStorage, kind, contact.address, {
+        account: selfAddress,
+        chainId,
+      });
+    } catch {
+      // A refused session store only loses the prefilled counterparty.
+    }
+  };
+
+  return (
+    <aside className={styles.context} aria-label="Contact context" id="chat-context">
+      <header className={styles.contextHead}>
+        <div>
+          <p className={styles.kicker}>CONTACT CONTEXT</p>
+          <strong>{selectedEntry ? "Record detail" : "At a glance"}</strong>
+        </div>
+        <button
+          type="button"
+          className={styles.contextClose}
+          aria-label="Close contact context"
+          onClick={onClose}
+        >
+          ×
+        </button>
+      </header>
+
+      <div className={styles.contextScroll}>
+        {selectedEntry ? (
+          <section className={styles.detail} aria-label="Record detail">
+            <button
+              type="button"
+              className={styles.detailBack}
+              onClick={() => onSelectEntry(null)}
+            >
+              ← Back to {name}
+            </button>
+            <div>
+              <p className={styles.kicker}>
+                {SECTION_LABELS[selectedEntry.section].toUpperCase()}
+              </p>
+              <strong>{selectedEntry.title}</strong>
+            </div>
+            <dl className={styles.detailFacts}>
+              <div>
+                <dt>Terms</dt>
+                <dd>{selectedEntry.terms}</dd>
+              </div>
+              <div>
+                <dt>Status</dt>
+                <dd>{selectedEntry.status}</dd>
+              </div>
+              <div>
+                <dt>Side</dt>
+                <dd>
+                  {selectedEntry.direction === "workspace"
+                    ? "Multi-maker request from the RFQ workspace"
+                    : selectedEntry.direction === "outgoing"
+                      ? `Sent by this wallet to ${name}`
+                      : `Received from ${name}`}
+                </dd>
+              </div>
+              {selectedEntry.record ? (
+                <div>
+                  <dt>Expiry</dt>
+                  <dd>{expiryLabel(selectedEntry.record.facts.expiresAt)}</dd>
+                </div>
+              ) : null}
+              {selectedEntry.rfq ? (
+                <>
+                  <div>
+                    <dt>RFQ id</dt>
+                    <dd>
+                      <code>{selectedEntry.rfq.rfqId}</code>
+                    </dd>
+                  </div>
+                  <div>
+                    <dt>Makers</dt>
+                    <dd>
+                      {[
+                        selectedEntry.rfq.selectedQuote?.solverId,
+                        ...(selectedEntry.rfq.fills ?? []).map(
+                          (fill) => fill.makerId,
+                        ),
+                      ]
+                        .filter(Boolean)
+                        .join(", ") || "Not selected"}
+                    </dd>
+                  </div>
+                  <div>
+                    <dt>Authority</dt>
+                    <dd>{selectedEntry.rfq.authority}</dd>
+                  </div>
+                </>
+              ) : null}
+            </dl>
+            {selectedEntry.record?.needsAction ? (
+              <p className={styles.recordAction}>
+                <span>{selectedEntry.record.needsAction}</span>
+                <Link to="/mail/inbox">Open Mailbox</Link>
+              </p>
+            ) : null}
+            <div className={styles.detailActions}>
+              {selectedEntry.itemId ? (
+                <button
+                  type="button"
+                  onClick={() => onLocate(selectedEntry.itemId!)}
+                >
+                  Show in conversation
+                </button>
+              ) : null}
+              {selectedEntry.rfq ? (
+                <Link to="/rfq" hash="records">
+                  Open in RFQ workspace
+                </Link>
+              ) : null}
+            </div>
+            {selectedEntry.record ? (
+              <div className={styles.recordFull}>
+                <ChatRecordFull
+                  record={selectedEntry.record}
+                  own={selectedEntry.direction === "outgoing"}
+                  aliases={aliases}
+                />
+              </div>
+            ) : null}
+          </section>
+        ) : (
+          <>
+            <section className={styles.identity} aria-label="Wallet identity">
+              <p className={styles.kicker}>WALLET IDENTITY</p>
+              <h2>
+                <bdi>{name}</bdi>
+              </h2>
+              <code>{contact.address}</code>
+              <p className={styles.identityNote}>{identityNote(conversation)}</p>
+              <div className={styles.identityActions}>
+                {handoffsEnabled ? (
+                  <>
+                    <Link to="/rfq" hash="desk" onClick={() => handoff("rfq")}>
+                      New RFQ
+                    </Link>
+                    <Link to="/mail/inbox" onClick={() => handoff("mail")}>
+                      Encrypted Mail
+                    </Link>
+                  </>
+                ) : null}
+                <Link to="/contacts">
+                  {contact.saved ? "Counterparties" : "Save to Counterparties"}
+                </Link>
+              </div>
+            </section>
+
+            <ContextSection
+              title="Open RFQs"
+              entries={context.rfqs}
+              empty={
+                <>
+                  No open offer with {name}. Multi-maker requests stay in the{" "}
+                  <Link to="/rfq" hash="records">
+                    RFQ workspace
+                  </Link>
+                  ; one appears here only when a maker id matches this contact.
+                </>
+              }
+              selectedEntryId={null}
+              onSelectEntry={onSelectEntry}
+            />
+            <ContextSection
+              title="Pending payments"
+              entries={context.payments}
+              empty={<>No payment request is waiting between you and {name}.</>}
+              selectedEntryId={null}
+              onSelectEntry={onSelectEntry}
+            />
+            <ContextSection
+              title="Escrows"
+              entries={context.escrows}
+              empty={
+                <>
+                  No escrow announcement with {name} on this device. Escrow
+                  state is read from the contract by Mailbox, never proven by
+                  a message.
+                </>
+              }
+              selectedEntryId={null}
+              onSelectEntry={onSelectEntry}
+            />
+          </>
+        )}
+      </div>
+    </aside>
+  );
+}
diff --git a/src/app/chat/ChatConversationRail.tsx b/src/app/chat/ChatConversationRail.tsx
new file mode 100644
index 0000000..05aca84
--- /dev/null
+++ b/src/app/chat/ChatConversationRail.tsx
@@ -0,0 +1,237 @@
+import { Link } from "@tanstack/react-router";
+import { shortenFelt } from "@/components/mail/correspondent";
+import { contactDisplayName, type ChatConversation } from "./chat-model";
+import styles from "./chat.module.css";
+
+/** Today shows a clock time; anything older shows the day. */
+export function chatTimeLabel(
+  at: number | undefined,
+  now = Date.now(),
+): { label: string; dateTime?: string } {
+  if (at === undefined) return { label: "—" };
+  const date = new Date(at);
+  if (Number.isNaN(date.getTime())) return { label: "—" };
+  const dateTime = date.toISOString();
+  const today = new Date(now);
+  if (date.toDateString() === today.toDateString()) {
+    return {
+      label: new Intl.DateTimeFormat(undefined, {
+        hour: "2-digit",
+        minute: "2-digit",
+      }).format(date),
+      dateTime,
+    };
+  }
+  return {
+    label: new Intl.DateTimeFormat(undefined, {
+      month: "short",
+      day: "numeric",
+    }).format(date),
+    dateTime,
+  };
+}
+
+function nameSourceLabel(conversation: ChatConversation): string {
+  switch (conversation.contact.nameSource) {
+    case "address-book":
+      return "Saved counterparty";
+    case "alias":
+      return "Local alias";
+    default:
+      return "Unnamed · address only";
+  }
+}
+
+type ChatConversationRailProps = {
+  conversations: readonly ChatConversation[];
+  totalCount: number;
+  selectedAddress: string | null;
+  search: string;
+  onSearchChange: (value: string) => void;
+  needsActionOnly: boolean;
+  onNeedsActionChange: (value: boolean) => void;
+  needsActionCount: number;
+  /** What blocks this desk, so the rail answers what the page answers. */
+  gate: "wallet" | null;
+  unattributedSent: number;
+  onSelect: (address: string) => void;
+};
+
+export default function ChatConversationRail({
+  conversations,
+  totalCount,
+  selectedAddress,
+  search,
+  onSearchChange,
+  needsActionOnly,
+  onNeedsActionChange,
+  needsActionCount,
+  gate,
+  unattributedSent,
+  onSelect,
+}: ChatConversationRailProps) {
+  const searching = search.trim().length > 0;
+  return (
+    <section className={styles.rail} aria-label="Conversations">
+      <header className={styles.railHeading}>
+        <div>
+          <p className={styles.kicker}>
+            {needsActionOnly ? "NEEDS ACTION" : "CONVERSATIONS"}
+          </p>
+          <h1>Chat</h1>
+        </div>
+        <span
+          className={styles.railCount}
+          aria-label={`${conversations.length} conversation${conversations.length === 1 ? "" : "s"} shown`}
+        >
+          {conversations.length}
+        </span>
+      </header>
+
+      <div className={styles.railTools}>
+        <input
+          type="search"
+          className={styles.railSearch}
+          value={search}
+          placeholder="Search counterparties and records"
+          aria-label="Search conversations"
+          disabled={gate !== null}
+          onChange={(event) => onSearchChange(event.target.value)}
+        />
+        <button
+          type="button"
+          className={styles.railFilter}
+          aria-pressed={needsActionOnly}
+          disabled={gate !== null}
+          onClick={() => onNeedsActionChange(!needsActionOnly)}
+        >
+          <span>Needs action only</span>
+          <strong>{needsActionCount}</strong>
+        </button>
+      </div>
+
+      {gate === null && totalCount ? (
+        <div className={styles.railNote}>
+          <strong>Device-local records</strong>
+          <span>
+            Sent copies, imported requests and the deal state Mailbox saved,
+            grouped by counterparty. Nothing here is fetched or posted.
+          </span>
+        </div>
+      ) : null}
+
+      {conversations.length ? (
+        <ol className={styles.conversationList}>
+          {conversations.map((conversation) => {
+            const { contact, latest, unreadCount } = conversation;
+            const name = contactDisplayName(contact);
+            const selected = selectedAddress === contact.address;
+            const time = chatTimeLabel(latest?.at);
+            const preview = latest
+              ? latest.preview
+              : "No records with this counterparty on this device yet.";
+            return (
+              <li key={contact.address}>
+                <button
+                  type="button"
+                  className={styles.conversationItem}
+                  aria-current={selected ? "true" : undefined}
+                  aria-label={`${unreadCount ? `${unreadCount} unread. ` : ""}${name}. ${
+                    latest ? `${latest.label}. ` : ""
+                  }${preview}`}
+                  onClick={() => onSelect(contact.address)}
+                >
+                  <span className={styles.conversationTop}>
+                    <span className={styles.conversationName}>
+                      <strong title={contact.address}>
+                        <bdi>{name}</bdi>
+                      </strong>
+                      <small>
+                        {contact.label
+                          ? shortenFelt(contact.address)
+                          : nameSourceLabel(conversation)}
+                      </small>
+                    </span>
+                    <time
+                      className={styles.conversationTime}
+                      dateTime={time.dateTime}
+                    >
+                      {time.label}
+                    </time>
+                  </span>
+                  <span className={styles.conversationPreview}>
+                    {latest?.direction === "outgoing" ? <em>You: </em> : null}
+                    {preview}
+                  </span>
+                  <span className={styles.conversationMeta}>
+                    {latest ? (
+                      <em className={styles.typeBadge}>{latest.label}</em>
+                    ) : null}
+                    {conversation.needsAction ? (
+                      <em className={styles.actionBadge}>Needs action</em>
+                    ) : null}
+                    {unreadCount ? (
+                      <span className={styles.unread}>
+                        {unreadCount} unread
+                      </span>
+                    ) : latest?.direction === "incoming" ? (
+                      <span className={styles.opened}>Opened</span>
+                    ) : null}
+                  </span>
+                </button>
+              </li>
+            );
+          })}
+        </ol>
+      ) : (
+        <div className={styles.railEmpty}>
+          <span className={styles.railGlyph} aria-hidden="true">
+            {searching ? "⌕" : gate ? "⚿" : "✉"}
+          </span>
+          {gate ? (
+            <>
+              <strong>Wallet required</strong>
+              <span>
+                Chat is keyed to a wallet and reads only this device&apos;s
+                records for it. Connect one to open it.
+              </span>
+            </>
+          ) : searching ? (
+            <>
+              <strong>No conversation matches</strong>
+              <span>
+                Search reads only names, addresses and records already on this
+                device.
+              </span>
+            </>
+          ) : needsActionOnly ? (
+            <>
+              <strong>Nothing needs your action</strong>
+              <span>
+                No open offer, unpaid request or fillable escrow is waiting on
+                this wallet.
+              </span>
+            </>
+          ) : (
+            <>
+              <strong>No counterparties yet</strong>
+              <span>
+                Save one under Counterparties, or send a letter from Mailbox.
+                Both appear here.
+              </span>
+            </>
+          )}
+        </div>
+      )}
+
+      {unattributedSent ? (
+        <p className={styles.railFooter}>
+          {unattributedSent} Sent cop{unattributedSent === 1 ? "y" : "ies"}{" "}
+          carr{unattributedSent === 1 ? "ies" : "y"} no stored recipient and
+          sta{unattributedSent === 1 ? "ys" : "y"} in{" "}
+          <Link to="/mail/inbox">Mailbox</Link>.
+        </p>
+      ) : null}
+    </section>
+  );
+}
diff --git a/src/app/chat/ChatRecordCard.tsx b/src/app/chat/ChatRecordCard.tsx
new file mode 100644
index 0000000..53cb110
--- /dev/null
+++ b/src/app/chat/ChatRecordCard.tsx
@@ -0,0 +1,118 @@
+import { Link } from "@tanstack/react-router";
+import EscrowCard from "@/components/mail/EscrowCard";
+import InvoiceCard from "@/components/mail/InvoiceCard";
+import OfferCard from "@/components/mail/OfferCard";
+import ReceiptCard from "@/components/mail/ReceiptCard";
+import { findAliasByAddress, type AliasRecord } from "@/lib/aliases";
+import type { PaymentLinkAuthenticity } from "@/lib/payment-link";
+import type { ChatRecord } from "./chat-model";
+import styles from "./chat.module.css";
+
+type RecordProps = {
+  record: ChatRecord;
+  /** This wallet issued the record. */
+  own: boolean;
+  aliases: readonly AliasRecord[];
+  linkAuthenticity?: PaymentLinkAuthenticity;
+};
+
+/**
+ * The complete Mailbox card for a record, read-only: every caveat Mailbox
+ * prints is printed here, and no value action is offered from Chat.
+ */
+export function ChatRecordFull({
+  record,
+  own,
+  aliases,
+  linkAuthenticity,
+}: RecordProps) {
+  if (record.offer) {
+    return (
+      <OfferCard
+        offer={record.offer}
+        alias={findAliasByAddress(aliases, record.offer.offerer)?.label}
+        status={record.deal?.status}
+        settlementVerified={record.deal?.settlementVerified}
+        unverifiedClaim={Boolean(
+          record.deal?.counterpartyAcceptClaim ||
+            record.deal?.counterpartyReceiptClaim,
+        )}
+      />
+    );
+  }
+  if (record.request) {
+    return (
+      <InvoiceCard
+        request={record.request}
+        alias={findAliasByAddress(aliases, record.request.requester)?.label}
+        status={record.payment?.status}
+        paymentVerified={record.payment?.paymentVerified}
+        unverifiedClaim={Boolean(record.payment?.counterpartyPaymentClaim)}
+        showPaymentActions={false}
+        showShareAction={false}
+        linkAuthenticity={linkAuthenticity ?? record.payment?.linkAuthenticity}
+      />
+    );
+  }
+  if (record.fund) {
+    return (
+      <EscrowCard
+        fund={record.fund}
+        status={record.escrow?.chainStatus}
+        termsVerified={record.escrowTermsVerified}
+        ownDeal={own}
+      />
+    );
+  }
+  if (record.receipt) {
+    return (
+      <ReceiptCard
+        receipt={record.receipt}
+        standalonePayment={record.receiptKind === "payment"}
+        locallySubmitted={own}
+      />
+    );
+  }
+  return null;
+}
+
+export default function ChatRecordCard({
+  record,
+  own,
+  aliases,
+  linkAuthenticity,
+  defaultOpen = false,
+}: RecordProps & { defaultOpen?: boolean }) {
+  return (
+    <article
+      className={styles.recordCard}
+      data-tone={record.facts.tone}
+      aria-label={`${record.facts.title}: ${record.facts.terms}. ${record.facts.status}`}
+    >
+      <div className={styles.recordHead}>
+        <span className={styles.recordTitle}>
+          {record.facts.title} · {own ? "sent" : "received"}
+        </span>
+        <span className={styles.recordStatus}>{record.facts.status}</span>
+      </div>
+      <p className={styles.recordTerms}>{record.facts.terms}</p>
+      {record.needsAction ? (
+        <p className={styles.recordAction}>
+          <span>{record.needsAction}</span>
+          <Link to="/mail/inbox">Open Mailbox</Link>
+        </p>
+      ) : null}
+      <details className={styles.recordDetails} open={defaultOpen || undefined}>
+        <summary>Full record</summary>
+        <div className={styles.recordFull}>
+          <ChatRecordFull
+            record={record}
+            own={own}
+            aliases={aliases}
+            linkAuthenticity={linkAuthenticity}
+          />
+        </div>
+      </details>
+    </article>
+  );
+}
diff --git a/src/app/chat/ChatTimeline.tsx b/src/app/chat/ChatTimeline.tsx
new file mode 100644
index 0000000..e0c976c
--- /dev/null
+++ b/src/app/chat/ChatTimeline.tsx
@@ -0,0 +1,132 @@
+import type { AliasRecord } from "@/lib/aliases";
+import ChatRecordCard from "./ChatRecordCard";
+import {
+  contactDisplayName,
+  type ChatConversation,
+  type ChatItem,
+} from "./chat-model";
+import styles from "./chat.module.css";
+
+export function chatEntryDomId(itemId: string): string {
+  return `chat-item-${itemId.replace(/[^a-zA-Z0-9_-]/g, "-")}`;
+}
+
+function fullTime(at: number | undefined): { label: string; dateTime?: string } {
+  if (at === undefined) return { label: "Time not recorded" };
+  const date = new Date(at);
+  if (Number.isNaN(date.getTime())) return { label: "Time not recorded" };
+  return {
+    label: new Intl.DateTimeFormat(undefined, {
+      dateStyle: "medium",
+      timeStyle: "short",
+    }).format(date),
+    dateTime: date.toISOString(),
+  };
+}
+
+function provenanceLabel(item: ChatItem): string {
+  switch (item.provenance) {
+    case "device-sent":
+      return "Sent copy on this device";
+    case "payment-link":
+      return item.message?.linkAuthenticity?.kind === "verified"
+        ? "Imported link · Mail-key signature verified"
+        : "Imported link · unverified";
+    default:
+      return "Saved by Mailbox from decrypted mail";
+  }
+}
+
+type ChatTimelineProps = {
+  conversation: ChatConversation;
+  aliases: readonly AliasRecord[];
+  highlightId: string | null;
+};
+
+export default function ChatTimeline({
+  conversation,
+  aliases,
+  highlightId,
+}: ChatTimelineProps) {
+  const name = contactDisplayName(conversation.contact);
+  if (!conversation.items.length) {
+    return (
+      <div className={styles.timelineEmpty}>
+        <strong>No records with {name} on this device yet.</strong>
+        <p>
+          A letter sent from here is sealed to their registered mailbox key and
+          kept as a Sent copy in this browser profile. Records they send you
+          appear after Mailbox checks for mail.
+        </p>
+      </div>
+    );
+  }
+
+  function renderContent(item: ChatItem) {
+    const cards = item.records.length ? (
+      <div className={styles.cardStack}>
+        {item.records.map((record) => (
+          <ChatRecordCard
+            key={record.id}
+            record={record}
+            own={item.direction === "outgoing"}
+            aliases={aliases}
+            linkAuthenticity={item.message?.linkAuthenticity}
+          />
+        ))}
+      </div>
+    ) : null;
+    if (item.kind === "letter" || item.kind === "document") {
+      return (
+        <div className={styles.bubble}>
+          {item.body.trim() ? (
+            <p className={styles.letterBody}>{item.body}</p>
+          ) : (
+            <p className={styles.memo}>No message body</p>
+          )}
+          {cards}
+        </div>
+      );
+    }
+    if (cards) return cards;
+    return (
+      <div className={styles.bubble}>
+        <p className={styles.memo}>{item.preview}</p>
+        {item.body.trim() ? (
+          <p className={styles.letterBody}>{item.body}</p>
+        ) : null}
+      </div>
+    );
+  }
+
+  return (
+    <ol className={styles.timeline} aria-label={`Conversation with ${name}`}>
+      {conversation.items.map((item) => {
+        const time = fullTime(item.at);
+        return (
+          <li
+            key={item.id}
+            id={chatEntryDomId(item.id)}
+            className={styles.entry}
+            data-direction={item.direction}
+            data-highlight={highlightId === item.id ? "true" : undefined}
+          >
+            <div className={styles.entryMeta}>
+              <b>{item.direction === "outgoing" ? "You" : name}</b>
+              <span>{item.label}</span>
+              <time dateTime={time.dateTime}>{time.label}</time>
+              <span>{provenanceLabel(item)}</span>
+              {item.otherRecipients ? (
+                <span>
+                  +{item.otherRecipients} other recipient
+                  {item.otherRecipients === 1 ? "" : "s"}
+                </span>
+              ) : null}
+            </div>
+            {renderContent(item)}
+          </li>
+        );
+      })}
+    </ol>
+  );
+}
diff --git a/src/app/chat/chat-model.test.ts b/src/app/chat/chat-model.test.ts
new file mode 100644
index 0000000..35094a3
--- /dev/null
+++ b/src/app/chat/chat-model.test.ts
@@ -0,0 +1,353 @@
+import { describe, expect, it } from "vitest";
+import { paymentLinkToLocal } from "@/app/inbox/mailbox-model";
+import type { RfqLifecycleRecord } from "@/app/rfq/rfq-lifecycle";
+import type { LocalMailMessage } from "@/components/mail/Thread";
+import { feltEquals } from "@/lib/addresses";
+import { decodeEnvelope, encodeEnvelope, type EnvelopeType } from "@/lib/envelope";
+import type { EscrowState } from "@/lib/escrow";
+import type { EncryptedMailRecord } from "@/lib/mail";
+import type { OtcState, PaymentRequestPayload } from "@/lib/otc";
+import { addrSTRK } from "@/utils/constants";
+import {
+  buildChatModel,
+  buildContactContext,
+  contactDisplayName,
+  filterConversations,
+  rfqNamesContact,
+  type ChatModelInput,
+} from "./chat-model";
+
+const NOW = 1_900_000_000;
+const SELF = "0xa11ce";
+const BOB = "0xb0b";
+const CAROL = "0xca401";
+const DAVE = "0xdaee";
+const ERIN = "0xe41";
+const STRK = { symbol: "STRK", address: addrSTRK, decimals: 18 };
+const USDC = { symbol: "USDC", address: "0x53c", decimals: 6 };
+const RECORD: EncryptedMailRecord = {
+  ephemeralPub: ["0x1", "0x2"],
+  viewTag: 3,
+  nonce: ["0x4", "0x5"],
+  ciphertextFelts: ["0x6"],
+};
+
+const wideId = (byte: string) => `0x${byte.repeat(32)}`;
+const INCOMING_DEAL = wideId("11");
+const SENT_DEAL = wideId("22");
+const CAROL_REQUEST = wideId("33");
+const LETTER_DOCUMENT = wideId("44");
+const OFFER_DOCUMENT = wideId("55");
+const SELF_DOCUMENT = wideId("66");
+const LOST_DOCUMENT = wideId("77");
+
+function sent(
+  documentId: string,
+  type: EnvelopeType,
+  payload: unknown,
+  plaintext: string,
+  recipients: string[],
+  createdAtSeconds: number,
+): LocalMailMessage {
+  return {
+    id: `sent:${documentId}`,
+    documentId,
+    index: "local",
+    plaintext,
+    envelope: decodeEnvelope(encodeEnvelope(type, payload)),
+    record: RECORD,
+    transactionHash: "0x7",
+    direction: "outgoing",
+    recipientCount: recipients.length,
+    recipients,
+    localCreatedAt: createdAtSeconds * 1_000,
+  };
+}
+
+const sentOffer = {
+  dealId: SENT_DEAL,
+  give: { token: STRK, amount: "1000000000000000000" },
+  want: { token: USDC, amount: "2500000" },
+  offerer: SELF,
+  expiresAt: NOW + 3_600,
+};
+
+const incomingOffer = {
+  dealId: INCOMING_DEAL,
+  give: { token: STRK, amount: "3000000000000000000" },
+  want: { token: USDC, amount: "7000000" },
+  offerer: BOB,
+  expiresAt: NOW + 3_600,
+};
+
+const carolRequest: PaymentRequestPayload = {
+  requestId: CAROL_REQUEST,
+  token: STRK,
+  amount: "4000000000000000000",
+  requester: CAROL,
+  expiresAt: NOW + 3_600,
+  memo: "Desk fee",
+};
+
+const daveFund = {
+  dealId: "0x23",
+  escrowAddress: "0xe5c",
+  maker: DAVE,
+  legA: { token: STRK, amount: "5" },
+  legB: { token: USDC, amount: "6" },
+  deadline: NOW + 3_600,
+  claimPubkey: "0x123",
+};
+
+const otc: OtcState = {
+  version: 1,
+  deals: {
+    [INCOMING_DEAL]: {
+      dealId: INCOMING_DEAL,
+      status: "offered",
+      offer: incomingOffer,
+      updatedAt: NOW - 10,
+    },
+    [SENT_DEAL]: {
+      dealId: SENT_DEAL,
+      status: "accepted",
+      offer: sentOffer,
+      counterpartyAcceptClaim: {
+        dealId: SENT_DEAL,
+        transfer: { token: STRK, amount: "1000000000000000000", to: SELF },
+      },
+      updatedAt: NOW - 40,
+    },
+  },
+  payments: {
+    [CAROL_REQUEST]: {
+      requestId: CAROL_REQUEST,
+      status: "requested",
+      request: carolRequest,
+      origin: "payment_link",
+      linkAuthenticity: { kind: "unsigned" },
+      updatedAt: NOW - 5,
+    },
+  },
+};
+
+const escrow: EscrowState = {
+  version: 1,
+  deals: {
+    "0x23": {
+      dealId: "0x23",
+      fund: daveFund,
+      chainStatus: "funded",
+      chainDeal: {
+        legAToken: addrSTRK,
+        legAAmount: "5",
+        legBToken: "0x53c",
+        legBTerms: "6",
+        legBAmount: "0",
+        deadline: NOW + 3_600,
+        ticket: "0x123",
+        claimPubkey: "0x123",
+        status: "funded",
+      },
+      operations: {},
+      counterpartyClaims: {},
+      updatedAt: NOW - 20,
+    },
+  },
+};
+
+const input: ChatModelInput = {
+  selfAddress: SELF,
+  sent: [
+    sent(LETTER_DOCUMENT, "text", { body: "See you at the desk" }, "See you at the desk", [BOB], NOW - 100),
+    sent(
+      OFFER_DOCUMENT,
+      "composite",
+      {
+        documentId: OFFER_DOCUMENT,
+        body: "",
+        attachments: [{ type: "offer", payload: sentOffer }],
+      },
+      "",
+      [BOB],
+      NOW - 50,
+    ),
+    sent(SELF_DOCUMENT, "text", { body: "note to self" }, "note to self", [SELF], NOW - 30),
+    sent(LOST_DOCUMENT, "text", { body: "recipient not stored" }, "recipient not stored", [], NOW - 30),
+  ],
+  paymentLinks: [paymentLinkToLocal(carolRequest, NOW - 5, { kind: "unsigned" })],
+  otc,
+  escrow,
+  addressBook: [
+    { label: "Bob", address: BOB, updatedAt: 1 },
+    { label: "Erin", address: ERIN, updatedAt: 1 },
+  ],
+  aliases: [{ address: CAROL, label: "Carol desk", addedAt: 1 }],
+  readIds: new Set([`record:deal:${INCOMING_DEAL}`]),
+  now: NOW,
+};
+
+function conversationFor(address: string) {
+  const conversation = buildChatModel(input).conversations.find((candidate) =>
+    feltEquals(candidate.contact.address, address),
+  );
+  if (!conversation) throw new Error(`No conversation for ${address}`);
+  return conversation;
+}
+
+describe("chat conversations", () => {
+  it("groups device-local records by counterparty, newest activity first", () => {
+    const model = buildChatModel(input);
+    expect(
+      model.conversations.map((conversation) => contactDisplayName(conversation.contact)),
+    ).toEqual(["Carol desk", "Bob", "0xdaee", "Erin"]);
+    expect(model.unattributedSent).toBe(1);
+  });
+
+  it("reads Bob's letter, sent offer and received offer in order with their status", () => {
+    const bob = conversationFor(BOB);
+    expect(bob.contact).toMatchObject({ label: "Bob", nameSource: "address-book", saved: true });
+    expect(bob.items.map((item) => item.kind)).toEqual(["letter", "document", "offer"]);
+    expect(bob.items.map((item) => item.direction)).toEqual([
+      "outgoing",
+      "outgoing",
+      "incoming",
+    ]);
+    expect(bob.items[0].body).toBe("See you at the desk");
+    expect(bob.items[1].preview).toBe("Offer: 1 STRK for 2.5 USDC");
+    expect(bob.items[1].records[0].facts.status).toMatch(/Accepted · unverified claim/);
+    expect(bob.items[1].needsAction).toMatch(/claims to have settled/);
+    expect(bob.items[2].records[0].facts).toMatchObject({
+      kind: "offer",
+      terms: "3 STRK for 7 USDC",
+      status: "Open offer",
+      open: true,
+    });
+    expect(bob.items[2].needsAction).toMatch(/Accept or decline/);
+    expect(bob.latest?.id).toBe(`record:deal:${INCOMING_DEAL}`);
+    expect(bob.unreadCount).toBe(0);
+    expect(bob.needsAction).toBe(true);
+  });
+
+  it("shows an imported payment link under its aliased requester as unread work", () => {
+    const carol = conversationFor(CAROL);
+    expect(carol.contact).toMatchObject({ label: "Carol desk", nameSource: "alias", saved: false });
+    expect(carol.items).toHaveLength(1);
+    expect(carol.items[0]).toMatchObject({
+      kind: "invoice",
+      direction: "incoming",
+      provenance: "payment-link",
+      preview: "4 STRK · Desk fee",
+    });
+    expect(carol.items[0].needsAction).toMatch(/Pay this request/);
+    expect(carol.unreadCount).toBe(1);
+  });
+
+  it("offers a fillable escrow from an unnamed maker only after the contract terms match", () => {
+    const dave = conversationFor(DAVE);
+    expect(dave.contact.label).toBeNull();
+    expect(dave.items[0].records[0]).toMatchObject({
+      escrowTermsVerified: true,
+      needsAction: "Deposit leg B in Mailbox to receive leg A.",
+    });
+    const unmatched = buildChatModel({
+      ...input,
+      escrow: {
+        version: 1,
+        deals: {
+          "0x23": { ...escrow.deals["0x23"], chainDeal: undefined },
+        },
+      },
+    });
+    const daveUnmatched = unmatched.conversations.find((candidate) =>
+      feltEquals(candidate.contact.address, DAVE),
+    );
+    expect(daveUnmatched?.items[0].needsAction).toBeNull();
+  });
+
+  it("lists a saved counterparty with no records last and keeps self-mail out", () => {
+    const erin = conversationFor(ERIN);
+    expect(erin.items).toEqual([]);
+    expect(erin.latest).toBeNull();
+    expect(
+      buildChatModel(input).conversations.some((conversation) =>
+        feltEquals(conversation.contact.address, SELF),
+      ),
+    ).toBe(false);
+  });
+
+  it("filters by local names, record terms and pending action", () => {
+    const { conversations } = buildChatModel(input);
+    const names = (filtered: typeof conversations) =>
+      filtered.map((conversation) => contactDisplayName(conversation.contact));
+    expect(names(filterConversations(conversations, { search: "erin" }))).toEqual(["Erin"]);
+    expect(names(filterConversations(conversations, { search: "2.5 usdc" }))).toEqual(["Bob"]);
+    expect(names(filterConversations(conversations, { search: "desk fee" }))).toEqual([
+      "Carol desk",
+    ]);
+    expect(names(filterConversations(conversations, { needsActionOnly: true }))).toEqual([
+      "Carol desk",
+      "Bob",
+      "0xdaee",
+    ]);
+    expect(
+      names(filterConversations(conversations, { needsActionOnly: true, search: "bob" })),
+    ).toEqual(["Bob"]);
+  });
+});
+
+describe("contact context", () => {
+  const workspaceRfq = (state: RfqLifecycleRecord["state"]) =>
+    ({
+      rfqId: "0x77",
+      mode: "v3",
+      state,
+      updatedAt: NOW,
+      chainId: "0x1",
+      account: SELF,
+      terms: {
+        pairId: "STRK_USDC",
+        sellSymbol: "STRK",
+        sellAddress: "0x1",
+        sellDecimals: 18,
+        sellAmount: "100000000000000000000",
+        buySymbol: "USDC",
+        buyAddress: "0x2",
+        buyDecimals: 6,
+        minBuyAmount: "180",
+        rfqExpiresAt: NOW + 600,
+      },
+      selectedQuote: { solverId: "bob" },
+      attempts: {},
+    }) as unknown as RfqLifecycleRecord;
+
+  it("keeps open offers, pending payments and escrows per counterparty", () => {
+    const bob = buildContactContext(conversationFor(BOB));
+    expect(bob.rfqs.map((entry) => [entry.direction, entry.terms])).toEqual([
+      ["incoming", "3 STRK for 7 USDC"],
+      ["outgoing", "1 STRK for 2.5 USDC"],
+    ]);
+    expect(bob.rfqs.every((entry) => entry.itemId)).toBe(true);
+    expect(bob.payments).toEqual([]);
+    expect(bob.escrows).toEqual([]);
+    expect(buildContactContext(conversationFor(CAROL)).payments).toHaveLength(1);
+    expect(buildContactContext(conversationFor(DAVE)).escrows[0]).toMatchObject({
+      open: true,
+      status: "Funded · awaiting fill",
+    });
+  });
+
+  it("mirrors a workspace RFQ only while it names this contact and stays open", () => {
+    const bob = conversationFor(BOB);
+    expect(rfqNamesContact(workspaceRfq("quoted"), bob.contact)).toBe(true);
+    expect(rfqNamesContact(workspaceRfq("quoted"), conversationFor(DAVE).contact)).toBe(false);
+    const open = buildContactContext(bob, [workspaceRfq("quoted")]);
+    expect(open.rfqs.at(-1)).toMatchObject({
+      direction: "workspace",
+      terms: "100 STRK → USDC",
+      status: "Locked quotes received",
+      open: true,
+    });
+    expect(buildContactContext(bob, [workspaceRfq("settled")]).rfqs).toHaveLength(2);
+  });
+});
diff --git a/src/app/chat/chat-model.ts b/src/app/chat/chat-model.ts
new file mode 100644
index 0000000..2d2137f
--- /dev/null
+++ b/src/app/chat/chat-model.ts
@@ -0,0 +1,1026 @@
+import { mailMessageTimestampMs } from "@/app/inbox/mailbox-model";
+import type {
+  RfqLifecycleRecord,
+  RfqLifecycleState,
+} from "@/app/rfq/rfq-lifecycle";
+import { rfqStateLabel } from "@/app/rfq/rfq-state-label";
+import type { LocalMailMessage } from "@/components/mail/Thread";
+import { shortenFelt } from "@/components/mail/correspondent";
+import type { AddressBookEntry } from "@/lib/address-book";
+import { canonicalizeStarknetAddress, feltEquals } from "@/lib/addresses";
+import { findAliasByAddress, type AliasRecord } from "@/lib/aliases";
+import { parseCompositePayload } from "@/lib/composite";
+import {
+  contractDealMatchesFund,
+  parseEscrowClaimPayload,
+  parseEscrowFillPayload,
+  parseEscrowFundPayload,
+  parseEscrowTimeoutPayload,
+  type EscrowContractStatus,
+  type EscrowDealRecord,
+  type EscrowFundPayload,
+  type EscrowState,
+} from "@/lib/escrow";
+import {
+  formatBaseUnits,
+  offerIsExpired,
+  parseAcceptPayload,
+  parseDeclinePayload,
+  parseOfferPayload,
+  parsePaymentRequestPayload,
+  parseReceiptPayload,
+  paymentRequestIsExpired,
+  ONE_SIDED_WARNING,
+  type DealRecord,
+  type DealStatus,
+  type OfferPayload,
+  type OtcState,
+  type PaymentRecord,
+  type PaymentRequestPayload,
+  type PaymentStatus,
+  type ReceiptPayload,
+} from "@/lib/otc";
+import { sanitizeUntrustedText } from "@/lib/text";
+
+/**
+ * Chat is a per-counterparty reading of what this device already holds:
+ * device-local Sent copies, imported payment links, and the OTC, payment and
+ * escrow records Mailbox persisted while it read the chain. Nothing here is a
+ * new store and nothing here is settlement authority; every record carries
+ * the same caveats it carries in Mailbox.
+ */
+
+export type ChatContactNameSource = "address-book" | "alias" | "none";
+
+export type ChatContact = Readonly<{
+  address: string;
+  label: string | null;
+  nameSource: ChatContactNameSource;
+  saved: boolean;
+}>;
+
+export type ChatRecordKind = "offer" | "invoice" | "escrow" | "payment";
+
+export type ChatRecordTone = "accent" | "live" | "deal" | "muted" | "danger";
+
+export type ChatRecordFacts = Readonly<{
+  kind: ChatRecordKind;
+  title: string;
+  terms: string;
+  status: string;
+  tone: ChatRecordTone;
+  /** Still awaiting a counterparty or this wallet. */
+  open: boolean;
+  expiresAt: number;
+}>;
+
+export type ChatRecord = Readonly<{
+  id: string;
+  facts: ChatRecordFacts;
+  needsAction: string | null;
+  offer?: OfferPayload;
+  deal?: DealRecord;
+  request?: PaymentRequestPayload;
+  payment?: PaymentRecord;
+  fund?: EscrowFundPayload;
+  escrow?: EscrowDealRecord;
+  /** Chain-read terms matched the encrypted announcement. */
+  escrowTermsVerified?: boolean;
+  receipt?: ReceiptPayload;
+  /** A standalone private payment memo, or a claim about a deal leg. */
+  receiptKind?: "payment" | "transfer";
+}>;
+
+export type ChatItemKind =
+  | "letter"
+  | "document"
+  | "offer"
+  | "invoice"
+  | "escrow"
+  | "receipt"
+  | "memo"
+  | "decline"
+  | "unsupported";
+
+export type ChatItemProvenance = "device-sent" | "payment-link" | "mailbox-record";
+
+export type ChatItem = Readonly<{
+  id: string;
+  contact: string;
+  direction: "incoming" | "outgoing";
+  /** Milliseconds; undefined when no local or chain time is known. */
+  at: number | undefined;
+  kind: ChatItemKind;
+  label: string;
+  preview: string;
+  body: string;
+  provenance: ChatItemProvenance;
+  needsAction: string | null;
+  records: readonly ChatRecord[];
+  message?: LocalMailMessage;
+  /** Other recipients of the same device-local Sent copy. */
+  otherRecipients: number;
+}>;
+
+export type ChatConversation = Readonly<{
+  contact: ChatContact;
+  /** Oldest first. */
+  items: readonly ChatItem[];
+  latest: ChatItem | null;
+  unreadCount: number;
+  needsAction: boolean;
+}>;
+
+export type ChatModelInput = Readonly<{
+  selfAddress: string;
+  /** Device-local Sent copies, already projected to mailbox messages. */
+  sent: readonly LocalMailMessage[];
+  /** Payment requests imported from /pay, projected the way Mailbox shows them. */
+  paymentLinks: readonly LocalMailMessage[];
+  otc: OtcState;
+  escrow: EscrowState;
+  addressBook: readonly AddressBookEntry[];
+  aliases: readonly AliasRecord[];
+  readIds: ReadonlySet<string>;
+  /** Seconds. */
+  now?: number;
+}>;
+
+export type ChatModel = Readonly<{
+  /** Most recent activity first; contacts without records after that. */
+  conversations: readonly ChatConversation[];
+  /** Sent copies whose recipient this device never stored. */
+  unattributedSent: number;
+}>;
+
+export type ChatContextSection = "rfq" | "payment" | "escrow";
+
+export type ChatContextEntry = Readonly<{
+  id: string;
+  section: ChatContextSection;
+  title: string;
+  terms: string;
+  status: string;
+  tone: ChatRecordTone;
+  open: boolean;
+  direction: "incoming" | "outgoing" | "workspace";
+  itemId?: string;
+  record?: ChatRecord;
+  rfq?: RfqLifecycleRecord;
+}>;
+
+export type ChatContactContext = Readonly<{
+  rfqs: readonly ChatContextEntry[];
+  payments: readonly ChatContextEntry[];
+  escrows: readonly ChatContextEntry[];
+}>;
+
+export type ChatConversationFilter = Readonly<{
+  search?: string;
+  needsActionOnly?: boolean;
+}>;
+
+const DEAL_STATUS: Readonly<Record<DealStatus, string>> = Object.freeze({
+  offered: "Open offer",
+  accepted: "Accepted",
+  closed: "Receipt posted",
+  declined: "Declined",
+  expired: "Expired",
+});
+
+const PAYMENT_STATUS: Readonly<Record<PaymentStatus, string>> = Object.freeze({
+  requested: "Awaiting payment",
+  paid: "Paid",
+  expired: "Expired",
+});
+
+const ESCROW_STATUS: Readonly<Record<EscrowContractStatus, string>> =
+  Object.freeze({
+    empty: "Not funded on-chain",
+    funded: "Funded · awaiting fill",
+    filled: "Filled · claim pending",
+    settled: "Settled on-chain",
+    timed_out: "Refunded on-chain",
+  });
+
+const TERMINAL_RFQ_STATES: ReadonlySet<RfqLifecycleState> = new Set([
+  "settled",
+  "refunded",
+  "cancelled",
+  "refused",
+  "quarantined",
+  "reorged",
+  "expired",
+]);
+
+const PREVIEW_MAX_CHARS = 160;
+
+function nowSeconds(): number {
+  return Math.floor(Date.now() / 1_000);
+}
+
+function canonical(address: string | undefined): string | null {
+  if (!address) return null;
+  try {
+    return canonicalizeStarknetAddress(address);
+  } catch {
+    return null;
+  }
+}
+
+function collapse(text: string): string {
+  return sanitizeUntrustedText(text).replace(/\s+/g, " ").trim();
+}
+
+function amountLabel(value: {
+  token: { symbol: string; decimals: number };
+  amount: string;
+}): string {
+  const symbol = collapse(value.token.symbol) || "token";
+  try {
+    return `${formatBaseUnits(value.amount, value.token.decimals)} ${symbol}`;
+  } catch {
+    return `${value.amount} base units ${symbol}`;
+  }
+}
+
+export function contactDisplayName(contact: ChatContact): string {
+  return contact.label ?? shortenFelt(contact.address);
+}
+
+export function offerRecord(
+  offer: OfferPayload,
+  deal: DealRecord | undefined,
+  own: boolean,
+  now = nowSeconds(),
+): ChatRecord {
+  const status = deal?.status ?? "offered";
+  const expired = status === "expired" || offerIsExpired(offer, now);
+  const label =
+    status === "offered" && expired ? DEAL_STATUS.expired : DEAL_STATUS[status];
+  const open = !expired && (status === "offered" || status === "accepted");
+  const unverifiedClaim = Boolean(
+    deal?.counterpartyAcceptClaim || deal?.counterpartyReceiptClaim,
+  );
+  let needsAction: string | null = null;
+  if (!own && status === "offered" && !expired) {
+    needsAction = "Accept or decline this offer in Mailbox.";
+  } else if (
+    !own &&
+    status === "accepted" &&
+    deal?.settlementVerified &&
+    !deal.receipt
+  ) {
+    needsAction = "Post the receipt for this accepted offer in Mailbox.";
+  } else if (own && unverifiedClaim && !deal?.settlementVerified) {
+    needsAction =
+      "A counterparty claims to have settled this offer. Verify the transfer before releasing anything.";
+  }
+  const tone: ChatRecordTone =
+    status === "offered" && !expired
+      ? "accent"
+      : status === "accepted" || status === "closed"
+        ? "live"
+        : "muted";
+  return {
+    id: `deal:${offer.dealId}`,
+    facts: {
+      kind: "offer",
+      title: "Offer",
+      terms: `${amountLabel(offer.give)} for ${amountLabel(offer.want)}`,
+      status: unverifiedClaim && !deal?.settlementVerified
+        ? `${label} · unverified claim`
+        : label,
+      tone,
+      open,
+      expiresAt: offer.expiresAt,
+    },
+    needsAction,
+    offer,
+    ...(deal ? { deal } : {}),
+  };
+}
+
+export function invoiceRecord(
+  request: PaymentRequestPayload,
+  payment: PaymentRecord | undefined,
+  own: boolean,
+  now = nowSeconds(),
+): ChatRecord {
+  const status = payment?.status ?? "requested";
+  const expired =
+    status === "expired" || paymentRequestIsExpired(request, now);
+  const operation = payment?.paymentOperation?.state;
+  const inProgress =
+    operation === "awaiting-note-maturity" ||
+    operation === "reserved" ||
+    operation === "submitted";
+  const label =
+    status === "paid"
+      ? payment?.paymentVerified
+        ? "Paid · verified locally"
+        : "Paid · unverified claim"
+      : expired
+        ? PAYMENT_STATUS.expired
+        : operation === "awaiting-note-maturity"
+          ? "Paying · awaiting note maturity"
+          : inProgress
+            ? "Payment in progress"
+            : own
+              ? PAYMENT_STATUS.requested
+              : "Payment requested from you";
+  const open = !expired && status === "requested";
+  let needsAction: string | null = null;
+  if (!own && open && !inProgress) {
+    needsAction = "Pay this request in Mailbox after verifying the requester.";
+  } else if (
+    own &&
+    payment?.counterpartyPaymentClaim &&
+    !payment.paymentVerified
+  ) {
+    needsAction =
+      "A counterparty claims to have paid this request. Verify the transfer before treating it as settled.";
+  }
+  const memo = request.memo ? collapse(request.memo).slice(0, 80) : "";
+  return {
+    id: `payment:${request.requestId}`,
+    facts: {
+      kind: "invoice",
+      title: "Invoice",
+      terms: memo ? `${amountLabel(request)} · ${memo}` : amountLabel(request),
+      status: label,
+      tone:
+        status === "paid"
+          ? payment?.paymentVerified
+            ? "live"
+            : "deal"
+          : open
+            ? "accent"
+            : "muted",
+      open,
+      expiresAt: request.expiresAt,
+    },
+    needsAction,
+    request,
+    ...(payment ? { payment } : {}),
+  };
+}
+
+export function escrowRecord(
+  fund: EscrowFundPayload,
+  escrow: EscrowDealRecord | undefined,
+  own: boolean,
+  now = nowSeconds(),
+): ChatRecord {
+  const status = escrow?.chainStatus;
+  const expired = fund.deadline <= now;
+  const termsVerified = Boolean(
+    escrow?.chainDeal &&
+      escrow.chainDeal.status !== "empty" &&
+      contractDealMatchesFund(escrow.chainDeal, fund),
+  );
+  const label = status ? ESCROW_STATUS[status] : "Contract state not read yet";
+  const open = status === undefined || status === "funded" || status === "filled";
+  let needsAction: string | null = null;
+  if (!own && status === "funded" && termsVerified && !expired) {
+    needsAction = "Deposit leg B in Mailbox to receive leg A.";
+  } else if (own && status === "filled") {
+    needsAction = "Claim leg B in Mailbox.";
+  } else if (own && status === "funded" && expired) {
+    needsAction = "The fill deadline passed. Refund leg A in Mailbox.";
+  }
+  return {
+    id: `escrow:${fund.dealId}`,
+    facts: {
+      kind: "escrow",
+      title: "Escrow",
+      terms: `${amountLabel(fund.legA)} against ${amountLabel(fund.legB)}`,
+      status: expired && status === "funded" ? `${label} · deadline passed` : label,
+      tone:
+        status === "settled"
+          ? "live"
+          : status === "funded" || status === "filled"
+            ? "accent"
+            : status === undefined
+              ? "deal"
+              : "muted",
+      open,
+      expiresAt: fund.deadline,
+    },
+    needsAction,
+    fund,
+    ...(escrow ? { escrow } : {}),
+    escrowTermsVerified: termsVerified,
+  };
+}
+
+function receiptRecord(
+  receipt: ReceiptPayload,
+  own: boolean,
+  standalonePayment: boolean,
+): ChatRecord {
+  return {
+    id: `receipt:${receipt.dealId}:${receipt.txHash}`,
+    facts: {
+      kind: "payment",
+      title: standalonePayment ? "Private payment" : "Transfer claim",
+      terms: amountLabel(receipt.transfer),
+      status: own ? "Submitted from this device" : "Unverified counterparty claim",
+      tone: own ? "live" : "deal",
+      open: false,
+      expiresAt: 0,
+    },
+    needsAction: null,
+    receipt,
+    receiptKind: standalonePayment ? "payment" : "transfer",
+  };
+}
+
+type PartialItem = Omit<ChatItem, "contact" | "otherRecipients">;
+
+function baseItem(
+  message: LocalMailMessage,
+  provenance: ChatItemProvenance,
+  direction: "incoming" | "outgoing",
+): Pick<ChatItem, "id" | "at" | "provenance" | "direction" | "message"> {
+  return {
+    id: message.id,
+    at: mailMessageTimestampMs(message),
+    provenance,
+    direction,
+    message,
+  };
+}
+
+function recordsPreview(records: readonly ChatRecord[]): string {
+  return records
+    .map((record) => `${record.facts.title}: ${record.facts.terms}`)
+    .join(" · ");
+}
+
+function firstAction(records: readonly ChatRecord[]): string | null {
+  return records.find((record) => record.needsAction)?.needsAction ?? null;
+}
+
+function unsupportedItem(
+  message: LocalMailMessage,
+  direction: "incoming" | "outgoing",
+): PartialItem {
+  return {
+    ...baseItem(message, "device-sent", direction),
+    kind: "unsupported",
+    label: "Unsupported",
+    preview: "This record could not be read",
+    body: "",
+    needsAction: null,
+    records: [],
+  };
+}
+
+/** A device-local Sent copy, read as one outgoing chat item. */
+export function sentItemFor(
+  message: LocalMailMessage,
+  input: Pick<ChatModelInput, "otc" | "escrow">,
+  now = nowSeconds(),
+): PartialItem {
+  const { envelope } = message;
+  const base = baseItem(message, "device-sent", "outgoing");
+  const payload = envelope.type === "unsupported" ? null : envelope.payload;
+  switch (envelope.type) {
+    case "text": {
+      const body = sanitizeUntrustedText(message.plaintext);
+      return {
+        ...base,
+        kind: "letter",
+        label: "Letter",
+        preview: collapse(body).slice(0, PREVIEW_MAX_CHARS) || "Empty letter",
+        body,
+        needsAction: null,
+        records: [],
+      };
+    }
+    case "composite": {
+      const composite = parseCompositePayload(payload);
+      if (!composite) return unsupportedItem(message, "outgoing");
+      const records = composite.attachments.map((attachment) => {
+        switch (attachment.type) {
+          case "offer":
+            return offerRecord(
+              attachment.payload,
+              input.otc.deals[attachment.payload.dealId],
+              true,
+              now,
+            );
+          case "payment_request":
+            return invoiceRecord(
+              attachment.payload,
+              input.otc.payments[attachment.payload.requestId],
+              true,
+              now,
+            );
+          case "escrow_fund":
+            return escrowRecord(
+              attachment.payload,
+              input.escrow.deals[attachment.payload.dealId],
+              true,
+              now,
+            );
+          default:
+            return receiptRecord(
+              {
+                dealId: attachment.payload.dealId,
+                txHash: message.transactionHash,
+                transfer: attachment.payload.transfer,
+                warning: ONE_SIDED_WARNING,
+              },
+              true,
+              true,
+            );
+        }
+      });
+      const body = composite.body;
+      const preview = collapse(body).slice(0, PREVIEW_MAX_CHARS);
+      return {
+        ...base,
+        kind: records.length ? "document" : "letter",
+        label: records.length ? "Document" : "Letter",
+        preview: preview || recordsPreview(records) || "Empty letter",
+        body,
+        needsAction: firstAction(records),
+        records,
+      };
+    }
+    case "offer": {
+      const offer = parseOfferPayload(payload);
+      if (!offer) return unsupportedItem(message, "outgoing");
+      const record = offerRecord(offer, input.otc.deals[offer.dealId], true, now);
+      return {
+        ...base,
+        kind: "offer",
+        label: "Offer",
+        preview: record.facts.terms,
+        body: "",
+        needsAction: record.needsAction,
+        records: [record],
+      };
+    }
+    case "payment_request": {
+      const request = parsePaymentRequestPayload(payload);
+      if (!request) return unsupportedItem(message, "outgoing");
+      const record = invoiceRecord(
+        request,
+        input.otc.payments[request.requestId],
+        true,
+        now,
+      );
+      return {
+        ...base,
+        kind: "invoice",
+        label: "Invoice",
+        preview: record.facts.terms,
+        body: "",
+        needsAction: record.needsAction,
+        records: [record],
+      };
+    }
+    case "escrow_fund": {
+      const fund = parseEscrowFundPayload(payload);
+      if (!fund) return unsupportedItem(message, "outgoing");
+      const record = escrowRecord(fund, input.escrow.deals[fund.dealId], true, now);
+      return {
+        ...base,
+        kind: "escrow",
+        label: "Escrow",
+        preview: record.facts.terms,
+        body: "",
+        needsAction: record.needsAction,
+        records: [record],
+      };
+    }
+    case "accept": {
+      const accept = parseAcceptPayload(payload);
+      if (!accept) return unsupportedItem(message, "outgoing");
+      return {
+        ...base,
+        kind: "memo",
+        label: "Memo",
+        preview: `${amountLabel(accept.transfer)} sent to settle ${accept.dealId.slice(0, 10)}…`,
+        body: "",
+        needsAction: null,
+        records: [],
+      };
+    }
+    case "receipt": {
+      const receipt = parseReceiptPayload(payload);
+      if (!receipt) return unsupportedItem(message, "outgoing");
+      const record = receiptRecord(receipt, true, false);
+      return {
+        ...base,
+        kind: "receipt",
+        label: "Receipt",
+        preview: `Receipt for ${record.facts.terms}`,
+        body: "",
+        needsAction: null,
+        records: [record],
+      };
+    }
+    case "decline": {
+      const decline = parseDeclinePayload(payload);
+      if (!decline) return unsupportedItem(message, "outgoing");
+      return {
+        ...base,
+        kind: "decline",
+        label: "Declined",
+        preview: decline.reason ? collapse(decline.reason) : "Offer declined",
+        body: decline.reason ? sanitizeUntrustedText(decline.reason) : "",
+        needsAction: null,
+        records: [],
+      };
+    }
+    case "escrow_fill":
+    case "escrow_claim":
+    case "escrow_timeout": {
+      const update =
+        envelope.type === "escrow_fill"
+          ? parseEscrowFillPayload(payload)
+          : envelope.type === "escrow_claim"
+            ? parseEscrowClaimPayload(payload)
+            : parseEscrowTimeoutPayload(payload);
+      if (!update) return unsupportedItem(message, "outgoing");
+      const operation = envelope.type.slice("escrow_".length);
+      return {
+        ...base,
+        kind: "memo",
+        label: "Escrow notice",
+        preview: `Escrow ${operation} notice for deal ${update.dealId.slice(0, 10)}…`,
+        body: "",
+        needsAction: null,
+        records: [],
+      };
+    }
+    default:
+      return unsupportedItem(message, "outgoing");
+  }
+}
+
+function paymentLinkItem(
+  message: LocalMailMessage,
+  request: PaymentRequestPayload,
+  payment: PaymentRecord | undefined,
+  now: number,
+): PartialItem {
+  const record = invoiceRecord(request, payment, false, now);
+  return {
+    ...baseItem(message, "payment-link", "incoming"),
+    kind: "invoice",
+    label: "Invoice",
+    preview: record.facts.terms,
+    body: "",
+    needsAction: record.needsAction,
+    records: [record],
+  };
+}
+
+function recordItem(
+  id: string,
+  record: ChatRecord,
+  kind: ChatItemKind,
+  label: string,
+  at: number | undefined,
+): PartialItem {
+  return {
+    id,
+    at,
+    provenance: "mailbox-record",
+    direction: "incoming",
+    kind,
+    label,
+    preview: record.facts.terms,
+    body: "",
+    needsAction: record.needsAction,
+    records: [record],
+  };
+}
+
+function compareItems(left: ChatItem, right: ChatItem): number {
+  const difference = (left.at ?? 0) - (right.at ?? 0);
+  if (difference) return difference;
+  return left.id < right.id ? -1 : left.id > right.id ? 1 : 0;
+}
+
+function contactFor(
+  address: string,
+  addressBook: readonly AddressBookEntry[],
+  aliases: readonly AliasRecord[],
+): ChatContact {
+  const entry = addressBook.find((candidate) =>
+    feltEquals(candidate.address, address),
+  );
+  if (entry) {
+    return {
+      address,
+      label: entry.label,
+      nameSource: "address-book",
+      saved: true,
+    };
+  }
+  const alias = findAliasByAddress(aliases, address);
+  if (alias) {
+    return { address, label: alias.label, nameSource: "alias", saved: false };
+  }
+  return { address, label: null, nameSource: "none", saved: false };
+}
+
+function compareConversations(
+  left: ChatConversation,
+  right: ChatConversation,
+): number {
+  const leftAt = left.latest?.at ?? -1;
+  const rightAt = right.latest?.at ?? -1;
+  if (leftAt !== rightAt) return rightAt - leftAt;
+  const leftName = contactDisplayName(left.contact).toLowerCase();
+  const rightName = contactDisplayName(right.contact).toLowerCase();
+  return leftName < rightName ? -1 : leftName > rightName ? 1 : 0;
+}
+
+export function buildChatModel(input: ChatModelInput): ChatModel {
+  const self = canonical(input.selfAddress);
+  const now = input.now ?? nowSeconds();
+  const itemsByContact = new Map<string, ChatItem[]>();
+  const push = (contact: string, item: ChatItem) => {
+    const existing = itemsByContact.get(contact);
+    if (existing) existing.push(item);
+    else itemsByContact.set(contact, [item]);
+  };
+
+  const sentDealIds = new Set<string>();
+  const sentRequestIds = new Set<string>();
+  const sentEscrowIds = new Set<string>();
+  let unattributedSent = 0;
+
+  for (const message of input.sent) {
+    const partial = sentItemFor(message, input, now);
+    for (const record of partial.records) {
+      if (record.offer) sentDealIds.add(record.offer.dealId);
+      if (record.request) sentRequestIds.add(record.request.requestId);
+      if (record.fund) sentEscrowIds.add(record.fund.dealId);
+    }
+    const stored = message.recipients ?? [];
+    const recipients = [
+      ...new Set(
+        stored
+          .map(canonical)
+          .filter((address): address is string => address !== null),
+      ),
+    ].filter((address) => !self || !feltEquals(address, self));
+    if (!recipients.length) {
+      // Self-mail (backups, self-tests) is Mailbox's business; a copy with no
+      // stored recipient at all is counted so the rail can say so.
+      if (stored.length === 0) unattributedSent += 1;
+      continue;
+    }
+    for (const recipient of recipients) {
+      push(recipient, {
+        ...partial,
+        contact: recipient,
+        otherRecipients: recipients.length - 1,
+      });
+    }
+  }
+
+  for (const message of input.paymentLinks) {
+    if (message.envelope.type !== "payment_request") continue;
+    const request = parsePaymentRequestPayload(message.envelope.payload);
+    if (!request) continue;
+    const requester = canonical(request.requester);
+    if (!requester || (self && feltEquals(requester, self))) continue;
+    push(requester, {
+      ...paymentLinkItem(
+        message,
+        request,
+        input.otc.payments[request.requestId],
+        now,
+      ),
+      contact: requester,
+      otherRecipients: 0,
+    });
+  }
+
+  for (const deal of Object.values(input.otc.deals)) {
+    if (sentDealIds.has(deal.dealId)) continue;
+    const offerer = canonical(deal.offer.offerer);
+    if (!offerer || (self && feltEquals(offerer, self))) continue;
+    const record = offerRecord(deal.offer, deal, false, now);
+    push(offerer, {
+      ...recordItem(
+        `record:${record.id}`,
+        record,
+        "offer",
+        "Offer",
+        deal.updatedAt * 1_000,
+      ),
+      contact: offerer,
+      otherRecipients: 0,
+    });
+  }
+
+  for (const payment of Object.values(input.otc.payments)) {
+    if (sentRequestIds.has(payment.requestId)) continue;
+    if (payment.origin === "payment_link") continue;
+    const requester = canonical(payment.request.requester);
+    if (!requester || (self && feltEquals(requester, self))) continue;
+    const record = invoiceRecord(payment.request, payment, false, now);
+    push(requester, {
+      ...recordItem(
+        `record:${record.id}`,
+        record,
+        "invoice",
+        "Invoice",
+        payment.updatedAt * 1_000,
+      ),
+      contact: requester,
+      otherRecipients: 0,
+    });
+  }
+
+  for (const escrow of Object.values(input.escrow.deals)) {
+    if (sentEscrowIds.has(escrow.dealId)) continue;
+    const maker = canonical(escrow.fund.maker);
+    if (!maker || (self && feltEquals(maker, self))) continue;
+    const record = escrowRecord(escrow.fund, escrow, false, now);
+    push(maker, {
+      ...recordItem(
+        `record:${record.id}`,
+        record,
+        "escrow",
+        "Escrow",
+        escrow.updatedAt * 1_000,
+      ),
+      contact: maker,
+      otherRecipients: 0,
+    });
+  }
+
+  const contacts = new Set(itemsByContact.keys());
+  for (const entry of input.addressBook) {
+    const address = canonical(entry.address);
+    if (address && (!self || !feltEquals(address, self))) contacts.add(address);
+  }
+
+  const conversations: ChatConversation[] = [];
+  for (const address of contacts) {
+    const items = (itemsByContact.get(address) ?? []).slice().sort(compareItems);
+    const unreadCount = items.filter(
+      (item) => item.direction === "incoming" && !input.readIds.has(item.id),
+    ).length;
+    conversations.push({
+      contact: contactFor(address, input.addressBook, input.aliases),
+      items,
+      latest: items.length ? items[items.length - 1] : null,
+      unreadCount,
+      needsAction: items.some((item) => item.needsAction !== null),
+    });
+  }
+  conversations.sort(compareConversations);
+  return { conversations, unattributedSent };
+}
+
+function conversationHaystack(conversation: ChatConversation): string {
+  return [
+    conversation.contact.label ?? "",
+    conversation.contact.address,
+    ...conversation.items.flatMap((item) => [
+      item.label,
+      item.preview,
+      ...item.records.map(
+        (record) => `${record.facts.title} ${record.facts.status}`,
+      ),
+    ]),
+  ]
+    .join("\n")
+    .toLowerCase();
+}
+
+/** Search reads only what this device already holds; nothing leaves the browser. */
+export function filterConversations(
+  conversations: readonly ChatConversation[],
+  filter: ChatConversationFilter,
+): ChatConversation[] {
+  const needle = filter.search?.trim().toLowerCase() ?? "";
+  return conversations.filter((conversation) => {
+    if (filter.needsActionOnly && !conversation.needsAction) return false;
+    if (!needle) return true;
+    return conversationHaystack(conversation).includes(needle);
+  });
+}
+
+/** Whether a workspace RFQ names this contact as one of its makers. */
+export function rfqNamesContact(
+  record: Pick<RfqLifecycleRecord, "selectedQuote" | "fills">,
+  contact: ChatContact,
+): boolean {
+  const makerIds = [
+    record.selectedQuote?.solverId,
+    ...(record.fills ?? []).map((fill) => fill.makerId),
+  ].filter((value): value is string => typeof value === "string" && value !== "");
+  if (!makerIds.length) return false;
+  const label = contact.label?.trim().toLowerCase();
+  return makerIds.some(
+    (makerId) =>
+      (label !== undefined && label !== "" && makerId.toLowerCase() === label) ||
+      feltEquals(makerId, contact.address),
+  );
+}
+
+function rfqEntry(record: RfqLifecycleRecord): ChatContextEntry {
+  const terms = record.terms
+    ? `${amountLabel({
+        token: { symbol: record.terms.sellSymbol, decimals: record.terms.sellDecimals },
+        amount: record.terms.sellAmount,
+      })} → ${collapse(record.terms.buySymbol)}`
+    : "Terms not stored";
+  const open = !TERMINAL_RFQ_STATES.has(record.state);
+  return {
+    id: `rfq:${record.rfqId}`,
+    section: "rfq",
+    title: record.mode === "v3" ? "Workspace RFQ v3" : "Workspace RFQ",
+    terms,
+    status: rfqStateLabel(record.state, record.mode),
+    tone: open ? "accent" : "muted",
+    open,
+    direction: "workspace",
+    rfq: record,
+  };
+}
+
+function recordEntry(
+  section: ChatContextSection,
+  item: ChatItem,
+  record: ChatRecord,
+): ChatContextEntry {
+  return {
+    id: `${item.id}/${record.id}`,
+    section,
+    title: record.facts.title,
+    terms: record.facts.terms,
+    status: record.facts.status,
+    tone: record.facts.tone,
+    open: record.facts.open,
+    direction: item.direction,
+    itemId: item.id,
+    record,
+  };
+}
+
+function openFirst(entries: ChatContextEntry[]): ChatContextEntry[] {
+  return entries.sort((left, right) => Number(right.open) - Number(left.open));
+}
+
+/**
+ * What the right rail says about one contact: open bilateral offers and any
+ * workspace RFQ that names them, payments still pending, and every escrow.
+ * Workspace RFQs are multi-maker requests; they stay in the RFQ workspace and
+ * are only mirrored here when a maker id matches this contact.
+ */
+export function buildContactContext(
+  conversation: ChatConversation,
+  rfqRecords: readonly RfqLifecycleRecord[] = [],
+): ChatContactContext {
+  const rfqs: ChatContextEntry[] = [];
+  const payments: ChatContextEntry[] = [];
+  const escrows: ChatContextEntry[] = [];
+  for (const item of conversation.items.slice().reverse()) {
+    for (const record of item.records) {
+      if (record.facts.kind === "offer" && record.facts.open) {
+        rfqs.push(recordEntry("rfq", item, record));
+      } else if (
+        record.facts.kind === "invoice" &&
+        (record.facts.open ||
+          record.payment?.paymentOperation?.state === "awaiting-note-maturity" ||
+          record.payment?.paymentOperation?.state === "submitted" ||
+          record.payment?.paymentOperation?.state === "reserved")
+      ) {
+        payments.push(recordEntry("payment", item, record));
+      } else if (record.facts.kind === "escrow") {
+        escrows.push(recordEntry("escrow", item, record));
+      }
+    }
+  }
+  for (const record of rfqRecords) {
+    if (!rfqNamesContact(record, conversation.contact)) continue;
+    if (TERMINAL_RFQ_STATES.has(record.state)) continue;
+    rfqs.push(rfqEntry(record));
+  }
+  return {
+    rfqs,
+    payments,
+    escrows: openFirst(escrows),
+  };
+}
+
+/** Incoming items in a conversation this device has not opened in Chat yet. */
+export function unreadItemIds(conversation: ChatConversation): string[] {
+  return conversation.items
+    .filter((item) => item.direction === "incoming")
+    .map((item) => item.id);
+}
diff --git a/src/app/chat/chat-send.test.ts b/src/app/chat/chat-send.test.ts
new file mode 100644
index 0000000..80602aa
--- /dev/null
+++ b/src/app/chat/chat-send.test.ts
@@ -0,0 +1,135 @@
+import { describe, expect, it } from "vitest";
+import { decodeEnvelope, encodeEnvelope } from "@/lib/envelope";
+import { deriveKeypair } from "@/lib/mail";
+import { mailboxPublicKeyHex, verifyMailSenderAuth } from "@/lib/mail-auth";
+import {
+  CHAT_LETTER_MAX_CHARS,
+  buildChatLetter,
+  chatLetterBudget,
+  chatSendBlocker,
+  previewChatLetterBudget,
+} from "./chat-send";
+
+const SEED = Uint8Array.from({ length: 32 }, (_, index) => index + 1);
+const DOCUMENT = `0x${"ab".repeat(32)}`;
+const CONVERSATION = `0x${"cd".repeat(32)}`;
+
+const READY = {
+  helperAddress: "0x123",
+  networkName: "LOCALNET (DEV)",
+  connected: true,
+  hasWalletAccount: true,
+  senderAddress: "0xa11ce",
+  isStrk20Capable: true,
+  keyReady: true,
+};
+
+describe("chat send readiness", () => {
+  it("blocks in the same order Mailbox's composer does", () => {
+    expect(chatSendBlocker({ ...READY, helperAddress: null })).toMatchObject({
+      kind: "network",
+      message: expect.stringMatching(/Mail is unavailable on LOCALNET \(DEV\)/),
+    });
+    expect(chatSendBlocker({ ...READY, connected: false })).toMatchObject({
+      kind: "wallet",
+      message: expect.stringMatching(/Connect a privacy-enabled wallet/),
+    });
+    expect(chatSendBlocker({ ...READY, hasWalletAccount: false })?.kind).toBe(
+      "wallet",
+    );
+    expect(chatSendBlocker({ ...READY, isStrk20Capable: false })).toMatchObject({
+      kind: "capability",
+      message: expect.stringMatching(/STRK20 Wallet API/),
+    });
+    expect(chatSendBlocker({ ...READY, keyReady: false })).toMatchObject({
+      kind: "key",
+      message: expect.stringMatching(/mail key/),
+    });
+    expect(chatSendBlocker(READY)).toBeNull();
+  });
+});
+
+describe("chat letter", () => {
+  it("builds a signed text envelope Mailbox can decode and verify", () => {
+    const letter = buildChatLetter({
+      body: "Hello from the desk",
+      documentId: DOCUMENT,
+      conversationId: CONVERSATION,
+      inReplyTo: "",
+      mailSeed: SEED,
+    });
+    expect(letter.type).toBe("text");
+    expect(letter.documentId).toBe(DOCUMENT);
+    expect(letter.payload).toMatchObject({
+      body: "Hello from the desk",
+      documentId: DOCUMENT,
+      conversationId: CONVERSATION,
+    });
+    expect(letter.payload).not.toHaveProperty("inReplyTo");
+    const decoded = decodeEnvelope(encodeEnvelope(letter.type, letter.payload));
+    expect(decoded.type).toBe("text");
+    const senderAuth = (
+      decoded as { payload: { senderAuth: Parameters<typeof verifyMailSenderAuth>[0] } }
+    ).payload.senderAuth;
+    expect(senderAuth.mailboxPublicKey).toBe(
+      mailboxPublicKeyHex(deriveKeypair(SEED).publicKey),
+    );
+    expect(
+      verifyMailSenderAuth(senderAuth, {
+        documentId: DOCUMENT,
+        conversationId: CONVERSATION,
+        inReplyTo: "",
+        body: "Hello from the desk",
+      }),
+    ).toBe(true);
+    expect(
+      verifyMailSenderAuth(senderAuth, {
+        documentId: DOCUMENT,
+        conversationId: CONVERSATION,
+        inReplyTo: "",
+        body: "Hello from the desk!",
+      }),
+    ).toBe(false);
+  });
+
+  it("threads a reply and stays unsigned without a mailbox seed", () => {
+    const letter = buildChatLetter({
+      body: "Re: terms",
+      documentId: DOCUMENT,
+      conversationId: CONVERSATION,
+      inReplyTo: `0x${"ef".repeat(32)}`,
+    });
+    expect(letter.payload).toMatchObject({ inReplyTo: `0x${"ef".repeat(32)}` });
+    expect(letter.payload).not.toHaveProperty("senderAuth");
+  });
+
+  it("mints ids when none are supplied and refuses empty or oversized bodies", () => {
+    const letter = buildChatLetter({ body: "ok" });
+    expect(letter.documentId).toMatch(/^0x[0-9a-f]{64}$/);
+    expect(letter.conversationId).toMatch(/^0x[0-9a-f]{64}$/);
+    expect(letter.documentId).not.toBe(letter.conversationId);
+    expect(() => buildChatLetter({ body: "   " })).toThrow(/Write a message/);
+    expect(() =>
+      buildChatLetter({ body: "x".repeat(CHAT_LETTER_MAX_CHARS + 1) }),
+    ).toThrow(/characters/);
+  });
+
+  it("projects the same ciphertext budget for the stand-in and the real signature", () => {
+    const body = "A short letter about a quote.";
+    const preview = previewChatLetterBudget(body, true);
+    const real = chatLetterBudget(
+      buildChatLetter({
+        body,
+        documentId: DOCUMENT,
+        conversationId: CONVERSATION,
+        mailSeed: SEED,
+      }),
+    );
+    expect(preview.plaintextBytes).toBe(real.plaintextBytes);
+    expect(preview.fits).toBe(true);
+    expect(previewChatLetterBudget(body, false).plaintextBytes).toBeLessThan(
+      preview.plaintextBytes,
+    );
+    expect(previewChatLetterBudget("y".repeat(4_000), true).fits).toBe(false);
+  });
+});
diff --git a/src/app/chat/chat-send.ts b/src/app/chat/chat-send.ts
new file mode 100644
index 0000000..9379a04
--- /dev/null
+++ b/src/app/chat/chat-send.ts
@@ -0,0 +1,365 @@
+import type { WalletWithStarknetFeatures } from "@starknet-io/get-starknet-wallet-standard/features";
+import { validateAndParseAddress } from "starknet";
+import type { ProviderInterface, WalletAccountV6 } from "starknet";
+import { feltEquals } from "@/lib/addresses";
+import { MAX_COMPOSITE_BODY_CHARS } from "@/lib/composite";
+import { encodeEnvelope, envelopeByteLength } from "@/lib/envelope";
+import {
+  deriveKeypair,
+  encryptMailForRecipients,
+  projectEncryptedMailSize,
+  publicKeyFromFelts,
+  type MailKeypair,
+} from "@/lib/mail";
+import { createMailSenderAuth, type MailSenderAuth } from "@/lib/mail-auth";
+import { randomConversationId } from "@/lib/mail-thread";
+import { saveSentMail, type StoredSentMail } from "@/lib/sent-mail";
+import {
+  APP20_HELPER_FUNDING_BASE_UNITS,
+  assertPrivateStrk20BatchBalance,
+  computeActionId,
+  strk20ErrorMessage,
+  submitMail,
+  transactionHashFromError,
+} from "@/lib/strk20";
+import { assertWalletOperationPolicy } from "@/lib/wallet-policy";
+import { addrSTRK } from "@/utils/constants";
+
+/**
+ * The chat composer sends exactly what Mailbox's Compose sends for a body-only
+ * document: one encrypted `text` envelope to one registered mailbox, funded by
+ * the same fixed helper deposit, through the same wallet policy. Every step
+ * below is the Compose step it mirrors; Chat never gets a looser path.
+ */
+
+export const CHAT_LETTER_MAX_CHARS = MAX_COMPOSITE_BODY_CHARS;
+
+const ZERO_ID = `0x${"0".repeat(64)}`;
+
+/** Length-stable stand-in used only for the live ciphertext budget. */
+const PREVIEW_SENDER_AUTH: MailSenderAuth = {
+  version: 1,
+  mailboxPublicKey: "0".repeat(64),
+  authPublicKey: "0".repeat(64),
+  signature: "0".repeat(128),
+};
+
+export type ChatSendReadiness = Readonly<{
+  helperAddress: string | null;
+  networkName: string;
+  connected: boolean;
+  hasWalletAccount: boolean;
+  senderAddress: string;
+  isStrk20Capable: boolean;
+  keyReady: boolean;
+}>;
+
+export type ChatSendBlocker = Readonly<{
+  kind: "network" | "wallet" | "capability" | "key";
+  message: string;
+}>;
+
+/** The same reasons, in the same order, that disable Send in Mailbox. */
+export function chatSendBlocker(
+  readiness: ChatSendReadiness,
+): ChatSendBlocker | null {
+  if (!readiness.helperAddress) {
+    return {
+      kind: "network",
+      message: `Mail is unavailable on ${readiness.networkName} in this deployment. Switch network or try again later.`,
+    };
+  }
+  if (
+    !readiness.connected ||
+    !readiness.hasWalletAccount ||
+    !readiness.senderAddress
+  ) {
+    return {
+      kind: "wallet",
+      message: "Connect a privacy-enabled wallet before sending mail.",
+    };
+  }
+  if (!readiness.isStrk20Capable) {
+    return {
+      kind: "capability",
+      message:
+        "This wallet does not expose the dapp-facing STRK20 Wallet API Mail requires. See the wallet capability diagnostic.",
+    };
+  }
+  if (!readiness.keyReady) {
+    return {
+      kind: "key",
+      message: "Load this device's mail key before sending.",
+    };
+  }
+  return null;
+}
+
+export type ChatLetter = Readonly<{
+  type: "text";
+  payload: Readonly<Record<string, unknown>>;
+  documentId: string;
+  conversationId: string;
+}>;
+
+export function buildChatLetter(input: {
+  body: string;
+  documentId?: string;
+  conversationId?: string;
+  inReplyTo?: string;
+  mailSeed?: Uint8Array | null;
+  keypair?: MailKeypair | null;
+}): ChatLetter {
+  const { body } = input;
+  if (!body.trim()) throw new Error("Write a message before sending.");
+  if (body.length > CHAT_LETTER_MAX_CHARS) {
+    throw new Error(
+      `Letters stay under ${CHAT_LETTER_MAX_CHARS + 1} characters.`,
+    );
+  }
+  const documentId = input.documentId ?? randomConversationId();
+  const conversationId = input.conversationId ?? randomConversationId();
+  const inReplyTo = input.inReplyTo ?? "";
+  let senderAuth: MailSenderAuth | undefined;
+  if (input.mailSeed) {
+    const keypair = input.keypair ?? deriveKeypair(input.mailSeed);
+    senderAuth = createMailSenderAuth(input.mailSeed, keypair.publicKey, {
+      documentId,
+      conversationId,
+      inReplyTo,
+      body,
+    });
+  }
+  return {
+    type: "text",
+    documentId,
+    conversationId,
+    payload: {
+      body,
+      documentId,
+      conversationId,
+      ...(inReplyTo ? { inReplyTo } : {}),
+      ...(senderAuth ? { senderAuth } : {}),
+    },
+  };
+}
+
+export type ChatLetterBudget = Readonly<{
+  plaintextBytes: number;
+  maxPlaintextBytes: number;
+  ciphertextFelts: number;
+  maxCiphertextFelts: number;
+  fits: boolean;
+}>;
+
+export function chatLetterBudget(letter: ChatLetter): ChatLetterBudget {
+  const plaintextBytes = envelopeByteLength(letter.type, letter.payload);
+  const size = projectEncryptedMailSize(plaintextBytes, 1);
+  return {
+    plaintextBytes,
+    maxPlaintextBytes: size.maxPlaintextBytes,
+    ciphertextFelts: size.ciphertextFelts,
+    maxCiphertextFelts: size.maxCiphertextFelts,
+    fits: size.fits,
+  };
+}
+
+/** Budget for a body as it is typed, without signing on every keystroke. */
+export function previewChatLetterBudget(
+  body: string,
+  signed: boolean,
+  inReplyTo = "",
+): ChatLetterBudget {
+  return chatLetterBudget({
+    type: "text",
+    documentId: ZERO_ID,
+    conversationId: ZERO_ID,
+    payload: {
+      body,
+      documentId: ZERO_ID,
+      conversationId: ZERO_ID,
+      ...(inReplyTo ? { inReplyTo } : {}),
+      ...(signed ? { senderAuth: PREVIEW_SENDER_AUTH } : {}),
+    },
+  });
+}
+
+export type ChatSendPhase =
+  | "checking"
+  | "lookup"
+  | "encrypting"
+  | "proving"
+  | "submitted";
+
+export type ChatSendContext = Readonly<{
+  providerIndex: number;
+  provider: ProviderInterface;
+  helperAddress: string;
+  walletAccount: WalletAccountV6;
+  selectedWallet: WalletWithStarknetFeatures;
+  senderAddress: string;
+  chainId: string;
+  mailSeed: Uint8Array;
+  keypair: MailKeypair;
+}>;
+
+export type ChatSendInput = Readonly<{
+  recipient: string;
+  body: string;
+  conversationId?: string;
+  inReplyTo?: string;
+  context: ChatSendContext;
+  storage: Pick<Storage, "getItem" | "setItem">;
+  onPhase?: (phase: ChatSendPhase, detail: string) => void;
+  now?: () => number;
+}>;
+
+export type ChatSendResult = Readonly<{
+  sent: StoredSentMail;
+  transactionHash: string;
+  /** False when the chain confirmed the letter but browser storage refused the copy. */
+  localCopySaved: boolean;
+  localCopyError?: string;
+}>;
+
+export class ChatSendError extends Error {
+  readonly submittedTransactionHash: string | undefined;
+
+  constructor(message: string, submittedTransactionHash?: string) {
+    super(message);
+    this.name = "ChatSendError";
+    this.submittedTransactionHash = submittedTransactionHash;
+  }
+}
+
+export async function sendChatLetter(
+  input: ChatSendInput,
+): Promise<ChatSendResult> {
+  const { context } = input;
+  let recipient: string;
+  try {
+    recipient = validateAndParseAddress(input.recipient);
+  } catch {
+    throw new ChatSendError("The counterparty address is not a valid Starknet address.");
+  }
+  if (feltEquals(recipient, context.senderAddress)) {
+    throw new ChatSendError(
+      "This is your own mailbox. Self-addressed backups are posted from Mailbox.",
+    );
+  }
+  let letter: ChatLetter;
+  try {
+    letter = buildChatLetter({
+      body: input.body,
+      conversationId: input.conversationId,
+      inReplyTo: input.inReplyTo,
+      mailSeed: context.mailSeed,
+      keypair: context.keypair,
+    });
+  } catch (error: unknown) {
+    throw new ChatSendError(
+      error instanceof Error ? error.message : "The letter could not be built.",
+    );
+  }
+  const budget = chatLetterBudget(letter);
+  if (!budget.fits) {
+    const excess = budget.plaintextBytes - budget.maxPlaintextBytes;
+    throw new ChatSendError(
+      `This letter would use ${budget.ciphertextFelts} / ${budget.maxCiphertextFelts} ciphertext felts. Remove at least ${excess} encoded byte${excess === 1 ? "" : "s"}. Nothing was submitted.`,
+    );
+  }
+  const encoded = encodeEnvelope(letter.type, letter.payload);
+  const policy = () =>
+    assertWalletOperationPolicy(
+      context.selectedWallet,
+      context.providerIndex as 0 | 2 | 3,
+      "mail",
+    );
+
+  let submittedHash: string | undefined;
+  try {
+    policy();
+    input.onPhase?.("checking", "Checking private STRK for mail-helper funding…");
+    await assertPrivateStrk20BatchBalance(context.walletAccount, addrSTRK, [
+      APP20_HELPER_FUNDING_BASE_UNITS,
+    ]);
+
+    input.onPhase?.("lookup", "Looking up the counterparty's registered mail key…");
+    const registered = await context.provider.callContract({
+      contractAddress: context.helperAddress,
+      entrypoint: "get_pubkey",
+      calldata: [recipient],
+    });
+    if (
+      registered.length !== 2 ||
+      (BigInt(registered[0]) === 0n && BigInt(registered[1]) === 0n)
+    ) {
+      throw new Error("The counterparty has not registered a mail public key.");
+    }
+    const recipientKey = publicKeyFromFelts(registered);
+
+    input.onPhase?.("encrypting", "Sealing the letter on this device…");
+    const record = await encryptMailForRecipients([recipientKey], encoded);
+
+    input.onPhase?.("proving", "Waiting for the wallet to prove and submit…");
+    const result = await submitMail(
+      {
+        account: context.walletAccount,
+        provider: context.provider,
+        helperAddress: context.helperAddress,
+        recoveryAddress: context.senderAddress,
+        tokenAddress: addrSTRK,
+        record,
+        actionId: computeActionId("composite-document", letter.documentId),
+        helperFundingAmount: APP20_HELPER_FUNDING_BASE_UNITS,
+        policy,
+      },
+      {
+        onSubmitted: (transactionHash) => {
+          submittedHash = transactionHash;
+          input.onPhase?.(
+            "submitted",
+            `Transaction ${transactionHash} submitted; waiting for confirmation…`,
+          );
+        },
+      },
+    );
+
+    const sent: StoredSentMail = {
+      version: 1,
+      documentId: letter.documentId,
+      type: "text",
+      payload: letter.payload,
+      plaintext: input.body,
+      record,
+      transactionHash: result.transactionHash,
+      transactionHashes: [result.transactionHash],
+      recipientCount: 1,
+      recipients: [recipient],
+      deliveryState: "confirmed",
+      createdAt: (input.now ?? Date.now)(),
+    };
+    try {
+      saveSentMail(input.storage, context.chainId, context.senderAddress, sent);
+    } catch (error: unknown) {
+      return {
+        sent,
+        transactionHash: result.transactionHash,
+        localCopySaved: false,
+        localCopyError:
+          error instanceof Error ? error.message : "Browser storage failed.",
+      };
+    }
+    return { sent, transactionHash: result.transactionHash, localCopySaved: true };
+  } catch (error: unknown) {
+    if (error instanceof ChatSendError) throw error;
+    const base = strk20ErrorMessage(error);
+    const hash = transactionHashFromError(error) ?? submittedHash;
+    throw new ChatSendError(
+      hash
+        ? `${base} Transaction ${hash} was submitted but confirmation was not observed. Its stable action id prevents a duplicate letter; check that transaction before retrying.`
+        : base,
+      hash,
+    );
+  }
+}
diff --git a/src/app/chat/chat.module.css b/src/app/chat/chat.module.css
new file mode 100644
index 0000000..9517cfe
--- /dev/null
+++ b/src/app/chat/chat.module.css
@@ -0,0 +1,1340 @@
+/* ──────────────────────────────────────────────────────────────────────────
+   APP20 Chat
+   Three sheets on one desk: the counterparty rail, the conversation with its
+   composer, and the contact context. Every colour, face and rule comes from
+   the shared shell palette and design-system scale; nothing here redefines
+   a token. The rail and toolbar measurements match the Mailbox rail so the
+   two surfaces line up when a person switches between them.
+   ────────────────────────────────────────────────────────────────────────── */
+
+.page {
+  color-scheme: dark;
+  display: grid;
+  width: 100%;
+  height: calc(100dvh - var(--app-shell-offset, 92px));
+  min-height: 0;
+  grid-template-rows: minmax(0, 1fr);
+  overflow: hidden;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  font-family: var(--font-body), system-ui, sans-serif;
+}
+
+.workspace {
+  display: grid;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  grid-template-columns: 320px minmax(0, 1fr) 330px;
+  overflow: hidden;
+  background: var(--shell-bg);
+}
+
+.workspace > * {
+  min-width: 0;
+  min-height: 0;
+}
+
+.srOnly {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.kicker {
+  color: var(--shell-orange);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+  letter-spacing: var(--track-label-loose, 0.14em);
+  text-transform: uppercase;
+}
+
+/* ── Left: conversations ─────────────────────────────────────────────────── */
+
+.rail {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  border-right: 1px solid var(--shell-line);
+  background: var(--shell-bg);
+}
+
+.railHeading {
+  display: flex;
+  flex: none;
+  min-height: 54px;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-5, 10px);
+  padding: 10px 14px 8px;
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.railHeading h1 {
+  margin-top: 2px;
+  font-size: var(--text-lg, 16px);
+  font-weight: 800;
+  letter-spacing: -0.03em;
+}
+
+.railCount {
+  display: grid;
+  width: 32px;
+  height: 32px;
+  flex: none;
+  place-items: center;
+  border: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+}
+
+.railTools {
+  display: grid;
+  flex: none;
+  gap: var(--space-3, 6px);
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.railSearch {
+  width: 100%;
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  border-radius: 0;
+  padding: 0 9px;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--text-xs, 11px);
+}
+
+.railSearch::placeholder {
+  color: var(--shell-muted);
+  letter-spacing: 0.04em;
+}
+
+.railSearch:focus-visible {
+  border-color: var(--shell-orange);
+  outline: none;
+}
+
+.railSearch:disabled {
+  opacity: var(--disabled-opacity, 0.38);
+}
+
+.railFilter {
+  display: inline-flex;
+  min-height: 30px;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+  border: 1px solid var(--shell-line);
+  padding: 0 9px;
+  color: var(--shell-muted);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: var(--track-label, 0.1em);
+  text-transform: uppercase;
+  transition: var(--transition-control, none);
+}
+
+.railFilter:hover:not(:disabled) {
+  border-color: var(--shell-orange);
+  color: var(--shell-text);
+}
+
+.railFilter[aria-pressed="true"] {
+  border-color: var(--shell-orange);
+  color: var(--shell-bg);
+  background: var(--shell-orange);
+}
+
+.railFilter:disabled {
+  cursor: not-allowed;
+  opacity: var(--disabled-opacity, 0.38);
+}
+
+.railNote {
+  display: grid;
+  flex: none;
+  gap: 3px;
+  padding: 6px 14px;
+  border-bottom: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-panel);
+  font-size: var(--text-2xs, 10px);
+  line-height: 1.45;
+}
+
+.railNote strong {
+  color: var(--shell-text);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.conversationList {
+  flex: 1;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  list-style: none;
+}
+
+.conversationList li {
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.conversationItem {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  width: 100%;
+  min-height: 70px;
+  padding: 9px 12px 8px 14px;
+  border: 0;
+  border-left: var(--border-record-width, 4px) solid transparent;
+  color: var(--shell-text);
+  background: transparent;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.conversationItem:hover {
+  background: var(--shell-panel);
+}
+
+.conversationItem[aria-current="true"] {
+  border-left-color: var(--shell-orange);
+  background: var(--shell-panel);
+}
+
+.conversationTop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-5, 10px);
+}
+
+.conversationName {
+  display: flex;
+  min-width: 0;
+  flex: 1;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.conversationName strong {
+  min-width: 0;
+  overflow: hidden;
+  font-size: var(--text-sm, 12px);
+  line-height: 1.25;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.conversationName small {
+  overflow: hidden;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.04em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.conversationTime {
+  flex: none;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+}
+
+.conversationPreview {
+  display: -webkit-box;
+  overflow: hidden;
+  color: var(--shell-muted);
+  font-family: var(--font-reading), Georgia, serif;
+  font-size: var(--text-sm, 12px);
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+.conversationPreview em {
+  color: var(--shell-text);
+  font-style: normal;
+}
+
+.conversationMeta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--space-3, 6px);
+  margin-top: auto;
+}
+
+.typeBadge,
+.actionBadge {
+  padding: 3px 5px;
+  border: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-bg);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-style: normal;
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.actionBadge {
+  border-color: var(--shell-orange);
+  color: var(--shell-orange);
+}
+
+.unread,
+.opened {
+  margin-left: auto;
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+  letter-spacing: 0.07em;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+
+.unread {
+  color: var(--shell-orange);
+}
+
+.unread::before {
+  width: 7px;
+  height: 7px;
+  border-radius: 50%;
+  background: var(--shell-orange);
+  box-shadow: 0 0 8px color-mix(in srgb, var(--shell-orange) 60%, transparent);
+  content: "";
+}
+
+.opened {
+  color: var(--shell-muted);
+}
+
+.railEmpty {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 7px;
+  min-height: 240px;
+  padding: 30px;
+  color: var(--shell-muted);
+  text-align: center;
+}
+
+.railEmpty strong {
+  color: var(--shell-text);
+  font-size: var(--text-base, 14px);
+  font-weight: 700;
+}
+
+.railEmpty span {
+  max-width: 230px;
+  font-size: var(--text-xs, 11px);
+  line-height: 1.5;
+}
+
+.railGlyph {
+  display: grid;
+  width: 48px;
+  height: 38px;
+  place-items: center;
+  border: 1px dashed var(--shell-orange);
+  color: var(--shell-orange);
+  font-size: 20px;
+}
+
+.railFooter {
+  flex: none;
+  padding: 7px 14px;
+  border-top: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  font-size: var(--text-2xs, 10px);
+  line-height: 1.45;
+}
+
+.railFooter a,
+.timelineEmpty a,
+.contextEmpty a,
+.identityNote a,
+.composerMeta a {
+  color: var(--shell-orange);
+}
+
+/* ── Centre: the conversation ────────────────────────────────────────────── */
+
+.conversation {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: var(--shell-bg);
+}
+
+.conversationHead {
+  display: flex;
+  flex: none;
+  min-height: 54px;
+  align-items: center;
+  gap: var(--space-6, 12px);
+  padding: 8px 14px;
+  border-bottom: 1px solid var(--shell-line);
+  background: var(--shell-bg);
+}
+
+.conversationHead > div {
+  min-width: 0;
+  flex: 1;
+}
+
+.conversationHead strong {
+  display: block;
+  margin-top: 2px;
+  overflow: hidden;
+  font-size: var(--text-base, 14px);
+  font-weight: 700;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.conversationHead small {
+  display: block;
+  overflow: hidden;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.06em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.headButton {
+  flex: none;
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.headButton:hover {
+  border-color: var(--shell-orange);
+}
+
+.headButton[aria-expanded="true"] {
+  border-color: var(--shell-orange);
+  color: var(--shell-orange);
+}
+
+.backButton,
+.contextButton {
+  display: none;
+}
+
+.timelineScroll {
+  flex: 1;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 12px 14px;
+}
+
+.timeline {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-7, 14px);
+  list-style: none;
+}
+
+.entry {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  max-width: min(720px, 92%);
+}
+
+.entry[data-direction="outgoing"] {
+  align-self: flex-end;
+  align-items: flex-end;
+}
+
+.entry[data-direction="incoming"] {
+  align-self: flex-start;
+  align-items: flex-start;
+}
+
+.entryMeta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px 10px;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.entryMeta b {
+  color: var(--shell-text);
+  font-weight: 700;
+}
+
+/* The accent edge marks what this wallet did; a received record keeps a
+   quiet edge, and the record frames below carry their own trust colour. */
+.bubble {
+  width: 100%;
+  padding: 11px 13px;
+  border: 1px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.entry[data-direction="incoming"] .bubble {
+  border-left: 3px solid var(--shell-muted);
+}
+
+.entry[data-direction="outgoing"] .bubble {
+  border-right: 3px solid var(--shell-orange);
+  background: var(--shell-inset);
+}
+
+.entry[data-highlight="true"] .bubble,
+.entry[data-highlight="true"] .recordCard {
+  box-shadow: 0 0 0 2px var(--shell-orange);
+}
+
+.letterBody {
+  max-width: var(--measure-reading, 68ch);
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  font-family: var(--font-reading), Georgia, serif;
+  font-size: var(--reading-md, 15px);
+  line-height: 1.6;
+}
+
+.memo {
+  color: var(--shell-muted);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.5;
+  overflow-wrap: anywhere;
+}
+
+.cardStack {
+  display: grid;
+  width: 100%;
+  gap: var(--space-4, 8px);
+}
+
+.bubble .cardStack {
+  margin-top: 10px;
+  padding-top: 10px;
+  border-top: 1px dashed var(--shell-line);
+}
+
+/* A compact record: the terms and where they stand, with the full Mailbox
+   card one disclosure away. The frame colour is the record's trust class. */
+.recordCard {
+  display: grid;
+  width: 100%;
+  gap: var(--space-3, 6px);
+  padding: 10px 12px;
+  border: 1px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.recordCard[data-tone="accent"] {
+  border-color: var(--shell-orange);
+}
+
+.recordCard[data-tone="live"] {
+  border-color: var(--shell-live);
+}
+
+.recordCard[data-tone="deal"] {
+  border-color: var(--shell-deal);
+}
+
+.recordCard[data-tone="danger"] {
+  border-color: var(--shell-danger);
+}
+
+.recordHead {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-3, 6px) var(--space-5, 10px);
+}
+
+.recordTitle {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+  letter-spacing: var(--track-label, 0.1em);
+  text-transform: uppercase;
+}
+
+.recordStatus {
+  padding: 3px 6px;
+  border: 1px solid currentColor;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.recordCard[data-tone="accent"] .recordStatus {
+  color: var(--shell-orange);
+}
+
+.recordCard[data-tone="live"] .recordStatus {
+  color: var(--shell-live);
+}
+
+.recordCard[data-tone="deal"] .recordStatus {
+  color: var(--shell-deal);
+}
+
+.recordCard[data-tone="danger"] .recordStatus {
+  color: var(--shell-danger);
+}
+
+.recordTerms {
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--text-md, 13px);
+  font-variant-numeric: tabular-nums;
+  letter-spacing: -0.01em;
+  overflow-wrap: anywhere;
+}
+
+.recordAction {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 6px 10px;
+  padding: 7px 10px;
+  border-left: var(--border-record-width, 4px) solid var(--shell-orange);
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.45;
+}
+
+.recordAction a {
+  flex: none;
+  color: var(--shell-orange);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.recordDetails {
+  border-top: 1px dashed var(--shell-line);
+}
+
+.recordDetails > summary {
+  display: flex;
+  min-height: 30px;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 4px;
+  color: var(--shell-muted);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: var(--track-label, 0.1em);
+  list-style: none;
+  text-transform: uppercase;
+}
+
+.recordDetails > summary::-webkit-details-marker {
+  display: none;
+}
+
+.recordDetails > summary::after {
+  color: var(--shell-orange);
+  content: "+";
+  font-size: 14px;
+}
+
+.recordDetails[open] > summary::after {
+  content: "\2212";
+}
+
+.recordFull {
+  min-width: 0;
+}
+
+.timelineEmpty,
+.welcome {
+  display: grid;
+  gap: var(--space-5, 10px);
+  max-width: 560px;
+  margin: 40px auto;
+  padding: 22px 20px;
+  border: 1px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.timelineEmpty {
+  border-style: dashed;
+  text-align: center;
+  justify-items: center;
+}
+
+.timelineEmpty strong {
+  color: var(--shell-text);
+  font-size: var(--text-md, 13px);
+}
+
+.timelineEmpty p,
+.welcome p {
+  max-width: 60ch;
+  color: var(--shell-muted);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.55;
+}
+
+.welcome {
+  justify-items: start;
+}
+
+.welcome h2 {
+  font-size: clamp(24px, 3vw, 34px);
+  font-weight: 800;
+  letter-spacing: -0.04em;
+  line-height: 1.05;
+}
+
+.welcomeLinks {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-3, 6px);
+}
+
+.welcomeLinks a,
+.detailActions a,
+.detailActions button,
+.identityActions a,
+.identityActions button {
+  display: inline-flex;
+  min-height: 28px;
+  align-items: center;
+  border: 1px solid var(--shell-line);
+  padding: 0 9px;
+  color: var(--shell-muted);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-decoration: none;
+  text-transform: uppercase;
+}
+
+.welcomeLinks a:hover,
+.detailActions a:hover,
+.detailActions button:hover,
+.identityActions a:hover,
+.identityActions button:hover {
+  border-color: var(--shell-orange);
+  color: var(--shell-text);
+}
+
+.connectAction {
+  display: inline-flex;
+  flex: none;
+}
+
+/* SelectWallet ships the app's rounded CTA; on the desk it is the same square
+   orange control as every other primary action. */
+.connectAction > button {
+  width: auto;
+  margin: 0;
+  padding: 9px 12px;
+  border: 1px solid var(--shell-orange);
+  border-radius: 0;
+  color: var(--on-accent);
+  background: var(--shell-orange);
+  font: inherit;
+  font-size: var(--label-md, 10px);
+  font-weight: 800;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  cursor: pointer;
+}
+
+.connectAction > button:hover {
+  border-color: var(--shell-text);
+  color: var(--shell-bg);
+  background: var(--shell-text);
+  filter: none;
+}
+
+/* ── Composer ────────────────────────────────────────────────────────────── */
+
+.composer {
+  display: grid;
+  flex: none;
+  gap: var(--space-3, 6px);
+  padding: 10px 14px 12px;
+  border-top: 1px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.composerInput {
+  width: 100%;
+  min-height: 64px;
+  max-height: 40vh;
+  resize: vertical;
+  border: 1px solid var(--shell-line);
+  border-radius: 0;
+  padding: 8px 10px;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  font-family: var(--font-reading), Georgia, serif;
+  font-size: var(--reading-md, 15px);
+  line-height: 1.55;
+}
+
+.composerInput::placeholder {
+  color: var(--shell-muted);
+}
+
+.composerInput:focus {
+  border-color: var(--shell-orange);
+  box-shadow: 0 0 0 1px var(--shell-orange);
+  outline: none;
+}
+
+.composerInput:disabled {
+  opacity: 0.6;
+}
+
+.composerRow {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 6px 12px;
+}
+
+.composerMeta {
+  min-width: 0;
+  flex: 1 1 240px;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.06em;
+  line-height: 1.5;
+  text-transform: uppercase;
+}
+
+.sendButton {
+  min-height: 36px;
+  border: 1px solid var(--shell-orange);
+  padding: 0 16px;
+  color: var(--shell-bg);
+  background: var(--shell-orange);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  transition: var(--transition-control, none);
+}
+
+.sendButton:hover:not(:disabled) {
+  color: var(--shell-orange);
+  background: transparent;
+}
+
+.sendButton:disabled {
+  border-color: var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-inset);
+  cursor: not-allowed;
+}
+
+.composerStatus {
+  padding: 7px 10px;
+  border-left: var(--border-record-width, 4px) solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-bg);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+}
+
+.composerStatus[data-kind="error"] {
+  border-left-color: var(--shell-danger);
+  color: var(--shell-text);
+}
+
+.composerStatus[data-kind="ok"] {
+  border-left-color: var(--shell-live);
+}
+
+.composerStatus[data-kind="sending"] {
+  border-left-color: var(--shell-orange);
+}
+
+.unlockForm {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--space-3, 6px);
+}
+
+.unlockForm span {
+  flex: 1 1 100%;
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.45;
+}
+
+.unlockForm input {
+  min-width: 0;
+  flex: 1 1 180px;
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  border-radius: 0;
+  padding: 0 8px;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  font: inherit;
+  font-size: var(--text-sm, 12px);
+}
+
+.unlockForm button {
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-text);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.unlockForm button:hover:not(:disabled) {
+  border-color: var(--shell-orange);
+}
+
+.unlockForm button:disabled {
+  cursor: not-allowed;
+  opacity: var(--disabled-opacity, 0.38);
+}
+
+/* ── Right: contact context ──────────────────────────────────────────────── */
+
+.context {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  border-left: 1px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.contextHead {
+  display: flex;
+  flex: none;
+  min-height: 54px;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-5, 10px);
+  padding: 10px 14px 8px;
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.contextHead > div {
+  min-width: 0;
+}
+
+.contextHead strong {
+  display: block;
+  margin-top: 2px;
+  font-size: var(--text-base, 14px);
+}
+
+.contextClose {
+  display: none;
+  min-width: 32px;
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  cursor: pointer;
+  font: inherit;
+  font-size: 16px;
+}
+
+.contextScroll {
+  flex: 1;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+.identity {
+  display: grid;
+  gap: var(--space-4, 8px);
+  padding: 12px 14px;
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.identity h2 {
+  font-size: 18px;
+  font-weight: 800;
+  letter-spacing: -0.03em;
+  overflow-wrap: anywhere;
+}
+
+.identity code {
+  display: block;
+  overflow-wrap: anywhere;
+  color: var(--shell-text);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--text-xs, 11px);
+  line-height: 1.6;
+}
+
+.identityNote {
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.5;
+}
+
+.identityActions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 5px;
+}
+
+.contextSection {
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.contextSectionHead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+  padding: 9px 14px 6px;
+}
+
+.contextSectionHead h3 {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+}
+
+.contextSectionHead span {
+  color: var(--shell-orange);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+}
+
+.contextList {
+  display: grid;
+  list-style: none;
+}
+
+.contextEntry {
+  display: grid;
+  width: 100%;
+  gap: 3px;
+  padding: 8px 14px 9px;
+  border: 0;
+  border-top: 1px solid var(--shell-line);
+  border-left: 3px solid transparent;
+  color: var(--shell-text);
+  background: transparent;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.contextEntry:hover {
+  background: var(--shell-inset);
+}
+
+.contextEntry[aria-pressed="true"] {
+  border-left-color: var(--shell-orange);
+  background: var(--shell-inset);
+}
+
+.contextEntryTop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+}
+
+.contextEntryTop strong {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.contextEntryTop em {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-style: normal;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.contextEntry[data-tone="accent"] .contextEntryTop em {
+  color: var(--shell-orange);
+}
+
+.contextEntry[data-tone="live"] .contextEntryTop em {
+  color: var(--shell-live);
+}
+
+.contextEntry[data-tone="deal"] .contextEntryTop em {
+  color: var(--shell-deal);
+}
+
+.contextEntry[data-tone="danger"] .contextEntryTop em {
+  color: var(--shell-danger);
+}
+
+.contextEntryTerms {
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--text-sm, 12px);
+  font-variant-numeric: tabular-nums;
+  overflow-wrap: anywhere;
+}
+
+.contextEntryStatus {
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.4;
+}
+
+.contextEmpty {
+  padding: 6px 14px 10px;
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.45;
+}
+
+.contextPlaceholder {
+  padding: 14px;
+  color: var(--shell-muted);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.5;
+}
+
+/* Detail replaces the lists inside the same rail: the conversation stays. */
+.detail {
+  display: grid;
+  gap: var(--space-5, 10px);
+  padding: 12px 14px;
+}
+
+.detailBack {
+  justify-self: start;
+  min-height: 30px;
+  border: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-text);
+  background: var(--shell-bg);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.detailBack:hover {
+  border-color: var(--shell-orange);
+}
+
+.detail > div > strong {
+  display: block;
+  margin-top: 2px;
+  font-size: var(--text-lg, 16px);
+  font-weight: 800;
+  letter-spacing: -0.02em;
+}
+
+.detailFacts {
+  display: grid;
+  gap: 1px;
+  margin: 0;
+  border: 1px solid var(--shell-line);
+  background: var(--shell-line);
+}
+
+.detailFacts > div {
+  min-width: 0;
+  padding: 7px 9px;
+  background: var(--shell-bg);
+}
+
+.detailFacts dt {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-xs, 8px);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.detailFacts dd {
+  margin: 3px 0 0;
+  font-size: var(--text-sm, 12px);
+  line-height: 1.4;
+  overflow-wrap: anywhere;
+}
+
+.detailFacts code {
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--text-2xs, 10px);
+}
+
+.detailActions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 5px;
+}
+
+.contextBackdrop {
+  display: none;
+}
+
+/* ── Responsive ──────────────────────────────────────────────────────────── */
+
+@media (max-width: 1179px) {
+  .workspace {
+    grid-template-columns: 300px minmax(0, 1fr);
+  }
+
+  .context {
+    position: fixed;
+    top: var(--app-shell-offset, 92px);
+    right: 0;
+    bottom: 0;
+    z-index: 40;
+    width: min(360px, 100vw);
+    box-shadow: var(--shadow-hard, 4px 4px 0 rgb(0 0 0 / 35%));
+    transform: translateX(100%);
+    transition: transform var(--duration-fast, 120ms) ease;
+  }
+
+  .contextOpen .context {
+    transform: translateX(0);
+  }
+
+  .contextButton,
+  .contextClose {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .contextOpen .contextBackdrop {
+    position: fixed;
+    inset: 0;
+    z-index: 39;
+    display: block;
+    border: 0;
+    background: var(--overlay, rgb(5 6 6 / 82%));
+    cursor: pointer;
+  }
+}
+
+@media (max-width: 899px) {
+  .workspace {
+    grid-template-columns: minmax(0, 1fr);
+  }
+
+  .conversation {
+    display: none;
+  }
+
+  .detailOpen .rail {
+    display: none;
+  }
+
+  .detailOpen .conversation {
+    display: flex;
+  }
+
+  .backButton {
+    display: inline-flex;
+    align-items: center;
+  }
+
+  .entry {
+    max-width: 100%;
+  }
+
+  .composerInput {
+    font-size: 16px;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .context {
+    transition: none;
+  }
+}
diff --git a/src/app/chat/page.tsx b/src/app/chat/page.tsx
new file mode 100644
index 0000000..1ccffb6
--- /dev/null
+++ b/src/app/chat/page.tsx
@@ -0,0 +1,702 @@
+"use client";
+
+import { Link } from "@tanstack/react-router";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useActiveStarknetSession } from "@/app/active-session";
+import { useFrontendProvider } from "@/app/components/client/provider/providerContext";
+import SelectWallet from "@/app/components/client/WalletHandle/SelectWallet";
+import { useStoreWallet } from "@/app/components/Wallet/walletContext";
+import {
+  helperForNetwork,
+  paymentLinkRecords,
+  paymentLinkToLocal,
+  storedSentToLocal,
+} from "@/app/inbox/mailbox-model";
+import {
+  restoreRfqLifecycle,
+  type RfqLifecycleRecord,
+} from "@/app/rfq/rfq-lifecycle";
+import { createIndexedDbRfqStorage } from "@/app/rfq/rfq-storage";
+import { shortenFelt } from "@/components/mail/correspondent";
+import type { LocalMailMessage } from "@/components/mail/Thread";
+import {
+  ADDRESS_BOOK_CHANGED_EVENT,
+  loadAddressBook,
+  type AddressBookEntry,
+} from "@/lib/address-book";
+import { loadAliases, type AliasRecord } from "@/lib/aliases";
+import { emptyEscrowState, loadEscrowState, type EscrowState } from "@/lib/escrow";
+import { deriveKeypair, type MailKeypair } from "@/lib/mail";
+import { loadReadMessageIds, saveReadMessageIds } from "@/lib/mail-read-state";
+import {
+  conversationFieldsFromPayload,
+  parseConversationId,
+} from "@/lib/mail-thread";
+import {
+  inspectMailVault,
+  unwrapMailSeed,
+  type MailVaultRecord,
+} from "@/lib/mail-vault";
+import { emptyOtcState, expireStoredDeals, type OtcState } from "@/lib/otc";
+import { loadSentMail } from "@/lib/sent-mail";
+import * as constants from "@/utils/constants";
+import ChatComposer, {
+  type ChatComposerStatus,
+  type ChatKeyState,
+} from "./ChatComposer";
+import ChatContextPanel from "./ChatContextPanel";
+import ChatConversationRail from "./ChatConversationRail";
+import ChatTimeline, { chatEntryDomId } from "./ChatTimeline";
+import {
+  buildChatModel,
+  buildContactContext,
+  contactDisplayName,
+  filterConversations,
+  unreadItemIds,
+  type ChatConversation,
+} from "./chat-model";
+import {
+  chatSendBlocker,
+  previewChatLetterBudget,
+  sendChatLetter,
+} from "./chat-send";
+import styles from "./chat.module.css";
+
+type ChatRecords = Readonly<{
+  sent: readonly LocalMailMessage[];
+  paymentLinks: readonly LocalMailMessage[];
+  otc: OtcState;
+  escrow: EscrowState;
+  aliases: readonly AliasRecord[];
+  addressBook: readonly AddressBookEntry[];
+  rfqRecords: readonly RfqLifecycleRecord[];
+}>;
+
+const EMPTY_RECORDS: ChatRecords = Object.freeze({
+  sent: [],
+  paymentLinks: [],
+  otc: emptyOtcState(),
+  escrow: emptyEscrowState(),
+  aliases: [],
+  addressBook: [],
+  rfqRecords: [],
+});
+
+type VaultState =
+  | { kind: "missing" }
+  | {
+      kind: "locked";
+      record: Extract<MailVaultRecord, { kind: "passphrase" }>;
+      busy: boolean;
+      error?: string;
+    }
+  | { kind: "ready"; seed: Uint8Array; keypair: MailKeypair };
+
+function wipeVault(vault: VaultState): void {
+  if (vault.kind !== "ready") return;
+  vault.seed.fill(0);
+  vault.keypair.privateKey.fill(0);
+}
+
+/**
+ * Everything Chat reads is the mailbox's own device-local state, loaded with
+ * the same functions Mailbox uses so the two surfaces can never disagree
+ * about a record. Nothing is fetched from the chain here.
+ */
+function loadSynchronousRecords(
+  chainId: string,
+  address: string,
+): Pick<ChatRecords, "sent" | "paymentLinks" | "otc" | "escrow" | "aliases"> {
+  const otc = expireStoredDeals(window.localStorage, chainId, address);
+  return {
+    sent: loadSentMail(window.localStorage, chainId, address).map(
+      storedSentToLocal,
+    ),
+    paymentLinks: paymentLinkRecords(otc).map((payment) =>
+      paymentLinkToLocal(
+        payment.request,
+        payment.updatedAt,
+        payment.linkAuthenticity,
+      ),
+    ),
+    otc,
+    escrow: loadEscrowState(window.localStorage, chainId, address),
+    aliases: loadAliases(window.localStorage, address),
+  };
+}
+
+/** The conversation tag Mailbox threads this counterparty under, if any. */
+function conversationIdFor(
+  conversation: ChatConversation,
+): string | undefined {
+  for (let index = conversation.items.length - 1; index >= 0; index -= 1) {
+    const item = conversation.items[index];
+    const message = item.message;
+    if (!message || message.envelope.type === "unsupported") continue;
+    const fields = conversationFieldsFromPayload(
+      message.envelope.type,
+      message.envelope.payload,
+    );
+    const candidate =
+      fields.conversationId ??
+      fields.documentId ??
+      parseConversationId(message.documentId);
+    if (candidate) return candidate;
+  }
+  return undefined;
+}
+
+function prefersReducedMotion(): boolean {
+  try {
+    return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+  } catch {
+    return false;
+  }
+}
+
+export default function ChatPage() {
+  const session = useActiveStarknetSession();
+  const providerIndex = useFrontendProvider(
+    (state) => state.currentFrontendProviderIndex,
+  );
+  const address = useStoreWallet((state) => state.address);
+  const chainId = useStoreWallet((state) => state.chain);
+  const isConnected = useStoreWallet((state) => state.isConnected);
+  const walletAccount = useStoreWallet((state) => state.myWalletAccount);
+  const selectedWallet = useStoreWallet((state) => state.StarknetWalletObject);
+  const isStrk20Capable = useStoreWallet((state) => state.isStrk20Capable);
+  const helperAddress = helperForNetwork(providerIndex);
+  const networkName = constants.Strk20Networks[providerIndex] ?? "this network";
+  const scope = address && chainId ? `${chainId}:${address}` : "";
+  const gate: "wallet" | null = scope ? null : "wallet";
+  const handoffsEnabled =
+    session.rail === "ready" && session.compatible && Boolean(scope);
+
+  const [records, setRecords] = useState<ChatRecords>(EMPTY_RECORDS);
+  const [readIds, setReadIds] = useState<Set<string>>(() => new Set());
+  const [version, setVersion] = useState(0);
+  const refresh = useCallback(() => setVersion((value) => value + 1), []);
+  const scopeRef = useRef("");
+
+  useEffect(() => {
+    if (!scope || !address || !chainId) {
+      scopeRef.current = "";
+      setRecords(EMPTY_RECORDS);
+      setReadIds(new Set());
+      return;
+    }
+    const sameScope = scopeRef.current === scope;
+    scopeRef.current = scope;
+    let cancelled = false;
+    try {
+      const loaded = loadSynchronousRecords(chainId, address);
+      setRecords((current) => ({
+        ...loaded,
+        addressBook: sameScope ? current.addressBook : [],
+        rfqRecords: sameScope ? current.rfqRecords : [],
+      }));
+    } catch {
+      setRecords(EMPTY_RECORDS);
+    }
+    setReadIds(loadReadMessageIds(window.localStorage, chainId, address));
+    void loadAddressBook(window.localStorage, address)
+      .then((entries) => {
+        if (!cancelled) {
+          setRecords((current) => ({ ...current, addressBook: entries }));
+        }
+      })
+      .catch(() => {
+        // A book that will not open is reported on the Counterparties page.
+        if (!cancelled) setRecords((current) => ({ ...current, addressBook: [] }));
+      });
+    void createIndexedDbRfqStorage()
+      .list(chainId, address)
+      .then((rows) => {
+        if (cancelled) return;
+        const now = Math.floor(Date.now() / 1_000);
+        const restored: RfqLifecycleRecord[] = [];
+        for (const raw of rows) {
+          try {
+            restored.push(
+              restoreRfqLifecycle(raw, { chainId, account: address, now }),
+            );
+          } catch {
+            // An unreadable row is the RFQ workspace's to reconcile.
+          }
+        }
+        setRecords((current) => ({ ...current, rfqRecords: restored }));
+      })
+      .catch(() => {
+        // Without IndexedDB the workspace section simply stays empty here.
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [address, chainId, scope, version]);
+
+  useEffect(() => {
+    const onChange = () => refresh();
+    window.addEventListener(ADDRESS_BOOK_CHANGED_EVENT, onChange);
+    window.addEventListener("storage", onChange);
+    return () => {
+      window.removeEventListener(ADDRESS_BOOK_CHANGED_EVENT, onChange);
+      window.removeEventListener("storage", onChange);
+    };
+  }, [refresh]);
+
+  /* The mailbox key stays exactly where Mailbox keeps it: a plaintext vault
+     opens silently, a passphrase vault asks once per tab, and the seed is
+     zeroed whenever the account changes or the page goes away. */
+  const [vault, setVault] = useState<VaultState>({ kind: "missing" });
+  const vaultRef = useRef<VaultState>(vault);
+  vaultRef.current = vault;
+  useEffect(() => {
+    if (!address || !chainId) {
+      setVault({ kind: "missing" });
+      return;
+    }
+    let next: VaultState = { kind: "missing" };
+    try {
+      const inspected = inspectMailVault(window.localStorage, chainId, address);
+      if (inspected.kind === "plaintext") {
+        next = {
+          kind: "ready",
+          seed: inspected.seed,
+          keypair: deriveKeypair(inspected.seed),
+        };
+      } else if (inspected.kind === "passphrase") {
+        next = { kind: "locked", record: inspected.record, busy: false };
+      }
+    } catch {
+      next = { kind: "missing" };
+    }
+    setVault(next);
+    return () => {
+      wipeVault(vaultRef.current);
+      wipeVault(next);
+    };
+  }, [address, chainId]);
+
+  async function unlockVault(passphrase: string) {
+    const current = vaultRef.current;
+    if (current.kind !== "locked" || current.busy) return;
+    setVault({ ...current, busy: true, error: undefined });
+    try {
+      const seed = await unwrapMailSeed(current.record, passphrase);
+      setVault({ kind: "ready", seed, keypair: deriveKeypair(seed) });
+    } catch (error: unknown) {
+      setVault({
+        kind: "locked",
+        record: current.record,
+        busy: false,
+        error:
+          error instanceof Error
+            ? error.message
+            : "That passphrase does not open this mailbox vault.",
+      });
+    }
+  }
+
+  const model = useMemo(
+    () =>
+      buildChatModel({
+        selfAddress: address,
+        sent: records.sent,
+        paymentLinks: records.paymentLinks,
+        otc: records.otc,
+        escrow: records.escrow,
+        addressBook: records.addressBook,
+        aliases: records.aliases,
+        readIds,
+      }),
+    [address, records, readIds],
+  );
+  const [search, setSearch] = useState("");
+  const [needsActionOnly, setNeedsActionOnly] = useState(false);
+  const needsActionCount = model.conversations.filter(
+    (conversation) => conversation.needsAction,
+  ).length;
+  const visible = useMemo(
+    () => filterConversations(model.conversations, { search, needsActionOnly }),
+    [model.conversations, needsActionOnly, search],
+  );
+
+  const [selectedAddress, setSelectedAddress] = useState<string | null>(null);
+  const activatedRef = useRef<string | null>(null);
+  const [entryId, setEntryId] = useState<string | null>(null);
+  const [highlightId, setHighlightId] = useState<string | null>(null);
+  const [mobileDetailOpen, setMobileDetailOpen] = useState(false);
+  const [contextOpen, setContextOpen] = useState(false);
+  const [drafts, setDrafts] = useState<Record<string, string>>({});
+  const [status, setStatus] = useState<ChatComposerStatus>(null);
+  const [sending, setSending] = useState(false);
+
+  useEffect(() => {
+    setSelectedAddress(null);
+    activatedRef.current = null;
+    setEntryId(null);
+    setHighlightId(null);
+    setDrafts({});
+    setStatus(null);
+    setSending(false);
+    setMobileDetailOpen(false);
+    setContextOpen(false);
+    setSearch("");
+    setNeedsActionOnly(false);
+  }, [scope]);
+
+  useEffect(() => {
+    if (
+      selectedAddress &&
+      visible.some((conversation) => conversation.contact.address === selectedAddress)
+    ) {
+      return;
+    }
+    setSelectedAddress(visible[0]?.contact.address ?? null);
+  }, [selectedAddress, visible]);
+
+  const conversation =
+    model.conversations.find(
+      (candidate) => candidate.contact.address === selectedAddress,
+    ) ?? null;
+  const context = useMemo(
+    () =>
+      conversation ? buildContactContext(conversation, records.rfqRecords) : null,
+    [conversation, records.rfqRecords],
+  );
+  const selectedEntry = useMemo(() => {
+    if (!context || !entryId) return null;
+    return (
+      [...context.rfqs, ...context.payments, ...context.escrows].find(
+        (entry) => entry.id === entryId,
+      ) ?? null
+    );
+  }, [context, entryId]);
+
+  /* Opening a conversation is what marks its incoming records read; the
+     first row being selected on load is not. Same rule as Mailbox. */
+  useEffect(() => {
+    if (!conversation || !address || !chainId) return;
+    if (activatedRef.current !== conversation.contact.address) return;
+    const pending = unreadItemIds(conversation).filter((id) => !readIds.has(id));
+    if (!pending.length) return;
+    const next = new Set(readIds);
+    for (const id of pending) next.add(id);
+    setReadIds(next);
+    saveReadMessageIds(window.localStorage, chainId, address, next);
+  }, [address, chainId, conversation, readIds]);
+
+  const scrollRef = useRef<HTMLDivElement | null>(null);
+  const conversationAddress = conversation?.contact.address ?? null;
+  const conversationLength = conversation?.items.length ?? 0;
+  useEffect(() => {
+    if (highlightId) return;
+    const frame = window.requestAnimationFrame(() => {
+      const element = scrollRef.current;
+      if (element) element.scrollTop = element.scrollHeight;
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [conversationAddress, conversationLength, highlightId]);
+
+  useEffect(() => {
+    if (!highlightId) return;
+    const frame = window.requestAnimationFrame(() => {
+      document.getElementById(chatEntryDomId(highlightId))?.scrollIntoView({
+        block: "center",
+        behavior: prefersReducedMotion() ? "auto" : "smooth",
+      });
+    });
+    const timer = window.setTimeout(() => setHighlightId(null), 1_800);
+    return () => {
+      window.cancelAnimationFrame(frame);
+      window.clearTimeout(timer);
+    };
+  }, [highlightId]);
+
+  const selectConversation = useCallback((next: string) => {
+    activatedRef.current = next;
+    setSelectedAddress(next);
+    setEntryId(null);
+    setHighlightId(null);
+    setStatus(null);
+    setMobileDetailOpen(true);
+    setContextOpen(false);
+  }, []);
+
+  function locate(itemId: string) {
+    setContextOpen(false);
+    setMobileDetailOpen(true);
+    setHighlightId(itemId);
+  }
+
+  const keyState: ChatKeyState =
+    vault.kind === "ready"
+      ? { kind: "ready" }
+      : vault.kind === "locked"
+        ? { kind: "locked", busy: vault.busy, error: vault.error }
+        : { kind: "missing" };
+  const blocker = chatSendBlocker({
+    helperAddress,
+    networkName,
+    connected: isConnected,
+    hasWalletAccount: Boolean(walletAccount),
+    senderAddress: address,
+    isStrk20Capable,
+    keyReady: vault.kind === "ready",
+  });
+  const draft = conversation ? (drafts[conversation.contact.address] ?? "") : "";
+  const budget = useMemo(
+    () => previewChatLetterBudget(draft, vault.kind === "ready"),
+    [draft, vault.kind],
+  );
+
+  async function send() {
+    if (
+      !conversation ||
+      sending ||
+      blocker ||
+      vault.kind !== "ready" ||
+      !helperAddress ||
+      !walletAccount ||
+      !selectedWallet ||
+      !address ||
+      !chainId
+    ) {
+      return;
+    }
+    const target = conversation.contact.address;
+    const body = draft;
+    setSending(true);
+    setStatus({
+      kind: "sending",
+      message: "Preparing the sealed letter…",
+      startedAt: Date.now(),
+    });
+    try {
+      const result = await sendChatLetter({
+        recipient: target,
+        body,
+        conversationId: conversationIdFor(conversation),
+        context: {
+          providerIndex,
+          provider: constants.myFrontendProviders[providerIndex],
+          helperAddress,
+          walletAccount,
+          selectedWallet,
+          senderAddress: address,
+          chainId,
+          mailSeed: vault.seed,
+          keypair: vault.keypair,
+        },
+        storage: window.localStorage,
+        onPhase: (_phase, detail) =>
+          setStatus((current) => ({
+            kind: "sending",
+            message: detail,
+            startedAt: current?.startedAt ?? Date.now(),
+          })),
+      });
+      setDrafts((current) => ({ ...current, [target]: "" }));
+      setStatus({
+        kind: "ok",
+        message: result.localCopySaved
+          ? `Sealed and confirmed in ${shortenFelt(result.transactionHash)}. The Sent copy is saved in this browser profile (not encrypted at rest).`
+          : `Confirmed in ${result.transactionHash}, but the local Sent copy could not be saved: ${result.localCopyError ?? "browser storage failed"}. It will not appear here after this tab closes.`,
+      });
+      if (result.localCopySaved) {
+        refresh();
+        setHighlightId(`sent:${result.sent.documentId}`);
+      }
+    } catch (error: unknown) {
+      setStatus({
+        kind: "error",
+        message:
+          error instanceof Error
+            ? error.message
+            : "The letter was not sent. Nothing was submitted.",
+      });
+    } finally {
+      setSending(false);
+    }
+  }
+
+  const name = conversation ? contactDisplayName(conversation.contact) : null;
+
+  return (
+    <div className={styles.page}>
+      <main
+        aria-label="APP20 Chat"
+        className={`${styles.workspace}${mobileDetailOpen ? ` ${styles.detailOpen}` : ""}${
+          contextOpen ? ` ${styles.contextOpen}` : ""
+        }`}
+      >
+        <ChatConversationRail
+          conversations={visible}
+          totalCount={model.conversations.length}
+          selectedAddress={selectedAddress}
+          search={search}
+          onSearchChange={setSearch}
+          needsActionOnly={needsActionOnly}
+          onNeedsActionChange={setNeedsActionOnly}
+          needsActionCount={needsActionCount}
+          gate={gate}
+          unattributedSent={model.unattributedSent}
+          onSelect={selectConversation}
+        />
+
+        <section className={styles.conversation} aria-label="Conversation">
+          <header className={styles.conversationHead}>
+            <button
+              type="button"
+              className={`${styles.headButton} ${styles.backButton}`}
+              aria-label="Back to conversations"
+              onClick={() => setMobileDetailOpen(false)}
+            >
+              ← Chats
+            </button>
+            <div>
+              <p className={styles.kicker}>
+                {conversation
+                  ? "DEVICE-LOCAL RECORDS · NOT SETTLEMENT AUTHORITY"
+                  : "APP20 / CHAT / ENCRYPTED CORRESPONDENCE"}
+              </p>
+              <strong>
+                {name ? (
+                  <bdi>{name}</bdi>
+                ) : (
+                  "Private correspondence, one counterparty at a time"
+                )}
+              </strong>
+              {conversation ? (
+                <small>
+                  {conversation.items.length} record
+                  {conversation.items.length === 1 ? "" : "s"} on this device ·{" "}
+                  {shortenFelt(conversation.contact.address)}
+                </small>
+              ) : null}
+            </div>
+            {conversation ? (
+              <button
+                type="button"
+                className={`${styles.headButton} ${styles.contextButton}`}
+                aria-controls="chat-context"
+                aria-expanded={contextOpen}
+                onClick={() => setContextOpen((open) => !open)}
+              >
+                Context
+              </button>
+            ) : null}
+          </header>
+
+          <div ref={scrollRef} className={styles.timelineScroll}>
+            {gate ? (
+              <section
+                className={styles.welcome}
+                aria-labelledby="chat-welcome-title"
+              >
+                <p className={styles.kicker}>APP20 / CHAT</p>
+                <h2 id="chat-welcome-title">One counterparty, every record.</h2>
+                <p>
+                  Chat reads the letters, offers, invoices and escrows this
+                  device already holds and groups them by counterparty. It is
+                  keyed to a wallet: connect one to open it.
+                </p>
+                <div className={styles.connectAction}>
+                  <SelectWallet />
+                </div>
+              </section>
+            ) : conversation ? (
+              <ChatTimeline
+                conversation={conversation}
+                aliases={records.aliases}
+                highlightId={highlightId}
+              />
+            ) : (
+              <section
+                className={styles.welcome}
+                aria-labelledby="chat-empty-title"
+              >
+                <p className={styles.kicker}>APP20 / CHAT</p>
+                <h2 id="chat-empty-title">No counterparties on this device.</h2>
+                <p>
+                  Save a wallet under Counterparties or send a letter from
+                  Mailbox; each one becomes a conversation here. Records a
+                  counterparty sends you appear after Mailbox checks for mail.
+                </p>
+                <div className={styles.welcomeLinks}>
+                  <Link to="/contacts">Counterparties</Link>
+                  <Link to="/mail/inbox">Mailbox</Link>
+                  <Link to="/rfq">RFQ workspace</Link>
+                </div>
+              </section>
+            )}
+          </div>
+
+          {conversation && name ? (
+            <ChatComposer
+              contactName={name}
+              value={draft}
+              onChange={(value) =>
+                setDrafts((current) => ({
+                  ...current,
+                  [conversation.contact.address]: value,
+                }))
+              }
+              blocker={blocker}
+              keyState={keyState}
+              onUnlock={(passphrase) => void unlockVault(passphrase)}
+              sending={sending}
+              status={status}
+              budget={budget}
+              onSend={() => void send()}
+            />
+          ) : null}
+        </section>
+
+        {conversation && context ? (
+          <ChatContextPanel
+            conversation={conversation}
+            context={context}
+            selectedEntry={selectedEntry}
+            onSelectEntry={setEntryId}
+            onLocate={locate}
+            selfAddress={address}
+            chainId={chainId}
+            handoffsEnabled={handoffsEnabled}
+            aliases={records.aliases}
+            onClose={() => setContextOpen(false)}
+          />
+        ) : (
+          <aside className={styles.context} aria-label="Contact context" id="chat-context">
+            <header className={styles.contextHead}>
+              <div>
+                <p className={styles.kicker}>CONTACT CONTEXT</p>
+                <strong>At a glance</strong>
+              </div>
+              <button
+                type="button"
+                className={styles.contextClose}
+                aria-label="Close contact context"
+                onClick={() => setContextOpen(false)}
+              >
+                ×
+              </button>
+            </header>
+            <p className={styles.contextPlaceholder}>
+              Wallet identity, open RFQs, pending payments and escrows for the
+              selected counterparty appear here.
+            </p>
+          </aside>
+        )}
+
+        <button
+          type="button"
+          className={styles.contextBackdrop}
+          aria-label="Close contact context"
+          tabIndex={contextOpen ? 0 : -1}
+          onClick={() => setContextOpen(false)}
+        />
+      </main>
+    </div>
+  );
+}
diff --git a/src/app/components/AppShell.tsx b/src/app/components/AppShell.tsx
index db1ef93..25d0cf6 100644
--- a/src/app/components/AppShell.tsx
+++ b/src/app/components/AppShell.tsx
@@ -17,17 +17,20 @@ export default function AppShell({ renderLocalnetTools }: AppShellProps) {
   const privyConnected = useWalletMode((state) => state.privyConnected);
   const mailActive = pathname.startsWith("/mail") || pathname === "/inbox";
   const rfqActive = pathname === "/rfq" || pathname.startsWith("/rfq/");
+  const chatActive = pathname === "/chat" || pathname.startsWith("/chat/");
   const connected = walletMode === "privy" ? privyConnected : readyConnected;
   const payActive = pathname === "/pay";
   const moduleName = mailActive
     ? "MAILBOX"
-    : payActive
-      ? "PAY"
-      : pathname === "/contacts"
-        ? "COUNTERPARTIES"
-        : rfqActive
-          ? "RFQ WORKSPACE"
-          : "APP20";
+    : chatActive
+      ? "CHAT"
+      : payActive
+        ? "PAY"
+        : pathname === "/contacts"
+          ? "COUNTERPARTIES"
+          : rfqActive
+            ? "RFQ WORKSPACE"
+            : "APP20";
 
   return (
     <div
@@ -60,6 +63,9 @@ export default function AppShell({ renderLocalnetTools }: AppShellProps) {
           <Link to="/rfq" aria-current={rfqActive ? "page" : undefined}>
             RFQ
           </Link>
+          <Link to="/chat" aria-current={chatActive ? "page" : undefined}>
+            Chat
+          </Link>
           <Link to="/mail/inbox" aria-current={mailActive ? "page" : undefined}>
             Mailbox
           </Link>
diff --git a/src/app/globals.css b/src/app/globals.css
index c9e1733..5348023 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -470,6 +470,18 @@ a {
   background: var(--shell-panel);
 }
 
+/* A lazily loaded route announces itself in the desk's label voice while its
+   chunk arrives; there is no spinner anywhere on the desk. */
+.route-loading {
+  padding: 18px;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+}
+
 .funding-readiness-panel dd,
 .funding-readiness-panel code {
   min-width: 0;
diff --git a/src/app/routes.test.ts b/src/app/routes.test.ts
index 7a54f0f..803b91d 100644
--- a/src/app/routes.test.ts
+++ b/src/app/routes.test.ts
@@ -52,6 +52,8 @@ describe("APP20 canonical routes", () => {
     expect(CANONICAL_ROUTES.crossChainReview).toBe("/cross-chain-review");
     expect(legacyRouteTarget(CANONICAL_ROUTES.rfq)).toBeNull();
     expect(legacyRouteTarget(CANONICAL_ROUTES.mail)).toBeNull();
+    expect(CANONICAL_ROUTES.chat).toBe("/chat");
+    expect(legacyRouteTarget(CANONICAL_ROUTES.chat)).toBeNull();
     expect(legacyRouteTarget(CANONICAL_ROUTES.contacts)).toBeNull();
     expect(legacyRouteTarget(CANONICAL_ROUTES.pay)).toBeNull();
   });
diff --git a/src/app/routes.ts b/src/app/routes.ts
index ff49d58..e712151 100644
--- a/src/app/routes.ts
+++ b/src/app/routes.ts
@@ -8,6 +8,7 @@ export const CANONICAL_ROUTES = {
   recovery: "/recovery/privy",
   crossChainReview: "/cross-chain-review",
   mail: "/mail/inbox",
+  chat: "/chat",
   intents: "/intents",
   contacts: "/contacts",
   pay: "/pay",
diff --git a/src/main.tsx b/src/main.tsx
index 273562d..d0e85c1 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,5 +1,5 @@
 import { createRoot } from "react-dom/client";
-import type { ReactNode } from "react";
+import { lazy, Suspense, type ReactNode } from "react";
 import {
   createRootRoute,
   createRoute,
@@ -12,19 +12,28 @@ import AppShell from "@/app/components/AppShell";
 import ReadyRailGate from "@/app/components/ReadyRailGate";
 import AppProviders from "@/app/providers";
 import InboxPage from "@/app/inbox/page";
+import ChatPage from "@/app/chat/page";
 import PayPage from "@/app/pay/page";
 import ContactsPage from "@/app/contacts/page";
 import RfqPage from "@/app/rfq/page";
 import OperationsDashboard from "@/app/rfq/OperationsDashboard";
-import MarketProposalPage from "@/app/rfq/markets/proposal/page";
 import FundingPage from "@/app/funding/page";
 import SendPage from "@/app/send/page";
 import PrivyRecoveryPage from "@/app/recovery/privy/page";
-import CrossChainReviewPage from "@/app/cross-chain-review/page";
 import { CANONICAL_ROUTES, legacyRouteRedirect } from "@/app/routes";
 import "@/app/globals.css";
 import "@/app/design-system.css";
 
+// The proposal-only market view and the dry cross-chain review are secondary,
+// read-only tools. Deferring them keeps the eagerly loaded shell inside its
+// recorded byte budget now that Chat joins RFQ, Mailbox and Counterparties.
+const MarketProposalPage = lazy(
+  () => import("@/app/rfq/markets/proposal/page"),
+);
+const CrossChainReviewPage = lazy(
+  () => import("@/app/cross-chain-review/page"),
+);
+
 let renderLocalnetTools: (() => ReactNode) | null = null;
 
 function RootLayout() {
@@ -51,6 +60,14 @@ function ReadyMailPage() {
   );
 }
 
+function ReadyChatPage() {
+  return (
+    <ReadyRailGate moduleName="Chat">
+      <ChatPage />
+    </ReadyRailGate>
+  );
+}
+
 function ReadyPaymentPage() {
   return (
     <ReadyRailGate moduleName="Payment Request">
@@ -59,9 +76,29 @@ function ReadyPaymentPage() {
   );
 }
 
+function RouteLoading({ name }: { name: string }) {
+  return (
+    <p className="route-loading" role="status">
+      Opening {name}…
+    </p>
+  );
+}
+
 function RoutedMarketProposalPage() {
   const { tokenA, tokenB } = useParams({ strict: false });
-  return <MarketProposalPage tokenA={String(tokenA)} tokenB={String(tokenB)} />;
+  return (
+    <Suspense fallback={<RouteLoading name="market proposal" />}>
+      <MarketProposalPage tokenA={String(tokenA)} tokenB={String(tokenB)} />
+    </Suspense>
+  );
+}
+
+function RoutedCrossChainReviewPage() {
+  return (
+    <Suspense fallback={<RouteLoading name="cross-chain review" />}>
+      <CrossChainReviewPage />
+    </Suspense>
+  );
 }
 
 const homeRoute = createRoute({
@@ -128,6 +165,12 @@ const mailboxRoute = createRoute({
   component: ReadyMailPage,
 });
 
+const chatRoute = createRoute({
+  getParentRoute: () => rootRoute,
+  path: "/chat",
+  component: ReadyChatPage,
+});
+
 const intentsRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: "/intents",
@@ -171,7 +214,7 @@ const recoveryRoute = createRoute({
 const crossChainReviewRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: "/cross-chain-review",
-  component: CrossChainReviewPage,
+  component: RoutedCrossChainReviewPage,
 });
 
 const router = createRouter({
@@ -185,6 +228,7 @@ const router = createRouter({
     mailRoute,
     legacyInboxRoute,
     mailboxRoute,
+    chatRoute,
     intentsRoute,
     contactsRoute,
     workflowsRoute,

From 1e4480deb94eb281645049b3d4160020cdfeaceb Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 5 Sep 2026 00:26:48 +0000
Subject: [PATCH 2/4] test(chat): exercise the Chat surface on localnet and
 mark records read on activation

The new journey registers both fixture mailboxes, has Bob save Alice as a
counterparty, sends an encrypted letter from the Chat composer through the
real localnet helper, confirms the same Sent copy in Mailbox, lets Alice
decrypt it and answer with an offer from Mailbox, and checks that Bob's Chat
reads that offer as work with its context detail, locate, filter and search.

Opening the row that was already auto-selected on load changed no state, so
the effect that marks a conversation's records read never ran. An activation
counter now makes every explicit choice count, matching Mailbox's rule that
the first row on load is not "opened" until someone opens it.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01DL5RB43eSUCvsor8uVPfUa
---
 src/app/chat/page.tsx          |   7 +-
 tests/ui/chat.localnet.spec.ts | 327 +++++++++++++++++++++++++++++++++
 2 files changed, 333 insertions(+), 1 deletion(-)
 create mode 100644 tests/ui/chat.localnet.spec.ts

diff --git a/src/app/chat/page.tsx b/src/app/chat/page.tsx
index 1ccffb6..0aedc03 100644
--- a/src/app/chat/page.tsx
+++ b/src/app/chat/page.tsx
@@ -322,7 +322,11 @@ export default function ChatPage() {
   );
 
   const [selectedAddress, setSelectedAddress] = useState<string | null>(null);
+  /* A conversation is "activated" by an explicit choice, not by being the
+     first row on load. The counter lets choosing the already-open row count
+     again, so its records are marked read even when nothing else changed. */
   const activatedRef = useRef<string | null>(null);
+  const [activation, setActivation] = useState(0);
   const [entryId, setEntryId] = useState<string | null>(null);
   const [highlightId, setHighlightId] = useState<string | null>(null);
   const [mobileDetailOpen, setMobileDetailOpen] = useState(false);
@@ -384,7 +388,7 @@ export default function ChatPage() {
     for (const id of pending) next.add(id);
     setReadIds(next);
     saveReadMessageIds(window.localStorage, chainId, address, next);
-  }, [address, chainId, conversation, readIds]);
+  }, [activation, address, chainId, conversation, readIds]);
 
   const scrollRef = useRef<HTMLDivElement | null>(null);
   const conversationAddress = conversation?.contact.address ?? null;
@@ -415,6 +419,7 @@ export default function ChatPage() {
 
   const selectConversation = useCallback((next: string) => {
     activatedRef.current = next;
+    setActivation((value) => value + 1);
     setSelectedAddress(next);
     setEntryId(null);
     setHighlightId(null);
diff --git a/tests/ui/chat.localnet.spec.ts b/tests/ui/chat.localnet.spec.ts
new file mode 100644
index 0000000..b12b544
--- /dev/null
+++ b/tests/ui/chat.localnet.spec.ts
@@ -0,0 +1,327 @@
+import {
+  activateLocalnet,
+  connectLocalnetWallet,
+  expect,
+  localnetIdentity,
+  primeLocalnetMailSeed,
+  restoreLocalnetMailRandomness,
+  test,
+  type LocalnetConfig,
+  type LocalnetIdentityId,
+  type Page,
+} from "./support/localnet";
+
+test.describe.configure({ mode: "serial" });
+
+async function switchIdentity(
+  page: Page,
+  config: LocalnetConfig,
+  id: LocalnetIdentityId,
+) {
+  const target = localnetIdentity(config, id);
+  const selector = page.locator(`[data-localnet-identity="${id}"]`);
+  if ((await selector.getAttribute("aria-pressed")) !== "true") {
+    await selector.click();
+  }
+  await expect(selector).toHaveAttribute("aria-pressed", "true");
+  if (
+    (await page.getByRole("button", { name: "Connect wallet" }).count()) > 0
+  ) {
+    await connectLocalnetWallet(page);
+  }
+  await expect(
+    page
+      .getByRole("region", { name: "Wallet session" })
+      .locator("[title]")
+      .first(),
+  ).toHaveAttribute("title", new RegExp(target.address.slice(2), "i"));
+}
+
+/** The recovery panel is a closed disclosure in the mailbox rail. */
+async function openMailboxRecovery(page: Page) {
+  await page
+    .locator("details", {
+      has: page.getByText("Encrypted mailbox recovery", { exact: true }),
+    })
+    .first()
+    .evaluate((element) => {
+      (element as HTMLDetailsElement).open = true;
+    });
+}
+
+async function closeComposerIfOpen(page: Page) {
+  const deleteDraft = page.getByRole("button", {
+    name: "Delete draft…",
+    exact: true,
+  });
+  if ((await deleteDraft.count()) > 0) {
+    page.once("dialog", (dialog) => dialog.accept());
+    await deleteDraft.click();
+  } else {
+    const close = page.getByRole("button", { name: "Close", exact: true });
+    if ((await close.count()) > 0) await close.click();
+  }
+}
+
+/** Registers the fixture mailbox key for an identity, or loads the saved one. */
+async function ensureMailboxKey(page: Page, identity: LocalnetIdentityId) {
+  let setup = page.getByRole("button", {
+    name: "Load device key & register",
+  });
+  if ((await setup.count()) === 0) {
+    await page.getByRole("button", { name: "Compose", exact: true }).click();
+    setup = page.getByRole("button", {
+      name: "Load device key & register",
+    });
+  }
+  await expect(setup).toBeVisible();
+  await primeLocalnetMailSeed(page, identity);
+  try {
+    await setup.click();
+  } finally {
+    await restoreLocalnetMailRandomness(page);
+  }
+  const backupHeading = page.getByText(
+    "Back up now — this phrase is shown once",
+  );
+  const scanButton = page.getByRole("button", { name: "Check for new mail" });
+  await expect
+    .poll(
+      async () => {
+        if (await backupHeading.isVisible()) return "backup";
+        return (await scanButton.isEnabled()) ? "ready" : "waiting";
+      },
+      { timeout: 120_000 },
+    )
+    .not.toBe("waiting");
+  if (await backupHeading.isVisible()) {
+    await page
+      .getByRole("button", { name: "I saved the backup — open mailbox" })
+      .click();
+  }
+  await expect(scanButton).toBeEnabled({ timeout: 60_000 });
+  await openMailboxRecovery(page);
+  await expect(
+    page.getByRole("button", { name: "Back up RFQ history" }),
+  ).toBeEnabled({ timeout: 60_000 });
+  await closeComposerIfOpen(page);
+}
+
+async function loadExistingKey(page: Page) {
+  const button = page.getByRole("button", {
+    name: "Load device key & register",
+  });
+  if ((await button.count()) === 0) {
+    await page.getByRole("button", { name: "Compose", exact: true }).click();
+  }
+  await expect(button).toBeVisible();
+  await button.click();
+  await expect(button).toHaveCount(0, { timeout: 60_000 });
+  await closeComposerIfOpen(page);
+  await page
+    .getByRole("button", { name: /^Inbox/ })
+    .first()
+    .click();
+}
+
+async function scanRecent(page: Page) {
+  const button = page.getByRole("button", { name: "Check for new mail" });
+  await expect(button).toBeEnabled();
+  await button.click();
+  await page.waitForTimeout(100);
+  await expect(button).toBeEnabled({ timeout: 60_000 });
+}
+
+function messageRow(page: Page, body: string) {
+  return page.getByRole("button").filter({ hasText: body });
+}
+
+/** Displayed addresses are canonical felts; fixture addresses may be zero-padded. */
+function addressPattern(address: string): RegExp {
+  return new RegExp(address.replace(/^0x0*/i, ""), "i");
+}
+
+function conversationRow(page: Page, name: string) {
+  return page
+    .getByRole("region", { name: "Conversations", exact: true })
+    .getByRole("button", { name: new RegExp(name) });
+}
+
+test("chat sends an encrypted letter and reads Mailbox's records per counterparty", async ({
+  page,
+  localnetConfig: config,
+}) => {
+  test.setTimeout(14 * 60_000);
+  page.setDefaultTimeout(60_000);
+  const alice = localnetIdentity(config, "alice");
+  const bob = localnetIdentity(config, "bob");
+  // Unique per run: the chain keeps earlier runs' letters, and a fresh browser
+  // context decrypts them all again.
+  const runTag = Date.now().toString(36);
+  const quote = `0.01${String(Date.now() % 1_000).padStart(3, "0")}`;
+  const terms = `0.25 STRK for ${quote} ETH`;
+  const letter = `Chat letter ${runTag}: can you quote 0.25 STRK against ETH today?`;
+  const offerBody = `Offer ${runTag} from Mailbox that Chat should read as work`;
+  const contactLabel = "Alice desk";
+
+  await test.step("1. both fixture mailboxes register their keys", async () => {
+    await page.goto("/mail/inbox");
+    await activateLocalnet(page);
+    await switchIdentity(page, config, "alice");
+    await ensureMailboxKey(page, "alice");
+    await switchIdentity(page, config, "bob");
+    await ensureMailboxKey(page, "bob");
+  });
+
+  await test.step("2. Bob saves Alice as a counterparty and opens Chat", async () => {
+    await page.getByRole("link", { name: "Counterparties" }).click();
+    await page.getByLabel("New address book label").fill(contactLabel);
+    await page.getByLabel("New address book address").fill(alice.address);
+    await page.getByRole("button", { name: "Add", exact: true }).click();
+    await expect(page.getByText(contactLabel, { exact: true })).toBeVisible();
+
+    await page.getByRole("link", { name: "Chat", exact: true }).click();
+    await expect(page).toHaveURL(/\/chat$/);
+    await expect(page.locator(".signal-bar")).toContainText("CHAT");
+    await expect(
+      page.getByRole("link", { name: "Chat", exact: true }),
+    ).toHaveAttribute("aria-current", "page");
+    const row = conversationRow(page, contactLabel);
+    await expect(row).toBeVisible();
+    await row.click();
+    await expect(
+      page
+        .getByRole("region", { name: "Conversation", exact: true })
+        .locator("header strong"),
+    ).toContainText(contactLabel);
+    await expect(
+      page.getByText(`No records with ${contactLabel} on this device yet.`),
+    ).toBeVisible();
+    await expect(
+      page.getByRole("complementary", { name: "Contact context" }),
+    ).toContainText(addressPattern(alice.address));
+  });
+
+  await test.step("3. Bob sends an encrypted letter from the composer", async () => {
+    const input = page.getByLabel(`Message to ${contactLabel}`);
+    await input.fill(letter);
+    await expect(
+      page.getByRole("form", { name: `Write to ${contactLabel}` }),
+    ).toContainText(/bytes · sealed on this device · 1 wallet approval/i);
+    await page.getByRole("button", { name: "Send encrypted" }).click();
+    await expect(
+      page.getByRole("status").filter({ hasText: /Sealed and confirmed in/ }),
+    ).toBeVisible({ timeout: 180_000 });
+    const timeline = page.getByRole("list", {
+      name: `Conversation with ${contactLabel}`,
+    });
+    await expect(timeline).toContainText(letter);
+    await expect(timeline).toContainText("Sent copy on this device");
+    await expect(conversationRow(page, contactLabel)).toContainText("You:");
+    await expect(input).toHaveValue("");
+
+    // The same Sent copy is what Mailbox shows: one store, two surfaces.
+    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await page
+      .getByRole("button", { name: /^Sent/ })
+      .first()
+      .click();
+    await expect(messageRow(page, letter)).toBeVisible();
+  });
+
+  await test.step("4. Alice decrypts it in Mailbox and answers with an offer", async () => {
+    await switchIdentity(page, config, "alice");
+    await loadExistingKey(page);
+    await scanRecent(page);
+    await expect(messageRow(page, letter)).toBeVisible({ timeout: 60_000 });
+    await messageRow(page, letter).click();
+    await expect(
+      page.getByLabel("Correspondence").getByText(letter, { exact: true }),
+    ).toBeVisible();
+
+    await page.getByRole("button", { name: "Compose", exact: true }).click();
+    await expect(
+      page.getByRole("heading", { name: "New document" }),
+    ).toBeVisible();
+    await page.getByLabel(/^To/).fill(bob.address);
+    await page
+      .getByPlaceholder(
+        "Write a private message, or leave blank when sending attachments only",
+      )
+      .fill(offerBody);
+    await page.getByRole("button", { name: /OTC offer/ }).click();
+    await page.getByLabel("STRK to buy").fill("0.25");
+    await page.getByLabel("Quoted token symbol").fill("ETH");
+    await page
+      .getByLabel("Quoted token address")
+      .fill(config.counterTokenAddress);
+    await page.getByLabel("Token decimals").fill("18");
+    await page.getByLabel("Quoted amount").fill(quote);
+    await page.getByLabel("Note (optional)").fill("Chat offer");
+    await page.getByLabel(/Expiry in hours \(0 = none\)/).fill("24");
+    await page
+      .getByRole("button", { name: "Send encrypted message", exact: true })
+      .click();
+    await expect(
+      page.getByRole("heading", { name: "New document" }),
+    ).toHaveCount(0, { timeout: 180_000 });
+    await expect(messageRow(page, offerBody)).toBeVisible();
+  });
+
+  await test.step("5. Bob's Chat reads the received offer as work, with context", async () => {
+    await switchIdentity(page, config, "bob");
+    await loadExistingKey(page);
+    await scanRecent(page);
+    await expect(messageRow(page, offerBody)).toBeVisible({ timeout: 60_000 });
+
+    await page.getByRole("link", { name: "Chat", exact: true }).click();
+    const row = conversationRow(page, contactLabel);
+    await expect(row).toContainText("Needs action");
+    await expect(row).toContainText(/\d+ unread/);
+    await row.click();
+    await expect(row).toContainText("Opened");
+    await expect(row).not.toContainText("unread");
+
+    const timeline = page.getByRole("list", {
+      name: `Conversation with ${contactLabel}`,
+    });
+    await expect(timeline).toContainText(letter);
+    const offerCard = timeline.getByRole("article", {
+      name: new RegExp(`^Offer: ${terms.replaceAll(".", "\\.")}`),
+    });
+    await expect(offerCard).toBeVisible();
+    await expect(offerCard).toContainText("Accept or decline this offer in Mailbox.");
+    await expect(timeline).toContainText("Saved by Mailbox from decrypted mail");
+
+    const context = page.getByRole("complementary", { name: "Contact context" });
+    await expect(context.getByRole("region", { name: "Open RFQs" })).toContainText(
+      terms,
+    );
+    await context
+      .getByRole("button", { name: /Offer · received/ })
+      .filter({ hasText: terms })
+      .click();
+    await expect(context).toContainText("Record detail");
+    await expect(
+      context.getByText("OTC OFFER / ONE-SIDED V1", { exact: true }),
+    ).toBeVisible();
+    await expect(timeline).toBeVisible();
+    await context.getByRole("button", { name: "Show in conversation" }).click();
+    await expect(timeline.locator('li[data-highlight="true"]')).toHaveCount(1);
+    await context
+      .getByRole("button", { name: `Back to ${contactLabel}` })
+      .click();
+    await expect(
+      context.getByRole("region", { name: "Wallet identity" }),
+    ).toContainText(addressPattern(alice.address));
+
+    await page.getByRole("button", { name: /Needs action only/ }).click();
+    await expect(conversationRow(page, contactLabel)).toBeVisible();
+    await page.getByLabel("Search conversations").fill(`${quote} ETH`);
+    await expect(conversationRow(page, contactLabel)).toBeVisible();
+    await page.getByLabel("Search conversations").fill("nothing matches this");
+    await expect(page.getByText("No conversation matches")).toBeVisible();
+    await page.getByLabel("Search conversations").fill("");
+    await page.getByRole("button", { name: /Needs action only/ }).click();
+  });
+});

From 006e2b393613873a8e0759eef51433380e0be837 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 5 Sep 2026 10:19:35 +0000
Subject: [PATCH 3/4] Retire Mailbox into Chat as the only mail surface

Chat now carries everything the Mailbox page did: key setup and unlock
(Onboard), chain scans, decrypted letters grouped by counterparty with
sealed-sender and "This mailbox" buckets, value actions on the cards
(accept, decline, receipt, pay, pay privately with STRK, escrow fill,
claim and timeout), the document composer with attachments, drafts,
contact and RFQ-history backups with restore, device safety, the /pay
handoff, and the Counterparties and RFQ desk handoffs.

- Move the Mailbox page's state and handlers into useMailboxDesk and
  build Chat's rail, timeline, composer, context panel and mailbox tools
  on it; delete the inbox page, Thread, ConversationList and DraftList.
- Attribute a decrypted record by its assigned name, a payload claim,
  the thread a Sent copy opened, or the deal a memo answers; anything
  else stays a sealed sender with an inline naming form.
- Redirect /mail/inbox (and /mail, /inbox) to /chat; drop the Mailbox
  nav link; point Pay, Counterparties and the RFQ desk at Chat.
- Keep record cards open while the desk acts on them, treat an invoice
  awaiting note maturity as pending work, and make record terms
  searchable.
- Port the localnet journeys (app20, chat, private-intents) to the Chat
  UI with shared helpers; update README and docs.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01DL5RB43eSUCvsor8uVPfUa
---
 README.md                                     |  21 +-
 STRK20_INTEGRATION_PLAN.md                    |   2 +-
 docs/APP20_PRIVATE_DESK.md                    |  26 +-
 docs/APP20_PROCESS_DIAGRAMS.md                |   2 +-
 docs/APP20_RFQ_V3_DESIGN.md                   |   2 +-
 src/app/chat/ChatComposer.tsx                 |  65 +-
 src/app/chat/ChatContextPanel.tsx             |  74 +-
 src/app/chat/ChatConversationRail.tsx         | 269 ++---
 src/app/chat/ChatMailboxTools.tsx             | 302 ++++++
 src/app/chat/ChatRecordCard.tsx               | 175 +++-
 src/app/chat/ChatTimeline.tsx                 | 309 +++++-
 src/app/chat/chat-model.test.ts               | 548 ++++++----
 src/app/chat/chat-model.ts                    | 702 +++++++++----
 src/app/chat/chat-send.ts                     |  37 +-
 src/app/chat/chat.module.css                  | 524 +++++++++-
 src/app/{inbox => chat}/mailbox-model.test.ts |  29 +-
 src/app/{inbox => chat}/mailbox-model.ts      | 173 +--
 src/app/chat/page.tsx                         | 807 ++++++++------
 .../page.tsx => chat/useMailboxDesk.ts}       | 985 +++---------------
 src/app/components/AppShell.tsx               |  27 +-
 src/app/contacts/page.tsx                     |  20 +-
 src/app/pay/page.tsx                          |  24 +-
 src/app/rfq/LocalnetPrivateIntentDesk.tsx     |   2 +-
 src/app/rfq/PrivacyWalletMenu.tsx             |   2 +-
 src/app/rfq/RfqWorkspace.tsx                  |   2 +-
 src/app/routes.test.ts                        |  10 +-
 src/app/routes.ts                             |   4 +-
 ...ead.test.tsx => ChainRecordPanel.test.tsx} |   3 +-
 src/components/mail/ChainRecordPanel.tsx      | 180 ++++
 src/components/mail/ConversationList.test.ts  | 243 -----
 src/components/mail/ConversationList.tsx      | 414 --------
 src/components/mail/DraftList.tsx             | 149 ---
 src/components/mail/MemoCard.tsx              |  92 ++
 src/components/mail/Thread.tsx                | 891 ----------------
 src/components/mail/correspondent.ts          |   2 +-
 src/components/mail/message.ts                |  38 +
 src/lib/desk-handoff.test.ts                  |   4 +-
 src/main.tsx                                  |  16 +-
 tests/ui/app20.localnet.spec.ts               | 425 ++++----
 tests/ui/chat.localnet.spec.ts                | 261 ++---
 tests/ui/private-intents.localnet.spec.ts     | 140 +--
 tests/ui/support/chat.ts                      | 178 ++++
 42 files changed, 3812 insertions(+), 4367 deletions(-)
 create mode 100644 src/app/chat/ChatMailboxTools.tsx
 rename src/app/{inbox => chat}/mailbox-model.test.ts (93%)
 rename src/app/{inbox => chat}/mailbox-model.ts (75%)
 rename src/app/{inbox/page.tsx => chat/useMailboxDesk.ts} (74%)
 rename src/components/mail/{Thread.test.tsx => ChainRecordPanel.test.tsx} (93%)
 create mode 100644 src/components/mail/ChainRecordPanel.tsx
 delete mode 100644 src/components/mail/ConversationList.test.ts
 delete mode 100644 src/components/mail/ConversationList.tsx
 delete mode 100644 src/components/mail/DraftList.tsx
 create mode 100644 src/components/mail/MemoCard.tsx
 delete mode 100644 src/components/mail/Thread.tsx
 create mode 100644 src/components/mail/message.ts
 create mode 100644 tests/ui/support/chat.ts

diff --git a/README.md b/README.md
index 50d8aa5..59f5b14 100644
--- a/README.md
+++ b/README.md
@@ -7,11 +7,11 @@ execution are disabled and unauthorized.**
 Three surfaces form one workflow:
 
 1. **RFQ** — collateralized, bucket-only private USDC↔STRK requests and atomic localnet Take
-2. **Mailbox** — encrypted correspondence, structured evidence, invoice completion, and backup recovery
-3. **Counterparties** — a device-encrypted directory with RFQ and Mail handoffs
+2. **Chat** — encrypted correspondence one counterparty at a time: letters, structured evidence, invoice completion, and backup recovery
+3. **Counterparties** — a device-encrypted directory with RFQ and Chat handoffs
 
-**Chat** (`/chat`) complements them: it reads the same device-local records one
-counterparty at a time. Multi-maker requests stay in the RFQ workspace.
+Multi-maker requests stay in the RFQ workspace; Chat holds the correspondence
+around them and is the only mail surface. The former Mailbox route redirects to it.
 
 Users connect once in the header. The Ready Wallet API path does not expose a
 viewing key to APP20; the optional Privy browser-owned SDK derives/holds its
@@ -37,16 +37,15 @@ origin is live. This is not a Mainnet value-moving release.
 | Surface         | Route                                                                               | Current scope                                                                                                            |
 | --------------- | ----------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
 | Private RFQ     | `/rfq`                                                                              | Two localnet fixture makers, collateralized quotes, browser selection, and atomic Take. No production maker network.     |
-| Mailbox         | `/mail/inbox`                                                                       | Encrypted correspondence, payment handoffs, and self-backups. Evidence and recovery transport, not settlement authority. |
-| Counterparties  | `/contacts`                                                                         | Device-encrypted labels and addresses with RFQ/Mail handoffs and optional encrypted backup.                              |
-| Chat            | `/chat`                                                                             | One counterparty at a time: device-local letters, offers, invoices, and escrows with that contact, plus their open RFQs, pending payments, and escrows. Reads Mailbox's records; value actions stay in Mailbox. |
+| Chat            | `/chat` (`/mail/inbox` redirects here)                                              | Encrypted correspondence one counterparty at a time: letters, offers, invoices, escrows, payment handoffs, and self-backups, beside that contact's open RFQs. Evidence and recovery transport, not settlement authority. |
+| Counterparties  | `/contacts`                                                                         | Device-encrypted labels and addresses with RFQ/Chat handoffs and optional encrypted backup.                              |
 | Separate tools  | `/funding`, `/send`, `/cross-chain-review`, `/recovery/privy`, `/pay`               | Funding readiness, unavailable public send, dry cross-chain review, Privy recovery, and unsigned payment links.          |
 | Read-only views | `/rfq/operations`, `/rfq/markets/:tokenA/:tokenB/proposal`, `/swap/:tokenA/:tokenB` | Operations status, proposal-only market planning, and non-executable pair handoffs.                                      |
 
 `/pay` is a Mail helper, not a separate settlement product. It only creates an unsigned
-payment-request link. Nothing is sent until the payer confirms in Mail.
+payment-request link. Nothing is sent until the payer confirms in Chat.
 
-### RFQ, Mailbox, and Counterparties
+### RFQ, Chat, and Counterparties
 
 Within the localnet fixture, only Cairo plus pool-applied chain state can confirm
 an RFQ lifecycle. Same-devnet confirmation is not production configured-chain
@@ -81,7 +80,7 @@ Wallet policy is enforced below the UI:
 - **Sepolia** — Ready, plus an optional Privy browser signer
 - **Localnet** — build-gated development wallet
 
-In the product, mail is **Mailbox** / **Mail**. This pre-release namespace
+In the product, encrypted mail is **Chat** / **Mail**. This pre-release namespace
 reset renames the active contracts, storage keys, cryptographic domains,
 environment variables, and localnet paths to APP20. Pre-reset browser data,
 Mail ciphertext, signed payment links, and contract artifacts are not compatible
@@ -108,7 +107,7 @@ flowchart TD
     M --> V[Funding utilities, public send unavailable]
     S --> V
     LD --> D[Private RFQ]
-    W -. UI view only, live Mail action denied .-> MB[Mailbox and Counterparties, localnet actions only]
+    W -. UI view only, live Mail action denied .-> MB[Chat and Counterparties, localnet actions only]
     L --> MB
 
     D -. no automatic fallback .-> X[Public venue]
diff --git a/STRK20_INTEGRATION_PLAN.md b/STRK20_INTEGRATION_PLAN.md
index 6f8cbeb..f43cc8d 100644
--- a/STRK20_INTEGRATION_PLAN.md
+++ b/STRK20_INTEGRATION_PLAN.md
@@ -211,7 +211,7 @@ Historical status at that checkpoint: code-complete locally, with no helper depl
 
 | File | Landed behavior |
 | --- | --- |
-| `src/app/routes.ts` | Defines the current canonical `/mail/inbox` route and legacy redirects |
+| `src/app/routes.ts` | Defines the canonical `/chat` route and the legacy redirects, `/mail/inbox` included |
 | `src/app/inbox/page.tsx` | Network-aware onboarding, compose, public-event scan, and newest-first local plaintext list |
 | `src/components/mail/Onboard.tsx` | Locally persisted random device seed, one-time backup display, and public `register_pubkey` transaction |
 | `src/components/mail/Compose.tsx` | Recipient directory lookup, local encryption, optional private STRK attachment, and STRK20 submission |
diff --git a/docs/APP20_PRIVATE_DESK.md b/docs/APP20_PRIVATE_DESK.md
index 52a9593..d094488 100644
--- a/docs/APP20_PRIVATE_DESK.md
+++ b/docs/APP20_PRIVATE_DESK.md
@@ -3,13 +3,21 @@
 APP20 joins three surfaces into one workflow:
 
 1. **RFQ** — inventory-backed private USDC↔STRK quote and settlement.
-2. **Mailbox** — encrypted correspondence, authenticated backup, and non-authoritative evidence.
-3. **Counterparties** — a device-encrypted address book with RFQ and Mail handoffs.
-
-**Chat** (`/chat`) reads the same device-local Mailbox records one counterparty at a
-time: letters, offers, invoices, and escrows with that contact beside their open RFQs,
-pending payments, and escrows. It complements the multi-maker RFQ workspace and takes
-no value action of its own.
+2. **Chat** — encrypted correspondence one counterparty at a time, authenticated backup, and non-authoritative evidence.
+3. **Counterparties** — a device-encrypted address book with RFQ and Chat handoffs.
+
+**Chat** (`/chat`) is the mailbox: every encrypted record this wallet holds, grouped by
+counterparty, with letters, offers, invoices, and escrows beside that contact's open RFQs,
+pending payments, and escrows. Accept, receipt, pay, and escrow actions sit on the cards
+themselves; key setup, chain scans, drafts, self-backups, and device safety live in its
+mailbox tools. Multi-maker requests stay in the RFQ workspace. The former `/mail/inbox`
+route redirects to `/chat`.
+
+MessagePosted carries no sender, so a decrypted record joins a counterparty's
+conversation only through evidence this device holds: a name assigned on this device,
+the offerer, requester or maker a payload claims, the thread a single-recipient Sent copy
+opened, or the deal, request or escrow id a memo answers. Anything else shows as a
+sealed sender until it is named; the name is a local label, never authentication.
 
 APP20 is a bookless invited-maker venue using the existing STRK20 privacy pool. It does not create a pool, AMM, public order book, or automatic public fallback. See [`GAPS.md`](GAPS.md) for open engineering work.
 
@@ -76,7 +84,7 @@ The localnet desk renders the maturity estimate and verified maker-mid context.
 
 Mail accepts a registry-resolved localnet USDC payment request as well as STRK. For USDC, **Pay privately with STRK** stores an account/chain-scoped, five-minute invoice handoff and opens `/rfq`. The v3 invoice model estimates a STRK bucket from the verified maker median with a 2% buffer, then finds the minimum selected schedule allocations whose USDC output reaches the invoice amount.
 
-The localnet desk consumes the scoped handoff, requires a fresh verified maker median for preliminary sizing, minimizes the sell amount against verified schedules, and enforces the exact invoice amount as its floor. After a confirmed Take, it binds the request to the Take hash, Take block, USDC token, and exact invoice amount in state `awaiting-note-maturity`, then returns to Mail. At `takeBlock + 10`, Mail can reserve and submit the existing private memo-transfer path in USDC, then move through submitted to confirmed.
+The localnet desk consumes the scoped handoff, requires a fresh verified maker median for preliminary sizing, minimizes the sell amount against verified schedules, and enforces the exact invoice amount as its floor. After a confirmed Take, it binds the request to the Take hash, Take block, USDC token, and exact invoice amount in state `awaiting-note-maturity`, then returns to Chat. At `takeBlock + 10`, Chat can reserve and submit the existing private memo-transfer path in USDC, then move through submitted to confirmed.
 
 ## Chain-anchored encrypted backup
 
@@ -94,7 +102,7 @@ Restore authenticates every candidate before sequence ranking. Authenticated sam
 
 RFQ history payload v2 carries bounded authenticated portable tombstones as well as records. Forget wins over any included record for the same lifecycle id, including on a fresh database, and the tombstone is persisted before the row is removed. Export recursively strips signing-key fields. Every restored v3 row is durably marked `restoredFromBackup`, local, and non-authoritative; it has no `takerSigningKey`, cannot submit Take, and remains verify-only through reload, re-export, and re-import. A fresh device that receives only an old snapshot which predates a deletion cannot infer the missing newer tombstone, so operators must preserve the newest authenticated self-backup.
 
-The localnet IPFS emulator binds only to `127.0.0.1:5054` and stores blocks in an in-memory `Map`; restart loses them. On a configured production deployment, the IPFS RPC service would learn the source network metadata, upload timing, CID, and padded ciphertext size; gateways would learn fetch timing and requested CID. They receive encrypted padded blob bytes, not snapshot plaintext. The APP20 relay only permits reviewed origins in CSP and does not proxy or pin blobs itself. Production blob storage fails closed unless both browser IPFS origin settings and matching relay `IPFS_ORIGINS` are configured. A settled Take queues the opt-in RFQ auto-backup for the next unlocked Mailbox session.
+The localnet IPFS emulator binds only to `127.0.0.1:5054` and stores blocks in an in-memory `Map`; restart loses them. On a configured production deployment, the IPFS RPC service would learn the source network metadata, upload timing, CID, and padded ciphertext size; gateways would learn fetch timing and requested CID. They receive encrypted padded blob bytes, not snapshot plaintext. The APP20 relay only permits reviewed origins in CSP and does not proxy or pin blobs itself. Production blob storage fails closed unless both browser IPFS origin settings and matching relay `IPFS_ORIGINS` are configured. A settled Take queues the opt-in RFQ auto-backup for the next unlocked mailbox session in Chat.
 
 ## Contact storage and recovery
 
diff --git a/docs/APP20_PROCESS_DIAGRAMS.md b/docs/APP20_PROCESS_DIAGRAMS.md
index 2afb996..038e4d5 100644
--- a/docs/APP20_PROCESS_DIAGRAMS.md
+++ b/docs/APP20_PROCESS_DIAGRAMS.md
@@ -24,7 +24,7 @@ flowchart TD
     RS --> V
     PS --> PR[Privy Sepolia recovery vault]
     LD --> D[Private RFQ v3 localnet desk plus legacy recovery]
-    RW -. UI view only, live Mail action denied .-> M[Mailbox and Counterparties, localnet actions only]
+    RW -. UI view only, live Mail action denied .-> M[Chat and Counterparties, localnet actions only]
     LW --> M
 
     D -. no automatic fallback .-> X[Public venue]
diff --git a/docs/APP20_RFQ_V3_DESIGN.md b/docs/APP20_RFQ_V3_DESIGN.md
index 6138e7e..1577721 100644
--- a/docs/APP20_RFQ_V3_DESIGN.md
+++ b/docs/APP20_RFQ_V3_DESIGN.md
@@ -327,7 +327,7 @@ export type MakerIndicativeMidV1 = Readonly<{
 - `src/lib/backup-snapshot.ts`: `BackupSnapshotV1 { version: 1, kind: "contacts" | "rfq-resume", seq, owner, chainId, helperAddress, mailboxFingerprint, createdAt, payload, digest, mac }` using the same HKDF/HMAC discipline as `contact-backup.ts` (domain `app20/backup/v1`); `contact_snapshot` v1 remains readable.
 - `src/lib/backup-blob.ts`: `sealBackupBlob({ mailboxSeed, owner, chainId, kind, seq, bytes })` → AES-256-GCM (key = HKDF(seed, salt `app20/backup-blob/v1/salt`, info `app20/backup-blob/v1:owner:chainId:kind:seq`), 12-byte nonce, AAD = info), padded to 4096-byte buckets, header `[version=1][kind][seq u32]`; `openBackupBlob`.
 - `src/lib/blob-store.ts`: `BlobStore { put(bytes): Promise<{ cid }>; get(cid): Promise<Uint8Array> }`; `computeCidV1Raw(bytes)` (multihash sha2-256 → base32 `bafkrei…`); `createIpfsBlobStore({ rpcOrigin, gatewayOrigins })` (upload via `/api/v0/add`, fetch via `/ipfs/{cid}?format=raw` on each gateway until one verifies; hash mismatch → reject); `createUnavailableBlobStore(reason)`. Configuration: localnet → `ipfsProxyPath` from `/config`; production → `VITE_IPFS_RPC_ORIGIN`/`VITE_IPFS_GATEWAY_ORIGINS` (default empty → unavailable, fail closed).
-- Backup flow (inbox): "Back up RFQ history" and "Back up contacts" buttons create a snapshot; if its encoded envelope fits one Mail (≤ 4,293 bytes), post `backup_snapshot` inline; otherwise seal/upload a blob and post `backup_pointer { kind, seq, cid, bucketBytes, blobDigest }`. Candidate snapshots/pointers are authenticated before sequence ranking; same-sequence disagreement is rejected and RFQ restore never falls back past an unavailable/invalid newest authenticated candidate. Import enforces scope, a durable sequence high-water, strict bounded v2 record/tombstone shape, and an explicit keep-newer merge. Every backup is a public helper transaction; settled Take only queues the opt-in request for the next unlocked Mailbox session.
+- Backup flow (Chat mailbox tools): "Back up RFQ history" and "Back up contacts to this mailbox" buttons create a snapshot; if its encoded envelope fits one Mail (≤ 4,293 bytes), post `backup_snapshot` inline; otherwise seal/upload a blob and post `backup_pointer { kind, seq, cid, bucketBytes, blobDigest }`. Candidate snapshots/pointers are authenticated before sequence ranking; same-sequence disagreement is rejected and RFQ restore never falls back past an unavailable/invalid newest authenticated candidate. Import enforces scope, a durable sequence high-water, strict bounded v2 record/tombstone shape, and an explicit keep-newer merge. Every backup is a public helper transaction; settled Take only queues the opt-in request for the next unlocked Mailbox session.
 - Invoices: `PaymentRequestPayload.token` may be localnet USDC (registry-resolved) in addition to STRK. `InvoiceCard` shows "Pay privately with STRK" when the invoice token is USDC, which navigates to the desk in invoice mode. Inbox shows "Complete payment" for `awaiting-note-maturity` records once `takeBlock + 10 ≤ head` (uses `note-maturity.ts`), which runs the existing memo-transfer pay path with the USDC token and the recorded amount; states `awaiting-note-maturity → reserved → submitted → confirmed`.
 - Relay CSP: `headers.ts` adds `IPFS_ORIGINS` env (comma-separated HTTPS origins, same validation as Privy origins) appended to `connect-src`; default unset → unchanged CSP. `verify-production-csp.mjs` needs no change while unset.
 
diff --git a/src/app/chat/ChatComposer.tsx b/src/app/chat/ChatComposer.tsx
index 0aaa123..7fa2095 100644
--- a/src/app/chat/ChatComposer.tsx
+++ b/src/app/chat/ChatComposer.tsx
@@ -1,5 +1,4 @@
-import { Link } from "@tanstack/react-router";
-import { useState, type FormEvent, type KeyboardEvent } from "react";
+import type { FormEvent, KeyboardEvent } from "react";
 import { ProvingProgress } from "@/components/mail/OperationProgress";
 import {
   CHAT_LETTER_MAX_CHARS,
@@ -8,11 +7,6 @@ import {
 } from "./chat-send";
 import styles from "./chat.module.css";
 
-export type ChatKeyState =
-  | { kind: "ready" }
-  | { kind: "missing" }
-  | { kind: "locked"; busy: boolean; error?: string };
-
 export type ChatComposerStatus = Readonly<{
   kind: "sending" | "ok" | "error";
   message: string;
@@ -24,12 +18,13 @@ type ChatComposerProps = {
   value: string;
   onChange: (value: string) => void;
   blocker: ChatSendBlocker | null;
-  keyState: ChatKeyState;
-  onUnlock: (passphrase: string) => void;
   sending: boolean;
   status: ChatComposerStatus;
   budget: ChatLetterBudget;
   onSend: () => void;
+  /** Opens the document composer for this counterparty: terms, invoices, escrow. */
+  onAttach: () => void;
+  attachDisabled?: boolean;
 };
 
 export default function ChatComposer({
@@ -37,14 +32,13 @@ export default function ChatComposer({
   value,
   onChange,
   blocker,
-  keyState,
-  onUnlock,
   sending,
   status,
   budget,
   onSend,
+  onAttach,
+  attachDisabled = false,
 }: ChatComposerProps) {
-  const [passphrase, setPassphrase] = useState("");
   const disabled = Boolean(blocker) || sending;
   const canSend = !disabled && value.trim().length > 0 && budget.fits;
 
@@ -80,42 +74,15 @@ export default function ChatComposer({
         onChange={(event) => onChange(event.target.value)}
         onKeyDown={onKeyDown}
       />
-      {keyState.kind === "locked" ? (
-        <div className={styles.unlockForm}>
-          <span>
-            This mailbox is passphrase-wrapped on this device. Unlock it for
-            this tab to sign and send.
-            {keyState.error ? ` ${keyState.error}` : ""}
-          </span>
-          <input
-            type="password"
-            aria-label="Mailbox passphrase"
-            autoComplete="current-password"
-            value={passphrase}
-            disabled={keyState.busy}
-            onChange={(event) => setPassphrase(event.target.value)}
-          />
-          <button
-            type="button"
-            disabled={keyState.busy || passphrase.length < 8}
-            onClick={() => {
-              onUnlock(passphrase);
-              setPassphrase("");
-            }}
-          >
-            {keyState.busy ? "Unlocking…" : "Unlock for this tab"}
-          </button>
-        </div>
-      ) : null}
       <div className={styles.composerRow}>
         <span className={styles.composerMeta}>
           {blocker ? (
             <>
               {blocker.message}
-              {blocker.kind === "key" && keyState.kind === "missing" ? (
+              {blocker.kind === "key" ? (
                 <>
                   {" "}
-                  <Link to="/mail/inbox">Set one up in Mailbox</Link>
+                  <a href="#mailbox-key-setup">Set up a mailbox key</a>
                 </>
               ) : null}
             </>
@@ -127,9 +94,19 @@ export default function ChatComposer({
             </>
           )}
         </span>
-        <button type="submit" className={styles.sendButton} disabled={!canSend}>
-          {sending ? "Sending…" : "Send encrypted"}
-        </button>
+        <span className={styles.composerActions}>
+          <button
+            type="button"
+            className={styles.attachButton}
+            disabled={attachDisabled || sending}
+            onClick={onAttach}
+          >
+            Attach terms
+          </button>
+          <button type="submit" className={styles.sendButton} disabled={!canSend}>
+            {sending ? "Sending…" : "Send encrypted"}
+          </button>
+        </span>
       </div>
       {status ? (
         <p
diff --git a/src/app/chat/ChatContextPanel.tsx b/src/app/chat/ChatContextPanel.tsx
index b8317f1..d8f841d 100644
--- a/src/app/chat/ChatContextPanel.tsx
+++ b/src/app/chat/ChatContextPanel.tsx
@@ -2,7 +2,7 @@ import { Link } from "@tanstack/react-router";
 import type { ReactNode } from "react";
 import type { AliasRecord } from "@/lib/aliases";
 import { storeDeskHandoff } from "@/lib/desk-handoff";
-import { ChatRecordFull } from "./ChatRecordCard";
+import { ChatRecordFull, type ChatRecordActions } from "./ChatRecordCard";
 import {
   contactDisplayName,
   type ChatContactContext,
@@ -19,13 +19,20 @@ const SECTION_LABELS: Readonly<Record<ChatContextSection, string>> = {
 };
 
 function identityNote(conversation: ChatConversation): string {
-  switch (conversation.contact.nameSource) {
+  const { contact } = conversation;
+  if (contact.kind === "self") {
+    return "Backups and self-addressed copies this wallet posted to its own mailbox. Restore one from the conversation; post new ones from the mailbox tools.";
+  }
+  if (contact.kind === "sealed") {
+    return "MessagePosted carries no sender. Name the thread from the conversation to file it under a counterparty; until then it stays here.";
+  }
+  switch (contact.nameSource) {
     case "address-book":
       return "Saved counterparty. The label is device-encrypted and is never authentication.";
     case "alias":
       return "Local alias. A label on this device, never authentication.";
     default:
-      return "No local name. This address came from a Sent copy or an unauthenticated payload claim.";
+      return "No local name. This address came from a Sent copy, a name assigned on this device, or an unauthenticated payload claim.";
   }
 }
 
@@ -34,6 +41,11 @@ function expiryLabel(at: number): string {
   return new Date(at * 1_000).toLocaleString();
 }
 
+function safeOfferIndex(index: string | undefined): number | undefined {
+  const value = Number(index);
+  return Number.isSafeInteger(value) && value >= 0 ? value : undefined;
+}
+
 function ContextSection({
   title,
   entries,
@@ -98,6 +110,8 @@ type ChatContextPanelProps = {
   chainId: string;
   handoffsEnabled: boolean;
   aliases: readonly AliasRecord[];
+  /** The value actions the mailbox desk offers, so a record acts from here too. */
+  actions: ChatRecordActions;
   onClose: () => void;
 };
 
@@ -111,13 +125,21 @@ export default function ChatContextPanel({
   chainId,
   handoffsEnabled,
   aliases,
+  actions,
   onClose,
 }: ChatContextPanelProps) {
   const { contact } = conversation;
   const name = contactDisplayName(contact);
-  const handoff = (kind: "rfq" | "mail") => {
+  const identityAddress =
+    contact.kind === "self" ? selfAddress : (contact.address ?? null);
+  const selectedItem = selectedEntry?.itemId
+    ? (conversation.items.find((item) => item.id === selectedEntry.itemId) ??
+      null)
+    : null;
+  const handoff = () => {
+    if (!contact.address) return;
     try {
-      storeDeskHandoff(window.sessionStorage, kind, contact.address, {
+      storeDeskHandoff(window.sessionStorage, "rfq", contact.address, {
         account: selfAddress,
         chainId,
       });
@@ -215,7 +237,6 @@ export default function ChatContextPanel({
             {selectedEntry.record?.needsAction ? (
               <p className={styles.recordAction}>
                 <span>{selectedEntry.record.needsAction}</span>
-                <Link to="/mail/inbox">Open Mailbox</Link>
               </p>
             ) : null}
             <div className={styles.detailActions}>
@@ -237,8 +258,12 @@ export default function ChatContextPanel({
               <div className={styles.recordFull}>
                 <ChatRecordFull
                   record={selectedEntry.record}
-                  own={selectedEntry.direction === "outgoing"}
                   aliases={aliases}
+                  linkAuthenticity={selectedItem?.message?.linkAuthenticity}
+                  actions={{
+                    ...actions,
+                    offerIndex: safeOfferIndex(selectedItem?.message?.index),
+                  }}
                 />
               </div>
             ) : null}
@@ -246,26 +271,29 @@ export default function ChatContextPanel({
         ) : (
           <>
             <section className={styles.identity} aria-label="Wallet identity">
-              <p className={styles.kicker}>WALLET IDENTITY</p>
+              <p className={styles.kicker}>
+                {contact.kind === "counterparty"
+                  ? "WALLET IDENTITY"
+                  : contact.kind === "self"
+                    ? "YOUR MAILBOX"
+                    : "SEALED THREAD"}
+              </p>
               <h2>
                 <bdi>{name}</bdi>
               </h2>
-              <code>{contact.address}</code>
+              {identityAddress ? <code>{identityAddress}</code> : null}
               <p className={styles.identityNote}>{identityNote(conversation)}</p>
               <div className={styles.identityActions}>
-                {handoffsEnabled ? (
-                  <>
-                    <Link to="/rfq" hash="desk" onClick={() => handoff("rfq")}>
-                      New RFQ
-                    </Link>
-                    <Link to="/mail/inbox" onClick={() => handoff("mail")}>
-                      Encrypted Mail
-                    </Link>
-                  </>
+                {handoffsEnabled && contact.kind === "counterparty" ? (
+                  <Link to="/rfq" hash="desk" onClick={handoff}>
+                    New RFQ
+                  </Link>
+                ) : null}
+                {contact.kind === "counterparty" ? (
+                  <Link to="/contacts">
+                    {contact.saved ? "Counterparties" : "Save to Counterparties"}
+                  </Link>
                 ) : null}
-                <Link to="/contacts">
-                  {contact.saved ? "Counterparties" : "Save to Counterparties"}
-                </Link>
               </div>
             </section>
 
@@ -297,8 +325,8 @@ export default function ChatContextPanel({
               empty={
                 <>
                   No escrow announcement with {name} on this device. Escrow
-                  state is read from the contract by Mailbox, never proven by
-                  a message.
+                  state is read from the contract when this mailbox checks for
+                  mail, never proven by a message.
                 </>
               }
               selectedEntryId={null}
diff --git a/src/app/chat/ChatConversationRail.tsx b/src/app/chat/ChatConversationRail.tsx
index 05aca84..f4f4111 100644
--- a/src/app/chat/ChatConversationRail.tsx
+++ b/src/app/chat/ChatConversationRail.tsx
@@ -1,4 +1,4 @@
-import { Link } from "@tanstack/react-router";
+import type { ReactNode } from "react";
 import { shortenFelt } from "@/components/mail/correspondent";
 import { contactDisplayName, type ChatConversation } from "./chat-model";
 import styles from "./chat.module.css";
@@ -31,8 +31,13 @@ export function chatTimeLabel(
   };
 }
 
-function nameSourceLabel(conversation: ChatConversation): string {
-  switch (conversation.contact.nameSource) {
+/** The second line under a name: where the name came from, or what the row is. */
+function contactNote(conversation: ChatConversation): string {
+  const { contact } = conversation;
+  if (contact.kind === "self") return "Backups and self-addressed copies";
+  if (contact.kind === "sealed") return "Unnamed thread · name it to file it";
+  if (contact.label && contact.address) return shortenFelt(contact.address);
+  switch (contact.nameSource) {
     case "address-book":
       return "Saved counterparty";
     case "alias":
@@ -45,22 +50,24 @@ function nameSourceLabel(conversation: ChatConversation): string {
 type ChatConversationRailProps = {
   conversations: readonly ChatConversation[];
   totalCount: number;
-  selectedAddress: string | null;
+  selectedKey: string | null;
   search: string;
   onSearchChange: (value: string) => void;
   needsActionOnly: boolean;
   onNeedsActionChange: (value: boolean) => void;
   needsActionCount: number;
-  /** What blocks this desk, so the rail answers what the page answers. */
-  gate: "wallet" | null;
+  /** What blocks this mailbox, so the rail answers what the page answers. */
+  gate: "wallet" | "key" | null;
   unattributedSent: number;
-  onSelect: (address: string) => void;
+  onSelect: (key: string) => void;
+  /** The mailbox tools, rendered under the conversations. */
+  children?: ReactNode;
 };
 
 export default function ChatConversationRail({
   conversations,
   totalCount,
-  selectedAddress,
+  selectedKey,
   search,
   onSearchChange,
   needsActionOnly,
@@ -69,8 +76,10 @@ export default function ChatConversationRail({
   gate,
   unattributedSent,
   onSelect,
+  children,
 }: ChatConversationRailProps) {
   const searching = search.trim().length > 0;
+  const walletGate = gate === "wallet";
   return (
     <section className={styles.rail} aria-label="Conversations">
       <header className={styles.railHeading}>
@@ -95,14 +104,14 @@ export default function ChatConversationRail({
           value={search}
           placeholder="Search counterparties and records"
           aria-label="Search conversations"
-          disabled={gate !== null}
+          disabled={walletGate}
           onChange={(event) => onSearchChange(event.target.value)}
         />
         <button
           type="button"
           className={styles.railFilter}
           aria-pressed={needsActionOnly}
-          disabled={gate !== null}
+          disabled={walletGate}
           onClick={() => onNeedsActionChange(!needsActionOnly)}
         >
           <span>Needs action only</span>
@@ -110,128 +119,130 @@ export default function ChatConversationRail({
         </button>
       </div>
 
-      {gate === null && totalCount ? (
-        <div className={styles.railNote}>
-          <strong>Device-local records</strong>
-          <span>
-            Sent copies, imported requests and the deal state Mailbox saved,
-            grouped by counterparty. Nothing here is fetched or posted.
-          </span>
-        </div>
-      ) : null}
+      <div className={styles.railScroll}>
+        {!walletGate && totalCount ? (
+          <div className={styles.railNote}>
+            <strong>Encrypted records on this device</strong>
+            <span>
+              Letters, offers, invoices and escrows grouped by counterparty.
+              The chain is read when you check for mail; nothing here is
+              settlement authority.
+            </span>
+          </div>
+        ) : null}
 
-      {conversations.length ? (
-        <ol className={styles.conversationList}>
-          {conversations.map((conversation) => {
-            const { contact, latest, unreadCount } = conversation;
-            const name = contactDisplayName(contact);
-            const selected = selectedAddress === contact.address;
-            const time = chatTimeLabel(latest?.at);
-            const preview = latest
-              ? latest.preview
-              : "No records with this counterparty on this device yet.";
-            return (
-              <li key={contact.address}>
-                <button
-                  type="button"
-                  className={styles.conversationItem}
-                  aria-current={selected ? "true" : undefined}
-                  aria-label={`${unreadCount ? `${unreadCount} unread. ` : ""}${name}. ${
-                    latest ? `${latest.label}. ` : ""
-                  }${preview}`}
-                  onClick={() => onSelect(contact.address)}
-                >
-                  <span className={styles.conversationTop}>
-                    <span className={styles.conversationName}>
-                      <strong title={contact.address}>
-                        <bdi>{name}</bdi>
-                      </strong>
-                      <small>
-                        {contact.label
-                          ? shortenFelt(contact.address)
-                          : nameSourceLabel(conversation)}
-                      </small>
-                    </span>
-                    <time
-                      className={styles.conversationTime}
-                      dateTime={time.dateTime}
-                    >
-                      {time.label}
-                    </time>
-                  </span>
-                  <span className={styles.conversationPreview}>
-                    {latest?.direction === "outgoing" ? <em>You: </em> : null}
-                    {preview}
-                  </span>
-                  <span className={styles.conversationMeta}>
-                    {latest ? (
-                      <em className={styles.typeBadge}>{latest.label}</em>
-                    ) : null}
-                    {conversation.needsAction ? (
-                      <em className={styles.actionBadge}>Needs action</em>
-                    ) : null}
-                    {unreadCount ? (
-                      <span className={styles.unread}>
-                        {unreadCount} unread
+        {conversations.length ? (
+          <ol className={styles.conversationList}>
+            {conversations.map((conversation) => {
+              const { contact, latest, unreadCount } = conversation;
+              const name = contactDisplayName(contact);
+              const selected = selectedKey === contact.key;
+              const time = chatTimeLabel(latest?.at);
+              const preview = latest
+                ? latest.preview
+                : "No records with this counterparty on this device yet.";
+              return (
+                <li key={contact.key}>
+                  <button
+                    type="button"
+                    className={styles.conversationItem}
+                    data-kind={contact.kind}
+                    aria-current={selected ? "true" : undefined}
+                    aria-label={`${unreadCount ? `${unreadCount} unread. ` : ""}${name}. ${
+                      latest ? `${latest.label}. ` : ""
+                    }${preview}`}
+                    onClick={() => onSelect(contact.key)}
+                  >
+                    <span className={styles.conversationTop}>
+                      <span className={styles.conversationName}>
+                        <strong title={contact.address ?? undefined}>
+                          <bdi>{name}</bdi>
+                        </strong>
+                        <small>{contactNote(conversation)}</small>
                       </span>
-                    ) : latest?.direction === "incoming" ? (
-                      <span className={styles.opened}>Opened</span>
-                    ) : null}
-                  </span>
-                </button>
-              </li>
-            );
-          })}
-        </ol>
-      ) : (
-        <div className={styles.railEmpty}>
-          <span className={styles.railGlyph} aria-hidden="true">
-            {searching ? "⌕" : gate ? "⚿" : "✉"}
-          </span>
-          {gate ? (
-            <>
-              <strong>Wallet required</strong>
-              <span>
-                Chat is keyed to a wallet and reads only this device&apos;s
-                records for it. Connect one to open it.
-              </span>
-            </>
-          ) : searching ? (
-            <>
-              <strong>No conversation matches</strong>
-              <span>
-                Search reads only names, addresses and records already on this
-                device.
-              </span>
-            </>
-          ) : needsActionOnly ? (
-            <>
-              <strong>Nothing needs your action</strong>
-              <span>
-                No open offer, unpaid request or fillable escrow is waiting on
-                this wallet.
-              </span>
-            </>
-          ) : (
-            <>
-              <strong>No counterparties yet</strong>
-              <span>
-                Save one under Counterparties, or send a letter from Mailbox.
-                Both appear here.
-              </span>
-            </>
-          )}
-        </div>
-      )}
+                      <time
+                        className={styles.conversationTime}
+                        dateTime={time.dateTime}
+                      >
+                        {time.label}
+                      </time>
+                    </span>
+                    <span className={styles.conversationPreview}>
+                      {latest?.direction === "outgoing" ? <em>You: </em> : null}
+                      {preview}
+                    </span>
+                    <span className={styles.conversationMeta}>
+                      {latest ? (
+                        <em className={styles.typeBadge}>{latest.label}</em>
+                      ) : null}
+                      {conversation.needsAction ? (
+                        <em className={styles.actionBadge}>Needs action</em>
+                      ) : null}
+                      {unreadCount ? (
+                        <span className={styles.unread}>
+                          {unreadCount} unread
+                        </span>
+                      ) : latest?.direction === "incoming" ? (
+                        <span className={styles.opened}>Opened</span>
+                      ) : null}
+                    </span>
+                  </button>
+                </li>
+              );
+            })}
+          </ol>
+        ) : (
+          <div className={styles.railEmpty}>
+            <span className={styles.railGlyph} aria-hidden="true">
+              {searching ? "⌕" : walletGate ? "⚿" : "✉"}
+            </span>
+            {walletGate ? (
+              <>
+                <strong>Wallet required</strong>
+                <span>
+                  Chat is keyed to a wallet and reads only this device&apos;s
+                  records for it. Connect one to open it.
+                </span>
+              </>
+            ) : searching ? (
+              <>
+                <strong>No conversation matches</strong>
+                <span>
+                  Search reads only names, addresses and records already on
+                  this device.
+                </span>
+              </>
+            ) : needsActionOnly ? (
+              <>
+                <strong>Nothing needs your action</strong>
+                <span>
+                  No open offer, unpaid request or fillable escrow is waiting
+                  on this wallet.
+                </span>
+              </>
+            ) : (
+              <>
+                <strong>No conversations yet</strong>
+                <span>
+                  Check for mail, write to a new address below, or save a
+                  wallet under Counterparties. Each becomes a conversation
+                  here.
+                </span>
+              </>
+            )}
+          </div>
+        )}
+
+        {unattributedSent ? (
+          <p className={styles.railFooter}>
+            {unattributedSent} Sent cop{unattributedSent === 1 ? "y" : "ies"}{" "}
+            from an earlier version carr{unattributedSent === 1 ? "ies" : "y"}{" "}
+            no stored recipient and cannot be filed under a counterparty.
+          </p>
+        ) : null}
 
-      {unattributedSent ? (
-        <p className={styles.railFooter}>
-          {unattributedSent} Sent cop{unattributedSent === 1 ? "y" : "ies"}{" "}
-          carr{unattributedSent === 1 ? "ies" : "y"} no stored recipient and
-          sta{unattributedSent === 1 ? "ys" : "y"} in{" "}
-          <Link to="/mail/inbox">Mailbox</Link>.
-        </p>
-      ) : null}
+        {children}
+      </div>
     </section>
   );
 }
diff --git a/src/app/chat/ChatMailboxTools.tsx b/src/app/chat/ChatMailboxTools.tsx
new file mode 100644
index 0000000..c02e5db
--- /dev/null
+++ b/src/app/chat/ChatMailboxTools.tsx
@@ -0,0 +1,302 @@
+import { useState, type FormEvent } from "react";
+import { Link } from "@tanstack/react-router";
+import AddressBookField from "@/components/address-book/AddressBookField";
+import { ScanProgress } from "@/components/mail/OperationProgress";
+import type { ThreadActionState } from "@/components/mail/message";
+import { MAIL_RECOVERY_PHRASE_AUTHORITY_NOTICE } from "@/lib/mail-authority-copy";
+import type { CompositeDraft } from "@/lib/drafts";
+import { chatTimeLabel } from "./ChatConversationRail";
+import styles from "./chat.module.css";
+
+function draftPreview(draft: CompositeDraft): string {
+  const body = draft.body.replace(/\s+/g, " ").trim();
+  if (body) return body;
+  if (draft.attachments.length) {
+    return draft.attachments
+      .map((attachment) =>
+        attachment.type === "payment_request"
+          ? "Invoice"
+          : attachment.type === "escrow_fund"
+            ? "Escrow"
+            : attachment.type === "offer"
+              ? "Offer"
+              : "Payment",
+      )
+      .join(" + ");
+  }
+  return "Blank document";
+}
+
+export type ChatMailboxToolsProps = {
+  selfAddress: string;
+  gate: "wallet" | "key" | null;
+  keyLoaded: boolean;
+  seedLoaded: boolean;
+  helperConfigured: boolean;
+  scanning: boolean;
+  scanKind: "idle" | "scanning" | "ok" | "error";
+  scanMessage: string;
+  scanProgress: { pages: number; events: number; maxPages: number };
+  scanCursorDescription: string | null;
+  onScan: (direction: "newer" | "older") => void;
+  drafts: readonly CompositeDraft[];
+  onOpenDraft: (draft: CompositeDraft) => void;
+  onDeleteDraft: (draftId: string) => void;
+  onStartConversation: (address: string) => void;
+  /** Opens the document composer: terms, invoices, escrow, several recipients. */
+  onNewDocument: (recipient?: string) => void;
+  actionStates: Readonly<Record<string, ThreadActionState>>;
+  onContactBackup: () => void;
+  onRfqHistoryBackup: () => void;
+  rfqAutoBackupEnabled: boolean;
+  onRfqAutoBackupChange: (enabled: boolean) => void;
+  onLock: () => void;
+  onForget: () => void;
+};
+
+/**
+ * What used to be the mailbox sidebar: checking the chain for new records,
+ * device-private drafts, encrypted self-backups and device safety. It sits
+ * under the conversations because it is about the whole mailbox, not one
+ * counterparty.
+ */
+export default function ChatMailboxTools({
+  selfAddress,
+  gate,
+  keyLoaded,
+  seedLoaded,
+  helperConfigured,
+  scanning,
+  scanKind,
+  scanMessage,
+  scanProgress,
+  scanCursorDescription,
+  onScan,
+  drafts,
+  onOpenDraft,
+  onDeleteDraft,
+  onStartConversation,
+  onNewDocument,
+  actionStates,
+  onContactBackup,
+  onRfqHistoryBackup,
+  rfqAutoBackupEnabled,
+  onRfqAutoBackupChange,
+  onLock,
+  onForget,
+}: ChatMailboxToolsProps) {
+  const [newAddress, setNewAddress] = useState("");
+  const backupBusy =
+    actionStates["contacts:backup"]?.pending ||
+    actionStates["rfq-resume:backup"]?.pending;
+
+  function startConversation(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    if (!newAddress.trim()) return;
+    onStartConversation(newAddress);
+    setNewAddress("");
+  }
+
+  return (
+    <div className={styles.tools} aria-label="Mailbox tools">
+      <section className={styles.toolsSection} aria-labelledby="chat-scan-title">
+        <div className={styles.toolsHead}>
+          <strong id="chat-scan-title">Check for mail</strong>
+          <span className={styles.toolsKeyState}>
+            {gate === "wallet"
+              ? "NO WALLET"
+              : keyLoaded
+                ? "KEY LOADED"
+                : "KEY NOT LOADED"}
+          </span>
+        </div>
+        <div className={styles.toolsActions}>
+          <button
+            type="button"
+            onClick={() => onScan("newer")}
+            disabled={!keyLoaded || scanning}
+          >
+            {scanning ? "Checking…" : "Check for new mail"}
+          </button>
+          <button
+            type="button"
+            onClick={() => onScan("older")}
+            disabled={!keyLoaded || scanning}
+          >
+            Load older mail
+          </button>
+        </div>
+        <ScanProgress
+          scanning={scanning}
+          pages={scanProgress.pages}
+          maxPages={scanProgress.maxPages}
+          events={scanProgress.events}
+          phase={scanMessage}
+        />
+        {gate ? (
+          <p className={styles.toolsNote}>
+            {gate === "wallet"
+              ? "Connect a wallet before checking for mail."
+              : "Load this device's mailbox key before checking for mail."}
+          </p>
+        ) : null}
+        {scanCursorDescription ? (
+          <p className={styles.toolsNote}>{scanCursorDescription}</p>
+        ) : null}
+        {!scanning && scanMessage ? (
+          <p
+            className={styles.toolsNote}
+            data-kind={scanKind === "error" ? "error" : undefined}
+            role={scanKind === "error" ? "alert" : "status"}
+          >
+            {scanMessage}
+          </p>
+        ) : null}
+      </section>
+
+      <details className={styles.toolsDisclosure}>
+        <summary>Write to a new address</summary>
+        <form className={styles.toolsForm} onSubmit={startConversation}>
+          <AddressBookField
+            selfAddress={selfAddress}
+            inputAriaLabel="New conversation address"
+            label="Counterparty"
+            value={newAddress}
+            onChange={setNewAddress}
+            placeholder="0x… or saved label"
+            disabled={gate === "wallet"}
+          />
+          <div className={styles.toolsActions} data-variant="plain">
+            <button type="submit" disabled={gate === "wallet" || !newAddress.trim()}>
+              Open conversation
+            </button>
+            <button
+              type="button"
+              disabled={gate === "wallet"}
+              onClick={() => onNewDocument(newAddress.trim() || undefined)}
+            >
+              New document
+            </button>
+          </div>
+        </form>
+      </details>
+
+      <details className={styles.toolsDisclosure}>
+        <summary>
+          Drafts <strong>{drafts.length}</strong>
+        </summary>
+        {drafts.length ? (
+          <ul className={styles.draftList} aria-label="Device-private drafts">
+            {drafts.map((draft) => {
+              const time = chatTimeLabel(draft.updatedAt);
+              return (
+                <li key={draft.id}>
+                  <button
+                    type="button"
+                    className={styles.draftOpen}
+                    onClick={() => onOpenDraft(draft)}
+                    aria-label={`Open draft: ${draftPreview(draft)}`}
+                  >
+                    <span>{draftPreview(draft)}</span>
+                    <small>
+                      {draft.recipient ? draft.recipient.split(/[\n,;]+/)[0] : "No recipient"} ·{" "}
+                      <time dateTime={time.dateTime}>{time.label}</time>
+                    </small>
+                  </button>
+                  <button
+                    type="button"
+                    className={styles.draftDelete}
+                    onClick={() => onDeleteDraft(draft.id)}
+                    aria-label={`Delete draft: ${draftPreview(draft)}`}
+                  >
+                    Delete
+                  </button>
+                </li>
+              );
+            })}
+          </ul>
+        ) : (
+          <p className={styles.toolsNote}>
+            Drafts stay in this browser profile, not encrypted at rest, until
+            they are sent or deleted.
+          </p>
+        )}
+      </details>
+
+      <details className={styles.toolsDisclosure}>
+        <summary>Encrypted mailbox recovery</summary>
+        <div className={styles.toolsBody}>
+          <p className={styles.toolsNote}>
+            Post authenticated contact or RFQ-history self-mail. Oversized
+            ciphertext uses a verified CID pointer. The same wallet locates it;
+            the mailbox recovery phrase decrypts it. Wallet alone is not enough.{" "}
+            {MAIL_RECOVERY_PHRASE_AUTHORITY_NOTICE}
+          </p>
+          <button
+            type="button"
+            disabled={!keyLoaded || !seedLoaded || !helperConfigured || backupBusy}
+            onClick={onContactBackup}
+          >
+            {actionStates["contacts:backup"]?.pending
+              ? "Backing up…"
+              : "Back up contacts to this mailbox"}
+          </button>
+          {actionStates["contacts:backup"]?.message ? (
+            <p className={styles.toolsNote} role="status">
+              {actionStates["contacts:backup"].message}
+            </p>
+          ) : null}
+          <button
+            type="button"
+            disabled={!keyLoaded || !seedLoaded || !helperConfigured || backupBusy}
+            onClick={onRfqHistoryBackup}
+          >
+            {actionStates["rfq-resume:backup"]?.pending
+              ? "Backing up…"
+              : "Back up RFQ history"}
+          </button>
+          {actionStates["rfq-resume:backup"]?.message ? (
+            <p className={styles.toolsNote} role="status">
+              {actionStates["rfq-resume:backup"].message}
+            </p>
+          ) : null}
+          <label className={styles.toolsCheck}>
+            <input
+              type="checkbox"
+              checked={rfqAutoBackupEnabled}
+              disabled={gate === "wallet"}
+              onChange={(event) => onRfqAutoBackupChange(event.target.checked)}
+            />{" "}
+            Automatically back up RFQ history after settlement (opt in)
+          </label>
+          <p className={styles.toolsNote}>
+            Restore from the backups filed under <em>This mailbox</em> above.
+          </p>
+        </div>
+      </details>
+
+      <details className={styles.toolsDisclosure}>
+        <summary>Device safety</summary>
+        <div className={styles.toolsBody}>
+          <p className={styles.toolsNote}>
+            Disconnecting is not logout: drafts, Sent copies, and aliases stay
+            in this browser profile.
+          </p>
+          <button type="button" onClick={onLock}>
+            Lock mailbox this session
+          </button>
+          <button type="button" className={styles.toolsDanger} onClick={onForget}>
+            Forget this device
+          </button>
+        </div>
+      </details>
+
+      <p className={styles.railFooter}>
+        <Link to="/contacts">Counterparties</Link> keeps the labels;{" "}
+        <a href="https://github.com/gstohl/app20" target="_blank" rel="noreferrer">
+          GitHub ↗
+        </a>
+      </p>
+    </div>
+  );
+}
diff --git a/src/app/chat/ChatRecordCard.tsx b/src/app/chat/ChatRecordCard.tsx
index 53cb110..69de08b 100644
--- a/src/app/chat/ChatRecordCard.tsx
+++ b/src/app/chat/ChatRecordCard.tsx
@@ -1,66 +1,163 @@
-import { Link } from "@tanstack/react-router";
+import { useEffect, useState } from "react";
 import EscrowCard from "@/components/mail/EscrowCard";
 import InvoiceCard from "@/components/mail/InvoiceCard";
 import OfferCard from "@/components/mail/OfferCard";
 import ReceiptCard from "@/components/mail/ReceiptCard";
+import type { ThreadActionState } from "@/components/mail/message";
+import { feltEquals } from "@/lib/addresses";
 import { findAliasByAddress, type AliasRecord } from "@/lib/aliases";
+import type { EscrowFundPayload } from "@/lib/escrow";
+import {
+  invoicePaymentMaturity,
+  type OfferPayload,
+  type PaymentRequestPayload,
+} from "@/lib/otc";
 import type { PaymentLinkAuthenticity } from "@/lib/payment-link";
 import type { ChatRecord } from "./chat-model";
 import styles from "./chat.module.css";
 
+/**
+ * The value actions a record can offer, exactly as the mailbox desk exposes
+ * them. A missing handler means the action does not exist on this rail; the
+ * card decides from ownership and record state whether to show the rest.
+ */
+export type ChatRecordActions = Readonly<{
+  selfAddress: string;
+  actionStates: Readonly<Record<string, ThreadActionState>>;
+  invoiceMaturityHeadBlock?: number;
+  /** The mailbox index of the record an offer arrived in. */
+  offerIndex?: number;
+  onAccept?: (offer: OfferPayload, offerIndex?: number) => void;
+  onDecline?: (offer: OfferPayload) => void;
+  onPostReceipt?: (offer: OfferPayload) => void;
+  onPay?: (request: PaymentRequestPayload) => void;
+  onPayPrivatelyWithStrk?: (request: PaymentRequestPayload) => void;
+  onEscrowFill?: (fund: EscrowFundPayload) => void;
+  onEscrowClaim?: (fund: EscrowFundPayload) => void;
+  onEscrowTimeout?: (fund: EscrowFundPayload) => void;
+}>;
+
 type RecordProps = {
   record: ChatRecord;
-  /** This wallet issued the record. */
-  own: boolean;
   aliases: readonly AliasRecord[];
   linkAuthenticity?: PaymentLinkAuthenticity;
+  actions?: ChatRecordActions;
 };
 
 /**
- * The complete Mailbox card for a record, read-only: every caveat Mailbox
- * prints is printed here, and no value action is offered from Chat.
+ * The complete card for a record with every caveat and, when the desk offers
+ * one, its action. Ownership comes from the payload, never from the sender.
  */
 export function ChatRecordFull({
   record,
-  own,
   aliases,
   linkAuthenticity,
+  actions,
 }: RecordProps) {
+  const self = actions?.selfAddress ?? "";
   if (record.offer) {
+    const { offer, deal } = record;
+    const ownOffer = Boolean(self) && feltEquals(self, offer.offerer);
+    const action = actions?.actionStates[`deal:${offer.dealId}`];
     return (
       <OfferCard
-        offer={record.offer}
-        alias={findAliasByAddress(aliases, record.offer.offerer)?.label}
-        status={record.deal?.status}
-        settlementVerified={record.deal?.settlementVerified}
+        offer={offer}
+        alias={findAliasByAddress(aliases, offer.offerer)?.label}
+        status={deal?.status}
+        settlementVerified={deal?.settlementVerified}
         unverifiedClaim={Boolean(
-          record.deal?.counterpartyAcceptClaim ||
-            record.deal?.counterpartyReceiptClaim,
+          deal?.counterpartyAcceptClaim || deal?.counterpartyReceiptClaim,
         )}
+        busy={action?.pending}
+        actionMessage={action?.message}
+        actionStartedAt={action?.startedAt}
+        onAccept={
+          ownOffer || !actions?.onAccept
+            ? undefined
+            : () => actions.onAccept?.(offer, actions.offerIndex)
+        }
+        onDecline={
+          ownOffer || !actions?.onDecline
+            ? undefined
+            : () => actions.onDecline?.(offer)
+        }
+        onPostReceipt={
+          ownOffer ||
+          deal?.status !== "accepted" ||
+          !deal.settlementVerified ||
+          !actions?.onPostReceipt
+            ? undefined
+            : () => actions.onPostReceipt?.(offer)
+        }
       />
     );
   }
   if (record.request) {
+    const { request, payment } = record;
+    const ownRequest = Boolean(self) && feltEquals(self, request.requester);
+    const action = actions?.actionStates[`payment:${request.requestId}`];
+    const awaitingInvoiceTake =
+      payment?.paymentOperation?.state === "awaiting-note-maturity";
+    const maturity =
+      awaitingInvoiceTake && payment
+        ? (invoicePaymentMaturity(
+            payment,
+            actions?.invoiceMaturityHeadBlock ?? 0,
+          ) ?? undefined)
+        : undefined;
     return (
       <InvoiceCard
-        request={record.request}
-        alias={findAliasByAddress(aliases, record.request.requester)?.label}
-        status={record.payment?.status}
-        paymentVerified={record.payment?.paymentVerified}
-        unverifiedClaim={Boolean(record.payment?.counterpartyPaymentClaim)}
-        showPaymentActions={false}
-        showShareAction={false}
-        linkAuthenticity={linkAuthenticity ?? record.payment?.linkAuthenticity}
+        request={request}
+        alias={findAliasByAddress(aliases, request.requester)?.label}
+        status={payment?.status}
+        paymentVerified={payment?.paymentVerified}
+        unverifiedClaim={Boolean(payment?.counterpartyPaymentClaim)}
+        busy={action?.pending}
+        actionMessage={action?.message}
+        actionStartedAt={action?.startedAt}
+        maturity={maturity}
+        linkAuthenticity={linkAuthenticity ?? payment?.linkAuthenticity}
+        onPay={
+          ownRequest || !actions?.onPay
+            ? undefined
+            : () => actions.onPay?.(request)
+        }
+        onPayPrivatelyWithStrk={
+          ownRequest || awaitingInvoiceTake || !actions?.onPayPrivatelyWithStrk
+            ? undefined
+            : () => actions.onPayPrivatelyWithStrk?.(request)
+        }
       />
     );
   }
   if (record.fund) {
+    const { fund } = record;
+    const ownDeal = Boolean(self) && feltEquals(self, fund.maker);
+    const action = actions?.actionStates[`escrow:${fund.dealId}`];
     return (
       <EscrowCard
-        fund={record.fund}
+        fund={fund}
         status={record.escrow?.chainStatus}
         termsVerified={record.escrowTermsVerified}
-        ownDeal={own}
+        ownDeal={ownDeal}
+        busy={action?.pending}
+        actionMessage={action?.message}
+        actionStartedAt={action?.startedAt}
+        onFill={
+          ownDeal || !actions?.onEscrowFill
+            ? undefined
+            : () => actions.onEscrowFill?.(fund)
+        }
+        onClaim={
+          ownDeal && actions?.onEscrowClaim
+            ? () => actions.onEscrowClaim?.(fund)
+            : undefined
+        }
+        onTimeout={
+          ownDeal && actions?.onEscrowTimeout
+            ? () => actions.onEscrowTimeout?.(fund)
+            : undefined
+        }
       />
     );
   }
@@ -69,7 +166,7 @@ export function ChatRecordFull({
       <ReceiptCard
         receipt={record.receipt}
         standalonePayment={record.receiptKind === "payment"}
-        locallySubmitted={own}
+        locallySubmitted={record.own}
       />
     );
   }
@@ -78,11 +175,28 @@ export function ChatRecordFull({
 
 export default function ChatRecordCard({
   record,
-  own,
   aliases,
   linkAuthenticity,
-  defaultOpen = false,
+  actions,
+  defaultOpen,
 }: RecordProps & { defaultOpen?: boolean }) {
+  /* A record that needs action opens on its own, and so does one the desk
+     is acting on or has just reported on: its progress and outcome live in
+     the full card. Nothing closes a card behind the person's back, and a
+     card rebuilt from a newer copy of the same record reopens the same way. */
+  const actionKey = record.offer
+    ? `deal:${record.offer.dealId}`
+    : record.request
+      ? `payment:${record.request.requestId}`
+      : record.fund
+        ? `escrow:${record.fund.dealId}`
+        : null;
+  const acting = Boolean(actionKey && actions?.actionStates[actionKey]);
+  const wantsOpen = defaultOpen ?? (record.needsAction !== null || acting);
+  const [open, setOpen] = useState(wantsOpen);
+  useEffect(() => {
+    if (wantsOpen) setOpen(true);
+  }, [wantsOpen]);
   return (
     <article
       className={styles.recordCard}
@@ -91,7 +205,7 @@ export default function ChatRecordCard({
     >
       <div className={styles.recordHead}>
         <span className={styles.recordTitle}>
-          {record.facts.title} · {own ? "sent" : "received"}
+          {record.facts.title} · {record.own ? "sent" : "received"}
         </span>
         <span className={styles.recordStatus}>{record.facts.status}</span>
       </div>
@@ -99,17 +213,20 @@ export default function ChatRecordCard({
       {record.needsAction ? (
         <p className={styles.recordAction}>
           <span>{record.needsAction}</span>
-          <Link to="/mail/inbox">Open Mailbox</Link>
         </p>
       ) : null}
-      <details className={styles.recordDetails} open={defaultOpen || undefined}>
+      <details
+        className={styles.recordDetails}
+        open={open}
+        onToggle={(event) => setOpen(event.currentTarget.open)}
+      >
         <summary>Full record</summary>
         <div className={styles.recordFull}>
           <ChatRecordFull
             record={record}
-            own={own}
             aliases={aliases}
             linkAuthenticity={linkAuthenticity}
+            actions={actions}
           />
         </div>
       </details>
diff --git a/src/app/chat/ChatTimeline.tsx b/src/app/chat/ChatTimeline.tsx
index e0c976c..e0ba966 100644
--- a/src/app/chat/ChatTimeline.tsx
+++ b/src/app/chat/ChatTimeline.tsx
@@ -1,7 +1,24 @@
+import { useState } from "react";
+import AddressBookField from "@/components/address-book/AddressBookField";
+import { ChainRecordPanel } from "@/components/mail/ChainRecordPanel";
+import ContactSnapshotCard from "@/components/mail/ContactSnapshotCard";
+import MemoCard, { type MemoCardProps } from "@/components/mail/MemoCard";
+import type { LocalMailMessage } from "@/components/mail/message";
 import type { AliasRecord } from "@/lib/aliases";
-import ChatRecordCard from "./ChatRecordCard";
+import { MAIL_SIGNATURE_VERIFICATION_LIMIT_NOTICE } from "@/lib/mail-authority-copy";
+import { publicRecipientCount } from "@/lib/mail-recipient-count";
+import {
+  parseEscrowClaimPayload,
+  parseEscrowFillPayload,
+  parseEscrowTimeoutPayload,
+} from "@/lib/escrow";
+import { conversationFieldsFromPayload } from "@/lib/mail-thread";
+import { parseAcceptPayload, parseDeclinePayload } from "@/lib/otc";
+import { senderProofLabel, type SenderProof } from "@/lib/sender-proof";
+import ChatRecordCard, { type ChatRecordActions } from "./ChatRecordCard";
 import {
   contactDisplayName,
+  namingTarget,
   type ChatConversation,
   type ChatItem,
 } from "./chat-model";
@@ -24,31 +41,166 @@ function fullTime(at: number | undefined): { label: string; dateTime?: string }
   };
 }
 
+function safeOfferIndex(index: string | undefined): number | undefined {
+  const value = Number(index);
+  return Number.isSafeInteger(value) && value >= 0 ? value : undefined;
+}
+
+/** A counterparty's answer to a deal, rendered with the same caveats Mail gave it. */
+function memoCardProps(item: ChatItem): MemoCardProps | null {
+  const message = item.message;
+  if (!message || message.envelope.type === "unsupported") return null;
+  const { payload } = message.envelope;
+  switch (message.envelope.type) {
+    case "accept": {
+      const accept = parseAcceptPayload(payload);
+      return accept
+        ? { kind: "accept", accept, isPayment: item.label === "Payment memo" }
+        : null;
+    }
+    case "decline": {
+      const decline = parseDeclinePayload(payload);
+      return decline ? { kind: "decline", decline } : null;
+    }
+    case "escrow_fill": {
+      const update = parseEscrowFillPayload(payload);
+      return update ? { kind: "escrow", operation: "fill", update } : null;
+    }
+    case "escrow_claim": {
+      const update = parseEscrowClaimPayload(payload);
+      return update ? { kind: "escrow", operation: "claim", update } : null;
+    }
+    case "escrow_timeout": {
+      const update = parseEscrowTimeoutPayload(payload);
+      return update ? { kind: "escrow", operation: "timeout", update } : null;
+    }
+    default:
+      return null;
+  }
+}
+
 function provenanceLabel(item: ChatItem): string {
+  const { message } = item;
   switch (item.provenance) {
     case "device-sent":
-      return "Sent copy on this device";
+      return message?.threadProvenance === "device_sent_and_on_chain"
+        ? "Sent copy · opened from on-chain evidence"
+        : "Sent copy on this device";
     case "payment-link":
-      return item.message?.linkAuthenticity?.kind === "verified"
+      return message?.linkAuthenticity?.kind === "verified"
         ? "Imported link · Mail-key signature verified"
         : "Imported link · unverified";
+    case "decrypted":
+      return message
+        ? `Opened · record ${message.index}${
+            message.blockNumber === undefined
+              ? ""
+              : ` · block ${message.blockNumber}`
+          }`
+        : "Opened on this device";
     default:
-      return "Saved by Mailbox from decrypted mail";
+      return "Saved deal state from an earlier session";
   }
 }
 
+/** Naming a sealed thread's sender: a device-local label, never authentication. */
+function SenderNaming({
+  target,
+  selfAddress,
+  onAssign,
+}: {
+  target: LocalMailMessage;
+  selfAddress: string;
+  onAssign: (messageId: string, address: string) => void;
+}) {
+  const [value, setValue] = useState(target.assignedAddress ?? "");
+  return (
+    <form
+      className={styles.naming}
+      aria-label="Name this sender"
+      onSubmit={(event) => {
+        event.preventDefault();
+        if (value.trim()) onAssign(target.id, value);
+      }}
+    >
+      <p className={styles.namingNote}>
+        MessagePosted carries no sender. Name this thread on this device to
+        file it under a counterparty; the name applies to every record in the
+        thread and is never authentication.
+      </p>
+      <AddressBookField
+        selfAddress={selfAddress}
+        inputAriaLabel="Name this sender"
+        label="Name this sender"
+        value={value}
+        onChange={setValue}
+        placeholder="0x… or saved label"
+      />
+      <button type="submit" className={styles.namingSave}>
+        Save name
+      </button>
+    </form>
+  );
+}
+
+function RecordProvenance({
+  message,
+  proof,
+  onProve,
+}: {
+  message: LocalMailMessage;
+  proof?: SenderProof;
+  onProve?: (messageId: string, address: string) => void;
+}) {
+  const fields = conversationFieldsFromPayload(
+    message.envelope.type,
+    message.envelope.type === "unsupported" ? null : message.envelope.payload,
+  );
+  const assigned = message.assignedAddress;
+  if (!proof && !fields.conversationId && !(assigned && onProve)) return null;
+  return (
+    <div className={styles.entryProof}>
+      {proof ? <p>{senderProofLabel(proof)}</p> : null}
+      {fields.conversationId ? (
+        <span>Thread {fields.conversationId.slice(0, 18)}…</span>
+      ) : null}
+      {assigned && onProve ? (
+        <button type="button" onClick={() => onProve(message.id, assigned)}>
+          Inspect auth claim
+        </button>
+      ) : null}
+    </div>
+  );
+}
+
+export type ChatTimelineHandlers = Readonly<{
+  actions: ChatRecordActions;
+  proofs: Readonly<Record<string, SenderProof>>;
+  onAssign: (messageId: string, address: string) => void;
+  onProve: (messageId: string, address: string) => void;
+  onRestoreContacts?: (payload: unknown, message: LocalMailMessage) => void;
+  onRestoreBackup?: (payload: unknown, message: LocalMailMessage) => void;
+  contactRestorePending: boolean;
+  backupRestorePending: boolean;
+}>;
+
 type ChatTimelineProps = {
   conversation: ChatConversation;
   aliases: readonly AliasRecord[];
   highlightId: string | null;
+  handlers: ChatTimelineHandlers;
 };
 
 export default function ChatTimeline({
   conversation,
   aliases,
   highlightId,
+  handlers,
 }: ChatTimelineProps) {
   const name = contactDisplayName(conversation.contact);
+  const sealedTarget =
+    conversation.contact.kind === "sealed" ? namingTarget(conversation) : null;
+
   if (!conversation.items.length) {
     return (
       <div className={styles.timelineEmpty}>
@@ -56,22 +208,59 @@ export default function ChatTimeline({
         <p>
           A letter sent from here is sealed to their registered mailbox key and
           kept as a Sent copy in this browser profile. Records they send you
-          appear after Mailbox checks for mail.
+          appear after you check for new mail.
         </p>
       </div>
     );
   }
 
+  function renderBackup(item: ChatItem) {
+    const message = item.message;
+    if (!message || !item.backupKind) return null;
+    const pointer = message.envelope.type === "backup_pointer";
+    const legacy = message.envelope.type === "contact_snapshot";
+    const payload =
+      message.envelope.type === "unsupported" ? null : message.envelope.payload;
+    const restore = legacy
+      ? handlers.onRestoreContacts
+      : handlers.onRestoreBackup;
+    return (
+      <ContactSnapshotCard
+        kind={item.backupKind}
+        pointer={pointer}
+        busy={
+          legacy ? handlers.contactRestorePending : handlers.backupRestorePending
+        }
+        onMerge={restore ? () => restore(payload, message) : undefined}
+      />
+    );
+  }
+
   function renderContent(item: ChatItem) {
+    if (item.kind === "backup") return renderBackup(item);
+    if (item.kind === "memo" || item.kind === "decline") {
+      const memo = memoCardProps(item);
+      if (memo) {
+        return (
+          <div className={styles.cardStack}>
+            <MemoCard {...memo} />
+          </div>
+        );
+      }
+    }
+    const actions: ChatRecordActions = {
+      ...handlers.actions,
+      offerIndex: safeOfferIndex(item.message?.index),
+    };
     const cards = item.records.length ? (
       <div className={styles.cardStack}>
         {item.records.map((record) => (
           <ChatRecordCard
             key={record.id}
             record={record}
-            own={item.direction === "outgoing"}
             aliases={aliases}
             linkAuthenticity={item.message?.linkAuthenticity}
+            actions={actions}
           />
         ))}
       </div>
@@ -100,33 +289,87 @@ export default function ChatTimeline({
   }
 
   return (
-    <ol className={styles.timeline} aria-label={`Conversation with ${name}`}>
-      {conversation.items.map((item) => {
-        const time = fullTime(item.at);
-        return (
-          <li
-            key={item.id}
-            id={chatEntryDomId(item.id)}
-            className={styles.entry}
-            data-direction={item.direction}
-            data-highlight={highlightId === item.id ? "true" : undefined}
-          >
-            <div className={styles.entryMeta}>
-              <b>{item.direction === "outgoing" ? "You" : name}</b>
-              <span>{item.label}</span>
-              <time dateTime={time.dateTime}>{time.label}</time>
-              <span>{provenanceLabel(item)}</span>
-              {item.otherRecipients ? (
-                <span>
-                  +{item.otherRecipients} other recipient
-                  {item.otherRecipients === 1 ? "" : "s"}
-                </span>
+    <>
+      {sealedTarget ? (
+        <SenderNaming
+          target={sealedTarget}
+          selfAddress={handlers.actions.selfAddress}
+          onAssign={handlers.onAssign}
+        />
+      ) : null}
+      <ol className={styles.timeline} aria-label={`Conversation with ${name}`}>
+        {conversation.items.map((item) => {
+          const time = fullTime(item.at);
+          const message = item.message;
+          const paymentLink = item.provenance === "payment-link";
+          const recipientCount = message
+            ? (message.recipientCount ?? publicRecipientCount(message.record))
+            : undefined;
+          return (
+            <li
+              key={item.id}
+              id={chatEntryDomId(item.id)}
+              className={styles.entry}
+              data-direction={item.direction}
+              data-highlight={highlightId === item.id ? "true" : undefined}
+            >
+              <div className={styles.entryMeta}>
+                <b>{item.direction === "outgoing" ? "You" : name}</b>
+                <span>{item.label}</span>
+                <time dateTime={time.dateTime}>{time.label}</time>
+                <span>{provenanceLabel(item)}</span>
+                {recipientCount !== undefined && !paymentLink ? (
+                  <span>
+                    {recipientCount} recipient{recipientCount === 1 ? "" : "s"}
+                  </span>
+                ) : null}
+                {item.otherRecipients ? (
+                  <span>
+                    +{item.otherRecipients} other recipient
+                    {item.otherRecipients === 1 ? "" : "s"}
+                  </span>
+                ) : null}
+              </div>
+              {paymentLink ? (
+                <p className={styles.entryNotice} role="status">
+                  {message?.linkAuthenticity?.kind === "verified"
+                    ? `${MAIL_SIGNATURE_VERIFICATION_LIMIT_NOTICE} This request came from a URL fragment, not a MessagePosted event, and opening or importing it did not submit a payment.`
+                    : "This unverified legacy request was imported from a URL fragment for local review. It is not a MessagePosted event, cannot authenticate the requester, and opening or importing it did not submit a payment."}
+                </p>
               ) : null}
-            </div>
-            {renderContent(item)}
-          </li>
-        );
-      })}
-    </ol>
+              {message && !paymentLink ? (
+                <RecordProvenance
+                  message={message}
+                  proof={handlers.proofs[message.id]}
+                  onProve={handlers.onProve}
+                />
+              ) : null}
+              {renderContent(item)}
+              {message &&
+              message.transactionHashes &&
+              message.transactionHashes.length > 1 ? (
+                <aside className={styles.entrySubmissions}>
+                  <strong>Submission transactions</strong>
+                  {message.transactionHashes.map((transactionHash, index) => (
+                    <code key={`${index}:${transactionHash}`}>
+                      {index + 1}. {transactionHash}
+                    </code>
+                  ))}
+                  <span>
+                    Escrow funding and document delivery are separate because
+                    the pool permits one external invoke per transaction.
+                  </span>
+                </aside>
+              ) : null}
+              {message && !paymentLink && item.provenance !== "mailbox-record" ? (
+                <div className={styles.entryChain}>
+                  <ChainRecordPanel message={message} />
+                </div>
+              ) : null}
+            </li>
+          );
+        })}
+      </ol>
+    </>
   );
 }
diff --git a/src/app/chat/chat-model.test.ts b/src/app/chat/chat-model.test.ts
index 35094a3..51d6089 100644
--- a/src/app/chat/chat-model.test.ts
+++ b/src/app/chat/chat-model.test.ts
@@ -1,19 +1,22 @@
 import { describe, expect, it } from "vitest";
-import { paymentLinkToLocal } from "@/app/inbox/mailbox-model";
+import { paymentLinkToLocal } from "@/app/chat/mailbox-model";
 import type { RfqLifecycleRecord } from "@/app/rfq/rfq-lifecycle";
-import type { LocalMailMessage } from "@/components/mail/Thread";
+import type { LocalMailMessage } from "@/components/mail/message";
 import { feltEquals } from "@/lib/addresses";
 import { decodeEnvelope, encodeEnvelope, type EnvelopeType } from "@/lib/envelope";
 import type { EscrowState } from "@/lib/escrow";
-import type { EncryptedMailRecord } from "@/lib/mail";
-import type { OtcState, PaymentRequestPayload } from "@/lib/otc";
+import { ONE_SIDED_WARNING, type OtcState } from "@/lib/otc";
 import { addrSTRK } from "@/utils/constants";
 import {
+  SELF_CONVERSATION_KEY,
   buildChatModel,
   buildContactContext,
   contactDisplayName,
   filterConversations,
+  invoiceRecord,
+  namingTarget,
   rfqNamesContact,
+  sealedConversationKey,
   type ChatModelInput,
 } from "./chat-model";
 
@@ -25,21 +28,14 @@ const DAVE = "0xdaee";
 const ERIN = "0xe41";
 const STRK = { symbol: "STRK", address: addrSTRK, decimals: 18 };
 const USDC = { symbol: "USDC", address: "0x53c", decimals: 6 };
-const RECORD: EncryptedMailRecord = {
+const RECORD: LocalMailMessage["record"] = {
   ephemeralPub: ["0x1", "0x2"],
   viewTag: 3,
   nonce: ["0x4", "0x5"],
   ciphertextFelts: ["0x6"],
 };
-
-const wideId = (byte: string) => `0x${byte.repeat(32)}`;
-const INCOMING_DEAL = wideId("11");
-const SENT_DEAL = wideId("22");
-const CAROL_REQUEST = wideId("33");
-const LETTER_DOCUMENT = wideId("44");
-const OFFER_DOCUMENT = wideId("55");
-const SELF_DOCUMENT = wideId("66");
-const LOST_DOCUMENT = wideId("77");
+const id = (byte: string) => `0x${byte.repeat(32)}`;
+const THREAD = id("cc");
 
 function sent(
   documentId: string,
@@ -47,7 +43,7 @@ function sent(
   payload: unknown,
   plaintext: string,
   recipients: string[],
-  createdAtSeconds: number,
+  createdAt: number,
 ): LocalMailMessage {
   return {
     id: `sent:${documentId}`,
@@ -60,41 +56,60 @@ function sent(
     direction: "outgoing",
     recipientCount: recipients.length,
     recipients,
-    localCreatedAt: createdAtSeconds * 1_000,
+    localCreatedAt: createdAt,
+  };
+}
+
+function incoming(
+  messageId: string,
+  type: EnvelopeType,
+  payload: unknown,
+  plaintext: string,
+  blockTimestamp: number,
+  extra: Partial<LocalMailMessage> = {},
+): LocalMailMessage {
+  return {
+    id: messageId,
+    index: messageId.replace(/\D/g, "") || "9",
+    plaintext,
+    envelope: decodeEnvelope(encodeEnvelope(type, payload)),
+    record: RECORD,
+    transactionHash: `0x${messageId.replace(/\D/g, "") || "9"}`,
+    direction: "incoming",
+    blockNumber: 12,
+    blockTimestamp,
+    ...extra,
   };
 }
 
 const sentOffer = {
-  dealId: SENT_DEAL,
+  dealId: id("22"),
   give: { token: STRK, amount: "1000000000000000000" },
   want: { token: USDC, amount: "2500000" },
   offerer: SELF,
   expiresAt: NOW + 3_600,
 };
-
 const incomingOffer = {
-  dealId: INCOMING_DEAL,
+  dealId: id("11"),
   give: { token: STRK, amount: "3000000000000000000" },
   want: { token: USDC, amount: "7000000" },
   offerer: BOB,
   expiresAt: NOW + 3_600,
 };
-
-const carolRequest: PaymentRequestPayload = {
-  requestId: CAROL_REQUEST,
+const carolRequest = {
+  requestId: id("33"),
   token: STRK,
   amount: "4000000000000000000",
   requester: CAROL,
   expiresAt: NOW + 3_600,
   memo: "Desk fee",
 };
-
 const daveFund = {
   dealId: "0x23",
   escrowAddress: "0xe5c",
   maker: DAVE,
-  legA: { token: STRK, amount: "5" },
-  legB: { token: USDC, amount: "6" },
+  legA: { token: STRK, amount: "5000000000000000000" },
+  legB: { token: USDC, amount: "6000000" },
   deadline: NOW + 3_600,
   claimPubkey: "0x123",
 };
@@ -102,26 +117,27 @@ const daveFund = {
 const otc: OtcState = {
   version: 1,
   deals: {
-    [INCOMING_DEAL]: {
-      dealId: INCOMING_DEAL,
-      status: "offered",
-      offer: incomingOffer,
-      updatedAt: NOW - 10,
-    },
-    [SENT_DEAL]: {
-      dealId: SENT_DEAL,
+    [sentOffer.dealId]: {
+      dealId: sentOffer.dealId,
       status: "accepted",
       offer: sentOffer,
       counterpartyAcceptClaim: {
-        dealId: SENT_DEAL,
+        dealId: sentOffer.dealId,
         transfer: { token: STRK, amount: "1000000000000000000", to: SELF },
       },
+      settlementVerified: false,
       updatedAt: NOW - 40,
     },
+    [incomingOffer.dealId]: {
+      dealId: incomingOffer.dealId,
+      status: "offered",
+      offer: incomingOffer,
+      updatedAt: NOW - 10,
+    },
   },
   payments: {
-    [CAROL_REQUEST]: {
-      requestId: CAROL_REQUEST,
+    [carolRequest.requestId]: {
+      requestId: carolRequest.requestId,
       status: "requested",
       request: carolRequest,
       origin: "payment_link",
@@ -134,17 +150,17 @@ const otc: OtcState = {
 const escrow: EscrowState = {
   version: 1,
   deals: {
-    "0x23": {
-      dealId: "0x23",
+    [daveFund.dealId]: {
+      dealId: daveFund.dealId,
       fund: daveFund,
       chainStatus: "funded",
       chainDeal: {
         legAToken: addrSTRK,
-        legAAmount: "5",
-        legBToken: "0x53c",
-        legBTerms: "6",
+        legAAmount: daveFund.legA.amount,
+        legBToken: USDC.address,
+        legBTerms: daveFund.legB.amount,
         legBAmount: "0",
-        deadline: NOW + 3_600,
+        deadline: daveFund.deadline,
         ticket: "0x123",
         claimPubkey: "0x123",
         status: "funded",
@@ -156,148 +172,313 @@ const escrow: EscrowState = {
   },
 };
 
-const input: ChatModelInput = {
-  selfAddress: SELF,
-  sent: [
-    sent(LETTER_DOCUMENT, "text", { body: "See you at the desk" }, "See you at the desk", [BOB], NOW - 100),
-    sent(
-      OFFER_DOCUMENT,
-      "composite",
-      {
-        documentId: OFFER_DOCUMENT,
-        body: "",
-        attachments: [{ type: "offer", payload: sentOffer }],
-      },
-      "",
-      [BOB],
-      NOW - 50,
-    ),
-    sent(SELF_DOCUMENT, "text", { body: "note to self" }, "note to self", [SELF], NOW - 30),
-    sent(LOST_DOCUMENT, "text", { body: "recipient not stored" }, "recipient not stored", [], NOW - 30),
-  ],
-  paymentLinks: [paymentLinkToLocal(carolRequest, NOW - 5, { kind: "unsigned" })],
-  otc,
-  escrow,
-  addressBook: [
-    { label: "Bob", address: BOB, updatedAt: 1 },
-    { label: "Erin", address: ERIN, updatedAt: 1 },
-  ],
-  aliases: [{ address: CAROL, label: "Carol desk", addedAt: 1 }],
-  readIds: new Set([`record:deal:${INCOMING_DEAL}`]),
-  now: NOW,
-};
+const letterToBob = sent(
+  id("44"),
+  "text",
+  { body: "See you at the desk", documentId: id("44"), conversationId: THREAD },
+  "See you at the desk",
+  [BOB],
+  (NOW - 100) * 1_000,
+);
+const offerToBob = sent(
+  id("55"),
+  "composite",
+  {
+    documentId: id("55"),
+    body: "",
+    attachments: [{ type: "offer", payload: sentOffer }],
+    conversationId: THREAD,
+  },
+  "",
+  [BOB],
+  (NOW - 50) * 1_000,
+);
+/* Bob answers inside the same thread: no claim, no name, still attributed. */
+const bobReply = incoming(
+  "0x77:1",
+  "text",
+  { body: "Firm at 2.5", documentId: id("66"), conversationId: THREAD },
+  "Firm at 2.5",
+  NOW - 30,
+);
+const sealedLetter = incoming(
+  "0x88:1",
+  "text",
+  { body: "Who is this?", documentId: id("99"), conversationId: id("dd") },
+  "Who is this?",
+  NOW - 15,
+);
+const carolLink = paymentLinkToLocal(carolRequest, NOW - 5, { kind: "unsigned" });
+const selfBackup = sent(
+  id("ab"),
+  "contact_snapshot",
+  { any: "thing" },
+  "",
+  [SELF],
+  (NOW - 1) * 1_000,
+);
+const noRecipient = sent(id("ac"), "text", { body: "orphan" }, "orphan", [], (NOW - 2) * 1_000);
+
+function input(overrides: Partial<ChatModelInput> = {}): ChatModelInput {
+  return {
+    selfAddress: SELF,
+    messages: [
+      letterToBob,
+      offerToBob,
+      bobReply,
+      sealedLetter,
+      carolLink,
+      selfBackup,
+      noRecipient,
+    ],
+    otc,
+    escrow,
+    addressBook: [
+      { label: "Bob", address: BOB, updatedAt: 1 },
+      { label: "Erin", address: ERIN, updatedAt: 1 },
+    ],
+    aliases: [{ address: CAROL, label: "Carol desk", addedAt: 1 }],
+    readIds: new Set<string>(),
+    now: NOW,
+    ...overrides,
+  };
+}
 
-function conversationFor(address: string) {
-  const conversation = buildChatModel(input).conversations.find((candidate) =>
-    feltEquals(candidate.contact.address, address),
+function conversation(model: ReturnType<typeof buildChatModel>, key: string) {
+  const found = model.conversations.find(
+    (candidate) =>
+      candidate.contact.key === key ||
+      (candidate.contact.address !== null &&
+        feltEquals(candidate.contact.address, key)),
   );
-  if (!conversation) throw new Error(`No conversation for ${address}`);
-  return conversation;
+  if (!found) throw new Error(`No conversation for ${key}`);
+  return found;
 }
 
 describe("chat conversations", () => {
-  it("groups device-local records by counterparty, newest activity first", () => {
-    const model = buildChatModel(input);
-    expect(
-      model.conversations.map((conversation) => contactDisplayName(conversation.contact)),
-    ).toEqual(["Carol desk", "Bob", "0xdaee", "Erin"]);
+  it("groups every mailbox record by counterparty and orders by activity", () => {
+    const model = buildChatModel(input());
     expect(model.unattributedSent).toBe(1);
+    const names = model.conversations.map((row) => contactDisplayName(row.contact));
+    expect(names).toEqual([
+      "This mailbox",
+      "Carol desk",
+      "Bob",
+      "Sealed sender",
+      "0xdaee",
+      "Erin",
+    ]);
   });
 
-  it("reads Bob's letter, sent offer and received offer in order with their status", () => {
-    const bob = conversationFor(BOB);
-    expect(bob.contact).toMatchObject({ label: "Bob", nameSource: "address-book", saved: true });
-    expect(bob.items.map((item) => item.kind)).toEqual(["letter", "document", "offer"]);
-    expect(bob.items.map((item) => item.direction)).toEqual([
-      "outgoing",
-      "outgoing",
-      "incoming",
+  it("attributes a thread reply without a name or claim to its counterparty", () => {
+    const bob = conversation(buildChatModel(input()), BOB);
+    expect(bob.contact.saved).toBe(true);
+    expect(bob.items.map((item) => item.kind)).toEqual([
+      "letter",
+      "document",
+      "letter",
+      "offer",
     ]);
-    expect(bob.items[0].body).toBe("See you at the desk");
-    expect(bob.items[1].preview).toBe("Offer: 1 STRK for 2.5 USDC");
-    expect(bob.items[1].records[0].facts.status).toMatch(/Accepted · unverified claim/);
-    expect(bob.items[1].needsAction).toMatch(/claims to have settled/);
-    expect(bob.items[2].records[0].facts).toMatchObject({
-      kind: "offer",
-      terms: "3 STRK for 7 USDC",
-      status: "Open offer",
-      open: true,
-    });
-    expect(bob.items[2].needsAction).toMatch(/Accept or decline/);
-    expect(bob.latest?.id).toBe(`record:deal:${INCOMING_DEAL}`);
-    expect(bob.unreadCount).toBe(0);
+    const reply = bob.items[2];
+    expect(reply.direction).toBe("incoming");
+    expect(reply.provenance).toBe("decrypted");
+    expect(reply.body).toBe("Firm at 2.5");
+    expect(bob.unreadCount).toBe(2);
     expect(bob.needsAction).toBe(true);
+    expect(bob.items[1].records[0].own).toBe(true);
+    expect(bob.items[1].records[0].needsAction).toMatch(/claims to have settled/);
+    expect(bob.items[3].provenance).toBe("mailbox-record");
+    expect(bob.items[3].records[0].own).toBe(false);
+    expect(bob.items[3].needsAction).toMatch(/Accept or decline/);
   });
 
-  it("shows an imported payment link under its aliased requester as unread work", () => {
-    const carol = conversationFor(CAROL);
-    expect(carol.contact).toMatchObject({ label: "Carol desk", nameSource: "alias", saved: false });
-    expect(carol.items).toHaveLength(1);
-    expect(carol.items[0]).toMatchObject({
-      kind: "invoice",
-      direction: "incoming",
-      provenance: "payment-link",
-      preview: "4 STRK · Desk fee",
-    });
-    expect(carol.items[0].needsAction).toMatch(/Pay this request/);
-    expect(carol.unreadCount).toBe(1);
+  it("keeps an unnamed thread sealed and exposes the record that names it", () => {
+    const model = buildChatModel(input());
+    const sealed = conversation(model, sealedConversationKey(id("dd")));
+    expect(sealed.contact.kind).toBe("sealed");
+    expect(sealed.contact.address).toBeNull();
+    expect(sealed.items).toHaveLength(1);
+    expect(sealed.unreadCount).toBe(1);
+    expect(namingTarget(sealed)?.id).toBe("0x88:1");
   });
 
-  it("offers a fillable escrow from an unnamed maker only after the contract terms match", () => {
-    const dave = conversationFor(DAVE);
-    expect(dave.contact.label).toBeNull();
-    expect(dave.items[0].records[0]).toMatchObject({
-      escrowTermsVerified: true,
-      needsAction: "Deposit leg B in Mailbox to receive leg A.",
-    });
-    const unmatched = buildChatModel({
-      ...input,
-      escrow: {
-        version: 1,
-        deals: {
-          "0x23": { ...escrow.deals["0x23"], chainDeal: undefined },
-        },
-      },
-    });
-    const daveUnmatched = unmatched.conversations.find((candidate) =>
-      feltEquals(candidate.contact.address, DAVE),
+  it("moves a sealed thread to the counterparty once it is named on this device", () => {
+    const named = { ...sealedLetter, assignedAddress: DAVE };
+    const model = buildChatModel(
+      input({
+        messages: [letterToBob, offerToBob, bobReply, named, carolLink],
+      }),
     );
-    expect(daveUnmatched?.items[0].needsAction).toBeNull();
-  });
-
-  it("lists a saved counterparty with no records last and keeps self-mail out", () => {
-    const erin = conversationFor(ERIN);
-    expect(erin.items).toEqual([]);
-    expect(erin.latest).toBeNull();
     expect(
-      buildChatModel(input).conversations.some((conversation) =>
-        feltEquals(conversation.contact.address, SELF),
-      ),
+      model.conversations.some((row) => row.contact.kind === "sealed"),
     ).toBe(false);
+    const dave = conversation(model, DAVE);
+    expect(dave.items.map((item) => item.kind)).toEqual(["escrow", "letter"]);
+    expect(dave.items[0].needsAction).toMatch(/Deposit leg B/);
   });
 
-  it("filters by local names, record terms and pending action", () => {
-    const { conversations } = buildChatModel(input);
-    const names = (filtered: typeof conversations) =>
-      filtered.map((conversation) => contactDisplayName(conversation.contact));
-    expect(names(filterConversations(conversations, { search: "erin" }))).toEqual(["Erin"]);
-    expect(names(filterConversations(conversations, { search: "2.5 usdc" }))).toEqual(["Bob"]);
-    expect(names(filterConversations(conversations, { search: "desk fee" }))).toEqual([
-      "Carol desk",
-    ]);
-    expect(names(filterConversations(conversations, { needsActionOnly: true }))).toEqual([
-      "Carol desk",
-      "Bob",
-      "0xdaee",
+  it("prefers a decrypted record over saved deal state for the same deal", () => {
+    const decryptedOffer = incoming(
+      "0x11:1",
+      "offer",
+      incomingOffer,
+      "",
+      NOW - 9,
+    );
+    const bob = conversation(
+      buildChatModel(input({ messages: [letterToBob, decryptedOffer] })),
+      BOB,
+    );
+    const offers = bob.items.filter((item) => item.kind === "offer");
+    expect(offers).toHaveLength(1);
+    expect(offers[0].provenance).toBe("decrypted");
+    expect(offers[0].records[0].deal?.status).toBe("offered");
+  });
+
+  it("skips the decrypted echo of a letter this wallet sent to several recipients", () => {
+    const circular = sent(
+      id("ee"),
+      "text",
+      { body: "circular", documentId: id("ee") },
+      "circular",
+      [BOB, CAROL],
+      (NOW - 3) * 1_000,
+    );
+    const echo = incoming(
+      "0xee:1",
+      "text",
+      { body: "circular", documentId: id("ee") },
+      "circular",
+      NOW - 3,
+    );
+    const model = buildChatModel(input({ messages: [circular, echo] }));
+    const bob = conversation(model, BOB);
+    const letters = bob.items.filter((item) => item.kind === "letter");
+    expect(letters).toHaveLength(1);
+    expect(letters[0].otherRecipients).toBe(1);
+    expect(letters[0].provenance).toBe("device-sent");
+    expect(model.conversations.some((row) => row.contact.kind === "sealed")).toBe(false);
+  });
+
+  it("keeps an invoice paid through the private exchange as pending work until the note matures", () => {
+    const paying = invoiceRecord(
+      carolRequest,
+      {
+        ...otc.payments[carolRequest.requestId],
+        paymentOperation: {
+          state: "awaiting-note-maturity",
+          updatedAt: NOW,
+        } as NonNullable<OtcState["payments"][string]["paymentOperation"]>,
+      },
+      false,
+      NOW,
+    );
+    expect(paying.facts.status).toBe("Paying · awaiting note maturity");
+    expect(paying.needsAction).toMatch(/Complete the payment once the STRK note matures/);
+  });
+
+  it("files a memo that names a deal under that deal's counterparty", () => {
+    // Bob accepts the offer this wallet sent him: the memo carries only the
+    // deal id, and the Sent copy says who that deal is with.
+    const bobAccept = incoming(
+      "0x91:1",
+      "accept",
+      {
+        dealId: sentOffer.dealId,
+        transfer: { token: STRK, amount: "1000000000000000000", to: SELF },
+      },
+      "",
+      NOW - 20,
+    );
+    // Dave's escrow is known only from saved state; his fill notice still
+    // lands with him rather than as a sealed thread of its own.
+    const daveFill = incoming(
+      "0x92:1",
+      "escrow_fill",
+      { dealId: daveFund.dealId, escrowAddress: daveFund.escrowAddress },
+      "",
+      NOW - 8,
+    );
+    // A memo for an unknown deal stays sealed: nothing on this device says
+    // who sent it.
+    const strayReceipt = incoming(
+      "0x93:1",
+      "receipt",
+      {
+        dealId: id("ef"),
+        txHash: "0x5",
+        transfer: { token: STRK, amount: "1", to: SELF },
+        warning: ONE_SIDED_WARNING,
+      },
+      "",
+      NOW - 6,
+    );
+    const model = buildChatModel(
+      input({ messages: [offerToBob, bobAccept, daveFill, strayReceipt] }),
+    );
+    const bob = conversation(model, BOB);
+    // The saved-state offer Bob made earlier still shows after the memo.
+    expect(bob.items.map((item) => item.kind)).toEqual([
+      "document",
+      "memo",
+      "offer",
     ]);
+    expect(bob.items[1].label).toBe("Accept memo");
+    expect(bob.unreadCount).toBe(2);
+    const dave = conversation(model, DAVE);
+    expect(dave.items.map((item) => item.kind)).toEqual(["escrow", "memo"]);
+    expect(dave.items[1].label).toBe("Escrow notice");
+    const sealed = model.conversations.filter(
+      (row) => row.contact.kind === "sealed",
+    );
+    expect(sealed).toHaveLength(1);
+    expect(sealed[0].items[0].kind).toBe("receipt");
+  });
+
+  it("keeps backups and self-addressed copies under this mailbox", () => {
+    const self = conversation(buildChatModel(input()), SELF_CONVERSATION_KEY);
+    expect(self.contact.kind).toBe("self");
+    expect(self.items).toHaveLength(1);
+    expect(self.items[0].kind).toBe("backup");
+    expect(self.items[0].backupKind).toBe("contacts");
+  });
+
+  it("reads an imported payment link as work for the requester", () => {
+    const carol = conversation(buildChatModel(input()), CAROL);
+    expect(carol.contact.nameSource).toBe("alias");
+    expect(carol.items[0].provenance).toBe("payment-link");
+    expect(carol.items[0].needsAction).toMatch(/Pay this request/);
+    expect(carol.unreadCount).toBe(1);
+  });
+
+  it("filters by search and by needs-action", () => {
+    const model = buildChatModel(input());
+    expect(
+      filterConversations(model.conversations, { search: "erin" }).map((row) =>
+        contactDisplayName(row.contact),
+      ),
+    ).toEqual(["Erin"]);
+    expect(
+      filterConversations(model.conversations, { search: "firm at" }).map(
+        (row) => contactDisplayName(row.contact),
+      ),
+    ).toEqual(["Bob"]);
+    // Terms are searchable even when a document's preview is its body.
     expect(
-      names(filterConversations(conversations, { needsActionOnly: true, search: "bob" })),
+      filterConversations(model.conversations, { search: "2.5 usdc" }).map(
+        (row) => contactDisplayName(row.contact),
+      ),
     ).toEqual(["Bob"]);
+    expect(
+      filterConversations(model.conversations, { needsActionOnly: true }).map(
+        (row) => contactDisplayName(row.contact),
+      ),
+    ).toEqual(["Carol desk", "Bob", "0xdaee"]);
   });
 });
 
 describe("contact context", () => {
-  const workspaceRfq = (state: RfqLifecycleRecord["state"]) =>
+  const rfq = (state: RfqLifecycleRecord["state"], solverId: string) =>
     ({
       rfqId: "0x77",
       mode: "v3",
@@ -317,37 +498,36 @@ describe("contact context", () => {
         minBuyAmount: "180",
         rfqExpiresAt: NOW + 600,
       },
-      selectedQuote: { solverId: "bob" },
-      attempts: {},
+      selectedQuote: { solverId },
+      authority: "Local resume record · not settlement authority",
     }) as unknown as RfqLifecycleRecord;
 
-  it("keeps open offers, pending payments and escrows per counterparty", () => {
-    const bob = buildContactContext(conversationFor(BOB));
-    expect(bob.rfqs.map((entry) => [entry.direction, entry.terms])).toEqual([
-      ["incoming", "3 STRK for 7 USDC"],
-      ["outgoing", "1 STRK for 2.5 USDC"],
+  it("lists open offers, pending payments and escrows for the contact", () => {
+    const model = buildChatModel(input());
+    const bob = buildContactContext(conversation(model, BOB));
+    expect(bob.rfqs.map((entry) => entry.direction)).toEqual([
+      "incoming",
+      "outgoing",
     ]);
-    expect(bob.rfqs.every((entry) => entry.itemId)).toBe(true);
     expect(bob.payments).toEqual([]);
-    expect(bob.escrows).toEqual([]);
-    expect(buildContactContext(conversationFor(CAROL)).payments).toHaveLength(1);
-    expect(buildContactContext(conversationFor(DAVE)).escrows[0]).toMatchObject({
-      open: true,
-      status: "Funded · awaiting fill",
-    });
+    expect(buildContactContext(conversation(model, CAROL)).payments).toHaveLength(1);
+    const dave = buildContactContext(conversation(model, DAVE));
+    expect(dave.escrows).toHaveLength(1);
+    expect(dave.escrows[0].open).toBe(true);
   });
 
-  it("mirrors a workspace RFQ only while it names this contact and stays open", () => {
-    const bob = conversationFor(BOB);
-    expect(rfqNamesContact(workspaceRfq("quoted"), bob.contact)).toBe(true);
-    expect(rfqNamesContact(workspaceRfq("quoted"), conversationFor(DAVE).contact)).toBe(false);
-    const open = buildContactContext(bob, [workspaceRfq("quoted")]);
-    expect(open.rfqs.at(-1)).toMatchObject({
-      direction: "workspace",
-      terms: "100 STRK → USDC",
-      status: "Locked quotes received",
-      open: true,
-    });
-    expect(buildContactContext(bob, [workspaceRfq("settled")]).rfqs).toHaveLength(2);
+  it("mirrors a workspace RFQ only when a maker id names the contact", () => {
+    const model = buildChatModel(input());
+    const bob = conversation(model, BOB);
+    expect(rfqNamesContact(rfq("quoted", "bob"), bob.contact)).toBe(true);
+    expect(rfqNamesContact(rfq("quoted", "maker-a"), bob.contact)).toBe(false);
+    const withRfq = buildContactContext(bob, [
+      rfq("quoted", "bob"),
+      rfq("settled", "bob"),
+    ]);
+    expect(withRfq.rfqs.filter((entry) => entry.direction === "workspace")).toHaveLength(1);
+    expect(withRfq.rfqs.at(-1)?.terms).toBe("100 STRK → USDC");
+    const sealed = conversation(model, sealedConversationKey(id("dd")));
+    expect(rfqNamesContact(rfq("quoted", "bob"), sealed.contact)).toBe(false);
   });
 });
diff --git a/src/app/chat/chat-model.ts b/src/app/chat/chat-model.ts
index 2d2137f..b3f0ebb 100644
--- a/src/app/chat/chat-model.ts
+++ b/src/app/chat/chat-model.ts
@@ -1,14 +1,16 @@
-import { mailMessageTimestampMs } from "@/app/inbox/mailbox-model";
+import { mailMessageTimestampMs } from "@/app/chat/mailbox-model";
 import type {
   RfqLifecycleRecord,
   RfqLifecycleState,
 } from "@/app/rfq/rfq-lifecycle";
 import { rfqStateLabel } from "@/app/rfq/rfq-state-label";
-import type { LocalMailMessage } from "@/components/mail/Thread";
+import type { LocalMailMessage } from "@/components/mail/message";
 import { shortenFelt } from "@/components/mail/correspondent";
 import type { AddressBookEntry } from "@/lib/address-book";
 import { canonicalizeStarknetAddress, feltEquals } from "@/lib/addresses";
 import { findAliasByAddress, type AliasRecord } from "@/lib/aliases";
+import { parseBackupPointer } from "@/lib/backup-blob";
+import { decodeBackupSnapshot } from "@/lib/backup-snapshot";
 import { parseCompositePayload } from "@/lib/composite";
 import {
   contractDealMatchesFund,
@@ -21,6 +23,11 @@ import {
   type EscrowFundPayload,
   type EscrowState,
 } from "@/lib/escrow";
+import { claimedFinancialAddress } from "@/lib/mail-correspondents";
+import {
+  conversationFieldsFromPayload,
+  conversationKeyForMessage,
+} from "@/lib/mail-thread";
 import {
   formatBaseUnits,
   offerIsExpired,
@@ -43,22 +50,38 @@ import {
 import { sanitizeUntrustedText } from "@/lib/text";
 
 /**
- * Chat is a per-counterparty reading of what this device already holds:
- * device-local Sent copies, imported payment links, and the OTC, payment and
- * escrow records Mailbox persisted while it read the chain. Nothing here is a
- * new store and nothing here is settlement authority; every record carries
- * the same caveats it carries in Mailbox.
+ * Chat is the mailbox read one counterparty at a time. Every record here is
+ * a mailbox record: a decrypted letter, a device-local Sent copy, an imported
+ * payment link, or the OTC, payment and escrow state saved while reading the
+ * chain. Nothing here is settlement authority, and every record carries the
+ * same caveats it always carried.
+ *
+ * MessagePosted has no sender, so a decrypted record joins a counterparty's
+ * conversation only through evidence this device holds: a name assigned on
+ * this device, an address claimed inside the payload (never authenticated),
+ * or the thread it replies to. Anything else stays a sealed thread until it
+ * is named.
  */
 
+export type ChatContactKind = "counterparty" | "self" | "sealed";
+
 export type ChatContactNameSource = "address-book" | "alias" | "none";
 
 export type ChatContact = Readonly<{
-  address: string;
+  /** Canonical address for a counterparty, "self", or the sealed thread key. */
+  key: string;
+  kind: ChatContactKind;
+  address: string | null;
   label: string | null;
   nameSource: ChatContactNameSource;
   saved: boolean;
+  /** The mailbox conversation a sealed thread is keyed under. */
+  threadKey?: string;
 }>;
 
+export const SELF_CONVERSATION_KEY = "self";
+const SEALED_KEY_PREFIX = "sealed:";
+
 export type ChatRecordKind = "offer" | "invoice" | "escrow" | "payment";
 
 export type ChatRecordTone = "accent" | "live" | "deal" | "muted" | "danger";
@@ -78,6 +101,8 @@ export type ChatRecord = Readonly<{
   id: string;
   facts: ChatRecordFacts;
   needsAction: string | null;
+  /** This wallet issued the record. */
+  own: boolean;
   offer?: OfferPayload;
   deal?: DealRecord;
   request?: PaymentRequestPayload;
@@ -100,13 +125,18 @@ export type ChatItemKind =
   | "receipt"
   | "memo"
   | "decline"
+  | "backup"
   | "unsupported";
 
-export type ChatItemProvenance = "device-sent" | "payment-link" | "mailbox-record";
+export type ChatItemProvenance =
+  | "device-sent"
+  | "decrypted"
+  | "payment-link"
+  | "mailbox-record";
 
 export type ChatItem = Readonly<{
   id: string;
-  contact: string;
+  conversationKey: string;
   direction: "incoming" | "outgoing";
   /** Milliseconds; undefined when no local or chain time is known. */
   at: number | undefined;
@@ -120,6 +150,8 @@ export type ChatItem = Readonly<{
   message?: LocalMailMessage;
   /** Other recipients of the same device-local Sent copy. */
   otherRecipients: number;
+  /** For backup self-mail: what the snapshot restores. */
+  backupKind?: "contacts" | "rfq-resume";
 }>;
 
 export type ChatConversation = Readonly<{
@@ -133,15 +165,15 @@ export type ChatConversation = Readonly<{
 
 export type ChatModelInput = Readonly<{
   selfAddress: string;
-  /** Device-local Sent copies, already projected to mailbox messages. */
-  sent: readonly LocalMailMessage[];
-  /** Payment requests imported from /pay, projected the way Mailbox shows them. */
-  paymentLinks: readonly LocalMailMessage[];
+  /** Every visible mailbox record, decrypted or device-local, any direction. */
+  messages: readonly LocalMailMessage[];
   otc: OtcState;
   escrow: EscrowState;
   addressBook: readonly AddressBookEntry[];
   aliases: readonly AliasRecord[];
   readIds: ReadonlySet<string>;
+  /** Addresses opened as conversations this session without any record yet. */
+  extraContacts?: readonly string[];
   /** Seconds. */
   now?: number;
 }>;
@@ -244,8 +276,14 @@ function amountLabel(value: {
   }
 }
 
+export function sealedConversationKey(threadKey: string): string {
+  return `${SEALED_KEY_PREFIX}${threadKey}`;
+}
+
 export function contactDisplayName(contact: ChatContact): string {
-  return contact.label ?? shortenFelt(contact.address);
+  if (contact.kind === "self") return "This mailbox";
+  if (contact.kind === "sealed") return "Sealed sender";
+  return contact.label ?? shortenFelt(contact.address ?? "");
 }
 
 export function offerRecord(
@@ -264,14 +302,14 @@ export function offerRecord(
   );
   let needsAction: string | null = null;
   if (!own && status === "offered" && !expired) {
-    needsAction = "Accept or decline this offer in Mailbox.";
+    needsAction = "Accept or decline this offer.";
   } else if (
     !own &&
     status === "accepted" &&
     deal?.settlementVerified &&
     !deal.receipt
   ) {
-    needsAction = "Post the receipt for this accepted offer in Mailbox.";
+    needsAction = "Post the receipt for this accepted offer.";
   } else if (own && unverifiedClaim && !deal?.settlementVerified) {
     needsAction =
       "A counterparty claims to have settled this offer. Verify the transfer before releasing anything.";
@@ -288,14 +326,16 @@ export function offerRecord(
       kind: "offer",
       title: "Offer",
       terms: `${amountLabel(offer.give)} for ${amountLabel(offer.want)}`,
-      status: unverifiedClaim && !deal?.settlementVerified
-        ? `${label} · unverified claim`
-        : label,
+      status:
+        unverifiedClaim && !deal?.settlementVerified
+          ? `${label} · unverified claim`
+          : label,
       tone,
       open,
       expiresAt: offer.expiresAt,
     },
     needsAction,
+    own,
     offer,
     ...(deal ? { deal } : {}),
   };
@@ -332,7 +372,9 @@ export function invoiceRecord(
   const open = !expired && status === "requested";
   let needsAction: string | null = null;
   if (!own && open && !inProgress) {
-    needsAction = "Pay this request in Mailbox after verifying the requester.";
+    needsAction = "Pay this request after verifying the requester.";
+  } else if (!own && open && operation === "awaiting-note-maturity") {
+    needsAction = `Complete the payment once the ${collapse(request.token.symbol) || "token"} note matures.`;
   } else if (
     own &&
     payment?.counterpartyPaymentClaim &&
@@ -361,6 +403,7 @@ export function invoiceRecord(
       expiresAt: request.expiresAt,
     },
     needsAction,
+    own,
     request,
     ...(payment ? { payment } : {}),
   };
@@ -380,14 +423,15 @@ export function escrowRecord(
       contractDealMatchesFund(escrow.chainDeal, fund),
   );
   const label = status ? ESCROW_STATUS[status] : "Contract state not read yet";
-  const open = status === undefined || status === "funded" || status === "filled";
+  const open =
+    status === undefined || status === "funded" || status === "filled";
   let needsAction: string | null = null;
   if (!own && status === "funded" && termsVerified && !expired) {
-    needsAction = "Deposit leg B in Mailbox to receive leg A.";
+    needsAction = "Deposit leg B to receive leg A.";
   } else if (own && status === "filled") {
-    needsAction = "Claim leg B in Mailbox.";
+    needsAction = "Claim leg B.";
   } else if (own && status === "funded" && expired) {
-    needsAction = "The fill deadline passed. Refund leg A in Mailbox.";
+    needsAction = "The fill deadline passed. Refund leg A.";
   }
   return {
     id: `escrow:${fund.dealId}`,
@@ -395,7 +439,8 @@ export function escrowRecord(
       kind: "escrow",
       title: "Escrow",
       terms: `${amountLabel(fund.legA)} against ${amountLabel(fund.legB)}`,
-      status: expired && status === "funded" ? `${label} · deadline passed` : label,
+      status:
+        expired && status === "funded" ? `${label} · deadline passed` : label,
       tone:
         status === "settled"
           ? "live"
@@ -408,6 +453,7 @@ export function escrowRecord(
       expiresAt: fund.deadline,
     },
     needsAction,
+    own,
     fund,
     ...(escrow ? { escrow } : {}),
     escrowTermsVerified: termsVerified,
@@ -425,29 +471,106 @@ function receiptRecord(
       kind: "payment",
       title: standalonePayment ? "Private payment" : "Transfer claim",
       terms: amountLabel(receipt.transfer),
-      status: own ? "Submitted from this device" : "Unverified counterparty claim",
+      status: own
+        ? "Submitted from this device"
+        : "Unverified counterparty claim",
       tone: own ? "live" : "deal",
       open: false,
       expiresAt: 0,
     },
     needsAction: null,
+    own,
     receipt,
     receiptKind: standalonePayment ? "payment" : "transfer",
   };
 }
 
-type PartialItem = Omit<ChatItem, "contact" | "otherRecipients">;
+type PartialItem = Omit<ChatItem, "conversationKey" | "otherRecipients">;
+
+/** The document id a record carries, in its payload or on its local copy. */
+function stableDocumentId(message: LocalMailMessage): string | undefined {
+  const fields = conversationFieldsFromPayload(
+    message.envelope.type,
+    message.envelope.type === "unsupported" ? null : message.envelope.payload,
+  );
+  return fields.documentId ?? message.documentId;
+}
+
+function compositeAttachments(
+  payload: unknown,
+): Array<{ type: string; payload: unknown }> {
+  const composite = parseCompositePayload(payload);
+  return composite ? composite.attachments : [];
+}
+
+function idList(...ids: Array<string | undefined>): string[] {
+  return ids.filter((id): id is string => typeof id === "string" && id !== "");
+}
+
+/** The deals, requests and escrows a record opens: its author owns them. */
+function openedDealIds(message: LocalMailMessage): string[] {
+  const payload =
+    message.envelope.type === "unsupported" ? null : message.envelope.payload;
+  switch (message.envelope.type) {
+    case "offer":
+      return idList(parseOfferPayload(payload)?.dealId);
+    case "payment_request":
+      return idList(parsePaymentRequestPayload(payload)?.requestId);
+    case "escrow_fund":
+      return idList(parseEscrowFundPayload(payload)?.dealId);
+    case "composite":
+      return compositeAttachments(payload).flatMap((attachment) => {
+        const fields = attachment.payload as {
+          dealId?: string;
+          requestId?: string;
+        };
+        if (attachment.type === "payment_request") return idList(fields.requestId);
+        return idList(fields.dealId);
+      });
+    default:
+      return [];
+  }
+}
+
+/** The deal, request or escrow a memo answers: the other side sent it. */
+function answeredDealIds(message: LocalMailMessage): string[] {
+  const payload =
+    message.envelope.type === "unsupported" ? null : message.envelope.payload;
+  switch (message.envelope.type) {
+    case "accept":
+      return idList(parseAcceptPayload(payload)?.dealId);
+    case "decline":
+      return idList(parseDeclinePayload(payload)?.dealId);
+    case "receipt":
+      return idList(parseReceiptPayload(payload)?.dealId);
+    case "escrow_fill":
+      return idList(parseEscrowFillPayload(payload)?.dealId);
+    case "escrow_claim":
+      return idList(parseEscrowClaimPayload(payload)?.dealId);
+    case "escrow_timeout":
+      return idList(parseEscrowTimeoutPayload(payload)?.dealId);
+    default:
+      return [];
+  }
+}
+
+function messageDirection(message: LocalMailMessage): "incoming" | "outgoing" {
+  return message.direction === "outgoing" ? "outgoing" : "incoming";
+}
+
+function messageProvenance(message: LocalMailMessage): ChatItemProvenance {
+  if (message.transport === "payment_link") return "payment-link";
+  return messageDirection(message) === "outgoing" ? "device-sent" : "decrypted";
+}
 
 function baseItem(
   message: LocalMailMessage,
-  provenance: ChatItemProvenance,
-  direction: "incoming" | "outgoing",
 ): Pick<ChatItem, "id" | "at" | "provenance" | "direction" | "message"> {
   return {
     id: message.id,
     at: mailMessageTimestampMs(message),
-    provenance,
-    direction,
+    provenance: messageProvenance(message),
+    direction: messageDirection(message),
     message,
   };
 }
@@ -462,12 +585,9 @@ function firstAction(records: readonly ChatRecord[]): string | null {
   return records.find((record) => record.needsAction)?.needsAction ?? null;
 }
 
-function unsupportedItem(
-  message: LocalMailMessage,
-  direction: "incoming" | "outgoing",
-): PartialItem {
+function unsupportedItem(message: LocalMailMessage): PartialItem {
   return {
-    ...baseItem(message, "device-sent", direction),
+    ...baseItem(message),
     kind: "unsupported",
     label: "Unsupported",
     preview: "This record could not be read",
@@ -477,14 +597,43 @@ function unsupportedItem(
   };
 }
 
-/** A device-local Sent copy, read as one outgoing chat item. */
-export function sentItemFor(
+function backupKindOf(
   message: LocalMailMessage,
-  input: Pick<ChatModelInput, "otc" | "escrow">,
+): "contacts" | "rfq-resume" | null {
+  try {
+    if (message.envelope.type === "contact_snapshot") return "contacts";
+    if (message.envelope.type === "backup_snapshot") {
+      return decodeBackupSnapshot(message.envelope.payload).kind;
+    }
+    if (message.envelope.type === "backup_pointer") {
+      return parseBackupPointer(message.envelope.payload).kind;
+    }
+  } catch {
+    // A malformed backup-shaped record stays visibly unsupported.
+  }
+  return null;
+}
+
+function isBackupEnvelope(message: LocalMailMessage): boolean {
+  return (
+    message.envelope.type === "contact_snapshot" ||
+    message.envelope.type === "backup_snapshot" ||
+    message.envelope.type === "backup_pointer"
+  );
+}
+
+/** One mailbox record, read as a chat item. The wallet decides ownership per payload. */
+export function messageItemFor(
+  message: LocalMailMessage,
+  input: Pick<ChatModelInput, "otc" | "escrow" | "selfAddress">,
   now = nowSeconds(),
 ): PartialItem {
   const { envelope } = message;
-  const base = baseItem(message, "device-sent", "outgoing");
+  const base = baseItem(message);
+  const self = canonical(input.selfAddress);
+  const outgoing = base.direction === "outgoing";
+  const ownsAddress = (claimed: string): boolean =>
+    self ? feltEquals(claimed, self) : outgoing;
   const payload = envelope.type === "unsupported" ? null : envelope.payload;
   switch (envelope.type) {
     case "text": {
@@ -501,28 +650,28 @@ export function sentItemFor(
     }
     case "composite": {
       const composite = parseCompositePayload(payload);
-      if (!composite) return unsupportedItem(message, "outgoing");
+      if (!composite) return unsupportedItem(message);
       const records = composite.attachments.map((attachment) => {
         switch (attachment.type) {
           case "offer":
             return offerRecord(
               attachment.payload,
               input.otc.deals[attachment.payload.dealId],
-              true,
+              ownsAddress(attachment.payload.offerer),
               now,
             );
           case "payment_request":
             return invoiceRecord(
               attachment.payload,
               input.otc.payments[attachment.payload.requestId],
-              true,
+              ownsAddress(attachment.payload.requester),
               now,
             );
           case "escrow_fund":
             return escrowRecord(
               attachment.payload,
               input.escrow.deals[attachment.payload.dealId],
-              true,
+              ownsAddress(attachment.payload.maker),
               now,
             );
           default:
@@ -533,7 +682,7 @@ export function sentItemFor(
                 transfer: attachment.payload.transfer,
                 warning: ONE_SIDED_WARNING,
               },
-              true,
+              outgoing,
               true,
             );
         }
@@ -552,8 +701,13 @@ export function sentItemFor(
     }
     case "offer": {
       const offer = parseOfferPayload(payload);
-      if (!offer) return unsupportedItem(message, "outgoing");
-      const record = offerRecord(offer, input.otc.deals[offer.dealId], true, now);
+      if (!offer) return unsupportedItem(message);
+      const record = offerRecord(
+        offer,
+        input.otc.deals[offer.dealId],
+        ownsAddress(offer.offerer),
+        now,
+      );
       return {
         ...base,
         kind: "offer",
@@ -566,11 +720,11 @@ export function sentItemFor(
     }
     case "payment_request": {
       const request = parsePaymentRequestPayload(payload);
-      if (!request) return unsupportedItem(message, "outgoing");
+      if (!request) return unsupportedItem(message);
       const record = invoiceRecord(
         request,
         input.otc.payments[request.requestId],
-        true,
+        ownsAddress(request.requester),
         now,
       );
       return {
@@ -585,8 +739,13 @@ export function sentItemFor(
     }
     case "escrow_fund": {
       const fund = parseEscrowFundPayload(payload);
-      if (!fund) return unsupportedItem(message, "outgoing");
-      const record = escrowRecord(fund, input.escrow.deals[fund.dealId], true, now);
+      if (!fund) return unsupportedItem(message);
+      const record = escrowRecord(
+        fund,
+        input.escrow.deals[fund.dealId],
+        ownsAddress(fund.maker),
+        now,
+      );
       return {
         ...base,
         kind: "escrow",
@@ -599,12 +758,15 @@ export function sentItemFor(
     }
     case "accept": {
       const accept = parseAcceptPayload(payload);
-      if (!accept) return unsupportedItem(message, "outgoing");
+      if (!accept) return unsupportedItem(message);
+      const isPayment = Boolean(input.otc.payments[accept.dealId]);
       return {
         ...base,
         kind: "memo",
-        label: "Memo",
-        preview: `${amountLabel(accept.transfer)} sent to settle ${accept.dealId.slice(0, 10)}…`,
+        label: isPayment ? "Payment memo" : "Accept memo",
+        preview: outgoing
+          ? `${amountLabel(accept.transfer)} sent to settle ${accept.dealId.slice(0, 10)}…`
+          : `Claims ${amountLabel(accept.transfer)} was sent to settle ${accept.dealId.slice(0, 10)}…`,
         body: "",
         needsAction: null,
         records: [],
@@ -612,8 +774,8 @@ export function sentItemFor(
     }
     case "receipt": {
       const receipt = parseReceiptPayload(payload);
-      if (!receipt) return unsupportedItem(message, "outgoing");
-      const record = receiptRecord(receipt, true, false);
+      if (!receipt) return unsupportedItem(message);
+      const record = receiptRecord(receipt, outgoing, false);
       return {
         ...base,
         kind: "receipt",
@@ -626,7 +788,7 @@ export function sentItemFor(
     }
     case "decline": {
       const decline = parseDeclinePayload(payload);
-      if (!decline) return unsupportedItem(message, "outgoing");
+      if (!decline) return unsupportedItem(message);
       return {
         ...base,
         kind: "decline",
@@ -646,7 +808,7 @@ export function sentItemFor(
           : envelope.type === "escrow_claim"
             ? parseEscrowClaimPayload(payload)
             : parseEscrowTimeoutPayload(payload);
-      if (!update) return unsupportedItem(message, "outgoing");
+      if (!update) return unsupportedItem(message);
       const operation = envelope.type.slice("escrow_".length);
       return {
         ...base,
@@ -658,29 +820,30 @@ export function sentItemFor(
         records: [],
       };
     }
+    case "contact_snapshot":
+    case "backup_snapshot":
+    case "backup_pointer": {
+      const kind = backupKindOf(message);
+      if (!kind) return unsupportedItem(message);
+      return {
+        ...base,
+        kind: "backup",
+        label: kind === "contacts" ? "Contact backup" : "RFQ history backup",
+        preview:
+          kind === "contacts"
+            ? "Encrypted contact backup · wallet + mailbox recovery phrase required"
+            : "Encrypted RFQ history backup · verification-only",
+        body: "",
+        needsAction: null,
+        records: [],
+        backupKind: kind,
+      };
+    }
     default:
-      return unsupportedItem(message, "outgoing");
+      return unsupportedItem(message);
   }
 }
 
-function paymentLinkItem(
-  message: LocalMailMessage,
-  request: PaymentRequestPayload,
-  payment: PaymentRecord | undefined,
-  now: number,
-): PartialItem {
-  const record = invoiceRecord(request, payment, false, now);
-  return {
-    ...baseItem(message, "payment-link", "incoming"),
-    kind: "invoice",
-    label: "Invoice",
-    preview: record.facts.terms,
-    body: "",
-    needsAction: record.needsAction,
-    records: [record],
-  };
-}
-
 function recordItem(
   id: string,
   record: ChatRecord,
@@ -718,6 +881,8 @@ function contactFor(
   );
   if (entry) {
     return {
+      key: address,
+      kind: "counterparty",
       address,
       label: entry.label,
       nameSource: "address-book",
@@ -726,9 +891,23 @@ function contactFor(
   }
   const alias = findAliasByAddress(aliases, address);
   if (alias) {
-    return { address, label: alias.label, nameSource: "alias", saved: false };
+    return {
+      key: address,
+      kind: "counterparty",
+      address,
+      label: alias.label,
+      nameSource: "alias",
+      saved: false,
+    };
   }
-  return { address, label: null, nameSource: "none", saved: false };
+  return {
+    key: address,
+    kind: "counterparty",
+    address,
+    label: null,
+    nameSource: "none",
+    saved: false,
+  };
 }
 
 function compareConversations(
@@ -743,138 +922,276 @@ function compareConversations(
   return leftName < rightName ? -1 : leftName > rightName ? 1 : 0;
 }
 
+type Placement =
+  | { key: string; kind: "counterparty"; address: string }
+  | { key: typeof SELF_CONVERSATION_KEY; kind: "self" }
+  | { key: string; kind: "sealed"; threadKey: string };
+
 export function buildChatModel(input: ChatModelInput): ChatModel {
   const self = canonical(input.selfAddress);
   const now = input.now ?? nowSeconds();
-  const itemsByContact = new Map<string, ChatItem[]>();
-  const push = (contact: string, item: ChatItem) => {
-    const existing = itemsByContact.get(contact);
+  const isSelf = (address: string) => Boolean(self && feltEquals(address, self));
+  const itemsByKey = new Map<string, ChatItem[]>();
+  const placements = new Map<string, Placement>();
+  const push = (placement: Placement, item: ChatItem) => {
+    placements.set(placement.key, placement);
+    const existing = itemsByKey.get(placement.key);
     if (existing) existing.push(item);
-    else itemsByContact.set(contact, [item]);
+    else itemsByKey.set(placement.key, [item]);
   };
 
-  const sentDealIds = new Set<string>();
-  const sentRequestIds = new Set<string>();
-  const sentEscrowIds = new Set<string>();
-  let unattributedSent = 0;
-
-  for (const message of input.sent) {
-    const partial = sentItemFor(message, input, now);
-    for (const record of partial.records) {
-      if (record.offer) sentDealIds.add(record.offer.dealId);
-      if (record.request) sentRequestIds.add(record.request.requestId);
-      if (record.fund) sentEscrowIds.add(record.fund.dealId);
-    }
-    const stored = message.recipients ?? [];
-    const recipients = [
+  const sentDocumentIds = new Set<string>();
+  /* Which counterparty a mailbox thread belongs to: a Sent copy with one
+     stored recipient, or a decrypted record with a name or a payload claim. */
+  const threadOwners = new Map<string, string>();
+  /* Which counterparty a deal, request or escrow is with. Accept, receipt
+     and escrow memos name only the deal, so this is how a counterparty's
+     answer lands in their conversation. The ids are 32-byte secrets shared
+     by the two parties; a memo naming one is still an unverified claim, and
+     the cards say so. */
+  const dealOwners = new Map<string, string>();
+  const recipientsOf = (message: LocalMailMessage): string[] =>
+    [
       ...new Set(
-        stored
+        (message.recipients ?? [])
           .map(canonical)
           .filter((address): address is string => address !== null),
       ),
-    ].filter((address) => !self || !feltEquals(address, self));
-    if (!recipients.length) {
-      // Self-mail (backups, self-tests) is Mailbox's business; a copy with no
-      // stored recipient at all is counted so the rail can say so.
-      if (stored.length === 0) unattributedSent += 1;
+    ].filter((address) => !isSelf(address));
+  const claimOwner = (ids: readonly string[], owner: string) => {
+    for (const id of ids) dealOwners.set(id, owner);
+  };
+
+  for (const deal of Object.values(input.otc.deals)) {
+    const offerer = canonical(deal.offer.offerer);
+    if (offerer && !isSelf(offerer)) dealOwners.set(deal.dealId, offerer);
+  }
+  for (const payment of Object.values(input.otc.payments)) {
+    const requester = canonical(payment.request.requester);
+    if (requester && !isSelf(requester)) {
+      dealOwners.set(payment.requestId, requester);
+    }
+  }
+  for (const deal of Object.values(input.escrow.deals)) {
+    const maker = canonical(deal.fund.maker);
+    if (maker && !isSelf(maker)) dealOwners.set(deal.dealId, maker);
+  }
+
+  for (const message of input.messages) {
+    if (messageDirection(message) === "outgoing") {
+      const documentId = stableDocumentId(message);
+      if (documentId) sentDocumentIds.add(documentId);
+      const recipients = recipientsOf(message);
+      if (recipients.length === 1) {
+        threadOwners.set(conversationKeyForMessage(message), recipients[0]);
+        claimOwner(
+          [...openedDealIds(message), ...answeredDealIds(message)],
+          recipients[0],
+        );
+      }
       continue;
     }
-    for (const recipient of recipients) {
-      push(recipient, {
-        ...partial,
-        contact: recipient,
-        otherRecipients: recipients.length - 1,
-      });
+    const attributed =
+      canonical(message.assignedAddress) ??
+      claimedFinancialAddress(message, input.selfAddress);
+    if (attributed && !isSelf(attributed)) {
+      const thread = conversationKeyForMessage(message);
+      if (!threadOwners.has(thread)) threadOwners.set(thread, attributed);
+      claimOwner(openedDealIds(message), attributed);
     }
   }
+  const dealOwnerOf = (message: LocalMailMessage): string | null => {
+    for (const id of answeredDealIds(message)) {
+      const owner = dealOwners.get(id);
+      if (owner) return owner;
+    }
+    return null;
+  };
 
-  for (const message of input.paymentLinks) {
-    if (message.envelope.type !== "payment_request") continue;
-    const request = parsePaymentRequestPayload(message.envelope.payload);
-    if (!request) continue;
-    const requester = canonical(request.requester);
-    if (!requester || (self && feltEquals(requester, self))) continue;
-    push(requester, {
-      ...paymentLinkItem(
-        message,
-        request,
-        input.otc.payments[request.requestId],
-        now,
-      ),
-      contact: requester,
-      otherRecipients: 0,
-    });
+  const coveredDeals = new Set<string>();
+  const coveredRequests = new Set<string>();
+  const coveredEscrows = new Set<string>();
+  let unattributedSent = 0;
+
+  for (const message of input.messages) {
+    const partial = messageItemFor(message, input, now);
+    for (const record of partial.records) {
+      if (record.offer) coveredDeals.add(record.offer.dealId);
+      if (record.request) coveredRequests.add(record.request.requestId);
+      if (record.fund) coveredEscrows.add(record.fund.dealId);
+    }
+    if (partial.direction === "outgoing") {
+      const stored = message.recipients ?? [];
+      const recipients = recipientsOf(message);
+      if (!recipients.length) {
+        // A copy addressed only to this wallet is self-mail (backups, tests);
+        // one with no stored recipient at all is counted so the rail can say so.
+        if (stored.length === 0) unattributedSent += 1;
+        else {
+          push(
+            { key: SELF_CONVERSATION_KEY, kind: "self" },
+            {
+              ...partial,
+              conversationKey: SELF_CONVERSATION_KEY,
+              otherRecipients: 0,
+            },
+          );
+        }
+        continue;
+      }
+      for (const recipient of recipients) {
+        push(
+          { key: recipient, kind: "counterparty", address: recipient },
+          {
+            ...partial,
+            conversationKey: recipient,
+            otherRecipients: recipients.length - 1,
+          },
+        );
+      }
+      continue;
+    }
+
+    // A letter this wallet sent to several recipients comes back to it as a
+    // decrypted record too; the Sent copy already tells that story.
+    const documentId = stableDocumentId(message);
+    if (documentId && sentDocumentIds.has(documentId)) continue;
+
+    if (isBackupEnvelope(message)) {
+      push(
+        { key: SELF_CONVERSATION_KEY, kind: "self" },
+        { ...partial, conversationKey: SELF_CONVERSATION_KEY, otherRecipients: 0 },
+      );
+      continue;
+    }
+
+    const thread = conversationKeyForMessage(message);
+    const address =
+      canonical(message.assignedAddress) ??
+      claimedFinancialAddress(message, input.selfAddress) ??
+      threadOwners.get(thread) ??
+      dealOwnerOf(message);
+    if (address && !isSelf(address)) {
+      push(
+        { key: address, kind: "counterparty", address },
+        { ...partial, conversationKey: address, otherRecipients: 0 },
+      );
+      continue;
+    }
+    const key = sealedConversationKey(thread);
+    push(
+      { key, kind: "sealed", threadKey: thread },
+      { ...partial, conversationKey: key, otherRecipients: 0 },
+    );
   }
 
+  /* Deal state Mailbox saved earlier still shows when its message is not
+     decrypted in this session; a decrypted record always wins over it. */
   for (const deal of Object.values(input.otc.deals)) {
-    if (sentDealIds.has(deal.dealId)) continue;
+    if (coveredDeals.has(deal.dealId)) continue;
     const offerer = canonical(deal.offer.offerer);
-    if (!offerer || (self && feltEquals(offerer, self))) continue;
+    if (!offerer || isSelf(offerer)) continue;
     const record = offerRecord(deal.offer, deal, false, now);
-    push(offerer, {
-      ...recordItem(
-        `record:${record.id}`,
-        record,
-        "offer",
-        "Offer",
-        deal.updatedAt * 1_000,
-      ),
-      contact: offerer,
-      otherRecipients: 0,
-    });
+    push(
+      { key: offerer, kind: "counterparty", address: offerer },
+      {
+        ...recordItem(
+          `record:${record.id}`,
+          record,
+          "offer",
+          "Offer",
+          deal.updatedAt * 1_000,
+        ),
+        conversationKey: offerer,
+        otherRecipients: 0,
+      },
+    );
   }
-
   for (const payment of Object.values(input.otc.payments)) {
-    if (sentRequestIds.has(payment.requestId)) continue;
-    if (payment.origin === "payment_link") continue;
+    if (coveredRequests.has(payment.requestId)) continue;
     const requester = canonical(payment.request.requester);
-    if (!requester || (self && feltEquals(requester, self))) continue;
+    if (!requester || isSelf(requester)) continue;
     const record = invoiceRecord(payment.request, payment, false, now);
-    push(requester, {
-      ...recordItem(
-        `record:${record.id}`,
-        record,
-        "invoice",
-        "Invoice",
-        payment.updatedAt * 1_000,
-      ),
-      contact: requester,
-      otherRecipients: 0,
-    });
+    push(
+      { key: requester, kind: "counterparty", address: requester },
+      {
+        ...recordItem(
+          `record:${record.id}`,
+          record,
+          "invoice",
+          "Invoice",
+          payment.updatedAt * 1_000,
+        ),
+        conversationKey: requester,
+        otherRecipients: 0,
+      },
+    );
   }
-
   for (const escrow of Object.values(input.escrow.deals)) {
-    if (sentEscrowIds.has(escrow.dealId)) continue;
+    if (coveredEscrows.has(escrow.dealId)) continue;
     const maker = canonical(escrow.fund.maker);
-    if (!maker || (self && feltEquals(maker, self))) continue;
+    if (!maker || isSelf(maker)) continue;
     const record = escrowRecord(escrow.fund, escrow, false, now);
-    push(maker, {
-      ...recordItem(
-        `record:${record.id}`,
-        record,
-        "escrow",
-        "Escrow",
-        escrow.updatedAt * 1_000,
-      ),
-      contact: maker,
-      otherRecipients: 0,
-    });
+    push(
+      { key: maker, kind: "counterparty", address: maker },
+      {
+        ...recordItem(
+          `record:${record.id}`,
+          record,
+          "escrow",
+          "Escrow",
+          escrow.updatedAt * 1_000,
+        ),
+        conversationKey: maker,
+        otherRecipients: 0,
+      },
+    );
   }
 
-  const contacts = new Set(itemsByContact.keys());
   for (const entry of input.addressBook) {
     const address = canonical(entry.address);
-    if (address && (!self || !feltEquals(address, self))) contacts.add(address);
+    if (address && !isSelf(address) && !placements.has(address)) {
+      placements.set(address, { key: address, kind: "counterparty", address });
+    }
+  }
+  for (const raw of input.extraContacts ?? []) {
+    const address = canonical(raw);
+    if (address && !isSelf(address) && !placements.has(address)) {
+      placements.set(address, { key: address, kind: "counterparty", address });
+    }
   }
 
   const conversations: ChatConversation[] = [];
-  for (const address of contacts) {
-    const items = (itemsByContact.get(address) ?? []).slice().sort(compareItems);
+  for (const placement of placements.values()) {
+    const items = (itemsByKey.get(placement.key) ?? [])
+      .slice()
+      .sort(compareItems);
+    const contact: ChatContact =
+      placement.kind === "counterparty"
+        ? contactFor(placement.address, input.addressBook, input.aliases)
+        : placement.kind === "self"
+          ? {
+              key: SELF_CONVERSATION_KEY,
+              kind: "self",
+              address: self,
+              label: "This mailbox",
+              nameSource: "none",
+              saved: false,
+            }
+          : {
+              key: placement.key,
+              kind: "sealed",
+              address: null,
+              label: null,
+              nameSource: "none",
+              saved: false,
+              threadKey: placement.threadKey,
+            };
     const unreadCount = items.filter(
       (item) => item.direction === "incoming" && !input.readIds.has(item.id),
     ).length;
     conversations.push({
-      contact: contactFor(address, input.addressBook, input.aliases),
+      contact,
       items,
       latest: items.length ? items[items.length - 1] : null,
       unreadCount,
@@ -887,13 +1204,16 @@ export function buildChatModel(input: ChatModelInput): ChatModel {
 
 function conversationHaystack(conversation: ChatConversation): string {
   return [
+    contactDisplayName(conversation.contact),
     conversation.contact.label ?? "",
-    conversation.contact.address,
+    conversation.contact.address ?? "",
     ...conversation.items.flatMap((item) => [
       item.label,
       item.preview,
+      item.body,
       ...item.records.map(
-        (record) => `${record.facts.title} ${record.facts.status}`,
+        (record) =>
+          `${record.facts.title} ${record.facts.terms} ${record.facts.status}`,
       ),
     ]),
   ]
@@ -919,23 +1239,32 @@ export function rfqNamesContact(
   record: Pick<RfqLifecycleRecord, "selectedQuote" | "fills">,
   contact: ChatContact,
 ): boolean {
+  if (!contact.address) return false;
+  const address = contact.address;
   const makerIds = [
     record.selectedQuote?.solverId,
     ...(record.fills ?? []).map((fill) => fill.makerId),
-  ].filter((value): value is string => typeof value === "string" && value !== "");
+  ].filter(
+    (value): value is string => typeof value === "string" && value !== "",
+  );
   if (!makerIds.length) return false;
   const label = contact.label?.trim().toLowerCase();
   return makerIds.some(
     (makerId) =>
-      (label !== undefined && label !== "" && makerId.toLowerCase() === label) ||
-      feltEquals(makerId, contact.address),
+      (label !== undefined &&
+        label !== "" &&
+        makerId.toLowerCase() === label) ||
+      feltEquals(makerId, address),
   );
 }
 
 function rfqEntry(record: RfqLifecycleRecord): ChatContextEntry {
   const terms = record.terms
     ? `${amountLabel({
-        token: { symbol: record.terms.sellSymbol, decimals: record.terms.sellDecimals },
+        token: {
+          symbol: record.terms.sellSymbol,
+          decimals: record.terms.sellDecimals,
+        },
         amount: record.terms.sellAmount,
       })} → ${collapse(record.terms.buySymbol)}`
     : "Terms not stored";
@@ -966,7 +1295,7 @@ function recordEntry(
     status: record.facts.status,
     tone: record.facts.tone,
     open: record.facts.open,
-    direction: item.direction,
+    direction: record.own ? "outgoing" : "incoming",
     itemId: item.id,
     record,
   };
@@ -996,7 +1325,8 @@ export function buildContactContext(
       } else if (
         record.facts.kind === "invoice" &&
         (record.facts.open ||
-          record.payment?.paymentOperation?.state === "awaiting-note-maturity" ||
+          record.payment?.paymentOperation?.state ===
+            "awaiting-note-maturity" ||
           record.payment?.paymentOperation?.state === "submitted" ||
           record.payment?.paymentOperation?.state === "reserved")
       ) {
@@ -1024,3 +1354,13 @@ export function unreadItemIds(conversation: ChatConversation): string[] {
     .filter((item) => item.direction === "incoming")
     .map((item) => item.id);
 }
+
+/** The decrypted record a sealed thread can be named through. */
+export function namingTarget(
+  conversation: ChatConversation,
+): LocalMailMessage | null {
+  for (const item of conversation.items) {
+    if (item.direction === "incoming" && item.message) return item.message;
+  }
+  return null;
+}
diff --git a/src/app/chat/chat-send.ts b/src/app/chat/chat-send.ts
index 9379a04..296baf5 100644
--- a/src/app/chat/chat-send.ts
+++ b/src/app/chat/chat-send.ts
@@ -13,7 +13,7 @@ import {
 } from "@/lib/mail";
 import { createMailSenderAuth, type MailSenderAuth } from "@/lib/mail-auth";
 import { randomConversationId } from "@/lib/mail-thread";
-import { saveSentMail, type StoredSentMail } from "@/lib/sent-mail";
+import type { SentEnvelope } from "@/components/mail/Compose";
 import {
   APP20_HELPER_FUNDING_BASE_UNITS,
   assertPrivateStrk20BatchBalance,
@@ -26,7 +26,7 @@ import { assertWalletOperationPolicy } from "@/lib/wallet-policy";
 import { addrSTRK } from "@/utils/constants";
 
 /**
- * The chat composer sends exactly what Mailbox's Compose sends for a body-only
+ * The chat composer sends exactly what the document composer sends for a body-only
  * document: one encrypted `text` envelope to one registered mailbox, funded by
  * the same fixed helper deposit, through the same wallet policy. Every step
  * below is the Compose step it mirrors; Chat never gets a looser path.
@@ -59,7 +59,7 @@ export type ChatSendBlocker = Readonly<{
   message: string;
 }>;
 
-/** The same reasons, in the same order, that disable Send in Mailbox. */
+/** The same reasons, in the same order, that disable Send in the document composer. */
 export function chatSendBlocker(
   readiness: ChatSendReadiness,
 ): ChatSendBlocker | null {
@@ -199,7 +199,8 @@ export type ChatSendContext = Readonly<{
   selectedWallet: WalletWithStarknetFeatures;
   senderAddress: string;
   chainId: string;
-  mailSeed: Uint8Array;
+  /** Null for a mailbox opened without its recovery seed: the letter is then unsigned. */
+  mailSeed: Uint8Array | null;
   keypair: MailKeypair;
 }>;
 
@@ -209,17 +210,13 @@ export type ChatSendInput = Readonly<{
   conversationId?: string;
   inReplyTo?: string;
   context: ChatSendContext;
-  storage: Pick<Storage, "getItem" | "setItem">;
   onPhase?: (phase: ChatSendPhase, detail: string) => void;
-  now?: () => number;
 }>;
 
+/** The confirmed letter in the shape the mailbox desk records as its Sent copy. */
 export type ChatSendResult = Readonly<{
-  sent: StoredSentMail;
+  envelope: SentEnvelope;
   transactionHash: string;
-  /** False when the chain confirmed the letter but browser storage refused the copy. */
-  localCopySaved: boolean;
-  localCopyError?: string;
 }>;
 
 export class ChatSendError extends Error {
@@ -244,7 +241,7 @@ export async function sendChatLetter(
   }
   if (feltEquals(recipient, context.senderAddress)) {
     throw new ChatSendError(
-      "This is your own mailbox. Self-addressed backups are posted from Mailbox.",
+      "This is your own mailbox. Self-addressed backups are posted from the mailbox tools.",
     );
   }
   let letter: ChatLetter;
@@ -325,9 +322,9 @@ export async function sendChatLetter(
       },
     );
 
-    const sent: StoredSentMail = {
-      version: 1,
+    const envelope: SentEnvelope = {
       documentId: letter.documentId,
+      draftId: letter.documentId,
       type: "text",
       payload: letter.payload,
       plaintext: input.body,
@@ -337,20 +334,8 @@ export async function sendChatLetter(
       recipientCount: 1,
       recipients: [recipient],
       deliveryState: "confirmed",
-      createdAt: (input.now ?? Date.now)(),
     };
-    try {
-      saveSentMail(input.storage, context.chainId, context.senderAddress, sent);
-    } catch (error: unknown) {
-      return {
-        sent,
-        transactionHash: result.transactionHash,
-        localCopySaved: false,
-        localCopyError:
-          error instanceof Error ? error.message : "Browser storage failed.",
-      };
-    }
-    return { sent, transactionHash: result.transactionHash, localCopySaved: true };
+    return { envelope, transactionHash: result.transactionHash };
   } catch (error: unknown) {
     if (error instanceof ChatSendError) throw error;
     const base = strk20ErrorMessage(error);
diff --git a/src/app/chat/chat.module.css b/src/app/chat/chat.module.css
index 9517cfe..244b8eb 100644
--- a/src/app/chat/chat.module.css
+++ b/src/app/chat/chat.module.css
@@ -186,11 +186,17 @@
   text-transform: uppercase;
 }
 
-.conversationList {
+.railScroll {
+  display: flex;
   flex: 1;
+  flex-direction: column;
   min-height: 0;
   overflow-x: hidden;
   overflow-y: auto;
+}
+
+.conversationList {
+  flex: none;
   list-style: none;
 }
 
@@ -923,56 +929,6 @@
   border-left-color: var(--shell-orange);
 }
 
-.unlockForm {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: var(--space-3, 6px);
-}
-
-.unlockForm span {
-  flex: 1 1 100%;
-  color: var(--shell-muted);
-  font-size: var(--text-xs, 11px);
-  line-height: 1.45;
-}
-
-.unlockForm input {
-  min-width: 0;
-  flex: 1 1 180px;
-  min-height: 32px;
-  border: 1px solid var(--shell-line);
-  border-radius: 0;
-  padding: 0 8px;
-  color: var(--shell-text);
-  background: var(--shell-bg);
-  font: inherit;
-  font-size: var(--text-sm, 12px);
-}
-
-.unlockForm button {
-  min-height: 32px;
-  border: 1px solid var(--shell-line);
-  padding: 0 10px;
-  color: var(--shell-text);
-  background: var(--shell-inset);
-  cursor: pointer;
-  font-family: var(--font-mono-ui), monospace;
-  font-size: var(--label-sm, 9px);
-  font-weight: 800;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-}
-
-.unlockForm button:hover:not(:disabled) {
-  border-color: var(--shell-orange);
-}
-
-.unlockForm button:disabled {
-  cursor: not-allowed;
-  opacity: var(--disabled-opacity, 0.38);
-}
-
 /* ── Right: contact context ──────────────────────────────────────────────── */
 
 .context {
@@ -1261,6 +1217,465 @@
   display: none;
 }
 
+/* ── Notices, key setup and the document sheet ──────────────────────────── */
+
+.notice {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+  margin: 0 0 12px;
+  padding: 8px 10px;
+  border-left: var(--border-record-width, 4px) solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-panel);
+  font-size: var(--text-sm, 12px);
+  line-height: 1.5;
+  overflow-wrap: anywhere;
+}
+
+.notice > span:first-child {
+  flex: 1 1 240px;
+}
+
+.notice[data-kind="ok"] {
+  border-left-color: var(--shell-live);
+}
+
+.notice[data-kind="error"] {
+  border-left-color: var(--shell-danger);
+  color: var(--shell-text);
+  background: color-mix(in srgb, var(--shell-danger) 14%, var(--shell-bg));
+}
+
+.noticeDismiss {
+  flex: none;
+  min-width: 28px;
+  min-height: 28px;
+  border: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-bg);
+  cursor: pointer;
+  font: inherit;
+  font-size: 14px;
+}
+
+.noticeDismiss:hover {
+  border-color: var(--shell-orange);
+  color: var(--shell-text);
+}
+
+/* Onboard and Compose keep their own mail styling; the desk only frames
+   them so they read as sheets inside the conversation. */
+.keySetup,
+.sheet {
+  display: grid;
+  gap: var(--space-4, 8px);
+  max-width: 760px;
+  margin: 0 auto 16px;
+}
+
+.keyNotice {
+  display: grid;
+  gap: 2px;
+  padding: 9px 11px;
+  border: 1px solid var(--shell-orange);
+  color: var(--shell-text);
+  background: var(--accent-wash, var(--shell-panel));
+  font-size: var(--text-sm, 12px);
+  line-height: 1.5;
+}
+
+.keyNotice strong {
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.keyNotice span {
+  color: var(--shell-muted);
+}
+
+.keyNotice a {
+  color: var(--shell-orange);
+  text-decoration: underline;
+}
+
+.composerActions {
+  display: inline-flex;
+  flex: none;
+  flex-wrap: wrap;
+  gap: var(--space-3, 6px);
+}
+
+.attachButton {
+  min-height: 36px;
+  border: 1px solid var(--shell-line);
+  padding: 0 12px;
+  color: var(--shell-text);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  transition: var(--transition-control, none);
+}
+
+.attachButton:hover:not(:disabled) {
+  border-color: var(--shell-orange);
+}
+
+.attachButton:disabled {
+  cursor: not-allowed;
+  opacity: var(--disabled-opacity, 0.38);
+}
+
+/* A conversation with nothing to write to: the mailbox itself, or a thread
+   whose sender has not been named. */
+.composerNote {
+  flex: none;
+  padding: 10px 14px;
+  border-top: 1px solid var(--shell-line);
+  color: var(--shell-muted);
+  background: var(--shell-panel);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.5;
+}
+
+/* ── Timeline evidence: naming, proofs, notices, chain records ───────────── */
+
+.naming {
+  display: grid;
+  gap: var(--space-4, 8px);
+  max-width: 560px;
+  margin: 0 0 16px;
+  padding: 12px 14px;
+  border: 1px solid var(--shell-orange);
+  background: var(--shell-panel);
+}
+
+.namingNote {
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.5;
+}
+
+.namingSave {
+  justify-self: start;
+  min-height: 32px;
+  border: 1px solid var(--shell-orange);
+  padding: 0 12px;
+  color: var(--shell-bg);
+  background: var(--shell-orange);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.namingSave:hover {
+  color: var(--shell-orange);
+  background: transparent;
+}
+
+.entryProof {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 4px 10px;
+  width: 100%;
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.04em;
+}
+
+.entryProof p {
+  flex: 1 1 100%;
+  color: var(--shell-text);
+  font-family: var(--font-body), system-ui, sans-serif;
+  font-size: var(--text-xs, 11px);
+  letter-spacing: 0;
+  line-height: 1.45;
+}
+
+.entryProof button {
+  min-height: 24px;
+  border: 1px solid var(--shell-line);
+  padding: 0 8px;
+  color: var(--shell-text);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font: inherit;
+  font-weight: 700;
+  text-transform: uppercase;
+}
+
+.entryProof button:hover {
+  border-color: var(--shell-orange);
+}
+
+.entryNotice {
+  width: 100%;
+  padding: 7px 10px;
+  border-left: var(--border-record-width, 4px) solid var(--shell-orange);
+  color: var(--shell-muted);
+  background: var(--shell-panel);
+  font-size: var(--text-xs, 11px);
+  line-height: 1.5;
+}
+
+.entrySubmissions {
+  display: grid;
+  gap: 3px;
+  width: 100%;
+  padding: 8px 10px;
+  border: 1px dashed var(--shell-line);
+  color: var(--shell-muted);
+  font-size: var(--text-2xs, 10px);
+  line-height: 1.45;
+}
+
+.entrySubmissions strong {
+  color: var(--shell-text);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.entrySubmissions code {
+  font-family: var(--font-mono-ui), monospace;
+  overflow-wrap: anywhere;
+}
+
+.entryChain {
+  width: 100%;
+  color: var(--shell-muted);
+  font-size: var(--text-xs, 11px);
+}
+
+/* ── Mailbox tools under the conversations ──────────────────────────────── */
+
+.tools {
+  display: grid;
+  flex: none;
+  margin-top: auto;
+  border-top: 2px solid var(--shell-line);
+  background: var(--shell-panel);
+}
+
+.toolsSection,
+.toolsForm,
+.toolsBody {
+  display: grid;
+  gap: var(--space-3, 6px);
+  padding: 10px 14px;
+}
+
+.toolsSection {
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.toolsHead {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+}
+
+.toolsHead strong,
+.toolsDisclosure > summary {
+  color: var(--shell-text);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-md, 10px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.toolsKeyState {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+}
+
+.toolsActions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-3, 6px);
+}
+
+.toolsActions button,
+.toolsForm button,
+.toolsBody button {
+  min-height: 32px;
+  border: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-text);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-align: left;
+  text-transform: uppercase;
+}
+
+.toolsActions:not([data-variant="plain"]) button:first-child {
+  border-color: var(--shell-orange);
+  color: var(--shell-bg);
+  background: var(--shell-orange);
+}
+
+.toolsActions button:hover:not(:disabled),
+.toolsForm button:hover:not(:disabled),
+.toolsBody button:hover:not(:disabled) {
+  border-color: var(--shell-orange);
+}
+
+.toolsActions button:disabled,
+.toolsForm button:disabled,
+.toolsBody button:disabled {
+  cursor: not-allowed;
+  opacity: var(--disabled-opacity, 0.38);
+}
+
+.toolsNote {
+  color: var(--shell-muted);
+  font-size: var(--text-2xs, 10px);
+  line-height: 1.45;
+  overflow-wrap: anywhere;
+}
+
+.toolsNote[data-kind="error"] {
+  color: var(--shell-danger);
+}
+
+.toolsDisclosure {
+  border-bottom: 1px solid var(--shell-line);
+}
+
+.toolsDisclosure > summary {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-4, 8px);
+  padding: 9px 14px;
+  cursor: pointer;
+  list-style: none;
+}
+
+.toolsDisclosure > summary::-webkit-details-marker {
+  display: none;
+}
+
+.toolsDisclosure > summary::after {
+  content: "+";
+  color: var(--shell-muted);
+}
+
+.toolsDisclosure[open] > summary::after {
+  content: "\2212";
+}
+
+.toolsDisclosure > summary strong {
+  color: var(--shell-muted);
+  font-weight: 700;
+}
+
+.draftList {
+  display: grid;
+  gap: 1px;
+  list-style: none;
+  background: var(--shell-line);
+}
+
+.draftList li {
+  display: flex;
+  align-items: stretch;
+  background: var(--shell-bg);
+}
+
+.draftOpen {
+  display: grid;
+  flex: 1;
+  min-width: 0;
+  gap: 2px;
+  padding: 8px 14px;
+  border: 0;
+  color: var(--shell-text);
+  background: transparent;
+  cursor: pointer;
+  font: inherit;
+  font-size: var(--text-xs, 11px);
+  text-align: left;
+}
+
+.draftOpen span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.draftOpen small {
+  color: var(--shell-muted);
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+}
+
+.draftOpen:hover {
+  background: var(--shell-inset);
+}
+
+.draftDelete {
+  flex: none;
+  border: 0;
+  border-left: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-muted);
+  background: transparent;
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.draftDelete:hover {
+  color: var(--shell-danger);
+}
+
+.toolsCheck {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--space-3, 6px);
+  color: var(--shell-muted);
+  font-size: var(--text-2xs, 10px);
+  line-height: 1.45;
+}
+
+.toolsCheck input {
+  margin-top: 1px;
+  accent-color: var(--shell-orange);
+}
+
+.toolsDanger {
+  border-color: var(--shell-danger) !important;
+  color: var(--shell-danger) !important;
+}
+
 /* ── Responsive ──────────────────────────────────────────────────────────── */
 
 @media (max-width: 1179px) {
@@ -1276,12 +1691,17 @@
     z-index: 40;
     width: min(360px, 100vw);
     box-shadow: var(--shadow-hard, 4px 4px 0 rgb(0 0 0 / 35%));
+    visibility: hidden;
     transform: translateX(100%);
-    transition: transform var(--duration-fast, 120ms) ease;
+    transition:
+      transform var(--duration-fast, 120ms) ease,
+      visibility 0s linear var(--duration-fast, 120ms);
   }
 
   .contextOpen .context {
+    visibility: visible;
     transform: translateX(0);
+    transition-delay: 0s;
   }
 
   .contextButton,
diff --git a/src/app/inbox/mailbox-model.test.ts b/src/app/chat/mailbox-model.test.ts
similarity index 93%
rename from src/app/inbox/mailbox-model.test.ts
rename to src/app/chat/mailbox-model.test.ts
index 9662c73..f002feb 100644
--- a/src/app/inbox/mailbox-model.test.ts
+++ b/src/app/chat/mailbox-model.test.ts
@@ -9,20 +9,17 @@ import {
 import { createBackupSnapshot } from "@/lib/backup-snapshot";
 import { computeCidV1Raw } from "@/lib/blob-store";
 import { addrSTRK } from "@/utils/constants";
-import type { LocalMailMessage } from "@/components/mail/Thread";
+import type { LocalMailMessage } from "@/components/mail/message";
 import type { EncryptedMailRecord } from "@/lib/mail";
 import {
-  countMailboxFilterHits,
   escrowForNetwork,
   helperForNetwork,
-  mailboxMatchesFilter,
   mailMessageDateTime,
   mergeDisplayAliases,
   mergeMailMessages,
   newestBackupMessages,
   loadBackupSnapshotWithFallback,
   parseBlockTimestamp,
-  partitionMailboxFolders,
   paymentLinkToLocal,
   sortMailMessages,
 } from "./mailbox-model";
@@ -221,7 +218,7 @@ describe("mailbox list model", () => {
       "contacts-2",
       "rfq-1",
     ]);
-    expect(mailboxMatchesFilter(newestContacts, "letters")).toBe(true);
+    expect(newestContacts.envelope.type).toBe("backup_pointer");
   });
 
   it("ignores tampered high-sequence pointers and inline snapshots before ranking", () => {
@@ -437,28 +434,6 @@ describe("mailbox list model", () => {
     expect(fetches).toBe(3);
   });
 
-  it("partitions inbox and sent in one pass", () => {
-    const folders = partitionMailboxFolders([
-      textMessage("in"),
-      textMessage("out", { direction: "outgoing" }),
-    ]);
-    expect(folders.inbox.map((message) => message.id)).toEqual(["in"]);
-    expect(folders.sent.map((message) => message.id)).toEqual(["out"]);
-  });
-
-  it("counts composite filter hits without extra full-list scans", () => {
-    const message = invoiceMessage(`0x${"22".repeat(32)}`);
-    expect(mailboxMatchesFilter(message, "invoices")).toBe(true);
-    expect(mailboxMatchesFilter(message, "letters")).toBe(false);
-    expect(countMailboxFilterHits([message, textMessage("letter")])).toEqual({
-      all: 2,
-      letters: 1,
-      deals: 0,
-      invoices: 1,
-      escrow: 0,
-    });
-  });
-
   it("exposes an ISO timestamp for accessible list times", () => {
     const message = textMessage("dated", {
       localCreatedAt: Date.UTC(2026, 0, 2),
diff --git a/src/app/inbox/mailbox-model.ts b/src/app/chat/mailbox-model.ts
similarity index 75%
rename from src/app/inbox/mailbox-model.ts
rename to src/app/chat/mailbox-model.ts
index b89651d..4b8d886 100644
--- a/src/app/inbox/mailbox-model.ts
+++ b/src/app/chat/mailbox-model.ts
@@ -1,9 +1,8 @@
 "use client";
 
 import { validateAndParseAddress } from "starknet";
-import type { LocalMailMessage } from "@/components/mail/Thread";
+import type { LocalMailMessage } from "@/components/mail/message";
 import { parseCompositePayload } from "@/lib/composite";
-import type { CompositeDraft } from "@/lib/drafts";
 import { decodeEnvelope, encodeEnvelope } from "@/lib/envelope";
 import {
   backupBlobDigest,
@@ -43,25 +42,6 @@ export type ActiveScanWorker = {
 
 export type ScanKind = "idle" | "scanning" | "ok" | "error";
 
-export type MailboxFilter = "all" | "letters" | "deals" | "invoices" | "escrow";
-
-export const TYPE_FILTERS: Array<{ id: MailboxFilter; label: string }> = [
-  { id: "all", label: "All types" },
-  { id: "letters", label: "Letters" },
-  { id: "deals", label: "RFQs & deals" },
-  { id: "invoices", label: "Invoices" },
-  { id: "escrow", label: "Escrow" },
-];
-
-export type MailFolder = "inbox" | "sent" | "drafts";
-export const MAIL_FOLDERS: Array<{ id: MailFolder; label: string }> = [
-  { id: "inbox", label: "Inbox" },
-  { id: "sent", label: "Sent" },
-  { id: "drafts", label: "Drafts" },
-];
-
-export type MailboxFilterHits = Record<Exclude<MailboxFilter, "all">, boolean>;
-
 function configuredForLocalnet(
   providerIndex: number,
   localnet: string,
@@ -467,157 +447,6 @@ export function paymentLinkRecords(state: OtcState): PaymentRecord[] {
   );
 }
 
-function attachmentCategory(
-  type: "payment" | "offer" | "payment_request" | "escrow_fund",
-): Exclude<MailboxFilter, "all"> {
-  if (type === "payment_request") return "invoices";
-  if (type === "escrow_fund") return "escrow";
-  return "deals";
-}
-
-function mailboxCategory(
-  message: LocalMailMessage,
-): Exclude<MailboxFilter, "all"> {
-  if (message.envelope.type === "composite") {
-    const composite = parseCompositePayload(message.envelope.payload);
-    if (composite?.body.trim()) return "letters";
-    const first = composite?.attachments[0];
-    return first ? attachmentCategory(first.type) : "letters";
-  }
-  switch (message.envelope.type) {
-    case "text":
-    case "contact_snapshot":
-    case "backup_snapshot":
-    case "backup_pointer":
-      return "letters";
-    case "payment_request":
-      return "invoices";
-    case "escrow_fund":
-    case "escrow_fill":
-    case "escrow_claim":
-    case "escrow_timeout":
-      return "escrow";
-    default:
-      return "deals";
-  }
-}
-
-/** Composite documents can appear under every matching secondary label. */
-export function mailboxFilterHits(
-  message: LocalMailMessage,
-): MailboxFilterHits {
-  if (message.envelope.type !== "composite") {
-    const category = mailboxCategory(message);
-    return {
-      letters: category === "letters",
-      deals: category === "deals",
-      invoices: category === "invoices",
-      escrow: category === "escrow",
-    };
-  }
-  const composite = parseCompositePayload(message.envelope.payload);
-  if (!composite) {
-    return { letters: false, deals: false, invoices: false, escrow: false };
-  }
-  const hits: MailboxFilterHits = {
-    letters: Boolean(composite.body.trim()),
-    deals: false,
-    invoices: false,
-    escrow: false,
-  };
-  for (const attachment of composite.attachments) {
-    hits[attachmentCategory(attachment.type)] = true;
-  }
-  return hits;
-}
-
-export function mailboxMatchesFilter(
-  message: LocalMailMessage,
-  filter: MailboxFilter,
-): boolean {
-  if (filter === "all") return true;
-  return mailboxFilterHits(message)[filter];
-}
-
-export function draftMatchesFilter(
-  draft: CompositeDraft,
-  filter: MailboxFilter,
-): boolean {
-  if (filter === "all") return true;
-  if (filter === "letters" && draft.body.trim()) return true;
-  if (filter === "invoices") {
-    return draft.attachments.some(
-      (attachment) => attachment.type === "payment_request",
-    );
-  }
-  if (filter === "escrow") {
-    return draft.attachments.some(
-      (attachment) => attachment.type === "escrow_fund",
-    );
-  }
-  if (filter === "deals") {
-    return draft.attachments.some(
-      (attachment) =>
-        attachment.type === "offer" || attachment.type === "payment",
-    );
-  }
-  return false;
-}
-
-export function partitionMailboxFolders(
-  messages: readonly LocalMailMessage[],
-): {
-  inbox: LocalMailMessage[];
-  sent: LocalMailMessage[];
-} {
-  const inbox: LocalMailMessage[] = [];
-  const sent: LocalMailMessage[] = [];
-  for (const message of messages) {
-    if (message.direction === "outgoing") sent.push(message);
-    else inbox.push(message);
-  }
-  return { inbox, sent };
-}
-
-export function countMailboxFilterHits(
-  messages: readonly LocalMailMessage[],
-): Record<MailboxFilter, number> {
-  const counts: Record<MailboxFilter, number> = {
-    all: messages.length,
-    letters: 0,
-    deals: 0,
-    invoices: 0,
-    escrow: 0,
-  };
-  for (const message of messages) {
-    const hits = mailboxFilterHits(message);
-    if (hits.letters) counts.letters += 1;
-    if (hits.deals) counts.deals += 1;
-    if (hits.invoices) counts.invoices += 1;
-    if (hits.escrow) counts.escrow += 1;
-  }
-  return counts;
-}
-
-export function countDraftFilterHits(
-  drafts: readonly CompositeDraft[],
-): Record<MailboxFilter, number> {
-  const counts: Record<MailboxFilter, number> = {
-    all: drafts.length,
-    letters: 0,
-    deals: 0,
-    invoices: 0,
-    escrow: 0,
-  };
-  for (const draft of drafts) {
-    if (draftMatchesFilter(draft, "letters")) counts.letters += 1;
-    if (draftMatchesFilter(draft, "deals")) counts.deals += 1;
-    if (draftMatchesFilter(draft, "invoices")) counts.invoices += 1;
-    if (draftMatchesFilter(draft, "escrow")) counts.escrow += 1;
-  }
-  return counts;
-}
-
 function feltFingerprint(address: string): string | null {
   try {
     return BigInt(address).toString(16);
diff --git a/src/app/chat/page.tsx b/src/app/chat/page.tsx
index 0aedc03..a420c34 100644
--- a/src/app/chat/page.tsx
+++ b/src/app/chat/page.tsx
@@ -2,52 +2,37 @@
 
 import { Link } from "@tanstack/react-router";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { validateAndParseAddress } from "starknet";
 import { useActiveStarknetSession } from "@/app/active-session";
-import { useFrontendProvider } from "@/app/components/client/provider/providerContext";
 import SelectWallet from "@/app/components/client/WalletHandle/SelectWallet";
 import { useStoreWallet } from "@/app/components/Wallet/walletContext";
-import {
-  helperForNetwork,
-  paymentLinkRecords,
-  paymentLinkToLocal,
-  storedSentToLocal,
-} from "@/app/inbox/mailbox-model";
 import {
   restoreRfqLifecycle,
   type RfqLifecycleRecord,
 } from "@/app/rfq/rfq-lifecycle";
 import { createIndexedDbRfqStorage } from "@/app/rfq/rfq-storage";
+import Compose, { type SentEnvelope } from "@/components/mail/Compose";
+import Onboard from "@/components/mail/Onboard";
 import { shortenFelt } from "@/components/mail/correspondent";
-import type { LocalMailMessage } from "@/components/mail/Thread";
-import {
-  ADDRESS_BOOK_CHANGED_EVENT,
-  loadAddressBook,
-  type AddressBookEntry,
-} from "@/lib/address-book";
-import { loadAliases, type AliasRecord } from "@/lib/aliases";
-import { emptyEscrowState, loadEscrowState, type EscrowState } from "@/lib/escrow";
-import { deriveKeypair, type MailKeypair } from "@/lib/mail";
-import { loadReadMessageIds, saveReadMessageIds } from "@/lib/mail-read-state";
+import type { AddressBookEntry } from "@/lib/address-book";
+import { canonicalizeStarknetAddress, feltEquals } from "@/lib/addresses";
+import { isBlankDraft, type CompositeDraft } from "@/lib/drafts";
 import {
   conversationFieldsFromPayload,
   parseConversationId,
 } from "@/lib/mail-thread";
-import {
-  inspectMailVault,
-  unwrapMailSeed,
-  type MailVaultRecord,
-} from "@/lib/mail-vault";
-import { emptyOtcState, expireStoredDeals, type OtcState } from "@/lib/otc";
-import { loadSentMail } from "@/lib/sent-mail";
 import * as constants from "@/utils/constants";
-import ChatComposer, {
-  type ChatComposerStatus,
-  type ChatKeyState,
-} from "./ChatComposer";
+import ChatComposer, { type ChatComposerStatus } from "./ChatComposer";
 import ChatContextPanel from "./ChatContextPanel";
 import ChatConversationRail from "./ChatConversationRail";
-import ChatTimeline, { chatEntryDomId } from "./ChatTimeline";
+import ChatMailboxTools from "./ChatMailboxTools";
+import type { ChatRecordActions } from "./ChatRecordCard";
+import ChatTimeline, {
+  chatEntryDomId,
+  type ChatTimelineHandlers,
+} from "./ChatTimeline";
 import {
+  SELF_CONVERSATION_KEY,
   buildChatModel,
   buildContactContext,
   contactDisplayName,
@@ -60,72 +45,20 @@ import {
   previewChatLetterBudget,
   sendChatLetter,
 } from "./chat-send";
+import { useMailboxDesk } from "./useMailboxDesk";
 import styles from "./chat.module.css";
 
-type ChatRecords = Readonly<{
-  sent: readonly LocalMailMessage[];
-  paymentLinks: readonly LocalMailMessage[];
-  otc: OtcState;
-  escrow: EscrowState;
-  aliases: readonly AliasRecord[];
-  addressBook: readonly AddressBookEntry[];
-  rfqRecords: readonly RfqLifecycleRecord[];
-}>;
-
-const EMPTY_RECORDS: ChatRecords = Object.freeze({
-  sent: [],
-  paymentLinks: [],
-  otc: emptyOtcState(),
-  escrow: emptyEscrowState(),
-  aliases: [],
-  addressBook: [],
-  rfqRecords: [],
-});
-
-type VaultState =
-  | { kind: "missing" }
-  | {
-      kind: "locked";
-      record: Extract<MailVaultRecord, { kind: "passphrase" }>;
-      busy: boolean;
-      error?: string;
-    }
-  | { kind: "ready"; seed: Uint8Array; keypair: MailKeypair };
-
-function wipeVault(vault: VaultState): void {
-  if (vault.kind !== "ready") return;
-  vault.seed.fill(0);
-  vault.keypair.privateKey.fill(0);
-}
-
-/**
- * Everything Chat reads is the mailbox's own device-local state, loaded with
- * the same functions Mailbox uses so the two surfaces can never disagree
- * about a record. Nothing is fetched from the chain here.
- */
-function loadSynchronousRecords(
-  chainId: string,
-  address: string,
-): Pick<ChatRecords, "sent" | "paymentLinks" | "otc" | "escrow" | "aliases"> {
-  const otc = expireStoredDeals(window.localStorage, chainId, address);
-  return {
-    sent: loadSentMail(window.localStorage, chainId, address).map(
-      storedSentToLocal,
-    ),
-    paymentLinks: paymentLinkRecords(otc).map((payment) =>
-      paymentLinkToLocal(
-        payment.request,
-        payment.updatedAt,
-        payment.linkAuthenticity,
-      ),
-    ),
-    otc,
-    escrow: loadEscrowState(window.localStorage, chainId, address),
-    aliases: loadAliases(window.localStorage, address),
-  };
+/** The conversation key an address files under, or null when it is not one. */
+function conversationKeyFor(address: string | undefined): string | null {
+  if (!address) return null;
+  try {
+    return canonicalizeStarknetAddress(address);
+  } catch {
+    return null;
+  }
 }
 
-/** The conversation tag Mailbox threads this counterparty under, if any. */
+/** The conversation tag the mailbox threads this counterparty under, if any. */
 function conversationIdFor(
   conversation: ChatConversation,
 ): string | undefined {
@@ -146,6 +79,12 @@ function conversationIdFor(
   return undefined;
 }
 
+/** The first address a draft names, for filing the document composer. */
+function draftRecipientKey(draft: CompositeDraft): string | null {
+  const first = draft.recipient.split(/[\n,;]+/)[0]?.trim();
+  return conversationKeyFor(first || undefined);
+}
+
 function prefersReducedMotion(): boolean {
   try {
     return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
@@ -154,61 +93,47 @@ function prefersReducedMotion(): boolean {
   }
 }
 
+/**
+ * Chat is the mailbox: every encrypted record this wallet holds, read one
+ * counterparty at a time, with the mailbox desk's own handlers behind every
+ * card. The desk hook owns keys, scanning, deal state and value actions; this
+ * page owns which conversation is open and what the person is writing.
+ */
 export default function ChatPage() {
+  const desk = useMailboxDesk();
+  const {
+    address,
+    chainId,
+    providerIndex,
+    helperAddress,
+    networkName,
+    keypair,
+    mailSeed,
+    markMessagesRead,
+    clearFocusRequest,
+  } = desk;
   const session = useActiveStarknetSession();
-  const providerIndex = useFrontendProvider(
-    (state) => state.currentFrontendProviderIndex,
-  );
-  const address = useStoreWallet((state) => state.address);
-  const chainId = useStoreWallet((state) => state.chain);
   const isConnected = useStoreWallet((state) => state.isConnected);
   const walletAccount = useStoreWallet((state) => state.myWalletAccount);
   const selectedWallet = useStoreWallet((state) => state.StarknetWalletObject);
   const isStrk20Capable = useStoreWallet((state) => state.isStrk20Capable);
-  const helperAddress = helperForNetwork(providerIndex);
-  const networkName = constants.Strk20Networks[providerIndex] ?? "this network";
   const scope = address && chainId ? `${chainId}:${address}` : "";
-  const gate: "wallet" | null = scope ? null : "wallet";
+  const gate = desk.mailboxGate;
   const handoffsEnabled =
     session.rail === "ready" && session.compatible && Boolean(scope);
 
-  const [records, setRecords] = useState<ChatRecords>(EMPTY_RECORDS);
-  const [readIds, setReadIds] = useState<Set<string>>(() => new Set());
-  const [version, setVersion] = useState(0);
-  const refresh = useCallback(() => setVersion((value) => value + 1), []);
-  const scopeRef = useRef("");
-
+  /* Multi-maker requests live in the RFQ workspace; Chat only reads them so
+     the context panel can show the ones a counterparty is part of. */
+  const [rfqRecords, setRfqRecords] = useState<readonly RfqLifecycleRecord[]>(
+    [],
+  );
+  const [rfqVersion, setRfqVersion] = useState(0);
   useEffect(() => {
-    if (!scope || !address || !chainId) {
-      scopeRef.current = "";
-      setRecords(EMPTY_RECORDS);
-      setReadIds(new Set());
+    if (!address || !chainId) {
+      setRfqRecords([]);
       return;
     }
-    const sameScope = scopeRef.current === scope;
-    scopeRef.current = scope;
     let cancelled = false;
-    try {
-      const loaded = loadSynchronousRecords(chainId, address);
-      setRecords((current) => ({
-        ...loaded,
-        addressBook: sameScope ? current.addressBook : [],
-        rfqRecords: sameScope ? current.rfqRecords : [],
-      }));
-    } catch {
-      setRecords(EMPTY_RECORDS);
-    }
-    setReadIds(loadReadMessageIds(window.localStorage, chainId, address));
-    void loadAddressBook(window.localStorage, address)
-      .then((entries) => {
-        if (!cancelled) {
-          setRecords((current) => ({ ...current, addressBook: entries }));
-        }
-      })
-      .catch(() => {
-        // A book that will not open is reported on the Counterparties page.
-        if (!cancelled) setRecords((current) => ({ ...current, addressBook: [] }));
-      });
     void createIndexedDbRfqStorage()
       .list(chainId, address)
       .then((rows) => {
@@ -224,7 +149,7 @@ export default function ChatPage() {
             // An unreadable row is the RFQ workspace's to reconcile.
           }
         }
-        setRecords((current) => ({ ...current, rfqRecords: restored }));
+        setRfqRecords(restored);
       })
       .catch(() => {
         // Without IndexedDB the workspace section simply stays empty here.
@@ -232,84 +157,47 @@ export default function ChatPage() {
     return () => {
       cancelled = true;
     };
-  }, [address, chainId, scope, version]);
-
+  }, [address, chainId, rfqVersion]);
   useEffect(() => {
-    const onChange = () => refresh();
-    window.addEventListener(ADDRESS_BOOK_CHANGED_EVENT, onChange);
-    window.addEventListener("storage", onChange);
-    return () => {
-      window.removeEventListener(ADDRESS_BOOK_CHANGED_EVENT, onChange);
-      window.removeEventListener("storage", onChange);
-    };
-  }, [refresh]);
-
-  /* The mailbox key stays exactly where Mailbox keeps it: a plaintext vault
-     opens silently, a passphrase vault asks once per tab, and the seed is
-     zeroed whenever the account changes or the page goes away. */
-  const [vault, setVault] = useState<VaultState>({ kind: "missing" });
-  const vaultRef = useRef<VaultState>(vault);
-  vaultRef.current = vault;
-  useEffect(() => {
-    if (!address || !chainId) {
-      setVault({ kind: "missing" });
-      return;
-    }
-    let next: VaultState = { kind: "missing" };
-    try {
-      const inspected = inspectMailVault(window.localStorage, chainId, address);
-      if (inspected.kind === "plaintext") {
-        next = {
-          kind: "ready",
-          seed: inspected.seed,
-          keypair: deriveKeypair(inspected.seed),
-        };
-      } else if (inspected.kind === "passphrase") {
-        next = { kind: "locked", record: inspected.record, busy: false };
-      }
-    } catch {
-      next = { kind: "missing" };
-    }
-    setVault(next);
-    return () => {
-      wipeVault(vaultRef.current);
-      wipeVault(next);
-    };
-  }, [address, chainId]);
-
-  async function unlockVault(passphrase: string) {
-    const current = vaultRef.current;
-    if (current.kind !== "locked" || current.busy) return;
-    setVault({ ...current, busy: true, error: undefined });
-    try {
-      const seed = await unwrapMailSeed(current.record, passphrase);
-      setVault({ kind: "ready", seed, keypair: deriveKeypair(seed) });
-    } catch (error: unknown) {
-      setVault({
-        kind: "locked",
-        record: current.record,
-        busy: false,
-        error:
-          error instanceof Error
-            ? error.message
-            : "That passphrase does not open this mailbox vault.",
-      });
-    }
-  }
+    const onStorage = () => setRfqVersion((value) => value + 1);
+    window.addEventListener("storage", onStorage);
+    return () => window.removeEventListener("storage", onStorage);
+  }, []);
 
+  /* Addresses opened this session that hold no record yet: a new conversation
+     from the tools, or a Counterparties handoff. */
+  const [extraContacts, setExtraContacts] = useState<string[]>([]);
+  const addressBook = useMemo<AddressBookEntry[]>(
+    () =>
+      desk.bookEntries.map((entry) => ({
+        label: entry.label,
+        address: entry.address,
+        updatedAt: entry.addedAt,
+      })),
+    [desk.bookEntries],
+  );
   const model = useMemo(
     () =>
       buildChatModel({
         selfAddress: address,
-        sent: records.sent,
-        paymentLinks: records.paymentLinks,
-        otc: records.otc,
-        escrow: records.escrow,
-        addressBook: records.addressBook,
-        aliases: records.aliases,
-        readIds,
+        messages: desk.messages,
+        otc: desk.otcState,
+        escrow: desk.escrowState,
+        addressBook,
+        aliases: desk.aliases,
+        readIds: desk.readMessageIds,
+        extraContacts,
       }),
-    [address, records, readIds],
+    [
+      address,
+      addressBook,
+      desk.aliases,
+      desk.escrowState,
+      desk.messages,
+      desk.otcState,
+      desk.readMessageIds,
+      extraContacts,
+    ],
   );
   const [search, setSearch] = useState("");
   const [needsActionOnly, setNeedsActionOnly] = useState(false);
@@ -321,7 +209,7 @@ export default function ChatPage() {
     [model.conversations, needsActionOnly, search],
   );
 
-  const [selectedAddress, setSelectedAddress] = useState<string | null>(null);
+  const [selectedKey, setSelectedKey] = useState<string | null>(null);
   /* A conversation is "activated" by an explicit choice, not by being the
      first row on load. The counter lets choosing the already-open row count
      again, so its records are marked read even when nothing else changed. */
@@ -331,42 +219,52 @@ export default function ChatPage() {
   const [highlightId, setHighlightId] = useState<string | null>(null);
   const [mobileDetailOpen, setMobileDetailOpen] = useState(false);
   const [contextOpen, setContextOpen] = useState(false);
-  const [drafts, setDrafts] = useState<Record<string, string>>({});
+  const [letters, setLetters] = useState<Record<string, string>>({});
   const [status, setStatus] = useState<ChatComposerStatus>(null);
   const [sending, setSending] = useState(false);
+  /* The document composer, open on one device-private draft. */
+  const [composeDraftId, setComposeDraftId] = useState<string | null>(null);
+  /* Bumped when a handoff or a new address should land the cursor in the
+     quick composer; the composer exists only once its conversation renders. */
+  const [composerFocus, setComposerFocus] = useState(0);
+  useEffect(() => {
+    if (!composerFocus) return;
+    document.getElementById("chat-composer")?.focus();
+  }, [composerFocus, selectedKey]);
 
   useEffect(() => {
-    setSelectedAddress(null);
+    setSelectedKey(null);
     activatedRef.current = null;
     setEntryId(null);
     setHighlightId(null);
-    setDrafts({});
+    setLetters({});
     setStatus(null);
     setSending(false);
     setMobileDetailOpen(false);
     setContextOpen(false);
     setSearch("");
     setNeedsActionOnly(false);
+    setExtraContacts([]);
+    setComposeDraftId(null);
   }, [scope]);
 
   useEffect(() => {
     if (
-      selectedAddress &&
-      visible.some((conversation) => conversation.contact.address === selectedAddress)
+      selectedKey &&
+      visible.some((conversation) => conversation.contact.key === selectedKey)
     ) {
       return;
     }
-    setSelectedAddress(visible[0]?.contact.address ?? null);
-  }, [selectedAddress, visible]);
+    setSelectedKey(visible[0]?.contact.key ?? null);
+  }, [selectedKey, visible]);
 
   const conversation =
     model.conversations.find(
-      (candidate) => candidate.contact.address === selectedAddress,
+      (candidate) => candidate.contact.key === selectedKey,
     ) ?? null;
   const context = useMemo(
-    () =>
-      conversation ? buildContactContext(conversation, records.rfqRecords) : null,
-    [conversation, records.rfqRecords],
+    () => (conversation ? buildContactContext(conversation, rfqRecords) : null),
+    [conversation, rfqRecords],
   );
   const selectedEntry = useMemo(() => {
     if (!context || !entryId) return null;
@@ -378,32 +276,78 @@ export default function ChatPage() {
   }, [context, entryId]);
 
   /* Opening a conversation is what marks its incoming records read; the
-     first row being selected on load is not. Same rule as Mailbox. */
+     first row being selected on load is not. */
   useEffect(() => {
-    if (!conversation || !address || !chainId) return;
-    if (activatedRef.current !== conversation.contact.address) return;
-    const pending = unreadItemIds(conversation).filter((id) => !readIds.has(id));
-    if (!pending.length) return;
-    const next = new Set(readIds);
-    for (const id of pending) next.add(id);
-    setReadIds(next);
-    saveReadMessageIds(window.localStorage, chainId, address, next);
-  }, [activation, address, chainId, conversation, readIds]);
+    if (!conversation) return;
+    if (activatedRef.current !== conversation.contact.key) return;
+    const pending = unreadItemIds(conversation);
+    if (pending.length) markMessagesRead(pending);
+  }, [activation, conversation, markMessagesRead]);
+
+  const selectConversation = useCallback((next: string) => {
+    activatedRef.current = next;
+    setActivation((value) => value + 1);
+    setSelectedKey(next);
+    setEntryId(null);
+    setHighlightId(null);
+    setStatus(null);
+    setMobileDetailOpen(true);
+    setContextOpen(false);
+  }, []);
+
+  /* Where the desk asks Chat to look: an imported payment request, or the
+     counterparty a Counterparties or RFQ handoff named. */
+  useEffect(() => {
+    const request = desk.focusRequest;
+    if (!request) return;
+    if (request.kind === "recipient") {
+      const key = conversationKeyFor(request.address);
+      if (key && address && !feltEquals(key, address)) {
+        setSearch("");
+        setNeedsActionOnly(false);
+        setExtraContacts((current) =>
+          current.includes(key) ? current : [...current, key],
+        );
+        selectConversation(key);
+        setComposerFocus((value) => value + 1);
+      }
+      clearFocusRequest();
+      return;
+    }
+    const owner = model.conversations.find((candidate) =>
+      candidate.items.some((item) => item.id === request.id),
+    );
+    if (!owner) return;
+    setSearch("");
+    setNeedsActionOnly(false);
+    selectConversation(owner.contact.key);
+    setHighlightId(request.id);
+    clearFocusRequest();
+  }, [
+    address,
+    clearFocusRequest,
+    desk.focusRequest,
+    model.conversations,
+    selectConversation,
+  ]);
 
   const scrollRef = useRef<HTMLDivElement | null>(null);
-  const conversationAddress = conversation?.contact.address ?? null;
   const conversationLength = conversation?.items.length ?? 0;
+  const composeDraft =
+    (composeDraftId &&
+      desk.drafts.find((draft) => draft.id === composeDraftId)) ||
+    null;
   useEffect(() => {
-    if (highlightId) return;
+    if (highlightId || composeDraft) return;
     const frame = window.requestAnimationFrame(() => {
       const element = scrollRef.current;
       if (element) element.scrollTop = element.scrollHeight;
     });
     return () => window.cancelAnimationFrame(frame);
-  }, [conversationAddress, conversationLength, highlightId]);
+  }, [composeDraft, conversationLength, highlightId, selectedKey]);
 
   useEffect(() => {
-    if (!highlightId) return;
+    if (!highlightId || composeDraft) return;
     const frame = window.requestAnimationFrame(() => {
       document.getElementById(chatEntryDomId(highlightId))?.scrollIntoView({
         block: "center",
@@ -415,31 +359,102 @@ export default function ChatPage() {
       window.cancelAnimationFrame(frame);
       window.clearTimeout(timer);
     };
-  }, [highlightId]);
+  }, [composeDraft, highlightId]);
 
-  const selectConversation = useCallback((next: string) => {
-    activatedRef.current = next;
-    setActivation((value) => value + 1);
-    setSelectedAddress(next);
+  function locate(itemId: string) {
+    setContextOpen(false);
+    setMobileDetailOpen(true);
+    setComposeDraftId(null);
+    setHighlightId(itemId);
+  }
+
+  function startConversation(input: string) {
+    let recipient: string;
+    try {
+      recipient = validateAndParseAddress(input.trim());
+    } catch {
+      desk.setStorageNotice({
+        kind: "error",
+        message:
+          "That is not a valid Starknet address. Pick a saved counterparty or paste the address itself.",
+      });
+      return;
+    }
+    if (address && feltEquals(recipient, address)) {
+      if (model.conversations.some((row) => row.contact.key === SELF_CONVERSATION_KEY)) {
+        selectConversation(SELF_CONVERSATION_KEY);
+        return;
+      }
+      desk.setStorageNotice({
+        kind: "error",
+        message:
+          "This is your own mailbox. Self-addressed backups are posted from the mailbox tools.",
+      });
+      return;
+    }
+    const key = conversationKeyFor(recipient);
+    if (!key) return;
+    setSearch("");
+    setNeedsActionOnly(false);
+    setExtraContacts((current) =>
+      current.includes(key) ? current : [...current, key],
+    );
+    selectConversation(key);
+    setComposerFocus((value) => value + 1);
+  }
+
+  /* The document composer: terms, invoices and escrow announcements go out
+     as one sealed document, exactly as the mailbox has always sent them. */
+  function openDocumentComposer(recipient?: string) {
+    const draft = desk.createDraft({
+      recipient,
+      conversationId:
+        recipient && conversation?.contact.address === recipient
+          ? conversationIdFor(conversation)
+          : undefined,
+    });
+    if (!draft) return;
+    setComposeDraftId(draft.id);
     setEntryId(null);
     setHighlightId(null);
-    setStatus(null);
     setMobileDetailOpen(true);
     setContextOpen(false);
-  }, []);
+  }
 
-  function locate(itemId: string) {
-    setContextOpen(false);
+  function openDraft(draft: CompositeDraft) {
+    const key = draftRecipientKey(draft);
+    if (key && model.conversations.some((row) => row.contact.key === key)) {
+      selectConversation(key);
+    }
+    setComposeDraftId(draft.id);
     setMobileDetailOpen(true);
-    setHighlightId(itemId);
+    setContextOpen(false);
+  }
+
+  function closeDocumentComposer() {
+    if (composeDraft && isBlankDraft(composeDraft)) {
+      desk.removeDraft(composeDraft.id, false);
+    }
+    setComposeDraftId(null);
+  }
+
+  function handleDocumentSent(message: SentEnvelope) {
+    desk.handleSent(message);
+    desk.removeDraft(message.draftId, false);
+    setComposeDraftId(null);
+    const recipientKeys = message.recipients
+      .map((recipient) => conversationKeyFor(recipient))
+      .filter((key): key is string => key !== null);
+    const others = recipientKeys.filter(
+      (key) => !(address && feltEquals(key, address)),
+    );
+    const target = others.length ? others : [SELF_CONVERSATION_KEY];
+    if (!selectedKey || !target.includes(selectedKey)) {
+      selectConversation(target[0]);
+    }
+    setHighlightId(`sent:${message.documentId}`);
   }
 
-  const keyState: ChatKeyState =
-    vault.kind === "ready"
-      ? { kind: "ready" }
-      : vault.kind === "locked"
-        ? { kind: "locked", busy: vault.busy, error: vault.error }
-        : { kind: "missing" };
   const blocker = chatSendBlocker({
     helperAddress,
     networkName,
@@ -447,20 +462,22 @@ export default function ChatPage() {
     hasWalletAccount: Boolean(walletAccount),
     senderAddress: address,
     isStrk20Capable,
-    keyReady: vault.kind === "ready",
+    keyReady: Boolean(keypair),
   });
-  const draft = conversation ? (drafts[conversation.contact.address] ?? "") : "";
+  const letter = conversation ? (letters[conversation.contact.key] ?? "") : "";
   const budget = useMemo(
-    () => previewChatLetterBudget(draft, vault.kind === "ready"),
-    [draft, vault.kind],
+    () => previewChatLetterBudget(letter, Boolean(mailSeed)),
+    [letter, mailSeed],
   );
 
   async function send() {
     if (
       !conversation ||
+      conversation.contact.kind !== "counterparty" ||
+      !conversation.contact.address ||
       sending ||
       blocker ||
-      vault.kind !== "ready" ||
+      !keypair ||
       !helperAddress ||
       !walletAccount ||
       !selectedWallet ||
@@ -470,7 +487,8 @@ export default function ChatPage() {
       return;
     }
     const target = conversation.contact.address;
-    const body = draft;
+    const key = conversation.contact.key;
+    const body = letter;
     setSending(true);
     setStatus({
       kind: "sending",
@@ -490,10 +508,9 @@ export default function ChatPage() {
           selectedWallet,
           senderAddress: address,
           chainId,
-          mailSeed: vault.seed,
-          keypair: vault.keypair,
+          mailSeed,
+          keypair,
         },
-        storage: window.localStorage,
         onPhase: (_phase, detail) =>
           setStatus((current) => ({
             kind: "sending",
@@ -501,17 +518,13 @@ export default function ChatPage() {
             startedAt: current?.startedAt ?? Date.now(),
           })),
       });
-      setDrafts((current) => ({ ...current, [target]: "" }));
+      desk.handleSent(result.envelope);
+      setLetters((current) => ({ ...current, [key]: "" }));
       setStatus({
         kind: "ok",
-        message: result.localCopySaved
-          ? `Sealed and confirmed in ${shortenFelt(result.transactionHash)}. The Sent copy is saved in this browser profile (not encrypted at rest).`
-          : `Confirmed in ${result.transactionHash}, but the local Sent copy could not be saved: ${result.localCopyError ?? "browser storage failed"}. It will not appear here after this tab closes.`,
+        message: `Sealed and confirmed in ${shortenFelt(result.transactionHash)}. The Sent copy is filed here on this device (not encrypted at rest).`,
       });
-      if (result.localCopySaved) {
-        refresh();
-        setHighlightId(`sent:${result.sent.documentId}`);
-      }
+      setHighlightId(`sent:${result.envelope.documentId}`);
     } catch (error: unknown) {
       setStatus({
         kind: "error",
@@ -525,20 +538,62 @@ export default function ChatPage() {
     }
   }
 
+  const actions: ChatRecordActions = {
+    selfAddress: address,
+    actionStates: desk.actionStates,
+    invoiceMaturityHeadBlock: desk.invoiceMaturityHeadBlock,
+    onAccept: (offer, offerIndex) => void desk.handleAccept(offer, offerIndex),
+    onDecline: (offer) => void desk.handleDecline(offer),
+    onPostReceipt: (offer) => void desk.handlePostReceipt(offer),
+    onPay: (request) => void desk.handlePay(request),
+    onPayPrivatelyWithStrk: (request) =>
+      void desk.handlePayPrivatelyWithStrk(request),
+    onEscrowFill: (fund) => void desk.handleEscrowFill(fund),
+    onEscrowClaim: (fund) => void desk.handleLocalnetEscrowPayout(fund, "claim"),
+    onEscrowTimeout: (fund) =>
+      void desk.handleLocalnetEscrowPayout(fund, "timeout"),
+  };
+  const timelineHandlers: ChatTimelineHandlers = {
+    actions,
+    proofs: desk.proofs,
+    onAssign: desk.assignMessageAddress,
+    onProve: desk.proveAssignedAddress,
+    onRestoreContacts: (payload, message) =>
+      void desk.restoreContactBackup(payload, message),
+    onRestoreBackup: (payload, message) =>
+      void desk.restoreAuthenticatedBackup(payload, message),
+    contactRestorePending: Boolean(
+      desk.actionStates["contacts:restore"]?.pending,
+    ),
+    backupRestorePending: Boolean(desk.actionStates["backup:restore"]?.pending),
+  };
+
   const name = conversation ? contactDisplayName(conversation.contact) : null;
+  const walletGateShown = desk.storageNotice?.action === "connect-wallet";
+  const composeRecipientName = composeDraft
+    ? (() => {
+        const key = draftRecipientKey(composeDraft);
+        const row = key
+          ? model.conversations.find((candidate) => candidate.contact.key === key)
+          : null;
+        if (row) return contactDisplayName(row.contact);
+        return composeDraft.recipient.trim() ? "the named recipients" : null;
+      })()
+    : null;
+  const detailOpen = mobileDetailOpen || Boolean(composeDraft);
 
   return (
     <div className={styles.page}>
       <main
         aria-label="APP20 Chat"
-        className={`${styles.workspace}${mobileDetailOpen ? ` ${styles.detailOpen}` : ""}${
+        className={`${styles.workspace}${detailOpen ? ` ${styles.detailOpen}` : ""}${
           contextOpen ? ` ${styles.contextOpen}` : ""
         }`}
       >
         <ChatConversationRail
           conversations={visible}
           totalCount={model.conversations.length}
-          selectedAddress={selectedAddress}
+          selectedKey={selectedKey}
           search={search}
           onSearchChange={setSearch}
           needsActionOnly={needsActionOnly}
@@ -547,7 +602,35 @@ export default function ChatPage() {
           gate={gate}
           unattributedSent={model.unattributedSent}
           onSelect={selectConversation}
-        />
+        >
+          <ChatMailboxTools
+            selfAddress={address}
+            gate={gate}
+            keyLoaded={Boolean(keypair)}
+            seedLoaded={Boolean(mailSeed)}
+            helperConfigured={Boolean(helperAddress)}
+            scanning={desk.scanning}
+            scanKind={desk.scanKind}
+            scanMessage={desk.scanMessage}
+            scanProgress={desk.scanProgress}
+            scanCursorDescription={desk.scanCursorDescription}
+            onScan={(direction) => void desk.scanInbox(direction)}
+            drafts={desk.drafts}
+            onOpenDraft={openDraft}
+            onDeleteDraft={(draftId) => {
+              desk.removeDraft(draftId);
+            }}
+            onStartConversation={startConversation}
+            onNewDocument={(recipient) => openDocumentComposer(recipient)}
+            actionStates={desk.actionStates}
+            onContactBackup={() => void desk.handleContactBackup()}
+            onRfqHistoryBackup={() => void desk.handleRfqHistoryBackup()}
+            rfqAutoBackupEnabled={desk.rfqAutoBackupEnabled}
+            onRfqAutoBackupChange={desk.updateRfqAutoBackup}
+            onLock={desk.lockMailboxSession}
+            onForget={desk.forgetThisDevice}
+          />
+        </ChatConversationRail>
 
         <section className={styles.conversation} aria-label="Conversation">
           <header className={styles.conversationHead}>
@@ -555,32 +638,57 @@ export default function ChatPage() {
               type="button"
               className={`${styles.headButton} ${styles.backButton}`}
               aria-label="Back to conversations"
-              onClick={() => setMobileDetailOpen(false)}
+              onClick={() => {
+                if (composeDraft) closeDocumentComposer();
+                setMobileDetailOpen(false);
+              }}
             >
               ← Chats
             </button>
             <div>
               <p className={styles.kicker}>
-                {conversation
-                  ? "DEVICE-LOCAL RECORDS · NOT SETTLEMENT AUTHORITY"
-                  : "APP20 / CHAT / ENCRYPTED CORRESPONDENCE"}
+                {composeDraft
+                  ? "ENCRYPTED DOCUMENT · SEALED ON THIS DEVICE"
+                  : conversation
+                    ? "ENCRYPTED RECORDS · NOT SETTLEMENT AUTHORITY"
+                    : "APP20 / CHAT / ENCRYPTED CORRESPONDENCE"}
               </p>
               <strong>
-                {name ? (
+                {composeDraft ? (
+                  composeRecipientName ? (
+                    <>
+                      Document to <bdi>{composeRecipientName}</bdi>
+                    </>
+                  ) : (
+                    "New document"
+                  )
+                ) : name ? (
                   <bdi>{name}</bdi>
                 ) : (
                   "Private correspondence, one counterparty at a time"
                 )}
               </strong>
-              {conversation ? (
+              {conversation && !composeDraft ? (
                 <small>
                   {conversation.items.length} record
                   {conversation.items.length === 1 ? "" : "s"} on this device ·{" "}
-                  {shortenFelt(conversation.contact.address)}
+                  {conversation.contact.kind === "self"
+                    ? "your own mailbox"
+                    : conversation.contact.address
+                      ? shortenFelt(conversation.contact.address)
+                      : "unnamed thread"}
                 </small>
               ) : null}
             </div>
-            {conversation ? (
+            {composeDraft ? (
+              <button
+                type="button"
+                className={styles.headButton}
+                onClick={closeDocumentComposer}
+              >
+                Close document
+              </button>
+            ) : conversation ? (
               <button
                 type="button"
                 className={`${styles.headButton} ${styles.contextButton}`}
@@ -594,27 +702,94 @@ export default function ChatPage() {
           </header>
 
           <div ref={scrollRef} className={styles.timelineScroll}>
-            {gate ? (
+            {desk.storageNotice ? (
+              <div
+                className={styles.notice}
+                data-kind={desk.storageNotice.kind}
+                role={desk.storageNotice.kind === "error" ? "alert" : "status"}
+              >
+                <span>{desk.storageNotice.message}</span>
+                {desk.storageNotice.action === "connect-wallet" ? (
+                  <span className={styles.connectAction}>
+                    <SelectWallet />
+                  </span>
+                ) : null}
+                <button
+                  type="button"
+                  className={styles.noticeDismiss}
+                  aria-label="Dismiss notice"
+                  onClick={() => desk.setStorageNotice(null)}
+                >
+                  ×
+                </button>
+              </div>
+            ) : null}
+
+            {gate === "key" ? (
+              <div className={styles.keySetup}>
+                <Onboard
+                  key={`${providerIndex}:${address}`}
+                  helperAddress={helperAddress}
+                  onKeyReady={desk.handleKeyReady}
+                />
+              </div>
+            ) : null}
+
+            {composeDraft ? (
+              <section className={styles.sheet} aria-label="Document composer">
+                {gate === "key" ? (
+                  <p className={styles.keyNotice}>
+                    <strong>No mailbox key on this device</strong>
+                    <span>
+                      Write and save the draft now. Sending needs a mailbox
+                      key — <a href="#mailbox-key-setup">set one up above</a>.
+                    </span>
+                  </p>
+                ) : null}
+                <Compose
+                  key={composeDraft.id}
+                  draft={composeDraft}
+                  helperAddress={helperAddress}
+                  escrowAddress={desk.escrowAddress}
+                  escrowEnabled={desk.escrowEnabled}
+                  mailSeed={mailSeed}
+                  keyReady={Boolean(keypair)}
+                  networkName={networkName}
+                  onDraftChange={desk.persistDraft}
+                  onDeleteDraft={(draftId) => {
+                    desk.removeDraft(draftId, false);
+                    setComposeDraftId(null);
+                  }}
+                  onSent={handleDocumentSent}
+                />
+              </section>
+            ) : gate === "wallet" ? (
               <section
                 className={styles.welcome}
                 aria-labelledby="chat-welcome-title"
               >
                 <p className={styles.kicker}>APP20 / CHAT</p>
-                <h2 id="chat-welcome-title">One counterparty, every record.</h2>
+                <h2 id="chat-welcome-title">
+                  Encrypted correspondence, one counterparty at a time.
+                </h2>
                 <p>
-                  Chat reads the letters, offers, invoices and escrows this
-                  device already holds and groups them by counterparty. It is
-                  keyed to a wallet: connect one to open it.
+                  Letters, offers, invoices and escrow announcements are sealed
+                  to a registered mailbox key and read back from the chain on
+                  this device. Chat is keyed to a wallet: connect one to open
+                  it.
                 </p>
-                <div className={styles.connectAction}>
-                  <SelectWallet />
-                </div>
+                {walletGateShown ? null : (
+                  <div className={styles.connectAction}>
+                    <SelectWallet />
+                  </div>
+                )}
               </section>
             ) : conversation ? (
               <ChatTimeline
                 conversation={conversation}
-                aliases={records.aliases}
+                aliases={desk.displayAliases}
                 highlightId={highlightId}
+                handlers={timelineHandlers}
               />
             ) : (
               <section
@@ -622,43 +797,53 @@ export default function ChatPage() {
                 aria-labelledby="chat-empty-title"
               >
                 <p className={styles.kicker}>APP20 / CHAT</p>
-                <h2 id="chat-empty-title">No counterparties on this device.</h2>
+                <h2 id="chat-empty-title">No conversations on this device yet.</h2>
                 <p>
-                  Save a wallet under Counterparties or send a letter from
-                  Mailbox; each one becomes a conversation here. Records a
-                  counterparty sends you appear after Mailbox checks for mail.
+                  Check for mail to read what counterparties sent this wallet,
+                  write to a new address from the mailbox tools, or save a
+                  wallet under Counterparties. Each becomes a conversation
+                  here.
                 </p>
                 <div className={styles.welcomeLinks}>
                   <Link to="/contacts">Counterparties</Link>
-                  <Link to="/mail/inbox">Mailbox</Link>
                   <Link to="/rfq">RFQ workspace</Link>
                 </div>
               </section>
             )}
           </div>
 
-          {conversation && name ? (
-            <ChatComposer
-              contactName={name}
-              value={draft}
-              onChange={(value) =>
-                setDrafts((current) => ({
-                  ...current,
-                  [conversation.contact.address]: value,
-                }))
-              }
-              blocker={blocker}
-              keyState={keyState}
-              onUnlock={(passphrase) => void unlockVault(passphrase)}
-              sending={sending}
-              status={status}
-              budget={budget}
-              onSend={() => void send()}
-            />
+          {conversation && name && !composeDraft && gate !== "wallet" ? (
+            conversation.contact.kind === "counterparty" &&
+            conversation.contact.address ? (
+              <ChatComposer
+                contactName={name}
+                value={letter}
+                onChange={(value) =>
+                  setLetters((current) => ({
+                    ...current,
+                    [conversation.contact.key]: value,
+                  }))
+                }
+                blocker={blocker}
+                sending={sending}
+                status={status}
+                budget={budget}
+                onSend={() => void send()}
+                onAttach={() =>
+                  openDocumentComposer(conversation.contact.address ?? undefined)
+                }
+              />
+            ) : (
+              <p className={styles.composerNote}>
+                {conversation.contact.kind === "self"
+                  ? "Backups are posted from the mailbox tools; this mailbox does not write letters to itself."
+                  : "A sealed thread has no address to write to. Name its sender above to file it under a counterparty."}
+              </p>
+            )
           ) : null}
         </section>
 
-        {conversation && context ? (
+        {conversation && context && !composeDraft ? (
           <ChatContextPanel
             conversation={conversation}
             context={context}
@@ -668,7 +853,8 @@ export default function ChatPage() {
             selfAddress={address}
             chainId={chainId}
             handoffsEnabled={handoffsEnabled}
-            aliases={records.aliases}
+            aliases={desk.displayAliases}
+            actions={actions}
             onClose={() => setContextOpen(false)}
           />
         ) : (
@@ -688,8 +874,9 @@ export default function ChatPage() {
               </button>
             </header>
             <p className={styles.contextPlaceholder}>
-              Wallet identity, open RFQs, pending payments and escrows for the
-              selected counterparty appear here.
+              {composeDraft
+                ? "The document goes to the recipients named in it. Close it to return to the conversation."
+                : "Wallet identity, open RFQs, pending payments and escrows for the selected counterparty appear here."}
             </p>
           </aside>
         )}
diff --git a/src/app/inbox/page.tsx b/src/app/chat/useMailboxDesk.ts
similarity index 74%
rename from src/app/inbox/page.tsx
rename to src/app/chat/useMailboxDesk.ts
index ca76762..2c26375 100644
--- a/src/app/inbox/page.tsx
+++ b/src/app/chat/useMailboxDesk.ts
@@ -6,16 +6,11 @@ import { hash, validateAndParseAddress } from "starknet";
 import { useFrontendProvider } from "@/app/components/client/provider/providerContext";
 import { useStoreWallet } from "@/app/components/Wallet/walletContext";
 import { loadReadMessageIds, saveReadMessageIds } from "@/lib/mail-read-state";
-import SelectWallet from "@/app/components/client/WalletHandle/SelectWallet";
-import Compose, { type SentEnvelope } from "@/components/mail/Compose";
-import ConversationList from "@/components/mail/ConversationList";
-import DraftList from "@/components/mail/DraftList";
-import Onboard from "@/components/mail/Onboard";
-import { ScanProgress } from "@/components/mail/OperationProgress";
-import Thread, {
-  type LocalMailMessage,
-  type ThreadActionState,
-} from "@/components/mail/Thread";
+import type { SentEnvelope } from "@/components/mail/Compose";
+import type {
+  LocalMailMessage,
+  ThreadActionState,
+} from "@/components/mail/message";
 import {
   ADDRESS_BOOK_CHANGED_EVENT,
   loadAddressBook,
@@ -109,10 +104,7 @@ import {
   type ParsedMailEvent,
 } from "@/lib/mail-scan";
 import { verifyContactSnapshot } from "@/lib/contact-backup";
-import {
-  describeMailScanCursor,
-  replyAddressForConversation,
-} from "@/lib/mail-correspondents";
+import { describeMailScanCursor } from "@/lib/mail-correspondents";
 import { authorizeStrk20ValueAction } from "@/lib/mainnet-safety";
 import { clearLocalMailboxStorage } from "@/lib/local-mailbox-storage";
 import {
@@ -183,20 +175,12 @@ import {
   saveMailAssignment,
   type MailAssignment,
 } from "@/lib/mail-assignments";
-import {
-  assembleConversation,
-  conversationKeyForMessage,
-} from "@/lib/mail-thread";
+import { conversationKeyForMessage } from "@/lib/mail-thread";
 import { evaluateSenderProof, type SenderProof } from "@/lib/sender-proof";
 import { assertWalletOperationPolicy } from "@/lib/wallet-policy";
 import * as constants from "@/utils/constants";
-import styles from "@/components/mail/mail.module.css";
 
 import {
-  TYPE_FILTERS,
-  MAIL_FOLDERS,
-  type MailFolder,
-  type MailboxFilter,
   type ScanKind,
   type ScanWorkerResponse,
   type ActiveScanWorker,
@@ -212,15 +196,21 @@ import {
   storedSentToLocal,
   paymentLinkToLocal,
   paymentLinkRecords,
-  draftMatchesFilter,
-  mailboxMatchesFilter,
-  partitionMailboxFolders,
-  countMailboxFilterHits,
-  countDraftFilterHits,
   parseBlockTimestamp,
 } from "./mailbox-model";
 
-export default function InboxPage() {
+export type MailboxFocusRequest =
+  | { kind: "message"; id: string }
+  | { kind: "recipient"; address: string };
+
+/**
+ * The mailbox desk: every piece of state and every handler the Mailbox page
+ * carried, without its folders, panes and sidebar. Chat mounts this once and
+ * renders the same records one counterparty at a time; the value actions,
+ * scans, backups and device safety below are the Mailbox implementations,
+ * moved rather than rewritten.
+ */
+export function useMailboxDesk() {
   const navigate = useNavigate();
   const providerIndex = useFrontendProvider(
     (state) => state.currentFrontendProviderIndex,
@@ -286,14 +276,9 @@ export default function InboxPage() {
     events: 0,
     maxPages: MAIL_SCAN_MAX_PAGES,
   });
-  const [selectedMessageId, setSelectedMessageId] = useState<string | null>(
-    null,
-  );
-  const [messageActivation, setMessageActivation] = useState(0);
   const [readMessageIds, setReadMessageIds] = useState<Set<string>>(
     () => new Set(),
   );
-  const [mailboxSearch, setMailboxSearch] = useState("");
 
   /* Read state belongs to this device and this account: it is loaded when the
      account is known and written back as records are opened, so a reload no
@@ -306,16 +291,14 @@ export default function InboxPage() {
     );
   }, [address, chainId]);
 
-  const [mailFolder, setMailFolder] = useState<MailFolder>("inbox");
-  const [mailboxFilter, setMailboxFilter] = useState<MailboxFilter>("all");
   const [drafts, setDrafts] = useState<CompositeDraft[]>([]);
-  const [selectedDraftId, setSelectedDraftId] = useState<string | null>(null);
-  const [composerOpen, setComposerOpen] = useState(false);
   const [pendingPayment, setPendingPayment] =
     useState<DecodedPaymentLink | null>(null);
-  const [mobileDetailOpen, setMobileDetailOpen] = useState(false);
-  const [sidebarOpen, setSidebarOpen] = useState(false);
-  const [mobileSidebarMode, setMobileSidebarMode] = useState(false);
+  /* Where Chat should look next: an imported payment request, or the
+     counterparty a Counterparties or RFQ handoff named. */
+  const [focusRequest, setFocusRequest] = useState<MailboxFocusRequest | null>(
+    null,
+  );
   const [storageNotice, setStorageNotice] = useState<{
     kind: "ok" | "error";
     message: string;
@@ -355,13 +338,6 @@ export default function InboxPage() {
   const recentLoadedRef = useRef(false);
   const scanWorkerRef = useRef<ActiveScanWorker | null>(null);
   const escrowRefreshRef = useRef(0);
-  const readingPaneRef = useRef<HTMLElement | null>(null);
-  const readingScrollRef = useRef<HTMLDivElement | null>(null);
-  const menuButtonRef = useRef<HTMLButtonElement | null>(null);
-  const sidebarRef = useRef<HTMLElement | null>(null);
-  const sidebarCloseRef = useRef<HTMLButtonElement | null>(null);
-  const sidebarWasOpenRef = useRef(false);
-  const activatedMessageIdRef = useRef<string | null>(null);
   const contactHandoffRef = useRef("");
   const rfqAutoBackupPostingRef = useRef(false);
   scanIdentityRef.current = scanIdentity;
@@ -409,86 +385,9 @@ export default function InboxPage() {
     const handoffKey = `${chainId}:${address}:${recipient}`;
     if (contactHandoffRef.current === handoffKey) return;
     contactHandoffRef.current = handoffKey;
-    const draft = { ...createBlankDraft(), recipient };
-    setDrafts(saveDraft(window.localStorage, chainId, address, draft));
-    setMailFolder("drafts");
-    setMailboxFilter("all");
-    setSelectedDraftId(draft.id);
-    setComposerOpen(true);
-    setMobileDetailOpen(true);
-    setSidebarOpen(false);
+    setFocusRequest({ kind: "recipient", address: recipient });
   }, [address, chainId]);
 
-  useEffect(() => {
-    /* Matches the breakpoint where mail.module.css turns the sidebar into a
-       drawer; if these drift, a closed drawer stays focusable off-screen. */
-    const query = window.matchMedia("(max-width: 1179px)");
-    const update = () => setMobileSidebarMode(query.matches);
-    update();
-    query.addEventListener("change", update);
-    return () => query.removeEventListener("change", update);
-  }, []);
-
-  useEffect(() => {
-    if (!mobileSidebarMode) {
-      sidebarWasOpenRef.current = false;
-      return;
-    }
-    if (!sidebarOpen) {
-      if (sidebarWasOpenRef.current) {
-        window.requestAnimationFrame(() => menuButtonRef.current?.focus());
-      }
-      sidebarWasOpenRef.current = false;
-      return;
-    }
-
-    sidebarWasOpenRef.current = true;
-    const frame = window.requestAnimationFrame(() =>
-      sidebarCloseRef.current?.focus(),
-    );
-    function onKeyDown(event: KeyboardEvent) {
-      if (event.key === "Escape") {
-        event.preventDefault();
-        setSidebarOpen(false);
-        return;
-      }
-      if (event.key !== "Tab" || !sidebarRef.current) return;
-      const focusable = Array.from(
-        sidebarRef.current.querySelectorAll<HTMLElement>(
-          "button:not(:disabled), a[href]",
-        ),
-      );
-      if (!focusable.length) return;
-      const first = focusable[0];
-      const last = focusable[focusable.length - 1];
-      if (event.shiftKey && document.activeElement === first) {
-        event.preventDefault();
-        last.focus();
-      } else if (!event.shiftKey && document.activeElement === last) {
-        event.preventDefault();
-        first.focus();
-      }
-    }
-    window.addEventListener("keydown", onKeyDown);
-    return () => {
-      window.cancelAnimationFrame(frame);
-      window.removeEventListener("keydown", onKeyDown);
-    };
-  }, [mobileSidebarMode, sidebarOpen]);
-
-  useEffect(() => {
-    const frame = window.requestAnimationFrame(() => {
-      readingScrollRef.current?.scrollTo({ top: 0, behavior: "auto" });
-    });
-    return () => window.cancelAnimationFrame(frame);
-  }, [
-    composerOpen,
-    keyFingerprint,
-    mailFolder,
-    selectedDraftId,
-    selectedMessageId,
-  ]);
-
   function cancelActiveScanWorker() {
     const active = scanWorkerRef.current;
     if (!active) return;
@@ -550,17 +449,9 @@ export default function InboxPage() {
     setMailSeed(null);
     setMessages([]);
     setDrafts([]);
-    setMailFolder("inbox");
-    setMailboxFilter("all");
-    setSelectedDraftId(null);
     setScanKind("idle");
     setScanMessage("");
     setScanProgress({ pages: 0, events: 0, maxPages: MAIL_SCAN_MAX_PAGES });
-    setSelectedMessageId(null);
-    activatedMessageIdRef.current = null;
-    setComposerOpen(false);
-    setMobileDetailOpen(false);
-    setSidebarOpen(false);
     setActionStates({});
     setStorageNotice(null);
     if (address && chainId) {
@@ -626,11 +517,7 @@ export default function InboxPage() {
       );
       setPendingPayment(pending);
       setMessages((current) => mergeMailMessages(current, [message]));
-      setMailFolder("inbox");
-      setMailboxFilter("invoices");
-      setSelectedMessageId(message.id);
-      setComposerOpen(false);
-      setMobileDetailOpen(true);
+      setFocusRequest({ kind: "message", id: message.id });
     } catch {
       // /pay already reports blocked session storage. Do not invent a request.
     }
@@ -658,9 +545,7 @@ export default function InboxPage() {
       );
       setMessages((current) => mergeMailMessages(current, [message]));
       setPendingPayment(null);
-      setMailFolder("inbox");
-      setMailboxFilter("invoices");
-      setSelectedMessageId(message.id);
+      setFocusRequest({ kind: "message", id: message.id });
       setActionState(actionKey, {
         pending: false,
         message:
@@ -720,7 +605,10 @@ export default function InboxPage() {
     };
   }, [address, chainId, otcState, providerIndex]);
 
-  const mailboxView = useMemo(() => {
+  /* Every record this device may show: authenticated backups only, and a
+     device-local name carried to every record in its conversation, including
+     ones decrypted later. */
+  const annotatedMessages = useMemo(() => {
     const authenticatedBackupIds = new Set(
       address && chainId && helperAddress && mailSeed && keyFingerprint
         ? newestBackupMessages(messages, {
@@ -742,25 +630,6 @@ export default function InboxPage() {
           authenticatedBackupIds.has(message.id),
       ),
     );
-    const folders = partitionMailboxFolders(visibleMessages);
-    const folderMessages = mailFolder === "sent" ? folders.sent : folders.inbox;
-    const typeCounts =
-      mailFolder === "drafts"
-        ? countDraftFilterHits(drafts)
-        : countMailboxFilterHits(folderMessages);
-    const filteredMessages =
-      mailboxFilter === "all"
-        ? folderMessages
-        : folderMessages.filter((message) =>
-            mailboxMatchesFilter(message, mailboxFilter),
-          );
-    const filteredDrafts =
-      mailboxFilter === "all"
-        ? drafts
-        : drafts.filter((draft) => draftMatchesFilter(draft, mailboxFilter));
-    /* Naming a counterparty is about a conversation, not one envelope: an
-       assignment made on any record carries to every record that shares its
-       conversation, including ones decrypted later. */
     const assignedByConversation = new Map<string, string>();
     for (const message of visibleMessages) {
       const assigned = assignments[message.id]?.address;
@@ -773,7 +642,7 @@ export default function InboxPage() {
         assignedByConversation.set(conversation, assigned);
       }
     }
-    const allAnnotatedMessages = visibleMessages.map((message) => {
+    return visibleMessages.map((message) => {
       const localConversationId = assignments[message.id]?.conversationId;
       const conversation = conversationKeyForMessage({
         ...message,
@@ -787,94 +656,25 @@ export default function InboxPage() {
         localConversationId,
       };
     });
-    const visibleIds = new Set(filteredMessages.map((message) => message.id));
-    const annotatedMessages = allAnnotatedMessages.filter((message) =>
-      visibleIds.has(message.id),
-    );
-    return {
-      folderCounts: {
-        inbox: folders.inbox.length,
-        sent: folders.sent.length,
-        drafts: drafts.length,
-      } satisfies Record<MailFolder, number>,
-      typeCounts,
-      filteredMessages,
-      filteredDrafts,
-      allAnnotatedMessages,
-      annotatedMessages,
-    };
-  }, [
-    address,
-    assignments,
-    chainId,
-    drafts,
-    helperAddress,
-    keyFingerprint,
-    mailFolder,
-    mailboxFilter,
-    mailSeed,
-    messages,
-  ]);
+  }, [address, assignments, chainId, helperAddress, keyFingerprint, mailSeed, messages]);
 
-  useEffect(() => {
-    if (mailFolder === "drafts") {
-      const visibleDrafts = mailboxView.filteredDrafts;
-      if (
-        selectedDraftId &&
-        visibleDrafts.some((draft) => draft.id === selectedDraftId)
-      ) {
-        return;
-      }
-      setSelectedDraftId(visibleDrafts[0]?.id ?? null);
-      return;
-    }
-    const visibleMessages = mailboxView.filteredMessages;
-    if (
-      selectedMessageId &&
-      visibleMessages.some((message) => message.id === selectedMessageId)
-    ) {
-      return;
-    }
-    setSelectedMessageId(visibleMessages[0]?.id ?? null);
-  }, [
-    mailFolder,
-    mailboxView.filteredDrafts,
-    mailboxView.filteredMessages,
-    selectedDraftId,
-    selectedMessageId,
-  ]);
-
-  useEffect(() => {
-    const messageId = selectedMessageId;
-    if (
-      !messageId ||
-      composerOpen ||
-      activatedMessageIdRef.current !== messageId
-    ) {
-      return;
-    }
-    const frame = window.requestAnimationFrame(() => {
-      const pane = readingPaneRef.current;
-      if (!pane || pane.getClientRects().length === 0) return;
+  /* Read state is written when Chat opens a conversation; a reload no longer
+     marks a whole mailbox unread. */
+  const markMessagesRead = useCallback(
+    (ids: readonly string[]) => {
       setReadMessageIds((current) => {
-        if (current.has(messageId)) return current;
+        const pending = ids.filter((id) => !current.has(id));
+        if (!pending.length) return current;
         const next = new Set(current);
-        next.add(messageId);
+        for (const id of pending) next.add(id);
         if (chainId && address) {
           saveReadMessageIds(window.localStorage, chainId, address, next);
         }
         return next;
       });
-    });
-    return () => window.cancelAnimationFrame(frame);
-  }, [
-    address,
-    chainId,
-    composerOpen,
-    messageActivation,
-    mobileDetailOpen,
-    selectedMessageId,
-  ]);
+    },
+    [address, chainId],
+  );
 
   function setActionState(key: string, state: ThreadActionState) {
     setActionStates((current) => ({ ...current, [key]: state }));
@@ -2329,7 +2129,7 @@ export default function InboxPage() {
           buyToken: token.address,
           targetBuyBaseUnits: request.amount,
           ...(request.memo ? { memo: request.memo } : {}),
-          returnTo: "/mail/inbox",
+          returnTo: "/chat",
         },
         { account: context.address, chainId: context.chainId },
       );
@@ -2787,22 +2587,6 @@ export default function InboxPage() {
     }
   }
 
-  const {
-    folderCounts,
-    typeCounts,
-    filteredDrafts,
-    allAnnotatedMessages,
-    annotatedMessages,
-  } = mailboxView;
-  const selectedMessage = annotatedMessages.find(
-    (message) => message.id === selectedMessageId,
-  );
-  const conversationMessages = useMemo(
-    () =>
-      assembleConversation(allAnnotatedMessages, selectedMessage?.id ?? null),
-    [allAnnotatedMessages, selectedMessage?.id],
-  );
-  const activeDraft = drafts.find((draft) => draft.id === selectedDraftId);
   const scanCursorDescription = useMemo(() => {
     if (
       !keypair ||
@@ -2829,11 +2613,6 @@ export default function InboxPage() {
     scanKind,
     scanMessage,
   ]);
-  const folderLabel =
-    MAIL_FOLDERS.find((folder) => folder.id === mailFolder)?.label ?? "Inbox";
-  const filterLabel =
-    TYPE_FILTERS.find((filter) => filter.id === mailboxFilter)?.label ??
-    "All types";
 
   function persistDraft(draft: CompositeDraft) {
     try {
@@ -2890,8 +2669,6 @@ export default function InboxPage() {
         draftId,
       );
       setDrafts(next);
-      setSelectedDraftId(next[0]?.id ?? null);
-      if (selectedDraftId === draftId && !next.length) setComposerOpen(false);
       setStorageNotice({
         kind: "ok",
         message: "Local draft deleted from this browser profile.",
@@ -2948,13 +2725,7 @@ export default function InboxPage() {
       setProofs({});
       setActionStates({});
       setReadMessageIds(new Set());
-      setSelectedMessageId(null);
-      setSelectedDraftId(null);
       setPendingPayment(null);
-      setComposerOpen(false);
-      setMobileDetailOpen(false);
-      setMailFolder("inbox");
-      setMailboxFilter("all");
       setStorageNotice({
         kind: "ok",
         message: `Forgot this device: removed ${removed.length} local mailbox record${removed.length === 1 ? "" : "s"}. Disconnecting alone does not do this. Restore the offline backup to reopen encrypted mail. That backup can also recreate the Mail signing key used for payment requests, and APP20 currently cannot revoke it if compromised.`,
@@ -2969,50 +2740,13 @@ export default function InboxPage() {
     }
   }
 
-  const selectMessage = useCallback((messageId: string) => {
-    activatedMessageIdRef.current = messageId;
-    setSelectedMessageId(messageId);
-    setMessageActivation((current) => current + 1);
-    setComposerOpen(false);
-    setMobileDetailOpen(true);
-  }, []);
-
-  const selectDraft = useCallback((draftId: string) => {
-    setSelectedDraftId(draftId);
-    setComposerOpen(true);
-    setMobileDetailOpen(true);
-    setSidebarOpen(false);
-  }, []);
-
-  function openComposer() {
-    if (!address || !chainId) {
-      setStorageNotice({
-        kind: "error",
-        message:
-          "Mail is keyed to a wallet: connect one so the draft is saved under the correct mailbox.",
-        action: "connect-wallet",
-      });
-      setSidebarOpen(true);
-      return;
-    }
-    // Compose on an untouched draft reopens it instead of leaving another
-    // identical blank row behind.
-    const existingBlank = drafts.find(isBlankDraft);
-    const draft = existingBlank ?? createBlankDraft();
-    if (!existingBlank) persistDraft(draft);
-    setMailFolder("drafts");
-    setMailboxFilter("all");
-    setSelectedDraftId(draft.id);
-    setComposerOpen(true);
-    setMobileDetailOpen(true);
-    setSidebarOpen(false);
-  }
-
-  function openComposerForRecipient(input: {
-    address?: string;
-    conversationId: string;
-    inReplyTo: string;
-  }) {
+  /**
+   * A device-private draft for one counterparty. Compose takes it from here;
+   * a draft closed untouched is removed again by Chat.
+   */
+  function createDraft(
+    input: { recipient?: string; conversationId?: string; inReplyTo?: string } = {},
+  ): CompositeDraft | null {
     if (!address || !chainId) {
       setStorageNotice({
         kind: "error",
@@ -3020,22 +2754,19 @@ export default function InboxPage() {
           "Mail is keyed to a wallet: connect one so the draft is saved under the correct mailbox.",
         action: "connect-wallet",
       });
-      setSidebarOpen(true);
-      return;
+      return null;
     }
-    const draft = {
+    const existingBlank = input.recipient
+      ? undefined
+      : drafts.find(isBlankDraft);
+    const draft: CompositeDraft = existingBlank ?? {
       ...createBlankDraft(),
-      recipient: input.address ?? "",
-      conversationId: input.conversationId,
-      inReplyTo: input.inReplyTo,
+      recipient: input.recipient ?? "",
+      ...(input.conversationId ? { conversationId: input.conversationId } : {}),
+      ...(input.inReplyTo ? { inReplyTo: input.inReplyTo } : {}),
     };
-    persistDraft(draft);
-    setMailFolder("drafts");
-    setMailboxFilter("all");
-    setSelectedDraftId(draft.id);
-    setComposerOpen(true);
-    setMobileDetailOpen(true);
-    setSidebarOpen(false);
+    if (!existingBlank) persistDraft(draft);
+    return draft;
   }
 
   function assignMessageAddress(messageId: string, assignedAddress: string) {
@@ -3082,539 +2813,71 @@ export default function InboxPage() {
     setStorageNotice({ kind: "error", message: proofMessage });
   }
 
-  const walletGateShown = storageNotice?.action === "connect-wallet";
-  /* What is actually blocking this mailbox, answered once. The welcome sheet,
-     the rail's empty state and the scan panel used to give three different
-     instructions for the same state. */
+  /* What is actually blocking this mailbox, answered once for every pane. */
   const mailboxGate: "wallet" | "key" | null =
     !address || !chainId ? "wallet" : keypair ? null : "key";
 
-  function replyToOpenConversation() {
-    if (!selectedMessage) return;
-    openComposerForRecipient({
-      address:
-        replyAddressForConversation(conversationMessages, address) ?? undefined,
-      conversationId: conversationKeyForMessage(selectedMessage),
-      inReplyTo: selectedMessage.documentId ?? "",
-    });
-  }
-
-  function closeDetail() {
-    if (composerOpen && activeDraft && isBlankDraft(activeDraft)) {
-      removeDraft(activeDraft.id, false);
-    }
-    setComposerOpen(false);
-    setMobileDetailOpen(false);
-  }
-
-  function selectFolder(nextFolder: MailFolder) {
-    setMailboxSearch("");
-    setMailFolder(nextFolder);
-    setSidebarOpen(false);
-    setMobileDetailOpen(false);
-    setComposerOpen(nextFolder === "drafts" && Boolean(filteredDrafts[0]));
-    if (nextFolder === "drafts") {
-      const nextDraft = drafts.find((draft) =>
-        draftMatchesFilter(draft, mailboxFilter),
-      );
-      setSelectedDraftId(nextDraft?.id ?? null);
-    }
-  }
-
-  function selectTypeFilter(nextFilter: MailboxFilter) {
-    setMailboxSearch("");
-    setMailboxFilter(nextFilter);
-    setSidebarOpen(false);
-    setMobileDetailOpen(false);
-  }
+  const clearFocusRequest = useCallback(() => setFocusRequest(null), []);
 
-  return (
-    <div className={styles.page}>
-      <header className={styles.mobileTopbar}>
-        <button
-          ref={menuButtonRef}
-          className={styles.menuButton}
-          type="button"
-          aria-label="Open mailbox sidebar"
-          aria-controls="mail-sidebar"
-          aria-expanded={sidebarOpen}
-          onClick={() => setSidebarOpen(true)}
-        >
-          ☰
-        </button>
-        {/* The app header's current tab already says MAILBOX. This row carries
-            what the pane is actually showing, so the phone layout does not
-            spend one of its few rows repeating the module name. */}
-        <span className={styles.mobileModuleTitle}>
-          {composerOpen ? "New document" : folderLabel}
-          {!composerOpen && mailboxFilter !== "all" ? (
-            <em className={styles.mobileFilterChip}>{filterLabel}</em>
-          ) : null}
-        </span>
-        <button
-          className={styles.mobileCompose}
-          type="button"
-          aria-label="Compose new message"
-          onClick={openComposer}
-        >
-          New
-        </button>
-      </header>
-
-      {sidebarOpen ? (
-        <button
-          className={styles.sidebarBackdrop}
-          type="button"
-          aria-label="Close mailbox sidebar"
-          onClick={() => setSidebarOpen(false)}
-        />
-      ) : null}
-
-      <main
-        aria-label="APP20 Mail"
-        className={`${styles.mailWorkspace} ${
-          mobileDetailOpen ? styles.detailOpen : ""
-        }`}
-      >
-        <aside
-          ref={sidebarRef}
-          id="mail-sidebar"
-          inert={mobileSidebarMode && !sidebarOpen ? true : undefined}
-          className={`${styles.mailSidebar} ${
-            sidebarOpen ? styles.sidebarOpen : ""
-          }`}
-          role={mobileSidebarMode && sidebarOpen ? "dialog" : undefined}
-          aria-modal={mobileSidebarMode && sidebarOpen ? true : undefined}
-          aria-label="Mailbox sidebar"
-        >
-          <div className={styles.sidebarCloseRow}>
-            <button
-              ref={sidebarCloseRef}
-              className={styles.sidebarClose}
-              type="button"
-              aria-label="Close mailbox sidebar"
-              onClick={() => setSidebarOpen(false)}
-            >
-              ×
-            </button>
-          </div>
-
-          <div className={styles.sidebarCreateActions}>
-            <button
-              className={styles.composeButton}
-              type="button"
-              onClick={openComposer}
-            >
-              <span aria-hidden="true">＋</span>
-              Compose
-            </button>
-          </div>
-
-          <nav className={styles.mailboxNav} aria-label="Mail folders">
-            <span className={styles.sidebarLabel}>FOLDERS</span>
-            {MAIL_FOLDERS.map((folder) => (
-              <button
-                key={folder.id}
-                type="button"
-                aria-current={mailFolder === folder.id ? "page" : undefined}
-                onClick={() => selectFolder(folder.id)}
-              >
-                <span>{folder.label}</span>
-                <strong>{folderCounts[folder.id]}</strong>
-              </button>
-            ))}
-          </nav>
-
-          <nav
-            className={styles.typeFilterNav}
-            aria-label="Filter current folder"
-          >
-            <span className={styles.sidebarLabel}>SHOW</span>
-            {TYPE_FILTERS.map((filter) => (
-              <button
-                key={filter.id}
-                type="button"
-                aria-pressed={mailboxFilter === filter.id}
-                onClick={() => selectTypeFilter(filter.id)}
-              >
-                <span>{filter.label}</span>
-                <strong>{typeCounts[filter.id]}</strong>
-              </button>
-            ))}
-          </nav>
-
-          <section className={styles.sidebarScan} aria-labelledby="scan-title">
-            <div className={styles.scanHeading}>
-              <strong id="scan-title">Check for mail</strong>
-            </div>
-            <div className={styles.scanActions}>
-              <button
-                type="button"
-                onClick={() => void scanInbox("newer")}
-                disabled={!keypair || scanning}
-              >
-                {scanning ? "Checking…" : "Check for new mail"}
-              </button>
-              <button
-                type="button"
-                onClick={() => void scanInbox("older")}
-                disabled={!keypair || scanning}
-              >
-                Load older mail
-              </button>
-            </div>
-            <ScanProgress
-              scanning={scanning}
-              pages={scanProgress.pages}
-              maxPages={scanProgress.maxPages}
-              events={scanProgress.events}
-              phase={scanMessage}
-            />
-            {mailboxGate ? (
-              <p className={styles.scanMessage}>
-                {mailboxGate === "wallet"
-                  ? "Connect a wallet before checking for mail."
-                  : "Set up a mailbox key before checking for mail."}
-              </p>
-            ) : null}
-            {scanCursorDescription ? (
-              <p className={styles.scanMessage}>{scanCursorDescription}</p>
-            ) : null}
-            {!scanning && scanMessage ? (
-              <p
-                className={`${styles.scanMessage} ${
-                  scanKind === "error" ? styles.scanMessageError : ""
-                }`}
-                role={scanKind === "error" ? "alert" : "status"}
-              >
-                {scanMessage}
-              </p>
-            ) : null}
-          </section>
-
-          <details className={styles.contactBackupPanel}>
-            <summary>Encrypted mailbox recovery</summary>
-            <div className={styles.contactBackupBody}>
-              <p>
-                Post authenticated contact or RFQ-history self-mail. Oversized
-                ciphertext uses a verified CID pointer. The same wallet locates
-                it; the mailbox recovery phrase decrypts it. Wallet alone is not
-                enough. {MAIL_RECOVERY_PHRASE_AUTHORITY_NOTICE}
-              </p>
-              <button
-                className={styles.secondaryButton}
-                type="button"
-                disabled={
-                  !keypair ||
-                  !mailSeed ||
-                  !helperAddress ||
-                  actionStates["contacts:backup"]?.pending ||
-                  actionStates["rfq-resume:backup"]?.pending
-                }
-                onClick={() => void handleContactBackup()}
-              >
-                {actionStates["contacts:backup"]?.pending
-                  ? "Backing up…"
-                  : "Back up contacts to Mailbox"}
-              </button>
-              {actionStates["contacts:backup"]?.message ? (
-                <p className={styles.scanMessage} role="status">
-                  {actionStates["contacts:backup"].message}
-                </p>
-              ) : null}
-              <button
-                className={styles.secondaryButton}
-                type="button"
-                disabled={
-                  !keypair ||
-                  !mailSeed ||
-                  !helperAddress ||
-                  actionStates["contacts:backup"]?.pending ||
-                  actionStates["rfq-resume:backup"]?.pending
-                }
-                onClick={() => void handleRfqHistoryBackup()}
-              >
-                {actionStates["rfq-resume:backup"]?.pending
-                  ? "Backing up…"
-                  : "Back up RFQ history"}
-              </button>
-              {actionStates["rfq-resume:backup"]?.message ? (
-                <p className={styles.scanMessage} role="status">
-                  {actionStates["rfq-resume:backup"].message}
-                </p>
-              ) : null}
-              <label>
-                <input
-                  type="checkbox"
-                  checked={rfqAutoBackupEnabled}
-                  disabled={!address || !chainId}
-                  onChange={(event) =>
-                    updateRfqAutoBackup(event.target.checked)
-                  }
-                />{" "}
-                Automatically back up RFQ history after settlement (opt in)
-              </label>
-            </div>
-          </details>
-
-          <details className={styles.forgetDevice}>
-            <summary>Device safety</summary>
-            <p>
-              Disconnecting is not logout: drafts, Sent copies, and aliases stay
-              in this browser profile.
-            </p>
-            <button
-              className={styles.secondaryButton}
-              type="button"
-              onClick={lockMailboxSession}
-            >
-              Lock mailbox this session
-            </button>
-            <button
-              className={styles.warningButton}
-              type="button"
-              onClick={forgetThisDevice}
-            >
-              Forget this device
-            </button>
-          </details>
-
-          <footer className={styles.sidebarFooter}>
-            <a
-              href="https://github.com/gstohl/app20"
-              target="_blank"
-              rel="noreferrer"
-            >
-              GitHub ↗
-            </a>
-          </footer>
-        </aside>
-
-        {mailFolder === "drafts" ? (
-          <DraftList
-            drafts={filteredDrafts}
-            selectedDraftId={selectedDraftId}
-            filterLabel={filterLabel}
-            onSelect={selectDraft}
-            onDelete={(draftId) => removeDraft(draftId)}
-          />
-        ) : (
-          <ConversationList
-            messages={annotatedMessages}
-            selectedMessageId={selectedMessageId}
-            readMessageIds={readMessageIds}
-            aliases={displayAliases}
-            selfAddress={address}
-            folderLabel={folderLabel}
-            filterLabel={filterLabel}
-            search={mailboxSearch}
-            onSearchChange={setMailboxSearch}
-            gate={mailboxGate}
-            onSelect={selectMessage}
-          />
-        )}
-
-        <section
-          ref={readingPaneRef}
-          className={styles.readingPane}
-          aria-label="Reading pane"
-        >
-          <header className={styles.readingToolbar}>
-            <button
-              className={styles.backToList}
-              type="button"
-              aria-label="Back to message list"
-              onClick={closeDetail}
-            >
-              ← Messages
-            </button>
-            <div>
-              <span className={styles.sidebarLabel}>
-                {composerOpen
-                  ? "LOCAL DRAFT / NOT ENCRYPTED AT REST"
-                  : selectedMessage
-                    ? "LOCAL PLAINTEXT / CARBON COPY"
-                    : "APP20 / MAILBOX / ENCRYPTED CORRESPONDENCE"}
-              </span>
-              {/* An open thread names itself in its own head, and the folder is
-                  named in the rail beside this; the toolbar spends its line on
-                  the one thing neither of them offers. */}
-              <strong>
-                {composerOpen
-                  ? "New document"
-                  : selectedMessage
-                    ? "Opened on this device"
-                    : "Private correspondence desk"}
-              </strong>
-            </div>
-            {composerOpen ? (
-              <button
-                className={styles.closeCompose}
-                type="button"
-                onClick={closeDetail}
-              >
-                Close
-              </button>
-            ) : selectedMessage ? (
-              <button
-                className={styles.toolbarReply}
-                type="button"
-                onClick={replyToOpenConversation}
-              >
-                Reply
-              </button>
-            ) : null}
-          </header>
-
-          <div ref={readingScrollRef} className={styles.readingScroll}>
-            {storageNotice ? (
-              <div
-                className={`${styles.storageNotice} ${
-                  storageNotice.kind === "error"
-                    ? styles.storageNoticeError
-                    : ""
-                }`}
-                role={storageNotice.kind === "error" ? "alert" : "status"}
-              >
-                <span>{storageNotice.message}</span>
-                {storageNotice.action === "connect-wallet" ? (
-                  <span className={styles.connectAction}>
-                    <SelectWallet />
-                  </span>
-                ) : null}
-              </div>
-            ) : null}
-            {!keypair && selectedMessage && !composerOpen ? (
-              <Onboard
-                key={`${providerIndex}:${address}`}
-                helperAddress={helperAddress}
-                onKeyReady={handleKeyReady}
-              />
-            ) : null}
-            {!keypair && composerOpen ? (
-              <p className={styles.keySetupNotice}>
-                <strong>No mailbox key on this device</strong>
-                <span>
-                  Write and save the draft now. Sending needs a mailbox key —{" "}
-                  <a href="#mailbox-key-setup">set one up below</a>.
-                </span>
-              </p>
-            ) : null}
-            {composerOpen && activeDraft ? (
-              <Compose
-                draft={activeDraft}
-                helperAddress={helperAddress}
-                escrowAddress={escrowAddress}
-                escrowEnabled={escrowEnabled}
-                mailSeed={mailSeed}
-                keyReady={Boolean(keypair)}
-                networkName={networkName}
-                onDraftChange={persistDraft}
-                onDeleteDraft={(draftId) => removeDraft(draftId, false)}
-                onSent={(message) => {
-                  handleSent(message);
-                  removeDraft(message.draftId, false);
-                  setMailFolder("sent");
-                  setMailboxFilter("all");
-                  setSelectedMessageId(`sent:${message.documentId}`);
-                  setComposerOpen(false);
-                }}
-              />
-            ) : selectedMessage ? (
-              <Thread
-                messages={conversationMessages}
-                focusVersion={messageActivation}
-                selfAddress={address}
-                aliases={displayAliases}
-                otcState={otcState}
-                escrowState={escrowState}
-                actionStates={actionStates}
-                onAccept={(offer, index) => void handleAccept(offer, index)}
-                onDecline={(offer) => void handleDecline(offer)}
-                onPostReceipt={(offer) => void handlePostReceipt(offer)}
-                onPay={(request) => void handlePay(request)}
-                onPayPrivatelyWithStrk={handlePayPrivatelyWithStrk}
-                invoiceMaturityHeadBlock={invoiceMaturityHeadBlock}
-                onEscrowFill={(fund) => void handleEscrowFill(fund)}
-                onEscrowClaim={
-                  providerIndex === constants.LOCALNET_PROVIDER_INDEX
-                    ? (fund) => void handleLocalnetEscrowPayout(fund, "claim")
-                    : undefined
-                }
-                onEscrowTimeout={
-                  providerIndex === constants.LOCALNET_PROVIDER_INDEX
-                    ? (fund) => void handleLocalnetEscrowPayout(fund, "timeout")
-                    : undefined
-                }
-                onRestoreContacts={(payload, message) =>
-                  void restoreContactBackup(payload, message)
-                }
-                onRestoreBackup={(payload, message) =>
-                  void restoreAuthenticatedBackup(payload, message)
-                }
-                contactRestorePending={
-                  actionStates["contacts:restore"]?.pending
-                }
-                backupRestorePending={actionStates["backup:restore"]?.pending}
-                onReply={openComposerForRecipient}
-                onAssign={assignMessageAddress}
-                onProve={(messageId, assigned) =>
-                  void proveAssignedAddress(messageId, assigned)
-                }
-                proofs={proofs}
-              />
-            ) : (
-              <section
-                className={styles.welcomeState}
-                aria-labelledby="mail-welcome-title"
-              >
-                <div className={styles.welcomeSheet}>
-                  <p className={styles.eyebrow}>APP20 / MAILBOX</p>
-                  <h1 id="mail-welcome-title">
-                    Encrypted messages. Private value.
-                  </h1>
-                  <p className={styles.welcomeCopy}>
-                    {walletGateShown
-                      ? "Composing sets up your mailbox key when needed."
-                      : !address || !chainId
-                        ? "Mail is keyed to a wallet: connect one to read this mailbox or write a letter. Your mailbox key is set up here when it is first needed."
-                        : keypair
-                          ? "Check for mail or compose a letter."
-                          : "Composing sets up your mailbox key when needed."}
-                  </p>
-                  {/* The CTA has to be the step that is actually available:
-                      offering compose to a disconnected desk only produced a
-                      notice pointing at a control in the app header. The gate
-                      notice carries the same control, so only one of the two
-                      asks for the wallet at a time. */}
-                  {walletGateShown ? null : !address || !chainId ? (
-                    <div
-                      className={`${styles.welcomeConnect} ${styles.connectAction}`}
-                    >
-                      <SelectWallet />
-                    </div>
-                  ) : (
-                    <button
-                      className={styles.welcomeCompose}
-                      type="button"
-                      onClick={openComposer}
-                    >
-                      Compose encrypted mail
-                    </button>
-                  )}
-                </div>
-              </section>
-            )}
-            {!keypair && composerOpen ? (
-              <Onboard
-                key={`${providerIndex}:${address}`}
-                helperAddress={helperAddress}
-                onKeyReady={handleKeyReady}
-              />
-            ) : null}
-          </div>
-        </section>
-      </main>
-    </div>
-  );
+  return {
+    address,
+    chainId,
+    providerIndex,
+    helperAddress,
+    escrowAddress,
+    escrowEnabled,
+    networkName,
+    keypair,
+    mailSeed,
+    keyFingerprint,
+    mailboxGate,
+    messages: annotatedMessages,
+    aliases,
+    displayAliases,
+    bookEntries,
+    otcState,
+    escrowState,
+    actionStates,
+    assignments,
+    proofs,
+    invoiceMaturityHeadBlock,
+    drafts,
+    readMessageIds,
+    markMessagesRead,
+    scanning,
+    scanKind,
+    scanMessage,
+    scanProgress,
+    scanCursorDescription,
+    scanInbox,
+    handleKeyReady,
+    lockMailboxSession,
+    forgetThisDevice,
+    handleSent,
+    persistDraft,
+    removeDraft,
+    createDraft,
+    handleAccept,
+    handleDecline,
+    handlePostReceipt,
+    handlePay,
+    handlePayPrivatelyWithStrk,
+    handleEscrowFill,
+    handleLocalnetEscrowPayout,
+    handleContactBackup,
+    handleRfqHistoryBackup,
+    rfqAutoBackupEnabled,
+    updateRfqAutoBackup,
+    restoreContactBackup,
+    restoreAuthenticatedBackup,
+    assignMessageAddress,
+    proveAssignedAddress,
+    storageNotice,
+    setStorageNotice,
+    focusRequest,
+    clearFocusRequest,
+    pendingPayment,
+  };
 }
+
+export type MailboxDesk = ReturnType<typeof useMailboxDesk>;
diff --git a/src/app/components/AppShell.tsx b/src/app/components/AppShell.tsx
index 25d0cf6..4632330 100644
--- a/src/app/components/AppShell.tsx
+++ b/src/app/components/AppShell.tsx
@@ -15,22 +15,19 @@ export default function AppShell({ renderLocalnetTools }: AppShellProps) {
   const readyConnected = useStoreWallet((state) => state.isConnected);
   const walletMode = useWalletMode((state) => state.mode);
   const privyConnected = useWalletMode((state) => state.privyConnected);
-  const mailActive = pathname.startsWith("/mail") || pathname === "/inbox";
   const rfqActive = pathname === "/rfq" || pathname.startsWith("/rfq/");
   const chatActive = pathname === "/chat" || pathname.startsWith("/chat/");
   const connected = walletMode === "privy" ? privyConnected : readyConnected;
   const payActive = pathname === "/pay";
-  const moduleName = mailActive
-    ? "MAILBOX"
-    : chatActive
-      ? "CHAT"
-      : payActive
-        ? "PAY"
-        : pathname === "/contacts"
-          ? "COUNTERPARTIES"
-          : rfqActive
-            ? "RFQ WORKSPACE"
-            : "APP20";
+  const moduleName = chatActive
+    ? "CHAT"
+    : payActive
+      ? "PAY"
+      : pathname === "/contacts"
+        ? "COUNTERPARTIES"
+        : rfqActive
+          ? "RFQ WORKSPACE"
+          : "APP20";
 
   return (
     <div
@@ -44,8 +41,7 @@ export default function AppShell({ renderLocalnetTools }: AppShellProps) {
           className={`signal-dot ${connected ? "is-live" : ""}`}
           aria-hidden="true"
         />
-        {/* Live session state for the module you are actually in. It used to
-            name the RFQ workspace on every route, Mailbox included. */}
+        {/* Live session state for the module you are actually in. */}
         {connected
           ? `${moduleName} · WALLET CONNECTED · PUBLIC-NETWORK RFQ DISABLED`
           : `${moduleName} · NO WALLET CONNECTED`}
@@ -66,9 +62,6 @@ export default function AppShell({ renderLocalnetTools }: AppShellProps) {
           <Link to="/chat" aria-current={chatActive ? "page" : undefined}>
             Chat
           </Link>
-          <Link to="/mail/inbox" aria-current={mailActive ? "page" : undefined}>
-            Mailbox
-          </Link>
           <Link
             to="/contacts"
             aria-current={pathname === "/contacts" ? "page" : undefined}
diff --git a/src/app/contacts/page.tsx b/src/app/contacts/page.tsx
index 2413107..1c98d9b 100644
--- a/src/app/contacts/page.tsx
+++ b/src/app/contacts/page.tsx
@@ -84,7 +84,7 @@ function AddressBookPanel({
       setAddressDraft("");
       setError(null);
       setStatus(
-        "Saved under this device's AES-GCM key. Use Mailbox for an encrypted on-chain recovery snapshot.",
+        "Saved under this device's AES-GCM key. Back it up from Chat's mailbox tools for an encrypted on-chain recovery snapshot.",
       );
       window.dispatchEvent(new Event(ADDRESS_BOOK_CHANGED_EVENT));
     } catch (cause: unknown) {
@@ -197,7 +197,7 @@ function AddressBookPanel({
                           New RFQ
                         </Link>
                         <Link
-                          to="/mail/inbox"
+                          to="/chat"
                           onClick={() => {
                             storeDeskHandoff(
                               window.sessionStorage,
@@ -207,14 +207,14 @@ function AddressBookPanel({
                             );
                           }}
                         >
-                          Encrypted Mail
+                          Open in Chat
                         </Link>
                       </>
                     ) : (
                       <button
                         type="button"
                         disabled
-                        title="RFQ and Mail handoffs require the active Ready account and network"
+                        title="RFQ and Chat handoffs require the active Ready account and network"
                       >
                         Handoffs unavailable
                       </button>
@@ -236,7 +236,7 @@ function AddressBookPanel({
               <p className={styles.bookEmpty}>
                 Add a label and address above. Entries stay AES-GCM encrypted
                 under a device-local key until you explicitly post an encrypted
-                recovery snapshot from Mailbox.
+                recovery snapshot from Chat&apos;s mailbox tools.
               </p>
             </div>
           )
@@ -271,8 +271,8 @@ export default function ContactsPage() {
           <h1>Counterparties on file. Nothing leaves this device.</h1>
           <span>
             Label the wallets you trade with, then jump straight into an RFQ or
-            encrypted Mail. The book is AES-GCM encrypted and never posted
-            anywhere unless you snapshot it from Mailbox yourself.
+            their Chat conversation. The book is AES-GCM encrypted and never
+            posted anywhere unless you snapshot it from Chat yourself.
           </span>
         </div>
       </header>
@@ -284,9 +284,9 @@ export default function ContactsPage() {
       <p className={styles.disclosure}>
         Local contacts are AES-GCM encrypted under app20/address-book/v1. Code
         running in this browser profile can still read an unlocked book. For
-        cross-device recovery, Mailbox can post a self-addressed encrypted
-        snapshot: connect the same wallet and restore the mailbox recovery
-        phrase. Wallet possession alone cannot decrypt it. {" "}
+        cross-device recovery, Chat&apos;s mailbox tools can post a
+        self-addressed encrypted snapshot: connect the same wallet and restore
+        the mailbox recovery phrase. Wallet possession alone cannot decrypt it. {" "}
         {MAIL_RECOVERY_PHRASE_AUTHORITY_NOTICE} On-chain ciphertext, size,
         timing, and helper activity remain public and cannot be deleted.
       </p>
diff --git a/src/app/pay/page.tsx b/src/app/pay/page.tsx
index 40a7882..08cdc2a 100644
--- a/src/app/pay/page.tsx
+++ b/src/app/pay/page.tsx
@@ -126,16 +126,16 @@ export default function PayPage() {
   let readinessMessage: string;
   if (!isConnected || !address || !chainId) {
     readinessMessage =
-      "No wallet is connected. Continue to the inbox, connect a privacy-enabled wallet, and load or register its device mail key before paying.";
+      "No wallet is connected. Continue to Chat, connect a privacy-enabled wallet, and load or register its device mail key before paying.";
   } else if (!isStrk20Capable) {
     readinessMessage =
       "The connected wallet does not expose the dapp-facing STRK20 API APP20 requires. No private payment can be submitted.";
   } else if (mailVaultKind === "missing") {
     readinessMessage =
-      "This account is not onboarded in this browser. Continue to the inbox to create or restore and register its device mail key before paying.";
+      "This account is not onboarded in this browser. Continue to Chat to create or restore and register its device mail key before paying.";
   } else {
     readinessMessage =
-      "A mailbox vault exists in this browser profile. If it is passphrase-wrapped, unlock it in the inbox before paying. Clear the local mailbox when using a shared machine.";
+      "A mailbox vault exists in this browser profile. If it is passphrase-wrapped, unlock it in Chat before paying. Clear the local mailbox when using a shared machine.";
   }
 
   let creatorReadiness: string;
@@ -144,7 +144,7 @@ export default function PayPage() {
       "Connect the privacy-enabled wallet and network that should receive the private STRK payment.";
   } else if (isStrk20Capable && mailVaultKind === "missing") {
     creatorReadiness =
-      "Create or restore this wallet's Mail identity in the inbox first. APP20 will not present a newly generated payment request as trustworthy without a Mail signature.";
+      "Create or restore this wallet's Mail identity in Chat first. APP20 will not present a newly generated payment request as trustworthy without a Mail signature.";
   } else if (isStrk20Capable) {
     creatorReadiness =
       "Ready to create a Mail-signed request for the connected wallet. Generating and copying the link submits no transaction and costs no pool fee.";
@@ -153,7 +153,7 @@ export default function PayPage() {
       "This wallet does not expose APP20's required dapp-facing STRK20 API. Link creation is disabled because the receiving account may not be ready for private STRK.";
   }
 
-  function continueToInbox(replaceExisting = false) {
+  function continueToChat(replaceExisting = false) {
     if (!request) return;
 
     try {
@@ -170,7 +170,7 @@ export default function PayPage() {
 
       storePendingPayment(window.sessionStorage, window.location.hash);
       setPendingConflict(false);
-      void navigate({ to: "/mail/inbox" });
+      void navigate({ to: "/chat" });
     } catch (error: unknown) {
       setHandoffError(
         error instanceof Error
@@ -207,7 +207,7 @@ export default function PayPage() {
       const vault = inspectMailVault(window.localStorage, chainId, address);
       if (vault.kind === "missing") {
         throw new Error(
-          "Create or restore this wallet's Mail identity in the inbox before generating a signed link.",
+          "Create or restore this wallet's Mail identity in Chat before generating a signed link.",
         );
       }
       if (vault.kind === "passphrase" && !mailPassphrase) {
@@ -338,7 +338,7 @@ export default function PayPage() {
               />
               <p className={styles.actionWarning}>
                 Continuing stores this decoded request in this tab. It does not
-                submit a payment. In the inbox, review it again and explicitly
+                submit a payment. In Chat, review it again and explicitly
                 confirm through the normal wallet flow. Shield separately before
                 paying; bundling a public shield with the transfer would
                 correlate them.
@@ -354,7 +354,7 @@ export default function PayPage() {
                   <button
                     className={styles.warningButton}
                     type="button"
-                    onClick={() => continueToInbox(true)}
+                    onClick={() => continueToChat(true)}
                   >
                     Replace pending request and continue
                   </button>
@@ -363,14 +363,14 @@ export default function PayPage() {
                 <button
                   className={styles.primaryButton}
                   type="button"
-                  onClick={() => continueToInbox(false)}
+                  onClick={() => continueToChat(false)}
                   disabled={expired || wrongNetwork}
                 >
                   {expired
                     ? "Expired request — payment disabled"
                     : wrongNetwork
                       ? `Switch wallet to ${requestedNetwork}`
-                      : "Continue to inbox to review & pay"}
+                      : "Continue to Chat to review & pay"}
                 </button>
               )}
               {handoffError ? (
@@ -581,7 +581,7 @@ export default function PayPage() {
       </main>
 
       <footer className={styles.footer}>
-        <Link to="/mail/inbox">Open APP20 Mail</Link>
+        <Link to="/chat">Open Chat</Link>
         <span>
           {hasFragment
             ? "No link can authorize or auto-submit a payment."
diff --git a/src/app/rfq/LocalnetPrivateIntentDesk.tsx b/src/app/rfq/LocalnetPrivateIntentDesk.tsx
index 89823e9..1fa9f72 100644
--- a/src/app/rfq/LocalnetPrivateIntentDesk.tsx
+++ b/src/app/rfq/LocalnetPrivateIntentDesk.tsx
@@ -1626,7 +1626,7 @@ export default function LocalnetPrivateIntentDesk({
           </div>
           {address && chain ? (
             <Link
-              to="/mail/inbox"
+              to="/chat"
               onClick={() =>
                 storeDeskHandoff(window.sessionStorage, "mail", counterparty, {
                   account: address,
diff --git a/src/app/rfq/PrivacyWalletMenu.tsx b/src/app/rfq/PrivacyWalletMenu.tsx
index 1a7ead6..6c4fbcc 100644
--- a/src/app/rfq/PrivacyWalletMenu.tsx
+++ b/src/app/rfq/PrivacyWalletMenu.tsx
@@ -422,7 +422,7 @@ export default function PrivacyWalletMenu({
             <div>
               <span className={styles.sidebarLabel}>IDENTITY</span>
               <strong>
-                {isConnected ? "Mailbox account" : "Wallet disconnected"}
+                {isConnected ? "Connected account" : "Wallet disconnected"}
               </strong>
             </div>
             <SelectWallet variant="nav" />
diff --git a/src/app/rfq/RfqWorkspace.tsx b/src/app/rfq/RfqWorkspace.tsx
index 1a8ae8c..2676d94 100644
--- a/src/app/rfq/RfqWorkspace.tsx
+++ b/src/app/rfq/RfqWorkspace.tsx
@@ -1334,7 +1334,7 @@ export default function RfqWorkspace() {
             <span>Elsewhere</span>
             <Link to="/rfq/operations">RFQ operations status</Link>
             <Link to="/funding">Shield / unshield funding</Link>
-            <Link to="/mail/inbox">Mail · coordination only</Link>
+            <Link to="/chat">Chat · coordination only</Link>
             <Link to="/cross-chain-review">Cross-chain dry review</Link>
             <Link to="/recovery/privy">Privy recovery</Link>
           </nav>
diff --git a/src/app/routes.test.ts b/src/app/routes.test.ts
index 803b91d..262ff9a 100644
--- a/src/app/routes.test.ts
+++ b/src/app/routes.test.ts
@@ -10,8 +10,9 @@ import {
 
 describe("APP20 canonical routes", () => {
   it.each([
-    ["/mail", "/mail/inbox"],
-    ["/inbox", "/mail/inbox"],
+    ["/mail", "/chat"],
+    ["/inbox", "/chat"],
+    ["/mail/inbox", "/chat"],
     ["/vault", "/rfq"],
     ["/intents", "/cross-chain-review"],
     ["/workflows", "/rfq"],
@@ -20,7 +21,7 @@ describe("APP20 canonical routes", () => {
   });
 
   it.each([
-    ["/inbox", "#thread", "/mail/inbox"],
+    ["/inbox", "#thread", "/chat"],
     ["/intents", "#review", "/cross-chain-review"],
     ["/workflows", "#active", "/rfq"],
   ])("preserves %s bookmark hash through its redirect", (source, hash, to) => {
@@ -31,7 +32,7 @@ describe("APP20 canonical routes", () => {
   });
 
   it("omits an empty redirect hash and rejects non-legacy paths", () => {
-    expect(legacyRouteRedirect("/inbox")).toEqual({ to: "/mail/inbox" });
+    expect(legacyRouteRedirect("/inbox")).toEqual({ to: "/chat" });
     expect(legacyRouteRedirect("/rfq", "#new")).toBeNull();
   });
 
@@ -51,7 +52,6 @@ describe("APP20 canonical routes", () => {
     expect(CANONICAL_ROUTES.recovery).toBe("/recovery/privy");
     expect(CANONICAL_ROUTES.crossChainReview).toBe("/cross-chain-review");
     expect(legacyRouteTarget(CANONICAL_ROUTES.rfq)).toBeNull();
-    expect(legacyRouteTarget(CANONICAL_ROUTES.mail)).toBeNull();
     expect(CANONICAL_ROUTES.chat).toBe("/chat");
     expect(legacyRouteTarget(CANONICAL_ROUTES.chat)).toBeNull();
     expect(legacyRouteTarget(CANONICAL_ROUTES.contacts)).toBeNull();
diff --git a/src/app/routes.ts b/src/app/routes.ts
index e712151..e1be9e6 100644
--- a/src/app/routes.ts
+++ b/src/app/routes.ts
@@ -7,7 +7,6 @@ export const CANONICAL_ROUTES = {
   send: "/send",
   recovery: "/recovery/privy",
   crossChainReview: "/cross-chain-review",
-  mail: "/mail/inbox",
   chat: "/chat",
   intents: "/intents",
   contacts: "/contacts",
@@ -34,7 +33,8 @@ export function legacyRouteTarget(pathname: string): string | null {
   switch (pathname) {
     case "/mail":
     case "/inbox":
-      return CANONICAL_ROUTES.mail;
+    case "/mail/inbox":
+      return CANONICAL_ROUTES.chat;
     case "/vault":
     case "/workflows":
       return CANONICAL_ROUTES.rfq;
diff --git a/src/components/mail/Thread.test.tsx b/src/components/mail/ChainRecordPanel.test.tsx
similarity index 93%
rename from src/components/mail/Thread.test.tsx
rename to src/components/mail/ChainRecordPanel.test.tsx
index fb79884..32f91c9 100644
--- a/src/components/mail/Thread.test.tsx
+++ b/src/components/mail/ChainRecordPanel.test.tsx
@@ -2,7 +2,8 @@ import { renderToStaticMarkup } from "react-dom/server";
 import { describe, expect, it } from "vitest";
 import { decodeEnvelope, encodeEnvelope } from "@/lib/envelope";
 import ContactSnapshotCard from "./ContactSnapshotCard";
-import { ChainRecordPanel, type LocalMailMessage } from "./Thread";
+import { ChainRecordPanel } from "./ChainRecordPanel";
+import type { LocalMailMessage } from "./message";
 
 const message: LocalMailMessage = {
   id: "incoming:1",
diff --git a/src/components/mail/ChainRecordPanel.tsx b/src/components/mail/ChainRecordPanel.tsx
new file mode 100644
index 0000000..f117a4e
--- /dev/null
+++ b/src/components/mail/ChainRecordPanel.tsx
@@ -0,0 +1,180 @@
+"use client";
+
+import { useState } from "react";
+import { publicRecipientCount } from "@/lib/mail-recipient-count";
+import type { LocalMailMessage } from "./message";
+import styles from "./mail.module.css";
+
+const CIPHERTEXT_PREVIEW_FELTS = 4;
+
+type CopyState = "idle" | "copied" | "error";
+
+function isoBlockTimestamp(timestamp: number | undefined): string | null {
+  if (timestamp === undefined) return null;
+  try {
+    const value = new Date(timestamp * 1_000).toISOString();
+    return value;
+  } catch {
+    return null;
+  }
+}
+
+export function ChainRecordPanel({ message }: { message: LocalMailMessage }) {
+  const [copyState, setCopyState] = useState<CopyState>("idle");
+  const { record } = message;
+  const timestamp = isoBlockTimestamp(message.blockTimestamp);
+  const recipientCount =
+    message.recipientCount ?? publicRecipientCount(message.record);
+  const preview = record.ciphertextFelts.slice(0, CIPHERTEXT_PREVIEW_FELTS);
+  const hiddenFeltCount = record.ciphertextFelts.length - preview.length;
+
+  async function copyAllCiphertext() {
+    try {
+      await navigator.clipboard.writeText(
+        JSON.stringify(record.ciphertextFelts),
+      );
+      setCopyState("copied");
+    } catch {
+      setCopyState("error");
+    }
+  }
+
+  return (
+    <details className={styles.chainDisclosure}>
+      <summary>
+        <span>What the chain sees</span>
+        <span className={styles.chainToggleHint}>PUBLIC EVIDENCE</span>
+      </summary>
+      <aside
+        className={styles.chainRecord}
+        aria-label={`Public on-chain record for message ${message.index}`}
+      >
+        <div className={styles.chainRecordHeading}>
+          <div>
+            <span className={styles.chainEyebrow}>MESSAGEPOSTED / PUBLIC</span>
+            <h3>Opaque event data</h3>
+          </div>
+          <span className={styles.chainEvidenceBadge}>ON-CHAIN EVIDENCE</span>
+        </div>
+
+        <dl className={styles.chainFields}>
+          <div className={styles.chainField}>
+            <dt>Message index</dt>
+            <dd>
+              <code>{message.index}</code>
+            </dd>
+          </div>
+          <div className={styles.chainField}>
+            <dt>Recipient count</dt>
+            <dd>
+              <code>{recipientCount}</code>
+              <small>PUBLIC FORMAT METADATA</small>
+            </dd>
+          </div>
+          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
+            <dt>Transaction hash</dt>
+            <dd>
+              <code>{message.transactionHash}</code>
+            </dd>
+          </div>
+          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
+            <dt>Block timestamp</dt>
+            <dd>
+              {timestamp && message.blockTimestamp !== undefined ? (
+                <>
+                  <time dateTime={timestamp}>{timestamp}</time>
+                  <small>UNIX {message.blockTimestamp}</small>
+                </>
+              ) : (
+                <span className={styles.sealedValue}>NOT AVAILABLE</span>
+              )}
+            </dd>
+          </div>
+          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
+            <dt>Ephemeral public key</dt>
+            <dd className={styles.feltPair}>
+              {record.ephemeralPub.map((felt, index) => (
+                <code key={`${index}:${felt}`}>{felt}</code>
+              ))}
+            </dd>
+          </div>
+          <div className={styles.chainField}>
+            <dt>View tag</dt>
+            <dd>
+              <code>
+                {record.viewTag} / 0x
+                {record.viewTag.toString(16).padStart(2, "0")}
+              </code>
+            </dd>
+          </div>
+          <div className={styles.chainField}>
+            <dt>Nonce</dt>
+            <dd className={styles.feltPair}>
+              {record.nonce.map((felt, index) => (
+                <code key={`${index}:${felt}`}>{felt}</code>
+              ))}
+            </dd>
+          </div>
+          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
+            <dt>Ciphertext felts</dt>
+            <dd>
+              <ol className={styles.ciphertextPreview}>
+                {preview.map((felt, index) => (
+                  <li key={`${index}:${felt}`}>
+                    <span>{index.toString().padStart(2, "0")}</span>
+                    <code>{felt}</code>
+                  </li>
+                ))}
+                {hiddenFeltCount > 0 ? (
+                  <li className={styles.truncatedFelts}>
+                    … {hiddenFeltCount} more felt
+                    {hiddenFeltCount === 1 ? "" : "s"} in the public record
+                  </li>
+                ) : null}
+              </ol>
+              <div className={styles.ciphertextActions}>
+                <span>
+                  {record.ciphertextFelts.length} FELT
+                  {record.ciphertextFelts.length === 1 ? "" : "S"} TOTAL
+                </span>
+                <button
+                  className={styles.chainCopyButton}
+                  type="button"
+                  onClick={copyAllCiphertext}
+                >
+                  {copyState === "copied"
+                    ? "Copied all"
+                    : copyState === "error"
+                      ? "Copy failed"
+                      : `Copy all ${record.ciphertextFelts.length}`}
+                </button>
+              </div>
+              <span className={styles.copyStatus} aria-live="polite">
+                {copyState === "copied"
+                  ? "Complete ciphertext JSON copied."
+                  : copyState === "error"
+                    ? "Clipboard access was denied."
+                    : ""}
+              </span>
+            </dd>
+          </div>
+        </dl>
+
+        <div className={styles.absentFields}>
+          <span>
+            <b>Sender address</b>
+            <code>ABSENT</code>
+          </span>
+          <span>
+            <b>Recipient identities</b>
+            <code>ABSENT</code>
+          </span>
+        </div>
+        <p className={styles.addressAbsence}>
+          Recipient count is public in the ciphertext format. No sender or
+          recipient address appears anywhere in this MessagePosted record.
+        </p>
+      </aside>
+    </details>
+  );
+}
diff --git a/src/components/mail/ConversationList.test.ts b/src/components/mail/ConversationList.test.ts
deleted file mode 100644
index 27ec34d..0000000
--- a/src/components/mail/ConversationList.test.ts
+++ /dev/null
@@ -1,243 +0,0 @@
-import { createElement, type ComponentType } from "react";
-import { renderToStaticMarkup } from "react-dom/server";
-import { describe, expect, it } from "vitest";
-import { addrSTRK } from "../../utils/constants";
-import { createBackupSnapshot } from "../../lib/backup-snapshot";
-import { decodeEnvelope, encodeEnvelope } from "../../lib/envelope";
-import type { LocalMailMessage } from "./Thread";
-import ConversationList, {
-  conversationCorrespondent,
-  mailboxMatchesFilter,
-  messageMatchesSearch,
-} from "./ConversationList";
-
-const strk = { symbol: "STRK", address: addrSTRK, decimals: 18 };
-const usdc = { symbol: "USDC", address: "0x53c", decimals: 6 };
-
-function compositeMessage(
-  direction: "incoming" | "outgoing",
-): LocalMailMessage {
-  const envelope = decodeEnvelope(
-    encodeEnvelope("composite", {
-      documentId: `0x${"21".repeat(32)}`,
-      body: "Invoice with contract-backed settlement terms",
-      attachments: [
-        {
-          type: "payment_request",
-          payload: {
-            requestId: `0x${"22".repeat(32)}`,
-            token: strk,
-            amount: "4",
-            requester: "0xa11ce",
-            expiresAt: 2_000_000_000,
-          },
-        },
-        {
-          type: "escrow_fund",
-          payload: {
-            dealId: "0x23",
-            escrowAddress: "0xe5c",
-            maker: "0xa11ce",
-            legA: { token: strk, amount: "5" },
-            legB: { token: usdc, amount: "6" },
-            deadline: 2_000_000_000,
-            claimPubkey: "0x123",
-          },
-        },
-      ],
-    }),
-  );
-  return {
-    id: `${direction}:composite`,
-    index: "1",
-    plaintext: "Invoice with contract-backed settlement terms",
-    envelope,
-    record: {
-      ephemeralPub: ["0x1", "0x2"],
-      viewTag: 3,
-      nonce: ["0x4", "0x5"],
-      ciphertextFelts: ["0x6"],
-    },
-    transactionHash: "0x7",
-    direction,
-  };
-}
-
-describe("foldered composite reachability", () => {
-  it.each(["incoming", "outgoing"] as const)(
-    "surfaces an %s invoice-plus-escrow document under both filters",
-    (direction) => {
-      const message = compositeMessage(direction);
-      expect(mailboxMatchesFilter(message, "all")).toBe(true);
-      expect(mailboxMatchesFilter(message, "letters")).toBe(true);
-      expect(mailboxMatchesFilter(message, "invoices")).toBe(true);
-      expect(mailboxMatchesFilter(message, "escrow")).toBe(true);
-      expect(mailboxMatchesFilter(message, "deals")).toBe(false);
-    },
-  );
-
-  it("keeps the raw unauthenticated financial address primary when an alias exists", () => {
-    const message = compositeMessage("incoming");
-    const correspondent = conversationCorrespondent(
-      message,
-      [{ address: "0xa11ce", label: "Alice", addedAt: 1 }],
-      "0xb0b",
-    );
-
-    expect(correspondent).toEqual({
-      primary: "Claimed address: 0xa11ce",
-      detail: "Unauthenticated payload claim · local alias “Alice”",
-      fullAddress: "0xa11ce",
-    });
-    expect(correspondent.primary).not.toBe("Alice");
-  });
-
-  it("shows device-local Sent recipients instead of Private recipient", () => {
-    const message = compositeMessage("outgoing");
-    message.recipients = ["0xb0b"];
-    const correspondent = conversationCorrespondent(
-      message,
-      [{ address: "0xb0b", label: "Bob", addedAt: 1 }],
-      "0xa11ce",
-    );
-    expect(correspondent.primary).toContain("0xb0b");
-    expect(correspondent.primary).toContain("Bob");
-    expect(correspondent.detail).toMatch(/not on-chain/i);
-  });
-});
-
-describe("conversation list accessibility", () => {
-  it("exposes unread state and a machine-readable timestamp", () => {
-    const message = compositeMessage("incoming");
-    message.localCreatedAt = Date.UTC(2026, 0, 2, 15, 4);
-    const List = ConversationList as ComponentType<{
-      messages: LocalMailMessage[];
-      selectedMessageId: string | null;
-      readMessageIds: ReadonlySet<string>;
-      aliases: [];
-      selfAddress: string;
-      folderLabel: string;
-      filterLabel: string;
-      onSelect: (messageId: string) => void;
-    }>;
-    const markup = renderToStaticMarkup(
-      createElement(List, {
-        messages: [message],
-        selectedMessageId: null,
-        readMessageIds: new Set<string>(),
-        aliases: [],
-        selfAddress: "0xb0b",
-        folderLabel: "Inbox",
-        filterLabel: "All types",
-        onSelect: () => undefined,
-      }),
-    );
-    expect(markup).toContain('aria-label="Unread.');
-    expect(markup).toMatch(/dateTime="2026-01-02T15:04:00.000Z"/i);
-  });
-
-  it("labels authenticated backup envelopes instead of presenting them as unsupported", () => {
-    const message = compositeMessage("incoming");
-    message.envelope = decodeEnvelope(
-      encodeEnvelope(
-        "backup_snapshot",
-        createBackupSnapshot({
-          owner: "0xa11ce",
-          chainId: "SN_SEPOLIA",
-          helperAddress: "0x1234",
-          mailboxFingerprint: "ab".repeat(32),
-          mailboxSeed: Uint8Array.from({ length: 32 }, (_, index) => index + 1),
-          kind: "contacts",
-          seq: 1,
-          payload: { entries: [] },
-        }),
-      ),
-    );
-    const markup = renderToStaticMarkup(
-      createElement(ConversationList, {
-        messages: [message],
-        selectedMessageId: null,
-        readMessageIds: new Set<string>(),
-        aliases: [],
-        selfAddress: "0xa11ce",
-        folderLabel: "Inbox",
-        filterLabel: "All types",
-        onSelect: () => undefined,
-      }),
-    );
-
-    expect(markup).toContain("Contact backup");
-    expect(markup).toContain("Wallet + mailbox recovery phrase required");
-    expect(markup).toContain("This mailbox");
-    expect(markup).not.toContain("Unsupported decrypted record");
-  });
-});
-
-describe("device-local search", () => {
-  const message = compositeMessage("incoming");
-  const correspondent = conversationCorrespondent(message, [], "0xb0b");
-
-  it("matches an empty query so an unsearched rail shows everything", () => {
-    expect(messageMatchesSearch(message, correspondent, "   ")).toBe(true);
-  });
-
-  it("matches decrypted body text, the record type and the index", () => {
-    expect(messageMatchesSearch(message, correspondent, "settlement")).toBe(
-      true,
-    );
-    expect(messageMatchesSearch(message, correspondent, "document")).toBe(true);
-    expect(messageMatchesSearch(message, correspondent, message.index)).toBe(
-      true,
-    );
-  });
-
-  it("matches the correspondent, including a claimed address", () => {
-    expect(messageMatchesSearch(message, correspondent, "0xa11ce")).toBe(true);
-  });
-
-  it("does not match text that is absent from the decrypted record", () => {
-    expect(messageMatchesSearch(message, correspondent, "zzz-not-here")).toBe(
-      false,
-    );
-  });
-});
-
-describe("naming a sealed sender", () => {
-  it("shows the name everywhere once a record carries an assignment", () => {
-    const message = compositeMessage("incoming");
-    message.envelope = decodeEnvelope(encodeEnvelope("text", { body: "hi" }));
-    message.assignedAddress = "0xb0b";
-    const named = conversationCorrespondent(message, [], "0xa11ce");
-    expect(named.primary).toBe("0xb0b");
-    expect(named.detail).toMatch(/not authenticated/i);
-    expect(named.fullAddress).toBe("0xb0b");
-
-    const labelled = conversationCorrespondent(
-      message,
-      [{ address: "0xb0b", label: "Bob", addedAt: 1 }],
-      "0xa11ce",
-    );
-    expect(labelled.primary).toBe("Bob");
-  });
-
-  it("stays sealed when nothing has been named", () => {
-    const message = compositeMessage("incoming");
-    message.envelope = decodeEnvelope(encodeEnvelope("text", { body: "hi" }));
-    expect(conversationCorrespondent(message, [], "0xa11ce").primary).toBe(
-      "Sealed sender",
-    );
-  });
-
-  it("makes a named counterparty searchable by name and address", () => {
-    const message = compositeMessage("incoming");
-    message.envelope = decodeEnvelope(encodeEnvelope("text", { body: "hi" }));
-    message.assignedAddress = "0xb0b";
-    const named = conversationCorrespondent(
-      message,
-      [{ address: "0xb0b", label: "Bob", addedAt: 1 }],
-      "0xa11ce",
-    );
-    expect(messageMatchesSearch(message, named, "bob")).toBe(true);
-    expect(messageMatchesSearch(message, named, "0xb0b")).toBe(true);
-  });
-});
diff --git a/src/components/mail/ConversationList.tsx b/src/components/mail/ConversationList.tsx
deleted file mode 100644
index b5a8ee2..0000000
--- a/src/components/mail/ConversationList.tsx
+++ /dev/null
@@ -1,414 +0,0 @@
-"use client";
-
-import { memo } from "react";
-import type { AliasRecord } from "@/lib/aliases";
-import { parseBackupPointer } from "@/lib/backup-blob";
-import { decodeBackupSnapshot } from "@/lib/backup-snapshot";
-import { parseCompositePayload } from "@/lib/composite";
-import {
-  formatBaseUnits,
-  parseAcceptPayload,
-  parseDeclinePayload,
-  parseOfferPayload,
-  parsePaymentRequestPayload,
-  parseReceiptPayload,
-} from "@/lib/otc";
-import {
-  parseEscrowClaimPayload,
-  parseEscrowFillPayload,
-  parseEscrowFundPayload,
-  parseEscrowTimeoutPayload,
-} from "@/lib/escrow";
-import {
-  conversationCorrespondent,
-  correspondentHeadline,
-  type ConversationCorrespondent,
-} from "./correspondent";
-import {
-  mailMessageDateTime,
-  mailboxMatchesFilter,
-  mailMessageTimestampMs,
-  type MailboxFilter,
-} from "@/app/inbox/mailbox-model";
-import type { LocalMailMessage } from "./Thread";
-import styles from "./mail.module.css";
-
-export type { MailboxFilter, ConversationCorrespondent };
-export { mailboxMatchesFilter, conversationCorrespondent };
-
-function backupKind(
-  message: LocalMailMessage,
-): "contacts" | "rfq-resume" | null {
-  try {
-    if (message.envelope.type === "backup_snapshot") {
-      return decodeBackupSnapshot(message.envelope.payload).kind;
-    }
-    if (message.envelope.type === "backup_pointer") {
-      return parseBackupPointer(message.envelope.payload).kind;
-    }
-  } catch {
-    // Malformed backup-shaped records remain visibly unsupported.
-  }
-  return null;
-}
-
-function envelopeLabel(message: LocalMailMessage): string {
-  switch (message.envelope.type) {
-    case "text":
-      return "Letter";
-    case "offer":
-      return "Deal";
-    case "accept":
-      return "Memo";
-    case "decline":
-      return "Declined";
-    case "receipt":
-      return "Receipt";
-    case "payment_request":
-      return "Invoice";
-    case "escrow_fund":
-      return "Escrow";
-    case "escrow_fill":
-      return "Escrow fill";
-    case "escrow_claim":
-      return "Escrow claim";
-    case "escrow_timeout":
-      return "Escrow timeout";
-    case "contact_snapshot":
-      return "Contact backup";
-    case "backup_snapshot":
-    case "backup_pointer": {
-      const kind = backupKind(message);
-      return kind === "contacts"
-        ? "Contact backup"
-        : kind === "rfq-resume"
-          ? "RFQ history backup"
-          : "Unsupported";
-    }
-    case "composite": {
-      const composite = parseCompositePayload(message.envelope.payload);
-      const count = composite?.attachments.length ?? 0;
-      return count
-        ? `Document · ${count} attachment${count === 1 ? "" : "s"}`
-        : "Document";
-    }
-    default:
-      return "Unsupported";
-  }
-}
-
-/* The row already carries a type badge, so the preview line spends itself on
-   the terms instead of repeating the word underneath it. */
-const UNREADABLE_PAYLOAD = "Payload could not be read";
-
-function amount(value: {
-  token: { symbol: string; decimals: number };
-  amount: string;
-}): string {
-  return `${formatBaseUnits(value.amount, value.token.decimals)} ${value.token.symbol}`;
-}
-
-function messagePreview(message: LocalMailMessage): string {
-  const payload =
-    message.envelope.type === "unsupported" ? null : message.envelope.payload;
-  switch (message.envelope.type) {
-    case "text": {
-      const body = message.plaintext.replace(/\s+/g, " ").trim();
-      return body || "Empty decrypted letter";
-    }
-    case "offer": {
-      const offer = parseOfferPayload(payload);
-      return offer
-        ? `${amount(offer.give)} for ${amount(offer.want)}`
-        : UNREADABLE_PAYLOAD;
-    }
-    case "accept": {
-      const accept = parseAcceptPayload(payload);
-      return accept
-        ? `${amount(accept.transfer)} to settle`
-        : UNREADABLE_PAYLOAD;
-    }
-    case "decline":
-      return parseDeclinePayload(payload)?.reason || "No reason given";
-    case "receipt":
-      return parseReceiptPayload(payload)
-        ? "Claims a transfer landed"
-        : UNREADABLE_PAYLOAD;
-    case "payment_request": {
-      const request = parsePaymentRequestPayload(payload);
-      return request ? `${amount(request)} requested` : UNREADABLE_PAYLOAD;
-    }
-    case "escrow_fund": {
-      const fund = parseEscrowFundPayload(payload);
-      return fund
-        ? `${amount(fund.legA)} against ${amount(fund.legB)}`
-        : UNREADABLE_PAYLOAD;
-    }
-    case "escrow_fill":
-      return parseEscrowFillPayload(payload)
-        ? "Counterparty filled the deal"
-        : UNREADABLE_PAYLOAD;
-    case "escrow_claim":
-      return parseEscrowClaimPayload(payload)
-        ? "Counterparty claimed the escrow"
-        : UNREADABLE_PAYLOAD;
-    case "escrow_timeout":
-      return parseEscrowTimeoutPayload(payload)
-        ? "Escrow timed out and was refunded"
-        : UNREADABLE_PAYLOAD;
-    case "contact_snapshot":
-      return "Wallet + mailbox recovery phrase required";
-    case "backup_snapshot":
-    case "backup_pointer": {
-      const kind = backupKind(message);
-      return kind === "contacts"
-        ? "Wallet + mailbox recovery phrase required"
-        : kind === "rfq-resume"
-          ? "Verification-only RFQ history"
-          : "Unsupported decrypted record";
-    }
-    case "composite": {
-      const composite = parseCompositePayload(payload);
-      if (!composite) return "Unsupported composite document";
-      const body = composite.body.replace(/\s+/g, " ").trim();
-      if (body) return body;
-      return composite.attachments
-        .map((attachment) =>
-          attachment.type === "payment_request"
-            ? "Invoice"
-            : attachment.type === "escrow_fund"
-              ? "Escrow"
-              : attachment.type === "offer"
-                ? "Offer"
-                : "Payment",
-        )
-        .join(" + ");
-    }
-    default:
-      return "Unsupported decrypted record";
-  }
-}
-
-function messageTime(message: LocalMailMessage): {
-  label: string;
-  dateTime?: string;
-} {
-  const dateTime = mailMessageDateTime(message);
-  const milliseconds = mailMessageTimestampMs(message);
-  if (milliseconds === undefined) return { label: "—" };
-  const date = new Date(milliseconds);
-  const today = new Date();
-  if (date.toDateString() === today.toDateString()) {
-    return {
-      label: new Intl.DateTimeFormat(undefined, {
-        hour: "2-digit",
-        minute: "2-digit",
-      }).format(date),
-      dateTime,
-    };
-  }
-  return {
-    label: new Intl.DateTimeFormat(undefined, {
-      month: "short",
-      day: "numeric",
-    }).format(date),
-    dateTime,
-  };
-}
-
-type ConversationListProps = {
-  messages: LocalMailMessage[];
-  selectedMessageId: string | null;
-  readMessageIds: ReadonlySet<string>;
-  aliases: AliasRecord[];
-  selfAddress: string;
-  folderLabel: string;
-  filterLabel: string;
-  search?: string;
-  onSearchChange?: (value: string) => void;
-  /** What is blocking this mailbox, so the rail answers what the page answers. */
-  gate?: "wallet" | "key" | null;
-  onSelect: (messageId: string) => void;
-};
-
-/**
- * Searching happens here, over what this device already decrypted: the
- * correspondent, the preview, the record type and the record index. Nothing
- * about a query leaves the browser, and sealed rows stay searchable by the
- * plaintext only this device holds.
- */
-export function messageMatchesSearch(
-  message: LocalMailMessage,
-  correspondent: ConversationCorrespondent,
-  query: string,
-): boolean {
-  const needle = query.trim().toLowerCase();
-  if (!needle) return true;
-  const haystack = [
-    correspondent.primary,
-    correspondent.detail ?? "",
-    correspondent.fullAddress ?? "",
-    envelopeLabel(message),
-    messagePreview(message),
-    message.index,
-    ...(message.recipients ?? []),
-  ]
-    .join(" ")
-    .toLowerCase();
-  return haystack.includes(needle);
-}
-
-function ConversationList({
-  messages,
-  selectedMessageId,
-  readMessageIds,
-  aliases,
-  selfAddress,
-  folderLabel,
-  filterLabel,
-  search = "",
-  onSearchChange,
-  gate = null,
-  onSelect,
-}: ConversationListProps) {
-  const rows = messages.map((message) => ({
-    message,
-    correspondent: conversationCorrespondent(message, aliases, selfAddress),
-  }));
-  const visible = search.trim()
-    ? rows.filter((row) =>
-        messageMatchesSearch(row.message, row.correspondent, search),
-      )
-    : rows;
-  return (
-    <section className={styles.conversationRail} aria-label="Message list">
-      <header className={styles.railHeading}>
-        <div>
-          <p className={styles.kicker}>{filterLabel.toUpperCase()}</p>
-          <h1>{folderLabel}</h1>
-        </div>
-        <span className={styles.messageTotal}>{visible.length}</span>
-      </header>
-
-      {onSearchChange && messages.length ? (
-        <div className={styles.railSearch}>
-          <input
-            type="search"
-            value={search}
-            placeholder="Search opened mail"
-            aria-label="Search opened mail"
-            onChange={(event) => onSearchChange(event.target.value)}
-          />
-        </div>
-      ) : null}
-
-      {messages.length ? (
-        <div className={styles.railPrivacyNote}>
-          <strong>Local browser index—not encrypted at rest</strong>
-          <span>
-            Opened state and search stay on this device. Sealed rows carry no
-            public sender.
-          </span>
-        </div>
-      ) : null}
-
-      {visible.length ? (
-        <ol className={styles.conversationList}>
-          {visible.map(({ message, correspondent }) => {
-            const selected = selectedMessageId === message.id;
-            const unread =
-              message.direction !== "outgoing" &&
-              !readMessageIds.has(message.id);
-            const posted = messageTime(message);
-            const preview = messagePreview(message);
-            const kind = envelopeLabel(message);
-            return (
-              <li key={message.id}>
-                <button
-                  className={`${styles.conversationItem} ${
-                    selected ? styles.conversationItemActive : ""
-                  }`}
-                  type="button"
-                  aria-current={selected ? "true" : undefined}
-                  aria-label={`${unread ? "Unread. " : ""}${correspondent.primary}. ${kind}. ${preview}`}
-                  onClick={() => onSelect(message.id)}
-                >
-                  <span className={styles.conversationTopline}>
-                    <span className={styles.correspondentIdentity}>
-                      <strong title={correspondent.fullAddress}>
-                        <bdi>{correspondentHeadline(correspondent)}</bdi>
-                      </strong>
-                      {correspondent.detail ? (
-                        <small>{correspondent.detail}</small>
-                      ) : null}
-                    </span>
-                    <time dateTime={posted.dateTime}>{posted.label}</time>
-                  </span>
-                  <span className={styles.conversationPreview}>{preview}</span>
-                  <span className={styles.conversationMeta}>
-                    <em className={styles.typeBadge}>{kind}</em>
-                    {message.direction === "outgoing" ? (
-                      <em className={styles.provenanceBadge}>Sent</em>
-                    ) : null}
-                    {message.direction === "outgoing" ? null : (
-                      <span
-                        className={
-                          unread ? styles.unreadIndicator : styles.readIndicator
-                        }
-                      >
-                        {unread ? "● UNREAD" : "OPENED"}
-                      </span>
-                    )}
-                  </span>
-                </button>
-              </li>
-            );
-          })}
-        </ol>
-      ) : (
-        <div className={styles.railEmptyState}>
-          <span className={styles.emptyEnvelope} aria-hidden="true">
-            {search.trim() ? "⌕" : "✉"}
-          </span>
-          {search.trim() ? (
-            <>
-              <strong>No opened record matches</strong>
-              <span>
-                Search reads only what this device has already decrypted. Check
-                for new mail to widen it.
-              </span>
-            </>
-          ) : gate ? (
-            <>
-              <strong>
-                {gate === "wallet" ? "Wallet required" : "Mailbox key required"}
-              </strong>
-              <span>
-                {gate === "wallet"
-                  ? "This mailbox is keyed to a wallet. Connect one to open it."
-                  : "Set up a mailbox key to open and decrypt records."}
-              </span>
-            </>
-          ) : (
-            <>
-              <strong>
-                {filterLabel === "All" || filterLabel === "All types"
-                  ? "Nothing here yet"
-                  : `No ${filterLabel.toLowerCase()} yet`}
-              </strong>
-              <span>
-                {folderLabel === "Sent"
-                  ? "Sent copies live only on this device. Write a message to create one."
-                  : folderLabel === "Inbox"
-                    ? "Check for new mail, or write a message."
-                    : "Choose another mailbox, or write a message."}
-              </span>
-            </>
-          )}
-        </div>
-      )}
-    </section>
-  );
-}
-
-export default memo(ConversationList);
diff --git a/src/components/mail/DraftList.tsx b/src/components/mail/DraftList.tsx
deleted file mode 100644
index b8a38b2..0000000
--- a/src/components/mail/DraftList.tsx
+++ /dev/null
@@ -1,149 +0,0 @@
-"use client";
-
-import { memo } from "react";
-import type { CompositeDraft } from "@/lib/drafts";
-import { shortenFelt } from "./correspondent";
-import styles from "./mail.module.css";
-
-function draftTime(milliseconds: number): { label: string; dateTime: string } {
-  const date = new Date(milliseconds);
-  let dateTime = "";
-  try {
-    dateTime = date.toISOString();
-  } catch {
-    dateTime = "";
-  }
-  const today = new Date();
-  if (date.toDateString() === today.toDateString()) {
-    return {
-      label: new Intl.DateTimeFormat(undefined, {
-        hour: "2-digit",
-        minute: "2-digit",
-      }).format(date),
-      dateTime,
-    };
-  }
-  return {
-    label: new Intl.DateTimeFormat(undefined, {
-      month: "short",
-      day: "numeric",
-    }).format(date),
-    dateTime,
-  };
-}
-
-function preview(draft: CompositeDraft): string {
-  const body = draft.body.replace(/\s+/g, " ").trim();
-  if (body) return body;
-  if (draft.attachments.length) {
-    return draft.attachments
-      .map((attachment) =>
-        attachment.type === "payment_request"
-          ? "Invoice"
-          : attachment.type === "escrow_fund"
-            ? "Escrow"
-            : attachment.type === "offer"
-              ? "Offer"
-              : "Payment",
-      )
-      .join(" + ");
-  }
-  return "Blank document";
-}
-
-type DraftListProps = {
-  drafts: CompositeDraft[];
-  selectedDraftId: string | null;
-  filterLabel: string;
-  onSelect: (draftId: string) => void;
-  onDelete: (draftId: string) => void;
-};
-
-function DraftList({
-  drafts,
-  selectedDraftId,
-  filterLabel,
-  onSelect,
-  onDelete,
-}: DraftListProps) {
-  return (
-    <section className={styles.conversationRail} aria-label="Draft list">
-      <header className={styles.railHeading}>
-        <div>
-          <p className={styles.kicker}>DEVICE-PRIVATE</p>
-          <h1>Drafts</h1>
-        </div>
-        <span className={styles.messageTotal}>{drafts.length}</span>
-      </header>
-      <div className={styles.railPrivacyNote}>
-        <strong>Local only</strong>
-        <span>
-          Drafts are stored in this browser profile. They are never uploaded or
-          included in mailbox scans.
-        </span>
-      </div>
-      {drafts.length ? (
-        <ol className={styles.conversationList}>
-          {drafts.map((draft) => {
-            const posted = draftTime(draft.updatedAt);
-            return (
-              <li key={draft.id} className={styles.draftListItem}>
-                <button
-                  className={`${styles.conversationItem} ${
-                    selectedDraftId === draft.id
-                      ? styles.conversationItemActive
-                      : ""
-                  }`}
-                  type="button"
-                  aria-current={
-                    selectedDraftId === draft.id ? "true" : undefined
-                  }
-                  onClick={() => onSelect(draft.id)}
-                >
-                  <span className={styles.conversationTopline}>
-                    <strong title={draft.recipient.trim() || undefined}>
-                      <bdi>
-                        {shortenFelt(draft.recipient) || "No recipient"}
-                      </bdi>
-                    </strong>
-                    <time dateTime={posted.dateTime}>{posted.label}</time>
-                  </span>
-                  <span className={styles.conversationPreview}>
-                    {preview(draft)}
-                  </span>
-                  <span className={styles.conversationMeta}>
-                    <em className={styles.typeBadge}>
-                      {draft.attachments.length
-                        ? `${draft.attachments.length} attachment${
-                            draft.attachments.length === 1 ? "" : "s"
-                          }`
-                        : "Letter"}
-                    </em>
-                  </span>
-                </button>
-                <button
-                  className={styles.draftDelete}
-                  type="button"
-                  onClick={() => onDelete(draft.id)}
-                  aria-label={`Delete draft to ${draft.recipient || "no recipient"}`}
-                >
-                  Delete…
-                </button>
-              </li>
-            );
-          })}
-        </ol>
-      ) : (
-        <div className={styles.railEmptyState}>
-          <span className={styles.emptyEnvelope} aria-hidden="true">
-            ✎
-          </span>
-          <strong>No {filterLabel.toLowerCase()} drafts</strong>
-          <span>Compose to start a device-private document.</span>
-        </div>
-      )}
-    </section>
-  );
-}
-
-export default memo(DraftList);
diff --git a/src/components/mail/MemoCard.tsx b/src/components/mail/MemoCard.tsx
new file mode 100644
index 0000000..085b1e4
--- /dev/null
+++ b/src/components/mail/MemoCard.tsx
@@ -0,0 +1,92 @@
+import { formatBaseUnits, type AcceptPayload, type DeclinePayload } from "@/lib/otc";
+import styles from "./mail.module.css";
+
+export type MemoCardProps =
+  | { kind: "accept"; accept: AcceptPayload; isPayment: boolean }
+  | { kind: "decline"; decline: DeclinePayload }
+  | {
+      kind: "escrow";
+      operation: "fill" | "claim" | "timeout";
+      update: { dealId: string };
+    };
+
+/**
+ * A counterparty's answer to a deal: an accept or payment memo, a decline,
+ * or an escrow notice. Each is a coordination claim carried by encrypted
+ * mail, never proof that value moved or that a contract changed state.
+ */
+export default function MemoCard(props: MemoCardProps) {
+  if (props.kind === "accept") {
+    const { accept, isPayment } = props;
+    const amount = formatBaseUnits(
+      accept.transfer.amount,
+      accept.transfer.token.decimals,
+    );
+    return (
+      <article
+        className={styles.messageSheet}
+        aria-label={`${isPayment ? "Payment memo" : "OTC accept memo"}: ${amount} ${accept.transfer.token.symbol}`}
+      >
+        <div className={styles.sheetHeading}>
+          <h3 className={styles.sheetType}>
+            {isPayment ? "PAYMENT MEMO" : "OTC ACCEPT MEMO"}
+          </h3>
+          <span className={styles.proofStamp}>Unverified counterparty claim</span>
+        </div>
+        <p className={styles.termsSentence}>
+          A counterparty claims they sent {amount}{" "}
+          <bdi>{accept.transfer.token.symbol}</bdi> for{" "}
+          {isPayment ? "request" : "deal"} {accept.dealId.slice(0, 12)}…
+        </p>
+        <p className={styles.riskCopy}>
+          This decrypted memo and its MessagePosted transaction do not prove
+          that value moved. Verify settlement independently before releasing
+          any quoted consideration.
+        </p>
+      </article>
+    );
+  }
+  if (props.kind === "decline") {
+    const { decline } = props;
+    return (
+      <article
+        className={styles.messageSheet}
+        aria-label={`OTC response: deal ${decline.dealId.slice(0, 12)} declined`}
+      >
+        <div className={styles.sheetHeading}>
+          <h3 className={styles.sheetType}>OTC RESPONSE</h3>
+          <span className={styles.proofStamp}>Declined</span>
+        </div>
+        <p className={styles.termsSentence}>
+          Deal {decline.dealId.slice(0, 12)}… was declined.
+        </p>
+        {decline.reason ? (
+          <p className={styles.offerNote}>
+            <bdi>{decline.reason}</bdi>
+          </p>
+        ) : null}
+      </article>
+    );
+  }
+  const { operation, update } = props;
+  const label = operation.toUpperCase();
+  return (
+    <article
+      className={styles.messageSheet}
+      aria-label={`Escrow ${operation} notice for deal ${update.dealId.slice(0, 12)}`}
+    >
+      <div className={styles.sheetHeading}>
+        <h3 className={styles.sheetType}>ESCROW {label} NOTICE</h3>
+        <span className={styles.proofStamp}>Unverified coordination memo</span>
+      </div>
+      <p className={styles.termsSentence}>
+        A counterparty posted an encrypted {operation} notice for deal{" "}
+        {update.dealId.slice(0, 12)}…
+      </p>
+      <p className={styles.riskCopy}>
+        This message does not prove a state transition. The escrow contract is
+        read before another asset action is offered.
+      </p>
+    </article>
+  );
+}
diff --git a/src/components/mail/Thread.tsx b/src/components/mail/Thread.tsx
deleted file mode 100644
index afcf2a2..0000000
--- a/src/components/mail/Thread.tsx
+++ /dev/null
@@ -1,891 +0,0 @@
-"use client";
-
-import { useEffect, useRef, useState } from "react";
-import {
-  parseCompositePayload,
-  type CompositeAttachment,
-} from "@/lib/composite";
-import type { DecodedMail } from "@/lib/envelope";
-import { parseBackupPointer } from "@/lib/backup-blob";
-import { decodeBackupSnapshot } from "@/lib/backup-snapshot";
-import type { EncryptedMailRecord } from "@/lib/mail";
-import { MAIL_SIGNATURE_VERIFICATION_LIMIT_NOTICE } from "@/lib/mail-authority-copy";
-import { publicRecipientCount } from "@/lib/mail-recipient-count";
-import type { AliasRecord } from "@/lib/aliases";
-import { findAliasByAddress } from "@/lib/aliases";
-import { feltEquals } from "@/lib/addresses";
-import type { PaymentLinkAuthenticity } from "@/lib/payment-link";
-import {
-  formatBaseUnits,
-  invoicePaymentMaturity,
-  parseAcceptPayload,
-  parseDeclinePayload,
-  parseOfferPayload,
-  parsePaymentRequestPayload,
-  parseReceiptPayload,
-  receiptForTransfer,
-  type OfferPayload,
-  type OtcState,
-  type PaymentRequestPayload,
-} from "@/lib/otc";
-import {
-  contractDealMatchesFund,
-  parseEscrowClaimPayload,
-  parseEscrowFillPayload,
-  parseEscrowFundPayload,
-  parseEscrowTimeoutPayload,
-  type EscrowFundPayload,
-  type EscrowState,
-} from "@/lib/escrow";
-import AddressBookField from "@/components/address-book/AddressBookField";
-import ContactSnapshotCard from "./ContactSnapshotCard";
-import EscrowCard from "./EscrowCard";
-import InvoiceCard from "./InvoiceCard";
-import OfferCard from "./OfferCard";
-import ReceiptCard from "./ReceiptCard";
-import { replyAddressForConversation } from "@/lib/mail-correspondents";
-import type { MailAssignment } from "@/lib/mail-assignments";
-import {
-  conversationFieldsFromPayload,
-  conversationKeyForMessage,
-} from "@/lib/mail-thread";
-import { senderProofLabel, type SenderProof } from "@/lib/sender-proof";
-import {
-  conversationCorrespondent,
-  correspondentHeadline,
-} from "./correspondent";
-import styles from "./mail.module.css";
-
-export type LocalMailMessage = {
-  id: string;
-  index: string;
-  plaintext: string;
-  envelope: DecodedMail;
-  record: EncryptedMailRecord;
-  transactionHash: string;
-  transactionHashes?: string[];
-  deliveryState?: "confirmed" | "partially_confirmed";
-  documentId?: string;
-  blockNumber?: number;
-  blockTimestamp?: number;
-  eventIndex?: number;
-  direction?: "incoming" | "outgoing";
-  /** Request imported from /pay; it has no MessagePosted evidence. */
-  transport?: "payment_link";
-  /** Authenticity verified from the original payment-link fragment. */
-  linkAuthenticity?: PaymentLinkAuthenticity;
-  recipientCount?: number;
-  /** Device-local Sent recipients. Never inferred from sealed incoming mail. */
-  recipients?: string[];
-  /** Set for locally sent mail so it sorts before the chain confirms a timestamp. */
-  localCreatedAt?: number;
-  localConversationId?: string;
-  assignedAddress?: string;
-  /** Thread-only merge of the local Sent projection and its decrypted event. */
-  threadProvenance?: "device_sent_and_on_chain";
-};
-
-export type ThreadActionState = {
-  pending: boolean;
-  message?: string;
-  startedAt?: number;
-};
-
-type ThreadProps = {
-  messages: LocalMailMessage[];
-  focusVersion?: number;
-  selfAddress: string;
-  aliases: AliasRecord[];
-  otcState: OtcState;
-  escrowState: EscrowState;
-  actionStates: Record<string, ThreadActionState>;
-  onAccept: (offer: OfferPayload, offerIndex?: number) => void;
-  onDecline: (offer: OfferPayload) => void;
-  onPostReceipt: (offer: OfferPayload) => void;
-  onPay: (request: PaymentRequestPayload) => void;
-  onPayPrivatelyWithStrk?: (request: PaymentRequestPayload) => void;
-  invoiceMaturityHeadBlock?: number;
-  onEscrowFill: (fund: EscrowFundPayload) => void;
-  onEscrowClaim?: (fund: EscrowFundPayload) => void;
-  onEscrowTimeout?: (fund: EscrowFundPayload) => void;
-  onRestoreContacts?: (payload: unknown, message: LocalMailMessage) => void;
-  onRestoreBackup?: (payload: unknown, message: LocalMailMessage) => void;
-  contactRestorePending?: boolean;
-  backupRestorePending?: boolean;
-  onReply?: (input: {
-    address?: string;
-    conversationId: string;
-    inReplyTo: string;
-  }) => void;
-  onAssign?: (messageId: string, address: string) => void;
-  onProve?: (messageId: string, address: string) => void;
-  assignments?: Record<string, MailAssignment>;
-  proofs?: Record<string, SenderProof>;
-};
-
-function safeOfferIndex(index: string): number | undefined {
-  const value = Number(index);
-  return Number.isSafeInteger(value) && value >= 0 ? value : undefined;
-}
-
-function UnsupportedMessage() {
-  return (
-    <article className={styles.messageSheet} aria-label="Unsupported message">
-      <h3 className={styles.sheetType}>UNSUPPORTED</h3>
-      <p className={styles.termsSentence}>unsupported message</p>
-    </article>
-  );
-}
-
-const CIPHERTEXT_PREVIEW_FELTS = 4;
-
-type CopyState = "idle" | "copied" | "error";
-
-function isoBlockTimestamp(timestamp: number | undefined): string | null {
-  if (timestamp === undefined) return null;
-  try {
-    const value = new Date(timestamp * 1_000).toISOString();
-    return value;
-  } catch {
-    return null;
-  }
-}
-
-export function ChainRecordPanel({ message }: { message: LocalMailMessage }) {
-  const [copyState, setCopyState] = useState<CopyState>("idle");
-  const { record } = message;
-  const timestamp = isoBlockTimestamp(message.blockTimestamp);
-  const recipientCount =
-    message.recipientCount ?? publicRecipientCount(message.record);
-  const preview = record.ciphertextFelts.slice(0, CIPHERTEXT_PREVIEW_FELTS);
-  const hiddenFeltCount = record.ciphertextFelts.length - preview.length;
-
-  async function copyAllCiphertext() {
-    try {
-      await navigator.clipboard.writeText(
-        JSON.stringify(record.ciphertextFelts),
-      );
-      setCopyState("copied");
-    } catch {
-      setCopyState("error");
-    }
-  }
-
-  return (
-    <details className={styles.chainDisclosure}>
-      <summary>
-        <span>What the chain sees</span>
-        <span className={styles.chainToggleHint}>PUBLIC EVIDENCE</span>
-      </summary>
-      <aside
-        className={styles.chainRecord}
-        aria-label={`Public on-chain record for message ${message.index}`}
-      >
-        <div className={styles.chainRecordHeading}>
-          <div>
-            <span className={styles.chainEyebrow}>MESSAGEPOSTED / PUBLIC</span>
-            <h3>Opaque event data</h3>
-          </div>
-          <span className={styles.chainEvidenceBadge}>ON-CHAIN EVIDENCE</span>
-        </div>
-
-        <dl className={styles.chainFields}>
-          <div className={styles.chainField}>
-            <dt>Message index</dt>
-            <dd>
-              <code>{message.index}</code>
-            </dd>
-          </div>
-          <div className={styles.chainField}>
-            <dt>Recipient count</dt>
-            <dd>
-              <code>{recipientCount}</code>
-              <small>PUBLIC FORMAT METADATA</small>
-            </dd>
-          </div>
-          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
-            <dt>Transaction hash</dt>
-            <dd>
-              <code>{message.transactionHash}</code>
-            </dd>
-          </div>
-          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
-            <dt>Block timestamp</dt>
-            <dd>
-              {timestamp && message.blockTimestamp !== undefined ? (
-                <>
-                  <time dateTime={timestamp}>{timestamp}</time>
-                  <small>UNIX {message.blockTimestamp}</small>
-                </>
-              ) : (
-                <span className={styles.sealedValue}>NOT AVAILABLE</span>
-              )}
-            </dd>
-          </div>
-          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
-            <dt>Ephemeral public key</dt>
-            <dd className={styles.feltPair}>
-              {record.ephemeralPub.map((felt, index) => (
-                <code key={`${index}:${felt}`}>{felt}</code>
-              ))}
-            </dd>
-          </div>
-          <div className={styles.chainField}>
-            <dt>View tag</dt>
-            <dd>
-              <code>
-                {record.viewTag} / 0x
-                {record.viewTag.toString(16).padStart(2, "0")}
-              </code>
-            </dd>
-          </div>
-          <div className={styles.chainField}>
-            <dt>Nonce</dt>
-            <dd className={styles.feltPair}>
-              {record.nonce.map((felt, index) => (
-                <code key={`${index}:${felt}`}>{felt}</code>
-              ))}
-            </dd>
-          </div>
-          <div className={`${styles.chainField} ${styles.chainFieldWide}`}>
-            <dt>Ciphertext felts</dt>
-            <dd>
-              <ol className={styles.ciphertextPreview}>
-                {preview.map((felt, index) => (
-                  <li key={`${index}:${felt}`}>
-                    <span>{index.toString().padStart(2, "0")}</span>
-                    <code>{felt}</code>
-                  </li>
-                ))}
-                {hiddenFeltCount > 0 ? (
-                  <li className={styles.truncatedFelts}>
-                    … {hiddenFeltCount} more felt
-                    {hiddenFeltCount === 1 ? "" : "s"} in the public record
-                  </li>
-                ) : null}
-              </ol>
-              <div className={styles.ciphertextActions}>
-                <span>
-                  {record.ciphertextFelts.length} FELT
-                  {record.ciphertextFelts.length === 1 ? "" : "S"} TOTAL
-                </span>
-                <button
-                  className={styles.chainCopyButton}
-                  type="button"
-                  onClick={copyAllCiphertext}
-                >
-                  {copyState === "copied"
-                    ? "Copied all"
-                    : copyState === "error"
-                      ? "Copy failed"
-                      : `Copy all ${record.ciphertextFelts.length}`}
-                </button>
-              </div>
-              <span className={styles.copyStatus} aria-live="polite">
-                {copyState === "copied"
-                  ? "Complete ciphertext JSON copied."
-                  : copyState === "error"
-                    ? "Clipboard access was denied."
-                    : ""}
-              </span>
-            </dd>
-          </div>
-        </dl>
-
-        <div className={styles.absentFields}>
-          <span>
-            <b>Sender address</b>
-            <code>ABSENT</code>
-          </span>
-          <span>
-            <b>Recipient identities</b>
-            <code>ABSENT</code>
-          </span>
-        </div>
-        <p className={styles.addressAbsence}>
-          Recipient count is public in the ciphertext format. No sender or
-          recipient address appears anywhere in this MessagePosted record.
-        </p>
-      </aside>
-    </details>
-  );
-}
-
-/**
- * What belongs to the conversation rather than to one envelope: naming its
- * sender, and the reason a reply cannot prefill a recipient. Both used to
- * render once per record, so a five-record thread carried five naming forms.
- */
-function ConversationNaming({
-  messages,
-  selfAddress,
-  responseAddress,
-  canReply,
-  onAssign,
-}: {
-  messages: LocalMailMessage[];
-  selfAddress: string;
-  responseAddress?: string;
-  canReply: boolean;
-  onAssign?: ThreadProps["onAssign"];
-}) {
-  const target = messages.find((message) => message.direction !== "outgoing");
-  const assigned = target?.assignedAddress;
-  const [assignInput, setAssignInput] = useState(assigned ?? "");
-  if (!target || !onAssign) return null;
-  return (
-    <div className={styles.conversationActions}>
-      {canReply && !responseAddress ? (
-        <p className={styles.conversationActionsNote}>
-          A reply cannot prefill a recipient: the sender is sealed and this
-          conversation has no device-local recipient or name yet. Name the
-          sender below, or supply the address in the draft.
-        </p>
-      ) : null}
-      <details className={styles.assignDisclosure}>
-        <summary>Name this sender on this device</summary>
-        <form
-          onSubmit={(event) => {
-            event.preventDefault();
-            if (assignInput.trim()) onAssign(target.id, assignInput);
-          }}
-        >
-          <AddressBookField
-            selfAddress={selfAddress ?? ""}
-            inputAriaLabel="Name this sender"
-            label="Name this sender"
-            value={assignInput}
-            onChange={setAssignInput}
-            placeholder="0x… or saved label"
-            hint="Applies to every record in this conversation on this device. A saved counterparty shows its label; the name is never authentication."
-          />
-          <button type="submit">Save name</button>
-        </form>
-      </details>
-    </div>
-  );
-}
-
-/** What belongs to one record: how it identifies itself, and its own claim. */
-function RecordControls({
-  message,
-  proof,
-  onProve,
-}: {
-  message: LocalMailMessage;
-  proof?: SenderProof;
-  onProve?: ThreadProps["onProve"];
-}) {
-  const fields = conversationFieldsFromPayload(
-    message.envelope.type,
-    message.envelope.type === "unsupported" ? null : message.envelope.payload,
-  );
-  const assigned = message.assignedAddress;
-  if (!proof && !fields.conversationId && !(assigned && onProve)) return null;
-  return (
-    <div className={styles.replyRow}>
-      {proof ? <p>{senderProofLabel(proof)}</p> : null}
-      {fields.conversationId ? (
-        <span>Conversation tag {fields.conversationId.slice(0, 18)}…</span>
-      ) : null}
-      {assigned && onProve ? (
-        <button type="button" onClick={() => onProve(message.id, assigned)}>
-          Inspect unbound auth claim
-        </button>
-      ) : null}
-    </div>
-  );
-}
-
-export default function Thread({
-  messages,
-  focusVersion = 0,
-  selfAddress,
-  aliases,
-  otcState,
-  escrowState,
-  actionStates,
-  onAccept,
-  onDecline,
-  onPostReceipt,
-  onPay,
-  onPayPrivatelyWithStrk,
-  invoiceMaturityHeadBlock,
-  onEscrowFill,
-  onEscrowClaim,
-  onEscrowTimeout,
-  onRestoreContacts,
-  onRestoreBackup,
-  contactRestorePending = false,
-  backupRestorePending = false,
-  onReply,
-  onAssign,
-  onProve,
-  proofs = {},
-}: ThreadProps) {
-  const headingRef = useRef<HTMLHeadingElement>(null);
-  const conversationAddress =
-    replyAddressForConversation(messages, selfAddress) ?? undefined;
-
-  /* The head names what is open. "Correspondence" was a constant, so the pane
-     never said which record you were reading; the rail's identity is reused
-     verbatim so both panes call the same counterparty the same thing. */
-  const head = messages.length
-    ? conversationCorrespondent(messages[0], aliases, selfAddress)
-    : null;
-  const headDetail = head
-    ? [
-        head.detail,
-        `${messages.length} record${messages.length === 1 ? "" : "s"}`,
-      ]
-        .filter(Boolean)
-        .join(" · ")
-    : null;
-
-  useEffect(() => {
-    if (!messages.length || focusVersion === 0) return;
-    const frame = requestAnimationFrame(() => headingRef.current?.focus());
-    return () => cancelAnimationFrame(frame);
-  }, [focusVersion, messages.length]);
-
-  function renderEnvelope(message: LocalMailMessage) {
-    const { envelope } = message;
-    const headingId = `message-${message.id.replace(/[^a-zA-Z0-9_-]/g, "-")}-${envelope.type}`;
-    if (envelope.type === "unsupported") return <UnsupportedMessage />;
-
-    if (envelope.type === "composite") {
-      const composite = parseCompositePayload(envelope.payload);
-      if (!composite) return <UnsupportedMessage />;
-      function renderAttachment(
-        attachment: CompositeAttachment,
-        attachmentIndex: number,
-      ) {
-        if (attachment.type === "payment") {
-          return (
-            <ReceiptCard
-              key={`${attachment.type}:${attachmentIndex}`}
-              receipt={receiptForTransfer(
-                attachment.payload.dealId,
-                attachment.payload.transfer,
-                message.transactionHash,
-              )}
-              standalonePayment
-              locallySubmitted={message.direction === "outgoing"}
-            />
-          );
-        }
-        const type = attachment.type;
-        return (
-          <div key={`${type}:${attachmentIndex}`}>
-            {renderEnvelope({
-              ...message,
-              plaintext: "",
-              envelope: {
-                version: 1,
-                type,
-                payload: attachment.payload,
-                bytes: envelope.bytes,
-              },
-            })}
-          </div>
-        );
-      }
-      return (
-        <article
-          className={styles.compositeDocument}
-          aria-labelledby={headingId}
-        >
-          <div className={styles.sheetHeading}>
-            <h3 id={headingId} className={styles.sheetType}>
-              COMPOSITE DOCUMENT
-            </h3>
-            <span className={styles.proofStamp}>
-              {composite.attachments.length} attachment
-              {composite.attachments.length === 1 ? "" : "s"}
-            </span>
-          </div>
-          {composite.body ? (
-            <p className={styles.letterBody}>{composite.body}</p>
-          ) : (
-            <p className={styles.emptyDocumentBody}>No message body</p>
-          )}
-          <div className={styles.compositeCardStack}>
-            {composite.attachments.map(renderAttachment)}
-          </div>
-        </article>
-      );
-    }
-
-    if (envelope.type === "text") {
-      /* Recipient count and the sealed-identity caveat are not repeated here:
-         the message meta row above carries the count, and "What the chain sees"
-         below states the absence once, where the public record is shown. */
-      return (
-        <article className={styles.messageSheet} aria-labelledby={headingId}>
-          <div className={styles.sheetHeading}>
-            <h3 id={headingId} className={styles.sheetType}>
-              {envelope.version === 0 ? "LEGACY LETTER" : "PRIVATE LETTER"}
-            </h3>
-          </div>
-          <p className={styles.letterBody}>{message.plaintext}</p>
-        </article>
-      );
-    }
-
-    if (envelope.type === "contact_snapshot") {
-      return (
-        <ContactSnapshotCard
-          busy={contactRestorePending}
-          onMerge={
-            onRestoreContacts
-              ? () => onRestoreContacts(envelope.payload, message)
-              : undefined
-          }
-        />
-      );
-    }
-
-    if (
-      envelope.type === "backup_snapshot" ||
-      envelope.type === "backup_pointer"
-    ) {
-      let kind: "contacts" | "rfq-resume";
-      try {
-        kind =
-          envelope.type === "backup_snapshot"
-            ? decodeBackupSnapshot(envelope.payload).kind
-            : parseBackupPointer(envelope.payload).kind;
-      } catch {
-        return <UnsupportedMessage />;
-      }
-      return (
-        <ContactSnapshotCard
-          kind={kind}
-          pointer={envelope.type === "backup_pointer"}
-          busy={backupRestorePending}
-          onMerge={
-            onRestoreBackup
-              ? () => onRestoreBackup(envelope.payload, message)
-              : undefined
-          }
-        />
-      );
-    }
-
-    if (envelope.type === "offer") {
-      const offer = parseOfferPayload(envelope.payload);
-      if (!offer) return <UnsupportedMessage />;
-      const deal = otcState.deals[offer.dealId];
-      const action = actionStates[`deal:${offer.dealId}`];
-      const ownOffer = feltEquals(selfAddress, offer.offerer);
-      return (
-        <OfferCard
-          offer={offer}
-          alias={findAliasByAddress(aliases, offer.offerer)?.label}
-          status={deal?.status}
-          settlementVerified={deal?.settlementVerified}
-          unverifiedClaim={Boolean(
-            deal?.counterpartyAcceptClaim || deal?.counterpartyReceiptClaim,
-          )}
-          busy={action?.pending}
-          actionMessage={action?.message}
-          actionStartedAt={action?.startedAt}
-          onAccept={
-            ownOffer
-              ? undefined
-              : () => onAccept(offer, safeOfferIndex(message.index))
-          }
-          onDecline={ownOffer ? undefined : () => onDecline(offer)}
-          onPostReceipt={
-            ownOffer || deal?.status !== "accepted" || !deal.settlementVerified
-              ? undefined
-              : () => onPostReceipt(offer)
-          }
-        />
-      );
-    }
-
-    if (envelope.type === "accept") {
-      const accept = parseAcceptPayload(envelope.payload);
-      if (!accept) return <UnsupportedMessage />;
-      const isPayment = Boolean(otcState.payments[accept.dealId]);
-      return (
-        <article className={styles.messageSheet} aria-labelledby={headingId}>
-          <div className={styles.sheetHeading}>
-            <h3 id={headingId} className={styles.sheetType}>
-              {isPayment ? "PAYMENT MEMO" : "OTC ACCEPT MEMO"}
-            </h3>
-            <span className={styles.proofStamp}>
-              Unverified counterparty claim
-            </span>
-          </div>
-          <p className={styles.termsSentence}>
-            A counterparty claims they sent{" "}
-            {formatBaseUnits(
-              accept.transfer.amount,
-              accept.transfer.token.decimals,
-            )}{" "}
-            <bdi>{accept.transfer.token.symbol}</bdi> for{" "}
-            {isPayment ? "request" : "deal"} {accept.dealId.slice(0, 12)}…
-          </p>
-          <p className={styles.riskCopy}>
-            This decrypted memo and its MessagePosted transaction do not prove
-            that STRK moved. Verify settlement independently before releasing
-            any quoted consideration.
-          </p>
-        </article>
-      );
-    }
-
-    if (envelope.type === "decline") {
-      const decline = parseDeclinePayload(envelope.payload);
-      if (!decline) return <UnsupportedMessage />;
-      return (
-        <article className={styles.messageSheet} aria-labelledby={headingId}>
-          <div className={styles.sheetHeading}>
-            <h3 id={headingId} className={styles.sheetType}>
-              OTC RESPONSE
-            </h3>
-            <span className={styles.proofStamp}>Declined</span>
-          </div>
-          <p className={styles.termsSentence}>
-            Deal {decline.dealId.slice(0, 12)}… was declined.
-          </p>
-          {decline.reason ? (
-            <p className={styles.offerNote}>
-              <bdi>{decline.reason}</bdi>
-            </p>
-          ) : null}
-        </article>
-      );
-    }
-
-    if (envelope.type === "receipt") {
-      const receipt = parseReceiptPayload(envelope.payload);
-      if (!receipt) return <UnsupportedMessage />;
-      return (
-        <ReceiptCard
-          receipt={receipt}
-          wantSymbol={otcState.deals[receipt.dealId]?.offer.want.token.symbol}
-        />
-      );
-    }
-
-    if (envelope.type === "escrow_fund") {
-      const fund = parseEscrowFundPayload(envelope.payload);
-      if (!fund) return <UnsupportedMessage />;
-      const deal = escrowState.deals[fund.dealId];
-      const action = actionStates[`escrow:${fund.dealId}`];
-      const ownDeal = feltEquals(selfAddress, fund.maker);
-      return (
-        <EscrowCard
-          fund={fund}
-          status={deal?.chainStatus}
-          termsVerified={Boolean(
-            deal?.chainDeal &&
-            deal.chainDeal.status !== "empty" &&
-            contractDealMatchesFund(deal.chainDeal, fund),
-          )}
-          ownDeal={ownDeal}
-          busy={action?.pending}
-          actionMessage={action?.message}
-          actionStartedAt={action?.startedAt}
-          onFill={ownDeal ? undefined : () => onEscrowFill(fund)}
-          onClaim={
-            ownDeal && onEscrowClaim ? () => onEscrowClaim(fund) : undefined
-          }
-          onTimeout={
-            ownDeal && onEscrowTimeout ? () => onEscrowTimeout(fund) : undefined
-          }
-        />
-      );
-    }
-
-    if (
-      envelope.type === "escrow_fill" ||
-      envelope.type === "escrow_claim" ||
-      envelope.type === "escrow_timeout"
-    ) {
-      const update =
-        envelope.type === "escrow_fill"
-          ? parseEscrowFillPayload(envelope.payload)
-          : envelope.type === "escrow_claim"
-            ? parseEscrowClaimPayload(envelope.payload)
-            : parseEscrowTimeoutPayload(envelope.payload);
-      if (!update) return <UnsupportedMessage />;
-      const operation = envelope.type.slice("escrow_".length).toUpperCase();
-      return (
-        <article className={styles.messageSheet} aria-labelledby={headingId}>
-          <div className={styles.sheetHeading}>
-            <h3 id={headingId} className={styles.sheetType}>
-              ESCROW {operation} NOTICE
-            </h3>
-            <span className={styles.proofStamp}>
-              Unverified coordination memo
-            </span>
-          </div>
-          <p className={styles.termsSentence}>
-            A counterparty posted an encrypted {operation.toLowerCase()} notice
-            for deal {update.dealId.slice(0, 12)}…
-          </p>
-          <p className={styles.riskCopy}>
-            This message does not prove a state transition. Mail reads the
-            escrow contract before enabling another asset action.
-          </p>
-        </article>
-      );
-    }
-
-    const request = parsePaymentRequestPayload(envelope.payload);
-    if (!request) return <UnsupportedMessage />;
-    const payment = otcState.payments[request.requestId];
-    const action = actionStates[`payment:${request.requestId}`];
-    const ownRequest = feltEquals(selfAddress, request.requester);
-    const awaitingInvoiceTake =
-      payment?.paymentOperation?.state === "awaiting-note-maturity";
-    const maturity = awaitingInvoiceTake
-      ? (invoicePaymentMaturity(payment, invoiceMaturityHeadBlock ?? 0) ??
-        undefined)
-      : undefined;
-    return (
-      <InvoiceCard
-        request={request}
-        alias={findAliasByAddress(aliases, request.requester)?.label}
-        linkAuthenticity={message.linkAuthenticity}
-        status={payment?.status}
-        paymentVerified={payment?.paymentVerified}
-        unverifiedClaim={Boolean(payment?.counterpartyPaymentClaim)}
-        busy={action?.pending}
-        actionMessage={action?.message}
-        actionStartedAt={action?.startedAt}
-        maturity={maturity}
-        onPay={ownRequest ? undefined : () => onPay(request)}
-        onPayPrivatelyWithStrk={
-          ownRequest || awaitingInvoiceTake || !onPayPrivatelyWithStrk
-            ? undefined
-            : () => onPayPrivatelyWithStrk(request)
-        }
-      />
-    );
-  }
-
-  return (
-    <section className={styles.threadPanel} aria-label="Correspondence">
-      <div className={styles.threadHeading}>
-        <div>
-          <h2
-            ref={headingRef}
-            id="thread-title"
-            tabIndex={-1}
-            title={head?.fullAddress}
-          >
-            {head ? correspondentHeadline(head) : "Correspondence"}
-          </h2>
-          {headDetail ? (
-            <p className={styles.threadHeadDetail}>{headDetail}</p>
-          ) : null}
-        </div>
-      </div>
-
-      <ConversationNaming
-        messages={messages}
-        selfAddress={selfAddress}
-        responseAddress={conversationAddress}
-        canReply={Boolean(onReply)}
-        onAssign={onAssign}
-      />
-
-      {messages.length ? (
-        <ol className={styles.threadList}>
-          {messages.map((message) => {
-            const paymentLink = message.transport === "payment_link";
-            const recipientCount =
-              message.recipientCount ?? publicRecipientCount(message.record);
-            return (
-              <li className={styles.message} key={message.id}>
-                <div className={styles.messageMeta}>
-                  {paymentLink ? (
-                    <>
-                      <span>
-                        {message.linkAuthenticity?.kind === "verified"
-                          ? "Imported from verified Mail-signed payment link"
-                          : "Imported from unverified legacy payment link"}
-                      </span>
-                      <span>No transaction submitted</span>
-                    </>
-                  ) : (
-                    <>
-                      <span>
-                        {message.threadProvenance === "device_sent_and_on_chain"
-                          ? "Sent locally · opened from on-chain evidence"
-                          : message.direction === "outgoing"
-                            ? "Sent"
-                            : "Opened"}
-                        {" · record "}
-                        {message.index}
-                      </span>
-                      <span>
-                        {recipientCount} recipient
-                        {recipientCount === 1 ? "" : "s"}
-                        {message.blockNumber === undefined
-                          ? " · posted"
-                          : ` · block ${message.blockNumber}`}
-                      </span>
-                    </>
-                  )}
-                </div>
-                {paymentLink ? (
-                  <p className={styles.actionWarning} role="status">
-                    {message.linkAuthenticity?.kind === "verified"
-                      ? `${MAIL_SIGNATURE_VERIFICATION_LIMIT_NOTICE} This request came from a URL fragment, not a MessagePosted event, and opening or importing it did not submit a payment.`
-                      : "This unverified legacy request was imported from a URL fragment for local review. It is not a MessagePosted event, cannot authenticate the requester, and opening or importing it did not submit a payment."}
-                  </p>
-                ) : null}
-                <RecordControls
-                  message={message}
-                  proof={proofs[message.id]}
-                  onProve={onProve}
-                />
-                {renderEnvelope(message)}
-                {message.transactionHashes &&
-                message.transactionHashes.length > 1 ? (
-                  <aside className={styles.submissionTransactions}>
-                    <strong>Submission transactions</strong>
-                    {message.transactionHashes.map((transactionHash, index) => (
-                      <code key={`${index}:${transactionHash}`}>
-                        {index + 1}. {transactionHash}
-                      </code>
-                    ))}
-                    <span>
-                      Escrow funding and document delivery are separate because
-                      the pool permits one external invoke per transaction.
-                    </span>
-                  </aside>
-                ) : null}
-                {paymentLink ? null : <ChainRecordPanel message={message} />}
-                {/* Only the two provenances a reader cannot infer from the
-                    pane's own head are worth a line under every record. */}
-                {paymentLink ||
-                message.threadProvenance === "device_sent_and_on_chain" ? (
-                  <span className={styles.localLabel}>
-                    {paymentLink
-                      ? "decoded from this tab's URL fragment"
-                      : "device-local Sent copy matched to decrypted on-chain evidence"}
-                  </span>
-                ) : null}
-              </li>
-            );
-          })}
-        </ol>
-      ) : (
-        <div className={styles.emptyState}>
-          <strong>Select an envelope or start a new letter.</strong>
-          <span>
-            Opened plaintext stays on this device. The proof-teal rail below
-            each sheet shows the public event without inventing a sender.
-          </span>
-        </div>
-      )}
-    </section>
-  );
-}
diff --git a/src/components/mail/correspondent.ts b/src/components/mail/correspondent.ts
index 3207791..c2c6298 100644
--- a/src/components/mail/correspondent.ts
+++ b/src/components/mail/correspondent.ts
@@ -4,7 +4,7 @@ import { parseCompositePayload } from "@/lib/composite";
 import { parseOfferPayload, parsePaymentRequestPayload } from "@/lib/otc";
 import { parseEscrowFundPayload } from "@/lib/escrow";
 import { formatDeviceSentRecipients } from "@/lib/mail-correspondents";
-import type { LocalMailMessage } from "./Thread";
+import type { LocalMailMessage } from "./message";
 
 export type ConversationCorrespondent = {
   primary: string;
diff --git a/src/components/mail/message.ts b/src/components/mail/message.ts
new file mode 100644
index 0000000..851420f
--- /dev/null
+++ b/src/components/mail/message.ts
@@ -0,0 +1,38 @@
+import type { DecodedMail } from "@/lib/envelope";
+import type { EncryptedMailRecord } from "@/lib/mail";
+import type { PaymentLinkAuthenticity } from "@/lib/payment-link";
+
+export type LocalMailMessage = {
+  id: string;
+  index: string;
+  plaintext: string;
+  envelope: DecodedMail;
+  record: EncryptedMailRecord;
+  transactionHash: string;
+  transactionHashes?: string[];
+  deliveryState?: "confirmed" | "partially_confirmed";
+  documentId?: string;
+  blockNumber?: number;
+  blockTimestamp?: number;
+  eventIndex?: number;
+  direction?: "incoming" | "outgoing";
+  /** Request imported from /pay; it has no MessagePosted evidence. */
+  transport?: "payment_link";
+  /** Authenticity verified from the original payment-link fragment. */
+  linkAuthenticity?: PaymentLinkAuthenticity;
+  recipientCount?: number;
+  /** Device-local Sent recipients. Never inferred from sealed incoming mail. */
+  recipients?: string[];
+  /** Set for locally sent mail so it sorts before the chain confirms a timestamp. */
+  localCreatedAt?: number;
+  localConversationId?: string;
+  assignedAddress?: string;
+  /** Thread-only merge of the local Sent projection and its decrypted event. */
+  threadProvenance?: "device_sent_and_on_chain";
+};
+
+export type ThreadActionState = {
+  pending: boolean;
+  message?: string;
+  startedAt?: number;
+};
diff --git a/src/lib/desk-handoff.test.ts b/src/lib/desk-handoff.test.ts
index aac794a..6ae5277 100644
--- a/src/lib/desk-handoff.test.ts
+++ b/src/lib/desk-handoff.test.ts
@@ -140,7 +140,7 @@ describe("invoice desk handoff", () => {
     buyToken: "0x5",
     targetBuyBaseUnits: "100000000",
     memo: "  invoice 7  ",
-    returnTo: "/mail/inbox",
+    returnTo: "/chat",
   };
 
   it("stores normalized invoice terms and consumes them once for the same scope", async () => {
@@ -167,7 +167,7 @@ describe("invoice desk handoff", () => {
         "0x0000000000000000000000000000000000000000000000000000000000000005",
       targetBuyBaseUnits: "100000000",
       memo: "invoice 7",
-      returnTo: "/mail/inbox",
+      returnTo: "/chat",
     });
     expect(
       consumeInvoiceDeskHandoff(
diff --git a/src/main.tsx b/src/main.tsx
index d0e85c1..5ef9787 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -11,7 +11,6 @@ import {
 import AppShell from "@/app/components/AppShell";
 import ReadyRailGate from "@/app/components/ReadyRailGate";
 import AppProviders from "@/app/providers";
-import InboxPage from "@/app/inbox/page";
 import ChatPage from "@/app/chat/page";
 import PayPage from "@/app/pay/page";
 import ContactsPage from "@/app/contacts/page";
@@ -26,7 +25,7 @@ import "@/app/design-system.css";
 
 // The proposal-only market view and the dry cross-chain review are secondary,
 // read-only tools. Deferring them keeps the eagerly loaded shell inside its
-// recorded byte budget now that Chat joins RFQ, Mailbox and Counterparties.
+// recorded byte budget now that Chat carries the whole correspondence desk.
 const MarketProposalPage = lazy(
   () => import("@/app/rfq/markets/proposal/page"),
 );
@@ -52,14 +51,6 @@ function redirectLegacyRoute(pathname: string, locationHash: string): never {
   throw redirect({ ...target, replace: true });
 }
 
-function ReadyMailPage() {
-  return (
-    <ReadyRailGate moduleName="Mail">
-      <InboxPage />
-    </ReadyRailGate>
-  );
-}
-
 function ReadyChatPage() {
   return (
     <ReadyRailGate moduleName="Chat">
@@ -159,10 +150,13 @@ const legacyInboxRoute = createRoute({
   beforeLoad: ({ location }) => redirectLegacyRoute("/inbox", location.hash),
 });
 
+/* The Mailbox surface retired into Chat; its bookmarks land on the desk that
+   now holds the same records. */
 const mailboxRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: "/mail/inbox",
-  component: ReadyMailPage,
+  beforeLoad: ({ location }) =>
+    redirectLegacyRoute("/mail/inbox", location.hash),
 });
 
 const chatRoute = createRoute({
diff --git a/tests/ui/app20.localnet.spec.ts b/tests/ui/app20.localnet.spec.ts
index f5dd7ff..819f0a0 100644
--- a/tests/ui/app20.localnet.spec.ts
+++ b/tests/ui/app20.localnet.spec.ts
@@ -18,6 +18,22 @@ import {
   type Page,
   type TestInfo,
 } from "./support/localnet";
+import {
+  COMPOSE_BODY_PLACEHOLDER,
+  attachTerms,
+  contextPanel,
+  conversationRow,
+  conversationRowByAddress,
+  conversationsRail,
+  entry,
+  loadExistingKey,
+  openFullRecord,
+  openMailboxRecovery,
+  openTools,
+  scanRecent,
+  timeline,
+  navLink,
+} from "./support/chat";
 
 const ARTIFACT_DIR = resolve("ui-artifacts/localnet");
 const WRONG_KEY_BACKUP =
@@ -56,6 +72,7 @@ async function switchIdentity(
   );
 }
 
+/** Chat shows the key setup card whenever this device holds no loaded key. */
 async function registerNewKey(
   page: Page,
   identity: LocalnetIdentityId,
@@ -65,9 +82,6 @@ async function registerNewKey(
   const setup = page.getByRole("button", {
     name: "Load device key & register",
   });
-  if ((await setup.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-  }
   await expect(setup).toBeVisible();
   const expectedBackup = await primeLocalnetMailSeed(page, identity);
   try {
@@ -90,23 +104,8 @@ async function registerNewKey(
   await expect(acknowledge).toBeVisible({ timeout: 60_000 });
   await acknowledge.click();
   await expect(
-    page.getByRole("heading", { name: "Register a mail key" }),
+    page.getByRole("heading", { name: "Set up a mailbox key" }),
   ).toHaveCount(0);
-  const deleteDraft = page.getByRole("button", {
-    name: "Delete draft…",
-    exact: true,
-  });
-  if ((await deleteDraft.count()) > 0) {
-    page.once("dialog", (dialog) => dialog.accept());
-    await deleteDraft.click();
-  } else {
-    const close = page.getByRole("button", { name: "Close", exact: true });
-    if ((await close.count()) > 0) await close.click();
-  }
-  await page
-    .getByRole("button", { name: /^Inbox/ })
-    .first()
-    .click();
   return backup;
 }
 
@@ -114,88 +113,16 @@ async function restoreRegisteredKey(page: Page, backup: string) {
   const setup = page.getByRole("button", {
     name: "Load device key & register",
   });
-  if ((await setup.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-  }
+  await expect(setup).toBeVisible();
   await page.getByText("Restore from backup").click();
   await page.getByLabel("Backup value").fill(backup);
   await page.getByRole("button", { name: "Restore mailbox key" }).click();
   await expect(setup).toHaveCount(0, { timeout: 60_000 });
-  const deleteDraft = page.getByRole("button", {
-    name: "Delete draft…",
-    exact: true,
-  });
-  if ((await deleteDraft.count()) > 0) {
-    page.once("dialog", (dialog) => dialog.accept());
-    await deleteDraft.click();
-  }
 }
 
-/** The recovery panel is a closed disclosure in the mailbox rail. */
-async function openMailboxRecovery(page: Page) {
-  await page
-    .locator("details", {
-      has: page.getByText("Encrypted mailbox recovery", { exact: true }),
-    })
-    .first()
-    .evaluate((element) => {
-      (element as HTMLDetailsElement).open = true;
-    });
-}
-
-async function loadExistingKey(page: Page) {
-  const button = page.getByRole("button", {
-    name: "Load device key & register",
-  });
-  if ((await button.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-  }
-  await expect(button).toBeVisible();
-  await button.click();
-  await expect(button).toHaveCount(0, { timeout: 60_000 });
-  const deleteDraft = page.getByRole("button", {
-    name: "Delete draft…",
-    exact: true,
-  });
-  if ((await deleteDraft.count()) > 0) {
-    page.once("dialog", (dialog) => dialog.accept());
-    await deleteDraft.click();
-  } else {
-    const close = page.getByRole("button", { name: "Close", exact: true });
-    if ((await close.count()) > 0) await close.click();
-  }
-  await page
-    .getByRole("button", { name: /^Inbox/ })
-    .first()
-    .click();
-}
-
-async function scanRecent(page: Page) {
-  const button = page.getByRole("button", { name: "Check for new mail" });
-  await expect(button).toBeEnabled();
-  await button.click();
-  await page.waitForTimeout(100);
-  await expect(
-    page.getByRole("button", { name: "Check for new mail" }),
-  ).toBeEnabled({
-    timeout: 60_000,
-  });
-}
-
-async function openNewDocument(page: Page) {
-  await page.getByRole("button", { name: "Compose", exact: true }).click();
-  await expect(
-    page.getByRole("heading", { name: "New document" }),
-  ).toBeVisible();
-  await expect(page.getByLabel(/^To/)).toBeFocused();
-}
-
-function messageRow(page: Page, body: string) {
-  return page.getByRole("button").filter({ hasText: body });
-}
-
-function threadBody(page: Page, body: string) {
-  return page.getByLabel("Correspondence").getByText(body, { exact: true });
+/** The chain panel every decrypted or sent record carries. */
+async function openChainPanel(record: Locator) {
+  await record.getByText("What the chain sees", { exact: true }).click();
 }
 
 const STRK_SCALE = 10n ** 18n;
@@ -237,10 +164,10 @@ test("creates a standalone payment link without an on-chain action", async ({
   const requestedUrls: string[] = [];
   page.on("request", (outgoing) => requestedUrls.push(outgoing.url()));
 
-  await page.goto("/mail/inbox");
+  await page.goto("/chat");
   await activateLocalnet(page);
   await switchIdentity(page, config, "bob");
-  await page.getByRole("link", { name: "Pay", exact: true }).click();
+  await navLink(page, "Pay").click();
   await expect(
     page.getByRole("heading", { name: "Create a link. Move nothing yet." }),
   ).toBeVisible();
@@ -250,14 +177,15 @@ test("creates a standalone payment link without an on-chain action", async ({
   });
   await expect(
     page.getByText(
-      "Create or restore this wallet's Mail identity in the inbox first. APP20 will not present a newly generated payment request as trustworthy without a Mail signature.",
+      "Create or restore this wallet's Mail identity in Chat first. APP20 will not present a newly generated payment request as trustworthy without a Mail signature.",
       { exact: true },
     ),
   ).toBeVisible();
   await expect(generate).toBeDisabled();
   await expect(page.getByText("No transaction submitted")).toHaveCount(0);
 
-  await page.getByRole("link", { name: "Open APP20 Mail" }).click();
+  await page.getByRole("link", { name: "Open Chat" }).click();
+  await expect(page).toHaveURL(/\/chat$/);
   if (sharedBobBackup) {
     expect(sharedBobBackup).toHaveLength(71);
     await restoreRegisteredKey(page, sharedBobBackup);
@@ -271,7 +199,7 @@ test("creates a standalone payment link without an on-chain action", async ({
     );
     expect(sharedBobBackup).toHaveLength(71);
   }
-  await page.getByRole("link", { name: "Pay", exact: true }).click();
+  await navLink(page, "Pay").click();
   await expect(
     page.getByText(
       "Ready to create a Mail-signed request for the connected wallet. Generating and copying the link submits no transaction and costs no pool fee.",
@@ -347,7 +275,7 @@ test("creates a standalone payment link without an on-chain action", async ({
   await expect(review.getByText(/Expires .* · Localnet \(dev\)/)).toBeVisible();
   await expect(
     review.getByRole("button", {
-      name: "Continue to inbox to review & pay",
+      name: "Continue to Chat to review & pay",
     }),
   ).toBeEnabled();
   expect(reviewRequests.some((url) => url.includes("#"))).toBeFalsy();
@@ -369,14 +297,17 @@ test("all APP20 localnet journeys", async ({
   page.setDefaultTimeout(60_000);
   const alice = localnetIdentity(config, "alice");
   const bob = localnetIdentity(config, "bob");
-  const compositeBody =
-    "Composite production test: payment, invoice, and offer in one private document.";
-  const escrowBody = "Escrow browser lifecycle";
-  const draftBody = "Draft survives navigation and resumes";
-  const multiBody = "Two recipients decrypt this private circular";
+  const bobLabel = "Bob recovery desk";
+  // Unique per run: a reused chain keeps earlier runs' documents, and a
+  // fresh browser context decrypts them all again.
+  const runTag = Date.now().toString(36);
+  const compositeBody = `Composite production test ${runTag}: payment, invoice, and offer in one private document.`;
+  const escrowBody = `Escrow browser lifecycle ${runTag}`;
+  const draftBody = `Draft ${runTag} survives navigation and resumes`;
+  const multiBody = `Two recipients decrypt private circular ${runTag}`;
 
   await test.step("1. connect and onboard Alice and Bob", async () => {
-    await page.goto("/mail/inbox");
+    await page.goto("/chat");
     await connectLocalnetWallet(page, { auditFocusReturn: true });
     await switchIdentity(page, config, "alice");
     const aliceBackup = await registerNewKey(
@@ -416,16 +347,16 @@ test("all APP20 localnet journeys", async ({
   await test.step("1b. Alice restores Contacts after local ciphertext loss through encrypted self-mail", async () => {
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
-    await page.getByRole("link", { name: "Counterparties" }).click();
-    await page.getByLabel("New address book label").fill("Bob recovery desk");
+    await navLink(page, "Counterparties").click();
+    await page.getByLabel("New address book label").fill(bobLabel);
     await page.getByLabel("New address book address").fill(bob.address);
     await page.getByRole("button", { name: "Add", exact: true }).click();
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await navLink(page, "Chat").click();
     await loadExistingKey(page);
     await openMailboxRecovery(page);
 
     const backupContacts = page.getByRole("button", {
-      name: "Back up contacts to Mailbox",
+      name: "Back up contacts to this mailbox",
     });
     await expect(backupContacts).toBeEnabled({ timeout: 60_000 });
     await backupContacts.click();
@@ -433,7 +364,7 @@ test("all APP20 localnet journeys", async ({
       page.getByText(/1 contact backed up inline in 0x/),
     ).toBeVisible({ timeout: 60_000 });
 
-    await page.getByRole("link", { name: "Counterparties" }).click();
+    await navLink(page, "Counterparties").click();
     await page.evaluate(async (address) => {
       const dynamicImport = new Function("path", "return import(path)") as (
         path: string,
@@ -442,30 +373,35 @@ test("all APP20 localnet journeys", async ({
       localStorage.removeItem(addressBook.addressBookStorageKey(address));
       window.dispatchEvent(new Event(addressBook.ADDRESS_BOOK_CHANGED_EVENT));
     }, alice.address);
-    await expect(page.getByText("Bob recovery desk")).toHaveCount(0);
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await expect(page.getByText(bobLabel)).toHaveCount(0);
+    await navLink(page, "Chat").click();
     await loadExistingKey(page);
     await scanRecent(page);
-    await page
-      .getByRole("button", { name: /Contact backup/ })
-      .first()
-      .click();
+    // Self-addressed backups file under the mailbox itself.
+    const self = conversationRow(page, "This mailbox");
+    await expect(self).toBeVisible({ timeout: 60_000 });
+    await self.click();
+    // Earlier runs on the same chain leave older backups above; the newest
+    // one is the last entry of the chronological timeline.
     await expect(
-      page.getByText("CONTACT BACKUP", { exact: true }),
+      timeline(page).getByText("CONTACT BACKUP", { exact: true }).last(),
     ).toBeVisible();
     page.once("dialog", (dialog) => dialog.accept());
-    await page.getByRole("button", { name: "Merge verified contacts" }).click();
+    await page
+      .getByRole("button", { name: "Merge verified contacts" })
+      .last()
+      .click();
     await expect(
       page.getByText(/Authenticated backup sequence .* restored/),
     ).toBeVisible();
-    await page.getByRole("link", { name: "Counterparties" }).click();
-    await expect(page.getByText("Bob recovery desk")).toBeVisible();
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await navLink(page, "Counterparties").click();
+    await expect(page.getByText(bobLabel)).toBeVisible();
+    await navLink(page, "Chat").click();
   });
 
   await test.step("2. shield STRK and observe truthful progress", async () => {
     await switchIdentity(page, config, "alice");
-    await page.getByRole("link", { name: "RFQ", exact: true }).click();
+    await navLink(page, "RFQ").click();
     await page.getByRole("link", { name: "Shield / unshield funding" }).click();
     await expect(page).toHaveURL(/\/funding$/);
     await expect(
@@ -507,11 +443,11 @@ test("all APP20 localnet journeys", async ({
     });
 
     // Bob needs STRK for the later offer acceptance and invoice payment.
-    // The identity switch stays in Mail's dev-only sidebar. Return through
+    // The identity switch stays in the dev-only localnet bar. Return through
     // RFQ's explicit separate-operation link to the canonical funding surface.
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await navLink(page, "Chat").click();
     await switchIdentity(page, config, "bob");
-    await page.getByRole("link", { name: "RFQ", exact: true }).click();
+    await navLink(page, "RFQ").click();
     await page.getByRole("link", { name: "Shield / unshield funding" }).click();
     await expect(page).toHaveURL(/\/funding$/);
     const bobBefore = parseDisplayedStrk(
@@ -536,19 +472,16 @@ test("all APP20 localnet journeys", async ({
       },
     );
     await screenshot(page, "05-shielded-balances", testInfo);
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
+    await navLink(page, "Chat").click();
   });
 
   await test.step("3. send a composite document and inspect Sent evidence", async () => {
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
-    await openNewDocument(page);
+    await conversationRow(page, bobLabel).click();
+    await attachTerms(page);
     await page.getByLabel(/^To/).fill(bob.address);
-    await page
-      .getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      )
-      .fill(compositeBody);
+    await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(compositeBody);
     await page.getByRole("button", { name: /Private payment/ }).click();
     await page.getByRole("button", { name: /OTC offer/ }).click();
     await page.getByRole("button", { name: "+ Invoice", exact: true }).click();
@@ -600,17 +533,14 @@ test("all APP20 localnet journeys", async ({
     ).toHaveCount(0, {
       timeout: 180_000,
     });
-    await expect(page.getByText(/Sent · record local/i)).toBeVisible();
-    await expect(threadBody(page, compositeBody)).toBeVisible();
-    await page.getByText("What the chain sees", { exact: true }).click();
-    await expect(
-      page.getByText("Transaction hash", { exact: true }),
-    ).toBeVisible();
-    await expect(
-      page.getByText("1 recipient · posted", { exact: false }),
-    ).toBeVisible();
-    // Provenance moved next to the type badge; read state is incoming-only.
-    await expect(messageRow(page, compositeBody)).toContainText("Sent");
+    // The Sent copy files under the counterparty with its chain evidence.
+    const sent = entry(page, compositeBody);
+    await expect(sent).toBeVisible();
+    await expect(sent).toContainText("Sent copy on this device");
+    await expect(sent).toContainText("1 recipient");
+    await openChainPanel(sent);
+    await expect(sent.getByText("Transaction hash", { exact: true })).toBeVisible();
+    await expect(conversationRow(page, bobLabel)).toContainText("You:");
     await screenshot(page, "08-composite-in-sent", testInfo);
   });
 
@@ -618,33 +548,33 @@ test("all APP20 localnet journeys", async ({
     await switchIdentity(page, config, "bob");
     await loadExistingKey(page);
     await scanRecent(page);
-    await expect(messageRow(page, compositeBody)).toBeVisible({
-      timeout: 60_000,
-    });
-    await expect(messageRow(page, compositeBody)).toContainText("UNREAD");
-    await messageRow(page, compositeBody).click();
-    await expect(threadBody(page, compositeBody)).toBeVisible();
-    await expect(messageRow(page, compositeBody)).toContainText("OPENED");
-    // The thread head now names the counterparty, so it is addressed by id.
-    await expect(page.locator("#thread-title")).toBeFocused();
-    await expect(
-      page.getByText("PRIVATE PAYMENT MEMO", { exact: true }),
-    ).toBeVisible();
+    const row = conversationRowByAddress(page, alice.address);
+    await expect(row).toBeVisible({ timeout: 60_000 });
+    await expect(row).toContainText(/\d+ unread/);
+    await row.click();
+    await expect(row).toContainText("Opened");
+    const received = entry(page, compositeBody);
+    await expect(received).toBeVisible();
+    await expect(received).toContainText("Opened · record");
+    // Records that need nothing from Bob stay compact until opened.
+    await openFullRecord(
+      received.getByRole("article", { name: /^Private payment:/ }),
+    );
     await expect(
-      page.getByText("OTC OFFER / ONE-SIDED V1", { exact: true }),
+      received.getByText("PRIVATE PAYMENT MEMO", { exact: true }),
     ).toBeVisible();
     await expect(
-      page.getByText("PAYMENT REQUEST / ONE-SIDED V1", { exact: true }),
+      received.getByText("OTC OFFER / ONE-SIDED V1", { exact: true }),
     ).toBeVisible();
     await expect(
-      page.getByText("What the chain sees", { exact: true }),
+      received.getByText("PAYMENT REQUEST / ONE-SIDED V1", { exact: true }),
     ).toBeVisible();
-    await page.getByText("What the chain sees", { exact: true }).click();
+    await openChainPanel(received);
     await expect(
-      page.getByText("Sender address", { exact: true }),
+      received.getByText("Sender address", { exact: true }),
     ).toBeVisible();
     await expect(
-      page.getByText("Recipient identities", { exact: true }),
+      received.getByText("Recipient identities", { exact: true }),
     ).toBeVisible();
     await screenshot(page, "09-bob-decrypted-composite", testInfo);
 
@@ -653,12 +583,9 @@ test("all APP20 localnet journeys", async ({
       identity: "bob",
     });
     const wrongKeyPage = await unrelated.newPage();
-    await wrongKeyPage.goto("/mail/inbox");
+    await wrongKeyPage.goto("/chat");
     await connectLocalnetWallet(wrongKeyPage);
     await switchIdentity(wrongKeyPage, config, "bob");
-    await wrongKeyPage
-      .getByRole("button", { name: "Compose", exact: true })
-      .click();
     await wrongKeyPage.getByText("Restore from backup").click();
     await wrongKeyPage.getByLabel("Backup value").fill(WRONG_KEY_BACKUP);
     await wrongKeyPage
@@ -673,13 +600,13 @@ test("all APP20 localnet journeys", async ({
     await expect(
       wrongKeyPage.getByRole("button", { name: "Check for new mail" }),
     ).toBeDisabled();
-    await expect(messageRow(wrongKeyPage, compositeBody)).toHaveCount(0);
+    await expect(wrongKeyPage.getByText(compositeBody)).toHaveCount(0);
     await screenshot(wrongKeyPage, "10-unrelated-key-empty", testInfo);
     await unrelated.close();
   });
 
   await test.step("5. accept the offer exactly once", async () => {
-    const accept = page.getByRole("button", {
+    const accept = entry(page, compositeBody).getByRole("button", {
       name: "Accept & send 0.25 STRK",
     });
     await expect(accept).toBeVisible();
@@ -706,8 +633,11 @@ test("all APP20 localnet journeys", async ({
   });
 
   await test.step("6. share, review, and explicitly pay an invoice from a fresh context", async () => {
-    await page.getByRole("button", { name: "Share payment link" }).click();
-    const linkCode = page
+    const invoiceEntry = entry(page, compositeBody);
+    await invoiceEntry
+      .getByRole("button", { name: "Share payment link" })
+      .click();
+    const linkCode = invoiceEntry
       .locator("code")
       .filter({ hasText: `${BASE_URL}/pay#app20p2.` });
     const paymentLink = (await linkCode.innerText()).trim();
@@ -753,7 +683,7 @@ test("all APP20 localnet journeys", async ({
     ).toHaveCount(0);
     await expect(
       payPage.getByRole("button", {
-        name: "Continue to inbox to review & pay",
+        name: "Continue to Chat to review & pay",
       }),
     ).toBeVisible();
     await expect(
@@ -769,14 +699,22 @@ test("all APP20 localnet journeys", async ({
 
     await connectLocalnetWallet(payPage);
     await payPage
-      .getByRole("button", { name: "Continue to inbox to review & pay" })
+      .getByRole("button", { name: "Continue to Chat to review & pay" })
       .click();
+    await expect(payPage).toHaveURL(/\/chat$/);
     await expect(
       payPage.getByRole("heading", { name: "Set up a mailbox key" }),
     ).toBeVisible();
+    // The imported request already files under its requester, before any key.
+    await expect(
+      conversationRowByAddress(payPage, alice.address),
+    ).toContainText("Needs action");
     await payPage.getByText("Restore from backup").click();
     await payPage.getByLabel("Backup value").fill(bobBackup);
     await payPage.getByRole("button", { name: "Restore mailbox key" }).click();
+    // The reviewed link is the record this device pays from; the sealed
+    // copy Alice sent arrives with the post-payment mail check and carries
+    // the outcome forward.
     const pay = payPage.getByRole("button", { name: "Pay 0.2 STRK privately" });
     await expect(pay).toBeVisible();
     await pay.click();
@@ -787,9 +725,15 @@ test("all APP20 localnet journeys", async ({
     ).toBeVisible();
     await screenshot(payPage, "15-invoice-payment-progress", testInfo);
     await expect(
-      payPage.getByText(/payment and encrypted memo confirmed\./i),
+      payPage.getByText(/payment and encrypted memo confirmed\./i).first(),
     ).toBeVisible({ timeout: 180_000 });
-    await expect(pay).toHaveCount(0);
+    const paid = payPage
+      .getByRole("article", { name: /^Invoice:/ })
+      .filter({ hasText: /payment and encrypted memo confirmed/i });
+    await expect(paid.first()).toBeVisible();
+    await expect(
+      paid.getByRole("button", { name: "Pay 0.2 STRK privately" }),
+    ).toHaveCount(0);
     expect(
       requestedUrls.filter((url) =>
         url.includes("/__app20_localnet_wallet/privacy"),
@@ -802,13 +746,10 @@ test("all APP20 localnet journeys", async ({
   await test.step("7. fund, fill, and claim contract-backed escrow", async () => {
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
-    await openNewDocument(page);
+    await conversationRow(page, bobLabel).click();
+    await attachTerms(page);
     await page.getByLabel(/^To/).fill(bob.address);
-    await page
-      .getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      )
-      .fill(escrowBody);
+    await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(escrowBody);
     await page
       .getByRole("button", { name: "+ Escrow fund", exact: true })
       .click();
@@ -848,8 +789,8 @@ test("all APP20 localnet journeys", async ({
     await switchIdentity(page, config, "bob");
     await loadExistingKey(page);
     await scanRecent(page);
-    await expect(messageRow(page, escrowBody)).toBeVisible({ timeout: 60_000 });
-    await messageRow(page, escrowBody).click();
+    await conversationRowByAddress(page, alice.address).click();
+    await expect(entry(page, escrowBody)).toBeVisible({ timeout: 60_000 });
     const fill = page.getByRole("button", {
       name: "Deposit 0.01 ETH & receive leg A",
     });
@@ -864,8 +805,8 @@ test("all APP20 localnet journeys", async ({
 
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
-    await page.getByRole("button", { name: /^Sent/ }).first().click();
-    await messageRow(page, escrowBody).click();
+    await conversationRow(page, bobLabel).click();
+    await expect(entry(page, escrowBody)).toBeVisible();
     const claim = page.getByRole("button", { name: "Claim ETH leg" });
     await expect(claim).toBeVisible({ timeout: 60_000 });
     await claim.click();
@@ -875,55 +816,49 @@ test("all APP20 localnet journeys", async ({
       }),
     ).toBeVisible({ timeout: 180_000 });
     await expect(
-      page.getByText("Settled on-chain", { exact: true }),
+      page.getByText("Settled on-chain", { exact: true }).first(),
     ).toBeVisible();
     await screenshot(page, "21-escrow-settled", testInfo);
   });
 
   await test.step("8. persist, resume, and send a device-private draft", async () => {
-    await openNewDocument(page);
+    await attachTerms(page);
     await page.getByLabel(/^To/).fill(bob.address);
-    await page
-      .getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      )
-      .fill(draftBody);
-    await page.getByRole("button", { name: "Close" }).click();
-    await page
-      .getByRole("button", { name: /^Drafts/ })
-      .first()
-      .click();
-    const draftRow = messageRow(page, draftBody);
+    await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(draftBody);
+    await page.getByRole("button", { name: "Close document" }).click();
+    await expect(
+      page.getByRole("heading", { name: "New document" }),
+    ).toHaveCount(0);
+    await openTools(page, "Drafts");
+    const draftRow = page.getByRole("button", {
+      name: `Open draft: ${draftBody}`,
+    });
     await expect(draftRow).toBeVisible();
     await screenshot(page, "22-draft-persisted", testInfo);
     await draftRow.click();
-    await expect(
-      page.getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      ),
-    ).toHaveValue(draftBody);
+    await expect(page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER)).toHaveValue(
+      draftBody,
+    );
     await page.getByRole("button", { name: "Send encrypted message" }).click();
     await expect(
       page.getByRole("heading", { name: "New document" }),
     ).toHaveCount(0, {
       timeout: 180_000,
     });
-    await expect(page.getByText(/Sent · record local/i)).toBeVisible();
-    await expect(threadBody(page, draftBody)).toBeVisible();
+    await expect(entry(page, draftBody)).toContainText(
+      "Sent copy on this device",
+    );
     await expect(
-      page.getByRole("button", { name: /^Drafts/ }).first(),
+      page.locator("summary").filter({ hasText: "Drafts" }),
     ).toContainText("0");
     await screenshot(page, "23-draft-resumed-and-sent", testInfo);
   });
 
   await test.step("9. deliver one body to two independently decrypting recipients", async () => {
-    await openNewDocument(page);
+    // Written from Bob's conversation so the circular stays in that thread.
+    await attachTerms(page);
     await page.getByLabel(/^To/).fill(`${alice.address}\n${bob.address}`);
-    await page
-      .getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      )
-      .fill(multiBody);
+    await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(multiBody);
     await expect(
       page.getByText(/2 \/ 66 recipients\./),
     ).toBeVisible();
@@ -934,26 +869,31 @@ test("all APP20 localnet journeys", async ({
     ).toHaveCount(0, {
       timeout: 180_000,
     });
-    await expect(page.getByText(/2 recipients · posted/i)).toBeVisible();
+    // A circular to Bob and this mailbox files under Bob, with its public count.
+    await expect(conversationRow(page, bobLabel)).toHaveAttribute(
+      "aria-current",
+      "true",
+    );
+    await expect(entry(page, multiBody)).toContainText("2 recipients");
 
     await switchIdentity(page, config, "bob");
     await loadExistingKey(page);
     await scanRecent(page);
-    await expect(messageRow(page, multiBody)).toBeVisible({ timeout: 60_000 });
-    await messageRow(page, multiBody).click();
-    await expect(threadBody(page, multiBody)).toBeVisible();
+    await conversationRowByAddress(page, alice.address).click();
+    await expect(entry(page, multiBody)).toBeVisible({ timeout: 60_000 });
+    await expect(entry(page, multiBody)).toContainText("Opened · record");
     await screenshot(page, "25-multi-recipient-bob", testInfo);
 
+    // Alice decrypts her own copy from the chain; it stays one record, not
+    // an echo under a sealed sender.
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
     await scanRecent(page);
-    await page
-      .getByRole("button", { name: /^Inbox/ })
-      .first()
-      .click();
-    await expect(messageRow(page, multiBody)).toBeVisible({ timeout: 60_000 });
-    await messageRow(page, multiBody).click();
-    await expect(threadBody(page, multiBody)).toBeVisible();
+    await conversationRow(page, bobLabel).click();
+    await expect(entry(page, multiBody)).toHaveCount(1);
+    await expect(
+      conversationRow(page, "Sealed sender").filter({ hasText: multiBody }),
+    ).toHaveCount(0);
     await screenshot(page, "26-multi-recipient-alice", testInfo);
   });
 
@@ -968,26 +908,31 @@ test("all APP20 localnet journeys", async ({
     for (const width of [375, 768, 1_440]) {
       await page.setViewportSize({ width, height: 900 });
       if (width === 375) {
-        const drawer = page.locator("#mail-sidebar");
-        const menu = page.getByRole("button", {
-          name: "Open mailbox sidebar",
+        // One pane at a time on a phone: the open conversation, a way back
+        // to the rail, and the contact context as a drawer.
+        const back = page.getByRole("button", {
+          name: "Back to conversations",
         });
-        await expect(drawer).toHaveAttribute("inert", "");
-        await expect(menu).toHaveAttribute("aria-expanded", "false");
-        await menu.click();
-        const sidebarDialog = page.getByRole("dialog", {
-          name: "Mailbox sidebar",
+        await expect(back).toBeVisible();
+        await back.click();
+        await expect(conversationsRail(page)).toBeVisible();
+        await expect(back).toBeHidden();
+        await conversationRow(page, bobLabel).click();
+        await expect(timeline(page)).toBeVisible();
+        const context = page.getByRole("button", {
+          name: "Context",
+          exact: true,
         });
-        await expect(sidebarDialog).toBeVisible();
-        await expect(drawer).not.toHaveAttribute("inert");
+        await expect(context).toHaveAttribute("aria-expanded", "false");
+        await context.click();
+        await expect(context).toHaveAttribute("aria-expanded", "true");
         await expect(
-          sidebarDialog.getByRole("button", { name: "Close mailbox sidebar" }),
-        ).toBeFocused();
-        await page.keyboard.press("Escape");
-        await expect(sidebarDialog).toHaveCount(0);
-        await expect(drawer).toHaveAttribute("inert", "");
-        await expect(menu).toHaveAttribute("aria-expanded", "false");
-        await expect(menu).toBeFocused();
+          contextPanel(page).getByRole("region", { name: "Wallet identity" }),
+        ).toBeVisible();
+        await contextPanel(page)
+          .getByRole("button", { name: "Close contact context" })
+          .click();
+        await expect(context).toHaveAttribute("aria-expanded", "false");
       }
       await expectNoHorizontalOverflow(page);
       await screenshot(page, `28-responsive-${width}`, testInfo);
diff --git a/tests/ui/chat.localnet.spec.ts b/tests/ui/chat.localnet.spec.ts
index b12b544..cfb428e 100644
--- a/tests/ui/chat.localnet.spec.ts
+++ b/tests/ui/chat.localnet.spec.ts
@@ -3,13 +3,26 @@ import {
   connectLocalnetWallet,
   expect,
   localnetIdentity,
-  primeLocalnetMailSeed,
-  restoreLocalnetMailRandomness,
   test,
   type LocalnetConfig,
   type LocalnetIdentityId,
   type Page,
 } from "./support/localnet";
+import {
+  COMPOSE_BODY_PLACEHOLDER,
+  addressPattern,
+  attachTerms,
+  contextPanel,
+  conversationPane,
+  conversationRow,
+  conversationRowByAddress,
+  ensureMailboxKey,
+  entry,
+  loadExistingKey,
+  scanRecent,
+  timeline,
+  navLink,
+} from "./support/chat";
 
 test.describe.configure({ mode: "serial" });
 
@@ -37,117 +50,7 @@ async function switchIdentity(
   ).toHaveAttribute("title", new RegExp(target.address.slice(2), "i"));
 }
 
-/** The recovery panel is a closed disclosure in the mailbox rail. */
-async function openMailboxRecovery(page: Page) {
-  await page
-    .locator("details", {
-      has: page.getByText("Encrypted mailbox recovery", { exact: true }),
-    })
-    .first()
-    .evaluate((element) => {
-      (element as HTMLDetailsElement).open = true;
-    });
-}
-
-async function closeComposerIfOpen(page: Page) {
-  const deleteDraft = page.getByRole("button", {
-    name: "Delete draft…",
-    exact: true,
-  });
-  if ((await deleteDraft.count()) > 0) {
-    page.once("dialog", (dialog) => dialog.accept());
-    await deleteDraft.click();
-  } else {
-    const close = page.getByRole("button", { name: "Close", exact: true });
-    if ((await close.count()) > 0) await close.click();
-  }
-}
-
-/** Registers the fixture mailbox key for an identity, or loads the saved one. */
-async function ensureMailboxKey(page: Page, identity: LocalnetIdentityId) {
-  let setup = page.getByRole("button", {
-    name: "Load device key & register",
-  });
-  if ((await setup.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-    setup = page.getByRole("button", {
-      name: "Load device key & register",
-    });
-  }
-  await expect(setup).toBeVisible();
-  await primeLocalnetMailSeed(page, identity);
-  try {
-    await setup.click();
-  } finally {
-    await restoreLocalnetMailRandomness(page);
-  }
-  const backupHeading = page.getByText(
-    "Back up now — this phrase is shown once",
-  );
-  const scanButton = page.getByRole("button", { name: "Check for new mail" });
-  await expect
-    .poll(
-      async () => {
-        if (await backupHeading.isVisible()) return "backup";
-        return (await scanButton.isEnabled()) ? "ready" : "waiting";
-      },
-      { timeout: 120_000 },
-    )
-    .not.toBe("waiting");
-  if (await backupHeading.isVisible()) {
-    await page
-      .getByRole("button", { name: "I saved the backup — open mailbox" })
-      .click();
-  }
-  await expect(scanButton).toBeEnabled({ timeout: 60_000 });
-  await openMailboxRecovery(page);
-  await expect(
-    page.getByRole("button", { name: "Back up RFQ history" }),
-  ).toBeEnabled({ timeout: 60_000 });
-  await closeComposerIfOpen(page);
-}
-
-async function loadExistingKey(page: Page) {
-  const button = page.getByRole("button", {
-    name: "Load device key & register",
-  });
-  if ((await button.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-  }
-  await expect(button).toBeVisible();
-  await button.click();
-  await expect(button).toHaveCount(0, { timeout: 60_000 });
-  await closeComposerIfOpen(page);
-  await page
-    .getByRole("button", { name: /^Inbox/ })
-    .first()
-    .click();
-}
-
-async function scanRecent(page: Page) {
-  const button = page.getByRole("button", { name: "Check for new mail" });
-  await expect(button).toBeEnabled();
-  await button.click();
-  await page.waitForTimeout(100);
-  await expect(button).toBeEnabled({ timeout: 60_000 });
-}
-
-function messageRow(page: Page, body: string) {
-  return page.getByRole("button").filter({ hasText: body });
-}
-
-/** Displayed addresses are canonical felts; fixture addresses may be zero-padded. */
-function addressPattern(address: string): RegExp {
-  return new RegExp(address.replace(/^0x0*/i, ""), "i");
-}
-
-function conversationRow(page: Page, name: string) {
-  return page
-    .getByRole("region", { name: "Conversations", exact: true })
-    .getByRole("button", { name: new RegExp(name) });
-}
-
-test("chat sends an encrypted letter and reads Mailbox's records per counterparty", async ({
+test("chat carries a letter and an attached offer between two mailboxes", async ({
   page,
   localnetConfig: config,
 }) => {
@@ -161,11 +64,12 @@ test("chat sends an encrypted letter and reads Mailbox's records per counterpart
   const quote = `0.01${String(Date.now() % 1_000).padStart(3, "0")}`;
   const terms = `0.25 STRK for ${quote} ETH`;
   const letter = `Chat letter ${runTag}: can you quote 0.25 STRK against ETH today?`;
-  const offerBody = `Offer ${runTag} from Mailbox that Chat should read as work`;
+  const offerBody = `Offer ${runTag} attached from the conversation`;
   const contactLabel = "Alice desk";
 
-  await test.step("1. both fixture mailboxes register their keys", async () => {
+  await test.step("1. the old mailbox route lands on Chat and both fixture mailboxes register keys", async () => {
     await page.goto("/mail/inbox");
+    await expect(page).toHaveURL(/\/chat$/);
     await activateLocalnet(page);
     await switchIdentity(page, config, "alice");
     await ensureMailboxKey(page, "alice");
@@ -173,82 +77,83 @@ test("chat sends an encrypted letter and reads Mailbox's records per counterpart
     await ensureMailboxKey(page, "bob");
   });
 
-  await test.step("2. Bob saves Alice as a counterparty and opens Chat", async () => {
-    await page.getByRole("link", { name: "Counterparties" }).click();
+  await test.step("2. Bob saves Alice as a counterparty and opens her conversation from the book", async () => {
+    await navLink(page, "Counterparties").click();
     await page.getByLabel("New address book label").fill(contactLabel);
     await page.getByLabel("New address book address").fill(alice.address);
     await page.getByRole("button", { name: "Add", exact: true }).click();
     await expect(page.getByText(contactLabel, { exact: true })).toBeVisible();
 
-    await page.getByRole("link", { name: "Chat", exact: true }).click();
+    await page.getByRole("link", { name: "Open in Chat" }).click();
     await expect(page).toHaveURL(/\/chat$/);
     await expect(page.locator(".signal-bar")).toContainText("CHAT");
     await expect(
-      page.getByRole("link", { name: "Chat", exact: true }),
+      navLink(page, "Chat"),
     ).toHaveAttribute("aria-current", "page");
     const row = conversationRow(page, contactLabel);
-    await expect(row).toBeVisible();
-    await row.click();
-    await expect(
-      page
-        .getByRole("region", { name: "Conversation", exact: true })
-        .locator("header strong"),
-    ).toContainText(contactLabel);
+    await expect(row).toHaveAttribute("aria-current", "true");
+    await expect(conversationPane(page).locator("header strong")).toContainText(
+      contactLabel,
+    );
     await expect(
       page.getByText(`No records with ${contactLabel} on this device yet.`),
     ).toBeVisible();
-    await expect(
-      page.getByRole("complementary", { name: "Contact context" }),
-    ).toContainText(addressPattern(alice.address));
+    await expect(contextPanel(page)).toContainText(addressPattern(alice.address));
+    await expect(page.getByLabel(`Message to ${contactLabel}`)).toBeFocused();
   });
 
-  await test.step("3. Bob sends an encrypted letter from the composer", async () => {
+  await test.step("3. Bob loads his key and sends an encrypted letter from the composer", async () => {
+    const form = page.getByRole("form", { name: `Write to ${contactLabel}` });
+    await expect(form).toContainText("Set up a mailbox key");
+    await loadExistingKey(page);
     const input = page.getByLabel(`Message to ${contactLabel}`);
     await input.fill(letter);
-    await expect(
-      page.getByRole("form", { name: `Write to ${contactLabel}` }),
-    ).toContainText(/bytes · sealed on this device · 1 wallet approval/i);
+    await expect(form).toContainText(
+      /bytes · sealed on this device · 1 wallet approval/i,
+    );
     await page.getByRole("button", { name: "Send encrypted" }).click();
     await expect(
       page.getByRole("status").filter({ hasText: /Sealed and confirmed in/ }),
     ).toBeVisible({ timeout: 180_000 });
-    const timeline = page.getByRole("list", {
-      name: `Conversation with ${contactLabel}`,
-    });
-    await expect(timeline).toContainText(letter);
-    await expect(timeline).toContainText("Sent copy on this device");
+    await expect(entry(page, letter)).toContainText("Sent copy on this device");
+    await expect(
+      page
+        .getByRole("status")
+        .filter({ hasText: /Sent copy saved in this browser profile/ }),
+    ).toBeVisible();
     await expect(conversationRow(page, contactLabel)).toContainText("You:");
     await expect(input).toHaveValue("");
-
-    // The same Sent copy is what Mailbox shows: one store, two surfaces.
-    await page.getByRole("link", { name: "Mailbox", exact: true }).click();
-    await page
-      .getByRole("button", { name: /^Sent/ })
-      .first()
-      .click();
-    await expect(messageRow(page, letter)).toBeVisible();
   });
 
-  await test.step("4. Alice decrypts it in Mailbox and answers with an offer", async () => {
+  await test.step("4. Alice names the sealed sender and answers with an offer in the same thread", async () => {
     await switchIdentity(page, config, "alice");
     await loadExistingKey(page);
     await scanRecent(page);
-    await expect(messageRow(page, letter)).toBeVisible({ timeout: 60_000 });
-    await messageRow(page, letter).click();
+    // MessagePosted carries no sender: a first letter from an unknown
+    // mailbox arrives sealed until Alice files it under Bob herself.
+    const sealed = conversationRow(page, "Sealed sender").filter({
+      hasText: runTag,
+    });
+    await expect(sealed).toBeVisible({ timeout: 60_000 });
+    await expect(sealed).toContainText(/\d+ unread/);
+    await sealed.click();
+    await expect(entry(page, letter)).toContainText("Opened · record");
+    const naming = page.getByRole("form", { name: "Name this sender" });
+    await naming.getByLabel("Name this sender").fill(bob.address);
+    await naming.getByRole("button", { name: "Save name" }).click();
     await expect(
-      page.getByLabel("Correspondence").getByText(letter, { exact: true }),
+      page.getByRole("status").filter({ hasText: /Named on this device/ }),
     ).toBeVisible();
+    await expect(sealed).toHaveCount(0);
+    const row = conversationRowByAddress(page, bob.address);
+    await expect(row).toBeVisible();
+    await row.click();
+    await expect(entry(page, letter)).toBeVisible();
+    await expect(page.getByRole("form", { name: "Name this sender" })).toHaveCount(0);
 
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-    await expect(
-      page.getByRole("heading", { name: "New document" }),
-    ).toBeVisible();
-    await page.getByLabel(/^To/).fill(bob.address);
-    await page
-      .getByPlaceholder(
-        "Write a private message, or leave blank when sending attachments only",
-      )
-      .fill(offerBody);
+    await attachTerms(page);
+    await expect(page.getByLabel(/^To/)).toHaveValue(addressPattern(bob.address));
+    await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(offerBody);
     await page.getByRole("button", { name: /OTC offer/ }).click();
     await page.getByLabel("STRK to buy").fill("0.25");
     await page.getByLabel("Quoted token symbol").fill("ETH");
@@ -265,35 +170,39 @@ test("chat sends an encrypted letter and reads Mailbox's records per counterpart
     await expect(
       page.getByRole("heading", { name: "New document" }),
     ).toHaveCount(0, { timeout: 180_000 });
-    await expect(messageRow(page, offerBody)).toBeVisible();
+    const sent = entry(page, offerBody);
+    await expect(sent).toContainText("Sent copy on this device");
+    await expect(
+      sent.getByRole("article", {
+        name: new RegExp(`^Offer: ${terms.replaceAll(".", "\\.")}`),
+      }),
+    ).toBeVisible();
   });
 
-  await test.step("5. Bob's Chat reads the received offer as work, with context", async () => {
+  await test.step("5. Bob's conversation reads the offer as work, with context and actions", async () => {
     await switchIdentity(page, config, "bob");
     await loadExistingKey(page);
     await scanRecent(page);
-    await expect(messageRow(page, offerBody)).toBeVisible({ timeout: 60_000 });
-
-    await page.getByRole("link", { name: "Chat", exact: true }).click();
     const row = conversationRow(page, contactLabel);
-    await expect(row).toContainText("Needs action");
+    await expect(row).toContainText("Needs action", { timeout: 60_000 });
     await expect(row).toContainText(/\d+ unread/);
     await row.click();
     await expect(row).toContainText("Opened");
     await expect(row).not.toContainText("unread");
 
-    const timeline = page.getByRole("list", {
-      name: `Conversation with ${contactLabel}`,
-    });
-    await expect(timeline).toContainText(letter);
-    const offerCard = timeline.getByRole("article", {
+    const conversation = timeline(page);
+    await expect(conversation).toContainText(letter);
+    const offerCard = conversation.getByRole("article", {
       name: new RegExp(`^Offer: ${terms.replaceAll(".", "\\.")}`),
     });
     await expect(offerCard).toBeVisible();
-    await expect(offerCard).toContainText("Accept or decline this offer in Mailbox.");
-    await expect(timeline).toContainText("Saved by Mailbox from decrypted mail");
+    await expect(offerCard).toContainText("Accept or decline this offer.");
+    await expect(
+      offerCard.getByRole("button", { name: "Accept & send 0.25 STRK" }),
+    ).toBeVisible();
+    await expect(entry(page, offerBody)).toContainText("Opened · record");
 
-    const context = page.getByRole("complementary", { name: "Contact context" });
+    const context = contextPanel(page);
     await expect(context.getByRole("region", { name: "Open RFQs" })).toContainText(
       terms,
     );
@@ -305,9 +214,9 @@ test("chat sends an encrypted letter and reads Mailbox's records per counterpart
     await expect(
       context.getByText("OTC OFFER / ONE-SIDED V1", { exact: true }),
     ).toBeVisible();
-    await expect(timeline).toBeVisible();
+    await expect(conversation).toBeVisible();
     await context.getByRole("button", { name: "Show in conversation" }).click();
-    await expect(timeline.locator('li[data-highlight="true"]')).toHaveCount(1);
+    await expect(conversation.locator('li[data-highlight="true"]')).toHaveCount(1);
     await context
       .getByRole("button", { name: `Back to ${contactLabel}` })
       .click();
diff --git a/tests/ui/private-intents.localnet.spec.ts b/tests/ui/private-intents.localnet.spec.ts
index 1658ab6..73f4d2f 100644
--- a/tests/ui/private-intents.localnet.spec.ts
+++ b/tests/ui/private-intents.localnet.spec.ts
@@ -4,8 +4,6 @@ import {
   expect,
   localNetworkToggle,
   localnetIdentity,
-  primeLocalnetMailSeed,
-  restoreLocalnetMailRandomness,
   selectLocalNetwork,
   test,
   type APIRequestContext,
@@ -14,6 +12,18 @@ import {
   type Locator,
   type Page,
 } from "./support/localnet";
+import {
+  COMPOSE_BODY_PLACEHOLDER,
+  conversationRow,
+  conversationRowByAddress,
+  ensureMailboxKey as ensureChatMailboxKey,
+  entry,
+  openFullRecord,
+  openMailboxRecovery,
+  openNewDocument,
+  scanRecent,
+  timeline,
+} from "./support/chat";
 
 test.describe.configure({ mode: "serial" });
 
@@ -42,83 +52,11 @@ async function switchIdentity(
 }
 
 async function ensureMailboxKey(page: Page, identity: LocalnetIdentityId) {
-  let setup = page.getByRole("button", {
-    name: "Load device key & register",
-  });
-  if ((await setup.count()) === 0) {
-    await page.getByRole("button", { name: "Compose", exact: true }).click();
-    setup = page.getByRole("button", {
-      name: "Load device key & register",
-    });
-  }
-  await expect(setup).toBeVisible();
-  await primeLocalnetMailSeed(page, identity);
-  try {
-    await setup.click();
-  } finally {
-    await restoreLocalnetMailRandomness(page);
-  }
-  const backupHeading = page.getByText(
-    "Back up now — this phrase is shown once",
-  );
-  const scanButton = page.getByRole("button", { name: "Check for new mail" });
-  await expect
-    .poll(
-      async () => {
-        if (await backupHeading.isVisible()) return "backup";
-        return (await scanButton.isEnabled()) ? "ready" : "waiting";
-      },
-      { timeout: 120_000 },
-    )
-    .not.toBe("waiting");
-  if (await backupHeading.isVisible()) {
-    const phrase = (
-      await backupHeading.locator("..").locator("code").innerText()
-    ).trim();
-    expect(phrase).toMatch(/^(?:[0-9a-f]{8} ){7}[0-9a-f]{8}$/);
-    await page
-      .getByRole("button", { name: "I saved the backup — open mailbox" })
-      .click();
-  }
-  await expect(scanButton).toBeEnabled({ timeout: 60_000 });
+  await ensureChatMailboxKey(page, identity);
   await openMailboxRecovery(page);
   await expect(
     page.getByRole("button", { name: "Back up RFQ history" }),
   ).toBeEnabled({ timeout: 60_000 });
-  const deleteDraft = page.getByRole("button", {
-    name: "Delete draft…",
-    exact: true,
-  });
-  if ((await deleteDraft.count()) > 0) {
-    page.once("dialog", (dialog) => dialog.accept());
-    await deleteDraft.click();
-  } else {
-    const close = page.getByRole("button", { name: "Close", exact: true });
-    if ((await close.count()) > 0) await close.click();
-  }
-}
-
-/** The recovery panel is a closed disclosure in the mailbox rail. */
-async function openMailboxRecovery(page: Page) {
-  await page
-    .locator("details", {
-      has: page.getByText("Encrypted mailbox recovery", { exact: true }),
-    })
-    .first()
-    .evaluate((element) => {
-      (element as HTMLDetailsElement).open = true;
-    });
-}
-
-async function scanRecent(page: Page) {
-  const button = page.getByRole("button", { name: "Check for new mail" });
-  await expect(button).toBeEnabled({ timeout: 120_000 });
-  await button.click();
-  const inbox = page.getByRole("button", { name: /^Inbox \d+$/ });
-  if ((await inbox.getAttribute("aria-current")) !== "page") {
-    await inbox.click();
-  }
-  await expect(inbox).toHaveAttribute("aria-current", "page");
 }
 
 async function privateBalance(
@@ -451,7 +389,7 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   // Leave the split payout note mature for the Mail-backed invoice journey.
   await createBlocks(request, config.runtimeEpoch, 10);
 
-  await page.goto("/mail/inbox");
+  await page.goto("/chat");
   await selectLocalNetwork(page);
   await switchIdentity(page, config, "alice");
   await ensureMailboxKey(page, "alice");
@@ -519,8 +457,10 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   expect(erasedRecordCount).toBeGreaterThan(0);
 
   await scanRecent(page);
+  // Self-addressed backups file under the mailbox itself.
+  await conversationRow(page, "This mailbox").click();
   await expect(
-    page.getByText("RFQ HISTORY BACKUP", { exact: true }),
+    timeline(page).getByText("RFQ HISTORY BACKUP", { exact: true }),
   ).toBeVisible({ timeout: 60_000 });
   page.once("dialog", (dialog) => dialog.accept());
   await page
@@ -564,13 +504,9 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   const invoiceBody = `Lane U localnet USDC invoice ${Date.now()}`;
   await switchIdentity(page, config, "bob");
   await ensureMailboxKey(page, "bob");
-  await page.getByRole("button", { name: "Compose", exact: true }).click();
+  await openNewDocument(page);
   await page.getByLabel(/^To/).fill(localnetIdentity(config, "alice").address);
-  await page
-    .getByPlaceholder(
-      "Write a private message, or leave blank when sending attachments only",
-    )
-    .fill(invoiceBody);
+  await page.getByPlaceholder(COMPOSE_BODY_PLACEHOLDER).fill(invoiceBody);
   await page.getByRole("button", { name: "+ Invoice", exact: true }).click();
   const invoiceToken = page.getByLabel("Invoice token");
   await expect(invoiceToken.locator("option")).toHaveText(["STRK", "USDC"]);
@@ -588,9 +524,14 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   await switchIdentity(page, config, "alice");
   await ensureMailboxKey(page, "alice");
   await scanRecent(page);
-  const invoiceRow = page.getByRole("button").filter({ hasText: invoiceBody });
-  await expect(invoiceRow).toBeVisible({ timeout: 60_000 });
-  await invoiceRow.click();
+  const bobRow = conversationRowByAddress(
+    page,
+    localnetIdentity(config, "bob").address,
+  );
+  await expect(bobRow).toBeVisible({ timeout: 60_000 });
+  await bobRow.click();
+  const invoiceEntry = entry(page, invoiceBody);
+  await expect(invoiceEntry).toBeVisible({ timeout: 60_000 });
   await expect(
     page.getByText(/This unsigned message requests\s+0\.1 USDC/),
   ).toBeVisible();
@@ -624,7 +565,7 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   await invoiceReview
     .getByRole("button", { name: "Take atomically on LOCALNET" })
     .click();
-  await expect(page).toHaveURL(/\/mail\/inbox$/, { timeout: 5 * 60_000 });
+  await expect(page).toHaveURL(/\/chat$/, { timeout: 5 * 60_000 });
   expect(invokeUrls).toHaveLength(invoiceInvokesBefore + 1);
 
   // The hard return navigation intentionally drops the in-memory wallet and
@@ -632,8 +573,10 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   await switchIdentity(page, config, "alice");
   await ensureMailboxKey(page, "alice");
   await scanRecent(page);
-  await expect(invoiceRow).toBeVisible({ timeout: 120_000 });
-  await invoiceRow.click();
+  await expect(bobRow).toBeVisible({ timeout: 120_000 });
+  await bobRow.click();
+  await expect(invoiceEntry).toBeVisible({ timeout: 120_000 });
+  await openFullRecord(invoiceEntry.getByRole("article", { name: /^Invoice:/ }));
   await expect(
     page.getByText(/USDC note from the private exchange matures/),
   ).toBeVisible();
@@ -654,13 +597,18 @@ test("v3 keeps floors sealed, expires locks, and atomically settles single and s
   await switchIdentity(page, config, "bob");
   await ensureMailboxKey(page, "bob");
   await scanRecent(page);
-  const paymentMemoRow = page.getByRole("button", {
-    name: /Memo\. 0\.1 USDC to settle/,
-  });
-  await expect(paymentMemoRow).toBeVisible({ timeout: 60_000 });
-  await paymentMemoRow.click();
-  await expect(page.getByText("PAYMENT MEMO", { exact: true })).toBeVisible();
-  await expect(page.getByText(/claims they sent 0\.1 USDC/)).toBeVisible();
+  const aliceRow = conversationRowByAddress(
+    page,
+    localnetIdentity(config, "alice").address,
+  );
+  await expect(aliceRow).toBeVisible({ timeout: 60_000 });
+  await aliceRow.click();
+  // Alice's payment memo names only the request; the invoice's Sent copy
+  // says that request is with her, so it lands in her conversation.
+  const memo = timeline(page).getByRole("article", { name: /^Payment memo/ });
+  await expect(memo).toBeVisible({ timeout: 60_000 });
+  await expect(memo.getByText("PAYMENT MEMO", { exact: true })).toBeVisible();
+  await expect(memo.getByText(/claims they sent 0\.1 USDC/)).toBeVisible();
 });
 
 test("modeled localnet authority survives TTL, two tabs, disagreement, reorg, and reload without resubmission", async ({
diff --git a/tests/ui/support/chat.ts b/tests/ui/support/chat.ts
new file mode 100644
index 0000000..02f827d
--- /dev/null
+++ b/tests/ui/support/chat.ts
@@ -0,0 +1,178 @@
+import {
+  expect,
+  primeLocalnetMailSeed,
+  restoreLocalnetMailRandomness,
+  type LocalnetIdentityId,
+  type Locator,
+  type Page,
+} from "./localnet";
+
+/**
+ * Chat is the mailbox: these helpers speak its vocabulary (conversations,
+ * timeline entries, mailbox tools) so every journey reads the same way.
+ */
+
+export const COMPOSE_BODY_PLACEHOLDER =
+  "Write a private message, or leave blank when sending attachments only";
+
+function escapeRegExp(value: string): string {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+/** Displayed addresses are canonical felts; fixture addresses may be zero-padded. */
+export function addressPattern(address: string): RegExp {
+  return new RegExp(address.replace(/^0x0*/i, ""), "i");
+}
+
+export function conversationsRail(page: Page): Locator {
+  return page.getByRole("region", { name: "Conversations", exact: true });
+}
+
+/** A rail row by its displayed name: a saved label, "This mailbox", "Sealed sender". */
+export function conversationRow(page: Page, name: string): Locator {
+  return conversationsRail(page).getByRole("button", {
+    name: new RegExp(escapeRegExp(name)),
+  });
+}
+
+/** A rail row for an unnamed counterparty, matched by its wallet address. */
+export function conversationRowByAddress(page: Page, address: string): Locator {
+  const suffix = address.replace(/^0x0*/i, "").toLowerCase();
+  return conversationsRail(page)
+    .getByRole("button")
+    .filter({ has: page.locator(`strong[title$="${suffix}" i]`) });
+}
+
+export function conversationPane(page: Page): Locator {
+  return page.getByRole("region", { name: "Conversation", exact: true });
+}
+
+/** The open conversation's timeline. */
+export function timeline(page: Page): Locator {
+  return page.getByRole("list", { name: /^Conversation with / });
+}
+
+/** One timeline entry, found by text it carries. */
+export function entry(page: Page, text: string): Locator {
+  return timeline(page).locator(":scope > li").filter({ hasText: text });
+}
+
+export function contextPanel(page: Page): Locator {
+  return page.getByRole("complementary", { name: "Contact context" });
+}
+
+/** Opens a compact record card so its full Mail card (and its actions) show. */
+export async function openFullRecord(card: Locator) {
+  const details = card.locator("details").first();
+  if ((await details.getAttribute("open")) === null) {
+    await card.getByText("Full record", { exact: true }).click();
+  }
+  await expect(details).toHaveAttribute("open", "");
+}
+
+/** The mailbox tools sit under the conversations; each section is a disclosure. */
+export async function openTools(page: Page, title: string) {
+  await page
+    .locator("details", { has: page.locator("summary", { hasText: title }) })
+    .first()
+    .evaluate((element) => {
+      (element as HTMLDetailsElement).open = true;
+    });
+}
+
+export function openMailboxRecovery(page: Page) {
+  return openTools(page, "Encrypted mailbox recovery");
+}
+
+export async function scanRecent(page: Page) {
+  const button = page.getByRole("button", { name: "Check for new mail" });
+  await expect(button).toBeEnabled({ timeout: 120_000 });
+  await button.click();
+  await page.waitForTimeout(100);
+  await expect(button).toBeEnabled({ timeout: 60_000 });
+}
+
+/** Every page load starts with the key unloaded; this loads the persisted one. */
+export async function loadExistingKey(page: Page) {
+  const button = page.getByRole("button", {
+    name: "Load device key & register",
+  });
+  await expect(button).toBeVisible();
+  await button.click();
+  await expect(button).toHaveCount(0, { timeout: 60_000 });
+}
+
+/** Registers the fixture key for an identity, or loads the one already saved. */
+export async function ensureMailboxKey(
+  page: Page,
+  identity: LocalnetIdentityId,
+) {
+  const setup = page.getByRole("button", {
+    name: "Load device key & register",
+  });
+  await expect(setup).toBeVisible();
+  await primeLocalnetMailSeed(page, identity);
+  try {
+    await setup.click();
+  } finally {
+    await restoreLocalnetMailRandomness(page);
+  }
+  const backupHeading = page.getByText(
+    "Back up now — this phrase is shown once",
+  );
+  const scanButton = page.getByRole("button", { name: "Check for new mail" });
+  await expect
+    .poll(
+      async () => {
+        if (await backupHeading.isVisible()) return "backup";
+        return (await scanButton.isEnabled()) ? "ready" : "waiting";
+      },
+      { timeout: 120_000 },
+    )
+    .not.toBe("waiting");
+  if (await backupHeading.isVisible()) {
+    const phrase = (
+      await backupHeading.locator("..").locator("code").innerText()
+    ).trim();
+    expect(phrase).toMatch(/^(?:[0-9a-f]{8} ){7}[0-9a-f]{8}$/);
+    await page
+      .getByRole("button", { name: "I saved the backup — open mailbox" })
+      .click();
+  }
+  await expect(scanButton).toBeEnabled({ timeout: 60_000 });
+}
+
+/** Opens the document composer from the mailbox tools, optionally addressed. */
+export async function openNewDocument(page: Page, recipient?: string) {
+  await openTools(page, "Write to a new address");
+  if (recipient !== undefined) {
+    await page.getByLabel("New conversation address").fill(recipient);
+  }
+  await page.getByRole("button", { name: "New document", exact: true }).click();
+  await expect(
+    page.getByRole("heading", { name: "New document" }),
+  ).toBeVisible();
+}
+
+/** Opens the document composer for the open conversation's counterparty. */
+export async function attachTerms(page: Page) {
+  await page.getByRole("button", { name: "Attach terms", exact: true }).click();
+  await expect(
+    page.getByRole("heading", { name: "New document" }),
+  ).toBeVisible();
+}
+
+export async function closeDocumentIfOpen(page: Page) {
+  const close = page.getByRole("button", {
+    name: "Close document",
+    exact: true,
+  });
+  if ((await close.count()) > 0) await close.click();
+}
+
+/** A module tab in the app header; in-page links may carry the same name. */
+export function navLink(page: Page, name: string): Locator {
+  return page
+    .getByRole("navigation", { name: "APP20 modules" })
+    .getByRole("link", { name, exact: true });
+}

From dcd593bb1df7491184f5d9b399eec26e8cd23a53 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 5 Sep 2026 12:41:13 +0000
Subject: [PATCH 4/4] Fix Chat visual defects found on the localnet pass

- Rail tools: one shrinkable grid column so a long draft address no
  longer widens every section past the rail; draft rows truncate their
  recipient and keep Delete in view.
- Locating a record or sending a letter scrolls only the timeline;
  scrollIntoView had dragged the overflow-hidden desk up.
- The backup restore action takes the mail sheet's primary style.
- Empty-state glyphs are inline SVG icons instead of missing glyphs.
- The naming and new-address forms hide the address book's own save
  control (new AddressBookField bookActions prop) and drop the rail
  form's oversized label.
- A filtered-out desk says "No conversation matches." with a reset
  instead of claiming the device holds no conversations.
- Counterparties header names the Chat handoff.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01DL5RB43eSUCvsor8uVPfUa
---
 src/app/chat/ChatConversationRail.tsx         | 17 +++++++-
 src/app/chat/ChatMailboxTools.tsx             |  2 +-
 src/app/chat/ChatTimeline.tsx                 |  1 +
 src/app/chat/chat.module.css                  | 40 +++++++++++++++++-
 src/app/chat/page.tsx                         | 41 ++++++++++++++++++-
 src/app/contacts/page.tsx                     |  2 +-
 .../address-book/AddressBookField.tsx         |  5 ++-
 src/components/mail/ContactSnapshotCard.tsx   |  7 +++-
 tests/ui/chat.localnet.spec.ts                | 17 ++++++--
 9 files changed, 121 insertions(+), 11 deletions(-)

diff --git a/src/app/chat/ChatConversationRail.tsx b/src/app/chat/ChatConversationRail.tsx
index f4f4111..41b72aa 100644
--- a/src/app/chat/ChatConversationRail.tsx
+++ b/src/app/chat/ChatConversationRail.tsx
@@ -194,7 +194,22 @@ export default function ChatConversationRail({
         ) : (
           <div className={styles.railEmpty}>
             <span className={styles.railGlyph} aria-hidden="true">
-              {searching ? "⌕" : walletGate ? "⚿" : "✉"}
+              {searching ? (
+                <svg viewBox="0 0 24 24">
+                  <circle cx="10.5" cy="10.5" r="6.5" />
+                  <path d="M15.5 15.5 21 21" />
+                </svg>
+              ) : walletGate ? (
+                <svg viewBox="0 0 24 24">
+                  <rect x="4" y="10.5" width="16" height="10" />
+                  <path d="M8 10.5V7.5a4 4 0 0 1 8 0v3M12 14.5v2.5" />
+                </svg>
+              ) : (
+                <svg viewBox="0 0 24 24">
+                  <rect x="3" y="5.5" width="18" height="13" />
+                  <path d="m3 7 9 6.5L21 7" />
+                </svg>
+              )}
             </span>
             {walletGate ? (
               <>
diff --git a/src/app/chat/ChatMailboxTools.tsx b/src/app/chat/ChatMailboxTools.tsx
index c02e5db..4846898 100644
--- a/src/app/chat/ChatMailboxTools.tsx
+++ b/src/app/chat/ChatMailboxTools.tsx
@@ -160,11 +160,11 @@ export default function ChatMailboxTools({
           <AddressBookField
             selfAddress={selfAddress}
             inputAriaLabel="New conversation address"
-            label="Counterparty"
             value={newAddress}
             onChange={setNewAddress}
             placeholder="0x… or saved label"
             disabled={gate === "wallet"}
+            bookActions={false}
           />
           <div className={styles.toolsActions} data-variant="plain">
             <button type="submit" disabled={gate === "wallet" || !newAddress.trim()}>
diff --git a/src/app/chat/ChatTimeline.tsx b/src/app/chat/ChatTimeline.tsx
index e0ba966..60f2e56 100644
--- a/src/app/chat/ChatTimeline.tsx
+++ b/src/app/chat/ChatTimeline.tsx
@@ -135,6 +135,7 @@ function SenderNaming({
         value={value}
         onChange={setValue}
         placeholder="0x… or saved label"
+        bookActions={false}
       />
       <button type="submit" className={styles.namingSave}>
         Save name
diff --git a/src/app/chat/chat.module.css b/src/app/chat/chat.module.css
index 244b8eb..f76a4aa 100644
--- a/src/app/chat/chat.module.css
+++ b/src/app/chat/chat.module.css
@@ -378,7 +378,16 @@
   place-items: center;
   border: 1px dashed var(--shell-orange);
   color: var(--shell-orange);
-  font-size: 20px;
+}
+
+.railGlyph svg {
+  width: 22px;
+  height: 22px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 1.5;
+  stroke-linecap: round;
+  stroke-linejoin: round;
 }
 
 .railFooter {
@@ -1217,6 +1226,25 @@
   display: none;
 }
 
+.welcome button {
+  justify-self: start;
+  min-height: 30px;
+  border: 1px solid var(--shell-line);
+  padding: 0 10px;
+  color: var(--shell-text);
+  background: var(--shell-inset);
+  cursor: pointer;
+  font-family: var(--font-mono-ui), monospace;
+  font-size: var(--label-sm, 9px);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.welcome button:hover {
+  border-color: var(--shell-orange);
+}
+
 /* ── Notices, key setup and the document sheet ──────────────────────────── */
 
 .notice {
@@ -1464,9 +1492,13 @@
 
 /* ── Mailbox tools under the conversations ──────────────────────────────── */
 
+/* One column that can shrink: a long address or label in any section must
+   wrap or truncate inside the rail, never widen every section past it. */
 .tools {
   display: grid;
   flex: none;
+  grid-template-columns: minmax(0, 1fr);
+  min-width: 0;
   margin-top: auto;
   border-top: 2px solid var(--shell-line);
   background: var(--shell-panel);
@@ -1476,6 +1508,8 @@
 .toolsForm,
 .toolsBody {
   display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  min-width: 0;
   gap: var(--space-3, 6px);
   padding: 10px 14px;
 }
@@ -1610,6 +1644,7 @@
 .draftOpen {
   display: grid;
   flex: 1;
+  grid-template-columns: minmax(0, 1fr);
   min-width: 0;
   gap: 2px;
   padding: 8px 14px;
@@ -1629,9 +1664,12 @@
 }
 
 .draftOpen small {
+  overflow: hidden;
   color: var(--shell-muted);
   font-family: var(--font-mono-ui), monospace;
   font-size: var(--label-sm, 9px);
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .draftOpen:hover {
diff --git a/src/app/chat/page.tsx b/src/app/chat/page.tsx
index a420c34..3e9ed1d 100644
--- a/src/app/chat/page.tsx
+++ b/src/app/chat/page.tsx
@@ -348,9 +348,20 @@ export default function ChatPage() {
 
   useEffect(() => {
     if (!highlightId || composeDraft) return;
+    /* Scroll the timeline itself: scrollIntoView would also drag every
+       overflow-hidden ancestor, shifting the whole desk. */
     const frame = window.requestAnimationFrame(() => {
-      document.getElementById(chatEntryDomId(highlightId))?.scrollIntoView({
-        block: "center",
+      const container = scrollRef.current;
+      const element = document.getElementById(chatEntryDomId(highlightId));
+      if (!container || !element) return;
+      const containerBox = container.getBoundingClientRect();
+      const elementBox = element.getBoundingClientRect();
+      const top =
+        container.scrollTop +
+        (elementBox.top - containerBox.top) -
+        (container.clientHeight - elementBox.height) / 2;
+      container.scrollTo({
+        top: Math.max(0, top),
         behavior: prefersReducedMotion() ? "auto" : "smooth",
       });
     });
@@ -791,6 +802,32 @@ export default function ChatPage() {
                 highlightId={highlightId}
                 handlers={timelineHandlers}
               />
+            ) : model.conversations.length ? (
+              <section
+                className={styles.welcome}
+                aria-labelledby="chat-filtered-title"
+              >
+                <p className={styles.kicker}>APP20 / CHAT</p>
+                <h2 id="chat-filtered-title">No conversation matches.</h2>
+                <p>
+                  {model.conversations.length} conversation
+                  {model.conversations.length === 1 ? "" : "s"} on this device
+                  {needsActionOnly && search.trim()
+                    ? " match neither the search nor the needs-action filter."
+                    : needsActionOnly
+                      ? " need nothing from you right now."
+                      : " match nothing in that search."}
+                </p>
+                <button
+                  type="button"
+                  onClick={() => {
+                    setSearch("");
+                    setNeedsActionOnly(false);
+                  }}
+                >
+                  Show all conversations
+                </button>
+              </section>
             ) : (
               <section
                 className={styles.welcome}
diff --git a/src/app/contacts/page.tsx b/src/app/contacts/page.tsx
index 1c98d9b..9a1d6ee 100644
--- a/src/app/contacts/page.tsx
+++ b/src/app/contacts/page.tsx
@@ -125,7 +125,7 @@ function AddressBookPanel({
       <header className={styles.panelHeading}>
         <span>COUNTERPARTIES</span>
         <strong id="rfq-book-title">
-          Device-encrypted directory · RFQ and Mail actions
+          Device-encrypted directory · RFQ and Chat handoffs
         </strong>
       </header>
       <div className={styles.bookBody}>
diff --git a/src/components/address-book/AddressBookField.tsx b/src/components/address-book/AddressBookField.tsx
index 6050ddb..efe8edf 100644
--- a/src/components/address-book/AddressBookField.tsx
+++ b/src/components/address-book/AddressBookField.tsx
@@ -32,6 +32,8 @@ type AddressBookFieldProps = {
   rows?: number;
   required?: boolean;
   inputRef?: Ref<HTMLInputElement | HTMLTextAreaElement>;
+  /** Whether the row offers saving or removing the entry; false keeps the field to the picker and the input. */
+  bookActions?: boolean;
 };
 
 export default function AddressBookField({
@@ -51,6 +53,7 @@ export default function AddressBookField({
   rows = 3,
   required = false,
   inputRef,
+  bookActions = true,
 }: AddressBookFieldProps) {
   const [entries, setEntries] = useState<AddressBookEntry[]>([]);
   const [bookError, setBookError] = useState<string | null>(null);
@@ -222,7 +225,7 @@ export default function AddressBookField({
             disabled={disabled}
           />
         )}
-        {saving ? null : resolved?.entry ? (
+        {!bookActions || saving ? null : resolved?.entry ? (
           <button
             type="button"
             onClick={() => void removeEntry(resolved.entry?.label ?? "")}
diff --git a/src/components/mail/ContactSnapshotCard.tsx b/src/components/mail/ContactSnapshotCard.tsx
index 13c35e6..3616923 100644
--- a/src/components/mail/ContactSnapshotCard.tsx
+++ b/src/components/mail/ContactSnapshotCard.tsx
@@ -45,7 +45,12 @@ export default function ContactSnapshotCard({
       </p>
       {onMerge ? (
         <div className={styles.sheetActions}>
-          <button type="button" disabled={busy} onClick={onMerge}>
+          <button
+            type="button"
+            className={styles.primaryButton}
+            disabled={busy}
+            onClick={onMerge}
+          >
             {contacts
               ? "Merge verified contacts"
               : "Merge verified RFQ history"}
diff --git a/tests/ui/chat.localnet.spec.ts b/tests/ui/chat.localnet.spec.ts
index cfb428e..3843bf2 100644
--- a/tests/ui/chat.localnet.spec.ts
+++ b/tests/ui/chat.localnet.spec.ts
@@ -16,6 +16,7 @@ import {
   conversationPane,
   conversationRow,
   conversationRowByAddress,
+  conversationsRail,
   ensureMailboxKey,
   entry,
   loadExistingKey,
@@ -229,8 +230,18 @@ test("chat carries a letter and an attached offer between two mailboxes", async
     await page.getByLabel("Search conversations").fill(`${quote} ETH`);
     await expect(conversationRow(page, contactLabel)).toBeVisible();
     await page.getByLabel("Search conversations").fill("nothing matches this");
-    await expect(page.getByText("No conversation matches")).toBeVisible();
-    await page.getByLabel("Search conversations").fill("");
-    await page.getByRole("button", { name: /Needs action only/ }).click();
+    // Rail and centre pane agree, and the centre offers the way back.
+    await expect(
+      conversationsRail(page).getByText("No conversation matches", { exact: true }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole("heading", { name: "No conversation matches." }),
+    ).toBeVisible();
+    await page.getByRole("button", { name: "Show all conversations" }).click();
+    await expect(page.getByLabel("Search conversations")).toHaveValue("");
+    await expect(
+      page.getByRole("button", { name: /Needs action only/ }),
+    ).toHaveAttribute("aria-pressed", "false");
+    await expect(conversationRow(page, contactLabel)).toBeVisible();
   });
 });