From 2e5def4b9722b41a41f85965bf78f2bab1a1f964 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 10 Sep 2026 11:50:55 -0700
Subject: [PATCH 01/32] Seed v3 Colophon design system for OpenClaw Windows Hub

Carry over the v1 design.json tokens/brand/authority and principles.md verbatim, port all 9 components (Button, Field, Card, Badge, ComposerPicker, ChatBubble, ChatComposer, ChatThread, ExampleScreen) from raw-CSS attrs.style to v3 Auto Layout with token-bound layout/appearance, and add a v3 colophon.jsonc presentation profile. Adds the idempotent Colophon pointer block to AGENTS.md.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
---
 .agents/design/colophon.jsonc   |  60 ++++
 .agents/design/components.jsonc | 471 ++++++++++++++++++++++++++++++++
 .agents/design/design.json      | 114 ++++++++
 .agents/design/principles.md    |  55 ++++
 AGENTS.md                       |  23 ++
 5 files changed, 723 insertions(+)
 create mode 100644 .agents/design/colophon.jsonc
 create mode 100644 .agents/design/components.jsonc
 create mode 100644 .agents/design/design.json
 create mode 100644 .agents/design/principles.md

diff --git a/.agents/design/colophon.jsonc b/.agents/design/colophon.jsonc
new file mode 100644
index 0000000000..14e0dffbb7
--- /dev/null
+++ b/.agents/design/colophon.jsonc
@@ -0,0 +1,60 @@
+{
+  "$schema": "https://raw.githubusercontent.com/karkarl/colophon/main/extensions/colophon/colophon.schema.json",
+  "schemaVersion": 1,
+  "extends": "colophon/default",
+  "brand": {
+    "name": "Windows Fluent UI for OpenClaw",
+    "tagline": "A calm native Windows companion for your AI assistant."
+  },
+  "theme": {
+    "light": {
+      "colors": {
+        "canvas": { "$token": "paper" },
+        "sidebar": { "$token": "surface" },
+        "foreground": { "$token": "ink" },
+        "muted": { "$token": "muted" },
+        "border": { "$token": "line" },
+        "accent": { "$token": "accent" },
+        "accentForeground": { "$token": "accentInk" }
+      },
+      "typography": {
+        "body": { "$token": "body" },
+        "heading": { "$token": "display" },
+        "mono": { "$token": "mono" }
+      },
+      "shape": {
+        "control": { "$token": "sm" },
+        "panel": { "$token": "lg" }
+      }
+    },
+    "dark": {
+      "colors": {
+        "canvas": { "$token": "paper", "mode": "dark" },
+        "sidebar": { "$token": "surface", "mode": "dark" },
+        "foreground": { "$token": "ink", "mode": "dark" },
+        "muted": { "$token": "muted", "mode": "dark" },
+        "border": { "$token": "line", "mode": "dark" },
+        "accent": { "$token": "accent", "mode": "dark" },
+        "accentForeground": { "$token": "accentInk", "mode": "dark" }
+      }
+    }
+  },
+  "navigation": {
+    "sections": [
+      { "id": "brand", "label": "Brand", "target": "brand" },
+      { "id": "components", "label": "Components", "target": "components" }
+    ],
+    "components": {
+      "presentation": "flat-list",
+      "searchable": true
+    }
+  },
+  "templates": {
+    "components": {
+      "tabs": ["spec", "usage", "demo"],
+      "layout": "stack",
+      "tableOfContents": false,
+      "modeComparison": "light-dark"
+    }
+  }
+}
diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
new file mode 100644
index 0000000000..20d898f831
--- /dev/null
+++ b/.agents/design/components.jsonc
@@ -0,0 +1,471 @@
+// components.jsonc — the UI patterns the OpenClaw Windows team has decided on, as data.
+//
+// This is a framework-agnostic relational element tree with token-bound Auto Layout
+// and optional parent-relative freeform positioning. It renders live in the Colophon
+// and Prototype canvases and ports cleanly because layout intent is semantic, not
+// executable CSS. This is DESIGN INTENT for the canvas preview — not shipping code.
+//
+// To ship, port these patterns into the app using the port targets in design.json
+// `authority`: most surfaces ship as native WinUI 3 / C# (port via
+// github.com/microsoft/win-dev-skills), while the chat surface (ChatBubble,
+// ChatComposer, ChatThread) ships via Reactor (github.com/microsoft/microsoft-ui-reactor).
+// Don't ship this verbatim; bind Fluent ThemeResource keys, never the preview hex.
+//
+// Every object node has a stable, unique `id`. Node kinds:
+//   element   { "id", "el", "class"?, "attrs"?, "layout"?, "position"?, "margin"?, "appearance"?, "children"? }
+//   component { "id", "component", "props"?, "layout"?, "position"?, "margin"?, "appearance"? }
+//   string    "literal"  or  "{prop}"  for prop interpolation
+//
+// Auto Layout: layout.mode vertical|horizontal|grid|freeform|none; gap/padding/margin
+// reference design.json spacing tokens ("1".."8"), never raw px; align/justify/columns/
+// wrap/grow; width/height "fill"|"hug"|number. Freeform (v3): a layout.mode "freeform"
+// parent establishes a coordinate system; direct children may set
+// position { mode:"absolute", x, y } in px relative to that parent.
+//
+// Appearance inherits from the parent/class; add only intentional, token-bound
+// overrides: fontFamily display|body|mono; textStyle (typography scale name);
+// color/background/borderColor (color-token name); radius/shadow (token name); textAlign.
+{
+  "meta": {
+    "version": 3,
+    "updatedBy": "copilot",
+    "note": "Windows Fluent UI for OpenClaw — ported from the v1 raw-CSS components.jsonc to v3 Auto Layout. WinUI-derived pixel padding is snapped to the nearest 4px spacing token; per-component notes record the source values and any approximation."
+  },
+  "components": [
+    {
+      "name": "Button",
+      "note": "Primary action. One per view — it's where the eye should land. Padding mirrors WinUI's default ButtonPadding (11,5,11,6), snapped to spacing tokens 3 (12≈11) and 1 (4≈5/6). In-app MinWidth 100px keeps short labels (OK / Connect) from cramping and gives side-by-side buttons a consistent footprint; that minimum has no spacing-token equivalent, so it stays a port note and the preview hugs its label.",
+      "props": { "children": "Save changes", "variant": "primary" },
+      "root": {
+        "id": "button-root",
+        "el": "button",
+        "class": "ds-btn ds-btn-{variant}",
+        "layout": {
+          "mode": "horizontal",
+          "padding": { "x": "3", "y": "1" },
+          "align": "center",
+          "justify": "center",
+          "width": "hug"
+        },
+        "children": ["{children}"]
+      }
+    },
+    {
+      "name": "Field",
+      "note": "Text input with a quiet label above it — the field is the subject. Input padding mirrors WinUI TextControlThemePadding (10,5,6,6), snapped to tokens 2 (8≈10/6 horizontal) and 1 (4≈5/6 vertical). In-app MinHeight 32px lines a field up with a Button on the same row; that minimum stays a port note.",
+      "props": { "label": "Gateway address", "placeholder": "127.0.0.1:18789" },
+      "root": {
+        "id": "field-root",
+        "el": "label",
+        "class": "ds-field",
+        "layout": { "mode": "vertical", "gap": "2", "width": "fill" },
+        "children": [
+          {
+            "id": "field-label",
+            "el": "span",
+            "class": "ds-field-label",
+            "children": ["{label}"]
+          },
+          {
+            "id": "field-input",
+            "el": "input",
+            "class": "ds-input",
+            "attrs": { "placeholder": "{placeholder}" },
+            "layout": { "padding": { "x": "2", "y": "1" }, "width": "fill" }
+          }
+        ]
+      }
+    },
+    {
+      "name": "Card",
+      "note": "Content card. Flat by default — a 1px hairline border, not a drop shadow. Padding mirrors the WinUI Gallery card (16,12) as tokens 4 (16) and 3 (12) exactly, with the `md` radius and a `line`-colored border supplied by the ds-card class. Never nest a card inside a card.",
+      "props": { "title": "Windows node", "body": "Paired · 6 capabilities exposed over MCP." },
+      "root": {
+        "id": "card-root",
+        "el": "article",
+        "class": "ds-card",
+        "layout": {
+          "mode": "vertical",
+          "gap": "2",
+          "padding": { "x": "4", "y": "3" },
+          "width": "fill"
+        },
+        "children": [
+          {
+            "id": "card-title",
+            "el": "h3",
+            "class": "ds-card-title",
+            "children": ["{title}"]
+          },
+          {
+            "id": "card-body",
+            "el": "p",
+            "class": "ds-card-body",
+            "children": ["{body}"]
+          },
+          {
+            "id": "card-link",
+            "el": "a",
+            "class": "ds-link",
+            "attrs": { "href": "#" },
+            "margin": { "top": "1" },
+            "children": ["Open report →"]
+          }
+        ]
+      }
+    },
+    {
+      "name": "Badge",
+      "note": "Status pill. Uses semantic color tokens, never a raw hex. Padding tokens 3/1 give the pill a compact footprint; the `pill` radius and tone color come from the ds-badge class.",
+      "props": { "children": "Connected", "tone": "positive" },
+      "root": {
+        "id": "badge-root",
+        "el": "span",
+        "class": "ds-badge ds-badge-{tone}",
+        "layout": {
+          "mode": "horizontal",
+          "padding": { "x": "3", "y": "1" },
+          "align": "center",
+          "width": "hug"
+        },
+        "children": ["{children}"]
+      }
+    },
+    {
+      "name": "ComposerPicker",
+      "note": "Subtle inline picker — text label + chevron, no border until hover in the app. Used for the model and reasoning-effort selectors; reads as a quiet dropdown, not a button. 32px control height with `small` (13/18) muted text and the `sm` radius. (Preview shows the rest state; the transparent rest border is intentionally omitted rather than bound to a token.)",
+      "props": { "label": "Model" },
+      "root": {
+        "id": "composer-picker-root",
+        "el": "button",
+        "attrs": { "type": "button" },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "1",
+          "padding": { "x": "2" },
+          "align": "center",
+          "height": 32,
+          "width": "hug"
+        },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "small",
+          "color": "muted",
+          "radius": "sm"
+        },
+        "children": [
+          {
+            "id": "composer-picker-label",
+            "el": "span",
+            "children": ["{label}"]
+          },
+          {
+            "id": "composer-picker-chevron",
+            "el": "svg",
+            "attrs": { "width": "12", "height": "12", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+            "children": [
+              { "id": "composer-picker-chevron-path", "el": "path", "attrs": { "d": "M6 9l6 6 6-6" } }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "ChatBubble",
+      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `line` border, `pill` radius) to the LEFT of a bubble on a `surface` fill with a `line` border. The `bubble` radius (16px) is friendlier than the 8/12px control radii; padding tokens 4/3 mirror the v1 12/16. Footer reads timestamp · usage · Copy — the same used/context (pct%) string ChatUsageFormatter produces. Mirrors OpenClawChatTimeline; ships via Reactor. Bubble max-width min(80%, 520px) is a Reactor port note (no token equivalent). (User messages ride the accent on the right in-app; this previews the assistant variant.)",
+      "props": {
+        "time": "2:14 PM",
+        "usage": "12.5K/200K (6%)",
+        "children": "Paired to the gateway — 6 Windows node capabilities are live."
+      },
+      "root": {
+        "id": "chat-bubble-root",
+        "el": "div",
+        "layout": { "mode": "horizontal", "gap": "2", "align": "start" },
+        "children": [
+          {
+            "id": "chat-bubble-avatar",
+            "el": "div",
+            "attrs": { "aria-hidden": "true" },
+            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 36, "height": 36 },
+            "appearance": { "background": "surface", "borderColor": "line", "color": "muted", "radius": "pill" },
+            "children": [
+              {
+                "id": "chat-bubble-avatar-glyph",
+                "el": "svg",
+                "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "currentColor", "aria-hidden": "true" },
+                "children": [
+                  { "id": "chat-bubble-avatar-path", "el": "path", "attrs": { "d": "M12 2.5l1.7 5.1a4 4 0 0 0 2.7 2.7l5.1 1.7-5.1 1.7a4 4 0 0 0-2.7 2.7L12 21.5l-1.7-5.1a4 4 0 0 0-2.7-2.7L2.5 12l5.1-1.7a4 4 0 0 0 2.7-2.7L12 2.5z" } }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "chat-bubble-stack",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "align": "start" },
+            "children": [
+              {
+                "id": "chat-bubble-message",
+                "el": "div",
+                "layout": { "mode": "vertical", "padding": { "x": "4", "y": "3" } },
+                "appearance": { "fontFamily": "body", "textStyle": "body", "background": "surface", "color": "ink", "borderColor": "line", "radius": "bubble" },
+                "children": ["{children}"]
+              },
+              {
+                "id": "chat-bubble-footer",
+                "el": "div",
+                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2" }, "align": "center" },
+                "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                "children": [
+                  { "id": "chat-bubble-time", "el": "span", "children": ["{time}"] },
+                  { "id": "chat-bubble-dot", "el": "span", "attrs": { "aria-hidden": "true" }, "children": ["·"] },
+                  { "id": "chat-bubble-usage", "el": "span", "children": ["{usage}"] },
+                  {
+                    "id": "chat-bubble-copy",
+                    "el": "button",
+                    "attrs": { "type": "button", "title": "Copy", "aria-label": "Copy message" },
+                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 20, "height": 20 },
+                    "appearance": { "color": "muted", "radius": "sm" },
+                    "children": [
+                      {
+                        "id": "chat-bubble-copy-glyph",
+                        "el": "svg",
+                        "attrs": { "width": "14", "height": "14", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "children": [
+                          { "id": "chat-bubble-copy-rect", "el": "rect", "attrs": { "x": "9", "y": "9", "width": "11", "height": "11", "rx": "2" } },
+                          { "id": "chat-bubble-copy-path", "el": "path", "attrs": { "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1" } }
+                        ]
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "ChatComposer",
+      "note": "Chat input. A rounded `surface` panel (`md` radius) with a hairline `line` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, model picker, reasoning-effort picker; right cluster = mic + Send. Only Send spends the accent; every other control stays subtle so the toolbar reads as quiet chrome. Textarea min 56 / max 200px growth is a Reactor port note. (Preview shows the rest state.)",
+      "props": {
+        "placeholder": "Message OpenClaw…",
+        "model": "Claude Opus 4.8",
+        "effort": "High"
+      },
+      "root": {
+        "id": "chat-composer-root",
+        "el": "div",
+        "layout": { "mode": "vertical", "gap": "2", "padding": "2", "width": "fill" },
+        "appearance": { "background": "surface", "borderColor": "line", "radius": "md" },
+        "children": [
+          {
+            "id": "chat-composer-input",
+            "el": "textarea",
+            "attrs": { "rows": "2", "placeholder": "{placeholder}" },
+            "layout": { "padding": "2", "width": "fill" },
+            "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }
+          },
+          {
+            "id": "chat-composer-toolbar",
+            "el": "div",
+            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "justify": "space-between", "width": "fill" },
+            "children": [
+              {
+                "id": "chat-composer-left",
+                "el": "div",
+                "layout": { "mode": "horizontal", "gap": "1", "align": "center" },
+                "children": [
+                  {
+                    "id": "chat-composer-add",
+                    "el": "button",
+                    "attrs": { "type": "button", "title": "Add context", "aria-label": "Add context" },
+                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
+                    "appearance": { "color": "muted", "radius": "sm" },
+                    "children": [
+                      {
+                        "id": "chat-composer-add-glyph",
+                        "el": "svg",
+                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "children": [
+                          { "id": "chat-composer-add-path", "el": "path", "attrs": { "d": "M12 5v14M5 12h14" } }
+                        ]
+                      }
+                    ]
+                  },
+                  { "id": "chat-composer-model", "component": "ComposerPicker", "props": { "label": "{model}" } },
+                  { "id": "chat-composer-effort", "component": "ComposerPicker", "props": { "label": "{effort}" } }
+                ]
+              },
+              {
+                "id": "chat-composer-right",
+                "el": "div",
+                "layout": { "mode": "horizontal", "gap": "1", "align": "center" },
+                "children": [
+                  {
+                    "id": "chat-composer-mic",
+                    "el": "button",
+                    "attrs": { "type": "button", "title": "Dictate", "aria-label": "Dictate" },
+                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
+                    "appearance": { "color": "muted", "radius": "sm" },
+                    "children": [
+                      {
+                        "id": "chat-composer-mic-glyph",
+                        "el": "svg",
+                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "children": [
+                          { "id": "chat-composer-mic-rect", "el": "rect", "attrs": { "x": "9", "y": "3", "width": "6", "height": "11", "rx": "3" } },
+                          { "id": "chat-composer-mic-path", "el": "path", "attrs": { "d": "M5 11a7 7 0 0 0 14 0M12 18v3" } }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "chat-composer-send",
+                    "el": "button",
+                    "attrs": { "type": "button", "title": "Send", "aria-label": "Send" },
+                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
+                    "appearance": { "background": "accent", "color": "accentInk", "radius": "sm" },
+                    "children": [
+                      {
+                        "id": "chat-composer-send-glyph",
+                        "el": "svg",
+                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "children": [
+                          { "id": "chat-composer-send-path", "el": "path", "attrs": { "d": "M12 19V5M5 12l7-7 7 7" } }
+                        ]
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "ChatThread",
+      "note": "A short thread: the \"does chat hang together\" check — a user turn (accent bubble on the right) and an assistant turn (with its Copy affordance + context-usage readout), then the composer. Thread max-width 560px is a Reactor port note.",
+      "root": {
+        "id": "chat-thread-root",
+        "el": "div",
+        "layout": { "mode": "vertical", "gap": "3", "width": "fill" },
+        "children": [
+          {
+            "id": "chat-thread-user",
+            "el": "div",
+            "layout": { "mode": "horizontal", "justify": "end", "width": "fill" },
+            "children": [
+              {
+                "id": "chat-thread-user-stack",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "1", "align": "end" },
+                "children": [
+                  {
+                    "id": "chat-thread-user-bubble",
+                    "el": "div",
+                    "layout": { "mode": "vertical", "padding": { "x": "4", "y": "3" } },
+                    "appearance": { "fontFamily": "body", "textStyle": "body", "background": "accent", "color": "accentInk", "radius": "bubble" },
+                    "children": ["Can you list the Windows node capabilities?"]
+                  },
+                  {
+                    "id": "chat-thread-user-footer",
+                    "el": "div",
+                    "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2" }, "align": "center" },
+                    "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                    "children": [
+                      { "id": "chat-thread-user-time", "el": "span", "children": ["2:14 PM"] }
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "chat-thread-assistant",
+            "component": "ChatBubble",
+            "props": { "time": "2:14 PM", "usage": "12.5K/200K (6%)", "children": "Paired to the gateway — 6 capabilities are live, including system.run and clipboard access." }
+          },
+          { "id": "chat-thread-composer", "component": "ChatComposer" }
+        ]
+      }
+    },
+    {
+      "name": "ExampleScreen",
+      "note": "A representative Connection screen composed from the pieces above — the \"does it hang together\" check for the whole system. The status board is a freeform layer so the two cards can overlap into a Fluent-style dashboard, exercising v3 absolute positioning alongside Auto Layout.",
+      "root": {
+        "id": "example-screen-root",
+        "el": "section",
+        "class": "ds-screen",
+        "layout": { "mode": "vertical", "gap": "5", "width": "fill" },
+        "children": [
+          {
+            "id": "example-screen-head",
+            "el": "header",
+            "class": "ds-screen-head",
+            "layout": { "mode": "horizontal", "gap": "4", "align": "start", "justify": "space-between", "width": "fill" },
+            "children": [
+              {
+                "id": "example-screen-heading",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "1" },
+                "children": [
+                  { "id": "example-screen-eyebrow", "el": "p", "class": "ds-eyebrow", "children": ["Connection"] },
+                  { "id": "example-screen-title", "el": "h2", "class": "ds-screen-title", "children": ["OpenClaw Windows Hub"] }
+                ]
+              },
+              {
+                "id": "example-screen-status",
+                "component": "Badge",
+                "props": { "tone": "positive", "children": "Connected" }
+              }
+            ]
+          },
+          {
+            "id": "example-screen-board",
+            "el": "div",
+            "class": "ds-grid",
+            "layout": { "mode": "freeform", "width": "fill", "height": 176 },
+            "children": [
+              {
+                "id": "example-screen-gateway",
+                "component": "Card",
+                "position": { "mode": "absolute", "x": 0, "y": 0 },
+                "props": { "title": "Gateway", "body": "Paired to OpenClawGateway · last seen just now." },
+                "layout": { "width": 280, "height": 148 }
+              },
+              {
+                "id": "example-screen-node",
+                "component": "Card",
+                "position": { "mode": "absolute", "x": 248, "y": 28 },
+                "props": { "title": "Windows node", "body": "6 capabilities exposed over MCP." },
+                "layout": { "width": 280, "height": 148 }
+              }
+            ]
+          },
+          {
+            "id": "example-screen-row",
+            "el": "div",
+            "class": "ds-row",
+            "layout": { "mode": "horizontal", "gap": "4", "align": "end", "wrap": true, "width": "fill" },
+            "children": [
+              {
+                "id": "example-screen-field",
+                "component": "Field",
+                "props": { "label": "Gateway address", "placeholder": "127.0.0.1:18789" },
+                "layout": { "grow": true }
+              },
+              {
+                "id": "example-screen-connect",
+                "component": "Button",
+                "props": { "children": "Connect", "variant": "primary" }
+              }
+            ]
+          }
+        ]
+      }
+    }
+  ]
+}
diff --git a/.agents/design/design.json b/.agents/design/design.json
new file mode 100644
index 0000000000..76551ef296
--- /dev/null
+++ b/.agents/design/design.json
@@ -0,0 +1,114 @@
+{
+  "$schema": "https://agents.design/schema/v1",
+  "meta": {
+    "version": 1,
+    "updatedBy": "xaml+manual",
+    "note": "These tokens are the source of truth for DESIGN (brand, color, type, spacing, principles) and are framework-agnostic — components.jsx shows design intent for the canvas preview, not shipping code. They were captured by manual inspection of the repo's WinUI 3 / XAML and C# surfaces (the CSS/JSX scanner finds no files in a XAML repo) and map to Windows Fluent system resources (SystemAccentColor, Mica, Segoe UI Variable). To ship, port the design into native code via the port targets in `authority`. Edit in the Design System canvas or directly."
+  },
+  "authority": {
+    "designSource": "self",
+    "owner": "OpenClaw Windows (openclaw/openclaw-windows-node)",
+    "syncProcess": "Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.",
+    "port": {
+      "authoritySource": "Native WinUI 3 / C# (Windows Fluent)",
+      "syncSource": "https://github.com/microsoft/win-dev-skills",
+      "helperAgent": "win-dev-skills"
+    },
+    "portOverrides": [
+      {
+        "area": "chat",
+        "components": ["ChatBubble", "ChatComposer", "ChatThread"],
+        "authoritySource": "Reactor (Microsoft.UI.Reactor)",
+        "syncSource": "https://github.com/microsoft/microsoft-ui-reactor",
+        "helperAgent": ""
+      }
+    ]
+  },
+  "brand": {
+    "name": "Windows Fluent UI for OpenClaw",
+    "tagline": "A calm native Windows companion for your AI assistant.",
+    "description": "Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite — a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions — Mica surfaces, the user's system accent, and Segoe UI Variable type — so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.",
+    "surface": "product",
+    "voice": "Clear, respectful, and native to Windows. Explain pairing, permissions, and security plainly. State what will happen and why; never alarmist, never hype.",
+    "personality": ["native", "trustworthy", "calm", "precise"],
+    "antiReferences": [
+      "custom-skinned controls that fight the OS theme",
+      "neon gradients and glassmorphism overload",
+      "ignoring the user's system accent or light/dark preference",
+      "cramming a web dashboard into a desktop window",
+      "hard-coded hex that breaks in dark or high-contrast mode"
+    ]
+  },
+  "colors": [
+    { "name": "ink",       "value": "#1b1b1b", "resource": "TextFillColorPrimaryBrush",         "themes": { "dark": "#ffffff", "highContrast": "#ffffff" }, "usage": "Primary text, headings. Fluent TextFillColorPrimary on light." },
+    { "name": "paper",     "value": "#f3f3f3", "resource": "ApplicationPageBackgroundThemeBrush", "themes": { "dark": "#202020", "highContrast": "#000000" }, "usage": "App / page background. Mica base / ApplicationPageBackground (light)." },
+    { "name": "surface",   "value": "#fbfbfb", "resource": "CardBackgroundFillColorDefaultBrush", "themes": { "dark": "#2b2b2b", "highContrast": "#000000" }, "usage": "Cards, flyouts, inputs. Fluent CardBackgroundFillColorDefault." },
+    { "name": "muted",     "value": "#5d5d5d", "resource": "TextFillColorSecondaryBrush",        "themes": { "dark": "#c8c8c8", "highContrast": "#ffffff" }, "usage": "Secondary text, captions. Fluent TextFillColorSecondary/Tertiary." },
+    { "name": "line",      "value": "#e5e5e5", "resource": "CardStrokeColorDefaultBrush",        "themes": { "dark": "#303030", "highContrast": "#ffffff" }, "usage": "Borders, dividers. Fluent CardStrokeColorDefault / DividerStroke." },
+    { "name": "accent",    "value": "#0067c0", "resource": "AccentFillColorDefaultBrush",         "themes": { "dark": "#4cc2ff", "highContrast": "#ffff00" }, "usage": "Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light)." },
+    { "name": "accentInk", "value": "#ffffff", "resource": "TextOnAccentFillColorPrimaryBrush",   "themes": { "dark": "#000000", "highContrast": "#000000" }, "usage": "Text/glyphs on accent fills." },
+    { "name": "positive",  "value": "#0f7b0f", "resource": "SystemFillColorSuccessBrush",         "themes": { "dark": "#6ccb5f", "highContrast": "#3ff23f" }, "usage": "Success / connected states. Fluent SystemFillColorSuccess." },
+    { "name": "warning",   "value": "#9d5d00", "resource": "SystemFillColorCautionBrush",         "themes": { "dark": "#fcd116", "highContrast": "#ffb000" }, "usage": "Warnings / attention. Fluent SystemFillColorCaution." },
+    { "name": "critical",  "value": "#c42b1c", "resource": "SystemFillColorCriticalBrush",        "themes": { "dark": "#ff99a4", "highContrast": "#ff5449" }, "usage": "Errors, disconnected, destructive. Fluent SystemFillColorCritical." },
+    { "name": "subtleHover",   "value": "rgba(0,0,0,0.037)", "resource": "SubtleFillColorSecondaryBrush", "themes": { "dark": "rgba(255,255,255,0.0605)", "highContrast": "transparent" }, "usage": "Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000)." },
+    { "name": "subtlePressed", "value": "rgba(0,0,0,0.024)", "resource": "SubtleFillColorTertiaryBrush",  "themes": { "dark": "rgba(255,255,255,0.0419)", "highContrast": "transparent" }, "usage": "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)." }
+  ],
+  "typography": {
+    "display": {
+      "family": "\"Segoe UI Variable Display\", \"Segoe UI Variable\", \"Segoe UI\", system-ui, sans-serif",
+      "weights": [400, 600],
+      "usage": "Page and section titles. Segoe UI Variable Display optical size."
+    },
+    "body": {
+      "family": "\"Segoe UI Variable Text\", \"Segoe UI Variable\", \"Segoe UI\", system-ui, sans-serif",
+      "weights": [400, 600],
+      "usage": "Body copy, UI labels, buttons. Segoe UI Variable Text optical size."
+    },
+    "mono": {
+      "family": "\"Cascadia Mono\", \"Cascadia Code\", Consolas, \"SFMono-Regular\", monospace",
+      "weights": [400],
+      "usage": "Commands, endpoints, tokens, logs, timestamps. Used heavily across setup and diagnostics surfaces."
+    },
+    "scale": [
+      { "name": "display", "size": "40px", "lineHeight": "50px", "weight": 600, "role": "display", "tracking": "-0.01em" },
+      { "name": "title",   "size": "28px", "lineHeight": "36px", "weight": 600, "role": "display" },
+      { "name": "heading", "size": "20px", "lineHeight": "28px", "weight": 600, "role": "body" },
+      { "name": "body",    "size": "14px", "lineHeight": "20px", "weight": 400, "role": "body" },
+      { "name": "small",   "size": "13px", "lineHeight": "18px", "weight": 400, "role": "body" },
+      { "name": "caption", "size": "12px", "lineHeight": "16px", "weight": 400, "role": "body" }
+    ]
+  },
+  "spacing": {
+    "unit": 4,
+    "scale": [
+      { "name": "1", "value": "4px" },
+      { "name": "2", "value": "8px" },
+      { "name": "3", "value": "12px" },
+      { "name": "4", "value": "16px" },
+      { "name": "5", "value": "24px" },
+      { "name": "6", "value": "32px" },
+      { "name": "7", "value": "48px" },
+      { "name": "8", "value": "64px" }
+    ]
+  },
+  "radii": [
+    { "name": "sm",   "value": "4px",   "usage": "Buttons, inputs, small controls. Fluent ControlCornerRadius." },
+    { "name": "md",   "value": "8px",   "usage": "Cards, dialogs, flyouts. Fluent OverlayCornerRadius." },
+    { "name": "lg",   "value": "12px",  "usage": "Large panels and grouped surfaces." },
+    { "name": "bubble", "value": "16px", "usage": "Chat message bubbles — intentionally friendlier than control radii. Mirrors OpenClawChatTimeline CornerRadius 16." },
+    { "name": "pill", "value": "999px", "usage": "Status pills, badges, toggles." }
+  ],
+  "shadows": [
+    { "name": "sm", "value": "0 1px 2px rgba(0,0,0,0.10)" },
+    { "name": "md", "value": "0 4px 16px rgba(0,0,0,0.12)" },
+    { "name": "lg", "value": "0 12px 40px rgba(0,0,0,0.16)" }
+  ],
+  "principles": [
+    "Defer to Windows. Theme off SystemAccentColor and Fluent resources so the app follows the user's accent, light/dark, and high-contrast choices.",
+    "One accent, and it means \"act here\". Selection, focus, and primary actions share the system accent; don't spend it on decoration.",
+    "Hierarchy over decoration — size, weight, and space do the work before color does.",
+    "State must be legible: connected, pairing, and error states read clearly via positive/warning/critical, never color alone.",
+    "No hard-coded hex in UI. Use tokens/theme resources so dark and high-contrast modes stay correct.",
+    "Motion is a cue, not a garnish: 120-200ms ease-out, no bounce."
+  ]
+}
diff --git a/.agents/design/principles.md b/.agents/design/principles.md
new file mode 100644
index 0000000000..5baaa5cd30
--- /dev/null
+++ b/.agents/design/principles.md
@@ -0,0 +1,55 @@
+# Design principles — Windows Fluent UI for OpenClaw
+
+> This is the prose companion to `design.json`. Designers write here; developers
+> and Copilot read here. Keep it short enough that people actually read it.
+> This is the design system for the **OpenClaw Windows Hub** app.
+
+## Design leads, native code ships
+These files are the source of truth for **design** — tokens, component intent, and
+principles — and are framework-agnostic. The React in `components.jsx` is design
+intent for the canvas preview, not shipping code. How a design becomes shipping code
+is recorded in `design.json` under `authority`:
+
+- **Default:** surfaces ship as **native WinUI 3 / C#** (Windows Fluent). Port the
+  design into XAML/C# using [win-dev-skills](https://github.com/microsoft/win-dev-skills).
+- **Chat surface** (`ChatBubble`, `ChatComposer`, `ChatThread`): ships via
+  **[Reactor](https://github.com/microsoft/microsoft-ui-reactor)**, the React-style
+  framework for this app's chat. (Reactor has no dedicated porting agent yet — WIP.)
+
+When you need a value the design doesn't cover, add it here first, then port it into
+the native/Reactor implementation via the matching source above — don't hard-code a
+one-off in feature code.
+
+## The one-line brief
+A calm native Windows companion for your AI assistant. It should feel like a
+quiet, trustworthy extension of Windows — Fluent surfaces, the user's own
+accent color — not a web dashboard wearing a desktop window.
+
+## Voice
+- Clear, respectful, and native to Windows. Say what will happen and why.
+- Explain pairing, permissions, and security plainly — never alarmist, never hype.
+- No hype words ("supercharge", "seamless", "revolutionary", "effortless").
+
+## Information hierarchy
+1. **One subject per screen.** Decide what the screen is *for* and let that element win.
+2. **Size and weight before color.** Establish the hierarchy in grayscale first; color is the last 10%.
+3. **One accent.** `accent` = "act here" (selection, focus, primary action). If everything is accented, nothing is.
+4. **Generous vertical rhythm.** Prefer the `space-5`/`space-6` steps between groups; let content breathe.
+
+## Do
+- Defer to Windows: theme off `SystemAccentColor` and Fluent resources so the app
+  follows the user's accent, light/dark, and high-contrast settings.
+- Use Segoe UI Variable for text and Cascadia Mono for commands, endpoints, tokens, and logs.
+- Make connection state legible: connected/pairing/error read via `positive`/`warning`/`critical`.
+- Keep motion to 120–200ms ease-out. Animate to explain, not to impress.
+
+## Don't
+- Don't hard-code hex in UI — it breaks in dark and high-contrast modes. Use tokens/theme resources.
+- Don't put gray text on a colored background.
+- Don't nest cards inside cards, or wrap every block in a card.
+- Don't reach for bounce/elastic easing; it reads as dated and AI-generated.
+- Don't fight the OS theme with custom-skinned controls or glassmorphism overload.
+
+## Anti-references
+If a mock could be mistaken for a neon-gradient SaaS landing page, or ignores the
+user's system accent and light/dark preference — start over.
diff --git a/AGENTS.md b/AGENTS.md
index 6666929806..031386d48d 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -130,3 +130,26 @@ Important current facts:
 - `GatewayConnectionManager` owns operator/node connection state. UI surfaces should observe it or call its reconnect/disconnect APIs instead of constructing parallel gateway clients.
 - Chat/canvas/tray actions must visibly route users to Connection settings when pairing is incomplete or credentials are missing; avoid silent no-ops.
 - MCP-only mode (`EnableMcpServer=true`, `EnableNodeMode=false`) must start local `NodeService` without requiring a gateway credential.
+
+<!-- colophon:start -->
+## Design system
+
+This repository has a living design system at [`.agents/design/`](.agents/design/). These files are the **source of truth for design** — tokens, component intent, and principles — and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
+**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below — don't copy `components.jsonc` verbatim.
+
+- `.agents/design/design.json` — design tokens: brand, colors, typography, spacing, radii, shadows, principles.
+- `.agents/design/components.jsonc` — the component patterns to reuse (structure, variants, states).
+- `.agents/design/principles.md` — voice, information hierarchy, and do/don't guidance.
+
+Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `.agents/design/` rather than hard-coding a one-off.
+
+**Port targets** — how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
+- Default: ships as Native WinUI 3 / C# (Windows Fluent) — port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
+- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor) — port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
+- Canonical implementation owner: OpenClaw Windows (openclaw/openclaw-windows-node)
+- Examples kept aligned via: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
+
+Colors in `design.json` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code — never hard-code the preview hex — so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
+
+<sub>Managed by [Colophon](https://github.com/karkarl/colophon) — edit `.agents/design/` to change the system; this block only points to it.</sub>
+<!-- colophon:end -->

From c657cca969fe56f659d1ea6fbc9ae23f1acffaae Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 10 Sep 2026 12:14:41 -0700
Subject: [PATCH 02/32] Reconcile chat composer/thread/picker with shipping
 Reactor UI

ComposerPicker now follows the Fluent ComboBox pattern (bordered control fill + hairline border, ink value, right-aligned muted chevron). ChatComposer and ChatThread are realigned to the actual ReactorChatComposer/ReactorChatTimeline implementation:

- ChatComposer toolbar: adds session picker, speaker, and settings; notes the Send<->Stop toggle; binds ControlFill/ControlStroke (control/controlLine) instead of Card resources; 12px outer margin.

- ChatThread/ChatBubble: user bubble uses the softer accentSubtle (AccentFillColorSecondaryBrush) with a hover Copy; assistant bubble uses subtleHover fill + controlLine border, adds Read aloud, and max-width 720.

Adds 3 tokens the system did not cover: control (ControlFillColorDefaultBrush), controlLine (ControlStrokeColorDefaultBrush), accentSubtle (AccentFillColorSecondaryBrush). Preview hex only; code binds the resource keys.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 920 +++++++++++++++++++++++++++-----
 .agents/design/design.json      |   5 +-
 2 files changed, 791 insertions(+), 134 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 20d898f831..936cc3f7bd 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1,30 +1,3 @@
-// components.jsonc — the UI patterns the OpenClaw Windows team has decided on, as data.
-//
-// This is a framework-agnostic relational element tree with token-bound Auto Layout
-// and optional parent-relative freeform positioning. It renders live in the Colophon
-// and Prototype canvases and ports cleanly because layout intent is semantic, not
-// executable CSS. This is DESIGN INTENT for the canvas preview — not shipping code.
-//
-// To ship, port these patterns into the app using the port targets in design.json
-// `authority`: most surfaces ship as native WinUI 3 / C# (port via
-// github.com/microsoft/win-dev-skills), while the chat surface (ChatBubble,
-// ChatComposer, ChatThread) ships via Reactor (github.com/microsoft/microsoft-ui-reactor).
-// Don't ship this verbatim; bind Fluent ThemeResource keys, never the preview hex.
-//
-// Every object node has a stable, unique `id`. Node kinds:
-//   element   { "id", "el", "class"?, "attrs"?, "layout"?, "position"?, "margin"?, "appearance"?, "children"? }
-//   component { "id", "component", "props"?, "layout"?, "position"?, "margin"?, "appearance"? }
-//   string    "literal"  or  "{prop}"  for prop interpolation
-//
-// Auto Layout: layout.mode vertical|horizontal|grid|freeform|none; gap/padding/margin
-// reference design.json spacing tokens ("1".."8"), never raw px; align/justify/columns/
-// wrap/grow; width/height "fill"|"hug"|number. Freeform (v3): a layout.mode "freeform"
-// parent establishes a coordinate system; direct children may set
-// position { mode:"absolute", x, y } in px relative to that parent.
-//
-// Appearance inherits from the parent/class; add only intentional, token-bound
-// overrides: fontFamily display|body|mono; textStyle (typography scale name);
-// color/background/borderColor (color-token name); radius/shadow (token name); textAlign.
 {
   "meta": {
     "version": 3,
@@ -35,43 +8,68 @@
     {
       "name": "Button",
       "note": "Primary action. One per view — it's where the eye should land. Padding mirrors WinUI's default ButtonPadding (11,5,11,6), snapped to spacing tokens 3 (12≈11) and 1 (4≈5/6). In-app MinWidth 100px keeps short labels (OK / Connect) from cramping and gives side-by-side buttons a consistent footprint; that minimum has no spacing-token equivalent, so it stays a port note and the preview hugs its label.",
-      "props": { "children": "Save changes", "variant": "primary" },
+      "props": {
+        "children": "Save changes",
+        "variant": "primary"
+      },
       "root": {
         "id": "button-root",
         "el": "button",
         "class": "ds-btn ds-btn-{variant}",
         "layout": {
           "mode": "horizontal",
-          "padding": { "x": "3", "y": "1" },
+          "padding": {
+            "x": "3",
+            "y": "1"
+          },
           "align": "center",
           "justify": "center",
           "width": "hug"
         },
-        "children": ["{children}"]
+        "children": [
+          "{children}"
+        ]
       }
     },
     {
       "name": "Field",
       "note": "Text input with a quiet label above it — the field is the subject. Input padding mirrors WinUI TextControlThemePadding (10,5,6,6), snapped to tokens 2 (8≈10/6 horizontal) and 1 (4≈5/6 vertical). In-app MinHeight 32px lines a field up with a Button on the same row; that minimum stays a port note.",
-      "props": { "label": "Gateway address", "placeholder": "127.0.0.1:18789" },
+      "props": {
+        "label": "Gateway address",
+        "placeholder": "127.0.0.1:18789"
+      },
       "root": {
         "id": "field-root",
         "el": "label",
         "class": "ds-field",
-        "layout": { "mode": "vertical", "gap": "2", "width": "fill" },
+        "layout": {
+          "mode": "vertical",
+          "gap": "2",
+          "width": "fill"
+        },
         "children": [
           {
             "id": "field-label",
             "el": "span",
             "class": "ds-field-label",
-            "children": ["{label}"]
+            "children": [
+              "{label}"
+            ]
           },
           {
             "id": "field-input",
             "el": "input",
             "class": "ds-input",
-            "attrs": { "placeholder": "{placeholder}" },
-            "layout": { "padding": { "x": "2", "y": "1" }, "width": "fill" }
+            "attrs": {
+              "placeholder": "{placeholder}"
+            },
+            "layout": {
+              "padding": {
+                "x": "2",
+                "y": "1"
+              },
+              "width": "fill"
+            }
           }
         ]
       }
@@ -79,7 +77,10 @@
     {
       "name": "Card",
       "note": "Content card. Flat by default — a 1px hairline border, not a drop shadow. Padding mirrors the WinUI Gallery card (16,12) as tokens 4 (16) and 3 (12) exactly, with the `md` radius and a `line`-colored border supplied by the ds-card class. Never nest a card inside a card.",
-      "props": { "title": "Windows node", "body": "Paired · 6 capabilities exposed over MCP." },
+      "props": {
+        "title": "Windows node",
+        "body": "Paired · 6 capabilities exposed over MCP."
+      },
       "root": {
         "id": "card-root",
         "el": "article",
@@ -87,7 +88,10 @@
         "layout": {
           "mode": "vertical",
           "gap": "2",
-          "padding": { "x": "4", "y": "3" },
+          "padding": {
+            "x": "4",
+            "y": "3"
+          },
           "width": "fill"
         },
         "children": [
@@ -95,21 +99,31 @@
             "id": "card-title",
             "el": "h3",
             "class": "ds-card-title",
-            "children": ["{title}"]
+            "children": [
+              "{title}"
+            ]
           },
           {
             "id": "card-body",
             "el": "p",
             "class": "ds-card-body",
-            "children": ["{body}"]
+            "children": [
+              "{body}"
+            ]
           },
           {
             "id": "card-link",
             "el": "a",
             "class": "ds-link",
-            "attrs": { "href": "#" },
-            "margin": { "top": "1" },
-            "children": ["Open report →"]
+            "attrs": {
+              "href": "#"
+            },
+            "margin": {
+              "top": "1"
+            },
+            "children": [
+              "Open report →"
+            ]
           }
         ]
       }
@@ -117,54 +131,96 @@
     {
       "name": "Badge",
       "note": "Status pill. Uses semantic color tokens, never a raw hex. Padding tokens 3/1 give the pill a compact footprint; the `pill` radius and tone color come from the ds-badge class.",
-      "props": { "children": "Connected", "tone": "positive" },
+      "props": {
+        "children": "Connected",
+        "tone": "positive"
+      },
       "root": {
         "id": "badge-root",
         "el": "span",
         "class": "ds-badge ds-badge-{tone}",
         "layout": {
           "mode": "horizontal",
-          "padding": { "x": "3", "y": "1" },
+          "padding": {
+            "x": "3",
+            "y": "1"
+          },
           "align": "center",
           "width": "hug"
         },
-        "children": ["{children}"]
+        "children": [
+          "{children}"
+        ]
       }
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline picker — text label + chevron, no border until hover in the app. Used for the model and reasoning-effort selectors; reads as a quiet dropdown, not a button. 32px control height with `small` (13/18) muted text and the `sm` radius. (Preview shows the rest state; the transparent rest border is intentionally omitted rather than bound to a token.)",
-      "props": { "label": "Model" },
+      "note": "Fluent ComboBox. A bordered control (`control` fill, `controlLine` hairline border, `sm`/ControlCornerRadius) showing the current value in `ink` with a right-aligned `muted` chevron (Segoe Fluent \\uE70D, previewed ~12px). 32px min height; horizontal padding tokens 3/2 approximate Fluent ComboBoxPadding. Used for the model, reasoning-effort, and session selectors in the composer; opens a flyout list of single-select (RadioMenuItem) options in-app. ComboBox MinWidth (64px) and the dropdown list are Reactor port notes. (Previously previewed as a borderless subtle picker; realigned to the Fluent ComboBox pattern the user asked for.)",
+      "props": {
+        "label": "Model"
+      },
       "root": {
         "id": "composer-picker-root",
         "el": "button",
-        "attrs": { "type": "button" },
+        "attrs": {
+          "type": "button",
+          "role": "combobox",
+          "aria-haspopup": "listbox",
+          "aria-label": "{label}"
+        },
         "layout": {
           "mode": "horizontal",
-          "gap": "1",
-          "padding": { "x": "2" },
+          "gap": "3",
+          "padding": {
+            "left": "3",
+            "right": "2"
+          },
           "align": "center",
+          "justify": "space-between",
           "height": 32,
           "width": "hug"
         },
         "appearance": {
           "fontFamily": "body",
-          "textStyle": "small",
-          "color": "muted",
+          "textStyle": "body",
+          "color": "ink",
+          "background": "control",
+          "borderColor": "controlLine",
           "radius": "sm"
         },
         "children": [
           {
             "id": "composer-picker-label",
             "el": "span",
-            "children": ["{label}"]
+            "children": [
+              "{label}"
+            ]
           },
           {
             "id": "composer-picker-chevron",
             "el": "svg",
-            "attrs": { "width": "12", "height": "12", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+            "attrs": {
+              "width": "12",
+              "height": "12",
+              "viewBox": "0 0 24 24",
+              "fill": "none",
+              "aria-hidden": "true",
+              "stroke": "currentColor",
+              "stroke-width": "2",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            },
+            "appearance": {
+              "color": "muted"
+            },
             "children": [
-              { "id": "composer-picker-chevron-path", "el": "path", "attrs": { "d": "M6 9l6 6 6-6" } }
+              {
+                "id": "composer-picker-chevron-path",
+                "el": "path",
+                "attrs": {
+                  "d": "M6 9l6 6 6-6"
+                }
+              }
             ]
           }
         ]
@@ -172,7 +228,7 @@
     },
     {
       "name": "ChatBubble",
-      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `line` border, `pill` radius) to the LEFT of a bubble on a `surface` fill with a `line` border. The `bubble` radius (16px) is friendlier than the 8/12px control radii; padding tokens 4/3 mirror the v1 12/16. Footer reads timestamp · usage · Copy — the same used/context (pct%) string ChatUsageFormatter produces. Mirrors OpenClawChatTimeline; ships via Reactor. Bubble max-width min(80%, 520px) is a Reactor port note (no token equivalent). (User messages ride the accent on the right in-app; this previews the assistant variant.)",
+      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of a bubble on a `subtleHover` fill with a `controlLine` border. The `bubble` radius (16px) is friendlier than the 8/12px control radii; padding tokens 4/3 mirror the app's 16/12. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Bubble max-width min(80%, 720px) and the run-start avatar gating are Reactor port notes (no token equivalent). (User messages ride the softer `accentSubtle` on the right in-app; this previews the assistant variant.)",
       "props": {
         "time": "2:14 PM",
         "usage": "12.5K/200K (6%)",
@@ -181,21 +237,50 @@
       "root": {
         "id": "chat-bubble-root",
         "el": "div",
-        "layout": { "mode": "horizontal", "gap": "2", "align": "start" },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "2",
+          "align": "start"
+        },
         "children": [
           {
             "id": "chat-bubble-avatar",
             "el": "div",
-            "attrs": { "aria-hidden": "true" },
-            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 36, "height": 36 },
-            "appearance": { "background": "surface", "borderColor": "line", "color": "muted", "radius": "pill" },
+            "attrs": {
+              "aria-hidden": "true"
+            },
+            "layout": {
+              "mode": "horizontal",
+              "align": "center",
+              "justify": "center",
+              "width": 36,
+              "height": 36
+            },
+            "appearance": {
+              "background": "surface",
+              "borderColor": "controlLine",
+              "color": "muted",
+              "radius": "pill"
+            },
             "children": [
               {
                 "id": "chat-bubble-avatar-glyph",
                 "el": "svg",
-                "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "currentColor", "aria-hidden": "true" },
+                "attrs": {
+                  "width": "18",
+                  "height": "18",
+                  "viewBox": "0 0 24 24",
+                  "fill": "currentColor",
+                  "aria-hidden": "true"
+                },
                 "children": [
-                  { "id": "chat-bubble-avatar-path", "el": "path", "attrs": { "d": "M12 2.5l1.7 5.1a4 4 0 0 0 2.7 2.7l5.1 1.7-5.1 1.7a4 4 0 0 0-2.7 2.7L12 21.5l-1.7-5.1a4 4 0 0 0-2.7-2.7L2.5 12l5.1-1.7a4 4 0 0 0 2.7-2.7L12 2.5z" } }
+                  {
+                    "id": "chat-bubble-avatar-path",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M12 2.5l1.7 5.1a4 4 0 0 0 2.7 2.7l5.1 1.7-5.1 1.7a4 4 0 0 0-2.7 2.7L12 21.5l-1.7-5.1a4 4 0 0 0-2.7-2.7L2.5 12l5.1-1.7a4 4 0 0 0 2.7-2.7L12 2.5z"
+                    }
+                  }
                 ]
               }
             ]
@@ -203,38 +288,181 @@
           {
             "id": "chat-bubble-stack",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "align": "start" },
+            "layout": {
+              "mode": "vertical",
+              "gap": "1",
+              "align": "start"
+            },
             "children": [
               {
                 "id": "chat-bubble-message",
                 "el": "div",
-                "layout": { "mode": "vertical", "padding": { "x": "4", "y": "3" } },
-                "appearance": { "fontFamily": "body", "textStyle": "body", "background": "surface", "color": "ink", "borderColor": "line", "radius": "bubble" },
-                "children": ["{children}"]
+                "layout": {
+                  "mode": "vertical",
+                  "padding": {
+                    "x": "4",
+                    "y": "3"
+                  }
+                },
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "body",
+                  "background": "subtleHover",
+                  "color": "ink",
+                  "borderColor": "controlLine",
+                  "radius": "bubble"
+                },
+                "children": [
+                  "{children}"
+                ]
               },
               {
                 "id": "chat-bubble-footer",
                 "el": "div",
-                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2" }, "align": "center" },
-                "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                "layout": {
+                  "mode": "horizontal",
+                  "gap": "2",
+                  "padding": {
+                    "x": "2"
+                  },
+                  "align": "center"
+                },
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "caption",
+                  "color": "muted"
+                },
                 "children": [
-                  { "id": "chat-bubble-time", "el": "span", "children": ["{time}"] },
-                  { "id": "chat-bubble-dot", "el": "span", "attrs": { "aria-hidden": "true" }, "children": ["·"] },
-                  { "id": "chat-bubble-usage", "el": "span", "children": ["{usage}"] },
+                  {
+                    "id": "chat-bubble-time",
+                    "el": "span",
+                    "children": [
+                      "{time}"
+                    ]
+                  },
+                  {
+                    "id": "chat-bubble-dot",
+                    "el": "span",
+                    "attrs": {
+                      "aria-hidden": "true"
+                    },
+                    "children": [
+                      "·"
+                    ]
+                  },
+                  {
+                    "id": "chat-bubble-usage",
+                    "el": "span",
+                    "children": [
+                      "{usage}"
+                    ]
+                  },
                   {
                     "id": "chat-bubble-copy",
                     "el": "button",
-                    "attrs": { "type": "button", "title": "Copy", "aria-label": "Copy message" },
-                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 20, "height": 20 },
-                    "appearance": { "color": "muted", "radius": "sm" },
+                    "attrs": {
+                      "type": "button",
+                      "title": "Copy",
+                      "aria-label": "Copy message"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 20,
+                      "height": 20
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
                     "children": [
                       {
                         "id": "chat-bubble-copy-glyph",
                         "el": "svg",
-                        "attrs": { "width": "14", "height": "14", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "attrs": {
+                          "width": "14",
+                          "height": "14",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
+                        "children": [
+                          {
+                            "id": "chat-bubble-copy-rect",
+                            "el": "rect",
+                            "attrs": {
+                              "x": "9",
+                              "y": "9",
+                              "width": "11",
+                              "height": "11",
+                              "rx": "2"
+                            }
+                          },
+                          {
+                            "id": "chat-bubble-copy-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1"
+                            }
+                          }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "chat-bubble-readaloud",
+                    "el": "button",
+                    "attrs": {
+                      "type": "button",
+                      "title": "Read aloud",
+                      "aria-label": "Read message aloud"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 20,
+                      "height": 20
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
+                    "children": [
+                      {
+                        "id": "chat-bubble-readaloud-glyph",
+                        "el": "svg",
+                        "attrs": {
+                          "width": "14",
+                          "height": "14",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
                         "children": [
-                          { "id": "chat-bubble-copy-rect", "el": "rect", "attrs": { "x": "9", "y": "9", "width": "11", "height": "11", "rx": "2" } },
-                          { "id": "chat-bubble-copy-path", "el": "path", "attrs": { "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1" } }
+                          {
+                            "id": "chat-bubble-readaloud-poly",
+                            "el": "polygon",
+                            "attrs": {
+                              "points": "11 5 6 9 2 9 2 15 6 15 11 19 11 5"
+                            }
+                          },
+                          {
+                            "id": "chat-bubble-readaloud-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M15.5 8.5a5 5 0 0 1 0 7M19 5a9 9 0 0 1 0 14"
+                            }
+                          }
                         ]
                       }
                     ]
@@ -248,75 +476,305 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `surface` panel (`md` radius) with a hairline `line` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, model picker, reasoning-effort picker; right cluster = mic + Send. Only Send spends the accent; every other control stays subtle so the toolbar reads as quiet chrome. Textarea min 56 / max 200px growth is a Reactor port note. (Preview shows the rest state.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active); every other control stays subtle so the toolbar reads as quiet chrome. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. (Preview shows the rest state.)",
       "props": {
         "placeholder": "Message OpenClaw…",
+        "session": "Default",
         "model": "Claude Opus 4.8",
         "effort": "High"
       },
       "root": {
         "id": "chat-composer-root",
         "el": "div",
-        "layout": { "mode": "vertical", "gap": "2", "padding": "2", "width": "fill" },
-        "appearance": { "background": "surface", "borderColor": "line", "radius": "md" },
+        "layout": {
+          "mode": "vertical",
+          "gap": "2",
+          "padding": "2",
+          "width": "fill"
+        },
+        "margin": "3",
+        "appearance": {
+          "background": "control",
+          "borderColor": "controlLine",
+          "radius": "md"
+        },
         "children": [
           {
             "id": "chat-composer-input",
             "el": "textarea",
-            "attrs": { "rows": "2", "placeholder": "{placeholder}" },
-            "layout": { "padding": "2", "width": "fill" },
-            "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }
+            "attrs": {
+              "rows": "2",
+              "placeholder": "{placeholder}"
+            },
+            "layout": {
+              "padding": "2",
+              "width": "fill"
+            },
+            "appearance": {
+              "fontFamily": "body",
+              "textStyle": "body",
+              "color": "ink"
+            }
           },
           {
             "id": "chat-composer-toolbar",
             "el": "div",
-            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "justify": "space-between", "width": "fill" },
+            "layout": {
+              "mode": "horizontal",
+              "gap": "2",
+              "align": "center",
+              "justify": "space-between",
+              "width": "fill"
+            },
             "children": [
               {
                 "id": "chat-composer-left",
                 "el": "div",
-                "layout": { "mode": "horizontal", "gap": "1", "align": "center" },
+                "layout": {
+                  "mode": "horizontal",
+                  "gap": "2",
+                  "align": "center"
+                },
                 "children": [
                   {
                     "id": "chat-composer-add",
                     "el": "button",
-                    "attrs": { "type": "button", "title": "Add context", "aria-label": "Add context" },
-                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
-                    "appearance": { "color": "muted", "radius": "sm" },
+                    "attrs": {
+                      "type": "button",
+                      "title": "Add context",
+                      "aria-label": "Add context"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 32,
+                      "height": 32
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
                     "children": [
                       {
                         "id": "chat-composer-add-glyph",
                         "el": "svg",
-                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "attrs": {
+                          "width": "18",
+                          "height": "18",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
                         "children": [
-                          { "id": "chat-composer-add-path", "el": "path", "attrs": { "d": "M12 5v14M5 12h14" } }
+                          {
+                            "id": "chat-composer-add-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M12 5v14M5 12h14"
+                            }
+                          }
                         ]
                       }
                     ]
                   },
-                  { "id": "chat-composer-model", "component": "ComposerPicker", "props": { "label": "{model}" } },
-                  { "id": "chat-composer-effort", "component": "ComposerPicker", "props": { "label": "{effort}" } }
+                  {
+                    "id": "chat-composer-session",
+                    "component": "ComposerPicker",
+                    "props": {
+                      "label": "{session}"
+                    }
+                  },
+                  {
+                    "id": "chat-composer-model",
+                    "component": "ComposerPicker",
+                    "props": {
+                      "label": "{model}"
+                    }
+                  },
+                  {
+                    "id": "chat-composer-effort",
+                    "component": "ComposerPicker",
+                    "props": {
+                      "label": "{effort}"
+                    }
+                  }
                 ]
               },
               {
                 "id": "chat-composer-right",
                 "el": "div",
-                "layout": { "mode": "horizontal", "gap": "1", "align": "center" },
+                "layout": {
+                  "mode": "horizontal",
+                  "gap": "2",
+                  "align": "center"
+                },
                 "children": [
                   {
                     "id": "chat-composer-mic",
                     "el": "button",
-                    "attrs": { "type": "button", "title": "Dictate", "aria-label": "Dictate" },
-                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
-                    "appearance": { "color": "muted", "radius": "sm" },
+                    "attrs": {
+                      "type": "button",
+                      "title": "Dictate",
+                      "aria-label": "Dictate"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 32,
+                      "height": 32
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
                     "children": [
                       {
                         "id": "chat-composer-mic-glyph",
                         "el": "svg",
-                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "attrs": {
+                          "width": "18",
+                          "height": "18",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
                         "children": [
-                          { "id": "chat-composer-mic-rect", "el": "rect", "attrs": { "x": "9", "y": "3", "width": "6", "height": "11", "rx": "3" } },
-                          { "id": "chat-composer-mic-path", "el": "path", "attrs": { "d": "M5 11a7 7 0 0 0 14 0M12 18v3" } }
+                          {
+                            "id": "chat-composer-mic-rect",
+                            "el": "rect",
+                            "attrs": {
+                              "x": "9",
+                              "y": "3",
+                              "width": "6",
+                              "height": "11",
+                              "rx": "3"
+                            }
+                          },
+                          {
+                            "id": "chat-composer-mic-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M5 11a7 7 0 0 0 14 0M12 18v3"
+                            }
+                          }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "chat-composer-speaker",
+                    "el": "button",
+                    "attrs": {
+                      "type": "button",
+                      "title": "Read responses aloud",
+                      "aria-label": "Read responses aloud"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 32,
+                      "height": 32
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
+                    "children": [
+                      {
+                        "id": "chat-composer-speaker-glyph",
+                        "el": "svg",
+                        "attrs": {
+                          "width": "18",
+                          "height": "18",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
+                        "children": [
+                          {
+                            "id": "chat-composer-speaker-poly",
+                            "el": "polygon",
+                            "attrs": {
+                              "points": "11 5 6 9 2 9 2 15 6 15 11 19 11 5"
+                            }
+                          },
+                          {
+                            "id": "chat-composer-speaker-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M15.5 8.5a5 5 0 0 1 0 7M19 5a9 9 0 0 1 0 14"
+                            }
+                          }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "chat-composer-settings",
+                    "el": "button",
+                    "attrs": {
+                      "type": "button",
+                      "title": "Chat settings",
+                      "aria-label": "Chat settings"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 32,
+                      "height": 32
+                    },
+                    "appearance": {
+                      "color": "muted",
+                      "radius": "sm"
+                    },
+                    "children": [
+                      {
+                        "id": "chat-composer-settings-glyph",
+                        "el": "svg",
+                        "attrs": {
+                          "width": "18",
+                          "height": "18",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
+                        "children": [
+                          {
+                            "id": "chat-composer-settings-circle",
+                            "el": "circle",
+                            "attrs": {
+                              "cx": "12",
+                              "cy": "12",
+                              "r": "3"
+                            }
+                          },
+                          {
+                            "id": "chat-composer-settings-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"
+                            }
+                          }
                         ]
                       }
                     ]
@@ -324,16 +782,46 @@
                   {
                     "id": "chat-composer-send",
                     "el": "button",
-                    "attrs": { "type": "button", "title": "Send", "aria-label": "Send" },
-                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
-                    "appearance": { "background": "accent", "color": "accentInk", "radius": "sm" },
+                    "attrs": {
+                      "type": "button",
+                      "title": "Send",
+                      "aria-label": "Send"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center",
+                      "justify": "center",
+                      "width": 32,
+                      "height": 32
+                    },
+                    "appearance": {
+                      "background": "accent",
+                      "color": "accentInk",
+                      "radius": "sm"
+                    },
                     "children": [
                       {
                         "id": "chat-composer-send-glyph",
                         "el": "svg",
-                        "attrs": { "width": "18", "height": "18", "viewBox": "0 0 24 24", "fill": "none", "aria-hidden": "true", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
+                        "attrs": {
+                          "width": "18",
+                          "height": "18",
+                          "viewBox": "0 0 24 24",
+                          "fill": "none",
+                          "aria-hidden": "true",
+                          "stroke": "currentColor",
+                          "stroke-width": "2",
+                          "stroke-linecap": "round",
+                          "stroke-linejoin": "round"
+                        },
                         "children": [
-                          { "id": "chat-composer-send-path", "el": "path", "attrs": { "d": "M12 19V5M5 12l7-7 7 7" } }
+                          {
+                            "id": "chat-composer-send-path",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M12 19V5M5 12l7-7 7 7"
+                            }
+                          }
                         ]
                       }
                     ]
@@ -347,36 +835,136 @@
     },
     {
       "name": "ChatThread",
-      "note": "A short thread: the \"does chat hang together\" check — a user turn (accent bubble on the right) and an assistant turn (with its Copy affordance + context-usage readout), then the composer. Thread max-width 560px is a Reactor port note.",
+      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and an assistant turn (avatar + Copy / Read aloud / context-usage readout), then the composer. Thread/bubble max-width 720px is a Reactor port note.",
       "root": {
         "id": "chat-thread-root",
         "el": "div",
-        "layout": { "mode": "vertical", "gap": "3", "width": "fill" },
+        "layout": {
+          "mode": "vertical",
+          "gap": "3",
+          "width": "fill"
+        },
         "children": [
           {
             "id": "chat-thread-user",
             "el": "div",
-            "layout": { "mode": "horizontal", "justify": "end", "width": "fill" },
+            "layout": {
+              "mode": "horizontal",
+              "justify": "end",
+              "width": "fill"
+            },
             "children": [
               {
                 "id": "chat-thread-user-stack",
                 "el": "div",
-                "layout": { "mode": "vertical", "gap": "1", "align": "end" },
+                "layout": {
+                  "mode": "vertical",
+                  "gap": "1",
+                  "align": "end"
+                },
                 "children": [
                   {
                     "id": "chat-thread-user-bubble",
                     "el": "div",
-                    "layout": { "mode": "vertical", "padding": { "x": "4", "y": "3" } },
-                    "appearance": { "fontFamily": "body", "textStyle": "body", "background": "accent", "color": "accentInk", "radius": "bubble" },
-                    "children": ["Can you list the Windows node capabilities?"]
+                    "layout": {
+                      "mode": "vertical",
+                      "padding": {
+                        "x": "4",
+                        "y": "3"
+                      }
+                    },
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "body",
+                      "background": "accentSubtle",
+                      "color": "accentInk",
+                      "radius": "bubble"
+                    },
+                    "children": [
+                      "Can you list the Windows node capabilities?"
+                    ]
                   },
                   {
                     "id": "chat-thread-user-footer",
                     "el": "div",
-                    "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2" }, "align": "center" },
-                    "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                    "layout": {
+                      "mode": "horizontal",
+                      "gap": "2",
+                      "padding": {
+                        "x": "2"
+                      },
+                      "align": "center"
+                    },
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted"
+                    },
                     "children": [
-                      { "id": "chat-thread-user-time", "el": "span", "children": ["2:14 PM"] }
+                      {
+                        "id": "chat-thread-user-time",
+                        "el": "span",
+                        "children": [
+                          "2:14 PM"
+                        ]
+                      },
+                      {
+                        "id": "chat-thread-user-copy",
+                        "el": "button",
+                        "attrs": {
+                          "type": "button",
+                          "title": "Copy",
+                          "aria-label": "Copy message"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "align": "center",
+                          "justify": "center",
+                          "width": 20,
+                          "height": 20
+                        },
+                        "appearance": {
+                          "color": "muted",
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "chat-thread-user-copy-glyph",
+                            "el": "svg",
+                            "attrs": {
+                              "width": "14",
+                              "height": "14",
+                              "viewBox": "0 0 24 24",
+                              "fill": "none",
+                              "aria-hidden": "true",
+                              "stroke": "currentColor",
+                              "stroke-width": "2",
+                              "stroke-linecap": "round",
+                              "stroke-linejoin": "round"
+                            },
+                            "children": [
+                              {
+                                "id": "chat-thread-user-copy-rect",
+                                "el": "rect",
+                                "attrs": {
+                                  "x": "9",
+                                  "y": "9",
+                                  "width": "11",
+                                  "height": "11",
+                                  "rx": "2"
+                                }
+                              },
+                              {
+                                "id": "chat-thread-user-copy-path",
+                                "el": "path",
+                                "attrs": {
+                                  "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1"
+                                }
+                              }
+                            ]
+                          }
+                        ]
+                      }
                     ]
                   }
                 ]
@@ -386,9 +974,16 @@
           {
             "id": "chat-thread-assistant",
             "component": "ChatBubble",
-            "props": { "time": "2:14 PM", "usage": "12.5K/200K (6%)", "children": "Paired to the gateway — 6 capabilities are live, including system.run and clipboard access." }
+            "props": {
+              "time": "2:14 PM",
+              "usage": "12.5K/200K (6%)",
+              "children": "Paired to the gateway — 6 capabilities are live, including system.run and clipboard access."
+            }
           },
-          { "id": "chat-thread-composer", "component": "ChatComposer" }
+          {
+            "id": "chat-thread-composer",
+            "component": "ChatComposer"
+          }
         ]
       }
     },
@@ -399,27 +994,57 @@
         "id": "example-screen-root",
         "el": "section",
         "class": "ds-screen",
-        "layout": { "mode": "vertical", "gap": "5", "width": "fill" },
+        "layout": {
+          "mode": "vertical",
+          "gap": "5",
+          "width": "fill"
+        },
         "children": [
           {
             "id": "example-screen-head",
             "el": "header",
             "class": "ds-screen-head",
-            "layout": { "mode": "horizontal", "gap": "4", "align": "start", "justify": "space-between", "width": "fill" },
+            "layout": {
+              "mode": "horizontal",
+              "gap": "4",
+              "align": "start",
+              "justify": "space-between",
+              "width": "fill"
+            },
             "children": [
               {
                 "id": "example-screen-heading",
                 "el": "div",
-                "layout": { "mode": "vertical", "gap": "1" },
+                "layout": {
+                  "mode": "vertical",
+                  "gap": "1"
+                },
                 "children": [
-                  { "id": "example-screen-eyebrow", "el": "p", "class": "ds-eyebrow", "children": ["Connection"] },
-                  { "id": "example-screen-title", "el": "h2", "class": "ds-screen-title", "children": ["OpenClaw Windows Hub"] }
+                  {
+                    "id": "example-screen-eyebrow",
+                    "el": "p",
+                    "class": "ds-eyebrow",
+                    "children": [
+                      "Connection"
+                    ]
+                  },
+                  {
+                    "id": "example-screen-title",
+                    "el": "h2",
+                    "class": "ds-screen-title",
+                    "children": [
+                      "OpenClaw Windows Hub"
+                    ]
+                  }
                 ]
               },
               {
                 "id": "example-screen-status",
                 "component": "Badge",
-                "props": { "tone": "positive", "children": "Connected" }
+                "props": {
+                  "tone": "positive",
+                  "children": "Connected"
+                }
               }
             ]
           },
@@ -427,21 +1052,36 @@
             "id": "example-screen-board",
             "el": "div",
             "class": "ds-grid",
-            "layout": { "mode": "freeform", "width": "fill", "height": 176 },
+            "layout": {
+              "mode": "horizontal",
+              "width": "fill",
+              "height": 176,
+              "gap": "3"
+            },
             "children": [
               {
                 "id": "example-screen-gateway",
                 "component": "Card",
-                "position": { "mode": "absolute", "x": 0, "y": 0 },
-                "props": { "title": "Gateway", "body": "Paired to OpenClawGateway · last seen just now." },
-                "layout": { "width": 280, "height": 148 }
+                "props": {
+                  "title": "Gateway",
+                  "body": "Paired to OpenClawGateway · last seen just now."
+                },
+                "layout": {
+                  "width": 280,
+                  "height": 148
+                }
               },
               {
                 "id": "example-screen-node",
                 "component": "Card",
-                "position": { "mode": "absolute", "x": 248, "y": 28 },
-                "props": { "title": "Windows node", "body": "6 capabilities exposed over MCP." },
-                "layout": { "width": 280, "height": 148 }
+                "props": {
+                  "title": "Windows node",
+                  "body": "6 capabilities exposed over MCP."
+                },
+                "layout": {
+                  "width": 280,
+                  "height": 148
+                }
               }
             ]
           },
@@ -449,18 +1089,32 @@
             "id": "example-screen-row",
             "el": "div",
             "class": "ds-row",
-            "layout": { "mode": "horizontal", "gap": "4", "align": "end", "wrap": true, "width": "fill" },
+            "layout": {
+              "mode": "horizontal",
+              "gap": "4",
+              "align": "end",
+              "wrap": true,
+              "width": "fill"
+            },
             "children": [
               {
                 "id": "example-screen-field",
                 "component": "Field",
-                "props": { "label": "Gateway address", "placeholder": "127.0.0.1:18789" },
-                "layout": { "grow": true }
+                "props": {
+                  "label": "Gateway address",
+                  "placeholder": "127.0.0.1:18789"
+                },
+                "layout": {
+                  "grow": true
+                }
               },
               {
                 "id": "example-screen-connect",
                 "component": "Button",
-                "props": { "children": "Connect", "variant": "primary" }
+                "props": {
+                  "children": "Connect",
+                  "variant": "primary"
+                }
               }
             ]
           }
diff --git a/.agents/design/design.json b/.agents/design/design.json
index 76551ef296..d5b95d715c 100644
--- a/.agents/design/design.json
+++ b/.agents/design/design.json
@@ -51,7 +51,10 @@
     { "name": "warning",   "value": "#9d5d00", "resource": "SystemFillColorCautionBrush",         "themes": { "dark": "#fcd116", "highContrast": "#ffb000" }, "usage": "Warnings / attention. Fluent SystemFillColorCaution." },
     { "name": "critical",  "value": "#c42b1c", "resource": "SystemFillColorCriticalBrush",        "themes": { "dark": "#ff99a4", "highContrast": "#ff5449" }, "usage": "Errors, disconnected, destructive. Fluent SystemFillColorCritical." },
     { "name": "subtleHover",   "value": "rgba(0,0,0,0.037)", "resource": "SubtleFillColorSecondaryBrush", "themes": { "dark": "rgba(255,255,255,0.0605)", "highContrast": "transparent" }, "usage": "Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000)." },
-    { "name": "subtlePressed", "value": "rgba(0,0,0,0.024)", "resource": "SubtleFillColorTertiaryBrush",  "themes": { "dark": "rgba(255,255,255,0.0419)", "highContrast": "transparent" }, "usage": "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)." }
+    { "name": "subtlePressed", "value": "rgba(0,0,0,0.024)", "resource": "SubtleFillColorTertiaryBrush",  "themes": { "dark": "rgba(255,255,255,0.0419)", "highContrast": "transparent" }, "usage": "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)." },
+    { "name": "control",       "value": "#ffffff", "resource": "ControlFillColorDefaultBrush",   "themes": { "dark": "#2d2d2d", "highContrast": "#000000" }, "usage": "Fill for input/entry controls — combo boxes, text fields, the chat composer. Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts)." },
+    { "name": "controlLine",   "value": "#ececec", "resource": "ControlStrokeColorDefaultBrush", "themes": { "dark": "#353535", "highContrast": "#ffffff" }, "usage": "Border for input/entry controls — combo boxes, text fields, composer, avatars. Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards)." },
+    { "name": "accentSubtle",  "value": "#1a75c7", "resource": "AccentFillColorSecondaryBrush",  "themes": { "dark": "#47b6ef", "highContrast": "#ffff00" }, "usage": "Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%) — quieter than the full accent reserved for primary actions." }
   ],
   "typography": {
     "display": {

From cc86739888f9a58d762534c75ed3a8423e6162a5 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 10 Sep 2026 13:33:19 -0700
Subject: [PATCH 03/32] Port composer pickers to Fluent ComboBox; point port
 authority at WinAppCli

Reactor port of the design system's ComposerPicker into the shipping composer: ReactorChatComposer.PickerButton now renders a bordered Fluent ComboBox (ControlFill fill, ControlStroke hairline border, primary-text value, right-aligned muted chevron pinned by a Star/Auto grid, radius 4, MinWidth 64, padding 12/8) instead of a borderless subtle button. Session/model/reasoning selection still opens the existing MenuFlyout of RadioMenuItems.

design.json: add a winapp (WinAppCli, https://github.com/microsoft/WinAppCli) tooling reference to authority and a toolingSource on both the default WinUI 3 port and the Reactor chat override, since XAML and Reactor now build/package through winapp.

Update the composer chevron contract test to assert the ComboBox styling. Remove em dashes from the Colophon pointer block in AGENTS.md so the repo doc validator (no em dashes in user-facing docs) passes.

Validation: build.ps1 OK; OpenClaw.Shared.Tests 3989 passed; OpenClaw.Tray.Tests 2897 passed; design-system validators (componentsio/profileio/validateDesignDir) OK; rubber-duck review clean.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/design.json                    |  7 +++
 AGENTS.md                                     | 20 ++++-----
 .../Chat/ReactorChatComposer.cs               | 43 ++++++++++++-------
 .../ChatTimelinePresentationTests.cs          | 10 ++++-
 4 files changed, 53 insertions(+), 27 deletions(-)

diff --git a/.agents/design/design.json b/.agents/design/design.json
index d5b95d715c..ad8c28b942 100644
--- a/.agents/design/design.json
+++ b/.agents/design/design.json
@@ -9,9 +9,15 @@
     "designSource": "self",
     "owner": "OpenClaw Windows (openclaw/openclaw-windows-node)",
     "syncProcess": "Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.",
+    "tooling": {
+      "name": "winapp (WinAppCli)",
+      "source": "https://github.com/microsoft/WinAppCli",
+      "role": "The Windows App Development CLI is the single build/packaging tool for both port targets below. Both the WinUI 3 (XAML) shell and the Reactor chat surface now build, package, and generate app identity, manifests, and certificates through winapp, so treat it as the port authority's build toolchain."
+    },
     "port": {
       "authoritySource": "Native WinUI 3 / C# (Windows Fluent)",
       "syncSource": "https://github.com/microsoft/win-dev-skills",
+      "toolingSource": "https://github.com/microsoft/WinAppCli",
       "helperAgent": "win-dev-skills"
     },
     "portOverrides": [
@@ -20,6 +26,7 @@
         "components": ["ChatBubble", "ChatComposer", "ChatThread"],
         "authoritySource": "Reactor (Microsoft.UI.Reactor)",
         "syncSource": "https://github.com/microsoft/microsoft-ui-reactor",
+        "toolingSource": "https://github.com/microsoft/WinAppCli",
         "helperAgent": ""
       }
     ]
diff --git a/AGENTS.md b/AGENTS.md
index 031386d48d..35cabba139 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -134,22 +134,22 @@ Important current facts:
 <!-- colophon:start -->
 ## Design system
 
-This repository has a living design system at [`.agents/design/`](.agents/design/). These files are the **source of truth for design** — tokens, component intent, and principles — and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
-**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below — don't copy `components.jsonc` verbatim.
+This repository has a living design system at [`.agents/design/`](.agents/design/). These files are the **source of truth for design** (tokens, component intent, and principles) and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
+**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below. Don't copy `components.jsonc` verbatim.
 
-- `.agents/design/design.json` — design tokens: brand, colors, typography, spacing, radii, shadows, principles.
-- `.agents/design/components.jsonc` — the component patterns to reuse (structure, variants, states).
-- `.agents/design/principles.md` — voice, information hierarchy, and do/don't guidance.
+- `.agents/design/design.json` - design tokens: brand, colors, typography, spacing, radii, shadows, principles.
+- `.agents/design/components.jsonc` - the component patterns to reuse (structure, variants, states).
+- `.agents/design/principles.md` - voice, information hierarchy, and do/don't guidance.
 
 Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `.agents/design/` rather than hard-coding a one-off.
 
-**Port targets** — how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
-- Default: ships as Native WinUI 3 / C# (Windows Fluent) — port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
-- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor) — port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
+**Port targets**: how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
+- Default: ships as Native WinUI 3 / C# (Windows Fluent), port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
+- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor), port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
 - Canonical implementation owner: OpenClaw Windows (openclaw/openclaw-windows-node)
 - Examples kept aligned via: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
 
-Colors in `design.json` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code — never hard-code the preview hex — so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
+Colors in `design.json` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code, never hard-code the preview hex, so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
 
-<sub>Managed by [Colophon](https://github.com/karkarl/colophon) — edit `.agents/design/` to change the system; this block only points to it.</sub>
+<sub>Managed by [Colophon](https://github.com/karkarl/colophon). Edit `.agents/design/` to change the system; this block only points to it.</sub>
 <!-- colophon:end -->
diff --git a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
index ffd8aab27d..040ebfbdbc 100644
--- a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
+++ b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
@@ -211,36 +211,49 @@ Element PickerButton(
             bool enabled,
             double maxLabelWidth)
         {
+            // Fluent ComboBox visual per the design system's ComposerPicker: a
+            // bordered ControlFill/ControlStroke control showing the value in primary
+            // text with a right-aligned muted chevron. The Star/Auto grid pins the
+            // chevron to the trailing edge (ComboBox space-between) while the button
+            // still hugs its content up to MinWidth. Selection still opens the caller's
+            // MenuFlyout of RadioMenuItems.
             return Button(
-                    HStack(
-                        4,
+                    Grid(
+                        [GridSize.Star(), GridSize.Auto],
+                        [GridSize.Auto],
                         TextBlock(label)
+                            .Grid(row: 0, column: 0)
+                            .VAlign(VerticalAlignment.Center)
+                            .HAlign(HorizontalAlignment.Left)
                             .MaxWidth(maxLabelWidth)
-                            .FontSize(13)
+                            .FontSize(14)
                             .TextTrimming(TextTrimming.CharacterEllipsis)
                             .TextWrapping(TextWrapping.NoWrap),
                         TextBlock("\uE70D")
-                            .Margin(2, 4, 0, 0)
+                            .Grid(row: 0, column: 1)
+                            .Margin(8, 0, 0, 0)
+                            .VAlign(VerticalAlignment.Center)
                             .AccessibilityView(Microsoft.UI.Xaml.Automation.Peers.AccessibilityView.Raw)
                             .FontFamily(FluentIconCatalog.SymbolThemeFontFamily)
-                            .FontSize(10)),
+                            .FontSize(12)
+                            .Foreground(Theme.SecondaryText)),
                     () => { })
                 .AutomationName(automationName)
-                .Foreground(Theme.SecondaryText)
+                .Foreground(Theme.PrimaryText)
                 .Resources(resources => resources
-                    .Set("ButtonBackground", Theme.Ref("SubtleFillColorTransparentBrush"))
-                    .Set("ButtonBackgroundPointerOver", Theme.SubtleFill)
-                    .Set("ButtonBackgroundPressed", Theme.Ref("SubtleFillColorTertiaryBrush"))
-                    .Set("ButtonBorderBrush", Theme.Ref("SubtleFillColorTransparentBrush"))
-                    .Set("ButtonBorderBrushPointerOver", Theme.Ref("SubtleFillColorTransparentBrush"))
-                    .Set("ButtonBorderBrushPressed", Theme.Ref("SubtleFillColorTransparentBrush")))
+                    .Set("ButtonBackground", Theme.ControlFill)
+                    .Set("ButtonBackgroundPointerOver", Theme.Ref("ControlFillColorSecondaryBrush"))
+                    .Set("ButtonBackgroundPressed", Theme.ControlFillTertiary)
+                    .Set("ButtonBorderBrush", Theme.ControlStroke)
+                    .Set("ButtonBorderBrushPointerOver", Theme.ControlStroke)
+                    .Set("ButtonBorderBrushPressed", Theme.ControlStroke))
                 .Height(32)
                 .MinHeight(32)
-                .MinWidth(0)
-                .Padding(8, 0, 8, 0)
+                .MinWidth(64)
+                .Padding(12, 0, 8, 0)
                 .CornerRadius(controlCornerRadius)
                 .IsEnabled(enabled)
-                .BorderThickness(0)
+                .BorderThickness(1)
                 .AutomationId(automationId)
                 .Set(button => ComposerAutomationVisibility.Prepare(button))
                 .OnUnmount(control => ComposerAutomationVisibility.Detach(
diff --git a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
index e258ba47a1..affaf32856 100644
--- a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
+++ b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
@@ -221,7 +221,7 @@ public void ReactorTimeline_RequeuesOnlyForCompletedHistoryReplacement()
     }
 
     [Fact]
-    public void ReactorComposer_OffsetsPickerChevronRightAndUp()
+    public void ReactorComposer_StylesPickersAsFluentComboBox()
     {
         var composer = File.ReadAllText(Path.Combine(
             TestRepositoryPaths.GetRepositoryRoot(),
@@ -230,7 +230,13 @@ public void ReactorComposer_OffsetsPickerChevronRightAndUp()
             "Chat",
             "ReactorChatComposer.cs"));
 
-        Assert.Contains(".Margin(2, 4, 0, 0)", composer);
+        // Pickers follow the design system's ComposerPicker (Fluent ComboBox):
+        // a bordered ControlFill/ControlStroke control with a trailing muted chevron,
+        // not the old borderless subtle button with an up-offset chevron.
+        Assert.Contains(".Set(\"ButtonBackground\", Theme.ControlFill)", composer);
+        Assert.Contains(".Set(\"ButtonBorderBrush\", Theme.ControlStroke)", composer);
+        Assert.Contains(".Margin(8, 0, 0, 0)", composer);
+        Assert.DoesNotContain(".Margin(2, 4, 0, 0)", composer);
     }
 
     [Fact]

From fb1eaa38d55fc957ac05a1c9690c7df8031a719e Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 10 Sep 2026 16:16:18 -0700
Subject: [PATCH 04/32] Revert composer pickers to subtle dropdown style

The bordered Fluent ComboBox port regressed the composer's session/model/reasoning selectors. Restore the subtle inline dropdown the surface is meant to ship: ReactorChatComposer.PickerButton goes back to a borderless, transparent button (SubtleFillColorTransparent resting, subtle hover/press, muted value + trailing chevron with a small right/up offset). Update the design system's ComposerPicker to the same subtle pattern (transparent fill, no border, muted text/chevron, gap/padding tokens 1/2) and rename the contract test to ReactorComposer_StylesPickersAsSubtleDropdown.

The WinAppCli port authority (design.json) is unchanged.

Validation: build.ps1 OK; OpenClaw.Shared.Tests 3989 passed; OpenClaw.Tray.Tests 2897 passed; design-system validators OK.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc               | 13 ++---
 .../Chat/ReactorChatComposer.cs               | 49 ++++++++-----------
 .../ChatTimelinePresentationTests.cs          | 18 ++++---
 3 files changed, 36 insertions(+), 44 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 936cc3f7bd..25e3f12fca 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -155,7 +155,7 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Fluent ComboBox. A bordered control (`control` fill, `controlLine` hairline border, `sm`/ControlCornerRadius) showing the current value in `ink` with a right-aligned `muted` chevron (Segoe Fluent \\uE70D, previewed ~12px). 32px min height; horizontal padding tokens 3/2 approximate Fluent ComboBoxPadding. Used for the model, reasoning-effort, and session selectors in the composer; opens a flyout list of single-select (RadioMenuItem) options in-app. ComboBox MinWidth (64px) and the dropdown list are Reactor port notes. (Previously previewed as a borderless subtle picker; realigned to the Fluent ComboBox pattern the user asked for.)",
+      "note": "Subtle inline dropdown. A borderless, transparent picker showing the current value in `muted` secondary text with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`. Resting fill is transparent (SubtleFillColorTransparent); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note.",
       "props": {
         "label": "Model"
       },
@@ -170,22 +170,19 @@
         },
         "layout": {
           "mode": "horizontal",
-          "gap": "3",
+          "gap": "1",
           "padding": {
-            "left": "3",
+            "left": "2",
             "right": "2"
           },
           "align": "center",
-          "justify": "space-between",
           "height": 32,
           "width": "hug"
         },
         "appearance": {
           "fontFamily": "body",
-          "textStyle": "body",
-          "color": "ink",
-          "background": "control",
-          "borderColor": "controlLine",
+          "textStyle": "small",
+          "color": "muted",
           "radius": "sm"
         },
         "children": [
diff --git a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
index 040ebfbdbc..eb4daf9c91 100644
--- a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
+++ b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
@@ -211,49 +211,42 @@ Element PickerButton(
             bool enabled,
             double maxLabelWidth)
         {
-            // Fluent ComboBox visual per the design system's ComposerPicker: a
-            // bordered ControlFill/ControlStroke control showing the value in primary
-            // text with a right-aligned muted chevron. The Star/Auto grid pins the
-            // chevron to the trailing edge (ComboBox space-between) while the button
-            // still hugs its content up to MinWidth. Selection still opens the caller's
-            // MenuFlyout of RadioMenuItems.
+            // Subtle inline picker per the design system's ComposerPicker: a
+            // borderless, transparent control showing the current value in muted
+            // secondary text with a trailing muted chevron. Hover/press use the
+            // subtle fills so the picker stays quiet in the composer toolbar and
+            // never competes with the primary Send action. Selection still opens the
+            // caller's MenuFlyout of RadioMenuItems.
             return Button(
-                    Grid(
-                        [GridSize.Star(), GridSize.Auto],
-                        [GridSize.Auto],
+                    HStack(
+                        4,
                         TextBlock(label)
-                            .Grid(row: 0, column: 0)
-                            .VAlign(VerticalAlignment.Center)
-                            .HAlign(HorizontalAlignment.Left)
                             .MaxWidth(maxLabelWidth)
-                            .FontSize(14)
+                            .FontSize(13)
                             .TextTrimming(TextTrimming.CharacterEllipsis)
                             .TextWrapping(TextWrapping.NoWrap),
                         TextBlock("\uE70D")
-                            .Grid(row: 0, column: 1)
-                            .Margin(8, 0, 0, 0)
-                            .VAlign(VerticalAlignment.Center)
+                            .Margin(2, 4, 0, 0)
                             .AccessibilityView(Microsoft.UI.Xaml.Automation.Peers.AccessibilityView.Raw)
                             .FontFamily(FluentIconCatalog.SymbolThemeFontFamily)
-                            .FontSize(12)
-                            .Foreground(Theme.SecondaryText)),
+                            .FontSize(10)),
                     () => { })
                 .AutomationName(automationName)
-                .Foreground(Theme.PrimaryText)
+                .Foreground(Theme.SecondaryText)
                 .Resources(resources => resources
-                    .Set("ButtonBackground", Theme.ControlFill)
-                    .Set("ButtonBackgroundPointerOver", Theme.Ref("ControlFillColorSecondaryBrush"))
-                    .Set("ButtonBackgroundPressed", Theme.ControlFillTertiary)
-                    .Set("ButtonBorderBrush", Theme.ControlStroke)
-                    .Set("ButtonBorderBrushPointerOver", Theme.ControlStroke)
-                    .Set("ButtonBorderBrushPressed", Theme.ControlStroke))
+                    .Set("ButtonBackground", Theme.Ref("SubtleFillColorTransparentBrush"))
+                    .Set("ButtonBackgroundPointerOver", Theme.SubtleFill)
+                    .Set("ButtonBackgroundPressed", Theme.Ref("SubtleFillColorTertiaryBrush"))
+                    .Set("ButtonBorderBrush", Theme.Ref("SubtleFillColorTransparentBrush"))
+                    .Set("ButtonBorderBrushPointerOver", Theme.Ref("SubtleFillColorTransparentBrush"))
+                    .Set("ButtonBorderBrushPressed", Theme.Ref("SubtleFillColorTransparentBrush")))
                 .Height(32)
                 .MinHeight(32)
-                .MinWidth(64)
-                .Padding(12, 0, 8, 0)
+                .MinWidth(0)
+                .Padding(8, 0, 8, 0)
                 .CornerRadius(controlCornerRadius)
                 .IsEnabled(enabled)
-                .BorderThickness(1)
+                .BorderThickness(0)
                 .AutomationId(automationId)
                 .Set(button => ComposerAutomationVisibility.Prepare(button))
                 .OnUnmount(control => ComposerAutomationVisibility.Detach(
diff --git a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
index affaf32856..62d214639d 100644
--- a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
+++ b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
@@ -221,7 +221,7 @@ public void ReactorTimeline_RequeuesOnlyForCompletedHistoryReplacement()
     }
 
     [Fact]
-    public void ReactorComposer_StylesPickersAsFluentComboBox()
+    public void ReactorComposer_StylesPickersAsSubtleDropdown()
     {
         var composer = File.ReadAllText(Path.Combine(
             TestRepositoryPaths.GetRepositoryRoot(),
@@ -230,13 +230,15 @@ public void ReactorComposer_StylesPickersAsFluentComboBox()
             "Chat",
             "ReactorChatComposer.cs"));
 
-        // Pickers follow the design system's ComposerPicker (Fluent ComboBox):
-        // a bordered ControlFill/ControlStroke control with a trailing muted chevron,
-        // not the old borderless subtle button with an up-offset chevron.
-        Assert.Contains(".Set(\"ButtonBackground\", Theme.ControlFill)", composer);
-        Assert.Contains(".Set(\"ButtonBorderBrush\", Theme.ControlStroke)", composer);
-        Assert.Contains(".Margin(8, 0, 0, 0)", composer);
-        Assert.DoesNotContain(".Margin(2, 4, 0, 0)", composer);
+        // Pickers follow the design system's ComposerPicker: a borderless, subtle
+        // dropdown (transparent fill, subtle hover, muted value + chevron), not a
+        // bordered ControlFill/ControlStroke ComboBox. The chevron carries a small
+        // right/up offset to sit tight against the value text.
+        Assert.Contains(".Set(\"ButtonBackground\", Theme.Ref(\"SubtleFillColorTransparentBrush\"))", composer);
+        Assert.Contains(".Set(\"ButtonBackgroundPointerOver\", Theme.SubtleFill)", composer);
+        Assert.Contains(".Margin(2, 4, 0, 0)", composer);
+        Assert.DoesNotContain(".Set(\"ButtonBackground\", Theme.ControlFill)", composer);
+        Assert.DoesNotContain(".Set(\"ButtonBorderBrush\", Theme.ControlStroke)", composer);
     }
 
     [Fact]

From eaa530f0932934ebf08c2ac2c18b02d2e91ed3d7 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 10 Sep 2026 16:18:58 -0700
Subject: [PATCH 05/32] Revert composer picker production code; keep
 design-system seed only

This PR is design-system seeding only. Restore src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs and tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs to their main state, removing the composer picker code port entirely. The design system (.agents/design/*) still describes the subtle inline dropdown that the app actually ships, and design.json keeps the WinAppCli port authority. No production code or tests are changed by this PR.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs    |  6 ------
 .../ChatTimelinePresentationTests.cs                   | 10 +---------
 2 files changed, 1 insertion(+), 15 deletions(-)

diff --git a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
index eb4daf9c91..ffd8aab27d 100644
--- a/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
+++ b/src/OpenClaw.Tray.WinUI/Chat/ReactorChatComposer.cs
@@ -211,12 +211,6 @@ Element PickerButton(
             bool enabled,
             double maxLabelWidth)
         {
-            // Subtle inline picker per the design system's ComposerPicker: a
-            // borderless, transparent control showing the current value in muted
-            // secondary text with a trailing muted chevron. Hover/press use the
-            // subtle fills so the picker stays quiet in the composer toolbar and
-            // never competes with the primary Send action. Selection still opens the
-            // caller's MenuFlyout of RadioMenuItems.
             return Button(
                     HStack(
                         4,
diff --git a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
index 62d214639d..e258ba47a1 100644
--- a/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
+++ b/tests/OpenClaw.Tray.Tests/ChatTimelinePresentationTests.cs
@@ -221,7 +221,7 @@ public void ReactorTimeline_RequeuesOnlyForCompletedHistoryReplacement()
     }
 
     [Fact]
-    public void ReactorComposer_StylesPickersAsSubtleDropdown()
+    public void ReactorComposer_OffsetsPickerChevronRightAndUp()
     {
         var composer = File.ReadAllText(Path.Combine(
             TestRepositoryPaths.GetRepositoryRoot(),
@@ -230,15 +230,7 @@ public void ReactorComposer_StylesPickersAsSubtleDropdown()
             "Chat",
             "ReactorChatComposer.cs"));
 
-        // Pickers follow the design system's ComposerPicker: a borderless, subtle
-        // dropdown (transparent fill, subtle hover, muted value + chevron), not a
-        // bordered ControlFill/ControlStroke ComboBox. The chevron carries a small
-        // right/up offset to sit tight against the value text.
-        Assert.Contains(".Set(\"ButtonBackground\", Theme.Ref(\"SubtleFillColorTransparentBrush\"))", composer);
-        Assert.Contains(".Set(\"ButtonBackgroundPointerOver\", Theme.SubtleFill)", composer);
         Assert.Contains(".Margin(2, 4, 0, 0)", composer);
-        Assert.DoesNotContain(".Set(\"ButtonBackground\", Theme.ControlFill)", composer);
-        Assert.DoesNotContain(".Set(\"ButtonBorderBrush\", Theme.ControlStroke)", composer);
     }
 
     [Fact]

From ba2beaee15b01acdc9c7889263854076c167b061 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Fri, 11 Sep 2026 10:53:05 -0700
Subject: [PATCH 06/32] Match ChatComposer preview to the shipping composer

Update the ChatComposer sample values and placeholder to mirror the real Reactor composer (Message Assistant placeholder; Main session / Claude Sonnet 5 / Default pickers), and note that a picker with a single option (the session picker with one session) renders disabled so its label reads lighter than its enabled neighbours. Design data only; no code or token changes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 25e3f12fca..8d7f009e4f 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -155,7 +155,7 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline dropdown. A borderless, transparent picker showing the current value in `muted` secondary text with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`. Resting fill is transparent (SubtleFillColorTransparent); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note.",
+      "note": "Subtle inline dropdown. A borderless, transparent picker showing the current value in `muted` secondary text with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`. Resting fill is transparent (SubtleFillColorTransparent); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note.",
       "props": {
         "label": "Model"
       },
@@ -473,12 +473,12 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active); every other control stays subtle so the toolbar reads as quiet chrome. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. (Preview shows the rest state.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control stays subtle so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. (Preview shows the rest state with the placeholder visible.)",
       "props": {
-        "placeholder": "Message OpenClaw…",
-        "session": "Default",
-        "model": "Claude Opus 4.8",
-        "effort": "High"
+        "placeholder": "Message Assistant (Enter to send)",
+        "session": "Main session",
+        "model": "Claude Sonnet 5",
+        "effort": "Default"
       },
       "root": {
         "id": "chat-composer-root",

From ada5a629f923c5e2734c4414691fa8241aa833d7 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Fri, 11 Sep 2026 11:03:12 -0700
Subject: [PATCH 07/32] design: give chat-component buttons the ds-btn reset
 class

The ComposerPicker and the chat icon/send/copy buttons rendered with the
browser default button bevel in the Colophon preview because they were the
only authored el:button nodes without the canonical ds-btn reset class
(border: 1px solid transparent). Adding it drops the retro OS chrome so the
subtle borderless pickers render as intended; inline appearance still drives
radius, color, and the Send accent fill. Design-only, no production changes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 8d7f009e4f..8566b7c6c1 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -162,6 +162,7 @@
       "root": {
         "id": "composer-picker-root",
         "el": "button",
+        "class": "ds-btn",
         "attrs": {
           "type": "button",
           "role": "combobox",
@@ -357,6 +358,7 @@
                   {
                     "id": "chat-bubble-copy",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Copy",
@@ -414,6 +416,7 @@
                   {
                     "id": "chat-bubble-readaloud",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Read aloud",
@@ -536,6 +539,7 @@
                   {
                     "id": "chat-composer-add",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Add context",
@@ -614,6 +618,7 @@
                   {
                     "id": "chat-composer-mic",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Dictate",
@@ -671,6 +676,7 @@
                   {
                     "id": "chat-composer-speaker",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Read responses aloud",
@@ -724,6 +730,7 @@
                   {
                     "id": "chat-composer-settings",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Chat settings",
@@ -779,6 +786,7 @@
                   {
                     "id": "chat-composer-send",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Send",
@@ -908,6 +916,7 @@
                       {
                         "id": "chat-thread-user-copy",
                         "el": "button",
+                        "class": "ds-btn",
                         "attrs": {
                           "type": "button",
                           "title": "Copy",

From 3b62bbf5ec13a9191b40b14571312aa0108ea422 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Mon, 14 Sep 2026 10:43:14 -0700
Subject: [PATCH 08/32] design: render composer subtle pickers/buttons as WinUI
 subtle controls

The composer pickers and toolbar icon buttons ship as WinUI subtle
DropDownButtons / transparent Buttons (SubtleFillColorTransparent rest,
SubtleFillColorSecondary hover, SubtleFillColorTertiary press,
ControlCornerRadius, TextFillColorSecondary glyph) - verified against the
canonical ReactorChatComposer PickerButton and WinUI Fluent resources. In the
web preview these were rendering as native <button>s (browser chrome plus the
ds-btn web button weight), which read as Fluent-web rather than Fluent-Windows.
Represent them as role-annotated elements so the transparent WinUI rest state
shows cleanly; only the filled primary Send stays a real button. Notes now name
the WinUI control and resource ladder explicitly. Design-only, no production or
test changes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 43 +++++++++++++--------------------
 1 file changed, 17 insertions(+), 26 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 8566b7c6c1..fc6a35e00c 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -155,16 +155,14 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline dropdown. A borderless, transparent picker showing the current value in `muted` secondary text with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`. Resting fill is transparent (SubtleFillColorTransparent); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note.",
+      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). Resting fill is fully transparent (SubtleFillColorTransparent, i.e. no visible border or fill); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note. Preview note: rendered as a `role=combobox` element (not a native `<button>`) so the transparent WinUI rest state shows without the web browser's default button chrome; the web canvas cannot animate the SubtleFill hover/pressed states.",
       "props": {
         "label": "Model"
       },
       "root": {
         "id": "composer-picker-root",
-        "el": "button",
-        "class": "ds-btn",
+        "el": "div",
         "attrs": {
-          "type": "button",
           "role": "combobox",
           "aria-haspopup": "listbox",
           "aria-label": "{label}"
@@ -357,10 +355,9 @@
                   },
                   {
                     "id": "chat-bubble-copy",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Copy",
                       "aria-label": "Copy message"
                     },
@@ -415,10 +412,9 @@
                   },
                   {
                     "id": "chat-bubble-readaloud",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Read aloud",
                       "aria-label": "Read message aloud"
                     },
@@ -476,7 +472,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control stays subtle so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. (Preview shows the rest state with the placeholder visible.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. (Preview shows the rest state with the placeholder visible.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -538,10 +534,9 @@
                 "children": [
                   {
                     "id": "chat-composer-add",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Add context",
                       "aria-label": "Add context"
                     },
@@ -617,10 +612,9 @@
                 "children": [
                   {
                     "id": "chat-composer-mic",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Dictate",
                       "aria-label": "Dictate"
                     },
@@ -675,10 +669,9 @@
                   },
                   {
                     "id": "chat-composer-speaker",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Read responses aloud",
                       "aria-label": "Read responses aloud"
                     },
@@ -729,10 +722,9 @@
                   },
                   {
                     "id": "chat-composer-settings",
-                    "el": "button",
-                    "class": "ds-btn",
+                    "el": "div",
                     "attrs": {
-                      "type": "button",
+                      "role": "button",
                       "title": "Chat settings",
                       "aria-label": "Chat settings"
                     },
@@ -915,10 +907,9 @@
                       },
                       {
                         "id": "chat-thread-user-copy",
-                        "el": "button",
-                        "class": "ds-btn",
+                        "el": "div",
                         "attrs": {
-                          "type": "button",
+                          "role": "button",
                           "title": "Copy",
                           "aria-label": "Copy message"
                         },

From c59d18644cd341c3bdf4644688a9061e31779272 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Mon, 14 Sep 2026 11:34:28 -0700
Subject: [PATCH 09/32] design: render composer input as a borderless
 transparent textbox

The composer message input was a raw <textarea>, so the preview showed the
browser's default field border. The design intent is a borderless, transparent
WinUI TextBox (the hairline border belongs to the outer control panel, not the
input). Render it as a borderless contenteditable textbox (role=textbox) showing
the muted placeholder, so no field border shows in any theme, while keeping it
typeable. Design-only, no production or test changes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index fc6a35e00c..93512ecf92 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -472,7 +472,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. (Preview shows the rest state with the placeholder visible.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless `contenteditable` textbox (role=textbox) showing the muted placeholder, so no browser field border shows; the hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -497,20 +497,26 @@
         "children": [
           {
             "id": "chat-composer-input",
-            "el": "textarea",
+            "el": "div",
             "attrs": {
-              "rows": "2",
-              "placeholder": "{placeholder}"
+              "contenteditable": "true",
+              "role": "textbox",
+              "aria-multiline": "true",
+              "aria-label": "Message input"
             },
             "layout": {
               "padding": "2",
-              "width": "fill"
+              "width": "fill",
+              "height": 56
             },
             "appearance": {
               "fontFamily": "body",
               "textStyle": "body",
-              "color": "ink"
-            }
+              "color": "muted"
+            },
+            "children": [
+              "{placeholder}"
+            ]
           },
           {
             "id": "chat-composer-toolbar",

From 212b14c5493eef2b1126f580c2ef9f1d0deeb53f Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 15 Sep 2026 10:54:16 -0700
Subject: [PATCH 10/32] design: remove web focus outline from composer input
 preview

Clicking the composer input showed the browser's :focus outline ring, a
web-Fluent artifact that only appeared because contenteditable made the div
focusable. A Windows Fluent TextBox has no such ring. Render the preview input
as a non-focusable role=textbox div (drop contenteditable) so no focus outline
shows on click, keeping the static borderless rest-state representation. The
real focus cue (accent underline) ships on port. Design-only.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 93512ecf92..b4962b3f78 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -472,7 +472,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless `contenteditable` textbox (role=textbox) showing the muted placeholder, so no browser field border shows; the hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless, non-focusable `role=textbox` div showing the muted placeholder, so no browser field border and no web focus outline appear on click; a real WinUI TextBox is borderless here (the hairline `controlLine` border belongs to the outer `control` panel only) and its focus cue is an accent underline, not a web outline box. (Preview shows the static rest state with the placeholder visible.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -499,9 +499,9 @@
             "id": "chat-composer-input",
             "el": "div",
             "attrs": {
-              "contenteditable": "true",
               "role": "textbox",
               "aria-multiline": "true",
+              "aria-readonly": "true",
               "aria-label": "Message input"
             },
             "layout": {

From 9aded00215c26a82de2f0e641fd574eec6b91616 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 15 Sep 2026 10:57:09 -0700
Subject: [PATCH 11/32] design: restore typeable composer input; route
 focus-ring to extension

Interactive editability is the point of the web preview, so keep the composer
input contenteditable (typeable). The browser's :focus outline ring that shows
on click is a web-Fluent artifact the static renderer cannot suppress from
design-only JSON (appearance has no outline key; raw style attrs are rejected).
Document that caveat and route the fix (suppress web outline / show a Windows
accent-underline focus cue) to the Colophon extension, tracked in
karkarl/colophon#14. Design-only.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index b4962b3f78..96815c717a 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -472,7 +472,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless, non-focusable `role=textbox` div showing the muted placeholder, so no browser field border and no web focus outline appear on click; a real WinUI TextBox is borderless here (the hairline `controlLine` border belongs to the outer `control` panel only) and its focus cue is an accent underline, not a web outline box. (Preview shows the static rest state with the placeholder visible.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder, so no browser field border appears; a real WinUI TextBox is borderless here (the hairline `controlLine` border belongs to the outer `control` panel only). Preview caveat: the browser draws its own web `:focus` outline ring on the editable region when clicked, which is NOT the Windows focus cue (a real WinUI TextBox shows a bottom accent underline). Suppressing that web ring / substituting the accent underline is a renderer concern owned by the Colophon extension (tracked in karkarl/colophon#14), not something design-only component JSON can express, since `appearance` has no outline key. (Preview shows the rest state with the placeholder visible; click to type.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -499,9 +499,9 @@
             "id": "chat-composer-input",
             "el": "div",
             "attrs": {
+              "contenteditable": "true",
               "role": "textbox",
               "aria-multiline": "true",
-              "aria-readonly": "true",
               "aria-label": "Message input"
             },
             "layout": {

From 3752e58e12358c26f372b88e940acf3c1688948b Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 15 Sep 2026 16:37:51 -0700
Subject: [PATCH 12/32] design: adopt colophon #16 interaction model for
 composer input and pickers

Re-express the chat composer's borderless input, subtle picker/icon
buttons, and picker flyout using the schema-pure interaction keys
(control/states/on) from the colophon #16 components schema, replacing
the earlier focus-ring-routing workaround. No raw CSS; all tokens bind
to design.json.

- ComposerPicker root is now a real transparent button: control.chrome
  none removes the web button border, control.focus supplies the Windows
  accent focus rectangle, and states carry WinUI subtleHover/subtlePressed
  plus a disabled shade. on.click opens a representative single-select
  ComposerPickerOptions flyout (targets take no props).
- New ComposerPickerOptions component: WinUI RadioMenuItem-style flyout on
  a surface sheet with md radius/shadow.
- chat-composer-input renders borderless and typeable with an accent
  underline on focus (control.chrome none + control.focus underline),
  dropping the web focus ring.
- The four subtle icon buttons (add context, dictate, read aloud, chat
  settings) become real buttons with transparent rest state and WinUI
  hover/pressed/hoverPressed states.
- Notes refreshed to describe the real button + control model and drop the
  obsolete combobox-div and web-ring caveats.

Design-only: no production or test files touched.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 120 ++++++++++++++++++++++++++++----
 1 file changed, 108 insertions(+), 12 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 96815c717a..62d81866a7 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -155,15 +155,15 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). Resting fill is fully transparent (SubtleFillColorTransparent, i.e. no visible border or fill); hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary), so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; opens a flyout list of single-select (RadioMenuItem) options in-app. The chevron carries a small right/up offset (previewed 2,4,0,0) to sit tight against the value; the flyout list is a Reactor port note. Preview note: rendered as a `role=combobox` element (not a native `<button>`) so the transparent WinUI rest state shows without the web browser's default button chrome; the web canvas cannot animate the SubtleFill hover/pressed states.",
+      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens an in-app single-select (RadioMenuItem) flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
       "props": {
         "label": "Model"
       },
       "root": {
         "id": "composer-picker-root",
-        "el": "div",
+        "el": "button",
         "attrs": {
-          "role": "combobox",
+          "type": "button",
           "aria-haspopup": "listbox",
           "aria-label": "{label}"
         },
@@ -182,8 +182,20 @@
           "fontFamily": "body",
           "textStyle": "small",
           "color": "muted",
+          "background": "$none",
           "radius": "sm"
         },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" },
+          "disabled": { "color": "muted", "background": "$none" }
+        },
+        "on": { "click": { "open": "ComposerPickerOptions" } },
         "children": [
           {
             "id": "composer-picker-label",
@@ -222,6 +234,46 @@
         ]
       }
     },
+    {
+      "name": "ComposerPickerOptions",
+      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "root": {
+        "id": "composer-picker-options",
+        "el": "div",
+        "attrs": { "role": "group", "aria-label": "Model" },
+        "layout": { "mode": "vertical", "gap": "1", "padding": "1", "width": "hug" },
+        "appearance": { "background": "surface", "color": "ink", "textStyle": "small", "radius": "md", "shadow": "md" },
+        "children": [
+          {
+            "id": "composer-option-sonnet",
+            "el": "label",
+            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "children": [
+              { "id": "composer-option-sonnet-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "sonnet", "checked": true } },
+              "Claude Sonnet 5"
+            ]
+          },
+          {
+            "id": "composer-option-opus",
+            "el": "label",
+            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "children": [
+              { "id": "composer-option-opus-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "opus" } },
+              "Claude Opus 4.8"
+            ]
+          },
+          {
+            "id": "composer-option-gpt",
+            "el": "label",
+            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "children": [
+              { "id": "composer-option-gpt-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "gpt" } },
+              "GPT-5.6"
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "ChatBubble",
       "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of a bubble on a `subtleHover` fill with a `controlLine` border. The `bubble` radius (16px) is friendlier than the 8/12px control radii; padding tokens 4/3 mirror the app's 16/12. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Bubble max-width min(80%, 720px) and the run-start avatar gating are Reactor port notes (no token equivalent). (User messages ride the softer `accentSubtle` on the right in-app; this previews the assistant variant.)",
@@ -472,7 +524,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. Preview note: the subtle icon controls render as `role=button` elements (not native `<button>`s) so the transparent WinUI rest state shows without the web browser's button chrome; only the filled Send stays a real button. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder, so no browser field border appears; a real WinUI TextBox is borderless here (the hairline `controlLine` border belongs to the outer `control` panel only). Preview caveat: the browser draws its own web `:focus` outline ring on the editable region when clicked, which is NOT the Windows focus cue (a real WinUI TextBox shows a bottom accent underline). Suppressing that web ring / substituting the accent underline is a renderer concern owned by the Colophon extension (tracked in karkarl/colophon#14), not something design-only component JSON can express, since `appearance` has no outline key. (Preview shows the rest state with the placeholder visible; click to type.)",
+      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -514,6 +566,10 @@
               "textStyle": "body",
               "color": "muted"
             },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "underline", "color": "accent" }
+            },
             "children": [
               "{placeholder}"
             ]
@@ -540,9 +596,9 @@
                 "children": [
                   {
                     "id": "chat-composer-add",
-                    "el": "div",
+                    "el": "button",
                     "attrs": {
-                      "role": "button",
+                      "type": "button",
                       "title": "Add context",
                       "aria-label": "Add context"
                     },
@@ -555,8 +611,18 @@
                     },
                     "appearance": {
                       "color": "muted",
+                      "background": "$none",
                       "radius": "sm"
                     },
+                    "control": {
+                      "chrome": "none",
+                      "focus": { "kind": "outline", "color": "accent" }
+                    },
+                    "states": {
+                      "hover": { "background": "subtleHover" },
+                      "pressed": { "background": "subtlePressed" },
+                      "hoverPressed": { "background": "subtlePressed" }
+                    },
                     "children": [
                       {
                         "id": "chat-composer-add-glyph",
@@ -618,9 +684,9 @@
                 "children": [
                   {
                     "id": "chat-composer-mic",
-                    "el": "div",
+                    "el": "button",
                     "attrs": {
-                      "role": "button",
+                      "type": "button",
                       "title": "Dictate",
                       "aria-label": "Dictate"
                     },
@@ -633,8 +699,18 @@
                     },
                     "appearance": {
                       "color": "muted",
+                      "background": "$none",
                       "radius": "sm"
                     },
+                    "control": {
+                      "chrome": "none",
+                      "focus": { "kind": "outline", "color": "accent" }
+                    },
+                    "states": {
+                      "hover": { "background": "subtleHover" },
+                      "pressed": { "background": "subtlePressed" },
+                      "hoverPressed": { "background": "subtlePressed" }
+                    },
                     "children": [
                       {
                         "id": "chat-composer-mic-glyph",
@@ -675,9 +751,9 @@
                   },
                   {
                     "id": "chat-composer-speaker",
-                    "el": "div",
+                    "el": "button",
                     "attrs": {
-                      "role": "button",
+                      "type": "button",
                       "title": "Read responses aloud",
                       "aria-label": "Read responses aloud"
                     },
@@ -690,8 +766,18 @@
                     },
                     "appearance": {
                       "color": "muted",
+                      "background": "$none",
                       "radius": "sm"
                     },
+                    "control": {
+                      "chrome": "none",
+                      "focus": { "kind": "outline", "color": "accent" }
+                    },
+                    "states": {
+                      "hover": { "background": "subtleHover" },
+                      "pressed": { "background": "subtlePressed" },
+                      "hoverPressed": { "background": "subtlePressed" }
+                    },
                     "children": [
                       {
                         "id": "chat-composer-speaker-glyph",
@@ -728,9 +814,9 @@
                   },
                   {
                     "id": "chat-composer-settings",
-                    "el": "div",
+                    "el": "button",
                     "attrs": {
-                      "role": "button",
+                      "type": "button",
                       "title": "Chat settings",
                       "aria-label": "Chat settings"
                     },
@@ -743,8 +829,18 @@
                     },
                     "appearance": {
                       "color": "muted",
+                      "background": "$none",
                       "radius": "sm"
                     },
+                    "control": {
+                      "chrome": "none",
+                      "focus": { "kind": "outline", "color": "accent" }
+                    },
+                    "states": {
+                      "hover": { "background": "subtleHover" },
+                      "pressed": { "background": "subtlePressed" },
+                      "hoverPressed": { "background": "subtlePressed" }
+                    },
                     "children": [
                       {
                         "id": "chat-composer-settings-glyph",

From 5b0fcdfa8e70bc37699814d3f74c4b063f77dfab Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 16 Sep 2026 22:39:22 -0700
Subject: [PATCH 13/32] design: show accent checkmark for selected composer
 picker option

Replace the radio-dot selection indicator in ComposerPickerOptions with a
reserved leading glyph column that renders an accent checkmark on the
selected row, matching WinUI RadioMenuItem selection. Preserves
menuitemradio/aria-checked semantics.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 62d81866a7..e387e34ae8 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -236,38 +236,41 @@
     },
     {
       "name": "ComposerPickerOptions",
-      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` checkmark (WinUI RadioMenuItem selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
       "root": {
         "id": "composer-picker-options",
         "el": "div",
-        "attrs": { "role": "group", "aria-label": "Model" },
+        "attrs": { "role": "menu", "aria-label": "Model" },
         "layout": { "mode": "vertical", "gap": "1", "padding": "1", "width": "hug" },
         "appearance": { "background": "surface", "color": "ink", "textStyle": "small", "radius": "md", "shadow": "md" },
         "children": [
           {
             "id": "composer-option-sonnet",
             "el": "label",
+            "attrs": { "role": "menuitemradio", "aria-checked": "true" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
             "children": [
-              { "id": "composer-option-sonnet-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "sonnet", "checked": true } },
+              { "id": "composer-option-sonnet-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 }, "appearance": { "color": "accent", "textAlign": "center" }, "children": ["✓"] },
               "Claude Sonnet 5"
             ]
           },
           {
             "id": "composer-option-opus",
             "el": "label",
+            "attrs": { "role": "menuitemradio", "aria-checked": "false" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
             "children": [
-              { "id": "composer-option-opus-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "opus" } },
+              { "id": "composer-option-opus-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 } },
               "Claude Opus 4.8"
             ]
           },
           {
             "id": "composer-option-gpt",
             "el": "label",
+            "attrs": { "role": "menuitemradio", "aria-checked": "false" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
             "children": [
-              { "id": "composer-option-gpt-input", "el": "input", "attrs": { "type": "radio", "name": "composer-model", "value": "gpt" } },
+              { "id": "composer-option-gpt-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 } },
               "GPT-5.6"
             ]
           }

From 5a12399d5ad8d057673e464d31be10d7f21a650f Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 16 Sep 2026 22:44:28 -0700
Subject: [PATCH 14/32] design: render composer picker checkmark with Segoe
 Fluent Icons glyph

Use the Fluent icon CheckMark (U+E73E) in the Segoe Fluent Icons font for the
selected ComposerPickerOptions row instead of a generic Unicode check, matching
WinUI menu selection glyphs. Document the icon font as an 'icon' typography
family (SymbolThemeFontFamily provenance); the glyph keeps its accent color
token-bound and applies the icon font via a font-family-only raw style, since
the token appearance.fontFamily is capped to display/body/mono.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 4 ++--
 .agents/design/design.json      | 5 +++++
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index e387e34ae8..0ce9f57e33 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -236,7 +236,7 @@
     },
     {
       "name": "ComposerPickerOptions",
-      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` checkmark (WinUI RadioMenuItem selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` Segoe Fluent Icons CheckMark (glyph U+E73E, WinUI SymbolThemeFontFamily selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. The check glyph carries a font-family-only raw style because the icon font is outside the display/body/mono token set (documented as the `icon` typography family in design.json); color stays token-bound to `accent`. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
       "root": {
         "id": "composer-picker-options",
         "el": "div",
@@ -250,7 +250,7 @@
             "attrs": { "role": "menuitemradio", "aria-checked": "true" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
             "children": [
-              { "id": "composer-option-sonnet-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 }, "appearance": { "color": "accent", "textAlign": "center" }, "children": ["✓"] },
+              { "id": "composer-option-sonnet-check", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif" }, "layout": { "width": 16 }, "appearance": { "color": "accent", "textAlign": "center" }, "children": ["\uE73E"] },
               "Claude Sonnet 5"
             ]
           },
diff --git a/.agents/design/design.json b/.agents/design/design.json
index ad8c28b942..621f09fe94 100644
--- a/.agents/design/design.json
+++ b/.agents/design/design.json
@@ -79,6 +79,11 @@
       "weights": [400],
       "usage": "Commands, endpoints, tokens, logs, timestamps. Used heavily across setup and diagnostics surfaces."
     },
+    "icon": {
+      "family": "\"Segoe Fluent Icons\", \"Segoe MDL2 Assets\", sans-serif",
+      "weights": [400],
+      "usage": "Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Not for body text."
+    },
     "scale": [
       { "name": "display", "size": "40px", "lineHeight": "50px", "weight": 600, "role": "display", "tracking": "-0.01em" },
       { "name": "title",   "size": "28px", "lineHeight": "36px", "weight": 600, "role": "display" },

From 146fe4763cb8e7fce29c36359270518228b7a688 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 23 Sep 2026 12:33:55 -0700
Subject: [PATCH 15/32] seed(design): migrate Colophon design system to
 DESIGN.md convention

Re-express the v3 seed in Colophon's new DESIGN.md format (karkarl/colophon#20):
- Add root DESIGN.md carrying every token, Fluent `resource` mapping, the
  `authority` port targets (WinUI 3 default + Reactor chat override + winapp
  tooling, owner, sync process), per-color dark/high-contrast themes, and the
  OpenClaw principles prose (voice, hierarchy, do/don't, anti-references).
- Remove legacy .agents/design/design.json and .agents/design/principles.md;
  loadDesign now errors if both DESIGN.md and design.json coexist.
- Keep .agents/design/components.jsonc and colophon.jsonc unchanged.
- Repoint the AGENTS.md Colophon block at DESIGN.md.

Validated with the colophon validate.mjs CLI at commit cca8a71: design system is valid.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/design.json   | 129 -------------
 .agents/design/principles.md |  55 ------
 AGENTS.md                    |  23 +--
 DESIGN.md                    | 360 +++++++++++++++++++++++++++++++++++
 4 files changed, 372 insertions(+), 195 deletions(-)
 delete mode 100644 .agents/design/design.json
 delete mode 100644 .agents/design/principles.md
 create mode 100644 DESIGN.md

diff --git a/.agents/design/design.json b/.agents/design/design.json
deleted file mode 100644
index 621f09fe94..0000000000
--- a/.agents/design/design.json
+++ /dev/null
@@ -1,129 +0,0 @@
-{
-  "$schema": "https://agents.design/schema/v1",
-  "meta": {
-    "version": 1,
-    "updatedBy": "xaml+manual",
-    "note": "These tokens are the source of truth for DESIGN (brand, color, type, spacing, principles) and are framework-agnostic — components.jsx shows design intent for the canvas preview, not shipping code. They were captured by manual inspection of the repo's WinUI 3 / XAML and C# surfaces (the CSS/JSX scanner finds no files in a XAML repo) and map to Windows Fluent system resources (SystemAccentColor, Mica, Segoe UI Variable). To ship, port the design into native code via the port targets in `authority`. Edit in the Design System canvas or directly."
-  },
-  "authority": {
-    "designSource": "self",
-    "owner": "OpenClaw Windows (openclaw/openclaw-windows-node)",
-    "syncProcess": "Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.",
-    "tooling": {
-      "name": "winapp (WinAppCli)",
-      "source": "https://github.com/microsoft/WinAppCli",
-      "role": "The Windows App Development CLI is the single build/packaging tool for both port targets below. Both the WinUI 3 (XAML) shell and the Reactor chat surface now build, package, and generate app identity, manifests, and certificates through winapp, so treat it as the port authority's build toolchain."
-    },
-    "port": {
-      "authoritySource": "Native WinUI 3 / C# (Windows Fluent)",
-      "syncSource": "https://github.com/microsoft/win-dev-skills",
-      "toolingSource": "https://github.com/microsoft/WinAppCli",
-      "helperAgent": "win-dev-skills"
-    },
-    "portOverrides": [
-      {
-        "area": "chat",
-        "components": ["ChatBubble", "ChatComposer", "ChatThread"],
-        "authoritySource": "Reactor (Microsoft.UI.Reactor)",
-        "syncSource": "https://github.com/microsoft/microsoft-ui-reactor",
-        "toolingSource": "https://github.com/microsoft/WinAppCli",
-        "helperAgent": ""
-      }
-    ]
-  },
-  "brand": {
-    "name": "Windows Fluent UI for OpenClaw",
-    "tagline": "A calm native Windows companion for your AI assistant.",
-    "description": "Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite — a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions — Mica surfaces, the user's system accent, and Segoe UI Variable type — so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.",
-    "surface": "product",
-    "voice": "Clear, respectful, and native to Windows. Explain pairing, permissions, and security plainly. State what will happen and why; never alarmist, never hype.",
-    "personality": ["native", "trustworthy", "calm", "precise"],
-    "antiReferences": [
-      "custom-skinned controls that fight the OS theme",
-      "neon gradients and glassmorphism overload",
-      "ignoring the user's system accent or light/dark preference",
-      "cramming a web dashboard into a desktop window",
-      "hard-coded hex that breaks in dark or high-contrast mode"
-    ]
-  },
-  "colors": [
-    { "name": "ink",       "value": "#1b1b1b", "resource": "TextFillColorPrimaryBrush",         "themes": { "dark": "#ffffff", "highContrast": "#ffffff" }, "usage": "Primary text, headings. Fluent TextFillColorPrimary on light." },
-    { "name": "paper",     "value": "#f3f3f3", "resource": "ApplicationPageBackgroundThemeBrush", "themes": { "dark": "#202020", "highContrast": "#000000" }, "usage": "App / page background. Mica base / ApplicationPageBackground (light)." },
-    { "name": "surface",   "value": "#fbfbfb", "resource": "CardBackgroundFillColorDefaultBrush", "themes": { "dark": "#2b2b2b", "highContrast": "#000000" }, "usage": "Cards, flyouts, inputs. Fluent CardBackgroundFillColorDefault." },
-    { "name": "muted",     "value": "#5d5d5d", "resource": "TextFillColorSecondaryBrush",        "themes": { "dark": "#c8c8c8", "highContrast": "#ffffff" }, "usage": "Secondary text, captions. Fluent TextFillColorSecondary/Tertiary." },
-    { "name": "line",      "value": "#e5e5e5", "resource": "CardStrokeColorDefaultBrush",        "themes": { "dark": "#303030", "highContrast": "#ffffff" }, "usage": "Borders, dividers. Fluent CardStrokeColorDefault / DividerStroke." },
-    { "name": "accent",    "value": "#0067c0", "resource": "AccentFillColorDefaultBrush",         "themes": { "dark": "#4cc2ff", "highContrast": "#ffff00" }, "usage": "Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light)." },
-    { "name": "accentInk", "value": "#ffffff", "resource": "TextOnAccentFillColorPrimaryBrush",   "themes": { "dark": "#000000", "highContrast": "#000000" }, "usage": "Text/glyphs on accent fills." },
-    { "name": "positive",  "value": "#0f7b0f", "resource": "SystemFillColorSuccessBrush",         "themes": { "dark": "#6ccb5f", "highContrast": "#3ff23f" }, "usage": "Success / connected states. Fluent SystemFillColorSuccess." },
-    { "name": "warning",   "value": "#9d5d00", "resource": "SystemFillColorCautionBrush",         "themes": { "dark": "#fcd116", "highContrast": "#ffb000" }, "usage": "Warnings / attention. Fluent SystemFillColorCaution." },
-    { "name": "critical",  "value": "#c42b1c", "resource": "SystemFillColorCriticalBrush",        "themes": { "dark": "#ff99a4", "highContrast": "#ff5449" }, "usage": "Errors, disconnected, destructive. Fluent SystemFillColorCritical." },
-    { "name": "subtleHover",   "value": "rgba(0,0,0,0.037)", "resource": "SubtleFillColorSecondaryBrush", "themes": { "dark": "rgba(255,255,255,0.0605)", "highContrast": "transparent" }, "usage": "Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000)." },
-    { "name": "subtlePressed", "value": "rgba(0,0,0,0.024)", "resource": "SubtleFillColorTertiaryBrush",  "themes": { "dark": "rgba(255,255,255,0.0419)", "highContrast": "transparent" }, "usage": "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)." },
-    { "name": "control",       "value": "#ffffff", "resource": "ControlFillColorDefaultBrush",   "themes": { "dark": "#2d2d2d", "highContrast": "#000000" }, "usage": "Fill for input/entry controls — combo boxes, text fields, the chat composer. Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts)." },
-    { "name": "controlLine",   "value": "#ececec", "resource": "ControlStrokeColorDefaultBrush", "themes": { "dark": "#353535", "highContrast": "#ffffff" }, "usage": "Border for input/entry controls — combo boxes, text fields, composer, avatars. Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards)." },
-    { "name": "accentSubtle",  "value": "#1a75c7", "resource": "AccentFillColorSecondaryBrush",  "themes": { "dark": "#47b6ef", "highContrast": "#ffff00" }, "usage": "Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%) — quieter than the full accent reserved for primary actions." }
-  ],
-  "typography": {
-    "display": {
-      "family": "\"Segoe UI Variable Display\", \"Segoe UI Variable\", \"Segoe UI\", system-ui, sans-serif",
-      "weights": [400, 600],
-      "usage": "Page and section titles. Segoe UI Variable Display optical size."
-    },
-    "body": {
-      "family": "\"Segoe UI Variable Text\", \"Segoe UI Variable\", \"Segoe UI\", system-ui, sans-serif",
-      "weights": [400, 600],
-      "usage": "Body copy, UI labels, buttons. Segoe UI Variable Text optical size."
-    },
-    "mono": {
-      "family": "\"Cascadia Mono\", \"Cascadia Code\", Consolas, \"SFMono-Regular\", monospace",
-      "weights": [400],
-      "usage": "Commands, endpoints, tokens, logs, timestamps. Used heavily across setup and diagnostics surfaces."
-    },
-    "icon": {
-      "family": "\"Segoe Fluent Icons\", \"Segoe MDL2 Assets\", sans-serif",
-      "weights": [400],
-      "usage": "Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Not for body text."
-    },
-    "scale": [
-      { "name": "display", "size": "40px", "lineHeight": "50px", "weight": 600, "role": "display", "tracking": "-0.01em" },
-      { "name": "title",   "size": "28px", "lineHeight": "36px", "weight": 600, "role": "display" },
-      { "name": "heading", "size": "20px", "lineHeight": "28px", "weight": 600, "role": "body" },
-      { "name": "body",    "size": "14px", "lineHeight": "20px", "weight": 400, "role": "body" },
-      { "name": "small",   "size": "13px", "lineHeight": "18px", "weight": 400, "role": "body" },
-      { "name": "caption", "size": "12px", "lineHeight": "16px", "weight": 400, "role": "body" }
-    ]
-  },
-  "spacing": {
-    "unit": 4,
-    "scale": [
-      { "name": "1", "value": "4px" },
-      { "name": "2", "value": "8px" },
-      { "name": "3", "value": "12px" },
-      { "name": "4", "value": "16px" },
-      { "name": "5", "value": "24px" },
-      { "name": "6", "value": "32px" },
-      { "name": "7", "value": "48px" },
-      { "name": "8", "value": "64px" }
-    ]
-  },
-  "radii": [
-    { "name": "sm",   "value": "4px",   "usage": "Buttons, inputs, small controls. Fluent ControlCornerRadius." },
-    { "name": "md",   "value": "8px",   "usage": "Cards, dialogs, flyouts. Fluent OverlayCornerRadius." },
-    { "name": "lg",   "value": "12px",  "usage": "Large panels and grouped surfaces." },
-    { "name": "bubble", "value": "16px", "usage": "Chat message bubbles — intentionally friendlier than control radii. Mirrors OpenClawChatTimeline CornerRadius 16." },
-    { "name": "pill", "value": "999px", "usage": "Status pills, badges, toggles." }
-  ],
-  "shadows": [
-    { "name": "sm", "value": "0 1px 2px rgba(0,0,0,0.10)" },
-    { "name": "md", "value": "0 4px 16px rgba(0,0,0,0.12)" },
-    { "name": "lg", "value": "0 12px 40px rgba(0,0,0,0.16)" }
-  ],
-  "principles": [
-    "Defer to Windows. Theme off SystemAccentColor and Fluent resources so the app follows the user's accent, light/dark, and high-contrast choices.",
-    "One accent, and it means \"act here\". Selection, focus, and primary actions share the system accent; don't spend it on decoration.",
-    "Hierarchy over decoration — size, weight, and space do the work before color does.",
-    "State must be legible: connected, pairing, and error states read clearly via positive/warning/critical, never color alone.",
-    "No hard-coded hex in UI. Use tokens/theme resources so dark and high-contrast modes stay correct.",
-    "Motion is a cue, not a garnish: 120-200ms ease-out, no bounce."
-  ]
-}
diff --git a/.agents/design/principles.md b/.agents/design/principles.md
deleted file mode 100644
index 5baaa5cd30..0000000000
--- a/.agents/design/principles.md
+++ /dev/null
@@ -1,55 +0,0 @@
-# Design principles — Windows Fluent UI for OpenClaw
-
-> This is the prose companion to `design.json`. Designers write here; developers
-> and Copilot read here. Keep it short enough that people actually read it.
-> This is the design system for the **OpenClaw Windows Hub** app.
-
-## Design leads, native code ships
-These files are the source of truth for **design** — tokens, component intent, and
-principles — and are framework-agnostic. The React in `components.jsx` is design
-intent for the canvas preview, not shipping code. How a design becomes shipping code
-is recorded in `design.json` under `authority`:
-
-- **Default:** surfaces ship as **native WinUI 3 / C#** (Windows Fluent). Port the
-  design into XAML/C# using [win-dev-skills](https://github.com/microsoft/win-dev-skills).
-- **Chat surface** (`ChatBubble`, `ChatComposer`, `ChatThread`): ships via
-  **[Reactor](https://github.com/microsoft/microsoft-ui-reactor)**, the React-style
-  framework for this app's chat. (Reactor has no dedicated porting agent yet — WIP.)
-
-When you need a value the design doesn't cover, add it here first, then port it into
-the native/Reactor implementation via the matching source above — don't hard-code a
-one-off in feature code.
-
-## The one-line brief
-A calm native Windows companion for your AI assistant. It should feel like a
-quiet, trustworthy extension of Windows — Fluent surfaces, the user's own
-accent color — not a web dashboard wearing a desktop window.
-
-## Voice
-- Clear, respectful, and native to Windows. Say what will happen and why.
-- Explain pairing, permissions, and security plainly — never alarmist, never hype.
-- No hype words ("supercharge", "seamless", "revolutionary", "effortless").
-
-## Information hierarchy
-1. **One subject per screen.** Decide what the screen is *for* and let that element win.
-2. **Size and weight before color.** Establish the hierarchy in grayscale first; color is the last 10%.
-3. **One accent.** `accent` = "act here" (selection, focus, primary action). If everything is accented, nothing is.
-4. **Generous vertical rhythm.** Prefer the `space-5`/`space-6` steps between groups; let content breathe.
-
-## Do
-- Defer to Windows: theme off `SystemAccentColor` and Fluent resources so the app
-  follows the user's accent, light/dark, and high-contrast settings.
-- Use Segoe UI Variable for text and Cascadia Mono for commands, endpoints, tokens, and logs.
-- Make connection state legible: connected/pairing/error read via `positive`/`warning`/`critical`.
-- Keep motion to 120–200ms ease-out. Animate to explain, not to impress.
-
-## Don't
-- Don't hard-code hex in UI — it breaks in dark and high-contrast modes. Use tokens/theme resources.
-- Don't put gray text on a colored background.
-- Don't nest cards inside cards, or wrap every block in a card.
-- Don't reach for bounce/elastic easing; it reads as dated and AI-generated.
-- Don't fight the OS theme with custom-skinned controls or glassmorphism overload.
-
-## Anti-references
-If a mock could be mistaken for a neon-gradient SaaS landing page, or ignores the
-user's system accent and light/dark preference — start over.
diff --git a/AGENTS.md b/AGENTS.md
index 35cabba139..c079e39859 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -134,22 +134,23 @@ Important current facts:
 <!-- colophon:start -->
 ## Design system
 
-This repository has a living design system at [`.agents/design/`](.agents/design/). These files are the **source of truth for design** (tokens, component intent, and principles) and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
-**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below. Don't copy `components.jsonc` verbatim.
+This repository has a living design system at [`DESIGN.md`](DESIGN.md). These files are the **source of truth for design** — tokens, component intent, and principles — and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
+**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below — don't copy `components.jsonc` verbatim.
 
-- `.agents/design/design.json` - design tokens: brand, colors, typography, spacing, radii, shadows, principles.
-- `.agents/design/components.jsonc` - the component patterns to reuse (structure, variants, states).
-- `.agents/design/principles.md` - voice, information hierarchy, and do/don't guidance.
+- `DESIGN.md` — design tokens and rationale: brand, colors, typography, spacing, radii, shadows, principles.
+- `.agents/design/components.jsonc` — the component patterns to reuse (structure, variants, states).
 
-Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `.agents/design/` rather than hard-coding a one-off.
+Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `DESIGN.md` rather than hard-coding a one-off.
 
-**Port targets**: how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
-- Default: ships as Native WinUI 3 / C# (Windows Fluent), port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
-- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor), port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
+Use the **Colophon** tool/canvas to inspect, edit, and preview this system when available. Install the optional plugin with `copilot plugin install karkarl/colophon`. Without the extension, read and edit the files directly; Colophon is not required.
+
+**Port targets** — how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
+- Default: ships as Native WinUI 3 / C# (Windows Fluent) — port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
+- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor) — port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
 - Canonical implementation owner: OpenClaw Windows (openclaw/openclaw-windows-node)
 - Examples kept aligned via: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
 
-Colors in `design.json` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code, never hard-code the preview hex, so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
+Colors in `DESIGN.md` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code — never hard-code the preview hex — so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
 
-<sub>Managed by [Colophon](https://github.com/karkarl/colophon). Edit `.agents/design/` to change the system; this block only points to it.</sub>
+<sub>Managed by [Colophon](https://github.com/karkarl/colophon) — edit `DESIGN.md` to change the system; this block only points to it.</sub>
 <!-- colophon:end -->
diff --git a/DESIGN.md b/DESIGN.md
new file mode 100644
index 0000000000..607fb721e4
--- /dev/null
+++ b/DESIGN.md
@@ -0,0 +1,360 @@
+---
+version: alpha
+name: Windows Fluent UI for OpenClaw
+description: Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite — a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions — Mica surfaces, the user's system accent, and Segoe UI Variable type — so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.
+colors:
+  ink: "#1b1b1b"
+  paper: "#f3f3f3"
+  surface: "#fbfbfb"
+  muted: "#5d5d5d"
+  line: "#e5e5e5"
+  accent: "#0067c0"
+  accentInk: "#ffffff"
+  positive: "#0f7b0f"
+  warning: "#9d5d00"
+  critical: "#c42b1c"
+  subtleHover: rgba(0,0,0,0.037)
+  subtlePressed: rgba(0,0,0,0.024)
+  control: "#ffffff"
+  controlLine: "#ececec"
+  accentSubtle: "#1a75c7"
+typography:
+  display:
+    fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 40px
+    fontWeight: 600
+    lineHeight: 50px
+    letterSpacing: -0.01em
+  title:
+    fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 28px
+    fontWeight: 600
+    lineHeight: 36px
+  heading:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 20px
+    fontWeight: 600
+    lineHeight: 28px
+  body:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 14px
+    fontWeight: 400
+    lineHeight: 20px
+  small:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 13px
+    fontWeight: 400
+    lineHeight: 18px
+  caption:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 12px
+    fontWeight: 400
+    lineHeight: 16px
+spacing:
+  "1": 4px
+  "2": 8px
+  "3": 12px
+  "4": 16px
+  "5": 24px
+  "6": 32px
+  "7": 48px
+  "8": 64px
+rounded:
+  sm: 4px
+  md: 8px
+  lg: 12px
+  bubble: 16px
+  pill: 999px
+x-colophon:
+  version: 1
+  tokens:
+    $schema: https://agents.design/schema/v1
+    meta:
+      version: 1
+      updatedBy: xaml+manual
+      note: These tokens are the source of truth for DESIGN (brand, color, type, spacing, principles) and are framework-agnostic — components.jsx shows design intent for the canvas preview, not shipping code. They were captured by manual inspection of the repo's WinUI 3 / XAML and C# surfaces (the CSS/JSX scanner finds no files in a XAML repo) and map to Windows Fluent system resources (SystemAccentColor, Mica, Segoe UI Variable). To ship, port the design into native code via the port targets in `authority`. Edit in the Design System canvas or directly.
+    authority:
+      designSource: self
+      owner: OpenClaw Windows (openclaw/openclaw-windows-node)
+      syncProcess: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
+      tooling:
+        name: winapp (WinAppCli)
+        source: https://github.com/microsoft/WinAppCli
+        role: The Windows App Development CLI is the single build/packaging tool for both port targets below. Both the WinUI 3 (XAML) shell and the Reactor chat surface now build, package, and generate app identity, manifests, and certificates through winapp, so treat it as the port authority's build toolchain.
+      port:
+        authoritySource: Native WinUI 3 / C# (Windows Fluent)
+        syncSource: https://github.com/microsoft/win-dev-skills
+        toolingSource: https://github.com/microsoft/WinAppCli
+        helperAgent: win-dev-skills
+      portOverrides:
+        - area: chat
+          components:
+            - ChatBubble
+            - ChatComposer
+            - ChatThread
+          authoritySource: Reactor (Microsoft.UI.Reactor)
+          syncSource: https://github.com/microsoft/microsoft-ui-reactor
+          toolingSource: https://github.com/microsoft/WinAppCli
+          helperAgent: ""
+    shadows:
+      - name: sm
+        value: 0 1px 2px rgba(0,0,0,0.10)
+      - name: md
+        value: 0 4px 16px rgba(0,0,0,0.12)
+      - name: lg
+        value: 0 12px 40px rgba(0,0,0,0.16)
+    principles:
+      - Defer to Windows. Theme off SystemAccentColor and Fluent resources so the app follows the user's accent, light/dark, and high-contrast choices.
+      - One accent, and it means "act here". Selection, focus, and primary actions share the system accent; don't spend it on decoration.
+      - Hierarchy over decoration — size, weight, and space do the work before color does.
+      - "State must be legible: connected, pairing, and error states read clearly via positive/warning/critical, never color alone."
+      - No hard-coded hex in UI. Use tokens/theme resources so dark and high-contrast modes stay correct.
+      - "Motion is a cue, not a garnish: 120-200ms ease-out, no bounce."
+    brand:
+      tagline: A calm native Windows companion for your AI assistant.
+      surface: product
+      voice: Clear, respectful, and native to Windows. Explain pairing, permissions, and security plainly. State what will happen and why; never alarmist, never hype.
+      personality:
+        - native
+        - trustworthy
+        - calm
+        - precise
+      antiReferences:
+        - custom-skinned controls that fight the OS theme
+        - neon gradients and glassmorphism overload
+        - ignoring the user's system accent or light/dark preference
+        - cramming a web dashboard into a desktop window
+        - hard-coded hex that breaks in dark or high-contrast mode
+    colors:
+      ink:
+        resource: TextFillColorPrimaryBrush
+        themes:
+          dark: "#ffffff"
+          highContrast: "#ffffff"
+        usage: Primary text, headings. Fluent TextFillColorPrimary on light.
+      paper:
+        resource: ApplicationPageBackgroundThemeBrush
+        themes:
+          dark: "#202020"
+          highContrast: "#000000"
+        usage: App / page background. Mica base / ApplicationPageBackground (light).
+      surface:
+        resource: CardBackgroundFillColorDefaultBrush
+        themes:
+          dark: "#2b2b2b"
+          highContrast: "#000000"
+        usage: Cards, flyouts, inputs. Fluent CardBackgroundFillColorDefault.
+      muted:
+        resource: TextFillColorSecondaryBrush
+        themes:
+          dark: "#c8c8c8"
+          highContrast: "#ffffff"
+        usage: Secondary text, captions. Fluent TextFillColorSecondary/Tertiary.
+      line:
+        resource: CardStrokeColorDefaultBrush
+        themes:
+          dark: "#303030"
+          highContrast: "#ffffff"
+        usage: Borders, dividers. Fluent CardStrokeColorDefault / DividerStroke.
+      accent:
+        resource: AccentFillColorDefaultBrush
+        themes:
+          dark: "#4cc2ff"
+          highContrast: "#ffff00"
+        usage: Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light).
+      accentInk:
+        resource: TextOnAccentFillColorPrimaryBrush
+        themes:
+          dark: "#000000"
+          highContrast: "#000000"
+        usage: Text/glyphs on accent fills.
+      positive:
+        resource: SystemFillColorSuccessBrush
+        themes:
+          dark: "#6ccb5f"
+          highContrast: "#3ff23f"
+        usage: Success / connected states. Fluent SystemFillColorSuccess.
+      warning:
+        resource: SystemFillColorCautionBrush
+        themes:
+          dark: "#fcd116"
+          highContrast: "#ffb000"
+        usage: Warnings / attention. Fluent SystemFillColorCaution.
+      critical:
+        resource: SystemFillColorCriticalBrush
+        themes:
+          dark: "#ff99a4"
+          highContrast: "#ff5449"
+        usage: Errors, disconnected, destructive. Fluent SystemFillColorCritical.
+      subtleHover:
+        resource: SubtleFillColorSecondaryBrush
+        themes:
+          dark: rgba(255,255,255,0.0605)
+          highContrast: transparent
+        usage: "Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000)."
+      subtlePressed:
+        resource: SubtleFillColorTertiaryBrush
+        themes:
+          dark: rgba(255,255,255,0.0419)
+          highContrast: transparent
+        usage: "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)."
+      control:
+        resource: ControlFillColorDefaultBrush
+        themes:
+          dark: "#2d2d2d"
+          highContrast: "#000000"
+        usage: Fill for input/entry controls — combo boxes, text fields, the chat composer. Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts).
+      controlLine:
+        resource: ControlStrokeColorDefaultBrush
+        themes:
+          dark: "#353535"
+          highContrast: "#ffffff"
+        usage: Border for input/entry controls — combo boxes, text fields, composer, avatars. Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards).
+      accentSubtle:
+        resource: AccentFillColorSecondaryBrush
+        themes:
+          dark: "#47b6ef"
+          highContrast: "#ffff00"
+        usage: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%) — quieter than the full accent reserved for primary actions.
+    typography:
+      display:
+        weights:
+          - 400
+          - 600
+        usage: Page and section titles. Segoe UI Variable Display optical size.
+      body:
+        weights:
+          - 400
+          - 600
+        usage: Body copy, UI labels, buttons. Segoe UI Variable Text optical size.
+      mono:
+        family: '"Cascadia Mono", "Cascadia Code", Consolas, "SFMono-Regular", monospace'
+        weights:
+          - 400
+        usage: Commands, endpoints, tokens, logs, timestamps. Used heavily across setup and diagnostics surfaces.
+      icon:
+        family: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+        weights:
+          - 400
+        usage: Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Not for body text.
+      scale:
+        display:
+          role: display
+        title:
+          role: display
+        heading:
+          role: body
+        body:
+          role: body
+        small:
+          role: body
+        caption:
+          role: body
+    spacing:
+      unit: 4
+---
+
+## Overview
+
+Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite: a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions (Mica surfaces, the user's system accent, and Segoe UI Variable type) so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.
+
+<!-- colophon:note -->
+Edit and preview this design with the **Colophon** canvas in the GitHub Copilot app.
+Install the optional plugin with `copilot plugin install karkarl/colophon`.
+Agents without Colophon can read and edit this file directly.
+[Colophon documentation](https://github.com/karkarl/colophon).
+<!-- colophon:note -->
+
+This file owns the design tokens and rationale. `x-colophon` preserves preview
+themes, production resource mappings, and other Colophon-specific metadata.
+
+**The one-line brief.** A calm native Windows companion for your AI assistant. It should feel like a quiet, trustworthy extension of Windows (Fluent surfaces, the user's own accent color), not a web dashboard wearing a desktop window.
+
+Voice: Clear, respectful, and native to Windows. Explain pairing, permissions, and security plainly. State what will happen and why; never alarmist, never hype. No hype words ("supercharge", "seamless", "revolutionary", "effortless").
+
+Personality: native, trustworthy, calm, precise.
+
+## Colors
+
+- **ink** {colors.ink}: Primary text, headings. Fluent TextFillColorPrimary on light.
+- **paper** {colors.paper}: App / page background. Mica base / ApplicationPageBackground (light).
+- **surface** {colors.surface}: Cards, flyouts, inputs. Fluent CardBackgroundFillColorDefault.
+- **muted** {colors.muted}: Secondary text, captions. Fluent TextFillColorSecondary/Tertiary.
+- **line** {colors.line}: Borders, dividers. Fluent CardStrokeColorDefault / DividerStroke.
+- **accent** {colors.accent}: Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light).
+- **accentInk** {colors.accentInk}: Text/glyphs on accent fills.
+- **positive** {colors.positive}: Success / connected states. Fluent SystemFillColorSuccess.
+- **warning** {colors.warning}: Warnings / attention. Fluent SystemFillColorCaution.
+- **critical** {colors.critical}: Errors, disconnected, destructive. Fluent SystemFillColorCritical.
+- **subtleHover** {colors.subtleHover}: Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000).
+- **subtlePressed** {colors.subtlePressed}: Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000).
+- **control** {colors.control}: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault, distinct from the Card surface used for cards/flyouts.
+- **controlLine** {colors.controlLine}: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault, distinct from the Card/divider stroke used for cards.
+- **accentSubtle** {colors.accentSubtle}: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%), quieter than the full accent reserved for primary actions.
+
+Colors are preview swatches only. Bind each color's mapped `resource` key (in `x-colophon.tokens.colors`) rather than the hex, so light, dark, and high-contrast themes stay correct. Never put gray text on a colored background.
+
+## Typography
+
+- **display** {typography.display}: Page and section titles. Segoe UI Variable Display optical size.
+- **title** {typography.title}: Page and section titles. Segoe UI Variable Display optical size.
+- **heading** {typography.heading}: Section headings. Segoe UI Variable Text optical size.
+- **body** {typography.body}: Body copy, UI labels, buttons. Segoe UI Variable Text optical size.
+- **small** {typography.small}: Secondary and dense UI text. Segoe UI Variable Text optical size.
+- **caption** {typography.caption}: Captions and metadata. Segoe UI Variable Text optical size.
+
+Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E.
+
+## Layout
+
+Use the named spacing tokens rather than ad-hoc values. Prefer the `5` and `6` steps between groups so content can breathe. One subject per screen: decide what the screen is for, and let that element win.
+
+## Information hierarchy
+
+1. **One subject per screen.** Decide what the screen is for and let that element win.
+2. **Size and weight before color.** Establish the hierarchy in grayscale first; color is the last 10%.
+3. **One accent.** `accent` means "act here" (selection, focus, primary action). If everything is accented, nothing is.
+4. **Generous vertical rhythm.** Prefer the `5` and `6` spacing steps between groups; let content breathe.
+
+## Elevation & Depth
+
+Use the named shadows in `x-colophon.tokens.shadows` when elevation is needed. Keep shadows soft and shallow; depth should read as Fluent layering, not drop-shadow decoration.
+
+## Shapes
+
+Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for cards and flyouts, `lg` for grouped panels, `bubble` for chat messages (intentionally friendlier), and `pill` for status badges and toggles.
+
+## Components
+
+Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.
+Optional click-through flows live in `.agents/design/prototypes.jsonc`.
+
+## Do's and Don'ts
+
+Do:
+
+- Defer to Windows: theme off `SystemAccentColor` and Fluent resources so the app follows the user's accent, light/dark, and high-contrast settings.
+- Spend the accent sparingly. Selection, focus, and primary actions share the system accent; do not spend it on decoration.
+- Let size, weight, and space carry hierarchy before color does.
+- Make connection state legible: connected, pairing, and error read via `positive`/`warning`/`critical`, never by color alone.
+- Keep motion to 120-200ms ease-out. Animate to explain, not to impress.
+
+Don't:
+
+- Don't hard-code hex in UI; it breaks in dark and high-contrast modes. Use tokens/theme resources.
+- Don't put gray text on a colored background.
+- Don't nest cards inside cards, or wrap every block in a card.
+- Don't reach for bounce/elastic easing; it reads as dated.
+- Don't fight the OS theme with custom-skinned controls or glassmorphism overload.
+
+Anti-references: if a mock could be mistaken for a neon-gradient SaaS landing page, or ignores the user's system accent and light/dark preference, start over. Avoid: custom-skinned controls that fight the OS theme; neon gradients and glassmorphism overload; ignoring the user's system accent or light/dark preference; cramming a web dashboard into a desktop window; hard-coded hex that breaks in dark or high-contrast mode.
+
+## Production implementation
+
+The design files are the source of truth for design, and are framework-agnostic. `components.jsonc` shows design intent for preview, not shipping code. Follow `x-colophon.tokens.authority` for port targets, ownership, and synchronization:
+
+- **Default:** surfaces ship as **native WinUI 3 / C#** (Windows Fluent). Port the design into XAML/C# via [win-dev-skills](https://github.com/microsoft/win-dev-skills).
+- **Chat surface** (`ChatBubble`, `ChatComposer`, `ChatThread`): ships via **[Reactor](https://github.com/microsoft/microsoft-ui-reactor)**, the React-style framework for this app's chat. Reactor has no dedicated porting agent yet.
+- Both port targets build and package through **[winapp (WinAppCli)](https://github.com/microsoft/WinAppCli)**, the Windows App Development CLI, which also generates app identity, manifests, and certificates.
+
+Colors are preview swatches: bind their mapped `resource` keys rather than hard-coding hex values. Preserve the light, dark, and high-contrast mappings. The shipping implementation is canonical; component patterns are not shipping code. When you need a value the design doesn't cover, add it here first, then port it into the native/Reactor implementation via the matching reference above.

From 9a11bdf7ac3f88dc70239c1c1998226c949a62cd Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 24 Sep 2026 17:50:41 -0700
Subject: [PATCH 16/32] fix(design): remove em dashes from DESIGN.md and
 AGENTS.md for docs policy

CI user-facing documentation check forbids em dashes. Replace them in the
DESIGN.md front matter token descriptions and the managed AGENTS.md Colophon
block with commas, periods, and parentheses. Front-matter edits stay YAML-safe
(no colon-space introduced into plain scalars); colophon validate still passes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 AGENTS.md | 18 +++++++++---------
 DESIGN.md | 12 ++++++------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/AGENTS.md b/AGENTS.md
index c079e39859..a9bdee4c7b 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -134,23 +134,23 @@ Important current facts:
 <!-- colophon:start -->
 ## Design system
 
-This repository has a living design system at [`DESIGN.md`](DESIGN.md). These files are the **source of truth for design** — tokens, component intent, and principles — and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
-**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below — don't copy `components.jsonc` verbatim.
+This repository has a living design system at [`DESIGN.md`](DESIGN.md). These files are the **source of truth for design** (tokens, component intent, and principles) and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
+**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below. Don't copy `components.jsonc` verbatim.
 
-- `DESIGN.md` — design tokens and rationale: brand, colors, typography, spacing, radii, shadows, principles.
-- `.agents/design/components.jsonc` — the component patterns to reuse (structure, variants, states).
+- `DESIGN.md`: design tokens and rationale: brand, colors, typography, spacing, radii, shadows, principles.
+- `.agents/design/components.jsonc`: the component patterns to reuse (structure, variants, states).
 
 Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `DESIGN.md` rather than hard-coding a one-off.
 
 Use the **Colophon** tool/canvas to inspect, edit, and preview this system when available. Install the optional plugin with `copilot plugin install karkarl/colophon`. Without the extension, read and edit the files directly; Colophon is not required.
 
-**Port targets** — how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
-- Default: ships as Native WinUI 3 / C# (Windows Fluent) — port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
-- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor) — port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
+**Port targets** (how a design becomes shipping code here; design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
+- Default: ships as Native WinUI 3 / C# (Windows Fluent), port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
+- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor), port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
 - Canonical implementation owner: OpenClaw Windows (openclaw/openclaw-windows-node)
 - Examples kept aligned via: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
 
-Colors in `DESIGN.md` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code — never hard-code the preview hex — so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
+Colors in `DESIGN.md` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code (never hard-code the preview hex) so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
 
-<sub>Managed by [Colophon](https://github.com/karkarl/colophon) — edit `DESIGN.md` to change the system; this block only points to it.</sub>
+<sub>Managed by [Colophon](https://github.com/karkarl/colophon). Edit `DESIGN.md` to change the system; this block only points to it.</sub>
 <!-- colophon:end -->
diff --git a/DESIGN.md b/DESIGN.md
index 607fb721e4..cbc02d32da 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -1,7 +1,7 @@
 ---
 version: alpha
 name: Windows Fluent UI for OpenClaw
-description: Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite — a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions — Mica surfaces, the user's system accent, and Segoe UI Variable type — so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.
+description: Windows Fluent UI for OpenClaw is the design system for OpenClaw's native Windows companion suite, a WinUI 3 system-tray app that connects your PC to OpenClaw, the AI-powered personal assistant. The app pairs your PC to an OpenClaw gateway, exposes allowlisted Windows node capabilities over MCP, and guides first-run pairing through a setup wizard. Its interface follows Windows Fluent design conventions (Mica surfaces, the user's system accent, and Segoe UI Variable type) so it feels like a quiet, native extension of the OS rather than a bolted-on dashboard.
 colors:
   ink: "#1b1b1b"
   paper: "#f3f3f3"
@@ -72,7 +72,7 @@ x-colophon:
     meta:
       version: 1
       updatedBy: xaml+manual
-      note: These tokens are the source of truth for DESIGN (brand, color, type, spacing, principles) and are framework-agnostic — components.jsx shows design intent for the canvas preview, not shipping code. They were captured by manual inspection of the repo's WinUI 3 / XAML and C# surfaces (the CSS/JSX scanner finds no files in a XAML repo) and map to Windows Fluent system resources (SystemAccentColor, Mica, Segoe UI Variable). To ship, port the design into native code via the port targets in `authority`. Edit in the Design System canvas or directly.
+      note: These tokens are the source of truth for DESIGN (brand, color, type, spacing, principles) and are framework-agnostic, and components.jsx shows design intent for the canvas preview, not shipping code. They were captured by manual inspection of the repo's WinUI 3 / XAML and C# surfaces (the CSS/JSX scanner finds no files in a XAML repo) and map to Windows Fluent system resources (SystemAccentColor, Mica, Segoe UI Variable). To ship, port the design into native code via the port targets in `authority`. Edit in the Design System canvas or directly.
     authority:
       designSource: self
       owner: OpenClaw Windows (openclaw/openclaw-windows-node)
@@ -106,7 +106,7 @@ x-colophon:
     principles:
       - Defer to Windows. Theme off SystemAccentColor and Fluent resources so the app follows the user's accent, light/dark, and high-contrast choices.
       - One accent, and it means "act here". Selection, focus, and primary actions share the system accent; don't spend it on decoration.
-      - Hierarchy over decoration — size, weight, and space do the work before color does.
+      - Hierarchy over decoration. Size, weight, and space do the work before color does.
       - "State must be legible: connected, pairing, and error states read clearly via positive/warning/critical, never color alone."
       - No hard-coded hex in UI. Use tokens/theme resources so dark and high-contrast modes stay correct.
       - "Motion is a cue, not a garnish: 120-200ms ease-out, no bounce."
@@ -203,19 +203,19 @@ x-colophon:
         themes:
           dark: "#2d2d2d"
           highContrast: "#000000"
-        usage: Fill for input/entry controls — combo boxes, text fields, the chat composer. Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts).
+        usage: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts).
       controlLine:
         resource: ControlStrokeColorDefaultBrush
         themes:
           dark: "#353535"
           highContrast: "#ffffff"
-        usage: Border for input/entry controls — combo boxes, text fields, composer, avatars. Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards).
+        usage: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards).
       accentSubtle:
         resource: AccentFillColorSecondaryBrush
         themes:
           dark: "#47b6ef"
           highContrast: "#ffff00"
-        usage: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%) — quieter than the full accent reserved for primary actions.
+        usage: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%), quieter than the full accent reserved for primary actions.
     typography:
       display:
         weights:

From 21f1b56f0a403fc86dac4e8595cd8d44e0a800a8 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 14:19:46 -0700
Subject: [PATCH 17/32] seed(design): align chat surface with native home
 refresh (#1459)

Carry Barbara Kudiess's native chat modernization (#1459) into the Colophon seed as design-only guidance.

DESIGN.md: bubble radius 16->12 and new composer radius (20px); accentSubtle documents the chat-local ChatUserBrush binding; icon token gains the ChatSubmit/ChatAttach/ChevronDown/Stop Fluent glyph aliases; new Chat surface section covering ChatResources brushes, Mica/content-layer layering, reading geometry, and footer controls, sourced from docs/CHAT_VISUAL_DESIGN.md and Themes/ChatResources.xaml.

components.jsonc: ChatComposer panel now uses the composer radius and notes ChatComposerBrush/ChatStrokeBrush plus the Send/Stop/Attach glyphs; ChatBubble binds ChatCardBrush/ChatTextBrush with ChatSecondaryTextBrush code text and a ChatCopySuccessBrush copy checkmark; ComposerPicker notes the AutoSuggestBox+ListView model picker and slider/gauge effort picker with ChatPickerAccentBrush; ComposerPickerOptions flyout corners bump to lg (12px); ChatThread user bubble binds ChatUserBrush.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 16 ++++++++--------
 DESIGN.md                       | 22 ++++++++++++++++------
 2 files changed, 24 insertions(+), 14 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 0ce9f57e33..58f3f41790 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -2,7 +2,7 @@
   "meta": {
     "version": 3,
     "updatedBy": "copilot",
-    "note": "Windows Fluent UI for OpenClaw — ported from the v1 raw-CSS components.jsonc to v3 Auto Layout. WinUI-derived pixel padding is snapped to the nearest 4px spacing token; per-component notes record the source values and any approximation."
+    "note": "Windows Fluent UI for OpenClaw — ported from the v1 raw-CSS components.jsonc to v3 Auto Layout. WinUI-derived pixel padding is snapped to the nearest 4px spacing token; per-component notes record the source values and any approximation. Chat components track the native chat refresh in docs/CHAT_VISUAL_DESIGN.md and Themes/ChatResources.xaml (#1459): message and code surfaces use the `bubble` (12px) radius, the composer uses the `composer` (20px) radius, and chat binds the chat-local ChatResources brushes."
   },
   "components": [
     {
@@ -155,7 +155,7 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens an in-app single-select (RadioMenuItem) flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens the picker flyout. Since #1459 the model picker is a native flyout with an AutoSuggestBox over a grouped, single-selection ListView, and the reasoning-effort picker is a native discrete slider with a compact gauge trigger (`ChatEffortGauge`, rendered with WinUI paths, not a font glyph) at narrow widths; a picker trigger value can tint with `ChatPickerAccentBrush`. The session selector stays a single-select flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
       "props": {
         "label": "Model"
       },
@@ -236,13 +236,13 @@
     },
     {
       "name": "ComposerPickerOptions",
-      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with `md` overlay radius and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` Segoe Fluent Icons CheckMark (glyph U+E73E, WinUI SymbolThemeFontFamily selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. The check glyph carries a font-family-only raw style because the icon font is outside the display/body/mono token set (documented as the `icon` typography family in design.json); color stays token-bound to `accent`. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with 12px (`lg`) overlay corners (ChatPickerFlyoutStyle, #1459) and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` Segoe Fluent Icons CheckMark (glyph U+E73E, WinUI SymbolThemeFontFamily selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. The check glyph carries a font-family-only raw style because the icon font is outside the display/body/mono token set (documented as the `icon` typography family in design.json); color stays token-bound to `accent`. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real model picker (AutoSuggestBox over a grouped ListView) and the effort slider/gauge are supplied by the app and are a Reactor port note.",
       "root": {
         "id": "composer-picker-options",
         "el": "div",
         "attrs": { "role": "menu", "aria-label": "Model" },
         "layout": { "mode": "vertical", "gap": "1", "padding": "1", "width": "hug" },
-        "appearance": { "background": "surface", "color": "ink", "textStyle": "small", "radius": "md", "shadow": "md" },
+        "appearance": { "background": "surface", "color": "ink", "textStyle": "small", "radius": "lg", "shadow": "md" },
         "children": [
           {
             "id": "composer-option-sonnet",
@@ -279,7 +279,7 @@
     },
     {
       "name": "ChatBubble",
-      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of a bubble on a `subtleHover` fill with a `controlLine` border. The `bubble` radius (16px) is friendlier than the 8/12px control radii; padding tokens 4/3 mirror the app's 16/12. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Bubble max-width min(80%, 720px) and the run-start avatar gating are Reactor port notes (no token equivalent). (User messages ride the softer `accentSubtle` on the right in-app; this previews the assistant variant.)",
+      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of a bubble on a `subtleHover` fill with a `controlLine` border. The `bubble` radius (12px) matches the refreshed native message and code surfaces (#1459); padding tokens 4/3 mirror the app's 16/12. In-app the bubble binds `ChatCardBrush`/`ChatTextBrush`, code text uses `ChatSecondaryTextBrush`, and the Copy action confirms with a `ChatCopySuccessBrush` checkmark that announces Copied and resets after two seconds. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Bubble max-width min(80%, 720px) and the run-start avatar gating are Reactor port notes (no token equivalent). (User messages ride the softer `accentSubtle` on the right in-app; this previews the assistant variant.)",
       "props": {
         "time": "2:14 PM",
         "usage": "12.5K/200K (6%)",
@@ -527,7 +527,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`md` radius) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
+      "note": "Chat input. A rounded `control` panel (`composer` radius, 20px) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. In-app it binds `ChatComposerBrush` (card fill) over the transparent chat canvas and `ChatStrokeBrush` for the hairline; Send is the Fluent ChatSubmit up glyph (U+E74A) that swaps to Stop (U+E71A) during an active turn, and Add uses ChatAttach (U+E710) (#1459). Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -547,7 +547,7 @@
         "appearance": {
           "background": "control",
           "borderColor": "controlLine",
-          "radius": "md"
+          "radius": "composer"
         },
         "children": [
           {
@@ -937,7 +937,7 @@
     },
     {
       "name": "ChatThread",
-      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and an assistant turn (avatar + Copy / Read aloud / context-usage readout), then the composer. Thread/bubble max-width 720px is a Reactor port note.",
+      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and an assistant turn (avatar + Copy / Read aloud / context-usage readout), then the composer. In-app the user bubble binds `ChatUserBrush` (accent at low opacity) with `ChatUserTextBrush`, and the footer follows the refreshed model and reasoning-effort pickers (#1459). Thread/bubble max-width 720px is a Reactor port note.",
       "root": {
         "id": "chat-thread-root",
         "el": "div",
diff --git a/DESIGN.md b/DESIGN.md
index cbc02d32da..a8c7bba8a9 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -63,7 +63,8 @@ rounded:
   sm: 4px
   md: 8px
   lg: 12px
-  bubble: 16px
+  bubble: 12px
+  composer: 20px
   pill: 999px
 x-colophon:
   version: 1
@@ -215,7 +216,7 @@ x-colophon:
         themes:
           dark: "#47b6ef"
           highContrast: "#ffff00"
-        usage: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%), quieter than the full accent reserved for primary actions.
+        usage: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local ChatUserBrush (Windows accent at low opacity, for example SystemAccentColorLight2 at 12% on dark and SystemAccentColorDark1 at 8% on light, with the full system highlight in high contrast). AccentFillColorSecondary is the closest standard Fluent approximation for preview.
     typography:
       display:
         weights:
@@ -236,7 +237,7 @@ x-colophon:
         family: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
         weights:
           - 400
-        usage: Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Not for body text.
+        usage: Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Chat toolbar aliases (FluentIconCatalog) include ChatSubmit U+E74A (send, up glyph), ChatAttach U+E710 (add), ChevronDown U+E70D (picker chevron), and Stop U+E71A (cancel an active turn). Not for body text.
       scale:
         display:
           role: display
@@ -290,7 +291,7 @@ Personality: native, trustworthy, calm, precise.
 - **subtlePressed** {colors.subtlePressed}: Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000).
 - **control** {colors.control}: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault, distinct from the Card surface used for cards/flyouts.
 - **controlLine** {colors.controlLine}: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault, distinct from the Card/divider stroke used for cards.
-- **accentSubtle** {colors.accentSubtle}: Softer accent fill for the user's own chat bubble. Fluent AccentFillColorSecondary (SystemAccent at ~90%), quieter than the full accent reserved for primary actions.
+- **accentSubtle** {colors.accentSubtle}: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local `ChatUserBrush` (Windows accent at low opacity), quieter than the full accent reserved for primary actions.
 
 Colors are preview swatches only. Bind each color's mapped `resource` key (in `x-colophon.tokens.colors`) rather than the hex, so light, dark, and high-contrast themes stay correct. Never put gray text on a colored background.
 
@@ -303,7 +304,7 @@ Colors are preview swatches only. Bind each color's mapped `resource` key (in `x
 - **small** {typography.small}: Secondary and dense UI text. Segoe UI Variable Text optical size.
 - **caption** {typography.caption}: Captions and metadata. Segoe UI Variable Text optical size.
 
-Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E.
+Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E, and the chat toolbar uses ChatSubmit (U+E74A), ChatAttach (U+E710), ChevronDown (U+E70D), and Stop (U+E71A).
 
 ## Layout
 
@@ -322,7 +323,16 @@ Use the named shadows in `x-colophon.tokens.shadows` when elevation is needed. K
 
 ## Shapes
 
-Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for cards and flyouts, `lg` for grouped panels, `bubble` for chat messages (intentionally friendlier), and `pill` for status badges and toggles.
+Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for cards and flyouts, `lg` for grouped panels, `bubble` (12px) for chat message and code surfaces, `composer` (20px) for the chat writing surface, and `pill` for status badges and toggles.
+
+## Chat surface
+
+The chat transcript and composer ship via Reactor and follow the native chat visual system in [`docs/CHAT_VISUAL_DESIGN.md`](../../docs/CHAT_VISUAL_DESIGN.md). They align to the reading rhythm of the released web chat without replacing Windows chrome, native input, or gateway contracts.
+
+- **Semantic brushes.** Chat binds the chat-local resources in `Themes/ChatResources.xaml` (Default/Light/HighContrast), not raw palette hex: `ChatCanvasBrush` (transparent; system window in HC), `ChatComposerBrush` and `ChatCardBrush` (`CardBackgroundFillColorDefault`), `ChatStrokeBrush` (`ControlStrokeColorDefault`), `ChatTextBrush` (`TextFillColorPrimary`), `ChatSecondaryTextBrush` (`TextFillColorSecondary`, used for code text), `ChatUserBrush` (accent at low opacity for the user bubble), `ChatUserTextBrush` (`TextFillColorPrimary`), `ChatPickerAccentBrush` (accent variants for picker triggers), and `ChatCopySuccessBrush` (`SystemFillColorSuccess`).
+- **Surface layering.** The Hub title bar and expanded navigation pane reveal Mica; `NavigationViewContentBackground` supplies one content layer (`LayerFillColorDefaultBrush`; system window in HC). The chat canvas is transparent so it neither hides nor doubles that layer, and the composer and code cards use the card fill above it. The standalone chat window uses the same Mica plus one content layer.
+- **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px. The writing surface uses the `composer` (20px) radius, a 16px editor inset, and a 112px minimum height; message and code surfaces use the `bubble` (12px) radius. All spacing stays on the 4px grid.
+- **Footer controls.** One bottom row keeps Attach, session, model, effort, voice, and the primary Send/Stop. The model picker is a native flyout with an AutoSuggestBox over a grouped single-selection list. Effort uses a native discrete slider with a compact gauge trigger (a WinUI-path rendering, not a font glyph) at narrow widths. Copy actions confirm with a `ChatCopySuccessBrush` checkmark and announce Copied.
 
 ## Components
 

From 9e37d3e2c19a5d58cac278f2548b8becd66cc463 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:01:35 -0700
Subject: [PATCH 18/32] seed(design): make assistant chat turns bubbleless
 (#1459)

The refreshed native chat renders assistant turns as plain prose flowing in the reading column (avatar + prose + footer), with only the user's own message on a soft ChatUserBrush bubble. The seed still wrapped the assistant message in a card, so correct ChatBubble and the DESIGN.md chat notes to match.

components.jsonc: ChatBubble message drops the fill/border/bubble-radius/padding and flows as ChatTextBrush body prose with a 16px (token 3) block gap; note and ChatThread note now state the assistant turn is bubbleless while code surfaces and the user bubble keep the bubble radius.

DESIGN.md: Chat surface geometry and Shapes clarify that assistant prose is bubbleless and the bubble radius applies to the user message and code surfaces.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 14 ++++----------
 DESIGN.md                       |  4 ++--
 2 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 58f3f41790..af41a6977d 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -279,7 +279,7 @@
     },
     {
       "name": "ChatBubble",
-      "note": "Assistant chat bubble: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of a bubble on a `subtleHover` fill with a `controlLine` border. The `bubble` radius (12px) matches the refreshed native message and code surfaces (#1459); padding tokens 4/3 mirror the app's 16/12. In-app the bubble binds `ChatCardBrush`/`ChatTextBrush`, code text uses `ChatSecondaryTextBrush`, and the Copy action confirms with a `ChatCopySuccessBrush` checkmark that announces Copied and resets after two seconds. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Bubble max-width min(80%, 720px) and the run-start avatar gating are Reactor port notes (no token equivalent). (User messages ride the softer `accentSubtle` on the right in-app; this previews the assistant variant.)",
+      "note": "Assistant chat turn: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of plain prose that flows in the reading column with NO bubble, card, border, or fill (#1459). The refreshed assistant turn is bubbleless: only the user's own message rides a soft bubble (see ChatThread), so the transcript reads like a document rather than facing chat cards. Prose binds `ChatTextBrush` (`ink`) at body type (14/21 in-app); top-level blocks use one uniform 16px gap (token 3). Inline code and fenced code still get their own `ChatCardBrush` surfaces with `ChatSecondaryTextBrush` code text and a `bubble` (12px) radius, and the Copy action confirms with a `ChatCopySuccessBrush` checkmark that announces Copied and resets after two seconds. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Reading column max-width 768px, 16px prose inset, and the avatar hiding below 960px are Reactor port notes (no token equivalent). (This previews the assistant variant; the user variant rides the softer `ChatUserBrush` bubble on the right.)",
       "props": {
         "time": "2:14 PM",
         "usage": "12.5K/200K (6%)",
@@ -350,18 +350,12 @@
                 "el": "div",
                 "layout": {
                   "mode": "vertical",
-                  "padding": {
-                    "x": "4",
-                    "y": "3"
-                  }
+                  "gap": "3"
                 },
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "body",
-                  "background": "subtleHover",
-                  "color": "ink",
-                  "borderColor": "controlLine",
-                  "radius": "bubble"
+                  "color": "ink"
                 },
                 "children": [
                   "{children}"
@@ -937,7 +931,7 @@
     },
     {
       "name": "ChatThread",
-      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and an assistant turn (avatar + Copy / Read aloud / context-usage readout), then the composer. In-app the user bubble binds `ChatUserBrush` (accent at low opacity) with `ChatUserTextBrush`, and the footer follows the refreshed model and reasoning-effort pickers (#1459). Thread/bubble max-width 720px is a Reactor port note.",
+      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and a bubbleless assistant turn (avatar + plain prose + Copy / Read aloud / context-usage readout), then the composer. Only the user's own message rides a bubble; the assistant turn flows as plain prose in the reading column (#1459). In-app the user bubble binds `ChatUserBrush` (accent at low opacity) with `ChatUserTextBrush`, and the footer follows the refreshed model and reasoning-effort pickers. Thread max-width 768px and the user bubble cap 720px are Reactor port notes.",
       "root": {
         "id": "chat-thread-root",
         "el": "div",
diff --git a/DESIGN.md b/DESIGN.md
index a8c7bba8a9..7946fdc511 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -323,7 +323,7 @@ Use the named shadows in `x-colophon.tokens.shadows` when elevation is needed. K
 
 ## Shapes
 
-Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for cards and flyouts, `lg` for grouped panels, `bubble` (12px) for chat message and code surfaces, `composer` (20px) for the chat writing surface, and `pill` for status badges and toggles.
+Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for cards and flyouts, `lg` for grouped panels, `bubble` (12px) for the user chat bubble and code surfaces (assistant prose is bubbleless), `composer` (20px) for the chat writing surface, and `pill` for status badges and toggles.
 
 ## Chat surface
 
@@ -331,7 +331,7 @@ The chat transcript and composer ship via Reactor and follow the native chat vis
 
 - **Semantic brushes.** Chat binds the chat-local resources in `Themes/ChatResources.xaml` (Default/Light/HighContrast), not raw palette hex: `ChatCanvasBrush` (transparent; system window in HC), `ChatComposerBrush` and `ChatCardBrush` (`CardBackgroundFillColorDefault`), `ChatStrokeBrush` (`ControlStrokeColorDefault`), `ChatTextBrush` (`TextFillColorPrimary`), `ChatSecondaryTextBrush` (`TextFillColorSecondary`, used for code text), `ChatUserBrush` (accent at low opacity for the user bubble), `ChatUserTextBrush` (`TextFillColorPrimary`), `ChatPickerAccentBrush` (accent variants for picker triggers), and `ChatCopySuccessBrush` (`SystemFillColorSuccess`).
 - **Surface layering.** The Hub title bar and expanded navigation pane reveal Mica; `NavigationViewContentBackground` supplies one content layer (`LayerFillColorDefaultBrush`; system window in HC). The chat canvas is transparent so it neither hides nor doubles that layer, and the composer and code cards use the card fill above it. The standalone chat window uses the same Mica plus one content layer.
-- **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px. The writing surface uses the `composer` (20px) radius, a 16px editor inset, and a 112px minimum height; message and code surfaces use the `bubble` (12px) radius. All spacing stays on the 4px grid.
+- **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px. The writing surface uses the `composer` (20px) radius, a 16px editor inset, and a 112px minimum height. Assistant turns are bubbleless: their prose flows in the reading column with no card or fill, so the transcript reads like a document. Only the user's own message and code blocks sit on a surface with the `bubble` (12px) radius. All spacing stays on the 4px grid.
 - **Footer controls.** One bottom row keeps Attach, session, model, effort, voice, and the primary Send/Stop. The model picker is a native flyout with an AutoSuggestBox over a grouped single-selection list. Effort uses a native discrete slider with a compact gauge trigger (a WinUI-path rendering, not a font glyph) at narrow widths. Copy actions confirm with a `ChatCopySuccessBrush` checkmark and announce Copied.
 
 ## Components

From c21dbecd13a299441fc09275f0bd49848b1f9b96 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:10:45 -0700
Subject: [PATCH 19/32] seed(design): add workspace shell components from
 production (#1541)

Populate the seed with the native Home and Sessions workspace surfaces shipped in #1541, using the app as the source of truth instead of placeholders. All bindings follow the real ThemeResource keys in WorkspaceWindow.xaml and the Controls XAML.

components.jsonc: add AgentIdentityBadge (PersonPicture + name/id), ConnectionStatusFlyout (GatewayStatusContent 304px status rows with system-fill dots and action links), NotificationFlyout (NotificationFlyoutContent cards, warning recurrence badge, empty/footer), and WorkspaceShell (Mica window, 256px NavigationView pane, assistant selector, Home/Sessions nav, Owner footer + notifications bell mounting the Reactor chat). meta.note records the #1541 provenance.

DESIGN.md: add a Workspace shell section documenting the pane, Owner footer (authenticated users.self with honest fallback), connection-status and notification flyouts, and the sidebar/toolbar glyph aliases.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 1334 ++++++++++++++++++++++++++++++-
 DESIGN.md                       |   10 +
 2 files changed, 1343 insertions(+), 1 deletion(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index af41a6977d..afefd8a3ca 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -2,7 +2,7 @@
   "meta": {
     "version": 3,
     "updatedBy": "copilot",
-    "note": "Windows Fluent UI for OpenClaw — ported from the v1 raw-CSS components.jsonc to v3 Auto Layout. WinUI-derived pixel padding is snapped to the nearest 4px spacing token; per-component notes record the source values and any approximation. Chat components track the native chat refresh in docs/CHAT_VISUAL_DESIGN.md and Themes/ChatResources.xaml (#1459): message and code surfaces use the `bubble` (12px) radius, the composer uses the `composer` (20px) radius, and chat binds the chat-local ChatResources brushes."
+    "note": "Windows Fluent UI for OpenClaw — ported from the v1 raw-CSS components.jsonc to v3 Auto Layout. WinUI-derived pixel padding is snapped to the nearest 4px spacing token; per-component notes record the source values and any approximation. Chat components track the native chat refresh in docs/CHAT_VISUAL_DESIGN.md and Themes/ChatResources.xaml (#1459): message and code surfaces use the `bubble` (12px) radius, the composer uses the `composer` (20px) radius, and chat binds the chat-local ChatResources brushes. Workspace-shell components (AgentIdentityBadge, ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell) mirror the native Home and Sessions workspace shipped in #1541: WorkspaceWindow.xaml (Mica shell, left NavigationView, Owner footer), Controls/AgentIdentityBadge.xaml, Controls/GatewayStatusContent.xaml, and Controls/NotificationFlyoutContent.xaml are the source of truth; token bindings follow their ThemeResource keys."
   },
   "components": [
     {
@@ -1083,6 +1083,1338 @@
         ]
       }
     },
+    {
+      "name": "AgentIdentityBadge",
+      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary). Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used in the assistant selector dropdown and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
+      "props": {
+        "name": "Aurora",
+        "handle": "agent-aurora"
+      },
+      "root": {
+        "id": "agent-badge-root",
+        "el": "div",
+        "layout": {
+          "mode": "horizontal",
+          "gap": "3",
+          "align": "center",
+          "width": "fill"
+        },
+        "children": [
+          {
+            "id": "agent-badge-avatar",
+            "el": "div",
+            "attrs": {
+              "aria-hidden": "true"
+            },
+            "layout": {
+              "mode": "horizontal",
+              "align": "center",
+              "justify": "center",
+              "width": 32,
+              "height": 32
+            },
+            "appearance": {
+              "background": "surface",
+              "borderColor": "controlLine",
+              "color": "muted",
+              "radius": "pill"
+            },
+            "children": [
+              {
+                "id": "agent-badge-avatar-glyph",
+                "el": "svg",
+                "attrs": {
+                  "width": "16",
+                  "height": "16",
+                  "viewBox": "0 0 24 24",
+                  "fill": "none",
+                  "stroke": "currentColor",
+                  "stroke-width": "2",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  "aria-hidden": "true"
+                },
+                "children": [
+                  {
+                    "id": "agent-badge-avatar-head",
+                    "el": "circle",
+                    "attrs": {
+                      "cx": "12",
+                      "cy": "8",
+                      "r": "4"
+                    }
+                  },
+                  {
+                    "id": "agent-badge-avatar-body",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M4 20a8 8 0 0 1 16 0"
+                    }
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "agent-badge-text",
+            "el": "div",
+            "layout": {
+              "mode": "vertical",
+              "grow": true
+            },
+            "children": [
+              {
+                "id": "agent-badge-name",
+                "el": "span",
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "body",
+                  "color": "ink"
+                },
+                "children": [
+                  "{name}"
+                ]
+              },
+              {
+                "id": "agent-badge-id",
+                "el": "span",
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "caption",
+                  "color": "muted"
+                },
+                "children": [
+                  "{handle}"
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "ConnectionStatusFlyout",
+      "note": "Gateway/Operator/Node status flyout from Controls/GatewayStatusContent.xaml (#1541), opened from the Workspace connection affordance. A 304px column of three status rows split by 1px `line` (CardStrokeColorDefault) dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail; a trailing accent HyperlinkButton (Reconnect / Approve) appears only when that layer needs action. The dot binds the Fluent system fill that matches state: `positive` (SystemFillColorSuccess) connected, `warning` (SystemFillColorCaution) attention, `critical` (SystemFillColorCritical) error, `muted` (SystemFillColorNeutral) unknown. Row vertical padding 10px maps to token 2; column spacing 11px to token 3. The flyout sheet, `md` overlay radius and shadow are supplied by the WinUI Flyout presenter; previewed here as a `surface` sheet.",
+      "root": {
+        "id": "conn-status-root",
+        "el": "div",
+        "layout": {
+          "mode": "vertical",
+          "width": 304,
+          "padding": "3"
+        },
+        "appearance": {
+          "background": "surface",
+          "color": "ink",
+          "radius": "md",
+          "shadow": "md"
+        },
+        "children": [
+          {
+            "id": "conn-status-gateway",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "gap": "3",
+              "align": "center",
+              "padding": {
+                "y": "2"
+              },
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "conn-status-gateway-dot",
+                "el": "span",
+                "attrs": {
+                  "aria-hidden": "true"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "width": 10,
+                  "height": 10
+                },
+                "appearance": {
+                  "background": "positive",
+                  "radius": "pill"
+                }
+              },
+              {
+                "id": "conn-status-gateway-text",
+                "el": "div",
+                "layout": {
+                  "mode": "vertical",
+                  "grow": true
+                },
+                "children": [
+                  {
+                    "id": "conn-status-gateway-label",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "body",
+                      "color": "ink"
+                    },
+                    "children": [
+                      "Gateway"
+                    ]
+                  },
+                  {
+                    "id": "conn-status-gateway-detail",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted"
+                    },
+                    "children": [
+                      "Connected · OpenClawGateway"
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "conn-status-divider-1",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "width": "fill",
+              "height": 1
+            },
+            "appearance": {
+              "background": "line"
+            }
+          },
+          {
+            "id": "conn-status-operator",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "gap": "3",
+              "align": "center",
+              "padding": {
+                "y": "2"
+              },
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "conn-status-operator-dot",
+                "el": "span",
+                "attrs": {
+                  "aria-hidden": "true"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "width": 10,
+                  "height": 10
+                },
+                "appearance": {
+                  "background": "positive",
+                  "radius": "pill"
+                }
+              },
+              {
+                "id": "conn-status-operator-text",
+                "el": "div",
+                "layout": {
+                  "mode": "vertical",
+                  "grow": true
+                },
+                "children": [
+                  {
+                    "id": "conn-status-operator-label",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "body",
+                      "color": "ink"
+                    },
+                    "children": [
+                      "Operator"
+                    ]
+                  },
+                  {
+                    "id": "conn-status-operator-detail",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted"
+                    },
+                    "children": [
+                      "Authorized"
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "conn-status-divider-2",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "width": "fill",
+              "height": 1
+            },
+            "appearance": {
+              "background": "line"
+            }
+          },
+          {
+            "id": "conn-status-node",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "gap": "3",
+              "align": "center",
+              "padding": {
+                "y": "2"
+              },
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "conn-status-node-dot",
+                "el": "span",
+                "attrs": {
+                  "aria-hidden": "true"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "width": 10,
+                  "height": 10
+                },
+                "appearance": {
+                  "background": "warning",
+                  "radius": "pill"
+                }
+              },
+              {
+                "id": "conn-status-node-text",
+                "el": "div",
+                "layout": {
+                  "mode": "vertical",
+                  "grow": true
+                },
+                "children": [
+                  {
+                    "id": "conn-status-node-label",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "body",
+                      "color": "ink"
+                    },
+                    "children": [
+                      "Node"
+                    ]
+                  },
+                  {
+                    "id": "conn-status-node-detail",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted"
+                    },
+                    "children": [
+                      "Waiting for approval"
+                    ]
+                  }
+                ]
+              },
+              {
+                "id": "conn-status-node-action",
+                "el": "a",
+                "attrs": {
+                  "href": "#",
+                  "role": "button"
+                },
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "caption",
+                  "color": "accent"
+                },
+                "children": [
+                  "Approve…"
+                ]
+              }
+            ]
+          },
+          {
+            "id": "conn-status-divider-3",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "width": "fill",
+              "height": 1
+            },
+            "appearance": {
+              "background": "line"
+            }
+          },
+          {
+            "id": "conn-status-open",
+            "el": "a",
+            "attrs": {
+              "href": "#",
+              "role": "button"
+            },
+            "margin": {
+              "top": "2"
+            },
+            "appearance": {
+              "fontFamily": "body",
+              "textStyle": "body",
+              "color": "accent"
+            },
+            "children": [
+              "Open Connection"
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "NotificationFlyout",
+      "note": "App notifications flyout from Controls/NotificationFlyoutContent.xaml (#1541), opened from the Workspace footer bell. A 352px column: a right-aligned Clear all link, a scrolling list of notification cards, and a footer pairing an Open notifications link with a tertiary active-count caption. Each card is a `surface` (CardBackgroundFillColorDefault) panel with a 1px `line` border, `md` (8px) radius and 12px (token 3) padding, laying out a leading severity glyph, a stack of body-strong title + caption message + caption `muted` metadata, and a trailing dismiss button. A recurrence count rides a `warning` Badge beside the title. An empty state swaps the list for a single centered card. Severity glyphs are Segoe Fluent Icons in-app; previewed here with a stroked alert glyph.",
+      "props": {
+        "title": "Approval required",
+        "message": "A Windows node capability is waiting for your approval.",
+        "metadata": "Just now · Node",
+        "count": "2×"
+      },
+      "root": {
+        "id": "notif-root",
+        "el": "div",
+        "layout": {
+          "mode": "vertical",
+          "gap": "2",
+          "width": 352
+        },
+        "children": [
+          {
+            "id": "notif-header",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "justify": "end",
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "notif-clear",
+                "el": "a",
+                "attrs": {
+                  "href": "#",
+                  "role": "button"
+                },
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "body",
+                  "color": "accent"
+                },
+                "children": [
+                  "Clear all"
+                ]
+              }
+            ]
+          },
+          {
+            "id": "notif-card",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "gap": "3",
+              "padding": "3",
+              "align": "start",
+              "width": "fill"
+            },
+            "appearance": {
+              "background": "surface",
+              "borderColor": "line",
+              "color": "ink",
+              "radius": "md"
+            },
+            "children": [
+              {
+                "id": "notif-card-glyph",
+                "el": "svg",
+                "attrs": {
+                  "width": "16",
+                  "height": "16",
+                  "viewBox": "0 0 24 24",
+                  "fill": "none",
+                  "stroke": "currentColor",
+                  "stroke-width": "2",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  "aria-hidden": "true"
+                },
+                "appearance": {
+                  "color": "warning"
+                },
+                "children": [
+                  {
+                    "id": "notif-card-glyph-tri",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"
+                    }
+                  },
+                  {
+                    "id": "notif-card-glyph-line",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M12 9v4"
+                    }
+                  },
+                  {
+                    "id": "notif-card-glyph-dot",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M12 17h.01"
+                    }
+                  }
+                ]
+              },
+              {
+                "id": "notif-card-text",
+                "el": "div",
+                "layout": {
+                  "mode": "vertical",
+                  "gap": "1",
+                  "grow": true
+                },
+                "children": [
+                  {
+                    "id": "notif-card-titlerow",
+                    "el": "div",
+                    "layout": {
+                      "mode": "horizontal",
+                      "gap": "2",
+                      "align": "center"
+                    },
+                    "children": [
+                      {
+                        "id": "notif-card-title",
+                        "el": "span",
+                        "appearance": {
+                          "fontFamily": "body",
+                          "textStyle": "body",
+                          "color": "ink"
+                        },
+                        "children": [
+                          "{title}"
+                        ]
+                      },
+                      {
+                        "id": "notif-card-count",
+                        "component": "Badge",
+                        "props": {
+                          "tone": "warning",
+                          "children": "{count}"
+                        }
+                      }
+                    ]
+                  },
+                  {
+                    "id": "notif-card-message",
+                    "el": "p",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "ink"
+                    },
+                    "children": [
+                      "{message}"
+                    ]
+                  },
+                  {
+                    "id": "notif-card-meta",
+                    "el": "p",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted"
+                    },
+                    "children": [
+                      "{metadata}"
+                    ]
+                  }
+                ]
+              },
+              {
+                "id": "notif-card-dismiss",
+                "el": "div",
+                "attrs": {
+                  "role": "button",
+                  "title": "Dismiss",
+                  "aria-label": "Dismiss notification"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "justify": "center",
+                  "width": 30,
+                  "height": 30
+                },
+                "appearance": {
+                  "color": "muted",
+                  "radius": "sm"
+                },
+                "children": [
+                  {
+                    "id": "notif-card-dismiss-glyph",
+                    "el": "svg",
+                    "attrs": {
+                      "width": "12",
+                      "height": "12",
+                      "viewBox": "0 0 24 24",
+                      "fill": "none",
+                      "stroke": "currentColor",
+                      "stroke-width": "2",
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      "aria-hidden": "true"
+                    },
+                    "children": [
+                      {
+                        "id": "notif-card-dismiss-path",
+                        "el": "path",
+                        "attrs": {
+                          "d": "M18 6L6 18M6 6l12 12"
+                        }
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "notif-footer",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "gap": "2",
+              "align": "center",
+              "justify": "space-between",
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "notif-footer-open",
+                "el": "a",
+                "attrs": {
+                  "href": "#",
+                  "role": "button"
+                },
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "body",
+                  "color": "accent"
+                },
+                "children": [
+                  "Open notifications"
+                ]
+              },
+              {
+                "id": "notif-footer-count",
+                "el": "span",
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "caption",
+                  "color": "muted"
+                },
+                "children": [
+                  "1 active"
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "WorkspaceShell",
+      "note": "The native Home and Sessions workspace shell from Windows/WorkspaceWindow.xaml (#1541): the landing window. A Mica window (previewed as `paper`) with a title bar, a 256px left NavigationView pane, and a content host that mounts the Reactor chat (see ChatThread). The pane stacks a Back/Forward toolbar and an assistant selector (transparent ComboBox over AgentIdentityBadge; a New agent option adds `add` glyph U+E710) in the PaneHeader; a Home item and a Sessions header with an inline add button, then reusable session rows, in the menu; and an Owner button plus a Notifications bell (with an InfoBadge count and the NotificationFlyout) in the PaneFooter. The Owner button reads the authenticated users.self profile (display name over a live connection-status caption, honest Owner / Disconnected fallback). Selected session rows use the native subtle selection background with a leading `accent` indicator; nav rows use `sm` (ControlCornerRadius) corners. Toolbar/selector/footer subtle buttons are transparent with `subtleHover`/`subtlePressed` states. Pane hide/reopen, exact-key Back/Forward history, and Owner MenuFlyout live in WorkspaceWindow/WindowManager and are port notes.",
+      "props": {
+        "owner": "Fixture Owner",
+        "status": "Connected"
+      },
+      "root": {
+        "id": "workspace-root",
+        "el": "div",
+        "layout": {
+          "mode": "vertical",
+          "width": "fill",
+          "height": 560
+        },
+        "appearance": {
+          "background": "paper",
+          "color": "ink"
+        },
+        "children": [
+          {
+            "id": "workspace-titlebar",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "align": "center",
+              "gap": "2",
+              "padding": {
+                "x": "3",
+                "y": "2"
+              },
+              "width": "fill"
+            },
+            "children": [
+              {
+                "id": "workspace-title",
+                "el": "span",
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "caption",
+                  "color": "muted"
+                },
+                "children": [
+                  "OpenClaw"
+                ]
+              }
+            ]
+          },
+          {
+            "id": "workspace-body",
+            "el": "div",
+            "layout": {
+              "mode": "horizontal",
+              "width": "fill",
+              "grow": true
+            },
+            "children": [
+              {
+                "id": "workspace-pane",
+                "el": "nav",
+                "layout": {
+                  "mode": "vertical",
+                  "gap": "3",
+                  "padding": "2",
+                  "width": 256,
+                  "height": "fill"
+                },
+                "appearance": {
+                  "borderColor": "line"
+                },
+                "children": [
+                  {
+                    "id": "workspace-pane-header",
+                    "el": "div",
+                    "layout": {
+                      "mode": "vertical",
+                      "gap": "2",
+                      "width": "fill"
+                    },
+                    "children": [
+                      {
+                        "id": "workspace-toolbar",
+                        "el": "div",
+                        "layout": {
+                          "mode": "horizontal",
+                          "gap": "2",
+                          "justify": "end",
+                          "width": "fill"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-back",
+                            "el": "div",
+                            "attrs": {
+                              "role": "button",
+                              "aria-label": "Back"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "align": "center",
+                              "justify": "center",
+                              "width": 40,
+                              "height": 40
+                            },
+                            "appearance": {
+                              "color": "muted",
+                              "radius": "sm"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-back-glyph",
+                                "el": "svg",
+                                "attrs": {
+                                  "width": "16",
+                                  "height": "16",
+                                  "viewBox": "0 0 24 24",
+                                  "fill": "none",
+                                  "stroke": "currentColor",
+                                  "stroke-width": "2",
+                                  "stroke-linecap": "round",
+                                  "stroke-linejoin": "round",
+                                  "aria-hidden": "true"
+                                },
+                                "children": [
+                                  {
+                                    "id": "workspace-back-path",
+                                    "el": "path",
+                                    "attrs": {
+                                      "d": "M15 18l-6-6 6-6"
+                                    }
+                                  }
+                                ]
+                              }
+                            ]
+                          },
+                          {
+                            "id": "workspace-forward",
+                            "el": "div",
+                            "attrs": {
+                              "role": "button",
+                              "aria-label": "Forward"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "align": "center",
+                              "justify": "center",
+                              "width": 40,
+                              "height": 40
+                            },
+                            "appearance": {
+                              "color": "muted",
+                              "radius": "sm"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-forward-glyph",
+                                "el": "svg",
+                                "attrs": {
+                                  "width": "16",
+                                  "height": "16",
+                                  "viewBox": "0 0 24 24",
+                                  "fill": "none",
+                                  "stroke": "currentColor",
+                                  "stroke-width": "2",
+                                  "stroke-linecap": "round",
+                                  "stroke-linejoin": "round",
+                                  "aria-hidden": "true"
+                                },
+                                "children": [
+                                  {
+                                    "id": "workspace-forward-path",
+                                    "el": "path",
+                                    "attrs": {
+                                      "d": "M9 18l6-6-6-6"
+                                    }
+                                  }
+                                ]
+                              }
+                            ]
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-selector",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button",
+                          "aria-label": "Assistant selector"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "gap": "2",
+                          "align": "center",
+                          "padding": {
+                            "x": "2",
+                            "y": "1"
+                          },
+                          "width": "fill"
+                        },
+                        "appearance": {
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-selector-agent",
+                            "component": "AgentIdentityBadge",
+                            "props": {
+                              "name": "Aurora",
+                              "handle": "agent-aurora"
+                            },
+                            "layout": {
+                              "grow": true
+                            }
+                          },
+                          {
+                            "id": "workspace-selector-chevron",
+                            "el": "svg",
+                            "attrs": {
+                              "width": "16",
+                              "height": "16",
+                              "viewBox": "0 0 24 24",
+                              "fill": "none",
+                              "stroke": "currentColor",
+                              "stroke-width": "2",
+                              "stroke-linecap": "round",
+                              "stroke-linejoin": "round",
+                              "aria-hidden": "true"
+                            },
+                            "appearance": {
+                              "color": "muted"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-selector-chevron-path",
+                                "el": "path",
+                                "attrs": {
+                                  "d": "M6 9l6 6 6-6"
+                                }
+                              }
+                            ]
+                          }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "workspace-nav",
+                    "el": "div",
+                    "layout": {
+                      "mode": "vertical",
+                      "gap": "1",
+                      "width": "fill"
+                    },
+                    "children": [
+                      {
+                        "id": "workspace-home",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "gap": "4",
+                          "align": "center",
+                          "padding": {
+                            "x": "3",
+                            "y": "2"
+                          },
+                          "width": "fill"
+                        },
+                        "appearance": {
+                          "background": "subtleHover",
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-home-indicator",
+                            "el": "span",
+                            "attrs": {
+                              "aria-hidden": "true"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "width": 3,
+                              "height": 16
+                            },
+                            "appearance": {
+                              "background": "accent",
+                              "radius": "pill"
+                            }
+                          },
+                          {
+                            "id": "workspace-home-label",
+                            "el": "span",
+                            "appearance": {
+                              "fontFamily": "body",
+                              "textStyle": "body",
+                              "color": "ink"
+                            },
+                            "children": [
+                              "Home"
+                            ]
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-sessions-header",
+                        "el": "div",
+                        "layout": {
+                          "mode": "horizontal",
+                          "gap": "2",
+                          "align": "center",
+                          "justify": "space-between",
+                          "padding": {
+                            "x": "3"
+                          },
+                          "width": "fill"
+                        },
+                        "margin": {
+                          "top": "2"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-sessions-label",
+                            "el": "span",
+                            "appearance": {
+                              "fontFamily": "body",
+                              "textStyle": "caption",
+                              "color": "muted"
+                            },
+                            "children": [
+                              "Sessions"
+                            ]
+                          },
+                          {
+                            "id": "workspace-sessions-add",
+                            "el": "div",
+                            "attrs": {
+                              "role": "button",
+                              "aria-label": "New conversation"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "align": "center",
+                              "justify": "center",
+                              "width": 32,
+                              "height": 32
+                            },
+                            "appearance": {
+                              "color": "muted",
+                              "radius": "sm"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-sessions-add-glyph",
+                                "el": "svg",
+                                "attrs": {
+                                  "width": "16",
+                                  "height": "16",
+                                  "viewBox": "0 0 24 24",
+                                  "fill": "none",
+                                  "stroke": "currentColor",
+                                  "stroke-width": "2",
+                                  "stroke-linecap": "round",
+                                  "stroke-linejoin": "round",
+                                  "aria-hidden": "true"
+                                },
+                                "children": [
+                                  {
+                                    "id": "workspace-sessions-add-path",
+                                    "el": "path",
+                                    "attrs": {
+                                      "d": "M12 5v14M5 12h14"
+                                    }
+                                  }
+                                ]
+                              }
+                            ]
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-session-1",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "align": "center",
+                          "gap": "2",
+                          "padding": {
+                            "x": "3",
+                            "y": "2"
+                          },
+                          "width": "fill"
+                        },
+                        "appearance": {
+                          "background": "subtleHover",
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-session-1-indicator",
+                            "el": "span",
+                            "attrs": {
+                              "aria-hidden": "true"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "width": 3,
+                              "height": 16
+                            },
+                            "appearance": {
+                              "background": "accent",
+                              "radius": "pill"
+                            }
+                          },
+                          {
+                            "id": "workspace-session-1-title",
+                            "el": "span",
+                            "layout": {
+                              "grow": true
+                            },
+                            "appearance": {
+                              "fontFamily": "body",
+                              "textStyle": "body",
+                              "color": "ink"
+                            },
+                            "children": [
+                              "Pair the Windows node"
+                            ]
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-session-2",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "align": "center",
+                          "gap": "2",
+                          "padding": {
+                            "x": "3",
+                            "y": "2"
+                          },
+                          "width": "fill"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-session-2-title",
+                            "el": "span",
+                            "layout": {
+                              "grow": true
+                            },
+                            "appearance": {
+                              "fontFamily": "body",
+                              "textStyle": "body",
+                              "color": "ink"
+                            },
+                            "children": [
+                              "Draft the release notes"
+                            ]
+                          }
+                        ]
+                      }
+                    ]
+                  },
+                  {
+                    "id": "workspace-footer-spacer",
+                    "el": "div",
+                    "layout": {
+                      "mode": "vertical",
+                      "grow": true
+                    }
+                  },
+                  {
+                    "id": "workspace-footer",
+                    "el": "div",
+                    "layout": {
+                      "mode": "horizontal",
+                      "gap": "1",
+                      "align": "center",
+                      "width": "fill"
+                    },
+                    "children": [
+                      {
+                        "id": "workspace-owner",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button",
+                          "aria-label": "Owner menu"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "gap": "3",
+                          "align": "center",
+                          "padding": "2",
+                          "grow": true
+                        },
+                        "appearance": {
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-owner-avatar",
+                            "el": "div",
+                            "attrs": {
+                              "aria-hidden": "true"
+                            },
+                            "layout": {
+                              "mode": "horizontal",
+                              "align": "center",
+                              "justify": "center",
+                              "width": 24,
+                              "height": 24
+                            },
+                            "appearance": {
+                              "background": "surface",
+                              "borderColor": "controlLine",
+                              "color": "muted",
+                              "radius": "pill"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-owner-avatar-glyph",
+                                "el": "svg",
+                                "attrs": {
+                                  "width": "14",
+                                  "height": "14",
+                                  "viewBox": "0 0 24 24",
+                                  "fill": "none",
+                                  "stroke": "currentColor",
+                                  "stroke-width": "2",
+                                  "stroke-linecap": "round",
+                                  "stroke-linejoin": "round",
+                                  "aria-hidden": "true"
+                                },
+                                "children": [
+                                  {
+                                    "id": "workspace-owner-avatar-head",
+                                    "el": "circle",
+                                    "attrs": {
+                                      "cx": "12",
+                                      "cy": "8",
+                                      "r": "4"
+                                    }
+                                  },
+                                  {
+                                    "id": "workspace-owner-avatar-body",
+                                    "el": "path",
+                                    "attrs": {
+                                      "d": "M4 20a8 8 0 0 1 16 0"
+                                    }
+                                  }
+                                ]
+                              }
+                            ]
+                          },
+                          {
+                            "id": "workspace-owner-text",
+                            "el": "div",
+                            "layout": {
+                              "mode": "vertical",
+                              "grow": true
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-owner-name",
+                                "el": "span",
+                                "appearance": {
+                                  "fontFamily": "body",
+                                  "textStyle": "body",
+                                  "color": "ink"
+                                },
+                                "children": [
+                                  "{owner}"
+                                ]
+                              },
+                              {
+                                "id": "workspace-owner-status",
+                                "el": "span",
+                                "appearance": {
+                                  "fontFamily": "body",
+                                  "textStyle": "caption",
+                                  "color": "muted"
+                                },
+                                "children": [
+                                  "{status}"
+                                ]
+                              }
+                            ]
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-bell",
+                        "el": "div",
+                        "attrs": {
+                          "role": "button",
+                          "aria-label": "Notifications"
+                        },
+                        "layout": {
+                          "mode": "horizontal",
+                          "align": "center",
+                          "justify": "center",
+                          "width": 40,
+                          "height": 40
+                        },
+                        "appearance": {
+                          "color": "muted",
+                          "radius": "sm"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-bell-glyph",
+                            "el": "svg",
+                            "attrs": {
+                              "width": "18",
+                              "height": "18",
+                              "viewBox": "0 0 24 24",
+                              "fill": "none",
+                              "stroke": "currentColor",
+                              "stroke-width": "2",
+                              "stroke-linecap": "round",
+                              "stroke-linejoin": "round",
+                              "aria-hidden": "true"
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-bell-body",
+                                "el": "path",
+                                "attrs": {
+                                  "d": "M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"
+                                }
+                              },
+                              {
+                                "id": "workspace-bell-clapper",
+                                "el": "path",
+                                "attrs": {
+                                  "d": "M13.7 21a2 2 0 0 1-3.4 0"
+                                }
+                              }
+                            ]
+                          }
+                        ]
+                      }
+                    ]
+                  }
+                ]
+              },
+              {
+                "id": "workspace-content",
+                "el": "div",
+                "layout": {
+                  "mode": "vertical",
+                  "grow": true,
+                  "padding": "5",
+                  "width": "fill"
+                },
+                "children": [
+                  {
+                    "id": "workspace-content-thread",
+                    "component": "ChatThread"
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "ExampleScreen",
       "note": "A representative Connection screen composed from the pieces above — the \"does it hang together\" check for the whole system. The status board is a freeform layer so the two cards can overlap into a Fluent-style dashboard, exercising v3 absolute positioning alongside Auto Layout.",
diff --git a/DESIGN.md b/DESIGN.md
index 7946fdc511..ad88079480 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -334,6 +334,16 @@ The chat transcript and composer ship via Reactor and follow the native chat vis
 - **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px. The writing surface uses the `composer` (20px) radius, a 16px editor inset, and a 112px minimum height. Assistant turns are bubbleless: their prose flows in the reading column with no card or fill, so the transcript reads like a document. Only the user's own message and code blocks sit on a surface with the `bubble` (12px) radius. All spacing stays on the 4px grid.
 - **Footer controls.** One bottom row keeps Attach, session, model, effort, voice, and the primary Send/Stop. The model picker is a native flyout with an AutoSuggestBox over a grouped single-selection list. Effort uses a native discrete slider with a compact gauge trigger (a WinUI-path rendering, not a font glyph) at narrow widths. Copy actions confirm with a `ChatCopySuccessBrush` checkmark and announce Copied.
 
+## Workspace shell
+
+The landing window is the native Home and Sessions workspace (`Windows/WorkspaceWindow.xaml`, shipped in #1541). It is a Mica window with a title bar, a 256px left `NavigationView` pane, and a content host that mounts the Reactor chat. Settings remains an independent native companion window.
+
+- **Pane.** The `NavigationViewExpandedPaneBackground` reveals Mica. The PaneHeader stacks a Back/Forward toolbar of subtle icon buttons over a transparent assistant selector (a borderless `ComboBox` rendering the selected agent through `AgentIdentityBadge`, with a New agent option that carries the `add` glyph U+E710). The menu lists a Home item, then a Sessions header whose inline add button starts a conversation, then one reusable row per session. Selected nav and session rows use the native subtle selection background with a leading `accent` indicator; rows use the `sm` (ControlCornerRadius) corners.
+- **Owner footer.** The PaneFooter pairs an Owner button with a Notifications bell. The Owner button reads the authenticated `users.self` profile: a display name over a live connection-status caption, falling back honestly to Owner / Disconnected when no profile is available. It never encodes authorization state. The bell shows an `InfoBadge` count and opens the notifications flyout.
+- **Connection status.** `Controls/GatewayStatusContent.xaml` is a 304px flyout of Gateway, Operator, and Node rows split by 1px `line` dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail, and reveals an `accent` action link (Reconnect, Approve) only when that layer needs one. The dot binds the Fluent system fill for its state: `positive` connected, `warning` attention, `critical` error, `muted` unknown, never color alone.
+- **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px flyout: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. Each card is a `surface` panel with a 1px `line` border, `md` (8px) corners, and 12px padding, laying out a leading severity glyph, a title/message/metadata stack, and a dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card.
+- **Sidebar glyphs.** Pane and toolbar glyphs are Segoe Fluent Icons or the SVGs under `Assets/SidebarIcons` (Chat, Sessions, Notifications, Connection, and the Settings destinations). Toolbar aliases include Back U+E76B, Forward U+E76C, add U+E710, toggle pane U+E90C, dismiss U+E711, and the Ringer notifications glyph U+EA8F.
+
 ## Components
 
 Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.

From e2c54814f9af26c996c9eedf18162d0d06a1b983 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:18:25 -0700
Subject: [PATCH 20/32] seed(design): hyperlink buttons and agent presence dot

Address review nits on the #1541 workspace components.

components.jsonc: model the four accent flyout links (Approve, Open Connection, Clear all, Open notifications) as real WinUI HyperlinkButtons (transparent subtle button chrome via control.chrome:none, accent text, accent focus rectangle, subtleHover/subtlePressed states) instead of plain anchors. AgentIdentityBadge now carries a presence status dot on the avatar bottom-right (10px pill with a paper ring, state-colored like the connection dots) and ships as a subtle transparent button with hover/pressed states, matching its assistant-selector and Owner-footer roles.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 177 +++++++++++++++++++++++++++-----
 1 file changed, 149 insertions(+), 28 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index afefd8a3ca..844236b647 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1085,41 +1085,69 @@
     },
     {
       "name": "AgentIdentityBadge",
-      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary). Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used in the assistant selector dropdown and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
+      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary). A presence status dot rides the avatar's bottom-right corner (PersonPicture Badge slot): a 10px `pill` dot with a `paper` ring, previewed `positive` (connected). Its fill follows connection state like the ConnectionStatusFlyout dots — `positive` connected, `warning` attention, `critical` error, `muted` unknown — never color alone. Because it ships as the assistant-selector trigger and the Owner footer button, the whole row is a subtle transparent WinUI Button (SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle); it spends no accent at rest. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
       "props": {
         "name": "Aurora",
         "handle": "agent-aurora"
       },
       "root": {
         "id": "agent-badge-root",
-        "el": "div",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "aria-label": "{name}"
+        },
         "layout": {
           "mode": "horizontal",
           "gap": "3",
           "align": "center",
+          "padding": "1",
           "width": "fill"
         },
+        "appearance": {
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" }
+        },
         "children": [
           {
-            "id": "agent-badge-avatar",
+            "id": "agent-badge-avatar-wrap",
             "el": "div",
             "attrs": {
               "aria-hidden": "true"
             },
             "layout": {
-              "mode": "horizontal",
-              "align": "center",
-              "justify": "center",
+              "mode": "freeform",
               "width": 32,
               "height": 32
             },
-            "appearance": {
-              "background": "surface",
-              "borderColor": "controlLine",
-              "color": "muted",
-              "radius": "pill"
-            },
             "children": [
+              {
+                "id": "agent-badge-avatar",
+                "el": "div",
+                "position": { "mode": "absolute", "x": 0, "y": 0 },
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "justify": "center",
+                  "width": 32,
+                  "height": 32
+                },
+                "appearance": {
+                  "background": "surface",
+                  "borderColor": "controlLine",
+                  "color": "muted",
+                  "radius": "pill"
+                },
+                "children": [
               {
                 "id": "agent-badge-avatar-glyph",
                 "el": "svg",
@@ -1154,6 +1182,23 @@
                 ]
               }
             ]
+              },
+              {
+                "id": "agent-badge-status",
+                "el": "span",
+                "position": { "mode": "absolute", "x": 22, "y": 22 },
+                "layout": {
+                  "mode": "horizontal",
+                  "width": 10,
+                  "height": 10
+                },
+                "appearance": {
+                  "background": "positive",
+                  "borderColor": "paper",
+                  "radius": "pill"
+                }
+              }
+            ]
           },
           {
             "id": "agent-badge-text",
@@ -1429,15 +1474,34 @@
               },
               {
                 "id": "conn-status-node-action",
-                "el": "a",
+                "el": "button",
                 "attrs": {
-                  "href": "#",
-                  "role": "button"
+                  "type": "button"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "padding": {
+                    "x": "2",
+                    "y": "1"
+                  },
+                  "width": "hug"
                 },
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "caption",
-                  "color": "accent"
+                  "color": "accent",
+                  "background": "$none",
+                  "radius": "sm"
+                },
+                "control": {
+                  "chrome": "none",
+                  "focus": { "kind": "outline", "color": "accent" }
+                },
+                "states": {
+                  "hover": { "background": "subtleHover" },
+                  "pressed": { "background": "subtlePressed" },
+                  "hoverPressed": { "background": "subtlePressed" }
                 },
                 "children": [
                   "Approve…"
@@ -1459,10 +1523,18 @@
           },
           {
             "id": "conn-status-open",
-            "el": "a",
+            "el": "button",
             "attrs": {
-              "href": "#",
-              "role": "button"
+              "type": "button"
+            },
+            "layout": {
+              "mode": "horizontal",
+              "align": "center",
+              "padding": {
+                "x": "2",
+                "y": "1"
+              },
+              "width": "hug"
             },
             "margin": {
               "top": "2"
@@ -1470,7 +1542,18 @@
             "appearance": {
               "fontFamily": "body",
               "textStyle": "body",
-              "color": "accent"
+              "color": "accent",
+              "background": "$none",
+              "radius": "sm"
+            },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
             },
             "children": [
               "Open Connection"
@@ -1508,15 +1591,34 @@
             "children": [
               {
                 "id": "notif-clear",
-                "el": "a",
+                "el": "button",
                 "attrs": {
-                  "href": "#",
-                  "role": "button"
+                  "type": "button"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "padding": {
+                    "x": "2",
+                    "y": "1"
+                  },
+                  "width": "hug"
                 },
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "body",
-                  "color": "accent"
+                  "color": "accent",
+                  "background": "$none",
+                  "radius": "sm"
+                },
+                "control": {
+                  "chrome": "none",
+                  "focus": { "kind": "outline", "color": "accent" }
+                },
+                "states": {
+                  "hover": { "background": "subtleHover" },
+                  "pressed": { "background": "subtlePressed" },
+                  "hoverPressed": { "background": "subtlePressed" }
                 },
                 "children": [
                   "Clear all"
@@ -1709,15 +1811,34 @@
             "children": [
               {
                 "id": "notif-footer-open",
-                "el": "a",
+                "el": "button",
                 "attrs": {
-                  "href": "#",
-                  "role": "button"
+                  "type": "button"
+                },
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "padding": {
+                    "x": "2",
+                    "y": "1"
+                  },
+                  "width": "hug"
                 },
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "body",
-                  "color": "accent"
+                  "color": "accent",
+                  "background": "$none",
+                  "radius": "sm"
+                },
+                "control": {
+                  "chrome": "none",
+                  "focus": { "kind": "outline", "color": "accent" }
+                },
+                "states": {
+                  "hover": { "background": "subtleHover" },
+                  "pressed": { "background": "subtlePressed" },
+                  "hoverPressed": { "background": "subtlePressed" }
                 },
                 "children": [
                   "Open notifications"

From 71748d74aa08413f202400955d2e37550b7a4164 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:22:45 -0700
Subject: [PATCH 21/32] seed(design): revert agent badge to plain row with
 dropdown chevron

The presence dot and subtle-button treatment belonged to the Owner profile button, not AgentIdentityBadge. Restore AgentIdentityBadge to a plain identity row (avatar + name/id) and add a trailing muted ChevronDown (U+E70D) so it reads as the assistant selector's dropdown trigger; the enclosing transparent ComboBox supplies the dropdown chrome, hover/pressed, and focus. HyperlinkButton link treatment is unchanged.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 96 ++++++++++++++-------------------
 1 file changed, 39 insertions(+), 57 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 844236b647..b1d0f40ab8 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1085,69 +1085,41 @@
     },
     {
       "name": "AgentIdentityBadge",
-      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary). A presence status dot rides the avatar's bottom-right corner (PersonPicture Badge slot): a 10px `pill` dot with a `paper` ring, previewed `positive` (connected). Its fill follows connection state like the ConnectionStatusFlyout dots — `positive` connected, `warning` attention, `critical` error, `muted` unknown — never color alone. Because it ships as the assistant-selector trigger and the Owner footer button, the whole row is a subtle transparent WinUI Button (SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle); it spends no accent at rest. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
+      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary) — with a trailing `muted` ChevronDown (Segoe Fluent U+E70D, previewed ~12px) marking it as the assistant selector's dropdown trigger. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used as the assistant selector trigger (the selected agent shown inside a transparent ComboBox that supplies the dropdown chrome, hover/pressed, and focus) and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
       "props": {
         "name": "Aurora",
         "handle": "agent-aurora"
       },
       "root": {
         "id": "agent-badge-root",
-        "el": "button",
-        "attrs": {
-          "type": "button",
-          "aria-label": "{name}"
-        },
+        "el": "div",
         "layout": {
           "mode": "horizontal",
           "gap": "3",
           "align": "center",
-          "padding": "1",
           "width": "fill"
         },
-        "appearance": {
-          "background": "$none",
-          "radius": "sm"
-        },
-        "control": {
-          "chrome": "none",
-          "focus": { "kind": "outline", "color": "accent" }
-        },
-        "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" }
-        },
         "children": [
           {
-            "id": "agent-badge-avatar-wrap",
+            "id": "agent-badge-avatar",
             "el": "div",
             "attrs": {
               "aria-hidden": "true"
             },
             "layout": {
-              "mode": "freeform",
+              "mode": "horizontal",
+              "align": "center",
+              "justify": "center",
               "width": 32,
               "height": 32
             },
+            "appearance": {
+              "background": "surface",
+              "borderColor": "controlLine",
+              "color": "muted",
+              "radius": "pill"
+            },
             "children": [
-              {
-                "id": "agent-badge-avatar",
-                "el": "div",
-                "position": { "mode": "absolute", "x": 0, "y": 0 },
-                "layout": {
-                  "mode": "horizontal",
-                  "align": "center",
-                  "justify": "center",
-                  "width": 32,
-                  "height": 32
-                },
-                "appearance": {
-                  "background": "surface",
-                  "borderColor": "controlLine",
-                  "color": "muted",
-                  "radius": "pill"
-                },
-                "children": [
               {
                 "id": "agent-badge-avatar-glyph",
                 "el": "svg",
@@ -1182,23 +1154,6 @@
                 ]
               }
             ]
-              },
-              {
-                "id": "agent-badge-status",
-                "el": "span",
-                "position": { "mode": "absolute", "x": 22, "y": 22 },
-                "layout": {
-                  "mode": "horizontal",
-                  "width": 10,
-                  "height": 10
-                },
-                "appearance": {
-                  "background": "positive",
-                  "borderColor": "paper",
-                  "radius": "pill"
-                }
-              }
-            ]
           },
           {
             "id": "agent-badge-text",
@@ -1233,6 +1188,33 @@
                 ]
               }
             ]
+          },
+          {
+            "id": "agent-badge-chevron",
+            "el": "svg",
+            "attrs": {
+              "width": "12",
+              "height": "12",
+              "viewBox": "0 0 24 24",
+              "fill": "none",
+              "stroke": "currentColor",
+              "stroke-width": "2",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              "aria-hidden": "true"
+            },
+            "appearance": {
+              "color": "muted"
+            },
+            "children": [
+              {
+                "id": "agent-badge-chevron-path",
+                "el": "path",
+                "attrs": {
+                  "d": "M6 9l6 6 6-6"
+                }
+              }
+            ]
           }
         ]
       }

From 82e19ae6274f31ab04de5f3ed9f6eeba4cec04fc Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:33:53 -0700
Subject: [PATCH 22/32] seed(design): agent badge subtle-button interaction and
 single nav selection

AgentIdentityBadge: restore the subtle transparent DropDownButton interaction (control.chrome:none rest, subtleHover/subtlePressed states, accent focus) while keeping the trailing dropdown chevron.

WorkspaceShell: drop the assistant selector's duplicate chevron (the badge already carries one) and simplify the selector to a plain container so the badge is the sole trigger. Deselect the session row so the pane has a single NavigationView selection (Home), matching native single-select behavior.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 84 +++++++++------------------------
 1 file changed, 22 insertions(+), 62 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index b1d0f40ab8..fdf47724f8 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1085,20 +1085,39 @@
     },
     {
       "name": "AgentIdentityBadge",
-      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary) — with a trailing `muted` ChevronDown (Segoe Fluent U+E70D, previewed ~12px) marking it as the assistant selector's dropdown trigger. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used as the assistant selector trigger (the selected agent shown inside a transparent ComboBox that supplies the dropdown chrome, hover/pressed, and focus) and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
+      "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary) — with a trailing `muted` ChevronDown (Segoe Fluent U+E70D, previewed ~12px) marking it as the assistant selector's dropdown trigger. It ships as a subtle transparent WinUI DropDownButton (SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle), so it stays quiet chrome and spends no accent at rest. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used as the assistant selector trigger and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
       "props": {
         "name": "Aurora",
         "handle": "agent-aurora"
       },
       "root": {
         "id": "agent-badge-root",
-        "el": "div",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "aria-haspopup": "listbox",
+          "aria-label": "{name}"
+        },
         "layout": {
           "mode": "horizontal",
           "gap": "3",
           "align": "center",
+          "padding": "1",
           "width": "fill"
         },
+        "appearance": {
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" }
+        },
         "children": [
           {
             "id": "agent-badge-avatar",
@@ -1845,7 +1864,7 @@
     },
     {
       "name": "WorkspaceShell",
-      "note": "The native Home and Sessions workspace shell from Windows/WorkspaceWindow.xaml (#1541): the landing window. A Mica window (previewed as `paper`) with a title bar, a 256px left NavigationView pane, and a content host that mounts the Reactor chat (see ChatThread). The pane stacks a Back/Forward toolbar and an assistant selector (transparent ComboBox over AgentIdentityBadge; a New agent option adds `add` glyph U+E710) in the PaneHeader; a Home item and a Sessions header with an inline add button, then reusable session rows, in the menu; and an Owner button plus a Notifications bell (with an InfoBadge count and the NotificationFlyout) in the PaneFooter. The Owner button reads the authenticated users.self profile (display name over a live connection-status caption, honest Owner / Disconnected fallback). Selected session rows use the native subtle selection background with a leading `accent` indicator; nav rows use `sm` (ControlCornerRadius) corners. Toolbar/selector/footer subtle buttons are transparent with `subtleHover`/`subtlePressed` states. Pane hide/reopen, exact-key Back/Forward history, and Owner MenuFlyout live in WorkspaceWindow/WindowManager and are port notes.",
+      "note": "The native Home and Sessions workspace shell from Windows/WorkspaceWindow.xaml (#1541): the landing window. A Mica window (previewed as `paper`) with a title bar, a 256px left NavigationView pane, and a content host that mounts the Reactor chat (see ChatThread). The pane stacks a Back/Forward toolbar and an assistant selector (transparent ComboBox over AgentIdentityBadge; a New agent option adds `add` glyph U+E710) in the PaneHeader; a Home item and a Sessions header with an inline add button, then reusable session rows, in the menu; and an Owner button plus a Notifications bell (with an InfoBadge count and the NotificationFlyout) in the PaneFooter. The Owner button reads the authenticated users.self profile (display name over a live connection-status caption, honest Owner / Disconnected fallback). Selection is single across the pane like a NavigationView: exactly one destination (Home or a session) is selected at a time (shown here on Home), using the native subtle selection background with a leading `accent` indicator; nav rows use `sm` (ControlCornerRadius) corners. Toolbar/selector/footer subtle buttons are transparent with `subtleHover`/`subtlePressed` states. Pane hide/reopen, exact-key Back/Forward history, and Owner MenuFlyout live in WorkspaceWindow/WindowManager and are port notes.",
       "props": {
         "owner": "Fixture Owner",
         "status": "Connected"
@@ -2028,23 +2047,11 @@
                       {
                         "id": "workspace-selector",
                         "el": "div",
-                        "attrs": {
-                          "role": "button",
-                          "aria-label": "Assistant selector"
-                        },
                         "layout": {
                           "mode": "horizontal",
-                          "gap": "2",
                           "align": "center",
-                          "padding": {
-                            "x": "2",
-                            "y": "1"
-                          },
                           "width": "fill"
                         },
-                        "appearance": {
-                          "radius": "sm"
-                        },
                         "children": [
                           {
                             "id": "workspace-selector-agent",
@@ -2056,33 +2063,6 @@
                             "layout": {
                               "grow": true
                             }
-                          },
-                          {
-                            "id": "workspace-selector-chevron",
-                            "el": "svg",
-                            "attrs": {
-                              "width": "16",
-                              "height": "16",
-                              "viewBox": "0 0 24 24",
-                              "fill": "none",
-                              "stroke": "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round",
-                              "aria-hidden": "true"
-                            },
-                            "appearance": {
-                              "color": "muted"
-                            },
-                            "children": [
-                              {
-                                "id": "workspace-selector-chevron-path",
-                                "el": "path",
-                                "attrs": {
-                                  "d": "M6 9l6 6 6-6"
-                                }
-                              }
-                            ]
                           }
                         ]
                       }
@@ -2240,27 +2220,7 @@
                           },
                           "width": "fill"
                         },
-                        "appearance": {
-                          "background": "subtleHover",
-                          "radius": "sm"
-                        },
                         "children": [
-                          {
-                            "id": "workspace-session-1-indicator",
-                            "el": "span",
-                            "attrs": {
-                              "aria-hidden": "true"
-                            },
-                            "layout": {
-                              "mode": "horizontal",
-                              "width": 3,
-                              "height": 16
-                            },
-                            "appearance": {
-                              "background": "accent",
-                              "radius": "pill"
-                            }
-                          },
                           {
                             "id": "workspace-session-1-title",
                             "el": "span",

From be79a759b10cd39d75429fbd6c2c968c16fb40e3 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 29 Sep 2026 20:40:16 -0700
Subject: [PATCH 23/32] design(colophon): add UserIdentityBadge and left-align
 agent badge text

Add a UserIdentityBadge component (owner/account identity) modeled on the WorkspaceWindow PaneFooter Owner button: a 24px avatar left of a display name over a connection-status line that pairs a leading status dot (positive/warning/critical/muted) with a muted caption. Ships as a subtle transparent WinUI Button. Wire the WorkspaceShell owner footer to reference it instead of the duplicated inline block. Left-align the AgentIdentityBadge name/handle text. Update the DESIGN.md Owner footer note.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 282 ++++++++++++++++++++------------
 DESIGN.md                       |   2 +-
 2 files changed, 178 insertions(+), 106 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index fdf47724f8..a6dfc1b337 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1179,6 +1179,7 @@
             "el": "div",
             "layout": {
               "mode": "vertical",
+              "align": "start",
               "grow": true
             },
             "children": [
@@ -1188,7 +1189,8 @@
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "body",
-                  "color": "ink"
+                  "color": "ink",
+                  "textAlign": "left"
                 },
                 "children": [
                   "{name}"
@@ -1200,7 +1202,8 @@
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "caption",
-                  "color": "muted"
+                  "color": "muted",
+                  "textAlign": "left"
                 },
                 "children": [
                   "{handle}"
@@ -1238,6 +1241,173 @@
         ]
       }
     },
+    {
+      "name": "UserIdentityBadge",
+      "note": "Owner / account identity from the Workspace PaneFooter (Windows/WorkspaceWindow.xaml #1541), and the sibling of AgentIdentityBadge: a 24px PersonPicture avatar to the LEFT of a two-line stack, the display name in body type over a connection-status line. Unlike AgentIdentityBadge, the status line pairs a small connection status dot with the caption `muted` label, dot on the LEFT of the status text. Reads the authenticated users.self profile (display name plus a live connection-status subtitle) with an honest Owner / Disconnected fallback; it never encodes authorization state. The dot follows connection state like the ConnectionStatusFlyout dots (`positive` connected, `warning` attention, `critical` error, `muted` unknown), never color alone. Ships as a subtle transparent WinUI Button that opens the Owner MenuFlyout: SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle. In-app the avatar is a real PersonPicture (initials or account photo), previewed here with a person glyph.",
+      "props": {
+        "name": "Ada Lovelace",
+        "status": "Connected"
+      },
+      "root": {
+        "id": "user-badge-root",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "aria-haspopup": "menu",
+          "aria-label": "{name}"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "3",
+          "align": "center",
+          "padding": "1",
+          "width": "fill"
+        },
+        "appearance": {
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": {
+            "kind": "outline",
+            "color": "accent"
+          }
+        },
+        "states": {
+          "hover": {
+            "background": "subtleHover"
+          },
+          "pressed": {
+            "background": "subtlePressed"
+          },
+          "hoverPressed": {
+            "background": "subtlePressed"
+          }
+        },
+        "children": [
+          {
+            "id": "user-badge-avatar",
+            "el": "div",
+            "attrs": {
+              "aria-hidden": "true"
+            },
+            "layout": {
+              "mode": "horizontal",
+              "align": "center",
+              "justify": "center",
+              "width": 24,
+              "height": 24
+            },
+            "appearance": {
+              "background": "surface",
+              "borderColor": "controlLine",
+              "color": "muted",
+              "radius": "pill"
+            },
+            "children": [
+              {
+                "id": "user-badge-avatar-glyph",
+                "el": "svg",
+                "attrs": {
+                  "width": "14",
+                  "height": "14",
+                  "viewBox": "0 0 24 24",
+                  "fill": "none",
+                  "stroke": "currentColor",
+                  "stroke-width": "2",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  "aria-hidden": "true"
+                },
+                "children": [
+                  {
+                    "id": "user-badge-avatar-head",
+                    "el": "circle",
+                    "attrs": {
+                      "cx": "12",
+                      "cy": "8",
+                      "r": "4"
+                    }
+                  },
+                  {
+                    "id": "user-badge-avatar-body",
+                    "el": "path",
+                    "attrs": {
+                      "d": "M4 20a8 8 0 0 1 16 0"
+                    }
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "user-badge-text",
+            "el": "div",
+            "layout": {
+              "mode": "vertical",
+              "align": "start",
+              "grow": true
+            },
+            "children": [
+              {
+                "id": "user-badge-name",
+                "el": "span",
+                "appearance": {
+                  "fontFamily": "body",
+                  "textStyle": "body",
+                  "color": "ink",
+                  "textAlign": "left"
+                },
+                "children": [
+                  "{name}"
+                ]
+              },
+              {
+                "id": "user-badge-status",
+                "el": "div",
+                "layout": {
+                  "mode": "horizontal",
+                  "gap": "1",
+                  "align": "center"
+                },
+                "children": [
+                  {
+                    "id": "user-badge-status-dot",
+                    "el": "span",
+                    "attrs": {
+                      "aria-hidden": "true"
+                    },
+                    "layout": {
+                      "mode": "horizontal",
+                      "width": 8,
+                      "height": 8
+                    },
+                    "appearance": {
+                      "background": "positive",
+                      "radius": "pill"
+                    }
+                  },
+                  {
+                    "id": "user-badge-status-label",
+                    "el": "span",
+                    "appearance": {
+                      "fontFamily": "body",
+                      "textStyle": "caption",
+                      "color": "muted",
+                      "textAlign": "left"
+                    },
+                    "children": [
+                      "{status}"
+                    ]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "ConnectionStatusFlyout",
       "note": "Gateway/Operator/Node status flyout from Controls/GatewayStatusContent.xaml (#1541), opened from the Workspace connection affordance. A 304px column of three status rows split by 1px `line` (CardStrokeColorDefault) dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail; a trailing accent HyperlinkButton (Reconnect / Approve) appears only when that layer needs action. The dot binds the Fluent system fill that matches state: `positive` (SystemFillColorSuccess) connected, `warning` (SystemFillColorCaution) attention, `critical` (SystemFillColorCritical) error, `muted` (SystemFillColorNeutral) unknown. Row vertical padding 10px maps to token 2; column spacing 11px to token 3. The flyout sheet, `md` overlay radius and shadow are supplied by the WinUI Flyout presenter; previewed here as a `surface` sheet.",
@@ -2294,112 +2464,14 @@
                     "children": [
                       {
                         "id": "workspace-owner",
-                        "el": "div",
-                        "attrs": {
-                          "role": "button",
-                          "aria-label": "Owner menu"
+                        "component": "UserIdentityBadge",
+                        "props": {
+                          "name": "{owner}",
+                          "status": "{status}"
                         },
                         "layout": {
-                          "mode": "horizontal",
-                          "gap": "3",
-                          "align": "center",
-                          "padding": "2",
                           "grow": true
-                        },
-                        "appearance": {
-                          "radius": "sm"
-                        },
-                        "children": [
-                          {
-                            "id": "workspace-owner-avatar",
-                            "el": "div",
-                            "attrs": {
-                              "aria-hidden": "true"
-                            },
-                            "layout": {
-                              "mode": "horizontal",
-                              "align": "center",
-                              "justify": "center",
-                              "width": 24,
-                              "height": 24
-                            },
-                            "appearance": {
-                              "background": "surface",
-                              "borderColor": "controlLine",
-                              "color": "muted",
-                              "radius": "pill"
-                            },
-                            "children": [
-                              {
-                                "id": "workspace-owner-avatar-glyph",
-                                "el": "svg",
-                                "attrs": {
-                                  "width": "14",
-                                  "height": "14",
-                                  "viewBox": "0 0 24 24",
-                                  "fill": "none",
-                                  "stroke": "currentColor",
-                                  "stroke-width": "2",
-                                  "stroke-linecap": "round",
-                                  "stroke-linejoin": "round",
-                                  "aria-hidden": "true"
-                                },
-                                "children": [
-                                  {
-                                    "id": "workspace-owner-avatar-head",
-                                    "el": "circle",
-                                    "attrs": {
-                                      "cx": "12",
-                                      "cy": "8",
-                                      "r": "4"
-                                    }
-                                  },
-                                  {
-                                    "id": "workspace-owner-avatar-body",
-                                    "el": "path",
-                                    "attrs": {
-                                      "d": "M4 20a8 8 0 0 1 16 0"
-                                    }
-                                  }
-                                ]
-                              }
-                            ]
-                          },
-                          {
-                            "id": "workspace-owner-text",
-                            "el": "div",
-                            "layout": {
-                              "mode": "vertical",
-                              "grow": true
-                            },
-                            "children": [
-                              {
-                                "id": "workspace-owner-name",
-                                "el": "span",
-                                "appearance": {
-                                  "fontFamily": "body",
-                                  "textStyle": "body",
-                                  "color": "ink"
-                                },
-                                "children": [
-                                  "{owner}"
-                                ]
-                              },
-                              {
-                                "id": "workspace-owner-status",
-                                "el": "span",
-                                "appearance": {
-                                  "fontFamily": "body",
-                                  "textStyle": "caption",
-                                  "color": "muted"
-                                },
-                                "children": [
-                                  "{status}"
-                                ]
-                              }
-                            ]
-                          }
-                        ]
+                        }
                       },
                       {
                         "id": "workspace-bell",
diff --git a/DESIGN.md b/DESIGN.md
index ad88079480..4045bacc13 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -339,7 +339,7 @@ The chat transcript and composer ship via Reactor and follow the native chat vis
 The landing window is the native Home and Sessions workspace (`Windows/WorkspaceWindow.xaml`, shipped in #1541). It is a Mica window with a title bar, a 256px left `NavigationView` pane, and a content host that mounts the Reactor chat. Settings remains an independent native companion window.
 
 - **Pane.** The `NavigationViewExpandedPaneBackground` reveals Mica. The PaneHeader stacks a Back/Forward toolbar of subtle icon buttons over a transparent assistant selector (a borderless `ComboBox` rendering the selected agent through `AgentIdentityBadge`, with a New agent option that carries the `add` glyph U+E710). The menu lists a Home item, then a Sessions header whose inline add button starts a conversation, then one reusable row per session. Selected nav and session rows use the native subtle selection background with a leading `accent` indicator; rows use the `sm` (ControlCornerRadius) corners.
-- **Owner footer.** The PaneFooter pairs an Owner button with a Notifications bell. The Owner button reads the authenticated `users.self` profile: a display name over a live connection-status caption, falling back honestly to Owner / Disconnected when no profile is available. It never encodes authorization state. The bell shows an `InfoBadge` count and opens the notifications flyout.
+- **Owner footer.** The PaneFooter pairs an Owner button with a Notifications bell. The Owner button is the `UserIdentityBadge`: it reads the authenticated `users.self` profile as a display name over a live connection-status caption, with a small connection status dot to the left of that caption (the same `positive` / `warning` / `critical` / `muted` states as the connection flyout, never color alone). It falls back honestly to Owner / Disconnected when no profile is available and never encodes authorization state. The bell shows an `InfoBadge` count and opens the notifications flyout.
 - **Connection status.** `Controls/GatewayStatusContent.xaml` is a 304px flyout of Gateway, Operator, and Node rows split by 1px `line` dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail, and reveals an `accent` action link (Reconnect, Approve) only when that layer needs one. The dot binds the Fluent system fill for its state: `positive` connected, `warning` attention, `critical` error, `muted` unknown, never color alone.
 - **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px flyout: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. Each card is a `surface` panel with a 1px `line` border, `md` (8px) corners, and 12px padding, laying out a leading severity glyph, a title/message/metadata stack, and a dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card.
 - **Sidebar glyphs.** Pane and toolbar glyphs are Segoe Fluent Icons or the SVGs under `Assets/SidebarIcons` (Chat, Sessions, Notifications, Connection, and the Settings destinations). Toolbar aliases include Back U+E76B, Forward U+E76C, add U+E710, toggle pane U+E90C, dismiss U+E711, and the Ringer notifications glyph U+EA8F.

From 890e7aa84e67ab41569ff574131df0dbd9afc648 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Sun, 4 Oct 2026 20:42:40 -0700
Subject: [PATCH 24/32] design(colophon): audit production controls into
 Basic/Setup/Chat/Settings

Expand the v3 Colophon catalog to mirror shipping WinUI 3 code with hover and pressed states on every interactive control. Adds Basic controls (SubtleButton, HyperlinkButton, ToggleSwitch, StatusDot, Avatar, InfoBar), Setup composites (SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, SetupWizardShell), ChatCopyButton, and Settings composites (SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, SettingsWindowShell). Reconciles ChatComposer footer to the production Voice + Send/Stop cluster. All 34 components validate; DESIGN.md Components catalog updated; no em dashes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 974 +++++++++++++++++++++++++++-----
 DESIGN.md                       |   7 +
 2 files changed, 838 insertions(+), 143 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index a6dfc1b337..1736acf2b9 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -7,7 +7,7 @@
   "components": [
     {
       "name": "Button",
-      "note": "Primary action. One per view — it's where the eye should land. Padding mirrors WinUI's default ButtonPadding (11,5,11,6), snapped to spacing tokens 3 (12≈11) and 1 (4≈5/6). In-app MinWidth 100px keeps short labels (OK / Connect) from cramping and gives side-by-side buttons a consistent footprint; that minimum has no spacing-token equivalent, so it stays a port note and the preview hugs its label.",
+      "note": "Basic control. Primary action — one per view, where the eye should land. Previewed as `variant:primary`, the WinUI AccentButtonStyle: `accent` fill (AccentFillColorDefaultBrush) with `accentInk` text (TextOnAccentFillColorPrimaryBrush), `sm` radius (ControlCornerRadius). Hover = AccentFillColorSecondary (token `accentSubtle`); pressed = AccentFillColorTertiary (no exact token, previewed with `accentSubtle`, documented here); disabled = AccentFillColorDisabled with TextOnAccentFillColorDisabled (previewed as `control`/`muted`). The `variant:standard` Button swaps to the default ButtonStyle: `control` fill (ControlFillColorDefault), `controlLine` border (ControlStrokeColorDefault), `ink` text; hover ControlFillColorSecondary, pressed ControlFillColorTertiary, disabled ControlFillColorDisabled. Subtle/icon buttons are the separate SubtleButton block. Padding mirrors WinUI ButtonPadding (11,5,11,6), snapped to spacing tokens 3 (12≈11) and 1 (4≈5/6). In-app MinWidth 100px keeps short labels (OK / Connect) from cramping and gives side-by-side buttons a consistent footprint; that minimum has no spacing-token equivalent, so it stays a port note and the preview hugs its label.",
       "props": {
         "children": "Save changes",
         "variant": "primary"
@@ -16,6 +16,9 @@
         "id": "button-root",
         "el": "button",
         "class": "ds-btn ds-btn-{variant}",
+        "attrs": {
+          "type": "button"
+        },
         "layout": {
           "mode": "horizontal",
           "padding": {
@@ -26,6 +29,22 @@
           "justify": "center",
           "width": "hug"
         },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "body",
+          "color": "accentInk",
+          "background": "accent",
+          "radius": "sm"
+        },
+        "control": {
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "accentSubtle" },
+          "pressed": { "background": "accentSubtle" },
+          "hoverPressed": { "background": "accentSubtle" },
+          "disabled": { "color": "muted", "background": "control" }
+        },
         "children": [
           "{children}"
         ]
@@ -33,7 +52,7 @@
     },
     {
       "name": "Field",
-      "note": "Text input with a quiet label above it — the field is the subject. Input padding mirrors WinUI TextControlThemePadding (10,5,6,6), snapped to tokens 2 (8≈10/6 horizontal) and 1 (4≈5/6 vertical). In-app MinHeight 32px lines a field up with a Button on the same row; that minimum stays a port note.",
+      "note": "Basic control. Text input with a quiet label above it — the field is the subject. The input ships as the default WinUI TextBox: `control` fill (ControlFillColorDefault), `controlLine` hairline border (ControlStrokeColorDefault), `ink` text, `sm` radius. Hover = ControlFillColorSecondary (no exact token; previewed with `control`, documented here). Focus draws the Fluent accent underline, previewed as a `accent` bottom border via `states.focus`. Disabled = ControlFillColorDisabled with `muted` text. Input padding mirrors WinUI TextControlThemePadding (10,5,6,6), snapped to tokens 2 (8≈10/6 horizontal) and 1 (4≈5/6 vertical). In-app MinHeight 32px lines a field up with a Button on the same row; that minimum stays a port note. Focus draws the Fluent accent underline, supplied here by `control.focus` (accent rectangle); the OFF-grid hover tint (ControlFillColorSecondary) has no exact token and previews with `control`.",
       "props": {
         "label": "Gateway address",
         "placeholder": "127.0.0.1:18789"
@@ -69,6 +88,21 @@
                 "y": "1"
               },
               "width": "fill"
+            },
+            "appearance": {
+              "fontFamily": "body",
+              "textStyle": "body",
+              "color": "ink",
+              "background": "control",
+              "borderColor": "controlLine",
+              "radius": "sm"
+            },
+            "control": {
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "control" },
+              "disabled": { "color": "muted", "background": "control" }
             }
           }
         ]
@@ -130,7 +164,7 @@
     },
     {
       "name": "Badge",
-      "note": "Status pill. Uses semantic color tokens, never a raw hex. Padding tokens 3/1 give the pill a compact footprint; the `pill` radius and tone color come from the ds-badge class.",
+      "note": "Basic control. Status pill — a read-only, non-interactive label, so it carries no hover/pressed states. Uses semantic color tokens, never a raw hex: `positive` (SystemFillColorSuccess), `warning` (SystemFillColorCaution), `critical` (SystemFillColorCritical), or `muted` for neutral. Padding tokens 3/1 give the pill a compact footprint; the `pill` radius and tone color come from the ds-badge class. Two production relatives: the WorkspaceShell count badge is a Fluent InfoBadge (default pill geometry, framework fill), and the notification recurrence badge is a 10px-radius `warning` subtle-background chip with 7,1 padding — both non-interactive, documented on their host components.",
       "props": {
         "children": "Connected",
         "tone": "positive"
@@ -153,6 +187,284 @@
         ]
       }
     },
+    {
+      "name": "SubtleButton",
+      "note": "Basic control. The quiet icon button used across the workspace chrome and flyouts (WinUI SubtleButtonStyle): Back/Forward, New session, pane toggle, notification bell, and the flyout dismiss button. Transparent rest (SubtleFillColorTransparent, `$none`) with a glyph in `ink`; hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`), disabled = ControlFillColorDisabled with `muted` glyph. `sm` radius (ControlCornerRadius). Previewed at the workspace command size 40x40 with a 16px glyph (WorkspaceWindow.xaml uses Width/Height 40, FontSize 16); the notification dismiss variant is 30x30 with an 11px glyph and 6px padding. `control.chrome:none` removes the web button border so the transparent Windows rest state shows, and `control.focus` draws the accent focus rectangle. Glyph shown is New session (Segoe Fluent Add, U+E710).",
+      "props": {
+        "label": "New session"
+      },
+      "root": {
+        "id": "subtle-button-root",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "aria-label": "{label}"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "justify": "center",
+          "width": 40,
+          "height": 40
+        },
+        "appearance": {
+          "color": "ink",
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" },
+          "disabled": { "color": "muted", "background": "$none" }
+        },
+        "children": [
+          {
+            "id": "subtle-button-glyph",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+            },
+            "children": [
+              "\uE710"
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "HyperlinkButton",
+      "note": "Basic control. WinUI HyperlinkButton used for inline navigation and quiet actions (Reconnect, Approve, Open Connection, Clear all, Open notifications). Accent link text (system accent hyperlink brush, token `accent`) with no border or fill at rest; hover shows the subtle wash (SubtleFillColorSecondary, `subtleHover`) and pressed deepens to SubtleFillColorTertiary (`subtlePressed`); disabled drops to `muted`. Horizontal padding mirrors the production `Padding=4,0` (token `1` left/right, no vertical pad); `sm` radius. Text uses the `body` scale. `control.chrome:none` strips the web button chrome; `control.focus` supplies the accent focus rectangle.",
+      "props": {
+        "children": "Open Connection"
+      },
+      "root": {
+        "id": "hyperlink-button-root",
+        "el": "button",
+        "attrs": {
+          "type": "button"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "padding": {
+            "left": "1",
+            "right": "1"
+          },
+          "width": "hug"
+        },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "body",
+          "color": "accent",
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" },
+          "disabled": { "color": "muted", "background": "$none" }
+        },
+        "children": [
+          "{children}"
+        ]
+      }
+    },
+    {
+      "name": "ToggleSwitch",
+      "note": "Basic control. The stock WinUI ToggleSwitch used on settings and permission rows. Previewed in the ON state: track fills `accent` (AccentFillColorDefault / ToggleSwitchFillOn) with an `accentInk` (TextOnAccentFillColorPrimary) thumb pushed right. OFF state (documented as a port note): track is `control` (ControlFillColorDefault) with a `controlLine` border and a `muted`/ControlStrongFill thumb at left. Hover = AccentFillColorSecondary on (ControlFillColorSecondary off); pressed = AccentFillColorTertiary on (ControlFillColorTertiary off); disabled uses the Fluent disabled track. Track previewed at 40x20 with a `pill` radius and a 14px circular thumb; the thumb/track visuals are WinUI template parts and are a port note. Toggle-state brushes are stock Fluent resources, not locally remapped.",
+      "props": {
+        "label": "Launch at startup"
+      },
+      "root": {
+        "id": "toggle-switch-root",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "role": "switch",
+          "aria-checked": "true",
+          "aria-label": "{label}"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "justify": "end",
+          "padding": { "x": "1" },
+          "width": 40,
+          "height": 20
+        },
+        "appearance": {
+          "background": "accent",
+          "radius": "pill"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "accentSubtle" },
+          "pressed": { "background": "accentSubtle" },
+          "hoverPressed": { "background": "accentSubtle" },
+          "disabled": { "background": "control" }
+        },
+        "children": [
+          {
+            "id": "toggle-switch-thumb",
+            "el": "span",
+            "attrs": { "aria-hidden": "true" },
+            "layout": { "width": 14, "height": 14 },
+            "appearance": { "background": "accentInk", "radius": "pill" }
+          }
+        ]
+      }
+    },
+    {
+      "name": "StatusDot",
+      "note": "Basic control. The 10x10 connection/status indicator reused in the gateway flyout (Ellipse), the workspace Owner footer (10px FontIcon), and the identity badges. Non-interactive, so no hover/pressed states. Fill is a semantic token; previewed `positive` (SystemFillColorSuccess) for connected, and the variants are `warning` (SystemFillColorCaution) attention, `critical` (SystemFillColorCritical) error, and `muted`/neutral unknown. 10px sits between spacing tokens (nearest `2`=8); previewed at a literal 10x10 with a `pill` radius.",
+      "props": {
+        "tone": "positive"
+      },
+      "root": {
+        "id": "status-dot-root",
+        "el": "span",
+        "attrs": {
+          "role": "img",
+          "aria-label": "Connected"
+        },
+        "layout": {
+          "width": 10,
+          "height": 10
+        },
+        "appearance": {
+          "background": "positive",
+          "radius": "pill"
+        }
+      }
+    },
+    {
+      "name": "Avatar",
+      "note": "Basic control. WinUI PersonPicture circular avatar. Non-interactive. The agent avatar is 32x32 (AgentIdentityBadge), the workspace Owner avatar is 24x24; both render a circular initials/photo tile. Previewed at 32x32 with a `pill` radius and a `muted` placeholder fill plus `ink`-on-muted initials; real photo/initials and the circular clip are WinUI template behavior and a port note.",
+      "props": {
+        "initials": "AU"
+      },
+      "root": {
+        "id": "avatar-root",
+        "el": "span",
+        "attrs": {
+          "role": "img"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "justify": "center",
+          "width": 32,
+          "height": 32
+        },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "small",
+          "color": "ink",
+          "background": "muted",
+          "radius": "pill"
+        },
+        "children": [
+          "{initials}"
+        ]
+      }
+    },
+    {
+      "name": "InfoBar",
+      "note": "Basic control. The Fluent InfoBar severity banner used for workspace operation errors and app notifications (WorkspaceWindow OperationInfo, HubWindow AppNotificationInfoBar, ChatPage). Previewed at Error severity: a `surface` sheet with a `line` hairline, `md` radius, and 16px padding, led by a `critical` status glyph (Segoe Fluent Error, U+EA39), a `ink` BodyStrong title, a `muted` caption message, and a trailing SubtleButton close (U+E711). Severity recolors the leading glyph only: `critical` Error, `warning` Warning, `positive` Success, `accent` Informational. The banner body is non-interactive; the close button carries the shared subtle hover/pressed states.",
+      "props": {
+        "title": "Couldn't reach the gateway",
+        "message": "Check that the gateway is running, then retry."
+      },
+      "root": {
+        "id": "info-bar-root",
+        "el": "div",
+        "attrs": { "role": "status" },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "3",
+          "padding": "4",
+          "align": "start",
+          "width": "fill"
+        },
+        "appearance": {
+          "background": "surface",
+          "borderColor": "line",
+          "radius": "md"
+        },
+        "children": [
+          {
+            "id": "info-bar-icon",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+            },
+            "appearance": { "color": "critical" },
+            "children": [ "\uEA39" ]
+          },
+          {
+            "id": "info-bar-text",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "children": [
+              {
+                "id": "info-bar-title",
+                "el": "span",
+                "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" },
+                "children": [ "{title}" ]
+              },
+              {
+                "id": "info-bar-message",
+                "el": "span",
+                "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                "children": [ "{message}" ]
+              }
+            ]
+          },
+          {
+            "id": "info-bar-close",
+            "el": "button",
+            "attrs": { "type": "button", "aria-label": "Close" },
+            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 30, "height": 30 },
+            "appearance": { "color": "muted", "background": "$none", "radius": "sm" },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
+            "children": [
+              {
+                "id": "info-bar-close-glyph",
+                "el": "span",
+                "attrs": {
+                  "aria-hidden": "true",
+                  "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:11px"
+                },
+                "children": [ "\uE711" ]
+              }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "ComposerPicker",
       "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens the picker flyout. Since #1459 the model picker is a native flyout with an AutoSuggestBox over a grouped, single-selection ListView, and the reasoning-effort picker is a native discrete slider with a compact gauge trigger (`ChatEffortGauge`, rendered with WinUI paths, not a font glyph) at narrow widths; a picker trigger value can tint with `ChatPickerAccentBrush`. The session selector stays a single-select flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
@@ -521,7 +833,7 @@
     },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`composer` radius, 20px) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. In-app it binds `ChatComposerBrush` (card fill) over the transparent chat canvas and `ChatStrokeBrush` for the hairline; Send is the Fluent ChatSubmit up glyph (U+E74A) that swaps to Stop (U+E71A) during an active turn, and Add uses ChatAttach (U+E710) (#1459). Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Dictate (mic), Speaker, Settings, and the primary Send. Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
+      "note": "Chat input. A rounded `control` panel (`composer` radius, 20px) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. In-app it binds `ChatComposerBrush` (card fill) over the transparent chat canvas and `ChatStrokeBrush` for the hairline; Send is the Fluent ChatSubmit up glyph (U+E74A) that swaps to Stop (U+E71A) during an active turn, and Add uses ChatAttach (U+E710) (#1459). Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Voice (mic) and the primary Send/Stop. Production exposes only Voice and Send/Stop on the right (no separate Speaker or Settings composer buttons; read-aloud and chat preferences live in Settings, per docs/CHAT_VISUAL_DESIGN.md). Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
         "session": "Main session",
@@ -684,8 +996,8 @@
                     "el": "button",
                     "attrs": {
                       "type": "button",
-                      "title": "Dictate",
-                      "aria-label": "Dictate"
+                      "title": "Voice",
+                      "aria-label": "Voice"
                     },
                     "layout": {
                       "mode": "horizontal",
@@ -747,12 +1059,13 @@
                     ]
                   },
                   {
-                    "id": "chat-composer-speaker",
+                    "id": "chat-composer-send",
                     "el": "button",
+                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
-                      "title": "Read responses aloud",
-                      "aria-label": "Read responses aloud"
+                      "title": "Send",
+                      "aria-label": "Send"
                     },
                     "layout": {
                       "mode": "horizontal",
@@ -762,22 +1075,13 @@
                       "height": 32
                     },
                     "appearance": {
-                      "color": "muted",
-                      "background": "$none",
+                      "background": "accent",
+                      "color": "accentInk",
                       "radius": "sm"
                     },
-                    "control": {
-                      "chrome": "none",
-                      "focus": { "kind": "outline", "color": "accent" }
-                    },
-                    "states": {
-                      "hover": { "background": "subtleHover" },
-                      "pressed": { "background": "subtlePressed" },
-                      "hoverPressed": { "background": "subtlePressed" }
-                    },
                     "children": [
                       {
-                        "id": "chat-composer-speaker-glyph",
+                        "id": "chat-composer-send-glyph",
                         "el": "svg",
                         "attrs": {
                           "width": "18",
@@ -792,130 +1096,10 @@
                         },
                         "children": [
                           {
-                            "id": "chat-composer-speaker-poly",
-                            "el": "polygon",
-                            "attrs": {
-                              "points": "11 5 6 9 2 9 2 15 6 15 11 19 11 5"
-                            }
-                          },
-                          {
-                            "id": "chat-composer-speaker-path",
+                            "id": "chat-composer-send-path",
                             "el": "path",
                             "attrs": {
-                              "d": "M15.5 8.5a5 5 0 0 1 0 7M19 5a9 9 0 0 1 0 14"
-                            }
-                          }
-                        ]
-                      }
-                    ]
-                  },
-                  {
-                    "id": "chat-composer-settings",
-                    "el": "button",
-                    "attrs": {
-                      "type": "button",
-                      "title": "Chat settings",
-                      "aria-label": "Chat settings"
-                    },
-                    "layout": {
-                      "mode": "horizontal",
-                      "align": "center",
-                      "justify": "center",
-                      "width": 32,
-                      "height": 32
-                    },
-                    "appearance": {
-                      "color": "muted",
-                      "background": "$none",
-                      "radius": "sm"
-                    },
-                    "control": {
-                      "chrome": "none",
-                      "focus": { "kind": "outline", "color": "accent" }
-                    },
-                    "states": {
-                      "hover": { "background": "subtleHover" },
-                      "pressed": { "background": "subtlePressed" },
-                      "hoverPressed": { "background": "subtlePressed" }
-                    },
-                    "children": [
-                      {
-                        "id": "chat-composer-settings-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "18",
-                          "height": "18",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-composer-settings-circle",
-                            "el": "circle",
-                            "attrs": {
-                              "cx": "12",
-                              "cy": "12",
-                              "r": "3"
-                            }
-                          },
-                          {
-                            "id": "chat-composer-settings-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"
-                            }
-                          }
-                        ]
-                      }
-                    ]
-                  },
-                  {
-                    "id": "chat-composer-send",
-                    "el": "button",
-                    "class": "ds-btn",
-                    "attrs": {
-                      "type": "button",
-                      "title": "Send",
-                      "aria-label": "Send"
-                    },
-                    "layout": {
-                      "mode": "horizontal",
-                      "align": "center",
-                      "justify": "center",
-                      "width": 32,
-                      "height": 32
-                    },
-                    "appearance": {
-                      "background": "accent",
-                      "color": "accentInk",
-                      "radius": "sm"
-                    },
-                    "children": [
-                      {
-                        "id": "chat-composer-send-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "18",
-                          "height": "18",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-composer-send-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M12 19V5M5 12l7-7 7 7"
+                              "d": "M12 19V5M5 12l7-7 7 7"
                             }
                           }
                         ]
@@ -1083,6 +1267,52 @@
         ]
       }
     },
+    {
+      "name": "ChatCopyButton",
+      "note": "Chat control. The quiet copy affordance on assistant messages and code blocks (ChatCopyButton). A 32x32 subtle button (token `8` square target) with 4px (`1`) padding and `sm` radius, sharing the composer toolbar's subtle state set: transparent rest (SubtleFillColorTransparent), hover SubtleFillColorSecondary (`subtleHover`), pressed SubtleFillColorTertiary (`subtlePressed`). Idle glyph is Segoe Fluent Copy (U+E8C8) in `ChatSecondaryTextBrush` (`muted`). On copy it flips to the CheckMark (U+E73E) in `ChatCopySuccessBrush` (`positive`), announces \"Copied\" through a polite live region, and resets after 2 seconds; a failure shows SystemFillColorCritical (`critical`). Previewed in the idle state.",
+      "root": {
+        "id": "chat-copy-root",
+        "el": "button",
+        "attrs": {
+          "type": "button",
+          "title": "Copy",
+          "aria-label": "Copy"
+        },
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "justify": "center",
+          "padding": "1",
+          "width": 32,
+          "height": 32
+        },
+        "appearance": {
+          "color": "muted",
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" }
+        },
+        "children": [
+          {
+            "id": "chat-copy-glyph",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+            },
+            "children": [ "\uE8C8" ]
+          }
+        ]
+      }
+    },
     {
       "name": "AgentIdentityBadge",
       "note": "Agent identity row from Controls/AgentIdentityBadge.xaml (#1541): a 32x32 PersonPicture avatar (circular, so `pill` radius) to the LEFT of a two-line stack — agent display name in body type over the agent id in caption `muted` (TextFillColorSecondary) — with a trailing `muted` ChevronDown (Segoe Fluent U+E70D, previewed ~12px) marking it as the assistant selector's dropdown trigger. It ships as a subtle transparent WinUI DropDownButton (SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle), so it stays quiet chrome and spends no accent at rest. Column spacing 12px maps to token 3; MinHeight 40 and the PersonPicture initials/photo fallback are port notes. Used as the assistant selector trigger and anywhere an agent is named. In-app the avatar is a real PersonPicture (initials or gateway avatar), previewed here with a person glyph.",
@@ -2550,6 +2780,464 @@
         ]
       }
     },
+    {
+      "name": "SetupProgressIndicator",
+      "note": "Setup control. The wizard step dots (SetupProgressIndicator.cs). Non-interactive, non-focusable, accessibility-hidden, so no hover/pressed states. The active step is a 20x8 pill in `accent` (SetupIndicatorAccentBrush = SystemAccentColorLight2 dark / Dark1 light); inactive steps are 8x8 dots in `muted` (SetupInactiveDotBrush = ControlStrongFill). Dot spacing is token `2` (8px); every dot uses the `sm` radius (4px).",
+      "root": {
+        "id": "setup-progress-root",
+        "el": "div",
+        "attrs": { "role": "img", "aria-label": "Step 2 of 4" },
+        "layout": { "mode": "horizontal", "gap": "2", "align": "center" },
+        "children": [
+          { "id": "setup-progress-d1", "el": "span", "layout": { "width": 8, "height": 8 }, "appearance": { "background": "muted", "radius": "sm" } },
+          { "id": "setup-progress-d2", "el": "span", "layout": { "width": 20, "height": 8 }, "appearance": { "background": "accent", "radius": "sm" } },
+          { "id": "setup-progress-d3", "el": "span", "layout": { "width": 8, "height": 8 }, "appearance": { "background": "muted", "radius": "sm" } },
+          { "id": "setup-progress-d4", "el": "span", "layout": { "width": 8, "height": 8 }, "appearance": { "background": "muted", "radius": "sm" } }
+        ]
+      }
+    },
+    {
+      "name": "RecommendedBadge",
+      "note": "Setup control. The small outlined \"Recommended\" tag beside a capability profile (Controls/RecommendedBadge.xaml). Non-interactive. An outline-only badge: 1px `accent` border (AccentTextFillColorPrimaryBrush), `accent` caption text, no fill, `sm` radius (4px), padding token `2` horizontal and `1` vertical (8,4). Disabled recolors border and text to `muted` (TextFillColorDisabled). This is a small `sm` badge, not the 999px `pill` Badge.",
+      "props": {
+        "children": "Recommended"
+      },
+      "root": {
+        "id": "recommended-badge-root",
+        "el": "span",
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "padding": { "x": "2", "y": "1" },
+          "width": "hug"
+        },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "caption",
+          "color": "accent",
+          "background": "$none",
+          "borderColor": "accent",
+          "radius": "sm"
+        },
+        "children": [ "{children}" ]
+      }
+    },
+    {
+      "name": "ProviderArtwork",
+      "note": "Setup control. The square icon tile for an AI provider (Controls/ProviderArtwork.xaml). Non-interactive. A 40x40 tile: `surface` (SolidBackgroundFillColorBase) fill, 1px `line` (CardStrokeColorDefault) border, `sm` radius (ControlCornerRadius), token `2` (8px) padding around a 24x24 glyph or image. Previewed with a representative Segoe Fluent glyph.",
+      "root": {
+        "id": "provider-artwork-root",
+        "el": "span",
+        "layout": {
+          "mode": "horizontal",
+          "align": "center",
+          "justify": "center",
+          "padding": "2",
+          "width": 40,
+          "height": 40
+        },
+        "appearance": {
+          "background": "surface",
+          "borderColor": "line",
+          "radius": "sm"
+        },
+        "children": [
+          {
+            "id": "provider-artwork-glyph",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:24px"
+            },
+            "appearance": { "color": "ink" },
+            "children": [ "\uE99A" ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "SetupOptionCard",
+      "note": "Setup composite. A clickable provider/mode choice row (AiSetupPage.xaml compact SettingsCard, IsClickEnabled). Built from the ProviderArtwork tile, a title + detail stack, and a trailing action/chevron. The row itself is transparent with a 1px `line` bottom divider (previewed here via a bottom-biased `line` border; the real card draws only the bottom edge), MinHeight 64px, and `md` radius on the enclosing group. Because it is clickable it carries the SettingsCard subtle states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`); disabled drops text to `muted`. Title is `body` BodyStrong, detail is `caption` in `muted`; the 32px artwork column and 12px gap map to tokens `6`/`3`. There is no XAML-defined selected indicator; selection is tracked by the parent ListView and is a port note.",
+      "props": {
+        "title": "Sign in with GitHub",
+        "detail": "Use your Copilot subscription. No API key needed."
+      },
+      "root": {
+        "id": "setup-option-root",
+        "el": "button",
+        "attrs": { "type": "button" },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "3",
+          "padding": { "x": "4", "y": "3" },
+          "align": "center",
+          "width": "fill"
+        },
+        "appearance": {
+          "background": "$none",
+          "borderColor": "line"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" },
+          "disabled": { "color": "muted", "background": "$none" }
+        },
+        "children": [
+          { "id": "setup-option-art", "component": "ProviderArtwork" },
+          {
+            "id": "setup-option-text",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "children": [
+              { "id": "setup-option-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+              { "id": "setup-option-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+            ]
+          },
+          {
+            "id": "setup-option-chevron",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:12px"
+            },
+            "appearance": { "color": "muted" },
+            "children": [ "\uE76C" ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "CapabilityOptionRow",
+      "note": "Setup composite. A single capability-profile choice (CapabilitiesPage.xaml ListViewItem). Rows live inside a `surface` group with a 1px `line` border and `md` radius; each row is padded token `4` horizontal and `3` vertical (16,12) with a title (`body` BodyStrong) over a wrapping `caption` description in `muted`, and the recommended profile carries the RecommendedBadge. Single-selection follows focus; because it is selectable it shows the Fluent ListViewItem states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`); the selected row's accent pill/left bar is a WinUI ListViewItem template part and is a port note (no custom setter in setup XAML).",
+      "props": {
+        "title": "Balanced",
+        "detail": "Recommended defaults for most Windows nodes."
+      },
+      "root": {
+        "id": "capability-row-root",
+        "el": "button",
+        "attrs": { "type": "button", "role": "option" },
+        "layout": {
+          "mode": "horizontal",
+          "gap": "2",
+          "padding": { "x": "4", "y": "3" },
+          "align": "center",
+          "width": "fill"
+        },
+        "appearance": {
+          "background": "$none",
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "outline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "subtleHover" },
+          "pressed": { "background": "subtlePressed" },
+          "hoverPressed": { "background": "subtlePressed" }
+        },
+        "children": [
+          {
+            "id": "capability-row-text",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "children": [
+              { "id": "capability-row-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+              { "id": "capability-row-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+            ]
+          },
+          { "id": "capability-row-badge", "component": "RecommendedBadge" }
+        ]
+      }
+    },
+    {
+      "name": "SetupPhaseStatus",
+      "note": "Setup control. The inline phase result row (Controls/SetupPhaseStatus.xaml). Non-interactive. A horizontal row, token `2` (8px) gap, pairing a status indicator with `caption` text (max width 160px) in `muted`. Running shows a 20x20 ProgressRing; Complete shows the Segoe Fluent StatusOk check (U+E73E) in `positive` (SystemFillColorSuccess); Failed shows StatusErr (U+EA39) in `critical` (SystemFillColorCritical); Cancelled shows Exit (U+E711) in `muted`. Previewed in the Complete state.",
+      "props": {
+        "children": "Gateway connected"
+      },
+      "root": {
+        "id": "setup-phase-root",
+        "el": "div",
+        "attrs": { "role": "status" },
+        "layout": { "mode": "horizontal", "gap": "2", "align": "center" },
+        "children": [
+          {
+            "id": "setup-phase-glyph",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+            },
+            "appearance": { "color": "positive" },
+            "children": [ "\uE73E" ]
+          },
+          {
+            "id": "setup-phase-text",
+            "el": "span",
+            "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+            "children": [ "{children}" ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "SetupWizardShell",
+      "note": "Setup composite. The onboarding wizard frame (Pages/WizardPage.xaml). A vertical page: a header (mascot + `title` TitleTextBlockStyle headline + `caption` status in `muted`), the active step surface, and a footer. Page padding is 40,4,40,24 (previewed with token `6` horizontal and `1`/`5` vertical; the 40px horizontals are off-grid port notes). The step card is a `surface` sheet with a 1px `line` border, `md` radius, and token `5` (24px) padding; its MinHeight (180/140/200/260) is a runtime port note. The footer places a standard (secondary) Button and the accent (primary) Button on the ends with the SetupProgressIndicator centered; footer column gap is token `2`. Composes Button and SetupProgressIndicator.",
+      "root": {
+        "id": "setup-wizard-root",
+        "el": "section",
+        "layout": {
+          "mode": "vertical",
+          "gap": "5",
+          "padding": { "left": "6", "right": "6", "top": "1", "bottom": "5" },
+          "width": "fill"
+        },
+        "appearance": { "background": "paper" },
+        "children": [
+          {
+            "id": "setup-wizard-header",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "align": "center" },
+            "children": [
+              { "id": "setup-wizard-title", "el": "h1", "appearance": { "fontFamily": "display", "textStyle": "title", "color": "ink", "textAlign": "center" }, "children": [ "Set up your Windows node" ] },
+              { "id": "setup-wizard-status", "el": "p", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted", "textAlign": "center" }, "children": [ "Step 2 of 4 · Choose capabilities" ] }
+            ]
+          },
+          {
+            "id": "setup-wizard-card",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "4", "padding": "5", "width": "fill" },
+            "appearance": { "background": "surface", "borderColor": "line", "radius": "md" },
+            "children": [
+              { "id": "setup-wizard-card-title", "el": "h2", "appearance": { "fontFamily": "display", "textStyle": "heading", "color": "ink" }, "children": [ "Choose what this node can do" ] },
+              { "id": "setup-wizard-opt-1", "component": "CapabilityOptionRow" },
+              {
+                "id": "setup-wizard-opt-2",
+                "component": "CapabilityOptionRow",
+                "props": { "title": "Full access", "detail": "Expose every capability over MCP." }
+              }
+            ]
+          },
+          {
+            "id": "setup-wizard-footer",
+            "el": "div",
+            "layout": { "mode": "horizontal", "gap": "2", "align": "center", "justify": "space-between", "width": "fill" },
+            "children": [
+              { "id": "setup-wizard-back", "component": "Button", "props": { "children": "Back", "variant": "standard" } },
+              { "id": "setup-wizard-progress", "component": "SetupProgressIndicator" },
+              { "id": "setup-wizard-next", "component": "Button", "props": { "children": "Continue", "variant": "primary" } }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "SettingsSectionHeader",
+      "note": "Settings control. The group label above a stack of settings cards (used across SettingsPage / PermissionsPage / SandboxPage). Non-interactive. `body` BodyStrongTextBlockStyle in `ink`, with margin 4,18,4,4 (previewed as token `1` sides, `4` top, `1` bottom; the 18px top is off-grid and a port note).",
+      "props": { "children": "Permissions" },
+      "root": {
+        "id": "settings-section-header-root",
+        "el": "h2",
+        "margin": { "top": "4", "right": "1", "bottom": "1", "left": "1" },
+        "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" },
+        "children": [ "{children}" ]
+      }
+    },
+    {
+      "name": "SettingsCard",
+      "note": "Settings composite. The canonical settings row (hand-rolled Border, not the toolkit SettingsCard). STATIC: the card itself has no hover/pressed; the trailing control owns interaction. A `surface`-less `paper` Border with a 1px `line` (CardStrokeColorDefault) stroke, `md` radius (8px), and token `4` (16px) padding (some cards use 16,14; the 14 is off-grid). Layout is an optional 36px leading icon column, a growing content column (title `body` BodyStrong in `ink` over a wrapping `caption` description in `muted`), and a trailing Auto control column. Cards stack with token `2` (8px) spacing.",
+      "props": {
+        "title": "Startup",
+        "detail": "Launch OpenClaw when you sign in to Windows."
+      },
+      "root": {
+        "id": "settings-card-root",
+        "el": "div",
+        "layout": { "mode": "horizontal", "gap": "3", "padding": "4", "align": "center", "width": "fill" },
+        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "children": [
+          {
+            "id": "settings-card-icon",
+            "el": "span",
+            "attrs": {
+              "aria-hidden": "true",
+              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+            },
+            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 36 },
+            "appearance": { "color": "ink" },
+            "children": [ "\uE7E8" ]
+          },
+          {
+            "id": "settings-card-text",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "children": [
+              { "id": "settings-card-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+              { "id": "settings-card-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+            ]
+          },
+          { "id": "settings-card-action", "component": "Button", "props": { "children": "Change", "variant": "standard" } }
+        ]
+      }
+    },
+    {
+      "name": "SettingsToggleRow",
+      "note": "Settings composite. A SettingsCard whose trailing control is the Fluent ToggleSwitch (the most common settings row). Same static `paper` card: 1px `line` stroke, `md` radius, token `4` padding, token `1` title/detail stack. The ToggleSwitch owns the hover/pressed states (see ToggleSwitch); the card is static. Composes ToggleSwitch.",
+      "props": {
+        "title": "Run at startup",
+        "detail": "Start the OpenClaw tray automatically."
+      },
+      "root": {
+        "id": "settings-toggle-root",
+        "el": "div",
+        "layout": { "mode": "horizontal", "gap": "3", "padding": "4", "align": "center", "width": "fill" },
+        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "children": [
+          {
+            "id": "settings-toggle-text",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "children": [
+              { "id": "settings-toggle-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+              { "id": "settings-toggle-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+            ]
+          },
+          { "id": "settings-toggle-switch", "component": "ToggleSwitch" }
+        ]
+      }
+    },
+    {
+      "name": "SettingsExpanderRow",
+      "note": "Settings composite. An expandable settings group built on the stock WinUI Expander (SandboxPage.xaml), not the toolkit SettingsExpander. The header is an interactive row (ColumnSpacing 14, previewed token `3`; header padding 0,4) with an optional leading icon, a growing title (`body` BodyStrong) over `caption` description, and a trailing chevron (U+E70D) that rotates when open. The header carries stock Expander subtle states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`). The expanded content is a StackPanel, token `3` (12px) spacing, padding 0,4. Previewed expanded.",
+      "props": {
+        "title": "Advanced sandbox",
+        "detail": "Fine-tune the command execution sandbox."
+      },
+      "root": {
+        "id": "settings-expander-root",
+        "el": "div",
+        "layout": { "mode": "vertical", "width": "fill" },
+        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "children": [
+          {
+            "id": "settings-expander-header",
+            "el": "button",
+            "attrs": { "type": "button", "aria-expanded": "true" },
+            "layout": { "mode": "horizontal", "gap": "3", "padding": { "x": "4", "y": "3" }, "align": "center", "width": "fill" },
+            "appearance": { "background": "$none", "radius": "md" },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
+            "children": [
+              {
+                "id": "settings-expander-text",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+                "children": [
+                  { "id": "settings-expander-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+                  { "id": "settings-expander-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                ]
+              },
+              {
+                "id": "settings-expander-chevron",
+                "el": "span",
+                "attrs": {
+                  "aria-hidden": "true",
+                  "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:12px"
+                },
+                "appearance": { "color": "muted" },
+                "children": [ "\uE70D" ]
+              }
+            ]
+          },
+          {
+            "id": "settings-expander-content",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "3", "padding": { "x": "4", "y": "3" }, "width": "fill" },
+            "children": [
+              { "id": "settings-expander-child", "component": "SettingsToggleRow", "props": { "title": "Allow network access", "detail": "Let sandboxed commands reach the network." } }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "name": "SettingsWindowShell",
+      "note": "Settings composite. The Settings host window frame (Windows/HubWindow.xaml). MinWidth 1000, Mica backdrop, title bar captioned \"OpenClaw Settings\". A left NavigationView rail (pane toggle and the stock settings item hidden) sits beside a scrolling content column padded token `5` (24px) with a MaxWidth of 900px (port note). The bottom of the window hosts a 40px status pill and a 40x40 toolbar button cluster. Composes SettingsSectionHeader and SettingsToggleRow; the nav items reuse the subtle-button interaction model.",
+      "root": {
+        "id": "settings-window-root",
+        "el": "section",
+        "layout": { "mode": "horizontal", "width": "fill" },
+        "appearance": { "background": "paper" },
+        "children": [
+          {
+            "id": "settings-window-nav",
+            "el": "nav",
+            "layout": { "mode": "vertical", "gap": "1", "padding": "2", "width": 240 },
+            "appearance": { "background": "surface", "borderColor": "line" },
+            "children": [
+              {
+                "id": "settings-window-nav-general",
+                "el": "button",
+                "attrs": { "type": "button", "aria-current": "page" },
+                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2", "y": "2" }, "align": "center", "width": "fill" },
+                "appearance": { "background": "subtleHover", "radius": "sm", "color": "ink" },
+                "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                "states": {
+                  "hover": { "background": "subtleHover" },
+                  "pressed": { "background": "subtlePressed" },
+                  "hoverPressed": { "background": "subtlePressed" }
+                },
+                "children": [
+                  { "id": "settings-window-nav-general-glyph", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px" }, "appearance": { "color": "ink" }, "children": [ "\uE713" ] },
+                  { "id": "settings-window-nav-general-label", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "General" ] }
+                ]
+              },
+              {
+                "id": "settings-window-nav-perms",
+                "el": "button",
+                "attrs": { "type": "button" },
+                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2", "y": "2" }, "align": "center", "width": "fill" },
+                "appearance": { "background": "$none", "radius": "sm", "color": "ink" },
+                "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                "states": {
+                  "hover": { "background": "subtleHover" },
+                  "pressed": { "background": "subtlePressed" },
+                  "hoverPressed": { "background": "subtlePressed" }
+                },
+                "children": [
+                  { "id": "settings-window-nav-perms-glyph", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px" }, "appearance": { "color": "ink" }, "children": [ "\uE72E" ] },
+                  { "id": "settings-window-nav-perms-label", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "Permissions" ] }
+                ]
+              }
+            ]
+          },
+          {
+            "id": "settings-window-content",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "2", "padding": "5", "grow": true, "width": "fill" },
+            "children": [
+              { "id": "settings-window-section", "component": "SettingsSectionHeader", "props": { "children": "General" } },
+              { "id": "settings-window-row-1", "component": "SettingsToggleRow" },
+              { "id": "settings-window-row-2", "component": "SettingsExpanderRow" }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "ExampleScreen",
       "note": "A representative Connection screen composed from the pieces above — the \"does it hang together\" check for the whole system. The status board is a freeform layer so the two cards can overlap into a Fluent-style dashboard, exercising v3 absolute positioning alongside Auto Layout.",
diff --git a/DESIGN.md b/DESIGN.md
index 4045bacc13..d870004ab1 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -349,6 +349,13 @@ The landing window is the native Home and Sessions workspace (`Windows/Workspace
 Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.
 Optional click-through flows live in `.agents/design/prototypes.jsonc`.
 
+The catalog is organized into four families. Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
+
+- **Basic controls.** Button (primary/standard/subtle), SubtleButton (square icon), HyperlinkButton, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. The building blocks every other family composes.
+- **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
+- **Chat.** ChatBubble, ChatComposer, ChatThread, ComposerPicker, and ChatCopyButton, plus the Reactor chat identity surfaces (AgentIdentityBadge, UserIdentityBadge). See the Chat surface section.
+- **Settings.** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and the SettingsWindowShell host frame, ported from `OpenClaw.Tray.WinUI` pages and `HubWindow`.
+
 ## Do's and Don'ts
 
 Do:

From ad7aaaca86951dce8ed8e445a004cd588609c034 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Sun, 4 Oct 2026 23:01:16 -0700
Subject: [PATCH 25/32] design(colophon): add setup chat and settings sidebar
 pages

Persist filtered component selections in DESIGN.md, document the built-in catalog limitation, and correct the chat design link.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 DESIGN.md | 48 +++++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 45 insertions(+), 3 deletions(-)

diff --git a/DESIGN.md b/DESIGN.md
index d870004ab1..3b7849aaed 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -70,6 +70,46 @@ x-colophon:
   version: 1
   tokens:
     $schema: https://agents.design/schema/v1
+    pages:
+      - id: setup
+        name: Setup
+        description: Onboarding controls and wizard compositions.
+        content: Production reference from OpenClaw.SetupEngine.UI. Basic controls remain in Components; these previews compose those shared definitions.
+        components:
+          - SetupProgressIndicator
+          - RecommendedBadge
+          - ProviderArtwork
+          - SetupOptionCard
+          - CapabilityOptionRow
+          - SetupPhaseStatus
+          - SetupWizardShell
+      - id: chat
+        name: Chat
+        description: Chat controls, identity badges, and the main workspace.
+        content: Production reference for Reactor chat and the native Home and Sessions workspace. Includes the workspace connection and notification flyouts. Shared building blocks remain in Components.
+        components:
+          - ComposerPicker
+          - ComposerPickerOptions
+          - ChatBubble
+          - ChatComposer
+          - ChatThread
+          - ChatCopyButton
+          - AgentIdentityBadge
+          - UserIdentityBadge
+          - ConnectionStatusFlyout
+          - NotificationFlyout
+          - WorkspaceShell
+          - ExampleScreen
+      - id: settings
+        name: Settings
+        description: Settings controls, rows, expanders, and window composition.
+        content: Production reference from OpenClaw.Tray.WinUI settings pages and HubWindow. The trailing control owns interaction on static settings cards. Shared building blocks remain in Components.
+        components:
+          - SettingsSectionHeader
+          - SettingsCard
+          - SettingsToggleRow
+          - SettingsExpanderRow
+          - SettingsWindowShell
     meta:
       version: 1
       updatedBy: xaml+manual
@@ -327,7 +367,7 @@ Use the `rounded` tokens for corner radii: `sm` for buttons and inputs, `md` for
 
 ## Chat surface
 
-The chat transcript and composer ship via Reactor and follow the native chat visual system in [`docs/CHAT_VISUAL_DESIGN.md`](../../docs/CHAT_VISUAL_DESIGN.md). They align to the reading rhythm of the released web chat without replacing Windows chrome, native input, or gateway contracts.
+The chat transcript and composer ship via Reactor and follow the native chat visual system in [`docs/CHAT_VISUAL_DESIGN.md`](docs/CHAT_VISUAL_DESIGN.md). They align to the reading rhythm of the released web chat without replacing Windows chrome, native input, or gateway contracts.
 
 - **Semantic brushes.** Chat binds the chat-local resources in `Themes/ChatResources.xaml` (Default/Light/HighContrast), not raw palette hex: `ChatCanvasBrush` (transparent; system window in HC), `ChatComposerBrush` and `ChatCardBrush` (`CardBackgroundFillColorDefault`), `ChatStrokeBrush` (`ControlStrokeColorDefault`), `ChatTextBrush` (`TextFillColorPrimary`), `ChatSecondaryTextBrush` (`TextFillColorSecondary`, used for code text), `ChatUserBrush` (accent at low opacity for the user bubble), `ChatUserTextBrush` (`TextFillColorPrimary`), `ChatPickerAccentBrush` (accent variants for picker triggers), and `ChatCopySuccessBrush` (`SystemFillColorSuccess`).
 - **Surface layering.** The Hub title bar and expanded navigation pane reveal Mica; `NavigationViewContentBackground` supplies one content layer (`LayerFillColorDefaultBrush`; system window in HC). The chat canvas is transparent so it neither hides nor doubles that layer, and the composer and code cards use the card fill above it. The standalone chat window uses the same Mica plus one content layer.
@@ -349,11 +389,13 @@ The landing window is the native Home and Sessions workspace (`Windows/Workspace
 Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.
 Optional click-through flows live in `.agents/design/prototypes.jsonc`.
 
-The catalog is organized into four families. Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
+The catalog is organized into four families. Colophon's left navigation includes dedicated Setup, Chat, and Settings pages, defined by `x-colophon.tokens.pages` above. Each page selects existing component definitions without copying them, so shared component references continue to resolve. Basic controls live under Components. The installed Colophon version also shows the full catalog on that built-in page; it does not support filtering Components down to basic controls.
+
+Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
 
 - **Basic controls.** Button (primary/standard/subtle), SubtleButton (square icon), HyperlinkButton, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. The building blocks every other family composes.
 - **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
-- **Chat.** ChatBubble, ChatComposer, ChatThread, ComposerPicker, and ChatCopyButton, plus the Reactor chat identity surfaces (AgentIdentityBadge, UserIdentityBadge). See the Chat surface section.
+- **Chat.** ChatBubble, ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.
 - **Settings.** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and the SettingsWindowShell host frame, ported from `OpenClaw.Tray.WinUI` pages and `HubWindow`.
 
 ## Do's and Don'ts

From 9a241968ecbff970f0855f7e75e767a9fbefd5a5 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 14 Oct 2026 22:12:41 -0700
Subject: [PATCH 26/32] design(colophon): refine native controls and preview
 states

Align typography, TextBox, Card, SubtleButton, PersonPicture and InfoBar references with WinUI. Remove the static toggle state gallery and preserve StatusDot dimensions.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 320 ++++++++++++++++-----------
 DESIGN.md                       | 379 ++++++++++++++++++++++++++++++--
 2 files changed, 559 insertions(+), 140 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 1736acf2b9..21293c095d 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -50,9 +50,55 @@
         ]
       }
     },
+    {
+      "name": "TextBox",
+      "note": "Basic control. Reusable default WinUI single-line TextBox, matching the stock control used by DirectUrlBox in Pages/ConnectionPage.xaml. Body text is 14px, the preview is 32px high with sm (4px) corners, and TextControlThemePadding is preserved exactly as 10,5,6,6 through named spacing tokens. Normal uses control/ink, pointer-over uses controlHover, and disabled uses controlDisabled/disabledText. The input has no separate native Pressed visual state: pressed previews retain pointer-over fill, while actual focus draws the 2px accent underline through control.focus. The browser uses controlLine as a flat approximation of TextControlElevationBorderBrush; native focused fill and the clear-button template remain owned by WinUI. Port as Microsoft.UI.Xaml.Controls.TextBox without replacing its template.",
+      "props": {
+        "accessibleName": "Text",
+        "placeholder": "Enter text"
+      },
+      "root": {
+        "id": "textbox-input",
+        "el": "input",
+        "attrs": {
+          "type": "text",
+          "aria-label": "{accessibleName}",
+          "placeholder": "{placeholder}"
+        },
+        "layout": {
+          "padding": {
+            "left": "textControlLeft",
+            "top": "textControlTop",
+            "right": "textControlEnd",
+            "bottom": "textControlEnd"
+          },
+          "width": "fill",
+          "height": 32
+        },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "body",
+          "color": "ink",
+          "background": "control",
+          "borderColor": "controlLine",
+          "borderWidth": 1,
+          "radius": "sm"
+        },
+        "control": {
+          "chrome": "none",
+          "focus": { "kind": "underline", "color": "accent" }
+        },
+        "states": {
+          "hover": { "background": "controlHover" },
+          "pressed": { "background": "controlHover" },
+          "hoverPressed": { "background": "controlHover" },
+          "disabled": { "color": "disabledText", "background": "controlDisabled" }
+        }
+      }
+    },
     {
       "name": "Field",
-      "note": "Basic control. Text input with a quiet label above it — the field is the subject. The input ships as the default WinUI TextBox: `control` fill (ControlFillColorDefault), `controlLine` hairline border (ControlStrokeColorDefault), `ink` text, `sm` radius. Hover = ControlFillColorSecondary (no exact token; previewed with `control`, documented here). Focus draws the Fluent accent underline, previewed as a `accent` bottom border via `states.focus`. Disabled = ControlFillColorDisabled with `muted` text. Input padding mirrors WinUI TextControlThemePadding (10,5,6,6), snapped to tokens 2 (8≈10/6 horizontal) and 1 (4≈5/6 vertical). In-app MinHeight 32px lines a field up with a Button on the same row; that minimum stays a port note. Focus draws the Fluent accent underline, supplied here by `control.focus` (accent rectangle); the OFF-grid hover tint (ControlFillColorSecondary) has no exact token and previews with `control`.",
+      "note": "Basic composition. A visible label above the shared TextBox control, separated by token 2 (8px), equivalent to a stock WinUI TextBox with Header and PlaceholderText. The Gateway address example passes its label as the TextBox accessible name and its placeholder through props. All input geometry and interaction states belong to TextBox, so this field and its instances stay aligned with the default control.",
       "props": {
         "label": "Gateway address",
         "placeholder": "127.0.0.1:18789"
@@ -71,38 +117,21 @@
             "id": "field-label",
             "el": "span",
             "class": "ds-field-label",
+            "appearance": {
+              "fontFamily": "body",
+              "textStyle": "body",
+              "color": "ink"
+            },
             "children": [
               "{label}"
             ]
           },
           {
             "id": "field-input",
-            "el": "input",
-            "class": "ds-input",
-            "attrs": {
+            "component": "TextBox",
+            "props": {
+              "accessibleName": "{label}",
               "placeholder": "{placeholder}"
-            },
-            "layout": {
-              "padding": {
-                "x": "2",
-                "y": "1"
-              },
-              "width": "fill"
-            },
-            "appearance": {
-              "fontFamily": "body",
-              "textStyle": "body",
-              "color": "ink",
-              "background": "control",
-              "borderColor": "controlLine",
-              "radius": "sm"
-            },
-            "control": {
-              "focus": { "kind": "outline", "color": "accent" }
-            },
-            "states": {
-              "hover": { "background": "control" },
-              "disabled": { "color": "muted", "background": "control" }
             }
           }
         ]
@@ -110,7 +139,7 @@
     },
     {
       "name": "Card",
-      "note": "Content card. Flat by default — a 1px hairline border, not a drop shadow. Padding mirrors the WinUI Gallery card (16,12) as tokens 4 (16) and 3 (12) exactly, with the `md` radius and a `line`-colored border supplied by the ds-card class. Never nest a card inside a card.",
+      "note": "Content card. Flat by default: a 1px hairline border, not a drop shadow. Padding mirrors the WinUI Gallery card (16,12) as tokens 4 (16) and 3 (12) exactly, with the `md` radius and a `line`-colored border supplied by the ds-card class. The title binds `subtitle` (SubtitleTextBlockStyle, 20/28 SemiBold) and the description binds `body` (BodyTextBlockStyle, 14/20 Regular). Open report composes the shared HyperlinkButton, including its body typography and hover, pressed, disabled, and focus states. The card itself is static; only its action is interactive. Never nest a card inside a card.",
       "props": {
         "title": "Windows node",
         "body": "Paired · 6 capabilities exposed over MCP."
@@ -133,6 +162,11 @@
             "id": "card-title",
             "el": "h3",
             "class": "ds-card-title",
+            "appearance": {
+              "fontFamily": "display",
+              "textStyle": "subtitle",
+              "color": "ink"
+            },
             "children": [
               "{title}"
             ]
@@ -141,23 +175,24 @@
             "id": "card-body",
             "el": "p",
             "class": "ds-card-body",
+            "appearance": {
+              "fontFamily": "body",
+              "textStyle": "body",
+              "color": "muted"
+            },
             "children": [
               "{body}"
             ]
           },
           {
             "id": "card-link",
-            "el": "a",
-            "class": "ds-link",
-            "attrs": {
-              "href": "#"
+            "component": "HyperlinkButton",
+            "props": {
+              "children": "Open report"
             },
             "margin": {
               "top": "1"
-            },
-            "children": [
-              "Open report →"
-            ]
+            }
           }
         ]
       }
@@ -189,27 +224,36 @@
     },
     {
       "name": "SubtleButton",
-      "note": "Basic control. The quiet icon button used across the workspace chrome and flyouts (WinUI SubtleButtonStyle): Back/Forward, New session, pane toggle, notification bell, and the flyout dismiss button. Transparent rest (SubtleFillColorTransparent, `$none`) with a glyph in `ink`; hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`), disabled = ControlFillColorDisabled with `muted` glyph. `sm` radius (ControlCornerRadius). Previewed at the workspace command size 40x40 with a 16px glyph (WorkspaceWindow.xaml uses Width/Height 40, FontSize 16); the notification dismiss variant is 30x30 with an 11px glyph and 6px padding. `control.chrome:none` removes the web button border so the transparent Windows rest state shows, and `control.focus` draws the accent focus rectangle. Glyph shown is New session (Segoe Fluent Add, U+E710).",
+      "note": "Basic control. Default WinUI SubtleButtonStyle, not the workspace's fixed-size icon variant. Uses native ButtonPadding 11,5,11,6 (left, top, right, bottom), a retained 1px ButtonBorderThemeThickness, sm (4px) ControlCornerRadius, and normal-weight 14px text. Width and height follow content; the style itself sets no 40x40 dimensions. Background, border, and foreground bind SubtleButton-specific normal, pointer-over, pressed, and disabled resources, including high-contrast overrides. Preview hover/pressed border tokens are transparent in light/dark: CSS paints the fill under the border, so adding the translucent native border again would produce an incorrect dark rim. High-contrast borders and keyboard focus remain visible. Disabled fill and border resolve to the same values as rest; disabled text uses TextFillColorDisabledBrush, not muted. Port with Style={StaticResource SubtleButtonStyle}, leaving the native template intact rather than copying the browser border compensation. Browser limitations: body uses a 20px line box; native system focus (FocusVisualMargin=-3) and the 83ms background transition are not reproduced by Colophon's shared renderer. Workspace icon sizing and padding overrides belong to usage variants.",
       "props": {
-        "label": "New session"
+        "label": "Subtle button"
       },
       "root": {
         "id": "subtle-button-root",
         "el": "button",
         "attrs": {
-          "type": "button",
-          "aria-label": "{label}"
+          "type": "button"
         },
         "layout": {
           "mode": "horizontal",
           "align": "center",
           "justify": "center",
-          "width": 40,
-          "height": 40
+          "padding": {
+            "left": "buttonHorizontal",
+            "top": "buttonTop",
+            "right": "buttonHorizontal",
+            "bottom": "buttonBottom"
+          },
+          "width": "hug",
+          "height": "hug"
         },
         "appearance": {
-          "color": "ink",
-          "background": "$none",
+          "fontFamily": "body",
+          "textStyle": "body",
+          "color": "subtleButtonText",
+          "background": "subtleButtonFill",
+          "borderColor": "subtleButtonBorder",
+          "borderWidth": 1,
           "radius": "sm"
         },
         "control": {
@@ -217,23 +261,13 @@
           "focus": { "kind": "outline", "color": "accent" }
         },
         "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" },
-          "disabled": { "color": "muted", "background": "$none" }
+          "hover": { "color": "subtleButtonHoverText", "background": "subtleButtonHoverFill", "borderColor": "subtleButtonHoverBorder" },
+          "pressed": { "color": "subtleButtonPressedText", "background": "subtleButtonPressedFill", "borderColor": "subtleButtonPressedBorder" },
+          "hoverPressed": { "color": "subtleButtonPressedText", "background": "subtleButtonPressedFill", "borderColor": "subtleButtonPressedBorder" },
+          "disabled": { "color": "subtleButtonDisabledText", "background": "subtleButtonFill", "borderColor": "subtleButtonBorder" }
         },
         "children": [
-          {
-            "id": "subtle-button-glyph",
-            "el": "span",
-            "attrs": {
-              "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
-            },
-            "children": [
-              "\uE710"
-            ]
-          }
+          "{label}"
         ]
       }
     },
@@ -282,48 +316,43 @@
     },
     {
       "name": "ToggleSwitch",
-      "note": "Basic control. The stock WinUI ToggleSwitch used on settings and permission rows. Previewed in the ON state: track fills `accent` (AccentFillColorDefault / ToggleSwitchFillOn) with an `accentInk` (TextOnAccentFillColorPrimary) thumb pushed right. OFF state (documented as a port note): track is `control` (ControlFillColorDefault) with a `controlLine` border and a `muted`/ControlStrongFill thumb at left. Hover = AccentFillColorSecondary on (ControlFillColorSecondary off); pressed = AccentFillColorTertiary on (ControlFillColorTertiary off); disabled uses the Fluent disabled track. Track previewed at 40x20 with a `pill` radius and a 14px circular thumb; the thumb/track visuals are WinUI template parts and are a port note. Toggle-state brushes are stock Fluent resources, not locally remapped.",
+      "note": "Basic control. Static WinUI ToggleSwitch track reference, shown On for the existing settings composition pending interactive renderer support. Native geometry is 40x20 with a 12x12 resting knob, 14x14 pointer-over knob, and 17x14 pressed knob. Props describe a frozen snapshot, not live state. Colophon cannot persist checked state or animate geometry, so this is an image rather than a misleading non-working switch button. Native On/Off uses RepositionThemeAnimation with 20px travel; resizing uses 83ms and spline 0,0,0,1, except Disabled at 250ms. Full header/content layout, dragging, focus, keyboard switching, and CircleElevationBorderBrush remain native behavior. See DESIGN.md for bindings and limitations.",
       "props": {
-        "label": "Launch at startup"
+        "label": "On, normal. Static ToggleSwitch reference.",
+        "trackFill": "accent",
+        "trackStroke": "toggleOnStroke",
+        "knobFill": "accentInk",
+        "knobX": 23.5,
+        "knobY": 4,
+        "knobWidth": 12,
+        "knobHeight": 12
       },
       "root": {
         "id": "toggle-switch-root",
-        "el": "button",
+        "el": "svg",
         "attrs": {
-          "type": "button",
-          "role": "switch",
-          "aria-checked": "true",
-          "aria-label": "{label}"
-        },
-        "layout": {
-          "mode": "horizontal",
-          "align": "center",
-          "justify": "end",
-          "padding": { "x": "1" },
+          "viewBox": "0 0 40 20",
           "width": 40,
-          "height": 20
-        },
-        "appearance": {
-          "background": "accent",
-          "radius": "pill"
-        },
-        "control": {
-          "chrome": "none",
-          "focus": { "kind": "outline", "color": "accent" }
-        },
-        "states": {
-          "hover": { "background": "accentSubtle" },
-          "pressed": { "background": "accentSubtle" },
-          "hoverPressed": { "background": "accentSubtle" },
-          "disabled": { "background": "control" }
+          "height": 20,
+          "role": "img",
+          "aria-label": "{label}"
         },
+        "layout": { "width": 40, "height": 20 },
         "children": [
+          {
+            "id": "toggle-switch-track",
+            "el": "rect",
+            "attrs": { "width": 40, "height": 20, "rx": 10, "fill": "var(--color-{trackFill})" }
+          },
+          {
+            "id": "toggle-switch-stroke",
+            "el": "rect",
+            "attrs": { "x": 0.5, "y": 0.5, "width": 39, "height": 19, "rx": 9.5, "fill": "none", "stroke": "var(--color-{trackStroke})", "stroke-width": 1 }
+          },
           {
             "id": "toggle-switch-thumb",
-            "el": "span",
-            "attrs": { "aria-hidden": "true" },
-            "layout": { "width": 14, "height": 14 },
-            "appearance": { "background": "accentInk", "radius": "pill" }
+            "el": "rect",
+            "attrs": { "x": "{knobX}", "y": "{knobY}", "width": "{knobWidth}", "height": "{knobHeight}", "rx": 7, "fill": "var(--color-{knobFill})" }
           }
         ]
       }
@@ -342,6 +371,7 @@
           "aria-label": "Connected"
         },
         "layout": {
+          "mode": "horizontal",
           "width": 10,
           "height": 10
         },
@@ -353,28 +383,31 @@
     },
     {
       "name": "Avatar",
-      "note": "Basic control. WinUI PersonPicture circular avatar. Non-interactive. The agent avatar is 32x32 (AgentIdentityBadge), the workspace Owner avatar is 24x24; both render a circular initials/photo tile. Previewed at 32x32 with a `pill` radius and a `muted` placeholder fill plus `ink`-on-muted initials; real photo/initials and the circular clip are WinUI template behavior and a port note.",
+      "note": "Basic control. Default WinUI PersonPicture initials reference: 96x96, a 1px ellipse stroke, PersonPictureEllipseFillThemeBrush, primary foreground, and SemiBold initials at diameter * 0.42 = 40.32px. ContentControlThemeFontFamily, not the Caption style. No hover or pressed states: PersonPicture is not interactive. AvatarStates shows Contact and People glyph fallbacks. Photo clipping, automatic initials, badges, and native TextLineBounds=Tight remain native behavior. Existing 32px agent and 24px owner avatars are usage overrides, not this control's defaults.",
       "props": {
-        "initials": "AU"
+        "initials": "AU",
+        "name": "Example user"
       },
       "root": {
         "id": "avatar-root",
         "el": "span",
         "attrs": {
-          "role": "img"
+          "role": "img",
+          "aria-label": "{name}"
         },
         "layout": {
           "mode": "horizontal",
           "align": "center",
           "justify": "center",
-          "width": 32,
-          "height": 32
+          "width": 96,
+          "height": 96
         },
         "appearance": {
-          "fontFamily": "body",
-          "textStyle": "small",
-          "color": "ink",
-          "background": "muted",
+          "textStyle": "personInitials",
+          "color": "nativeText",
+          "background": "personPictureFill",
+          "borderColor": "personPictureStroke",
+          "borderWidth": 1,
           "radius": "pill"
         },
         "children": [
@@ -382,12 +415,28 @@
         ]
       }
     },
+    {
+      "name": "AvatarStates",
+      "note": "PersonPicture's native initials, NoPhotoOrInitials (Contact U+E77B), and Group (People U+E716) presentations. All are static and non-focusable. Photo and badge states require native image/initials handling and are not claimed by these references.",
+      "root": {
+        "id": "avatar-states-root",
+        "el": "div",
+        "layout": { "mode": "horizontal", "gap": "6", "wrap": true },
+        "children": [
+          { "id": "avatar-initials", "component": "Avatar" },
+          { "id": "avatar-contact", "component": "Avatar", "props": { "initials": "\uE77B", "name": "Person without photo or initials" }, "appearance": { "textStyle": "personSymbol" } },
+          { "id": "avatar-group", "component": "Avatar", "props": { "initials": "\uE716", "name": "Group" }, "appearance": { "textStyle": "personSymbol" } }
+        ]
+      }
+    },
     {
       "name": "InfoBar",
-      "note": "Basic control. The Fluent InfoBar severity banner used for workspace operation errors and app notifications (WorkspaceWindow OperationInfo, HubWindow AppNotificationInfoBar, ChatPage). Previewed at Error severity: a `surface` sheet with a `line` hairline, `md` radius, and 16px padding, led by a `critical` status glyph (Segoe Fluent Error, U+EA39), a `ink` BodyStrong title, a `muted` caption message, and a trailing SubtleButton close (U+E711). Severity recolors the leading glyph only: `critical` Error, `warning` Warning, `positive` Success, `accent` Informational. The banner body is non-interactive; the close button carries the shared subtle hover/pressed states.",
+      "note": "Basic control. Native InfoBar horizontal reference, shown Error. Severity changes BOTH background and layered 16px icon; InfoBarStates shows all four. Native title is 14px SemiBold and message 14px Normal, both primary foreground. ControlCornerRadius=4; content-grid minimum height=48 plus outer border; leading padding=16, icon gap=14, text top=14, title/message gap=12, panel end margin=16. Close uses InfoBarCloseButtonStyle (DefaultButtonStyle with AppBarButton resources), 38x38 plus margin 5, with a 16px Cancel glyph. Hover/press/disabled/focus visuals work, but close does NOT dismiss: the renderer has no dismiss action. Native responsive InfoBarPanel, conditional content and high-contrast 2px border are unsupported; browser wrapping and the 1px preview border are not 1:1 native proof.",
       "props": {
         "title": "Couldn't reach the gateway",
-        "message": "Check that the gateway is running, then retry."
+        "message": "Check that the gateway is running, then retry.",
+        "iconTone": "infoErrorIcon",
+        "iconGlyph": "\uF13D"
       },
       "root": {
         "id": "info-bar-root",
@@ -395,42 +444,50 @@
         "attrs": { "role": "status" },
         "layout": {
           "mode": "horizontal",
-          "gap": "3",
-          "padding": "4",
+          "padding": { "left": "4" },
           "align": "start",
           "width": "fill"
         },
         "appearance": {
-          "background": "surface",
-          "borderColor": "line",
-          "radius": "md"
+          "background": "infoErrorFill",
+          "borderColor": "infoBorder",
+          "borderWidth": 1,
+          "radius": "sm"
         },
         "children": [
           {
             "id": "info-bar-icon",
-            "el": "span",
+            "el": "svg",
             "attrs": {
               "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+              "viewBox": "0 0 16 16",
+              "width": 16,
+              "height": 16
             },
-            "appearance": { "color": "critical" },
-            "children": [ "\uEA39" ]
+            "layout": { "width": 16, "height": 16 },
+            "margin": { "top": "4", "right": "infoIconGap", "bottom": "4" },
+            "appearance": { "textStyle": "infoSymbol" },
+            "children": [
+              { "id": "info-bar-icon-background", "el": "text", "attrs": { "x": 8, "y": 8, "text-anchor": "middle", "dominant-baseline": "central", "fill": "var(--color-{iconTone})" }, "children": [ "\uF136" ] },
+              { "id": "info-bar-icon-foreground", "el": "text", "attrs": { "x": 8, "y": 8, "text-anchor": "middle", "dominant-baseline": "central", "fill": "var(--color-infoIconForeground)" }, "children": [ "{iconGlyph}" ] }
+            ]
           },
           {
             "id": "info-bar-text",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "layout": { "mode": "horizontal", "gap": "3", "wrap": true, "grow": true },
+            "margin": { "top": "infoTextTop", "right": "4" },
             "children": [
               {
                 "id": "info-bar-title",
                 "el": "span",
-                "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" },
+                "appearance": { "fontFamily": "body", "textStyle": "bodyStrong", "color": "nativeText" },
                 "children": [ "{title}" ]
               },
               {
                 "id": "info-bar-message",
                 "el": "span",
-                "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" },
+                "appearance": { "fontFamily": "body", "textStyle": "body", "color": "nativeText" },
                 "children": [ "{message}" ]
               }
             ]
@@ -438,26 +495,26 @@
           {
             "id": "info-bar-close",
             "el": "button",
-            "attrs": { "type": "button", "aria-label": "Close" },
-            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 30, "height": 30 },
-            "appearance": { "color": "muted", "background": "$none", "radius": "sm" },
+            "attrs": { "type": "button", "aria-label": "Close (visual reference only)", "title": "Visual states only. Dismissal is not supported by this renderer." },
+            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 38, "height": 38 },
+            "margin": "buttonTop",
+            "appearance": { "color": "nativeText", "background": "$none", "borderColor": "$none", "borderWidth": 1, "radius": "sm" },
             "control": {
               "chrome": "none",
               "focus": { "kind": "outline", "color": "accent" }
             },
             "states": {
-              "hover": { "background": "subtleHover" },
-              "pressed": { "background": "subtlePressed" },
-              "hoverPressed": { "background": "subtlePressed" }
+              "hover": { "background": "infoCloseHoverFill", "color": "infoCloseHoverText" },
+              "pressed": { "background": "infoClosePressedFill", "color": "infoClosePressedText" },
+              "hoverPressed": { "background": "infoClosePressedFill", "color": "infoClosePressedText" },
+              "disabled": { "background": "$none", "color": "subtleButtonDisabledText" }
             },
             "children": [
               {
                 "id": "info-bar-close-glyph",
                 "el": "span",
-                "attrs": {
-                  "aria-hidden": "true",
-                  "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:11px"
-                },
+                "attrs": { "aria-hidden": "true" },
+                "appearance": { "textStyle": "infoSymbol" },
                 "children": [ "\uE711" ]
               }
             ]
@@ -465,6 +522,21 @@
         ]
       }
     },
+    {
+      "name": "InfoBarStates",
+      "note": "Native severity references. Each reuses InfoBar's geometry, typography, layered glyph, and close-control states. The body remains static; severity is not a hover state. No close/dismiss behavior is implemented by Colophon.",
+      "root": {
+        "id": "info-bar-states-root",
+        "el": "div",
+        "layout": { "mode": "vertical", "gap": "3", "width": "fill" },
+        "children": [
+          { "id": "info-bar-informational", "component": "InfoBar", "props": { "title": "Informational", "message": "Gateway settings are ready to review.", "iconTone": "infoAttentionIcon", "iconGlyph": "\uF13F" }, "appearance": { "background": "infoAttentionFill" } },
+          { "id": "info-bar-success", "component": "InfoBar", "props": { "title": "Success", "message": "The gateway is connected.", "iconTone": "infoSuccessIcon", "iconGlyph": "\uF13E" }, "appearance": { "background": "infoSuccessFill" } },
+          { "id": "info-bar-warning", "component": "InfoBar", "props": { "title": "Warning", "message": "Pairing approval is required.", "iconTone": "infoWarningIcon", "iconGlyph": "\uF13C" }, "appearance": { "background": "infoWarningFill" } },
+          { "id": "info-bar-error", "component": "InfoBar", "props": { "title": "Error", "message": "The gateway could not be reached." } }
+        ]
+      }
+    },
     {
       "name": "ComposerPicker",
       "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens the picker flyout. Since #1459 the model picker is a native flyout with an AutoSuggestBox over a grouped, single-selection ListView, and the reasoning-effort picker is a native discrete slider with a compact gauge trigger (`ChatEffortGauge`, rendered with WinUI paths, not a font glyph) at narrow widths; a picker trigger value can tint with `ChatPickerAccentBrush`. The session selector stays a single-select flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
@@ -3016,7 +3088,7 @@
             "layout": { "mode": "vertical", "gap": "4", "padding": "5", "width": "fill" },
             "appearance": { "background": "surface", "borderColor": "line", "radius": "md" },
             "children": [
-              { "id": "setup-wizard-card-title", "el": "h2", "appearance": { "fontFamily": "display", "textStyle": "heading", "color": "ink" }, "children": [ "Choose what this node can do" ] },
+              { "id": "setup-wizard-card-title", "el": "h2", "appearance": { "fontFamily": "display", "textStyle": "subtitle", "color": "ink" }, "children": [ "Choose what this node can do" ] },
               { "id": "setup-wizard-opt-1", "component": "CapabilityOptionRow" },
               {
                 "id": "setup-wizard-opt-2",
diff --git a/DESIGN.md b/DESIGN.md
index 3b7849aaed..d3067fa286 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -15,39 +15,120 @@ colors:
   critical: "#c42b1c"
   subtleHover: rgba(0,0,0,0.037)
   subtlePressed: rgba(0,0,0,0.024)
+  subtleButtonFill: "#ffffff00"
+  subtleButtonHoverFill: "#00000009"
+  subtleButtonPressedFill: "#00000006"
+  subtleButtonText: "#000000e4"
+  subtleButtonHoverText: "#000000e4"
+  subtleButtonPressedText: "#0000009e"
+  subtleButtonDisabledText: "#0000005c"
+  subtleButtonBorder: "#ffffff00"
+  subtleButtonHoverBorder: "#ffffff00"
+  subtleButtonPressedBorder: "#ffffff00"
   control: "#ffffff"
+  controlHover: rgba(249,249,249,0.502)
+  controlDisabled: rgba(249,249,249,0.302)
+  disabledText: rgba(0,0,0,0.361)
   controlLine: "#ececec"
   accentSubtle: "#1a75c7"
+  nativeText: "#000000e4"
+  personPictureFill: "#00000018"
+  personPictureStroke: "#0000000f"
+  toggleOffFill: "#00000006"
+  toggleOffHoverFill: "#0000000f"
+  toggleOffPressedFill: "#00000018"
+  toggleOffDisabledFill: "#ffffff00"
+  toggleOffStroke: "#00000072"
+  toggleOffHotStroke: "#00000072"
+  toggleDisabledStroke: "#00000037"
+  toggleOnHoverFill: "#0067c0e6"
+  toggleOnPressedFill: "#0067c0cc"
+  toggleOnDisabledFill: "#00000037"
+  toggleOnStroke: "#ffffff00"
+  toggleOnHotStroke: "#ffffff00"
+  toggleOnDisabledStroke: "#ffffff00"
+  toggleOffKnob: "#0000009e"
+  toggleOffHotKnob: "#0000009e"
+  toggleOnHotKnob: "#ffffff"
+  toggleOnDisabledKnob: "#ffffff"
+  infoErrorFill: "#fde7e9"
+  infoWarningFill: "#fff4ce"
+  infoSuccessFill: "#dff6dd"
+  infoAttentionFill: "#f6f6f680"
+  infoErrorIcon: "#c42b1c"
+  infoWarningIcon: "#9d5d00"
+  infoSuccessIcon: "#0f7b0f"
+  infoAttentionIcon: "#0078d4"
+  infoIconForeground: "#ffffff"
+  infoBorder: "#0000000f"
+  infoCloseHoverFill: "#00000009"
+  infoClosePressedFill: "#00000006"
+  infoCloseHoverText: "#000000e4"
+  infoClosePressedText: "#0000009e"
 typography:
   display:
+    fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 68px
+    fontWeight: 600
+    lineHeight: 92px
+  titleLarge:
     fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
     fontSize: 40px
     fontWeight: 600
-    lineHeight: 50px
-    letterSpacing: -0.01em
+    lineHeight: 52px
   title:
     fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
     fontSize: 28px
     fontWeight: 600
     lineHeight: 36px
-  heading:
-    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+  subtitle:
+    fontFamily: '"Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
     fontSize: 20px
     fontWeight: 600
     lineHeight: 28px
+  bodyLargeStrong:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 18px
+    fontWeight: 600
+    lineHeight: 24px
+  bodyLarge:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 18px
+    fontWeight: 400
+    lineHeight: 24px
+  bodyStrong:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 14px
+    fontWeight: 600
+    lineHeight: 20px
   body:
     fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
     fontSize: 14px
     fontWeight: 400
     lineHeight: 20px
+  caption:
+    fontFamily: '"Segoe UI Variable Small", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 12px
+    fontWeight: 400
+    lineHeight: 16px
   small:
     fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
     fontSize: 13px
     fontWeight: 400
     lineHeight: 18px
-  caption:
-    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
-    fontSize: 12px
+  personInitials:
+    fontFamily: '"Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 40.32px
+    fontWeight: 600
+    lineHeight: 1
+  personSymbol:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 40.32px
+    fontWeight: 600
+    lineHeight: 1
+  infoSymbol:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 16px
     fontWeight: 400
     lineHeight: 16px
 spacing:
@@ -59,6 +140,14 @@ spacing:
   "6": 32px
   "7": 48px
   "8": 64px
+  textControlLeft: 10px
+  textControlTop: 5px
+  textControlEnd: 6px
+  buttonHorizontal: 11px
+  buttonTop: 5px
+  buttonBottom: 6px
+  infoTextTop: 14px
+  infoIconGap: 14px
 rounded:
   sm: 4px
   md: 8px
@@ -239,6 +328,66 @@ x-colophon:
           dark: rgba(255,255,255,0.0419)
           highContrast: transparent
         usage: "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)."
+      subtleButtonFill:
+        resource: SubtleButtonBackground
+        themes:
+          dark: "#ffffff00"
+          highContrast: "#000000"
+        usage: Native SubtleButton rest and disabled fill. SubtleButtonBackgroundDisabled resolves to the same brush in every theme.
+      subtleButtonHoverFill:
+        resource: SubtleButtonBackgroundPointerOver
+        themes:
+          dark: "#ffffff0f"
+          highContrast: "#000000"
+        usage: Native SubtleButton pointer-over fill; high contrast binds SystemColorHighlightTextColorBrush.
+      subtleButtonPressedFill:
+        resource: SubtleButtonBackgroundPressed
+        themes:
+          dark: "#ffffff0a"
+          highContrast: "#000000"
+        usage: Native SubtleButton pressed fill; high contrast binds SystemColorHighlightTextColorBrush.
+      subtleButtonText:
+        resource: SubtleButtonForeground
+        themes:
+          dark: "#ffffff"
+          highContrast: "#ffffff"
+        usage: Native SubtleButton rest foreground; high contrast binds SystemColorButtonTextColorBrush.
+      subtleButtonHoverText:
+        resource: SubtleButtonForegroundPointerOver
+        themes:
+          dark: "#ffffff"
+          highContrast: "#ffffff"
+        usage: Native SubtleButton pointer-over foreground; high contrast binds SystemControlHighlightBaseHighBrush.
+      subtleButtonPressedText:
+        resource: SubtleButtonForegroundPressed
+        themes:
+          dark: "#ffffffc5"
+          highContrast: "#ffffff"
+        usage: Native SubtleButton pressed foreground uses TextFillColorSecondaryBrush, not the normal foreground.
+      subtleButtonDisabledText:
+        resource: SubtleButtonForegroundDisabled
+        themes:
+          dark: "#ffffff5d"
+          highContrast: "#808080"
+        usage: Native SubtleButton disabled foreground uses TextFillColorDisabledBrush, not muted text.
+      subtleButtonBorder:
+        resource: SubtleButtonBorderBrush
+        themes:
+          dark: "#ffffff00"
+          highContrast: "#ffffff00"
+        usage: Transparent 1px native border retained in layout. SubtleButtonBorderBrushDisabled is also transparent in every theme.
+      subtleButtonHoverBorder:
+        resource: SubtleButtonBorderBrushPointerOver
+        themes:
+          dark: "#ffffff00"
+          highContrast: "#ffff00"
+        usage: Preview-only transparent border in light/dark avoids painting the translucent hover fill twice at the edge. Native WinUI uses the matching subtle-fill brush with InnerBorderEdge clipping. High contrast retains SystemColorHighlightColorBrush.
+      subtleButtonPressedBorder:
+        resource: SubtleButtonBorderBrushPressed
+        themes:
+          dark: "#ffffff00"
+          highContrast: "#000000"
+        usage: Preview-only transparent border in light/dark avoids painting the translucent pressed fill twice at the edge. Native WinUI uses the matching subtle-fill brush with InnerBorderEdge clipping. High contrast retains SystemColorHighlightTextColorBrush.
       control:
         resource: ControlFillColorDefaultBrush
         themes:
@@ -251,12 +400,140 @@ x-colophon:
           dark: "#353535"
           highContrast: "#ffffff"
         usage: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards).
+      controlHover:
+        resource: ControlFillColorSecondaryBrush
+        themes:
+          dark: rgba(255,255,255,0.0824)
+          highContrast: "#000000"
+        usage: TextBox pointer-over fill. In high contrast the native resource follows SystemColorButtonFaceColor.
+      controlDisabled:
+        resource: ControlFillColorDisabledBrush
+        themes:
+          dark: rgba(255,255,255,0.0431)
+          highContrast: "#000000"
+        usage: Disabled input fill. In high contrast the native resource follows SystemColorButtonFaceColor.
+      disabledText:
+        resource: TextFillColorDisabledBrush
+        themes:
+          dark: rgba(255,255,255,0.365)
+          highContrast: "#808080"
+        usage: Disabled input text. In high contrast the native resource follows SystemColorGrayTextColor.
       accentSubtle:
         resource: AccentFillColorSecondaryBrush
         themes:
           dark: "#47b6ef"
           highContrast: "#ffff00"
         usage: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local ChatUserBrush (Windows accent at low opacity, for example SystemAccentColorLight2 at 12% on dark and SystemAccentColorDark1 at 8% on light, with the full system highlight in high contrast). AccentFillColorSecondary is the closest standard Fluent approximation for preview.
+      nativeText:
+        resource: TextFillColorPrimaryBrush
+        themes: { dark: "#ffffff", highContrast: "#ffffff" }
+        usage: Alpha-preserving native foreground for PersonPicture and InfoBar, including colored backgrounds.
+      personPictureFill:
+        resource: PersonPictureEllipseFillThemeBrush
+        themes: { dark: "#ffffff12", highContrast: "#000000" }
+      personPictureStroke:
+        resource: PersonPictureEllipseFillStrokeBrush
+        themes: { dark: "#00000019", highContrast: "#ffffff" }
+      toggleOffFill:
+        resource: ToggleSwitchFillOff
+        themes: { dark: "#00000019", highContrast: "#000000" }
+      toggleOffHoverFill:
+        resource: ToggleSwitchFillOffPointerOver
+        themes: { dark: "#ffffff0b", highContrast: "#000000" }
+      toggleOffPressedFill:
+        resource: ToggleSwitchFillOffPressed
+        themes: { dark: "#ffffff12", highContrast: "#000000" }
+      toggleOffDisabledFill:
+        resource: ToggleSwitchFillOffDisabled
+        themes: { dark: "#ffffff00", highContrast: "#000000" }
+      toggleOffStroke:
+        resource: ToggleSwitchStrokeOff
+        themes: { dark: "#ffffff8b", highContrast: "#ffffff" }
+      toggleOffHotStroke:
+        resource: ToggleSwitchStrokeOffPointerOver
+        themes: { dark: "#ffffff8b", highContrast: "#ffff00" }
+        usage: Pointer-over and pressed strokes share the same resource values.
+      toggleDisabledStroke:
+        resource: ToggleSwitchStrokeOffDisabled
+        themes: { dark: "#ffffff28", highContrast: "#808080" }
+      toggleOnHoverFill:
+        resource: ToggleSwitchFillOnPointerOver
+        themes: { dark: "#4cc2ffe6", highContrast: "#000000" }
+      toggleOnPressedFill:
+        resource: ToggleSwitchFillOnPressed
+        themes: { dark: "#4cc2ffcc", highContrast: "#000000" }
+      toggleOnDisabledFill:
+        resource: ToggleSwitchFillOnDisabled
+        themes: { dark: "#ffffff28", highContrast: "#000000" }
+      toggleOnStroke:
+        resource: ToggleSwitchStrokeOn
+        themes: { dark: "#ffffff00", highContrast: "#ffff00" }
+        usage: Transparent preview stroke models ToggleSwitchOnStrokeThickness=0 in light/dark; high contrast retains the native 1px stroke.
+      toggleOnHotStroke:
+        resource: ToggleSwitchStrokeOnPointerOver
+        themes: { dark: "#ffffff00", highContrast: "#ffffff" }
+        usage: Pointer-over and pressed preview strokes are transparent only where native stroke thickness is zero.
+      toggleOnDisabledStroke:
+        resource: ToggleSwitchStrokeOnDisabled
+        themes: { dark: "#ffffff00", highContrast: "#808080" }
+        usage: Disabled preview stroke is transparent only where native stroke thickness is zero.
+      toggleOffKnob:
+        resource: ToggleSwitchKnobFillOff
+        themes: { dark: "#ffffffc5", highContrast: "#ffffff" }
+      toggleOffHotKnob:
+        resource: ToggleSwitchKnobFillOffPointerOver
+        themes: { dark: "#ffffffc5", highContrast: "#ffff00" }
+        usage: Pointer-over and pressed knob fills share the same resource values.
+      toggleOnHotKnob:
+        resource: ToggleSwitchKnobFillOnPointerOver
+        themes: { dark: "#000000", highContrast: "#ffffff" }
+        usage: Pointer-over and pressed knob fills share the same resource values.
+      toggleOnDisabledKnob:
+        resource: ToggleSwitchKnobFillOnDisabled
+        themes: { dark: "#ffffff87", highContrast: "#808080" }
+      infoErrorFill:
+        resource: InfoBarErrorSeverityBackgroundBrush
+        themes: { dark: "#442726", highContrast: "#000000" }
+      infoWarningFill:
+        resource: InfoBarWarningSeverityBackgroundBrush
+        themes: { dark: "#433519", highContrast: "#000000" }
+      infoSuccessFill:
+        resource: InfoBarSuccessSeverityBackgroundBrush
+        themes: { dark: "#393d1b", highContrast: "#000000" }
+      infoAttentionFill:
+        resource: InfoBarInformationalSeverityBackgroundBrush
+        themes: { dark: "#ffffff08", highContrast: "#000000" }
+      infoErrorIcon:
+        resource: InfoBarErrorSeverityIconBackground
+        themes: { dark: "#ff99a4", highContrast: "#ffff00" }
+      infoWarningIcon:
+        resource: InfoBarWarningSeverityIconBackground
+        themes: { dark: "#fce100", highContrast: "#ffff00" }
+      infoSuccessIcon:
+        resource: InfoBarSuccessSeverityIconBackground
+        themes: { dark: "#6ccb5f", highContrast: "#ffff00" }
+      infoAttentionIcon:
+        resource: InfoBarInformationalSeverityIconBackground
+        themes: { dark: "#4cc2ff", highContrast: "#ffff00" }
+      infoIconForeground:
+        resource: InfoBarErrorSeverityIconForeground
+        themes: { dark: "#000000e4", highContrast: "#000000" }
+        usage: All four severity icon foreground aliases resolve to this same brush in each theme.
+      infoBorder:
+        resource: InfoBarBorderBrush
+        themes: { dark: "#00000019", highContrast: "#ffffff" }
+      infoCloseHoverFill:
+        resource: AppBarButtonBackgroundPointerOver
+        themes: { dark: "#ffffff0f", highContrast: "#ffff00" }
+      infoClosePressedFill:
+        resource: AppBarButtonBackgroundPressed
+        themes: { dark: "#ffffff0a", highContrast: "#ffff00" }
+      infoCloseHoverText:
+        resource: AppBarButtonForegroundPointerOver
+        themes: { dark: "#ffffff", highContrast: "#000000" }
+      infoClosePressedText:
+        resource: AppBarButtonForegroundPressed
+        themes: { dark: "#ffffffc5", highContrast: "#000000" }
     typography:
       display:
         weights:
@@ -281,16 +558,43 @@ x-colophon:
       scale:
         display:
           role: display
+          resource: DisplayTextBlockStyle
+        titleLarge:
+          role: display
+          resource: TitleLargeTextBlockStyle
         title:
           role: display
-        heading:
+          resource: TitleTextBlockStyle
+        subtitle:
+          role: display
+          resource: SubtitleTextBlockStyle
+        bodyLargeStrong:
+          role: body
+          resource: BodyLargeStrongTextBlockStyle
+        bodyLarge:
+          role: body
+          resource: BodyLargeTextBlockStyle
+        bodyStrong:
           role: body
+          resource: BodyStrongTextBlockStyle
         body:
           role: body
+          resource: BodyTextBlockStyle
+        caption:
+          role: body
+          resource: CaptionTextBlockStyle
         small:
           role: body
-        caption:
+          usage: App-specific dense text at 13/18. Not a named WinUI TextBlock style.
+        personInitials:
+          role: body
+          usage: PersonPicture template text, not a TextBlock style. Default 96px diameter times 0.42, SemiBold; ContentControlThemeFontFamily.
+        personSymbol:
           role: body
+          usage: PersonPicture Contact/People fallback glyph at the same 42% size; SymbolThemeFontFamily.
+        infoSymbol:
+          role: body
+          usage: InfoBarIconFontSize and InfoBarCloseButtonGlyphSize, both 16px; SymbolThemeFontFamily.
     spacing:
       unit: 4
 ---
@@ -329,7 +633,11 @@ Personality: native, trustworthy, calm, precise.
 - **critical** {colors.critical}: Errors, disconnected, destructive. Fluent SystemFillColorCritical.
 - **subtleHover** {colors.subtleHover}: Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000).
 - **subtlePressed** {colors.subtlePressed}: Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000).
+- **SubtleButton states:** {colors.subtleButtonFill}, {colors.subtleButtonHoverFill}, {colors.subtleButtonPressedFill}, {colors.subtleButtonText}, {colors.subtleButtonHoverText}, {colors.subtleButtonPressedText}, {colors.subtleButtonDisabledText}, {colors.subtleButtonBorder}, {colors.subtleButtonHoverBorder}, and {colors.subtleButtonPressedBorder} bind the control-specific `SubtleButton*` resources. Fill and text alpha bytes come directly from WinUI. Hover/pressed borders are transparent only in the light/dark browser preview, where the background already covers the border area; painting the same translucent color twice would create an incorrect dark outline. Native resource bindings remain unchanged. Separate border and foreground roles preserve the native high-contrast overrides; the displayed high-contrast swatches represent this preview's black/white/yellow scheme, not fixed system colors.
 - **control** {colors.control}: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault, distinct from the Card surface used for cards/flyouts.
+- **controlHover** {colors.controlHover}: TextBox pointer-over fill, mapped to `ControlFillColorSecondaryBrush`.
+- **controlDisabled** {colors.controlDisabled}: Disabled input fill, mapped to `ControlFillColorDisabledBrush`.
+- **disabledText** {colors.disabledText}: Disabled input text, mapped to `TextFillColorDisabledBrush`.
 - **controlLine** {colors.controlLine}: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault, distinct from the Card/divider stroke used for cards.
 - **accentSubtle** {colors.accentSubtle}: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local `ChatUserBrush` (Windows accent at low opacity), quieter than the full accent reserved for primary actions.
 
@@ -337,12 +645,23 @@ Colors are preview swatches only. Bind each color's mapped `resource` key (in `x
 
 ## Typography
 
-- **display** {typography.display}: Page and section titles. Segoe UI Variable Display optical size.
-- **title** {typography.title}: Page and section titles. Segoe UI Variable Display optical size.
-- **heading** {typography.heading}: Section headings. Segoe UI Variable Text optical size.
-- **body** {typography.body}: Body copy, UI labels, buttons. Segoe UI Variable Text optical size.
-- **small** {typography.small}: Secondary and dense UI text. Segoe UI Variable Text optical size.
-- **caption** {typography.caption}: Captions and metadata. Segoe UI Variable Text optical size.
+The reference follows the nine text styles in the WinUI Gallery Typography page. Sizes and line heights are effective pixels (epx), equivalent to XAML device-independent units; Colophon previews them as CSS pixels. Regular is weight 400 and SemiBold is weight 600. Bind the named WinUI `TextBlock` style in native XAML, for example `Style="{StaticResource BodyTextBlockStyle}"`, rather than recreating it with individual setters.
+
+| Style | Token | Segoe UI Variable optical size / weight | Size / line height | WinUI resource |
+| --- | --- | --- | --- | --- |
+| Caption | {typography.caption} | Small, Regular | 12 / 16 | `CaptionTextBlockStyle` |
+| Body | {typography.body} | Text, Regular | 14 / 20 | `BodyTextBlockStyle` |
+| Body Strong | {typography.bodyStrong} | Text, SemiBold | 14 / 20 | `BodyStrongTextBlockStyle` |
+| Body Large | {typography.bodyLarge} | Text, Regular | 18 / 24 | `BodyLargeTextBlockStyle` |
+| Body Large Strong | {typography.bodyLargeStrong} | Text, SemiBold | 18 / 24 | `BodyLargeStrongTextBlockStyle` |
+| Subtitle | {typography.subtitle} | Display, SemiBold | 20 / 28 | `SubtitleTextBlockStyle` |
+| Title | {typography.title} | Display, SemiBold | 28 / 36 | `TitleTextBlockStyle` |
+| Title Large | {typography.titleLarge} | Display, SemiBold | 40 / 52 | `TitleLargeTextBlockStyle` |
+| Display | {typography.display} | Display, SemiBold | 68 / 92 | `DisplayTextBlockStyle` |
+
+Resource mappings are also recorded on `x-colophon.tokens.typography.scale` for inspection. `subtitle` replaces the former `heading` token. The former 40px `display` sample is now correctly named `titleLarge`, with a 52px line height; `display` is the 68px style. Keep standard tracking rather than applying custom negative letter spacing.
+
+**App-specific extension:** {typography.small} remains 13/18, Text Regular, for existing dense controls. It is not one of the named WinUI Gallery styles and has no invented resource mapping.
 
 Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E, and the chat toolbar uses ChatSubmit (U+E74A), ChatAttach (U+E710), ChevronDown (U+E70D), and Stop (U+E71A).
 
@@ -350,6 +669,10 @@ Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.
 
 Use the named spacing tokens rather than ad-hoc values. Prefer the `5` and `6` steps between groups so content can breathe. One subject per screen: decide what the screen is for, and let that element win.
 
+The `textControlLeft` (10px), `textControlTop` (5px), and `textControlEnd` (6px) tokens preserve WinUI's `TextControlThemePadding` of 10,5,6,6 without rounding it to the general spacing grid.
+
+The `buttonHorizontal` (11px), `buttonTop` (5px), and `buttonBottom` (6px) tokens preserve WinUI's `ButtonPadding` of 11,5,11,6 (left, top, right, bottom). These are content padding inside the separately retained 1px button border, not a fixed square hit target.
+
 ## Information hierarchy
 
 1. **One subject per screen.** Decide what the screen is for and let that element win.
@@ -393,11 +716,35 @@ The catalog is organized into four families. Colophon's left navigation includes
 
 Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
 
-- **Basic controls.** Button (primary/standard/subtle), SubtleButton (square icon), HyperlinkButton, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. The building blocks every other family composes.
+- **Basic controls.** Button (primary/standard/subtle), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control.
 - **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
 - **Chat.** ChatBubble, ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.
 - **Settings.** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and the SettingsWindowShell host frame, ported from `OpenClaw.Tray.WinUI` pages and `HubWindow`.
 
+TextBox ships as the stock `Microsoft.UI.Xaml.Controls.TextBox`, as used by `DirectUrlBox` in `Pages/ConnectionPage.xaml`, not a custom control template. The Colophon preview uses 14px body text, 32px single-line height, `sm` corners, exact text-control padding, pointer-over and disabled resource tokens, and the accent focus underline. WinUI has no separate pressed background for the input itself; pressing enters its focused state. The browser preview approximates the native elevation border with `controlLine` and does not reproduce the native focused-fill transition or clear-button template.
+
+Card binds its title to `subtitle` (`SubtitleTextBlockStyle`, 20/28 SemiBold) and its description to `body` (`BodyTextBlockStyle`, 14/20 Regular). Its Open report action references the shared HyperlinkButton, not a separately styled link. The card remains static while the action inherits the shared control's typography, hover, pressed, disabled, and focus states.
+
+StatusDot is a non-interactive 10x10 indicator with `pill` corners and a semantic fill. Its standalone preview uses explicit Auto Layout so the empty span retains its width and height instead of collapsing as inline text.
+
+SubtleButton follows [`SubtleButtonStyle` and `ButtonPadding` in WinUI](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/Button_themeresources.xaml): 11,5,11,6 content padding, a 1px border, `ControlCornerRadius` (4px), and normal-weight 14px content. The default example is content-sized text, not a 40x40 icon button. The workspace's 40x40 icon buttons and their local padding overrides are usage variants, not defaults of the style. Rest and disabled backgrounds remain transparent in light/dark; hover and pressed states change background, border, and foreground through the native resource aliases above. Ship with `Style="{StaticResource SubtleButtonStyle}"` and leave its template intact.
+
+The browser paints backgrounds through the border box rather than using WinUI's `BackgroundSizing=InnerBorderEdge`. SubtleButton therefore keeps its 1px border transparent in light/dark, including hover and pressed states, so the edge receives exactly one layer of the subtle fill. High-contrast borders and keyboard-only focus remain visible. This preview compensation must not replace the native `SubtleButtonStyle` resource bindings.
+
+Colophon's browser preview retains limitations: its body line box is 20px rather than native text measurement, and its shared focus outline and 160ms state transition do not reproduce the native system focus visual (`FocusVisualMargin=-3`) and 83ms background brush transition. Exact native rendering remains owned by WinUI, not this browser approximation.
+
+### Native ToggleSwitch, PersonPicture, and InfoBar references
+
+`ToggleSwitch` remains a **static track reference**, not a working switch, pending interactive renderer support. Keep one shared component rather than a gallery of static interaction states. The [native template](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/ToggleSwitch_themeresources.xaml) uses a 40x20 track, a 12x12 resting/disabled knob, a 14x14 pointer-over knob, and a 17x14 pressed knob. The full native control also owns its header, On/Off content, 12px track-to-content gap, 10px pre/post margins, and 154px minimum width; these are not part of the isolated track.
+
+On/Off movement is native `RepositionThemeAnimation` with a 20px endpoint displacement and template-calculated `KnobOnToOffOffset` / `KnobOffToOnOffset`. Pointer-over/pressed knob resizing uses `ControlFasterAnimationDuration` (83ms) and `ControlFastOutSlowInKeySpline` (0,0,0,1); disabled resizing uses `ControlNormalAnimationDuration` (250ms). Preserve WinUI's Dragging transitions and system animation settings rather than replacing them with the general motion guideline. The installed Colophon renderer cannot persist checked state, animate geometry, or express these transitions. The remaining reference does not prove animation, dragging, keyboard switching, or the on-knob `CircleElevationBorderBrush`.
+
+`Avatar` follows [DefaultPersonPictureStyle](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/PersonPicture/PersonPicture.xaml): 96x96 by default, a 1px ellipse stroke, `PersonPictureEllipseFillThemeBrush`, and semibold initials sized to `max(1, diameter * 0.42)`. At the default size this is 40.32px, not a 13px body label. `AvatarStates` also shows the native Contact (U+E77B) and People (U+E716) fallbacks. PersonPicture is non-interactive and has no hover/pressed states; an enclosing button owns those. Production 32px and 24px usages are size overrides, not the default. Native photo clipping, initials generation, badge layout, and `TextLineBounds=Tight` remain native behavior, not browser parity claims.
+
+`InfoBar` follows the [native template](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/InfoBar/InfoBar.xaml) and [resources](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/InfoBar/InfoBar_themeresources.xaml). `InfoBarStates` shows all four severities. Both the background and layered 16px icon change with severity. Titles are Body Strong and messages Body, both primary foreground, with 4px corners. The horizontal reference preserves 16px leading padding, 14px icon-to-text spacing, 14px text top offset, 12px title/message spacing, and 16px panel end margin. The 48px content grid plus two 1px borders produces a 50px outer height for a single-line banner.
+
+The close control is `InfoBarCloseButtonStyle` (based on `DefaultButtonStyle` with AppBarButton resource overrides), not SubtleButtonStyle: 38x38 with a 5px margin and a 16px Cancel glyph. Its preview has hover, pressed, disabled, and keyboard-focus visuals, but **does not dismiss the banner**. The installed renderer only supports opening an overlay on click. Native `IsOpen`, `IsClosable`, actions, `InfoBarPanel` responsive reflow, high-contrast 2px border thickness, and native glyph/text rasterization are not reproduced. The preview retains a 1px border in every theme and uses representative high-contrast system colors. These limits prevent a 1:1 native rendering claim; ship the stock controls and their resources, never these SVG/browser stand-ins.
+
 ## Do's and Don'ts
 
 Do:

From 5c7f9c3c1424aaa339cc9fa75ff15bfd70d13b87 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 14 Oct 2026 22:41:21 -0700
Subject: [PATCH 27/32] design(colophon): mirror current production chat
 surfaces

Align assistant and user messages, composer geometry, Fluent glyphs and translucent resource colors with production 9e4999c6. Preserve native/browser 120-DPI comparison evidence and document Mica, font and renderer limits instead of claiming pixel identity.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc              | 601 +++++--------------
 .agents/design/reference/chat-comparison.png | Bin 0 -> 58648 bytes
 DESIGN.md                                    | 135 ++++-
 3 files changed, 280 insertions(+), 456 deletions(-)
 create mode 100644 .agents/design/reference/chat-comparison.png

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 21293c095d..a097b5f206 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -539,7 +539,7 @@
     },
     {
       "name": "ComposerPicker",
-      "note": "Subtle inline dropdown. Ships as a WinUI subtle DropDownButton (a transparent Button that opens a flyout), NOT a bordered ComboBox and NOT a Fluent-web pill/segmented control. Shows the current value in `muted` secondary text (TextFillColorSecondary) with a trailing `muted` chevron (Segoe Fluent \\uE70D, previewed ~10px). 32px min height; horizontal padding token `2`, gap token `1`; `sm` radius = WinUI ControlCornerRadius (4px). It is a real `button` whose browser chrome is removed with `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border, and `control.focus` supplies the Windows accent focus rectangle instead of a web focus ring. Hover uses `subtleHover` (SubtleFillColorSecondary) and press uses `subtlePressed` (SubtleFillColorTertiary) through `states`, so the picker stays quiet in the composer toolbar and never competes with the primary Send action. When there is nothing to choose (for example the session picker with a single session) the picker is disabled and its value reads a shade lighter than the enabled muted text. Used for the model, reasoning-effort, and session selectors; `on.click` opens the picker flyout. Since #1459 the model picker is a native flyout with an AutoSuggestBox over a grouped, single-selection ListView, and the reasoning-effort picker is a native discrete slider with a compact gauge trigger (`ChatEffortGauge`, rendered with WinUI paths, not a font glyph) at narrow widths; a picker trigger value can tint with `ChatPickerAccentBrush`. The session selector stays a single-select flyout. ComposerPickerOptions is a representative shared option list because flyout targets take no props; the real per-picker option sets (sessions, models, effort levels) are supplied by the app and are a Reactor port note.",
+      "note": "ReactorChatComposer.PickerButton at production 9e4999c6: a native Button with toolbar resource overrides, not a ComboBox. Native label 13px, ChevronDown U+E70D at 12px, 4px label-to-chevron gap, 8px horizontal and 4px vertical padding, 32px minimum height, 4px corners and no border. ChatSecondaryTextBrush supplies rest text. Model and effort are right-aligned in Workspace; only standalone ChatWindow includes a session trigger. The browser opens a representative option list, not the production searchable model flyout or effort slider. Native label trimming, 44px compact targets and the narrow effort gauge remain port requirements.",
       "props": {
         "label": "Model"
       },
@@ -556,16 +556,17 @@
           "gap": "1",
           "padding": {
             "left": "2",
-            "right": "2"
+            "right": "2",
+            "top": "1",
+            "bottom": "1"
           },
           "align": "center",
           "height": 32,
           "width": "hug"
         },
         "appearance": {
-          "fontFamily": "body",
-          "textStyle": "small",
-          "color": "muted",
+          "textStyle": "chatPicker",
+          "color": "chatSecondary",
           "background": "$none",
           "radius": "sm"
         },
@@ -574,10 +575,10 @@
           "focus": { "kind": "outline", "color": "accent" }
         },
         "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" },
-          "disabled": { "color": "muted", "background": "$none" }
+          "hover": { "background": "subtleHover", "color": "subtleButtonHoverText" },
+          "pressed": { "background": "subtlePressed", "color": "subtleButtonPressedText" },
+          "hoverPressed": { "background": "subtlePressed", "color": "subtleButtonPressedText" },
+          "disabled": { "color": "disabledText", "background": "$none" }
         },
         "on": { "click": { "open": "ComposerPickerOptions" } },
         "children": [
@@ -590,30 +591,10 @@
           },
           {
             "id": "composer-picker-chevron",
-            "el": "svg",
-            "attrs": {
-              "width": "12",
-              "height": "12",
-              "viewBox": "0 0 24 24",
-              "fill": "none",
-              "aria-hidden": "true",
-              "stroke": "currentColor",
-              "stroke-width": "2",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            },
-            "appearance": {
-              "color": "muted"
-            },
-            "children": [
-              {
-                "id": "composer-picker-chevron-path",
-                "el": "path",
-                "attrs": {
-                  "d": "M6 9l6 6 6-6"
-                }
-              }
-            ]
+            "el": "span",
+            "attrs": { "aria-hidden": "true" },
+            "appearance": { "textStyle": "chatChevron" },
+            "children": [ "\uE70D" ]
           }
         ]
       }
@@ -663,11 +644,13 @@
     },
     {
       "name": "ChatBubble",
-      "note": "Assistant chat turn: a 36×36 avatar (subtle `surface` fill, hairline `controlLine` border, `pill` radius) to the LEFT of plain prose that flows in the reading column with NO bubble, card, border, or fill (#1459). The refreshed assistant turn is bubbleless: only the user's own message rides a soft bubble (see ChatThread), so the transcript reads like a document rather than facing chat cards. Prose binds `ChatTextBrush` (`ink`) at body type (14/21 in-app); top-level blocks use one uniform 16px gap (token 3). Inline code and fenced code still get their own `ChatCardBrush` surfaces with `ChatSecondaryTextBrush` code text and a `bubble` (12px) radius, and the Copy action confirms with a `ChatCopySuccessBrush` checkmark that announces Copied and resets after two seconds. Footer reads timestamp · usage · Copy · Read aloud — Copy and Read aloud are hover-gated 20×20 subtle icon buttons in-app, and usage is the used/context (pct%) string ChatUsageFormatter produces. Mirrors ReactorChatTimeline's assistant row; ships via Reactor. Reading column max-width 768px, 16px prose inset, and the avatar hiding below 960px are Reactor port notes (no token equivalent). (This previews the assistant variant; the user variant rides the softer `ChatUserBrush` bubble on the right.)",
+      "note": "Bubbleless assistant turn from ReactorChatTimeline and ChatMarkdownPresentation at production 9e4999c6. This reference shows the below-960px chat viewport variant without an avatar, at the 736px prose cap (768 minus two 16px insets). Native prose is 14/21, with 16px between blocks and 4px vertical content padding. The footer is sender, time, model and usage at 12/18, followed by 32x32 Copy and Read aloud controls with 14px Fluent glyphs. Copy is always visible. Read aloud previews the native 70% resting opacity through chatReadAloudText, returning to full alpha over the button; native row-level hover is not represented. Native avatars appear in a separate 44px gutter above the 960px breakpoint; do not replace the production logo with an invented sparkle. ChatTextBrush and ChatSecondaryTextBrush preserve alpha. The native source remains authoritative for Markdown, responsive layout, clipboard and speech behavior.",
       "props": {
+        "sender": "Assistant",
         "time": "2:14 PM",
+        "model": "browse",
         "usage": "12.5K/200K (6%)",
-        "children": "Paired to the gateway — 6 Windows node capabilities are live."
+        "children": "FIXTURE MAIN: the lighthouse is green."
       },
       "root": {
         "id": "chat-bubble-root",
@@ -675,58 +658,18 @@
         "layout": {
           "mode": "horizontal",
           "gap": "2",
-          "align": "start"
+          "align": "start",
+          "width": 736
         },
         "children": [
-          {
-            "id": "chat-bubble-avatar",
-            "el": "div",
-            "attrs": {
-              "aria-hidden": "true"
-            },
-            "layout": {
-              "mode": "horizontal",
-              "align": "center",
-              "justify": "center",
-              "width": 36,
-              "height": 36
-            },
-            "appearance": {
-              "background": "surface",
-              "borderColor": "controlLine",
-              "color": "muted",
-              "radius": "pill"
-            },
-            "children": [
-              {
-                "id": "chat-bubble-avatar-glyph",
-                "el": "svg",
-                "attrs": {
-                  "width": "18",
-                  "height": "18",
-                  "viewBox": "0 0 24 24",
-                  "fill": "currentColor",
-                  "aria-hidden": "true"
-                },
-                "children": [
-                  {
-                    "id": "chat-bubble-avatar-path",
-                    "el": "path",
-                    "attrs": {
-                      "d": "M12 2.5l1.7 5.1a4 4 0 0 0 2.7 2.7l5.1 1.7-5.1 1.7a4 4 0 0 0-2.7 2.7L12 21.5l-1.7-5.1a4 4 0 0 0-2.7-2.7L2.5 12l5.1-1.7a4 4 0 0 0 2.7-2.7L12 2.5z"
-                    }
-                  }
-                ]
-              }
-            ]
-          },
           {
             "id": "chat-bubble-stack",
             "el": "div",
             "layout": {
               "mode": "vertical",
               "gap": "1",
-              "align": "start"
+              "align": "start",
+              "grow": true
             },
             "children": [
               {
@@ -734,12 +677,13 @@
                 "el": "div",
                 "layout": {
                   "mode": "vertical",
-                  "gap": "3"
+                  "gap": "4",
+                  "padding": { "y": "1" },
+                  "width": "fill"
                 },
                 "appearance": {
-                  "fontFamily": "body",
-                  "textStyle": "body",
-                  "color": "ink"
+                  "textStyle": "chatProse",
+                  "color": "chatText"
                 },
                 "children": [
                   "{children}"
@@ -750,104 +694,32 @@
                 "el": "div",
                 "layout": {
                   "mode": "horizontal",
-                  "gap": "2",
-                  "padding": {
-                    "x": "2"
-                  },
+                  "gap": "1",
                   "align": "center"
                 },
+                "margin": { "top": "1" },
                 "appearance": {
-                  "fontFamily": "body",
-                  "textStyle": "caption",
-                  "color": "muted"
+                  "textStyle": "chatFooter",
+                  "color": "chatSecondary"
                 },
                 "children": [
                   {
-                    "id": "chat-bubble-time",
+                    "id": "chat-bubble-identity",
                     "el": "span",
+                    "margin": { "right": "1" },
                     "children": [
-                      "{time}"
-                    ]
-                  },
-                  {
-                    "id": "chat-bubble-dot",
-                    "el": "span",
-                    "attrs": {
-                      "aria-hidden": "true"
-                    },
-                    "children": [
-                      "·"
-                    ]
-                  },
-                  {
-                    "id": "chat-bubble-usage",
-                    "el": "span",
-                    "children": [
-                      "{usage}"
+                      "{sender} · {time} · {model} · {usage}"
                     ]
                   },
                   {
                     "id": "chat-bubble-copy",
-                    "el": "div",
-                    "attrs": {
-                      "role": "button",
-                      "title": "Copy",
-                      "aria-label": "Copy message"
-                    },
-                    "layout": {
-                      "mode": "horizontal",
-                      "align": "center",
-                      "justify": "center",
-                      "width": 20,
-                      "height": 20
-                    },
-                    "appearance": {
-                      "color": "muted",
-                      "radius": "sm"
-                    },
-                    "children": [
-                      {
-                        "id": "chat-bubble-copy-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "14",
-                          "height": "14",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-bubble-copy-rect",
-                            "el": "rect",
-                            "attrs": {
-                              "x": "9",
-                              "y": "9",
-                              "width": "11",
-                              "height": "11",
-                              "rx": "2"
-                            }
-                          },
-                          {
-                            "id": "chat-bubble-copy-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1"
-                            }
-                          }
-                        ]
-                      }
-                    ]
+                    "component": "ChatCopyButton"
                   },
                   {
                     "id": "chat-bubble-readaloud",
-                    "el": "div",
+                    "el": "button",
                     "attrs": {
-                      "role": "button",
+                      "type": "button",
                       "title": "Read aloud",
                       "aria-label": "Read message aloud"
                     },
@@ -855,44 +727,28 @@
                       "mode": "horizontal",
                       "align": "center",
                       "justify": "center",
-                      "width": 20,
-                      "height": 20
+                      "width": 32,
+                      "height": 32,
+                      "padding": "0"
                     },
                     "appearance": {
-                      "color": "muted",
+                      "color": "chatReadAloudText",
+                      "background": "$none",
                       "radius": "sm"
                     },
+                    "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                    "states": {
+                      "hover": { "background": "subtleHover", "color": "chatSecondary" },
+                      "pressed": { "background": "chatReadAloudPressed", "color": "chatSecondary" },
+                      "hoverPressed": { "background": "chatReadAloudPressed", "color": "chatSecondary" }
+                    },
                     "children": [
                       {
                         "id": "chat-bubble-readaloud-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "14",
-                          "height": "14",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-bubble-readaloud-poly",
-                            "el": "polygon",
-                            "attrs": {
-                              "points": "11 5 6 9 2 9 2 15 6 15 11 19 11 5"
-                            }
-                          },
-                          {
-                            "id": "chat-bubble-readaloud-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M15.5 8.5a5 5 0 0 1 0 7M19 5a9 9 0 0 1 0 14"
-                            }
-                          }
-                        ]
+                        "el": "span",
+                        "attrs": { "aria-hidden": "true" },
+                        "appearance": { "textStyle": "chatActionIcon" },
+                        "children": [ "\uE767" ]
                       }
                     ]
                   }
@@ -903,14 +759,38 @@
         ]
       }
     },
+    {
+      "name": "ChatUserBubble",
+      "note": "Sent user bubble from ReactorChatTimeline.BuildUser at production 9e4999c6. Native ChatUserBrush is the system accent at 8% in Light and 12% in Dark, not a solid blue card. Text uses ChatUserTextBrush (primary text; highlight text in HC), 14/21, with 16px horizontal and 12px vertical padding, no stroke and 12px corners. The native width is content-sized and capped at 720px. The shared 32px Copy action sits below with 8px of stack spacing plus the native 2px top and 4px trailing margin, preserving the measured 10px gap for a sent message. Hover-only native metadata and queued-message states are not reproduced by this sent-message reference.",
+      "props": { "children": "Can we browse the synthetic Gateway?" },
+      "root": {
+        "id": "chat-user-root",
+        "el": "div",
+        "layout": { "mode": "vertical", "gap": "2", "align": "end", "width": "hug" },
+        "children": [
+          {
+            "id": "chat-user-surface",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "2", "padding": { "x": "4", "y": "3" } },
+            "appearance": { "textStyle": "chatProse", "background": "chatUser", "color": "chatUserText", "radius": "bubble" },
+            "children": [ "{children}" ]
+          },
+          {
+            "id": "chat-user-copy",
+            "component": "ChatCopyButton",
+            "margin": { "top": "half", "right": "1" }
+          }
+        ]
+      }
+    },
     {
       "name": "ChatComposer",
-      "note": "Chat input. A rounded `control` panel (`composer` radius, 20px) with a hairline `controlLine` border wrapping a borderless, transparent, auto-growing textarea over a toolbar. In-app it binds `ChatComposerBrush` (card fill) over the transparent chat canvas and `ChatStrokeBrush` for the hairline; Send is the Fluent ChatSubmit up glyph (U+E74A) that swaps to Stop (U+E71A) during an active turn, and Add uses ChatAttach (U+E710) (#1459). Left cluster = Add, session picker, model picker, reasoning-effort picker; right cluster = Voice (mic) and the primary Send/Stop. Production exposes only Voice and Send/Stop on the right (no separate Speaker or Settings composer buttons; read-aloud and chat preferences live in Settings, per docs/CHAT_VISUAL_DESIGN.md). Only Send spends the accent (it swaps to a subtle Stop while a turn is active, and reads disabled/greyed until the textarea has content); every other control ships as a WinUI subtle transparent Button (SubtleFillColorTransparent rest, SubtleFillColorSecondary hover, SubtleFillColorTertiary press, ControlCornerRadius) with a `muted` (TextFillColorSecondary) glyph, so the toolbar reads as quiet chrome. Each picker (see ComposerPicker) is a subtle borderless dropdown with muted value text; a picker with nothing to choose (for example the session picker when only one session exists) renders disabled, so its label reads a shade lighter than its enabled neighbours, as with `Main session` in the preview. Textarea min 56 / max 200px growth and the 12px outer margin are Reactor port notes; the app tightens top padding to 2px below token 1. The subtle icon controls are real `button`s whose browser chrome is removed via `control.chrome:none`, so the transparent WinUI rest state (SubtleFillColorTransparent, `$none`) shows with no web button border; each carries `states` for hover (`subtleHover`) and press (`subtlePressed`) and a `control.focus` accent focus rectangle, and only the filled Send spends the accent. The message input renders as a borderless, typeable `contenteditable` `role=textbox` showing the muted placeholder; `control.chrome:none` removes the browser field chrome and its `:focus` ring, and `control.focus` (kind underline, color accent) substitutes the Windows bottom accent underline a real WinUI TextBox shows. The hairline `controlLine` border belongs to the outer `control` panel only. (Preview shows the rest state with the placeholder visible; click to type.)",
+      "note": "Workspace composer from ReactorChatComposer at production 9e4999c6, measured against the Release app and fixture Gateway. Reference width 768px, resting outer height 112px, 20px radius, 1px ChatStrokeBrush, native alpha-preserving ChatComposerBrush card fill. Inner padding is 16,12,16,8; input is at least 44px tall with 16px text and no padding, fill, border or accent underline, including focus. Stack gap 8px. Attach is the native paperclip U+E723, not Add. Workspace omits the session selector; model and effort align right before Voice and circular 32px Send. Toolbar glyphs are native 16px Segoe Fluent Icons. Preview contains a draft so Send is enabled; typing does not send, auto-grow, or update Send eligibility. Empty/disabled, Stop, narrow gauge, native flyouts and dynamic input behavior remain production responsibilities. At native widths <=560 effort uses a 44px gauge; the installed renderer cannot express that responsive switch. The reading cap, 40px/12px outer gutters and 12px vertical margin belong to the host, not this isolated writing-surface component.",
       "props": {
         "placeholder": "Message Assistant (Enter to send)",
-        "session": "Main session",
-        "model": "Claude Sonnet 5",
-        "effort": "Default"
+        "draft": "Draft for visual comparison",
+        "model": "Fixture Browse",
+        "effort": "off"
       },
       "root": {
         "id": "chat-composer-root",
@@ -918,41 +798,44 @@
         "layout": {
           "mode": "vertical",
           "gap": "2",
-          "padding": "2",
-          "width": "fill"
+          "padding": { "left": "4", "top": "3", "right": "4", "bottom": "2" },
+          "width": 768,
+          "height": 112
         },
-        "margin": "3",
         "appearance": {
-          "background": "control",
-          "borderColor": "controlLine",
+          "background": "chatSurface",
+          "borderColor": "chatStroke",
+          "borderWidth": 1,
           "radius": "composer"
         },
         "children": [
           {
             "id": "chat-composer-input",
-            "el": "div",
+            "el": "textarea",
             "attrs": {
-              "contenteditable": "true",
-              "role": "textbox",
-              "aria-multiline": "true",
-              "aria-label": "Message input"
+              "placeholder": "{placeholder}",
+              "aria-label": "Message input",
+              "rows": "2"
             },
             "layout": {
-              "padding": "2",
+              "padding": "0",
               "width": "fill",
-              "height": 56
+              "height": 44
             },
+            "margin": "0",
             "appearance": {
-              "fontFamily": "body",
-              "textStyle": "body",
-              "color": "muted"
+              "textStyle": "chatInput",
+              "color": "chatText",
+              "background": "$none",
+              "borderWidth": 0,
+              "radius": "$none"
             },
             "control": {
               "chrome": "none",
-              "focus": { "kind": "underline", "color": "accent" }
+              "focus": { "kind": "outline", "color": "chatCanvas" }
             },
             "children": [
-              "{placeholder}"
+              "{draft}"
             ]
           },
           {
@@ -980,18 +863,19 @@
                     "el": "button",
                     "attrs": {
                       "type": "button",
-                      "title": "Add context",
-                      "aria-label": "Add context"
+                      "title": "Attach",
+                      "aria-label": "Attach"
                     },
                     "layout": {
                       "mode": "horizontal",
                       "align": "center",
                       "justify": "center",
+                      "padding": "0",
                       "width": 32,
                       "height": 32
                     },
                     "appearance": {
-                      "color": "muted",
+                      "color": "chatSecondary",
                       "background": "$none",
                       "radius": "sm"
                     },
@@ -1007,50 +891,12 @@
                     "children": [
                       {
                         "id": "chat-composer-add-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "18",
-                          "height": "18",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-composer-add-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M12 5v14M5 12h14"
-                            }
-                          }
-                        ]
+                        "el": "span",
+                        "attrs": { "aria-hidden": "true" },
+                        "appearance": { "textStyle": "chatIcon" },
+                        "children": [ "\uE723" ]
                       }
                     ]
-                  },
-                  {
-                    "id": "chat-composer-session",
-                    "component": "ComposerPicker",
-                    "props": {
-                      "label": "{session}"
-                    }
-                  },
-                  {
-                    "id": "chat-composer-model",
-                    "component": "ComposerPicker",
-                    "props": {
-                      "label": "{model}"
-                    }
-                  },
-                  {
-                    "id": "chat-composer-effort",
-                    "component": "ComposerPicker",
-                    "props": {
-                      "label": "{effort}"
-                    }
                   }
                 ]
               },
@@ -1059,10 +905,19 @@
                 "el": "div",
                 "layout": {
                   "mode": "horizontal",
-                  "gap": "2",
+                  "gap": "1",
                   "align": "center"
                 },
                 "children": [
+                  {
+                    "id": "chat-composer-pickers",
+                    "el": "div",
+                    "layout": { "mode": "horizontal", "gap": "0", "align": "center" },
+                    "children": [
+                      { "id": "chat-composer-model", "component": "ComposerPicker", "props": { "label": "{model}" } },
+                      { "id": "chat-composer-effort", "component": "ComposerPicker", "props": { "label": "{effort}" } }
+                    ]
+                  },
                   {
                     "id": "chat-composer-mic",
                     "el": "button",
@@ -1075,11 +930,12 @@
                       "mode": "horizontal",
                       "align": "center",
                       "justify": "center",
+                      "padding": "0",
                       "width": 32,
                       "height": 32
                     },
                     "appearance": {
-                      "color": "muted",
+                      "color": "chatSecondary",
                       "background": "$none",
                       "radius": "sm"
                     },
@@ -1095,45 +951,16 @@
                     "children": [
                       {
                         "id": "chat-composer-mic-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "18",
-                          "height": "18",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-composer-mic-rect",
-                            "el": "rect",
-                            "attrs": {
-                              "x": "9",
-                              "y": "3",
-                              "width": "6",
-                              "height": "11",
-                              "rx": "3"
-                            }
-                          },
-                          {
-                            "id": "chat-composer-mic-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M5 11a7 7 0 0 0 14 0M12 18v3"
-                            }
-                          }
-                        ]
+                        "el": "span",
+                        "attrs": { "aria-hidden": "true" },
+                        "appearance": { "textStyle": "chatIcon" },
+                        "children": [ "\uE720" ]
                       }
                     ]
                   },
                   {
                     "id": "chat-composer-send",
                     "el": "button",
-                    "class": "ds-btn",
                     "attrs": {
                       "type": "button",
                       "title": "Send",
@@ -1143,38 +970,29 @@
                       "mode": "horizontal",
                       "align": "center",
                       "justify": "center",
+                      "padding": "0",
                       "width": 32,
                       "height": 32
                     },
                     "appearance": {
                       "background": "accent",
                       "color": "accentInk",
-                      "radius": "sm"
+                      "radius": "pill"
+                    },
+                    "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                    "states": {
+                      "hover": { "background": "chatActionHover" },
+                      "pressed": { "background": "chatActionPressed", "color": "chatActionPressedText" },
+                      "hoverPressed": { "background": "chatActionPressed", "color": "chatActionPressedText" },
+                      "disabled": { "background": "chatActionDisabled", "color": "chatActionDisabledText" }
                     },
                     "children": [
                       {
                         "id": "chat-composer-send-glyph",
-                        "el": "svg",
-                        "attrs": {
-                          "width": "18",
-                          "height": "18",
-                          "viewBox": "0 0 24 24",
-                          "fill": "none",
-                          "aria-hidden": "true",
-                          "stroke": "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-composer-send-path",
-                            "el": "path",
-                            "attrs": {
-                              "d": "M12 19V5M5 12l7-7 7 7"
-                            }
-                          }
-                        ]
+                        "el": "span",
+                        "attrs": { "aria-hidden": "true" },
+                        "appearance": { "textStyle": "chatIcon" },
+                        "children": [ "\uE74A" ]
                       }
                     ]
                   }
@@ -1187,15 +1005,17 @@
     },
     {
       "name": "ChatThread",
-      "note": "A short thread: the \"does chat hang together\" check — a user turn (softer `accentSubtle` bubble on the right, with a hover Copy) and a bubbleless assistant turn (avatar + plain prose + Copy / Read aloud / context-usage readout), then the composer. Only the user's own message rides a bubble; the assistant turn flows as plain prose in the reading column (#1459). In-app the user bubble binds `ChatUserBrush` (accent at low opacity) with `ChatUserTextBrush`, and the footer follows the refreshed model and reasoning-effort pickers. Thread max-width 768px and the user bubble cap 720px are Reactor port notes.",
+      "note": "Fixture-shaped composition of the shared ChatUserBubble, bubbleless ChatBubble and Workspace ChatComposer. The 848px reference frame includes two 40px host gutters around the 768px reading column; transcript prose has a further 16px inset. It paints the native content layer once, with transparent chat content and translucent card/user surfaces above it. Actual Mica depends on the desktop, activation and transparency settings, so the browser's neutral backplate is not an exact wallpaper-dependent Mica reproduction. Native timeline virtualization, anchored composer placement and responsive gutters remain host behavior.",
       "root": {
         "id": "chat-thread-root",
         "el": "div",
         "layout": {
           "mode": "vertical",
           "gap": "3",
-          "width": "fill"
+          "width": 848,
+          "padding": { "x": "chatGutter", "y": "4" }
         },
+        "appearance": { "background": "chatLayer" },
         "children": [
           {
             "id": "chat-thread-user",
@@ -1203,133 +1023,23 @@
             "layout": {
               "mode": "horizontal",
               "justify": "end",
-              "width": "fill"
+              "width": "fill",
+              "padding": { "x": "4" }
             },
             "children": [
               {
-                "id": "chat-thread-user-stack",
-                "el": "div",
-                "layout": {
-                  "mode": "vertical",
-                  "gap": "1",
-                  "align": "end"
-                },
-                "children": [
-                  {
-                    "id": "chat-thread-user-bubble",
-                    "el": "div",
-                    "layout": {
-                      "mode": "vertical",
-                      "padding": {
-                        "x": "4",
-                        "y": "3"
-                      }
-                    },
-                    "appearance": {
-                      "fontFamily": "body",
-                      "textStyle": "body",
-                      "background": "accentSubtle",
-                      "color": "accentInk",
-                      "radius": "bubble"
-                    },
-                    "children": [
-                      "Can you list the Windows node capabilities?"
-                    ]
-                  },
-                  {
-                    "id": "chat-thread-user-footer",
-                    "el": "div",
-                    "layout": {
-                      "mode": "horizontal",
-                      "gap": "2",
-                      "padding": {
-                        "x": "2"
-                      },
-                      "align": "center"
-                    },
-                    "appearance": {
-                      "fontFamily": "body",
-                      "textStyle": "caption",
-                      "color": "muted"
-                    },
-                    "children": [
-                      {
-                        "id": "chat-thread-user-time",
-                        "el": "span",
-                        "children": [
-                          "2:14 PM"
-                        ]
-                      },
-                      {
-                        "id": "chat-thread-user-copy",
-                        "el": "div",
-                        "attrs": {
-                          "role": "button",
-                          "title": "Copy",
-                          "aria-label": "Copy message"
-                        },
-                        "layout": {
-                          "mode": "horizontal",
-                          "align": "center",
-                          "justify": "center",
-                          "width": 20,
-                          "height": 20
-                        },
-                        "appearance": {
-                          "color": "muted",
-                          "radius": "sm"
-                        },
-                        "children": [
-                          {
-                            "id": "chat-thread-user-copy-glyph",
-                            "el": "svg",
-                            "attrs": {
-                              "width": "14",
-                              "height": "14",
-                              "viewBox": "0 0 24 24",
-                              "fill": "none",
-                              "aria-hidden": "true",
-                              "stroke": "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            },
-                            "children": [
-                              {
-                                "id": "chat-thread-user-copy-rect",
-                                "el": "rect",
-                                "attrs": {
-                                  "x": "9",
-                                  "y": "9",
-                                  "width": "11",
-                                  "height": "11",
-                                  "rx": "2"
-                                }
-                              },
-                              {
-                                "id": "chat-thread-user-copy-path",
-                                "el": "path",
-                                "attrs": {
-                                  "d": "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1"
-                                }
-                              }
-                            ]
-                          }
-                        ]
-                      }
-                    ]
-                  }
-                ]
+                "id": "chat-thread-user-bubble",
+                "component": "ChatUserBubble"
               }
             ]
           },
           {
             "id": "chat-thread-assistant",
             "component": "ChatBubble",
+            "margin": { "x": "4", "y": "3" },
             "props": {
-              "time": "2:14 PM",
-              "usage": "12.5K/200K (6%)",
-              "children": "Paired to the gateway — 6 capabilities are live, including system.run and clipboard access."
+              "time": "11:01 PM",
+              "usage": "200/128.0K (0%)"
             }
           },
           {
@@ -1341,7 +1051,7 @@
     },
     {
       "name": "ChatCopyButton",
-      "note": "Chat control. The quiet copy affordance on assistant messages and code blocks (ChatCopyButton). A 32x32 subtle button (token `8` square target) with 4px (`1`) padding and `sm` radius, sharing the composer toolbar's subtle state set: transparent rest (SubtleFillColorTransparent), hover SubtleFillColorSecondary (`subtleHover`), pressed SubtleFillColorTertiary (`subtlePressed`). Idle glyph is Segoe Fluent Copy (U+E8C8) in `ChatSecondaryTextBrush` (`muted`). On copy it flips to the CheckMark (U+E73E) in `ChatCopySuccessBrush` (`positive`), announces \"Copied\" through a polite live region, and resets after 2 seconds; a failure shows SystemFillColorCritical (`critical`). Previewed in the idle state.",
+      "note": "Shared native ChatCopyButton for user turns, assistant turns and code. 32x32 target, 4px padding, 4px corners, no border, and the 14px Segoe Fluent Copy glyph U+E8C8. Rest foreground is ChatSecondaryTextBrush. Native clipboard confirmation changes to Check U+E73E, announces Copied and resets after two seconds; clipboard behavior is not implemented by the preview. Hover, press, disabled and focus visuals are represented.",
       "root": {
         "id": "chat-copy-root",
         "el": "button",
@@ -1359,7 +1069,7 @@
           "height": 32
         },
         "appearance": {
-          "color": "muted",
+          "color": "chatSecondary",
           "background": "$none",
           "radius": "sm"
         },
@@ -1368,18 +1078,19 @@
           "focus": { "kind": "outline", "color": "accent" }
         },
         "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" }
+          "hover": { "background": "subtleHover", "color": "subtleButtonHoverText" },
+          "pressed": { "background": "subtlePressed", "color": "subtleButtonPressedText" },
+          "hoverPressed": { "background": "subtlePressed", "color": "subtleButtonPressedText" },
+          "disabled": { "background": "$none", "color": "disabledText" }
         },
         "children": [
           {
             "id": "chat-copy-glyph",
             "el": "span",
             "attrs": {
-              "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
+              "aria-hidden": "true"
             },
+            "appearance": { "textStyle": "chatActionIcon" },
             "children": [ "\uE8C8" ]
           }
         ]
diff --git a/.agents/design/reference/chat-comparison.png b/.agents/design/reference/chat-comparison.png
new file mode 100644
index 0000000000000000000000000000000000000000..dbc0c6b30711c5892a7c9735124ffafc1863eed1
GIT binary patch
literal 58648
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

literal 0
HcmV?d00001

diff --git a/DESIGN.md b/DESIGN.md
index d3067fa286..abe1546a8e 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -31,6 +31,21 @@ colors:
   disabledText: rgba(0,0,0,0.361)
   controlLine: "#ececec"
   accentSubtle: "#1a75c7"
+  chatLayer: "#ffffff80"
+  chatCanvas: "#ffffff00"
+  chatSurface: "#ffffffb3"
+  chatStroke: "#0000000f"
+  chatText: "#000000e4"
+  chatSecondary: "#0000009e"
+  chatReadAloudText: rgba(0,0,0,0.43372549)
+  chatUser: rgba(0,103,192,0.08)
+  chatUserText: "#000000e4"
+  chatActionDisabled: "#00000037"
+  chatActionDisabledText: "#ffffff"
+  chatActionHover: "#0067c0e6"
+  chatActionPressed: "#0067c0cc"
+  chatActionPressedText: "#ffffffb3"
+  chatReadAloudPressed: "#f9f9f94d"
   nativeText: "#000000e4"
   personPictureFill: "#00000018"
   personPictureStroke: "#0000000f"
@@ -131,7 +146,44 @@ typography:
     fontSize: 16px
     fontWeight: 400
     lineHeight: 16px
+  chatProse:
+    fontFamily: '"Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 14px
+    fontWeight: 400
+    lineHeight: 21px
+  chatInput:
+    fontFamily: '"Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 16px
+    fontWeight: 400
+    lineHeight: 22px
+  chatPicker:
+    fontFamily: '"Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 13px
+    fontWeight: 400
+    lineHeight: 18px
+  chatFooter:
+    fontFamily: '"Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 12px
+    fontWeight: 400
+    lineHeight: 18px
+  chatIcon:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 16px
+    fontWeight: 400
+    lineHeight: 16px
+  chatActionIcon:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 14px
+    fontWeight: 400
+    lineHeight: 14px
+  chatChevron:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 12px
+    fontWeight: 400
+    lineHeight: 12px
 spacing:
+  "0": 0px
+  half: 2px
   "1": 4px
   "2": 8px
   "3": 12px
@@ -148,6 +200,7 @@ spacing:
   buttonBottom: 6px
   infoTextTop: 14px
   infoIconGap: 14px
+  chatGutter: 40px
 rounded:
   sm: 4px
   md: 8px
@@ -180,6 +233,7 @@ x-colophon:
           - ComposerPicker
           - ComposerPickerOptions
           - ChatBubble
+          - ChatUserBubble
           - ChatComposer
           - ChatThread
           - ChatCopyButton
@@ -393,13 +447,13 @@ x-colophon:
         themes:
           dark: "#2d2d2d"
           highContrast: "#000000"
-        usage: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault (distinct from the Card surface used for cards/flyouts).
+        usage: Fill for stock input controls. The chat writing surface instead uses chatSurface and its inner editor is transparent.
       controlLine:
         resource: ControlStrokeColorDefaultBrush
         themes:
           dark: "#353535"
           highContrast: "#ffffff"
-        usage: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault (distinct from the Card/divider stroke used for cards).
+        usage: Border for stock input controls. Chat uses its alpha-preserving chatStroke; PersonPicture uses personPictureStroke.
       controlHover:
         resource: ControlFillColorSecondaryBrush
         themes:
@@ -423,7 +477,56 @@ x-colophon:
         themes:
           dark: "#47b6ef"
           highContrast: "#ffff00"
-        usage: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local ChatUserBrush (Windows accent at low opacity, for example SystemAccentColorLight2 at 12% on dark and SystemAccentColorDark1 at 8% on light, with the full system highlight in high contrast). AccentFillColorSecondary is the closest standard Fluent approximation for preview.
+        usage: Standard secondary accent fill retained for compatibility. Do not use it for chat bubbles; chatUser preserves the actual translucent ChatUserBrush.
+      chatLayer:
+        resource: NavigationViewContentBackground
+        themes: { dark: "#3a3a3a4c", highContrast: "#000000" }
+        usage: One LayerFillColorDefaultBrush content layer above Mica. Do not paint it again inside nested chat components.
+      chatCanvas:
+        resource: ChatCanvasBrush
+        themes: { dark: "#ffffff00", highContrast: "#000000" }
+      chatSurface:
+        resource: ChatComposerBrush
+        themes: { dark: "#ffffff0d", highContrast: "#000000" }
+        usage: CardBackgroundFillColorDefault with native alpha preserved. ChatCardBrush has the same values. Composite over the content layer, not the input-control fill.
+      chatStroke:
+        resource: ChatStrokeBrush
+        themes: { dark: "#ffffff12", highContrast: "#ffffff" }
+      chatText:
+        resource: ChatTextBrush
+        themes: { dark: "#ffffff", highContrast: "#ffffff" }
+      chatSecondary:
+        resource: ChatSecondaryTextBrush
+        themes: { dark: "#ffffffc5", highContrast: "#ffffff" }
+      chatReadAloudText:
+        resource: ChatSecondaryTextBrush
+        themes: { dark: "rgba(255,255,255,0.54078431)", highContrast: "rgba(255,255,255,0.7)" }
+        usage: Preview of the native Read aloud button at 70% opacity. Native code applies opacity to the control, not a separate brush. Pointer-over uses full chatSecondary; row-level hover is not expressible in this renderer.
+      chatUser:
+        resource: ChatUserBrush
+        themes: { dark: "rgba(76,194,255,0.12)", highContrast: "#ffff00" }
+        usage: SystemAccentColorDark1 at 8% in light, SystemAccentColorLight2 at 12% in dark, system highlight in HC. These preview swatches use the Windows blue accent, not an opaque AccentFillColorSecondary substitute.
+      chatUserText:
+        resource: ChatUserTextBrush
+        themes: { dark: "#ffffff", highContrast: "#000000" }
+      chatActionDisabled:
+        resource: AccentButtonBackgroundDisabled
+        themes: { dark: "#ffffff28", highContrast: "#000000" }
+      chatActionDisabledText:
+        resource: AccentButtonForegroundDisabled
+        themes: { dark: "#ffffff87", highContrast: "#808080" }
+      chatActionHover:
+        resource: AccentButtonBackgroundPointerOver
+        themes: { dark: "#4cc2ffe6", highContrast: "#ffff00" }
+      chatActionPressed:
+        resource: AccentButtonBackgroundPressed
+        themes: { dark: "#4cc2ffcc", highContrast: "#000000" }
+      chatActionPressedText:
+        resource: AccentButtonForegroundPressed
+        themes: { dark: "#00000080", highContrast: "#ffffff" }
+      chatReadAloudPressed:
+        resource: ControlFillColorTertiaryBrush
+        themes: { dark: "#ffffff08", highContrast: "#000000" }
       nativeText:
         resource: TextFillColorPrimaryBrush
         themes: { dark: "#ffffff", highContrast: "#ffffff" }
@@ -554,7 +657,7 @@ x-colophon:
         family: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
         weights:
           - 400
-        usage: Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Chat toolbar aliases (FluentIconCatalog) include ChatSubmit U+E74A (send, up glyph), ChatAttach U+E710 (add), ChevronDown U+E70D (picker chevron), and Stop U+E71A (cancel an active turn). Not for body text.
+        usage: Fluent icon glyphs (checkmarks, chevrons, action glyphs). Ships as WinUI FontIcon/SymbolIcon on SymbolThemeFontFamily (Segoe Fluent Icons); e.g. the selection CheckMark is glyph U+E73E. Current chat aliases are ChatSubmit U+E74A (up), ChatAttach U+E723 (paperclip), VoiceAct U+E720 (microphone), ChevronDown U+E70D and Stop U+E71A. Not for body text.
       scale:
         display:
           role: display
@@ -634,12 +737,13 @@ Personality: native, trustworthy, calm, precise.
 - **subtleHover** {colors.subtleHover}: Hover fill for subtle/transparent controls (icon buttons, inline pickers). Fluent SubtleFillColorSecondary (light #09000000).
 - **subtlePressed** {colors.subtlePressed}: Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000).
 - **SubtleButton states:** {colors.subtleButtonFill}, {colors.subtleButtonHoverFill}, {colors.subtleButtonPressedFill}, {colors.subtleButtonText}, {colors.subtleButtonHoverText}, {colors.subtleButtonPressedText}, {colors.subtleButtonDisabledText}, {colors.subtleButtonBorder}, {colors.subtleButtonHoverBorder}, and {colors.subtleButtonPressedBorder} bind the control-specific `SubtleButton*` resources. Fill and text alpha bytes come directly from WinUI. Hover/pressed borders are transparent only in the light/dark browser preview, where the background already covers the border area; painting the same translucent color twice would create an incorrect dark outline. Native resource bindings remain unchanged. Separate border and foreground roles preserve the native high-contrast overrides; the displayed high-contrast swatches represent this preview's black/white/yellow scheme, not fixed system colors.
-- **control** {colors.control}: Fill for input/entry controls (combo boxes, text fields, the chat composer). Fluent ControlFillColorDefault, distinct from the Card surface used for cards/flyouts.
+- **control** {colors.control}: Stock input-control fill. The chat writing surface uses `chatSurface`, not this resource; its inner editor stays transparent.
 - **controlHover** {colors.controlHover}: TextBox pointer-over fill, mapped to `ControlFillColorSecondaryBrush`.
 - **controlDisabled** {colors.controlDisabled}: Disabled input fill, mapped to `ControlFillColorDisabledBrush`.
 - **disabledText** {colors.disabledText}: Disabled input text, mapped to `TextFillColorDisabledBrush`.
-- **controlLine** {colors.controlLine}: Border for input/entry controls (combo boxes, text fields, composer, avatars). Fluent ControlStrokeColorDefault, distinct from the Card/divider stroke used for cards.
-- **accentSubtle** {colors.accentSubtle}: Softer accent fill for the user's own chat bubble. The chat surface binds the chat-local `ChatUserBrush` (Windows accent at low opacity), quieter than the full accent reserved for primary actions.
+- **controlLine** {colors.controlLine}: Border for stock input controls. Chat uses its alpha-preserving `chatStroke`; PersonPicture uses `personPictureStroke`.
+- **accentSubtle** {colors.accentSubtle}: Standard secondary accent fill retained for compatibility, not the chat bubble fill.
+- **Chat surfaces:** `chatLayer` maps the single native content layer; `chatCanvas` stays transparent outside HC; `chatSurface` and `chatStroke` retain the actual card and stroke alpha. `chatUser` is SystemAccentColorDark1 at 8% in light and SystemAccentColorLight2 at 12% in dark, with full system highlight in HC. `chatUserText` is primary text, not white-on-accent in light mode. `chatText` and `chatSecondary` also retain native alpha. Preview accent swatches use the Windows blue accent; native bindings follow the user's system palette.
 
 Colors are preview swatches only. Bind each color's mapped `resource` key (in `x-colophon.tokens.colors`) rather than the hex, so light, dark, and high-contrast themes stay correct. Never put gray text on a colored background.
 
@@ -663,7 +767,9 @@ Resource mappings are also recorded on `x-colophon.tokens.typography.scale` for
 
 **App-specific extension:** {typography.small} remains 13/18, Text Regular, for existing dense controls. It is not one of the named WinUI Gallery styles and has no invented resource mapping.
 
-Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E, and the chat toolbar uses ChatSubmit (U+E74A), ChatAttach (U+E710), ChevronDown (U+E70D), and Stop (U+E71A).
+Use Segoe UI Variable for text and Cascadia Mono (`x-colophon.tokens.typography.mono`) for commands, endpoints, tokens, and logs. Fluent icon glyphs use Segoe Fluent Icons (`x-colophon.tokens.typography.icon`); for example, the selection checkmark is glyph U+E73E, and the chat toolbar uses ChatSubmit (U+E74A), ChatAttach (U+E723, paperclip), VoiceAct (U+E720), ChevronDown (U+E70D), and Stop (U+E71A).
+
+Chat-local typography follows production rather than substituting the named Gallery styles: `chatProse` is 14/21, `chatInput` is 16px with a 22px browser line box, `chatPicker` is 13/18, and `chatFooter` is 12/18. Native text uses maximum-height line stacking and layout rounding. `chatIcon`, `chatActionIcon` and `chatChevron` are actual Segoe Fluent glyphs at 16, 14 and 12px respectively, not generic SVG approximations.
 
 ## Layout
 
@@ -694,8 +800,15 @@ The chat transcript and composer ship via Reactor and follow the native chat vis
 
 - **Semantic brushes.** Chat binds the chat-local resources in `Themes/ChatResources.xaml` (Default/Light/HighContrast), not raw palette hex: `ChatCanvasBrush` (transparent; system window in HC), `ChatComposerBrush` and `ChatCardBrush` (`CardBackgroundFillColorDefault`), `ChatStrokeBrush` (`ControlStrokeColorDefault`), `ChatTextBrush` (`TextFillColorPrimary`), `ChatSecondaryTextBrush` (`TextFillColorSecondary`, used for code text), `ChatUserBrush` (accent at low opacity for the user bubble), `ChatUserTextBrush` (`TextFillColorPrimary`), `ChatPickerAccentBrush` (accent variants for picker triggers), and `ChatCopySuccessBrush` (`SystemFillColorSuccess`).
 - **Surface layering.** The Hub title bar and expanded navigation pane reveal Mica; `NavigationViewContentBackground` supplies one content layer (`LayerFillColorDefaultBrush`; system window in HC). The chat canvas is transparent so it neither hides nor doubles that layer, and the composer and code cards use the card fill above it. The standalone chat window uses the same Mica plus one content layer.
-- **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px. The writing surface uses the `composer` (20px) radius, a 16px editor inset, and a 112px minimum height. Assistant turns are bubbleless: their prose flows in the reading column with no card or fill, so the transcript reads like a document. Only the user's own message and code blocks sit on a surface with the `bubble` (12px) radius. All spacing stays on the 4px grid.
-- **Footer controls.** One bottom row keeps Attach, session, model, effort, voice, and the primary Send/Stop. The model picker is a native flyout with an AutoSuggestBox over a grouped single-selection list. Effort uses a native discrete slider with a compact gauge trigger (a WinUI-path rendering, not a font glyph) at narrow widths. Copy actions confirm with a `ChatCopySuccessBrush` checkmark and announce Copied.
+- **Geometry.** The reading column is capped at 768px with a 16px prose inset; outer gutters are 12px below 640px and 40px above. The avatar is omitted below 960px; wider native layouts reserve a 44px gutter on each side of the prose. The writing surface has a 20px radius, 1px border, 112px minimum height and 16,12,16,8 inner padding. Its 16px TextBox has no padding, a 44px minimum height and 200px maximum height. Native focus and hover keep the editor fill and border transparent, with no accent underline. Assistant prose is bubbleless at 14/21, with 4px vertical padding and 16px block gaps. User messages have 16,12 padding, 12px corners and a 720px maximum width. The 2px user-footer offset is an intentional native half-grid value.
+- **Footer controls.** Workspace shows a leading paperclip and right-aligned model, effort, Voice and circular Send/Stop. Only standalone ChatWindow includes the session selector. Controls are 32px tall; icon targets are 32px square with 16px glyphs. Model/effort labels use 13px text, a 12px native chevron and 8,4 padding. Voice/Send have a 4px gap. The model flyout contains an AutoSuggestBox and grouped native list; effort uses a native discrete slider and changes to a 44px gauge trigger at widths <=560px. No fake session selector or separate speaker/settings actions belong in Workspace's composer.
+- **Message actions.** Copy is a shared 32px control with a 14px Fluent glyph and 4px padding, not a 20px generic SVG button. The assistant footer includes sender, time, model and usage at 12/18. Read aloud is 70% opaque at rest and fully opaque when the row is hovered. Native copy confirmation announces Copied; the browser reference does not implement clipboard or speech.
+
+The chat reference was reconciled against production commit `9e4999c6d43f166437afa204a556bd8ee9dbfcb2`, including `ChatVisuals.cs`, `ReactorChatComposer.cs`, `ReactorChatTimeline.cs`, `ChatMarkdownPresentation.cs`, `ChatCopyButton.cs`, `FluentIconCatalog.cs` and `Themes/ChatResources.xaml`. A separately built ARM64 Release app ran against the isolated synthetic Gateway at 120 DPI; native screenshots and UI Automation bounds cover light/dark, empty/drafted input and the wide avatar breakpoint. This is fixture proof, not live Gateway/provider proof.
+
+The [120-DPI comparison](.agents/design/reference/chat-comparison.png) preserves the unmodified native and browser composer pixels at the same scale. Both writing surfaces are 960x140 physical pixels (768x112 effective pixels), with 40x40 action targets and a 55px input height. User-footer spacing includes 8px of stack space plus its 2px top margin. Schema/expansion checks cover all 38 components; focused chat geometry and action-state checks cover all three preview themes.
+
+The Colophon catalog now uses the actual geometry, semantic alpha brushes and Fluent glyphs. It is **not a verified pixel-identical native renderer**: Mica is wallpaper/activation-dependent; this host's native UI Automation reports Segoe UI Variable while Chromium resolves the requested family to Segoe UI; and text rasterization/layout rounding differ. The installed schema also lacks responsive breakpoints, row-hover opacity, gradient elevation borders and native input/flyout behavior. Fixed-size references must not become production layout code. High-contrast preview swatches are resource simulations, not evidence of Windows HC mode.
 
 ## Workspace shell
 
@@ -718,7 +831,7 @@ Every interactive control documents its hover and pressed states; static control
 
 - **Basic controls.** Button (primary/standard/subtle), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control.
 - **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
-- **Chat.** ChatBubble, ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.
+- **Chat.** ChatBubble (assistant prose), ChatUserBubble (sent user message), ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.
 - **Settings.** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and the SettingsWindowShell host frame, ported from `OpenClaw.Tray.WinUI` pages and `HubWindow`.
 
 TextBox ships as the stock `Microsoft.UI.Xaml.Controls.TextBox`, as used by `DirectUrlBox` in `Pages/ConnectionPage.xaml`, not a custom control template. The Colophon preview uses 14px body text, 32px single-line height, `sm` corners, exact text-control padding, pointer-over and disabled resource tokens, and the accent focus underline. WinUI has no separate pressed background for the input itself; pressing enters its focused state. The browser preview approximates the native elevation border with `controlLine` and does not reproduce the native focused-fill transition or clear-button template.

From f50ac0dc7a5ae22495567e7a86cafc8e27f0a4f7 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 14 Oct 2026 22:55:16 -0700
Subject: [PATCH 28/32] design(colophon): add composer picker option hover
 states

Add token-bound row hover and pressed fills with rounded corners. Keep selection stable and replace the checkmark's overriding inline style with semantic typography. Document the existing high-contrast preview limitation.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 22 ++++++++++++++++++++--
 DESIGN.md                       |  2 ++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index a097b5f206..84252ec78b 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -601,7 +601,7 @@
     },
     {
       "name": "ComposerPickerOptions",
-      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with 12px (`lg`) overlay corners (ChatPickerFlyoutStyle, #1459) and `md` shadow. Each row reserves a leading glyph column; the selected row shows an `accent` Segoe Fluent Icons CheckMark (glyph U+E73E, WinUI SymbolThemeFontFamily selection glyph, not a radio dot) while unselected rows keep the column empty so labels stay aligned. The check glyph carries a font-family-only raw style because the icon font is outside the display/body/mono token set (documented as the `icon` typography family in design.json); color stays token-bound to `accent`. Selecting a row closes the flyout; reopening restores defaults. Because `on.click.open` targets take no props, this shows a representative model list; the real model picker (AutoSuggestBox over a grouped ListView) and the effort slider/gauge are supplied by the app and are a Reactor port note.",
+      "note": "Representative single-select flyout for the subtle composer pickers (model, session, reasoning-effort). Ships as a WinUI Flyout of RadioMenuItem rows on a `surface` (CardBackgroundFillColorDefault) sheet with 12px (`lg`) overlay corners (ChatPickerFlyoutStyle, #1459) and `md` shadow. Rows have 4px (`sm`) corners and full-row hover/pressed fills through `subtleHover`/`subtlePressed` (SubtleFillColorSecondary/Tertiary, the light/dark MenuFlyoutItem state resources). Pointer exit restores transparent fill without changing selection or geometry. Each row reserves a 16px leading glyph column; the selected row keeps its `accent` Segoe Fluent Icons CheckMark (U+E73E), not a radio dot. The check uses the existing 12px Fluent-glyph typography token, without raw style overriding its width or color. High-contrast subtle fills remain transparent under the current token contract; native MenuFlyout system-highlight overrides are not reproduced. This preview retains a representative checked row, not persistent model selection. Because `on.click.open` targets take no props, all triggers show the same representative model list; the searchable model flyout and effort slider/gauge remain app behavior.",
       "root": {
         "id": "composer-picker-options",
         "el": "div",
@@ -614,8 +614,14 @@
             "el": "label",
             "attrs": { "role": "menuitemradio", "aria-checked": "true" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "appearance": { "background": "$none", "radius": "sm" },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
             "children": [
-              { "id": "composer-option-sonnet-check", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif" }, "layout": { "width": 16 }, "appearance": { "color": "accent", "textAlign": "center" }, "children": ["\uE73E"] },
+              { "id": "composer-option-sonnet-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 }, "appearance": { "textStyle": "chatChevron", "color": "accent", "textAlign": "center" }, "children": ["\uE73E"] },
               "Claude Sonnet 5"
             ]
           },
@@ -624,6 +630,12 @@
             "el": "label",
             "attrs": { "role": "menuitemradio", "aria-checked": "false" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "appearance": { "background": "$none", "radius": "sm" },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
             "children": [
               { "id": "composer-option-opus-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 } },
               "Claude Opus 4.8"
@@ -634,6 +646,12 @@
             "el": "label",
             "attrs": { "role": "menuitemradio", "aria-checked": "false" },
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "padding": { "x": "2", "y": "1" } },
+            "appearance": { "background": "$none", "radius": "sm" },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
             "children": [
               { "id": "composer-option-gpt-check", "el": "span", "attrs": { "aria-hidden": "true" }, "layout": { "width": 16 } },
               "GPT-5.6"
diff --git a/DESIGN.md b/DESIGN.md
index abe1546a8e..e12035fdda 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -829,6 +829,8 @@ The catalog is organized into four families. Colophon's left navigation includes
 
 Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
 
+ComposerPickerOptions rows use full-row `subtleHover` and `subtlePressed` fills with `sm` corners, both in the catalog and in opened composer flyouts. Pointer exit restores transparency; hover never changes the checked row, accent checkmark or layout. These tokens stay transparent in high contrast, so the preview does not reproduce native MenuFlyout system-highlight overrides.
+
 - **Basic controls.** Button (primary/standard/subtle), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control.
 - **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
 - **Chat.** ChatBubble (assistant prose), ChatUserBubble (sent user message), ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.

From db53e87ba3fbe0ac371abd65cf259e7b89b3461e Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Thu, 15 Oct 2026 11:40:42 -0700
Subject: [PATCH 29/32] design(colophon): animate toggle and mirror production
 workspace

Add instance-local ToggleSwitch interactions and native motion. Reconcile WorkspaceShell artwork, pane and button geometry, identity footer, and disconnected content with production.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 1099 +++++++++++++++++++++----------
 DESIGN.md                       |   42 +-
 2 files changed, 790 insertions(+), 351 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 84252ec78b..994cd198a7 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -226,13 +226,17 @@
       "name": "SubtleButton",
       "note": "Basic control. Default WinUI SubtleButtonStyle, not the workspace's fixed-size icon variant. Uses native ButtonPadding 11,5,11,6 (left, top, right, bottom), a retained 1px ButtonBorderThemeThickness, sm (4px) ControlCornerRadius, and normal-weight 14px text. Width and height follow content; the style itself sets no 40x40 dimensions. Background, border, and foreground bind SubtleButton-specific normal, pointer-over, pressed, and disabled resources, including high-contrast overrides. Preview hover/pressed border tokens are transparent in light/dark: CSS paints the fill under the border, so adding the translucent native border again would produce an incorrect dark rim. High-contrast borders and keyboard focus remain visible. Disabled fill and border resolve to the same values as rest; disabled text uses TextFillColorDisabledBrush, not muted. Port with Style={StaticResource SubtleButtonStyle}, leaving the native template intact rather than copying the browser border compensation. Browser limitations: body uses a 20px line box; native system focus (FocusVisualMargin=-3) and the 83ms background transition are not reproduced by Colophon's shared renderer. Workspace icon sizing and padding overrides belong to usage variants.",
       "props": {
-        "label": "Subtle button"
+        "label": "Subtle button",
+        "accessibleName": "Subtle button",
+        "disabled": "false"
       },
       "root": {
         "id": "subtle-button-root",
         "el": "button",
         "attrs": {
-          "type": "button"
+          "type": "button",
+          "aria-label": "{accessibleName}",
+          "aria-disabled": "{disabled}"
         },
         "layout": {
           "mode": "horizontal",
@@ -316,43 +320,79 @@
     },
     {
       "name": "ToggleSwitch",
-      "note": "Basic control. Static WinUI ToggleSwitch track reference, shown On for the existing settings composition pending interactive renderer support. Native geometry is 40x20 with a 12x12 resting knob, 14x14 pointer-over knob, and 17x14 pressed knob. Props describe a frozen snapshot, not live state. Colophon cannot persist checked state or animate geometry, so this is an image rather than a misleading non-working switch button. Native On/Off uses RepositionThemeAnimation with 20px travel; resizing uses 83ms and spline 0,0,0,1, except Disabled at 250ms. Full header/content layout, dragging, focus, keyboard switching, and CircleElevationBorderBrush remain native behavior. See DESIGN.md for bindings and limitations.",
+      "note": "Basic control. Interactive WinUI ToggleSwitch track reference, initially On. Each instance owns its checked state; click, Space, and Enter toggle it without saving to the design file. Native geometry is 40x20 with a 12x12 resting/disabled knob, 14x14 pointer-over knob, and 17x14 pressed knob. The carrier travels 20px in 367ms with the WinUI reposition reference spline 0.1,0.9,0.2,1. Independent thumb resizing uses 83ms and spline 0,0,0,1, or 250ms when disabled. Reduced motion suppresses transitions. Knob placement preserves the native half-pixel margins and pressed endpoint alignment. disabled=\"true\" prevents interaction. Full header/content layout, dragging, native focus visuals, and CircleElevationBorderBrush remain native behavior. Requires Colophon persistent-state/geometry support. See DESIGN.md for bindings and limitations.",
       "props": {
-        "label": "On, normal. Static ToggleSwitch reference.",
-        "trackFill": "accent",
-        "trackStroke": "toggleOnStroke",
-        "knobFill": "accentInk",
-        "knobX": 23.5,
-        "knobY": 4,
-        "knobWidth": 12,
-        "knobHeight": 12
+        "label": "Enable feature",
+        "disabled": "false"
       },
       "root": {
         "id": "toggle-switch-root",
-        "el": "svg",
+        "el": "button",
         "attrs": {
-          "viewBox": "0 0 40 20",
-          "width": 40,
-          "height": 20,
-          "role": "img",
-          "aria-label": "{label}"
-        },
-        "layout": { "width": 40, "height": 20 },
+          "type": "button",
+          "role": "switch",
+          "aria-label": "{label}",
+          "aria-disabled": "{disabled}"
+        },
+        "state": { "checked": true },
+        "on": { "click": { "toggle": "checked" } },
+        "layout": { "mode": "freeform", "width": 40, "height": 20, "padding": "0" },
+        "appearance": { "background": "$none", "borderColor": "$none", "borderWidth": 0, "radius": "pill" },
+        "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
         "children": [
           {
             "id": "toggle-switch-track",
-            "el": "rect",
-            "attrs": { "width": 40, "height": 20, "rx": 10, "fill": "var(--color-{trackFill})" }
-          },
-          {
-            "id": "toggle-switch-stroke",
-            "el": "rect",
-            "attrs": { "x": 0.5, "y": 0.5, "width": 39, "height": 19, "rx": 9.5, "fill": "none", "stroke": "var(--color-{trackStroke})", "stroke-width": 1 }
+            "el": "span",
+            "attrs": { "aria-hidden": "true" },
+            "position": { "mode": "absolute", "x": 0, "y": 0 },
+            "layout": { "width": 40, "height": 20 },
+            "appearance": { "background": "toggleOffFill", "borderColor": "toggleOffStroke", "borderWidth": 1, "radius": "pill" },
+            "transitions": [{ "properties": ["background-color", "border-color"], "duration": 83, "easing": "linear" }],
+            "states": {
+              "hover": { "background": "toggleOffHoverFill", "borderColor": "toggleOffHotStroke" },
+              "pressed": { "background": "toggleOffPressedFill", "borderColor": "toggleOffHotStroke" },
+              "disabled": { "background": "toggleOffDisabledFill", "borderColor": "toggleDisabledStroke" }
+            },
+            "when": [
+              { "state": { "checked": true }, "style": { "background": "accent", "borderColor": "toggleOnStroke", "transitions": [] } },
+              { "state": { "checked": true }, "interaction": "hover", "style": { "background": "toggleOnHoverFill", "borderColor": "toggleOnHotStroke" } },
+              { "state": { "checked": true }, "interaction": "pressed", "style": { "background": "toggleOnPressedFill", "borderColor": "toggleOnHotStroke" } },
+              { "state": { "checked": true }, "interaction": "disabled", "style": { "background": "toggleOnDisabledFill", "borderColor": "toggleOnDisabledStroke" } }
+            ]
           },
           {
-            "id": "toggle-switch-thumb",
-            "el": "rect",
-            "attrs": { "x": "{knobX}", "y": "{knobY}", "width": "{knobWidth}", "height": "{knobHeight}", "rx": 7, "fill": "var(--color-{knobFill})" }
+            "id": "toggle-switch-carrier",
+            "el": "span",
+            "attrs": { "aria-hidden": "true" },
+            "position": { "mode": "absolute", "x": -0.5, "y": 0 },
+            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 20, "height": 20 },
+            "geometry": { "translateX": 0 },
+            "transitions": [{ "properties": ["translate"], "duration": 367, "easing": [0.1, 0.9, 0.2, 1] }],
+            "when": [{ "state": { "checked": true }, "style": { "geometry": { "translateX": 20 } } }],
+            "children": [
+              {
+                "id": "toggle-switch-thumb",
+                "el": "span",
+                "layout": { "width": 12, "height": 12 },
+                "appearance": { "background": "toggleOffKnob", "radius": "pill" },
+                "geometry": { "translateX": 0 },
+                "transitions": [{ "properties": ["width", "height"], "duration": 83, "easing": [0, 0, 0, 1] }],
+                "states": {
+                  "hover": { "background": "toggleOffHotKnob", "geometry": { "width": 14, "height": 14 } },
+                  "pressed": { "background": "toggleOffHotKnob", "geometry": { "width": 17, "height": 14, "translateX": 2 } },
+                  "disabled": {
+                    "background": "disabledText",
+                    "transitions": [{ "properties": ["width", "height"], "duration": 250, "easing": [0, 0, 0, 1] }]
+                  }
+                },
+                "when": [
+                  { "state": { "checked": true }, "style": { "background": "accentInk" } },
+                  { "state": { "checked": true }, "interaction": "hover", "style": { "background": "toggleOnHotKnob" } },
+                  { "state": { "checked": true }, "interaction": "pressed", "style": { "background": "toggleOnHotKnob", "geometry": { "translateX": -1 } } },
+                  { "state": { "checked": true }, "interaction": "disabled", "style": { "background": "toggleOnDisabledKnob" } }
+                ]
+              }
+            ]
           }
         ]
       }
@@ -1274,10 +1314,11 @@
     },
     {
       "name": "UserIdentityBadge",
-      "note": "Owner / account identity from the Workspace PaneFooter (Windows/WorkspaceWindow.xaml #1541), and the sibling of AgentIdentityBadge: a 24px PersonPicture avatar to the LEFT of a two-line stack, the display name in body type over a connection-status line. Unlike AgentIdentityBadge, the status line pairs a small connection status dot with the caption `muted` label, dot on the LEFT of the status text. Reads the authenticated users.self profile (display name plus a live connection-status subtitle) with an honest Owner / Disconnected fallback; it never encodes authorization state. The dot follows connection state like the ConnectionStatusFlyout dots (`positive` connected, `warning` attention, `critical` error, `muted` unknown), never color alone. Ships as a subtle transparent WinUI Button that opens the Owner MenuFlyout: SubtleFillColorTransparent rest via `control.chrome:none`, `subtleHover`/`subtlePressed` through `states`, and a `control.focus` accent focus rectangle. In-app the avatar is a real PersonPicture (initials or account photo), previewed here with a person glyph.",
+      "note": "Production OwnerButton from WorkspaceWindow.xaml at dc9f6345821075362580bd598cc32e4f2aa6a18a. Native SubtleButtonStyle with 8px padding, 1px border, a 24px PersonPicture, 12px column spacing, and a 10px status dot followed by a 4px gap and Caption text. PersonPicture uses its native brush tokens and Contact glyph at 24 * 0.42 = 10.08px, not a generic outlined SVG. The statusTone prop represents the connection state, never authorization. The shared preview preserves hover/pressed/disabled/focus visuals; the native Owner MenuFlyout is not executed.",
       "props": {
         "name": "Ada Lovelace",
-        "status": "Connected"
+        "status": "Connected",
+        "statusTone": "positive"
       },
       "root": {
         "id": "user-badge-root",
@@ -1291,12 +1332,18 @@
           "mode": "horizontal",
           "gap": "3",
           "align": "center",
-          "padding": "1",
+          "padding": "2",
           "width": "fill"
         },
         "appearance": {
-          "background": "$none",
-          "radius": "sm"
+          "fontFamily": "body",
+          "textStyle": "body",
+          "color": "subtleButtonText",
+          "background": "subtleButtonFill",
+          "borderColor": "subtleButtonBorder",
+          "borderWidth": 1,
+          "radius": "sm",
+          "textAlign": "left"
         },
         "control": {
           "chrome": "none",
@@ -1307,70 +1354,41 @@
         },
         "states": {
           "hover": {
-            "background": "subtleHover"
+            "color": "subtleButtonHoverText",
+            "background": "subtleButtonHoverFill",
+            "borderColor": "subtleButtonHoverBorder"
           },
           "pressed": {
-            "background": "subtlePressed"
+            "color": "subtleButtonPressedText",
+            "background": "subtleButtonPressedFill",
+            "borderColor": "subtleButtonPressedBorder"
           },
           "hoverPressed": {
-            "background": "subtlePressed"
+            "color": "subtleButtonPressedText",
+            "background": "subtleButtonPressedFill",
+            "borderColor": "subtleButtonPressedBorder"
+          },
+          "disabled": {
+            "color": "subtleButtonDisabledText",
+            "background": "subtleButtonFill",
+            "borderColor": "subtleButtonBorder"
           }
         },
         "children": [
           {
             "id": "user-badge-avatar",
-            "el": "div",
-            "attrs": {
-              "aria-hidden": "true"
+            "component": "Avatar",
+            "props": {
+              "initials": "",
+              "name": "{name}"
             },
             "layout": {
-              "mode": "horizontal",
-              "align": "center",
-              "justify": "center",
               "width": 24,
               "height": 24
             },
             "appearance": {
-              "background": "surface",
-              "borderColor": "controlLine",
-              "color": "muted",
-              "radius": "pill"
-            },
-            "children": [
-              {
-                "id": "user-badge-avatar-glyph",
-                "el": "svg",
-                "attrs": {
-                  "width": "14",
-                  "height": "14",
-                  "viewBox": "0 0 24 24",
-                  "fill": "none",
-                  "stroke": "currentColor",
-                  "stroke-width": "2",
-                  "stroke-linecap": "round",
-                  "stroke-linejoin": "round",
-                  "aria-hidden": "true"
-                },
-                "children": [
-                  {
-                    "id": "user-badge-avatar-head",
-                    "el": "circle",
-                    "attrs": {
-                      "cx": "12",
-                      "cy": "8",
-                      "r": "4"
-                    }
-                  },
-                  {
-                    "id": "user-badge-avatar-body",
-                    "el": "path",
-                    "attrs": {
-                      "d": "M4 20a8 8 0 0 1 16 0"
-                    }
-                  }
-                ]
-              }
-            ]
+              "textStyle": "workspacePerson"
+            }
           },
           {
             "id": "user-badge-text",
@@ -1405,19 +1423,30 @@
                 "children": [
                   {
                     "id": "user-badge-status-dot",
-                    "el": "span",
+                    "el": "svg",
                     "attrs": {
+                      "viewBox": "0 0 10 10",
+                      "width": 10,
+                      "height": 10,
                       "aria-hidden": "true"
                     },
                     "layout": {
                       "mode": "horizontal",
-                      "width": 8,
-                      "height": 8
+                      "width": 10,
+                      "height": 10
                     },
-                    "appearance": {
-                      "background": "positive",
-                      "radius": "pill"
-                    }
+                    "children": [
+                      {
+                        "id": "user-badge-status-fill",
+                        "el": "circle",
+                        "attrs": {
+                          "cx": 5,
+                          "cy": 5,
+                          "r": 5,
+                          "fill": "var(--color-{statusTone})"
+                        }
+                      }
+                    ]
                   },
                   {
                     "id": "user-badge-status-label",
@@ -1439,6 +1468,7 @@
         ]
       }
     },
+
     {
       "name": "ConnectionStatusFlyout",
       "note": "Gateway/Operator/Node status flyout from Controls/GatewayStatusContent.xaml (#1541), opened from the Workspace connection affordance. A 304px column of three status rows split by 1px `line` (CardStrokeColorDefault) dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail; a trailing accent HyperlinkButton (Reconnect / Approve) appears only when that layer needs action. The dot binds the Fluent system fill that matches state: `positive` (SystemFillColorSuccess) connected, `warning` (SystemFillColorCaution) attention, `critical` (SystemFillColorCritical) error, `muted` (SystemFillColorNeutral) unknown. Row vertical padding 10px maps to token 2; column spacing 11px to token 3. The flyout sheet, `md` overlay radius and shadow are supplied by the WinUI Flyout presenter; previewed here as a `surface` sheet.",
@@ -2065,10 +2095,12 @@
     },
     {
       "name": "WorkspaceShell",
-      "note": "The native Home and Sessions workspace shell from Windows/WorkspaceWindow.xaml (#1541): the landing window. A Mica window (previewed as `paper`) with a title bar, a 256px left NavigationView pane, and a content host that mounts the Reactor chat (see ChatThread). The pane stacks a Back/Forward toolbar and an assistant selector (transparent ComboBox over AgentIdentityBadge; a New agent option adds `add` glyph U+E710) in the PaneHeader; a Home item and a Sessions header with an inline add button, then reusable session rows, in the menu; and an Owner button plus a Notifications bell (with an InfoBadge count and the NotificationFlyout) in the PaneFooter. The Owner button reads the authenticated users.self profile (display name over a live connection-status caption, honest Owner / Disconnected fallback). Selection is single across the pane like a NavigationView: exactly one destination (Home or a session) is selected at a time (shown here on Home), using the native subtle selection background with a leading `accent` indicator; nav rows use `sm` (ControlCornerRadius) corners. Toolbar/selector/footer subtle buttons are transparent with `subtleHover`/`subtlePressed` states. Pane hide/reopen, exact-key Back/Forward history, and Owner MenuFlyout live in WorkspaceWindow/WindowManager and are port notes.",
+      "note": "Production-derived expanded workspace at dc9f6345821075362580bd598cc32e4f2aa6a18a, showing the supplied screenshot's no-agent/no-session/error state. TitleBar is 32px; NavigationView is 256px. CollapsePaneButton is a separate 40x40 SubtleButton at (4,8), with native U+E90C; Back/Forward align to the right at 40px high and 8px apart, disabled with no history. Selector padding is 4,8,28,8 and its chevron is U+E70D. Home uses the original Chat.svg at 22px in a 24px column, 16px before the label. Session add and Notifications are 40x36, not 32px or 40px squares. Footer uses margin 4,8,4,8, a 4px gap, the shared Owner badge and original Notifications.svg at 20px with an InfoBadge. Artwork data URLs are exact bytes from production, not new theme colors. Caption buttons and red-bot title image mirror native chrome. Layout is measured in effective pixels; 852px is the supplied screenshot's client height at 125% scale. Native Mica tint, text rasterization, OS caption actions, pane collapse/reopen and navigation are not executed by this browser reference. The pane button has real hover/pressed/focus visuals, but remains a documented native action rather than an inaccessible width-only collapse. Production closes the pane entirely and exposes a 56px ReopenPaneSlot.",
       "props": {
-        "owner": "Fixture Owner",
-        "status": "Connected"
+        "owner": "Owner",
+        "status": "Error",
+        "statusTone": "critical",
+        "notifications": "1"
       },
       "root": {
         "id": "workspace-root",
@@ -2076,11 +2108,11 @@
         "layout": {
           "mode": "vertical",
           "width": "fill",
-          "height": 560
+          "height": 852
         },
         "appearance": {
           "background": "paper",
-          "color": "ink"
+          "color": "nativeText"
         },
         "children": [
           {
@@ -2089,24 +2121,117 @@
             "layout": {
               "mode": "horizontal",
               "align": "center",
-              "gap": "2",
-              "padding": {
-                "x": "3",
-                "y": "2"
-              },
-              "width": "fill"
+              "width": "fill",
+              "height": 32
             },
             "children": [
               {
-                "id": "workspace-title",
+                "id": "workspace-title-leading",
                 "el": "span",
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "gap": "4",
+                  "grow": true,
+                  "padding": {
+                    "left": "4"
+                  }
+                },
+                "children": [
+                  {
+                    "id": "workspace-title-icon",
+                    "el": "img",
+                    "layout": {
+                      "width": 16,
+                      "height": 16
+                    },
+                    "attrs": {
+                      "src": "data:image/png;base64,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",
+                      "alt": "",
+                      "aria-hidden": "true"
+                    }
+                  },
+                  {
+                    "id": "workspace-title",
+                    "el": "span",
+                    "layout": {
+                      "mode": "horizontal",
+                      "align": "center"
+                    },
+                    "appearance": {
+                      "textStyle": "workspaceTitle",
+                      "color": "nativeText"
+                    },
+                    "children": [
+                      "OpenClaw"
+                    ]
+                  }
+                ]
+              },
+              {
+                "id": "workspace-caption-minimize",
+                "el": "span",
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "justify": "center",
+                  "width": 46,
+                  "height": 32
+                },
+                "attrs": {
+                  "role": "img",
+                  "aria-label": "Minimize (native window chrome)"
+                },
                 "appearance": {
-                  "fontFamily": "body",
-                  "textStyle": "caption",
-                  "color": "muted"
+                  "textStyle": "workspaceCaption",
+                  "color": "nativeText"
+                },
+                "children": [
+                  ""
+                ]
+              },
+              {
+                "id": "workspace-caption-maximize",
+                "el": "span",
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "justify": "center",
+                  "width": 46,
+                  "height": 32
+                },
+                "attrs": {
+                  "role": "img",
+                  "aria-label": "Maximize (native window chrome)"
+                },
+                "appearance": {
+                  "textStyle": "workspaceCaption",
+                  "color": "nativeText"
+                },
+                "children": [
+                  ""
+                ]
+              },
+              {
+                "id": "workspace-caption-close",
+                "el": "span",
+                "layout": {
+                  "mode": "horizontal",
+                  "align": "center",
+                  "justify": "center",
+                  "width": 46,
+                  "height": 32
+                },
+                "attrs": {
+                  "role": "img",
+                  "aria-label": "Close (native window chrome)"
+                },
+                "appearance": {
+                  "textStyle": "workspaceCaption",
+                  "color": "nativeText"
                 },
                 "children": [
-                  "OpenClaw"
+                  ""
                 ]
               }
             ]
@@ -2125,14 +2250,9 @@
                 "el": "nav",
                 "layout": {
                   "mode": "vertical",
-                  "gap": "3",
-                  "padding": "2",
                   "width": 256,
                   "height": "fill"
                 },
-                "appearance": {
-                  "borderColor": "line"
-                },
                 "children": [
                   {
                     "id": "workspace-pane-header",
@@ -2140,7 +2260,11 @@
                     "layout": {
                       "mode": "vertical",
                       "gap": "2",
-                      "width": "fill"
+                      "width": "fill",
+                      "padding": {
+                        "x": "1",
+                        "y": "2"
+                      }
                     },
                     "children": [
                       {
@@ -2148,122 +2272,172 @@
                         "el": "div",
                         "layout": {
                           "mode": "horizontal",
-                          "gap": "2",
-                          "justify": "end",
-                          "width": "fill"
+                          "align": "center",
+                          "width": "fill",
+                          "height": 40
                         },
                         "children": [
                           {
-                            "id": "workspace-back",
-                            "el": "div",
-                            "attrs": {
-                              "role": "button",
-                              "aria-label": "Back"
+                            "id": "workspace-collapse",
+                            "component": "SubtleButton",
+                            "props": {
+                              "label": "",
+                              "accessibleName": "Toggle navigation pane",
+                              "disabled": "false"
                             },
                             "layout": {
-                              "mode": "horizontal",
-                              "align": "center",
-                              "justify": "center",
                               "width": 40,
                               "height": 40
                             },
                             "appearance": {
-                              "color": "muted",
-                              "radius": "sm"
-                            },
-                            "children": [
-                              {
-                                "id": "workspace-back-glyph",
-                                "el": "svg",
-                                "attrs": {
-                                  "width": "16",
-                                  "height": "16",
-                                  "viewBox": "0 0 24 24",
-                                  "fill": "none",
-                                  "stroke": "currentColor",
-                                  "stroke-width": "2",
-                                  "stroke-linecap": "round",
-                                  "stroke-linejoin": "round",
-                                  "aria-hidden": "true"
-                                },
-                                "children": [
-                                  {
-                                    "id": "workspace-back-path",
-                                    "el": "path",
-                                    "attrs": {
-                                      "d": "M15 18l-6-6 6-6"
-                                    }
-                                  }
-                                ]
-                              }
-                            ]
+                              "textStyle": "chatIcon"
+                            }
                           },
                           {
-                            "id": "workspace-forward",
+                            "id": "workspace-toolbar-spacer",
+                            "el": "span",
+                            "layout": {
+                              "grow": true
+                            }
+                          },
+                          {
+                            "id": "workspace-history",
                             "el": "div",
-                            "attrs": {
-                              "role": "button",
-                              "aria-label": "Forward"
-                            },
                             "layout": {
                               "mode": "horizontal",
-                              "align": "center",
-                              "justify": "center",
-                              "width": 40,
-                              "height": 40
-                            },
-                            "appearance": {
-                              "color": "muted",
-                              "radius": "sm"
+                              "gap": "2",
+                              "align": "center"
                             },
                             "children": [
                               {
-                                "id": "workspace-forward-glyph",
-                                "el": "svg",
-                                "attrs": {
-                                  "width": "16",
-                                  "height": "16",
-                                  "viewBox": "0 0 24 24",
-                                  "fill": "none",
-                                  "stroke": "currentColor",
-                                  "stroke-width": "2",
-                                  "stroke-linecap": "round",
-                                  "stroke-linejoin": "round",
-                                  "aria-hidden": "true"
+                                "id": "workspace-back",
+                                "component": "SubtleButton",
+                                "props": {
+                                  "label": "",
+                                  "accessibleName": "Back",
+                                  "disabled": "true"
                                 },
-                                "children": [
-                                  {
-                                    "id": "workspace-forward-path",
-                                    "el": "path",
-                                    "attrs": {
-                                      "d": "M9 18l6-6-6-6"
-                                    }
-                                  }
-                                ]
+                                "layout": {
+                                  "width": 40,
+                                  "height": 40
+                                },
+                                "appearance": {
+                                  "textStyle": "chatIcon"
+                                }
+                              },
+                              {
+                                "id": "workspace-forward",
+                                "component": "SubtleButton",
+                                "props": {
+                                  "label": "",
+                                  "accessibleName": "Forward",
+                                  "disabled": "true"
+                                },
+                                "layout": {
+                                  "width": 40,
+                                  "height": 40
+                                },
+                                "appearance": {
+                                  "textStyle": "chatIcon"
+                                }
                               }
                             ]
                           }
                         ]
                       },
                       {
-                        "id": "workspace-selector",
+                        "id": "workspace-selector-container",
                         "el": "div",
                         "layout": {
-                          "mode": "horizontal",
-                          "align": "center",
-                          "width": "fill"
+                          "mode": "freeform",
+                          "width": "fill",
+                          "height": 36
                         },
                         "children": [
                           {
-                            "id": "workspace-selector-agent",
-                            "component": "AgentIdentityBadge",
-                            "props": {
-                              "name": "Aurora",
-                              "handle": "agent-aurora"
+                            "id": "workspace-selector",
+                            "el": "button",
+                            "layout": {
+                              "mode": "horizontal",
+                              "align": "center",
+                              "width": "fill",
+                              "height": 36,
+                              "padding": {
+                                "left": "1",
+                                "top": "2",
+                                "right": "workspaceSelectorEnd",
+                                "bottom": "2"
+                              }
+                            },
+                            "attrs": {
+                              "type": "button",
+                              "aria-label": "Select assistant",
+                              "title": "No agents loaded. Native assistant picker reference."
                             },
+                            "appearance": {
+                              "background": "$none",
+                              "borderColor": "$none",
+                              "borderWidth": 0,
+                              "radius": "sm",
+                              "textAlign": "left"
+                            },
+                            "control": {
+                              "chrome": "none",
+                              "focus": {
+                                "kind": "outline",
+                                "color": "accent"
+                              }
+                            },
+                            "states": {
+                              "hover": {
+                                "background": "subtleHover"
+                              },
+                              "pressed": {
+                                "background": "subtlePressed"
+                              },
+                              "hoverPressed": {
+                                "background": "subtlePressed"
+                              }
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-selector-label",
+                                "el": "span",
+                                "layout": {
+                                  "grow": true
+                                },
+                                "appearance": {
+                                  "textStyle": "body",
+                                  "color": "muted"
+                                },
+                                "children": [
+                                  "No agents loaded"
+                                ]
+                              }
+                            ]
+                          },
+                          {
+                            "id": "workspace-selector-chevron",
+                            "el": "span",
                             "layout": {
-                              "grow": true
-                            }
+                              "mode": "horizontal",
+                              "align": "center"
+                            },
+                            "appearance": {
+                              "textStyle": "chatChevron",
+                              "color": "muted"
+                            },
+                            "position": {
+                              "mode": "absolute",
+                              "x": 222,
+                              "y": 12
+                            },
+                            "attrs": {
+                              "aria-hidden": "true"
+                            },
+                            "children": [
+                              ""
+                            ]
                           }
                         ]
                       }
@@ -2274,201 +2448,194 @@
                     "el": "div",
                     "layout": {
                       "mode": "vertical",
-                      "gap": "1",
                       "width": "fill"
                     },
                     "children": [
                       {
                         "id": "workspace-home",
                         "el": "div",
+                        "layout": {
+                          "mode": "freeform",
+                          "width": 248,
+                          "height": 36
+                        },
                         "attrs": {
-                          "role": "button"
+                          "aria-current": "page"
                         },
-                        "layout": {
-                          "mode": "horizontal",
-                          "gap": "4",
-                          "align": "center",
-                          "padding": {
-                            "x": "3",
-                            "y": "2"
-                          },
-                          "width": "fill"
+                        "margin": {
+                          "left": "1",
+                          "right": "1",
+                          "top": "half",
+                          "bottom": "half"
                         },
                         "appearance": {
                           "background": "subtleHover",
                           "radius": "sm"
                         },
+                        "states": {
+                          "hover": {
+                            "background": "subtlePressed"
+                          },
+                          "pressed": {
+                            "background": "subtleHover"
+                          },
+                          "hoverPressed": {
+                            "background": "subtleHover"
+                          }
+                        },
                         "children": [
                           {
                             "id": "workspace-home-indicator",
                             "el": "span",
-                            "attrs": {
-                              "aria-hidden": "true"
-                            },
                             "layout": {
-                              "mode": "horizontal",
                               "width": 3,
                               "height": 16
                             },
+                            "position": {
+                              "mode": "absolute",
+                              "x": 0,
+                              "y": 10
+                            },
                             "appearance": {
                               "background": "accent",
                               "radius": "pill"
-                            }
-                          },
-                          {
-                            "id": "workspace-home-label",
-                            "el": "span",
-                            "appearance": {
-                              "fontFamily": "body",
-                              "textStyle": "body",
-                              "color": "ink"
                             },
-                            "children": [
-                              "Home"
-                            ]
-                          }
-                        ]
-                      },
-                      {
-                        "id": "workspace-sessions-header",
-                        "el": "div",
-                        "layout": {
-                          "mode": "horizontal",
-                          "gap": "2",
-                          "align": "center",
-                          "justify": "space-between",
-                          "padding": {
-                            "x": "3"
+                            "attrs": {
+                              "aria-hidden": "true"
+                            }
                           },
-                          "width": "fill"
-                        },
-                        "margin": {
-                          "top": "2"
-                        },
-                        "children": [
                           {
-                            "id": "workspace-sessions-label",
+                            "id": "workspace-home-content",
                             "el": "span",
-                            "appearance": {
-                              "fontFamily": "body",
-                              "textStyle": "caption",
-                              "color": "muted"
-                            },
-                            "children": [
-                              "Sessions"
-                            ]
-                          },
-                          {
-                            "id": "workspace-sessions-add",
-                            "el": "div",
-                            "attrs": {
-                              "role": "button",
-                              "aria-label": "New conversation"
-                            },
                             "layout": {
                               "mode": "horizontal",
                               "align": "center",
-                              "justify": "center",
-                              "width": 32,
-                              "height": 32
+                              "gap": "4",
+                              "height": 36
                             },
-                            "appearance": {
-                              "color": "muted",
-                              "radius": "sm"
+                            "position": {
+                              "mode": "absolute",
+                              "x": 8,
+                              "y": 0
                             },
                             "children": [
                               {
-                                "id": "workspace-sessions-add-glyph",
-                                "el": "svg",
-                                "attrs": {
-                                  "width": "16",
-                                  "height": "16",
-                                  "viewBox": "0 0 24 24",
-                                  "fill": "none",
-                                  "stroke": "currentColor",
-                                  "stroke-width": "2",
-                                  "stroke-linecap": "round",
-                                  "stroke-linejoin": "round",
-                                  "aria-hidden": "true"
+                                "id": "workspace-home-iconbox",
+                                "el": "span",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center",
+                                  "justify": "center",
+                                  "width": 24,
+                                  "height": 24
                                 },
                                 "children": [
                                   {
-                                    "id": "workspace-sessions-add-path",
-                                    "el": "path",
+                                    "id": "workspace-home-icon",
+                                    "el": "img",
+                                    "layout": {
+                                      "width": 22,
+                                      "height": 22
+                                    },
                                     "attrs": {
-                                      "d": "M12 5v14M5 12h14"
+                                      "src": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyBmaWxsPSJub25lIj48cGF0aCBmaWxsPSJ1cmwoI1NWR2xyVFYxcWZrKSIgZD0iTTEyIDJjNS41MjMgMCAxMCA0LjQ3NyAxMCAxMHMtNC40NzcgMTAtMTAgMTBhOS45NiA5Ljk2IDAgMCAxLTQuNjQ0LTEuMTQybC00LjI5IDEuMTE3YS44NS44NSAwIDAgMS0xLjAzNy0xLjAzNmwxLjExNi00LjI4OUE5Ljk2IDkuOTYgMCAwIDEgMiAxMkMyIDYuNDc3IDYuNDc3IDIgMTIgMiIvPjxwYXRoIGZpbGw9InVybCgjU1ZHVTZncHVkRFQpIiBkPSJNMTMuMjUyIDEzSDguNzVsLS4xMDIuMDA3YS43NS43NSAwIDAgMCAwIDEuNDg2bC4xMDIuMDA3aDQuNTAybC4xMDEtLjAwN2EuNzUuNzUgMCAwIDAgMC0xLjQ4NnptMS45OTgtMy41aC02LjVsLS4xMDIuMDA3YS43NS43NSAwIDAgMCAwIDEuNDg2TDguNzUgMTFoNi41bC4xMDItLjAwN2EuNzUuNzUgMCAwIDAgMC0xLjQ4NnoiLz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9IlNWR2xyVFYxcWZrIiB4MT0iMi43MTQiIHgyPSIyMC4xNzgiIHkxPSI1Ljc1MSIgeTI9IjM1LjUyMSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIHN0b3AtY29sb3I9IiMwZmFmZmYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNjYzIzZDEiLz48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHVTZncHVkRFQiIHgxPSI4LjciIHgyPSI5LjIyNyIgeTE9IjkuNTg4IiB5Mj0iMTUuMDI1IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agc3RvcC1jb2xvcj0iI2ZkZmRmZCIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2NjZWFmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjwvZz48L3N2Zz4=",
+                                      "alt": "",
+                                      "aria-hidden": "true"
                                     }
                                   }
                                 ]
+                              },
+                              {
+                                "id": "workspace-home-label",
+                                "el": "span",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center"
+                                },
+                                "appearance": {
+                                  "textStyle": "body",
+                                  "color": "nativeText"
+                                },
+                                "children": [
+                                  "Home"
+                                ]
                               }
                             ]
                           }
                         ]
                       },
                       {
-                        "id": "workspace-session-1",
+                        "id": "workspace-sessions-header",
                         "el": "div",
-                        "attrs": {
-                          "role": "button"
-                        },
                         "layout": {
                           "mode": "horizontal",
                           "align": "center",
                           "gap": "2",
+                          "width": "fill",
+                          "height": 40,
                           "padding": {
-                            "x": "3",
-                            "y": "2"
-                          },
-                          "width": "fill"
+                            "left": "4",
+                            "right": "1"
+                          }
                         },
                         "children": [
                           {
-                            "id": "workspace-session-1-title",
+                            "id": "workspace-sessions-label",
                             "el": "span",
                             "layout": {
                               "grow": true
                             },
                             "appearance": {
-                              "fontFamily": "body",
-                              "textStyle": "body",
-                              "color": "ink"
+                              "textStyle": "bodyStrong",
+                              "color": "muted"
                             },
                             "children": [
-                              "Pair the Windows node"
+                              "Sessions"
                             ]
+                          },
+                          {
+                            "id": "workspace-sessions-add",
+                            "component": "SubtleButton",
+                            "props": {
+                              "label": "",
+                              "accessibleName": "New conversation",
+                              "disabled": "true"
+                            },
+                            "layout": {
+                              "width": 40,
+                              "height": 36
+                            },
+                            "appearance": {
+                              "textStyle": "chatIcon"
+                            }
                           }
                         ]
                       },
                       {
-                        "id": "workspace-session-2",
+                        "id": "workspace-sessions-empty",
                         "el": "div",
-                        "attrs": {
-                          "role": "button"
-                        },
                         "layout": {
                           "mode": "horizontal",
                           "align": "center",
-                          "gap": "2",
+                          "height": 40,
                           "padding": {
-                            "x": "3",
-                            "y": "2"
-                          },
-                          "width": "fill"
+                            "x": "4"
+                          }
                         },
                         "children": [
                           {
-                            "id": "workspace-session-2-title",
+                            "id": "workspace-sessions-empty-text",
                             "el": "span",
                             "layout": {
-                              "grow": true
+                              "mode": "horizontal",
+                              "align": "center"
                             },
                             "appearance": {
-                              "fontFamily": "body",
-                              "textStyle": "body",
-                              "color": "ink"
+                              "textStyle": "bodyStrong",
+                              "color": "muted"
                             },
                             "children": [
-                              "Draft the release notes"
+                              "No conversations to show."
                             ]
                           }
                         ]
@@ -2479,7 +2646,6 @@
                     "id": "workspace-footer-spacer",
                     "el": "div",
                     "layout": {
-                      "mode": "vertical",
                       "grow": true
                     }
                   },
@@ -2490,7 +2656,11 @@
                       "mode": "horizontal",
                       "gap": "1",
                       "align": "center",
-                      "width": "fill"
+                      "width": "fill",
+                      "padding": {
+                        "x": "1",
+                        "y": "2"
+                      }
                     },
                     "children": [
                       {
@@ -2498,59 +2668,120 @@
                         "component": "UserIdentityBadge",
                         "props": {
                           "name": "{owner}",
-                          "status": "{status}"
+                          "status": "{status}",
+                          "statusTone": "{statusTone}"
                         },
                         "layout": {
-                          "grow": true
+                          "grow": true,
+                          "width": 0
                         }
                       },
                       {
                         "id": "workspace-bell",
-                        "el": "div",
-                        "attrs": {
-                          "role": "button",
-                          "aria-label": "Notifications"
-                        },
+                        "el": "button",
                         "layout": {
                           "mode": "horizontal",
                           "align": "center",
                           "justify": "center",
                           "width": 40,
-                          "height": 40
+                          "height": 36,
+                          "padding": "2"
+                        },
+                        "attrs": {
+                          "type": "button",
+                          "aria-label": "Notifications",
+                          "title": "Notifications"
                         },
                         "appearance": {
-                          "color": "muted",
+                          "fontFamily": "body",
+                          "textStyle": "body",
+                          "color": "subtleButtonText",
+                          "background": "subtleButtonFill",
+                          "borderColor": "subtleButtonBorder",
+                          "borderWidth": 1,
                           "radius": "sm"
                         },
+                        "control": {
+                          "chrome": "none",
+                          "focus": {
+                            "kind": "outline",
+                            "color": "accent"
+                          }
+                        },
+                        "states": {
+                          "hover": {
+                            "color": "subtleButtonHoverText",
+                            "background": "subtleButtonHoverFill",
+                            "borderColor": "subtleButtonHoverBorder"
+                          },
+                          "pressed": {
+                            "color": "subtleButtonPressedText",
+                            "background": "subtleButtonPressedFill",
+                            "borderColor": "subtleButtonPressedBorder"
+                          },
+                          "hoverPressed": {
+                            "color": "subtleButtonPressedText",
+                            "background": "subtleButtonPressedFill",
+                            "borderColor": "subtleButtonPressedBorder"
+                          },
+                          "disabled": {
+                            "color": "subtleButtonDisabledText",
+                            "background": "subtleButtonFill",
+                            "borderColor": "subtleButtonBorder"
+                          }
+                        },
+                        "on": {
+                          "click": {
+                            "open": "NotificationFlyout"
+                          }
+                        },
                         "children": [
                           {
-                            "id": "workspace-bell-glyph",
-                            "el": "svg",
-                            "attrs": {
-                              "width": "18",
-                              "height": "18",
-                              "viewBox": "0 0 24 24",
-                              "fill": "none",
-                              "stroke": "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round",
-                              "aria-hidden": "true"
+                            "id": "workspace-bell-container",
+                            "el": "span",
+                            "layout": {
+                              "mode": "freeform",
+                              "width": 20,
+                              "height": 20
                             },
                             "children": [
                               {
-                                "id": "workspace-bell-body",
-                                "el": "path",
+                                "id": "workspace-bell-glyph",
+                                "el": "img",
+                                "layout": {
+                                  "width": 20,
+                                  "height": 20
+                                },
                                 "attrs": {
-                                  "d": "M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"
+                                  "src": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyBmaWxsPSJub25lIj48cGF0aCBmaWxsPSJ1cmwoI2JlbGxCb2R5KSIgZD0iTTEyIDJhNiA2IDAgMCAwLTYgNnYzLjdjMCAuOS0uMzEgMS43Ny0uODggMi40NmwtLjc0LjlBMS43NSAxLjc1IDAgMCAwIDUuNzMgMThoMTIuNTRhMS43NSAxLjc1IDAgMCAwIDEuMzUtMi45NGwtLjc0LS45QTMuODQgMy44NCAwIDAgMSAxOCAxMS43VjhhNiA2IDAgMCAwLTYtNiIvPjxwYXRoIGZpbGw9InVybCgjYmVsbENsYXBwZXIpIiBkPSJNOS4yNSAxOWEyLjc1IDIuNzUgMCAwIDAgNS41IDB6Ii8+PHBhdGggZmlsbD0idXJsKCNiZWxsSGlnaGxpZ2h0KSIgZD0iTTkgOC4yNUEzLjI1IDMuMjUgMCAwIDEgMTIuMjUgNWEuNzUuNzUgMCAwIDEgMCAxLjVBMS43NSAxLjc1IDAgMCAwIDEwLjUgOC4yNWEuNzUuNzUgMCAwIDEtMS41IDAiLz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImJlbGxCb2R5IiB4MT0iNS4yIiB4Mj0iMTkuOSIgeTE9IjMuNCIgeTI9IjE5LjYiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjMGZhZmZmIi8+PHN0b3Agb2Zmc2V0PSIuNDgiIHN0b3AtY29sb3I9IiM5YzZjZmUiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNlNjU2ZWIiLz48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iYmVsbENsYXBwZXIiIHgxPSI5Ljc1IiB4Mj0iMTQuMjUiIHkxPSIxOSIgeTI9IjIxLjUiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZjZDBmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmY2ZjQ3Ii8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9ImJlbGxIaWdobGlnaHQiIHgxPSI5LjIiIHgyPSIxMi45IiB5MT0iNS4xIiB5Mj0iOC43IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agc3RvcC1jb2xvcj0iI2Y4ZmJmZiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2I2ZWZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjwvZz48L3N2Zz4K",
+                                  "alt": "",
+                                  "aria-hidden": "true"
                                 }
                               },
                               {
-                                "id": "workspace-bell-clapper",
-                                "el": "path",
-                                "attrs": {
-                                  "d": "M13.7 21a2 2 0 0 1-3.4 0"
-                                }
+                                "id": "workspace-bell-badge",
+                                "el": "span",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center",
+                                  "justify": "center",
+                                  "width": 16,
+                                  "height": 16
+                                },
+                                "position": {
+                                  "mode": "absolute",
+                                  "x": 12,
+                                  "y": -6
+                                },
+                                "appearance": {
+                                  "textStyle": "caption",
+                                  "color": "accentInk",
+                                  "background": "accent",
+                                  "radius": "pill"
+                                },
+                                "children": [
+                                  "{notifications}"
+                                ]
                               }
                             ]
                           }
@@ -2566,13 +2797,190 @@
                 "layout": {
                   "mode": "vertical",
                   "grow": true,
-                  "padding": "5",
-                  "width": "fill"
+                  "width": 0,
+                  "height": "fill"
+                },
+                "appearance": {
+                  "background": "chatLayer",
+                  "radius": "workspaceContent"
                 },
                 "children": [
                   {
-                    "id": "workspace-content-thread",
-                    "component": "ChatThread"
+                    "id": "workspace-content-topedge",
+                    "el": "div",
+                    "layout": {
+                      "mode": "horizontal",
+                      "width": "fill",
+                      "height": 8,
+                      "align": "start"
+                    },
+                    "children": [
+                      {
+                        "id": "workspace-content-corner",
+                        "el": "svg",
+                        "layout": {
+                          "width": 8,
+                          "height": 8
+                        },
+                        "attrs": {
+                          "viewBox": "0 0 8 8",
+                          "width": 8,
+                          "height": 8,
+                          "aria-hidden": "true"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-content-corner-stroke",
+                            "el": "path",
+                            "attrs": {
+                              "d": "M0.5 8 A7.5 7.5 0 0 1 8 0.5",
+                              "fill": "none",
+                              "stroke": "var(--color-line)",
+                              "stroke-width": 1
+                            }
+                          }
+                        ]
+                      },
+                      {
+                        "id": "workspace-content-topline",
+                        "el": "span",
+                        "layout": {
+                          "grow": true,
+                          "height": 1
+                        },
+                        "appearance": {
+                          "background": "line"
+                        }
+                      }
+                    ]
+                  },
+                  {
+                    "id": "workspace-content-below-edge",
+                    "el": "div",
+                    "layout": {
+                      "mode": "horizontal",
+                      "grow": true,
+                      "width": "fill"
+                    },
+                    "children": [
+                      {
+                        "id": "workspace-content-leftline",
+                        "el": "span",
+                        "layout": {
+                          "width": 1,
+                          "height": "fill"
+                        },
+                        "appearance": {
+                          "background": "line"
+                        }
+                      },
+                      {
+                        "id": "workspace-content-host",
+                        "el": "div",
+                        "layout": {
+                          "mode": "vertical",
+                          "grow": true,
+                          "width": 0,
+                          "align": "center",
+                          "justify": "center"
+                        },
+                        "children": [
+                          {
+                            "id": "workspace-placeholder",
+                            "el": "div",
+                            "layout": {
+                              "mode": "vertical",
+                              "align": "center",
+                              "gap": "3"
+                            },
+                            "geometry": {
+                              "translateY": -3.5
+                            },
+                            "children": [
+                              {
+                                "id": "workspace-placeholder-icon",
+                                "el": "span",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center"
+                                },
+                                "appearance": {
+                                  "textStyle": "workspacePlaceholder",
+                                  "color": "nativeText"
+                                },
+                                "children": [
+                                  ""
+                                ]
+                              },
+                              {
+                                "id": "workspace-placeholder-title",
+                                "el": "span",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center"
+                                },
+                                "appearance": {
+                                  "textStyle": "subtitle",
+                                  "color": "nativeText"
+                                },
+                                "children": [
+                                  "Connect to gateway to start chatting"
+                                ]
+                              },
+                              {
+                                "id": "workspace-open-connection",
+                                "el": "button",
+                                "layout": {
+                                  "mode": "horizontal",
+                                  "align": "center",
+                                  "justify": "center",
+                                  "height": 32,
+                                  "padding": {
+                                    "left": "buttonHorizontal",
+                                    "top": "buttonTop",
+                                    "right": "buttonHorizontal",
+                                    "bottom": "buttonBottom"
+                                  }
+                                },
+                                "attrs": {
+                                  "type": "button"
+                                },
+                                "appearance": {
+                                  "textStyle": "body",
+                                  "color": "nativeText",
+                                  "background": "control",
+                                  "borderColor": "controlLine",
+                                  "borderWidth": 1,
+                                  "radius": "sm"
+                                },
+                                "control": {
+                                  "chrome": "none",
+                                  "focus": {
+                                    "kind": "outline",
+                                    "color": "accent"
+                                  }
+                                },
+                                "states": {
+                                  "hover": {
+                                    "background": "controlHover"
+                                  },
+                                  "pressed": {
+                                    "background": "controlDisabled"
+                                  },
+                                  "disabled": {
+                                    "background": "controlDisabled",
+                                    "color": "disabledText"
+                                  }
+                                },
+                                "children": [
+                                  "Open Connection"
+                                ]
+                              }
+                            ]
+                          }
+                        ]
+                      }
+                    ]
                   }
                 ]
               }
@@ -2581,6 +2989,7 @@
         ]
       }
     },
+
     {
       "name": "SetupProgressIndicator",
       "note": "Setup control. The wizard step dots (SetupProgressIndicator.cs). Non-interactive, non-focusable, accessibility-hidden, so no hover/pressed states. The active step is a 20x8 pill in `accent` (SetupIndicatorAccentBrush = SystemAccentColorLight2 dark / Dark1 light); inactive steps are 8x8 dots in `muted` (SetupInactiveDotBrush = ControlStrongFill). Dot spacing is token `2` (8px); every dot uses the `sm` radius (4px).",
@@ -2910,7 +3319,7 @@
               { "id": "settings-toggle-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
             ]
           },
-          { "id": "settings-toggle-switch", "component": "ToggleSwitch" }
+          { "id": "settings-toggle-switch", "component": "ToggleSwitch", "props": { "label": "{title}" } }
         ]
       }
     },
diff --git a/DESIGN.md b/DESIGN.md
index e12035fdda..fa971b348e 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -181,6 +181,26 @@ typography:
     fontSize: 12px
     fontWeight: 400
     lineHeight: 12px
+  workspaceTitle:
+    fontFamily: '"Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif'
+    fontSize: 12px
+    fontWeight: 400
+    lineHeight: 16px
+  workspacePerson:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 10.08px
+    fontWeight: 400
+    lineHeight: 1
+  workspaceCaption:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 10px
+    fontWeight: 400
+    lineHeight: 10px
+  workspacePlaceholder:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 48px
+    fontWeight: 400
+    lineHeight: 48px
 spacing:
   "0": 0px
   half: 2px
@@ -201,6 +221,7 @@ spacing:
   infoTextTop: 14px
   infoIconGap: 14px
   chatGutter: 40px
+  workspaceSelectorEnd: 28px
 rounded:
   sm: 4px
   md: 8px
@@ -208,6 +229,7 @@ rounded:
   bubble: 12px
   composer: 20px
   pill: 999px
+  workspaceContent: 8px 0 0 0
 x-colophon:
   version: 1
   tokens:
@@ -812,13 +834,19 @@ The Colophon catalog now uses the actual geometry, semantic alpha brushes and Fl
 
 ## Workspace shell
 
-The landing window is the native Home and Sessions workspace (`Windows/WorkspaceWindow.xaml`, shipped in #1541). It is a Mica window with a title bar, a 256px left `NavigationView` pane, and a content host that mounts the Reactor chat. Settings remains an independent native companion window.
+The landing window is the native Home and Sessions workspace (`Windows/WorkspaceWindow.xaml`, shipped in #1541). The reference is reconciled against production commit `dc9f6345821075362580bd598cc32e4f2aa6a18a` and the supplied 125%-scale screenshot. It shows that screenshot's expanded, no-agent/no-session state, Owner / Error footer and one notification, not invented connected conversations. It is a Mica window with a 32px title bar, a 256px left `NavigationView` pane, and a content host that mounts the Reactor chat when connected. Settings remains an independent native companion window.
 
-- **Pane.** The `NavigationViewExpandedPaneBackground` reveals Mica. The PaneHeader stacks a Back/Forward toolbar of subtle icon buttons over a transparent assistant selector (a borderless `ComboBox` rendering the selected agent through `AgentIdentityBadge`, with a New agent option that carries the `add` glyph U+E710). The menu lists a Home item, then a Sessions header whose inline add button starts a conversation, then one reusable row per session. Selected nav and session rows use the native subtle selection background with a leading `accent` indicator; rows use the `sm` (ControlCornerRadius) corners.
-- **Owner footer.** The PaneFooter pairs an Owner button with a Notifications bell. The Owner button is the `UserIdentityBadge`: it reads the authenticated `users.self` profile as a display name over a live connection-status caption, with a small connection status dot to the left of that caption (the same `positive` / `warning` / `critical` / `muted` states as the connection flyout, never color alone). It falls back honestly to Owner / Disconnected when no profile is available and never encodes authorization state. The bell shows an `InfoBadge` count and opens the notifications flyout.
+- **Pane and toolbar.** The `NavigationViewExpandedPaneBackground` reveals Mica; there is no extra pane border or general 8px inset. PaneHeader margin is 4,8,4,8. The 40x40 pane button sits at x=4, y=8 below the title bar. Back/Forward align to the right of the same 40px toolbar with an 8px gap and the default SubtleButton padding, yielding 40px widths. Their disabled state represents empty navigation history. The selector sits 8px below the toolbar, with 4,8,28,8 padding and a trailing 12px U+E70D glyph. It shows No agents loaded until production has a roster; selected agents use `AgentIdentityBadge`.
+- **Menu.** Home is a 36px row with 4px horizontal and 2px vertical outer margins, a 3x16 accent indicator and the original `Chat.svg` at 22px centered in a 24px column. The iconless native presenter reserves 8px before that column, followed by a 16px gap to Home. The Sessions header is 40px tall with 16px leading and 4px trailing insets, 14px semibold text, and a 40x36 add button. No conversations to show replaces session rows in the supplied state; add is disabled while disconnected.
+- **Owner footer.** The PaneFooter uses 4,8,4,8 margins and a 4px column gap. The Owner button is the shared `UserIdentityBadge`, with native SubtleButton states, 8px padding and a retained 1px border, a 24px PersonPicture, 12px column spacing and a 10px status dot followed by a 4px gap and Caption text. `statusTone` follows connection state, never authorization. It reads the authenticated `users.self` profile or falls back to Owner. The notification button is 40x36 with 8px padding, vertically centered against Owner, containing the original 20px `Notifications.svg` and a 16px InfoBadge offset -6px above and 8px beyond the icon's right edge.
 - **Connection status.** `Controls/GatewayStatusContent.xaml` is a 304px flyout of Gateway, Operator, and Node rows split by 1px `line` dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail, and reveals an `accent` action link (Reconnect, Approve) only when that layer needs one. The dot binds the Fluent system fill for its state: `positive` connected, `warning` attention, `critical` error, `muted` unknown, never color alone.
 - **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px flyout: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. Each card is a `surface` panel with a 1px `line` border, `md` (8px) corners, and 12px padding, laying out a leading severity glyph, a title/message/metadata stack, and a dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card.
-- **Sidebar glyphs.** Pane and toolbar glyphs are Segoe Fluent Icons or the SVGs under `Assets/SidebarIcons` (Chat, Sessions, Notifications, Connection, and the Settings destinations). Toolbar aliases include Back U+E76B, Forward U+E76C, add U+E710, toggle pane U+E90C, dismiss U+E711, and the Ringer notifications glyph U+EA8F.
+- **Artwork and glyphs.** Pane, Back, Forward and Add use actual Segoe Fluent glyphs U+E90C, U+E76B, U+E76C and U+E710 at 16px, not hand-drawn SVG substitutes. Home and Notifications use exact production SVG bytes, including their authored gradients; these are artwork, not theme-color tokens. The title uses `BrandAssets.RedBotMarkUri` at 16px with a 16px gap before its 12px title. Native caption glyph references are U+E921, U+E922 and U+E8BB. The owner fallback uses PersonPicture's Contact glyph U+E77B at 24 * 0.42 = 10.08px.
+- **Content.** One `NavigationViewContentBackground` layer uses `chatLayer`, with a 1px top/left `line` stroke and the native 8,0,0,0 corner shape (`workspaceContent`). The disconnected placeholder is centered: U+E8F2 at 48px, Subtitle text, and the standard 32px Open Connection button, separated by 12px gaps.
+
+Workspace button instances reuse SubtleButton's resource-bound states rather than a generic `muted` foreground. The added `workspaceTitle`, `workspacePerson` and `workspacePlaceholder` typography tokens preserve native title, PersonPicture and empty-state metrics. `workspaceSelectorEnd` records the 28px native selector padding.
+
+This is a production-structure and geometry reference, not a pixel-identity claim. The supplied screenshot's client is approximately 1266x852 effective pixels; the preview uses that height and follows its available width. Mica's wallpaper tint, font rasterization, OS caption actions and native NavigationView interaction cannot be reproduced by this renderer. The pane button has hover/pressed/focus styling, but collapse/reopen remains a native action: production hides the pane entirely, shows a 56px ReopenPaneSlot, and transfers focus. Do not approximate that behavior by shrinking focusable children to zero width. The preview notification button opens the shared illustrative flyout; it does not read live notifications.
 
 ## Components
 
@@ -850,9 +878,11 @@ Colophon's browser preview retains limitations: its body line box is 20px rather
 
 ### Native ToggleSwitch, PersonPicture, and InfoBar references
 
-`ToggleSwitch` remains a **static track reference**, not a working switch, pending interactive renderer support. Keep one shared component rather than a gallery of static interaction states. The [native template](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/ToggleSwitch_themeresources.xaml) uses a 40x20 track, a 12x12 resting/disabled knob, a 14x14 pointer-over knob, and a 17x14 pressed knob. The full native control also owns its header, On/Off content, 12px track-to-content gap, 10px pre/post margins, and 154px minimum width; these are not part of the isolated track.
+`ToggleSwitch` is one **interactive shared control**, not a gallery of static states. Each rendered instance starts On and owns an independent transient `checked` boolean; click, Space, or Enter toggles it and updates `aria-checked` without writing to the design file. `SettingsToggleRow` reuses this control and passes its title as the accessible name. Set the `disabled` prop to `"true"` to prevent activation, or use the canvas's Disabled preview state. The [native template](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/ToggleSwitch_themeresources.xaml) uses a 40x20 track, a 12x12 resting/disabled knob, a 14x14 pointer-over knob, and a 17x14 pressed knob. The full native control also owns its header, On/Off content, 12px track-to-content gap, 10px pre/post margins, and 154px minimum width; these are not part of the isolated track.
+
+On/Off movement uses a separate 20x20 carrier with 20px travel. Colophon's WinUI reposition reference is 367ms cubic-bezier(0.1,0.9,0.2,1); thumb resizing independently uses `ControlFasterAnimationDuration` (83ms) and `ControlFastOutSlowInKeySpline` (0,0,0,1), or `ControlNormalAnimationDuration` (250ms) when disabled. These platform-specific timings intentionally override the general 120-200ms motion guideline. The browser respects `prefers-reduced-motion` by suppressing both transitions. Resting knob bounds are x=3.5 (Off) or x=23.5 (On), y=4, preserving the native half-pixel margins. Hover keeps each knob center; pressed alignment changes the bounds to x=3 (Off) or x=20 (On), y=3.
 
-On/Off movement is native `RepositionThemeAnimation` with a 20px endpoint displacement and template-calculated `KnobOnToOffOffset` / `KnobOffToOnOffset`. Pointer-over/pressed knob resizing uses `ControlFasterAnimationDuration` (83ms) and `ControlFastOutSlowInKeySpline` (0,0,0,1); disabled resizing uses `ControlNormalAnimationDuration` (250ms). Preserve WinUI's Dragging transitions and system animation settings rather than replacing them with the general motion guideline. The installed Colophon renderer cannot persist checked state, animate geometry, or express these transitions. The remaining reference does not prove animation, dragging, keyboard switching, or the on-knob `CircleElevationBorderBrush`.
+Track and knob states bind the `toggle*`, `accent`, and `accentInk` resource tokens in all three preview themes. Off track fill/stroke changes use the native 83ms linear color transition; On brushes change discretely rather than inheriting Colophon's generic 160ms transition. The disabled Off knob reuses `disabledText`, the `TextFillColorDisabledBrush` alias used by native `ToggleSwitchKnobFillOffDisabled`. The preview requires the persistent-state and geometry-transition support merged into [Colophon](https://github.com/karkarl/colophon/commit/d3cd63899410ead81b2aab2b99135dffe9037035). It supports interruption and reversal, but does not reproduce native dragging, template-calculated reposition offsets, system focus visuals, or the on-knob `CircleElevationBorderBrush`. Shipping WinUI must keep its stock template and system animation settings; the browser graph is not a replacement control implementation.
 
 `Avatar` follows [DefaultPersonPictureStyle](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/PersonPicture/PersonPicture.xaml): 96x96 by default, a 1px ellipse stroke, `PersonPictureEllipseFillThemeBrush`, and semibold initials sized to `max(1, diameter * 0.42)`. At the default size this is 40.32px, not a 13px body label. `AvatarStates` also shows the native Contact (U+E77B) and People (U+E716) fallbacks. PersonPicture is non-interactive and has no hover/pressed states; an enclosing button owns those. Production 32px and 24px usages are size overrides, not the default. Native photo clipping, initials generation, badge layout, and `TextLineBounds=Tight` remain native behavior, not browser parity claims.
 

From 6f16909911a5c4382415e8e2c5c5cefcb24ba7dd Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 20 Oct 2026 14:38:32 -0400
Subject: [PATCH 30/32] design(colophon): refine catalog pages and native setup
 controls

Organize shared controls and feature previews, reuse accent badge and normal button variations, and align setup backplates and interactions with their documented native resources.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 511 +++++++++++++++-----------------
 AGENTS.md                       |  18 +-
 DESIGN.md                       | 197 +++++++++++-
 3 files changed, 431 insertions(+), 295 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 994cd198a7..3200549a67 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -7,49 +7,82 @@
   "components": [
     {
       "name": "Button",
-      "note": "Basic control. Primary action — one per view, where the eye should land. Previewed as `variant:primary`, the WinUI AccentButtonStyle: `accent` fill (AccentFillColorDefaultBrush) with `accentInk` text (TextOnAccentFillColorPrimaryBrush), `sm` radius (ControlCornerRadius). Hover = AccentFillColorSecondary (token `accentSubtle`); pressed = AccentFillColorTertiary (no exact token, previewed with `accentSubtle`, documented here); disabled = AccentFillColorDisabled with TextOnAccentFillColorDisabled (previewed as `control`/`muted`). The `variant:standard` Button swaps to the default ButtonStyle: `control` fill (ControlFillColorDefault), `controlLine` border (ControlStrokeColorDefault), `ink` text; hover ControlFillColorSecondary, pressed ControlFillColorTertiary, disabled ControlFillColorDisabled. Subtle/icon buttons are the separate SubtleButton block. Padding mirrors WinUI ButtonPadding (11,5,11,6), snapped to spacing tokens 3 (12≈11) and 1 (4≈5/6). In-app MinWidth 100px keeps short labels (OK / Connect) from cramping and gives side-by-side buttons a consistent footprint; that minimum has no spacing-token equivalent, so it stays a port note and the preview hugs its label.",
+      "note": "Basic control. Accent variation: ship the stock WinUI Button with AccentButtonStyle. ButtonStandard references this shared markup and overrides its state brushes for the normal style; a variant class cannot override inline token styling. Both use exact ButtonPadding 11,5,11,6, a retained 1px ButtonBorderThemeThickness, ControlCornerRadius 4, normal-weight 14px content, and the native 83ms linear background-only transition. Accent fill/foreground use accent/accentInk at rest; existing chatAction tokens already bind the same AccentButton hover, pressed-fill, and disabled resources. Pressed text and state borders have dedicated aliases, including high-contrast system colors. Width and height follow content; MinWidth 100 belongs only to wizard instances. Browser limits: elevation borders are flat swatches, the body line box is 20px, and the focus outline is not WinUI's system focus visual. Keep the native template, gradient brush, text measurement and FocusVisualMargin=-3 when shipping.",
       "props": {
         "children": "Save changes",
-        "variant": "primary"
+        "disabled": "false"
       },
       "root": {
         "id": "button-root",
         "el": "button",
-        "class": "ds-btn ds-btn-{variant}",
         "attrs": {
-          "type": "button"
+          "type": "button",
+          "aria-disabled": "{disabled}"
         },
         "layout": {
           "mode": "horizontal",
           "padding": {
-            "x": "3",
-            "y": "1"
+            "left": "buttonHorizontal",
+            "top": "buttonTop",
+            "right": "buttonHorizontal",
+            "bottom": "buttonBottom"
           },
           "align": "center",
           "justify": "center",
-          "width": "hug"
+          "width": "hug",
+          "height": "hug"
         },
         "appearance": {
           "fontFamily": "body",
           "textStyle": "body",
           "color": "accentInk",
           "background": "accent",
+          "borderColor": "buttonAccentBorder",
+          "borderWidth": 1,
           "radius": "sm"
         },
         "control": {
+          "chrome": "none",
           "focus": { "kind": "outline", "color": "accent" }
         },
         "states": {
-          "hover": { "background": "accentSubtle" },
-          "pressed": { "background": "accentSubtle" },
-          "hoverPressed": { "background": "accentSubtle" },
-          "disabled": { "color": "muted", "background": "control" }
-        },
+          "hover": { "color": "accentInk", "background": "chatActionHover", "borderColor": "buttonAccentBorder" },
+          "pressed": { "color": "buttonAccentPressedText", "background": "chatActionPressed", "borderColor": "buttonAccentPressedBorder" },
+          "hoverPressed": { "color": "buttonAccentPressedText", "background": "chatActionPressed", "borderColor": "buttonAccentPressedBorder" },
+          "disabled": { "color": "chatActionDisabledText", "background": "chatActionDisabled", "borderColor": "buttonAccentDisabledBorder" }
+        },
+        "transitions": [
+          { "properties": ["background-color"], "duration": 83, "easing": "linear" }
+        ],
         "children": [
           "{children}"
         ]
       }
     },
+    {
+      "name": "ButtonStandard",
+      "note": "Normal variation of the shared Button, not a second implementation. Ship a stock WinUI Button with DefaultButtonStyle (no AccentButtonStyle), as used by Back in SetupEngine.UI/Pages/CapabilitiesPage.xaml. Inherits exact padding, 1px border, 4px corners, regular 14px content, disabled semantics, keyboard focus and 83ms background transition. Dedicated Button* resource tokens preserve normal, pointer-over, pressed and disabled fill/foreground/border, including high contrast. The native rest/hover ControlElevationBorderBrush remains a gradient; this renderer can only show its default flat stroke swatch and cannot reproduce BackgroundSizing=InnerBorderEdge. Native font metrics and system focus remain platform-owned. Use this same variation for ordinary secondary actions such as SettingsCard's Change.",
+      "props": {
+        "children": "Standard button",
+        "disabled": "false"
+      },
+      "root": {
+        "id": "button-standard-root",
+        "component": "Button",
+        "props": { "children": "{children}", "disabled": "{disabled}" },
+        "appearance": {
+          "color": "buttonText",
+          "background": "buttonFill",
+          "borderColor": "buttonBorder"
+        },
+        "states": {
+          "hover": { "color": "buttonHoverText", "background": "buttonHoverFill", "borderColor": "buttonHoverBorder" },
+          "pressed": { "color": "buttonPressedText", "background": "buttonPressedFill", "borderColor": "buttonPressedBorder" },
+          "hoverPressed": { "color": "buttonPressedText", "background": "buttonPressedFill", "borderColor": "buttonPressedBorder" },
+          "disabled": { "color": "buttonDisabledText", "background": "buttonDisabledFill", "borderColor": "buttonDisabledBorder" }
+        }
+      }
+    },
     {
       "name": "TextBox",
       "note": "Basic control. Reusable default WinUI single-line TextBox, matching the stock control used by DirectUrlBox in Pages/ConnectionPage.xaml. Body text is 14px, the preview is 32px high with sm (4px) corners, and TextControlThemePadding is preserved exactly as 10,5,6,6 through named spacing tokens. Normal uses control/ink, pointer-over uses controlHover, and disabled uses controlDisabled/disabledText. The input has no separate native Pressed visual state: pressed previews retain pointer-over fill, while actual focus draws the 2px accent underline through control.focus. The browser uses controlLine as a flat approximation of TextControlElevationBorderBrush; native focused fill and the clear-button template remain owned by WinUI. Port as Microsoft.UI.Xaml.Controls.TextBox without replacing its template.",
@@ -199,7 +232,7 @@
     },
     {
       "name": "Badge",
-      "note": "Basic control. Status pill — a read-only, non-interactive label, so it carries no hover/pressed states. Uses semantic color tokens, never a raw hex: `positive` (SystemFillColorSuccess), `warning` (SystemFillColorCaution), `critical` (SystemFillColorCritical), or `muted` for neutral. Padding tokens 3/1 give the pill a compact footprint; the `pill` radius and tone color come from the ds-badge class. Two production relatives: the WorkspaceShell count badge is a Fluent InfoBadge (default pill geometry, framework fill), and the notification recurrence badge is a 10px-radius `warning` subtle-background chip with 7,1 padding — both non-interactive, documented on their host components.",
+      "note": "Basic control. Read-only status pill with no hover/pressed actions. Semantic tones positive, warning and critical use the existing ds-badge classes; padding remains 12,4 and the radius is pill. BadgeAccent is the shared outlined accent variation: it references this Badge, overriding appearance and padding rather than duplicating its markup. Recommended is example text for that variant, not a separate setup control. Workspace count and notification recurrence badges retain their documented host-specific geometry.",
       "props": {
         "children": "Connected",
         "tone": "positive"
@@ -222,6 +255,29 @@
         ]
       }
     },
+    {
+      "name": "BadgeAccent",
+      "note": "Outlined accent variation of Badge, derived from production Controls/RecommendedBadge.xaml at 0131e4ce1f7937b22c69b289564087061687fa14. Caption text and a 1px border bind AccentTextFillColorPrimaryBrush (accentText), not AccentFillColorDefaultBrush. Transparent fill, sm (4px) corners, and native 8,4 padding. Disabled text and border bind TextFillColorDisabledBrush. Read-only, with no hover/pressed action. This component reference is a named variant of the shared Badge, not a second implementation.",
+      "props": { "children": "Recommended" },
+      "root": {
+        "id": "badge-accent-root",
+        "component": "Badge",
+        "props": { "children": "{children}", "tone": "neutral" },
+        "layout": { "padding": { "x": "2", "y": "1" } },
+        "appearance": {
+          "fontFamily": "body",
+          "textStyle": "caption",
+          "color": "accentText",
+          "background": "$none",
+          "borderColor": "accentText",
+          "borderWidth": 1,
+          "radius": "sm"
+        },
+        "states": {
+          "disabled": { "color": "disabledText", "borderColor": "disabledText" }
+        }
+      }
+    },
     {
       "name": "SubtleButton",
       "note": "Basic control. Default WinUI SubtleButtonStyle, not the workspace's fixed-size icon variant. Uses native ButtonPadding 11,5,11,6 (left, top, right, bottom), a retained 1px ButtonBorderThemeThickness, sm (4px) ControlCornerRadius, and normal-weight 14px text. Width and height follow content; the style itself sets no 40x40 dimensions. Background, border, and foreground bind SubtleButton-specific normal, pointer-over, pressed, and disabled resources, including high-contrast overrides. Preview hover/pressed border tokens are transparent in light/dark: CSS paints the fill under the border, so adding the translucent native border again would produce an incorrect dark rim. High-contrast borders and keyboard focus remain visible. Disabled fill and border resolve to the same values as rest; disabled text uses TextFillColorDisabledBrush, not muted. Port with Style={StaticResource SubtleButtonStyle}, leaving the native template intact rather than copying the browser border compensation. Browser limitations: body uses a 20px line box; native system focus (FocusVisualMargin=-3) and the 83ms background transition are not reproduced by Colophon's shared renderer. Workspace icon sizing and padding overrides belong to usage variants.",
@@ -3006,60 +3062,33 @@
         ]
       }
     },
-    {
-      "name": "RecommendedBadge",
-      "note": "Setup control. The small outlined \"Recommended\" tag beside a capability profile (Controls/RecommendedBadge.xaml). Non-interactive. An outline-only badge: 1px `accent` border (AccentTextFillColorPrimaryBrush), `accent` caption text, no fill, `sm` radius (4px), padding token `2` horizontal and `1` vertical (8,4). Disabled recolors border and text to `muted` (TextFillColorDisabled). This is a small `sm` badge, not the 999px `pill` Badge.",
-      "props": {
-        "children": "Recommended"
-      },
-      "root": {
-        "id": "recommended-badge-root",
-        "el": "span",
-        "layout": {
-          "mode": "horizontal",
-          "align": "center",
-          "padding": { "x": "2", "y": "1" },
-          "width": "hug"
-        },
-        "appearance": {
-          "fontFamily": "body",
-          "textStyle": "caption",
-          "color": "accent",
-          "background": "$none",
-          "borderColor": "accent",
-          "radius": "sm"
-        },
-        "children": [ "{children}" ]
-      }
-    },
     {
       "name": "ProviderArtwork",
-      "note": "Setup control. The square icon tile for an AI provider (Controls/ProviderArtwork.xaml). Non-interactive. A 40x40 tile: `surface` (SolidBackgroundFillColorBase) fill, 1px `line` (CardStrokeColorDefault) border, `sm` radius (ControlCornerRadius), token `2` (8px) padding around a 24x24 glyph or image. Previewed with a representative Segoe Fluent glyph.",
+      "note": "Non-interactive provider tile from Controls/ProviderArtwork.xaml. Native size is 42x42: a 24x24 content grid, 8px padding and a 1px border on each side. The Border explicitly requests Dark, binding SolidBackgroundFillColorBaseBrush and CardStrokeColorDefaultBrush even on light pages. The scalable SVG preserves those bounds and 4px outer corners when SetupOptionCard displays it through the native 32x32 Viewbox. The 24px Fluent fallback glyph is representative, not provider branding; image loading stays native.",
       "root": {
         "id": "provider-artwork-root",
-        "el": "span",
+        "el": "svg",
+        "attrs": { "viewBox": "0 0 42 42", "aria-hidden": "true", "focusable": "false" },
         "layout": {
-          "mode": "horizontal",
-          "align": "center",
-          "justify": "center",
-          "padding": "2",
-          "width": 40,
-          "height": 40
-        },
-        "appearance": {
-          "background": "surface",
-          "borderColor": "line",
-          "radius": "sm"
+          "width": 42,
+          "height": 42
         },
         "children": [
           {
-            "id": "provider-artwork-glyph",
-            "el": "span",
+            "id": "provider-artwork-backplate",
+            "el": "rect",
             "attrs": {
-              "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:24px"
-            },
-            "appearance": { "color": "ink" },
+              "x": 0.5, "y": 0.5, "width": 41, "height": 41, "rx": 3.5,
+              "fill": "var(--color-providerArtworkFill)",
+              "stroke": "var(--color-providerArtworkStroke)",
+              "stroke-width": 1
+            }
+          },
+          {
+            "id": "provider-artwork-glyph",
+            "el": "text",
+            "attrs": { "x": 21, "y": 21, "text-anchor": "middle", "dominant-baseline": "central", "fill": "currentColor" },
+            "appearance": { "textStyle": "providerSymbol", "color": "providerArtworkText" },
             "children": [ "\uE99A" ]
           }
         ]
@@ -3067,102 +3096,148 @@
     },
     {
       "name": "SetupOptionCard",
-      "note": "Setup composite. A clickable provider/mode choice row (AiSetupPage.xaml compact SettingsCard, IsClickEnabled). Built from the ProviderArtwork tile, a title + detail stack, and a trailing action/chevron. The row itself is transparent with a 1px `line` bottom divider (previewed here via a bottom-biased `line` border; the real card draws only the bottom edge), MinHeight 64px, and `md` radius on the enclosing group. Because it is clickable it carries the SettingsCard subtle states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`); disabled drops text to `muted`. Title is `body` BodyStrong, detail is `caption` in `muted`; the 32px artwork column and 12px gap map to tokens `6`/`3`. There is no XAML-defined selected indicator; selection is tracked by the parent ListView and is a port note.",
+      "note": "One-row provider group derived from AiSetupPage.xaml at 0131e4ce1f7937b22c69b289564087061687fa14. The outer Border owns CardBackgroundFillColorDefaultBrush, a 1px CardStrokeColorDefaultBrush stroke and 8px corners. Inherited SettingsCardPadding is 16 on all sides. A 32px ProviderArtwork Viewbox precedes the Body Strong/Caption stack by 12px; stack spacing is 4px. Body action text precedes a 13px chevron with 14px margin. By design, the catalog interaction matches CapabilityOptionRow: subtleHover/subtlePressed fill, sm corners and the shared renderer transition. The outer border and bottom divider remain setupCardStroke in every state. Pointer exit restores transparency without layout changes or tinting child text/artwork. This intentionally differs from the stock CompactChoice square corners, SettingsCard state brushes and 83ms transition; native min/max sizes and adaptive reflow remain port notes. This row is an action, not a selected ListViewItem.",
       "props": {
         "title": "Sign in with GitHub",
-        "detail": "Use your Copilot subscription. No API key needed."
+        "detail": "Use your Copilot subscription. No API key needed.",
+        "action": "Sign in"
       },
       "root": {
         "id": "setup-option-root",
-        "el": "button",
-        "attrs": { "type": "button" },
-        "layout": {
-          "mode": "horizontal",
-          "gap": "3",
-          "padding": { "x": "4", "y": "3" },
-          "align": "center",
-          "width": "fill"
-        },
+        "el": "div",
+        "layout": { "mode": "vertical", "width": "fill" },
         "appearance": {
-          "background": "$none",
-          "borderColor": "line"
-        },
-        "control": {
-          "chrome": "none",
-          "focus": { "kind": "outline", "color": "accent" }
-        },
-        "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" },
-          "disabled": { "color": "muted", "background": "$none" }
+          "background": "setupCardFill",
+          "borderColor": "setupCardStroke",
+          "borderWidth": 1,
+          "radius": "md"
         },
         "children": [
-          { "id": "setup-option-art", "component": "ProviderArtwork" },
           {
-            "id": "setup-option-text",
-            "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "id": "setup-option-action",
+            "el": "button",
+            "attrs": { "type": "button", "aria-label": "{title}" },
+            "layout": {
+              "mode": "horizontal",
+              "padding": "4",
+              "align": "center",
+              "width": "fill"
+            },
+            "appearance": {
+              "background": "$none",
+              "borderWidth": 0,
+              "radius": "sm",
+              "textAlign": "left"
+            },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" },
+              "disabled": { "color": "disabledText", "background": "setupOptionDisabled" }
+            },
             "children": [
-              { "id": "setup-option-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
-              { "id": "setup-option-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+              {
+                "id": "setup-option-art-slot",
+                "el": "span",
+                "layout": { "mode": "horizontal", "width": 32, "height": 32 },
+                "margin": { "right": "3" },
+                "children": [
+                  { "id": "setup-option-art", "component": "ProviderArtwork", "layout": { "width": 32, "height": 32 } }
+                ]
+              },
+              {
+                "id": "setup-option-text",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "1", "grow": true },
+                "children": [
+                  { "id": "setup-option-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "bodyStrong", "color": "nativeText" }, "children": [ "{title}" ] },
+                  { "id": "setup-option-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                ]
+              },
+              {
+                "id": "setup-option-action-label",
+                "el": "span",
+                "layout": { "mode": "horizontal", "width": "hug" },
+                "margin": { "left": "3" },
+                "appearance": { "textStyle": "body", "color": "nativeText" },
+                "children": [ "{action}" ]
+              },
+              {
+                "id": "setup-option-chevron",
+                "el": "span",
+                "attrs": { "aria-hidden": "true" },
+                "margin": { "left": "infoIconGap" },
+                "appearance": { "textStyle": "setupActionIcon", "color": "nativeText" },
+                "children": [ "\uE76C" ]
+              }
             ]
           },
           {
-            "id": "setup-option-chevron",
-            "el": "span",
-            "attrs": {
-              "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:12px"
-            },
-            "appearance": { "color": "muted" },
-            "children": [ "\uE76C" ]
+            "id": "setup-option-divider",
+            "el": "div",
+            "attrs": { "aria-hidden": "true" },
+            "layout": { "height": 1, "width": "fill" },
+            "appearance": { "background": "setupCardStroke" }
           }
         ]
       }
     },
     {
       "name": "CapabilityOptionRow",
-      "note": "Setup composite. A single capability-profile choice (CapabilitiesPage.xaml ListViewItem). Rows live inside a `surface` group with a 1px `line` border and `md` radius; each row is padded token `4` horizontal and `3` vertical (16,12) with a title (`body` BodyStrong) over a wrapping `caption` description in `muted`, and the recommended profile carries the RecommendedBadge. Single-selection follows focus; because it is selectable it shows the Fluent ListViewItem states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`); the selected row's accent pill/left bar is a WinUI ListViewItem template part and is a port note (no custom setter in setup XAML).",
+      "note": "CapabilitiesPage.xaml Balanced profile in a one-row group. The group owns the alpha-preserving CardBackgroundFillColorDefaultBrush backplate, 1px CardStrokeColorDefaultBrush border and 8px corners. Its transparent row has exact 16,12 padding. Body Strong title and the shared BadgeAccent sit together on the first line, 8px apart and vertically centered; Caption detail follows 4px below. Nested instances clear the standalone backplate so their enclosing group paints it once. Subtle hover/pressed are preview approximations; native ListView selection, focus and high-contrast template states remain native behavior.",
       "props": {
         "title": "Balanced",
-        "detail": "Recommended defaults for most Windows nodes."
+        "detail": "Commands, Canvas, screen capture and voice."
       },
       "root": {
         "id": "capability-row-root",
-        "el": "button",
-        "attrs": { "type": "button", "role": "option" },
-        "layout": {
-          "mode": "horizontal",
-          "gap": "2",
-          "padding": { "x": "4", "y": "3" },
-          "align": "center",
-          "width": "fill"
-        },
-        "appearance": {
-          "background": "$none",
-          "radius": "sm"
-        },
-        "control": {
-          "chrome": "none",
-          "focus": { "kind": "outline", "color": "accent" }
-        },
-        "states": {
-          "hover": { "background": "subtleHover" },
-          "pressed": { "background": "subtlePressed" },
-          "hoverPressed": { "background": "subtlePressed" }
-        },
+        "el": "div",
+        "layout": { "mode": "vertical", "width": "fill" },
+        "appearance": { "background": "setupCardFill", "borderColor": "setupCardStroke", "borderWidth": 1, "radius": "md" },
         "children": [
           {
-            "id": "capability-row-text",
-            "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "id": "capability-row-action",
+            "el": "button",
+            "attrs": { "type": "button", "aria-label": "{title}: {detail}" },
+            "layout": {
+              "mode": "vertical",
+              "gap": "1",
+              "padding": { "x": "4", "y": "3" },
+              "align": "start",
+              "width": "fill"
+            },
+            "appearance": {
+              "background": "$none",
+              "borderWidth": 0,
+              "radius": "sm",
+              "textAlign": "left"
+            },
+            "control": {
+              "chrome": "none",
+              "focus": { "kind": "outline", "color": "accent" }
+            },
+            "states": {
+              "hover": { "background": "subtleHover" },
+              "pressed": { "background": "subtlePressed" },
+              "hoverPressed": { "background": "subtlePressed" }
+            },
             "children": [
-              { "id": "capability-row-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+              {
+                "id": "capability-row-heading",
+                "el": "div",
+                "layout": { "mode": "horizontal", "gap": "2", "align": "center", "width": "hug" },
+                "children": [
+                  { "id": "capability-row-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "bodyStrong", "color": "nativeText" }, "children": [ "{title}" ] },
+                  { "id": "capability-row-badge", "component": "BadgeAccent" }
+                ]
+              },
               { "id": "capability-row-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
             ]
-          },
-          { "id": "capability-row-badge", "component": "RecommendedBadge" }
+          }
         ]
       }
     },
@@ -3199,14 +3274,14 @@
     },
     {
       "name": "SetupWizardShell",
-      "note": "Setup composite. The onboarding wizard frame (Pages/WizardPage.xaml). A vertical page: a header (mascot + `title` TitleTextBlockStyle headline + `caption` status in `muted`), the active step surface, and a footer. Page padding is 40,4,40,24 (previewed with token `6` horizontal and `1`/`5` vertical; the 40px horizontals are off-grid port notes). The step card is a `surface` sheet with a 1px `line` border, `md` radius, and token `5` (24px) padding; its MinHeight (180/140/200/260) is a runtime port note. The footer places a standard (secondary) Button and the accent (primary) Button on the ends with the SetupProgressIndicator centered; footer column gap is token `2`. Composes Button and SetupProgressIndicator.",
+      "note": "Illustrative onboarding frame composed from shared controls, not an executable wizard. The capability group follows CapabilitiesPage.xaml: one setupCardFill backplate with a 1px setupCardStroke border and md corners behind transparent rows. The grouped preview has one straight, full-width 1px setupCardStroke separator between options, with no spacing or rounded ends. Balanced reuses CapabilityOptionRow with its standalone group paint cleared; Open has no recommended badge. Native 40,4,40,24 page padding is represented by chatGutter/1/5. The footer retains shared Button and SetupProgressIndicator instances; navigation, native minimum sizes and mascot behavior remain outside this preview.",
       "root": {
         "id": "setup-wizard-root",
         "el": "section",
         "layout": {
           "mode": "vertical",
           "gap": "5",
-          "padding": { "left": "6", "right": "6", "top": "1", "bottom": "5" },
+          "padding": { "left": "chatGutter", "right": "chatGutter", "top": "1", "bottom": "5" },
           "width": "fill"
         },
         "appearance": { "background": "paper" },
@@ -3223,15 +3298,45 @@
           {
             "id": "setup-wizard-card",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "4", "padding": "5", "width": "fill" },
-            "appearance": { "background": "surface", "borderColor": "line", "radius": "md" },
+            "layout": { "mode": "vertical", "gap": "2", "width": "fill" },
             "children": [
               { "id": "setup-wizard-card-title", "el": "h2", "appearance": { "fontFamily": "display", "textStyle": "subtitle", "color": "ink" }, "children": [ "Choose what this node can do" ] },
-              { "id": "setup-wizard-opt-1", "component": "CapabilityOptionRow" },
               {
-                "id": "setup-wizard-opt-2",
-                "component": "CapabilityOptionRow",
-                "props": { "title": "Full access", "detail": "Expose every capability over MCP." }
+                "id": "setup-wizard-option-group",
+                "el": "div",
+                "layout": { "mode": "vertical", "width": "fill" },
+                "appearance": { "background": "setupCardFill", "borderColor": "setupCardStroke", "borderWidth": 1, "radius": "md" },
+                "children": [
+                  {
+                    "id": "setup-wizard-opt-1",
+                    "component": "CapabilityOptionRow",
+                    "appearance": { "background": "$none", "borderColor": "$none", "borderWidth": 0, "radius": "$none" }
+                  },
+                  {
+                    "id": "setup-wizard-option-divider",
+                    "el": "div",
+                    "attrs": { "aria-hidden": "true" },
+                    "layout": { "width": "fill", "height": 1 },
+                    "appearance": { "background": "setupCardStroke", "radius": "$none" }
+                  },
+                  {
+                    "id": "setup-wizard-opt-2",
+                    "el": "button",
+                    "attrs": { "type": "button" },
+                    "layout": { "mode": "vertical", "gap": "1", "padding": { "x": "4", "y": "3" }, "width": "fill", "align": "start" },
+                    "appearance": { "background": "$none", "borderWidth": 0, "radius": "sm", "textAlign": "left" },
+                    "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                    "states": {
+                      "hover": { "background": "subtleHover" },
+                      "pressed": { "background": "subtlePressed" },
+                      "hoverPressed": { "background": "subtlePressed" }
+                    },
+                    "children": [
+                      { "id": "setup-wizard-open-title", "el": "span", "appearance": { "textStyle": "bodyStrong", "color": "nativeText" }, "children": [ "Open" ] },
+                      { "id": "setup-wizard-open-detail", "el": "span", "appearance": { "textStyle": "caption", "color": "muted" }, "children": [ "All eight capabilities, including Camera, Location and Browser control." ] }
+                    ]
+                  }
+                ]
               }
             ]
           },
@@ -3240,9 +3345,9 @@
             "el": "div",
             "layout": { "mode": "horizontal", "gap": "2", "align": "center", "justify": "space-between", "width": "fill" },
             "children": [
-              { "id": "setup-wizard-back", "component": "Button", "props": { "children": "Back", "variant": "standard" } },
+              { "id": "setup-wizard-back", "component": "ButtonStandard", "props": { "children": "Back" }, "layout": { "width": 100 } },
               { "id": "setup-wizard-progress", "component": "SetupProgressIndicator" },
-              { "id": "setup-wizard-next", "component": "Button", "props": { "children": "Continue", "variant": "primary" } }
+              { "id": "setup-wizard-next", "component": "Button", "props": { "children": "Continue" }, "layout": { "width": 100 } }
             ]
           }
         ]
@@ -3293,7 +3398,7 @@
               { "id": "settings-card-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
             ]
           },
-          { "id": "settings-card-action", "component": "Button", "props": { "children": "Change", "variant": "standard" } }
+          { "id": "settings-card-action", "component": "ButtonStandard", "props": { "children": "Change" } }
         ]
       }
     },
@@ -3447,140 +3552,6 @@
           }
         ]
       }
-    },
-    {
-      "name": "ExampleScreen",
-      "note": "A representative Connection screen composed from the pieces above — the \"does it hang together\" check for the whole system. The status board is a freeform layer so the two cards can overlap into a Fluent-style dashboard, exercising v3 absolute positioning alongside Auto Layout.",
-      "root": {
-        "id": "example-screen-root",
-        "el": "section",
-        "class": "ds-screen",
-        "layout": {
-          "mode": "vertical",
-          "gap": "5",
-          "width": "fill"
-        },
-        "children": [
-          {
-            "id": "example-screen-head",
-            "el": "header",
-            "class": "ds-screen-head",
-            "layout": {
-              "mode": "horizontal",
-              "gap": "4",
-              "align": "start",
-              "justify": "space-between",
-              "width": "fill"
-            },
-            "children": [
-              {
-                "id": "example-screen-heading",
-                "el": "div",
-                "layout": {
-                  "mode": "vertical",
-                  "gap": "1"
-                },
-                "children": [
-                  {
-                    "id": "example-screen-eyebrow",
-                    "el": "p",
-                    "class": "ds-eyebrow",
-                    "children": [
-                      "Connection"
-                    ]
-                  },
-                  {
-                    "id": "example-screen-title",
-                    "el": "h2",
-                    "class": "ds-screen-title",
-                    "children": [
-                      "OpenClaw Windows Hub"
-                    ]
-                  }
-                ]
-              },
-              {
-                "id": "example-screen-status",
-                "component": "Badge",
-                "props": {
-                  "tone": "positive",
-                  "children": "Connected"
-                }
-              }
-            ]
-          },
-          {
-            "id": "example-screen-board",
-            "el": "div",
-            "class": "ds-grid",
-            "layout": {
-              "mode": "horizontal",
-              "width": "fill",
-              "height": 176,
-              "gap": "3"
-            },
-            "children": [
-              {
-                "id": "example-screen-gateway",
-                "component": "Card",
-                "props": {
-                  "title": "Gateway",
-                  "body": "Paired to OpenClawGateway · last seen just now."
-                },
-                "layout": {
-                  "width": 280,
-                  "height": 148
-                }
-              },
-              {
-                "id": "example-screen-node",
-                "component": "Card",
-                "props": {
-                  "title": "Windows node",
-                  "body": "6 capabilities exposed over MCP."
-                },
-                "layout": {
-                  "width": 280,
-                  "height": 148
-                }
-              }
-            ]
-          },
-          {
-            "id": "example-screen-row",
-            "el": "div",
-            "class": "ds-row",
-            "layout": {
-              "mode": "horizontal",
-              "gap": "4",
-              "align": "end",
-              "wrap": true,
-              "width": "fill"
-            },
-            "children": [
-              {
-                "id": "example-screen-field",
-                "component": "Field",
-                "props": {
-                  "label": "Gateway address",
-                  "placeholder": "127.0.0.1:18789"
-                },
-                "layout": {
-                  "grow": true
-                }
-              },
-              {
-                "id": "example-screen-connect",
-                "component": "Button",
-                "props": {
-                  "children": "Connect",
-                  "variant": "primary"
-                }
-              }
-            ]
-          }
-        ]
-      }
     }
   ]
 }
diff --git a/AGENTS.md b/AGENTS.md
index 4298bb3ab0..6fdc5d6659 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -138,23 +138,23 @@ Important current facts:
 <!-- colophon:start -->
 ## Design system
 
-This repository has a living design system at [`DESIGN.md`](DESIGN.md). These files are the **source of truth for design** (tokens, component intent, and principles) and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
-**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below. Don't copy `components.jsonc` verbatim.
+This repository has a living design system at [`DESIGN.md`](DESIGN.md). These files are the **source of truth for design** - tokens, component intent, and principles - and are framework-agnostic. `components.jsonc` shows design intent for preview; it is **not** shipping code.
+**Read it before creating or changing any UI.** To ship, port the design into this app's implementation using the port target(s) below - don't copy `components.jsonc` verbatim.
 
-- `DESIGN.md`: design tokens and rationale: brand, colors, typography, spacing, radii, shadows, principles.
-- `.agents/design/components.jsonc`: the component patterns to reuse (structure, variants, states).
+- `DESIGN.md` - design tokens and rationale: brand, colors, typography, spacing, radii, shadows, principles.
+- `.agents/design/components.jsonc` - the component patterns to reuse (structure, variants, states).
 
 Generate UI from these tokens and patterns: use token names (e.g. `accent`, `ink`, spacing step `4`, radius `md`), not raw hex or ad-hoc px; reuse the documented components instead of inventing new ones; honor the brand voice; and avoid the system's listed anti-references. If you need a value the system doesn't cover, add it to `DESIGN.md` rather than hard-coding a one-off.
 
 Use the **Colophon** tool/canvas to inspect, edit, and preview this system when available. Install the optional plugin with `copilot plugin install karkarl/colophon`. Without the extension, read and edit the files directly; Colophon is not required.
 
-**Port targets** (how a design becomes shipping code here; design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
-- Default: ships as Native WinUI 3 / C# (Windows Fluent), port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
-- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor), port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
+**Port targets** - how a design becomes shipping code here (design stays the source of truth; these say what each surface ships as and which reference/skill to port it with):
+- Default: ships as Native WinUI 3 / C# (Windows Fluent) - port via https://github.com/microsoft/win-dev-skills (helper agent: win-dev-skills)
+- area "chat", components ChatBubble, ChatComposer, ChatThread: ships as Reactor (Microsoft.UI.Reactor) - port via https://github.com/microsoft/microsoft-ui-reactor (no helper agent yet)
 - Canonical implementation owner: OpenClaw Windows (openclaw/openclaw-windows-node)
 - Examples kept aligned via: Tokens are captured by manual inspection of the app's WinUI 3 XAML/C# Fluent resources; re-inspect and update this file when the app's ThemeResource mappings or SystemAccentColor usage change.
 
-Colors in `DESIGN.md` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code (never hard-code the preview hex) so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
+Colors in `DESIGN.md` are **preview-only** swatches. When a color has a `resource` (e.g. a WinUI `ThemeResource` key), bind that resource in code - never hard-code the preview hex - so light, dark, and high-contrast themes stay correct. The shipping implementation is canonical; treat `components.jsonc` and the token values as derived visual examples, not a parallel upstream source.
 
-<sub>Managed by [Colophon](https://github.com/karkarl/colophon). Edit `DESIGN.md` to change the system; this block only points to it.</sub>
+<sub>Managed by [Colophon](https://github.com/karkarl/colophon) - edit `DESIGN.md` to change the system; this block only points to it.</sub>
 <!-- colophon:end -->
diff --git a/DESIGN.md b/DESIGN.md
index fa971b348e..8a57bc668f 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -10,11 +10,34 @@ colors:
   line: "#e5e5e5"
   accent: "#0067c0"
   accentInk: "#ffffff"
+  accentText: "#003e92"
+  setupCardFill: "#ffffffb3"
+  setupCardStroke: "#0000000f"
+  setupOptionDisabled: "#f9f9f94d"
+  providerArtworkFill: "#202020"
+  providerArtworkStroke: "#00000019"
+  providerArtworkText: "#ffffff"
   positive: "#0f7b0f"
   warning: "#9d5d00"
   critical: "#c42b1c"
   subtleHover: rgba(0,0,0,0.037)
   subtlePressed: rgba(0,0,0,0.024)
+  buttonFill: "#ffffffb3"
+  buttonHoverFill: "#f9f9f980"
+  buttonPressedFill: "#f9f9f94d"
+  buttonDisabledFill: "#f9f9f94d"
+  buttonText: "#000000e4"
+  buttonHoverText: "#000000e4"
+  buttonPressedText: "#0000009e"
+  buttonDisabledText: "#0000005c"
+  buttonBorder: "#0000000f"
+  buttonHoverBorder: "#0000000f"
+  buttonPressedBorder: "#0000000f"
+  buttonDisabledBorder: "#0000000f"
+  buttonAccentBorder: "#ffffff14"
+  buttonAccentPressedBorder: "#ffffff00"
+  buttonAccentDisabledBorder: "#ffffff00"
+  buttonAccentPressedText: "#ffffffb3"
   subtleButtonFill: "#ffffff00"
   subtleButtonHoverFill: "#00000009"
   subtleButtonPressedFill: "#00000006"
@@ -201,6 +224,16 @@ typography:
     fontSize: 48px
     fontWeight: 400
     lineHeight: 48px
+  providerSymbol:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 24px
+    fontWeight: 400
+    lineHeight: 24px
+  setupActionIcon:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 13px
+    fontWeight: 400
+    lineHeight: 13px
 spacing:
   "0": 0px
   half: 2px
@@ -241,7 +274,6 @@ x-colophon:
         content: Production reference from OpenClaw.SetupEngine.UI. Basic controls remain in Components; these previews compose those shared definitions.
         components:
           - SetupProgressIndicator
-          - RecommendedBadge
           - ProviderArtwork
           - SetupOptionCard
           - CapabilityOptionRow
@@ -249,8 +281,8 @@ x-colophon:
           - SetupWizardShell
       - id: chat
         name: Chat
-        description: Chat controls, identity badges, and the main workspace.
-        content: Production reference for Reactor chat and the native Home and Sessions workspace. Includes the workspace connection and notification flyouts. Shared building blocks remain in Components.
+        description: Chat messages, composer controls, and conversation composition.
+        content: Production reference for Reactor chat. Workspace identity controls and flyouts live in Settings; shared building blocks remain in Components.
         components:
           - ComposerPicker
           - ComposerPickerOptions
@@ -259,22 +291,39 @@ x-colophon:
           - ChatComposer
           - ChatThread
           - ChatCopyButton
-          - AgentIdentityBadge
-          - UserIdentityBadge
-          - ConnectionStatusFlyout
-          - NotificationFlyout
-          - WorkspaceShell
-          - ExampleScreen
       - id: settings
         name: Settings
-        description: Settings controls, rows, expanders, and window composition.
-        content: Production reference from OpenClaw.Tray.WinUI settings pages and HubWindow. The trailing control owns interaction on static settings cards. Shared building blocks remain in Components.
+        description: Settings patterns, workspace chrome, identity controls, and flyouts.
+        content: Production reference from OpenClaw.Tray.WinUI settings pages, HubWindow, and the Home and Sessions workspace. The trailing control owns interaction on static settings cards. Shared building blocks remain in Components.
         components:
           - SettingsSectionHeader
           - SettingsCard
           - SettingsToggleRow
           - SettingsExpanderRow
           - SettingsWindowShell
+          - NotificationFlyout
+          - ConnectionStatusFlyout
+          - WorkspaceShell
+          - AgentIdentityBadge
+          - UserIdentityBadge
+      - id: components
+        name: Components
+        components:
+          - Button
+          - ButtonStandard
+          - TextBox
+          - Field
+          - Card
+          - Badge
+          - BadgeAccent
+          - SubtleButton
+          - HyperlinkButton
+          - ToggleSwitch
+          - StatusDot
+          - Avatar
+          - AvatarStates
+          - InfoBar
+          - InfoBarStates
     meta:
       version: 1
       updatedBy: xaml+manual
@@ -374,6 +423,34 @@ x-colophon:
           dark: "#000000"
           highContrast: "#000000"
         usage: Text/glyphs on accent fills.
+      accentText:
+        resource: AccentTextFillColorPrimaryBrush
+        themes: { dark: "#99ebff", highContrast: "#ffffff" }
+        usage: Outlined accent badge text and border. Native SystemAccentColorDark2 in light, Light3 in dark, and SystemColorWindowTextColor in high contrast; not AccentFillColorDefaultBrush.
+      setupCardFill:
+        resource: CardBackgroundFillColorDefaultBrush
+        themes: { dark: "#ffffff0d", highContrast: "#000000" }
+        usage: Alpha-preserving backplate for setup choice groups. Paint once behind transparent rows, not on every nested row.
+      setupCardStroke:
+        resource: CardStrokeColorDefaultBrush
+        themes: { dark: "#00000019", highContrast: "#ffffff" }
+        usage: Native 1px setup group border and resting CompactChoice bottom divider. Unlike the generic line swatch, preserves native alpha.
+      setupOptionDisabled:
+        resource: SettingsCardBackgroundDisabled
+        themes: { dark: "#ffffff0b", highContrast: "#000000" }
+        usage: Disabled provider row uses ControlFillColorDisabledBrush; high contrast uses SystemControlBackgroundBaseLowBrush.
+      providerArtworkFill:
+        resource: SolidBackgroundFillColorBaseBrush
+        themes: { dark: "#202020", highContrast: "#000000" }
+        usage: ProviderArtwork explicitly requests Dark, even in a light setup page. High contrast still follows SystemColorWindowColor.
+      providerArtworkStroke:
+        resource: CardStrokeColorDefaultBrush
+        themes: { dark: "#00000019", highContrast: "#ffffff" }
+        usage: ProviderArtwork requested-Dark tile border; high contrast follows SystemColorWindowTextColor.
+      providerArtworkText:
+        resource: TextFillColorPrimaryBrush
+        themes: { dark: "#ffffff", highContrast: "#ffffff" }
+        usage: Representative provider fallback glyph in the tile's requested Dark theme.
       positive:
         resource: SystemFillColorSuccessBrush
         themes:
@@ -404,6 +481,70 @@ x-colophon:
           dark: rgba(255,255,255,0.0419)
           highContrast: transparent
         usage: "Pressed fill for subtle/transparent controls. Fluent SubtleFillColorTertiary (light #06000000)."
+      buttonFill:
+        resource: ButtonBackground
+        themes: { dark: "#ffffff0f", highContrast: "#000000" }
+        usage: Normal Button fill with native ControlFillColorDefault alpha, not the opaque stock-input preview.
+      buttonHoverFill:
+        resource: ButtonBackgroundPointerOver
+        themes: { dark: "#ffffff15", highContrast: "#000000" }
+        usage: ControlFillColorSecondaryBrush; high contrast uses SystemColorHighlightTextColorBrush.
+      buttonPressedFill:
+        resource: ButtonBackgroundPressed
+        themes: { dark: "#ffffff08", highContrast: "#000000" }
+        usage: ControlFillColorTertiaryBrush; high contrast uses SystemColorHighlightTextColorBrush.
+      buttonDisabledFill:
+        resource: ButtonBackgroundDisabled
+        themes: { dark: "#ffffff0b", highContrast: "#000000" }
+        usage: ControlFillColorDisabledBrush; high contrast uses SystemControlBackgroundBaseLowBrush.
+      buttonText:
+        resource: ButtonForeground
+        themes: { dark: "#ffffff", highContrast: "#ffffff" }
+        usage: TextFillColorPrimaryBrush; high contrast uses SystemColorButtonTextColor.
+      buttonHoverText:
+        resource: ButtonForegroundPointerOver
+        themes: { dark: "#ffffff", highContrast: "#ffff00" }
+        usage: TextFillColorPrimaryBrush; high contrast SystemControlHighlightBaseHighBrush resolves to SystemColorHighlightColor.
+      buttonPressedText:
+        resource: ButtonForegroundPressed
+        themes: { dark: "#ffffffc5", highContrast: "#ffff00" }
+        usage: TextFillColorSecondaryBrush; high contrast uses SystemColorHighlightColor.
+      buttonDisabledText:
+        resource: ButtonForegroundDisabled
+        themes: { dark: "#ffffff5d", highContrast: "#808080" }
+        usage: TextFillColorDisabledBrush; high contrast uses SystemColorGrayTextColor.
+      buttonBorder:
+        resource: ButtonBorderBrush
+        themes: { dark: "#ffffff12", highContrast: "#ffffff" }
+        usage: Preview-only default stroke swatch for native ControlElevationBorderBrush, not a reproduction of its 3px absolute gradient. High contrast SystemControlForegroundTransparentBrush is solid SystemColorButtonTextColor, despite its name.
+      buttonHoverBorder:
+        resource: ButtonBorderBrushPointerOver
+        themes: { dark: "#ffffff12", highContrast: "#ffff00" }
+        usage: Same native elevation gradient as rest; high contrast changes to SystemColorHighlightColor.
+      buttonPressedBorder:
+        resource: ButtonBorderBrushPressed
+        themes: { dark: "#ffffff12", highContrast: "#000000" }
+        usage: Native flat ControlStrokeColorDefaultBrush; high contrast uses SystemColorHighlightTextColor.
+      buttonDisabledBorder:
+        resource: ButtonBorderBrushDisabled
+        themes: { dark: "#ffffff12", highContrast: "#808080" }
+        usage: ControlStrokeColorDefaultBrush; high contrast SystemControlDisabledTransparentBrush is solid SystemColorGrayTextColor.
+      buttonAccentBorder:
+        resource: AccentButtonBorderBrush
+        themes: { dark: "#ffffff14", highContrast: "#ffff00" }
+        usage: Preview-only default on-accent stroke swatch for native AccentControlElevationBorderBrush. Pointer-over uses the same gradient; both high-contrast aliases resolve to SystemColorHighlightColor.
+      buttonAccentPressedBorder:
+        resource: AccentButtonBorderBrushPressed
+        themes: { dark: "#ffffff00", highContrast: "#ffff00" }
+        usage: Transparent in light/dark; high contrast SystemControlHighlightTransparentBrush resolves to SystemColorHighlightColor.
+      buttonAccentDisabledBorder:
+        resource: AccentButtonBorderBrushDisabled
+        themes: { dark: "#ffffff00", highContrast: "#808080" }
+        usage: Transparent in light/dark; high contrast uses SystemColorGrayTextColor.
+      buttonAccentPressedText:
+        resource: AccentButtonForegroundPressed
+        themes: { dark: "#00000080", highContrast: "#ffff00" }
+        usage: TextOnAccentFillColorSecondaryBrush; high contrast SystemControlHighlightBaseHighBrush resolves to SystemColorHighlightColor.
       subtleButtonFill:
         resource: SubtleButtonBackground
         themes:
@@ -753,6 +894,8 @@ Personality: native, trustworthy, calm, precise.
 - **line** {colors.line}: Borders, dividers. Fluent CardStrokeColorDefault / DividerStroke.
 - **accent** {colors.accent}: Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light).
 - **accentInk** {colors.accentInk}: Text/glyphs on accent fills.
+- **accentText** {colors.accentText}: `AccentTextFillColorPrimaryBrush` for outlined accent badge text and border. It uses Dark2 in light and Light3 in dark, not the primary button fill palette.
+- **Setup choice groups:** {colors.setupCardFill} and {colors.setupCardStroke} preserve `CardBackgroundFillColorDefaultBrush` and `CardStrokeColorDefaultBrush`, including their alpha. The group owns the backplate and 1px border; row hover/pressed fills are separate layers.
 - **positive** {colors.positive}: Success / connected states. Fluent SystemFillColorSuccess.
 - **warning** {colors.warning}: Warnings / attention. Fluent SystemFillColorCaution.
 - **critical** {colors.critical}: Errors, disconnected, destructive. Fluent SystemFillColorCritical.
@@ -853,21 +996,43 @@ This is a production-structure and geometry reference, not a pixel-identity clai
 Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.
 Optional click-through flows live in `.agents/design/prototypes.jsonc`.
 
-The catalog is organized into four families. Colophon's left navigation includes dedicated Setup, Chat, and Settings pages, defined by `x-colophon.tokens.pages` above. Each page selects existing component definitions without copying them, so shared component references continue to resolve. Basic controls live under Components. The installed Colophon version also shows the full catalog on that built-in page; it does not support filtering Components down to basic controls.
+The catalog is organized into four families through `x-colophon.tokens.pages` above. The entry with `id: components` selects the built-in Components page; Setup, Chat, and Settings select their feature-specific previews. Each of the 38 definitions has exactly one standalone page assignment: Components 15, Setup 6, Chat 7, and Settings 10. Page selections do not copy or remove definitions, so shared controls still resolve inside compositions and flyouts. Keep control examples and variants beside their basic control, not on another feature page. The old synthetic Connection example screen and separate RecommendedBadge definition have been removed.
 
 Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
 
 ComposerPickerOptions rows use full-row `subtleHover` and `subtlePressed` fills with `sm` corners, both in the catalog and in opened composer flyouts. Pointer exit restores transparency; hover never changes the checked row, accent checkmark or layout. These tokens stay transparent in high contrast, so the preview does not reproduce native MenuFlyout system-highlight overrides.
 
-- **Basic controls.** Button (primary/standard/subtle), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, ToggleSwitch, StatusDot, Avatar, InfoBar, and Card. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control.
-- **Setup.** SetupProgressIndicator, RecommendedBadge, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`.
-- **Chat.** ChatBubble (assistant prose), ChatUserBubble (sent user message), ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, WorkspaceShell, and ExampleScreen. See the Chat surface and Workspace shell sections.
-- **Settings.** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and the SettingsWindowShell host frame, ported from `OpenClaw.Tray.WinUI` pages and `HubWindow`.
+- **Basic controls and their examples (15).** Button (accent), ButtonStandard (normal), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, BadgeAccent, ToggleSwitch, StatusDot, Avatar, AvatarStates, InfoBar, InfoBarStates, and Card. ButtonStandard references Button and overrides its state brushes, just as BadgeAccent references Badge; neither duplicates shared markup. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control. AvatarStates and InfoBarStates demonstrate their parent control's presentations, not separate app features.
+- **Setup (6).** SetupProgressIndicator, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`. Recommended labels reuse BadgeAccent from Components.
+- **Chat (7).** ChatBubble (assistant prose), ChatUserBubble (sent user message), ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton. See the Chat surface section.
+- **Settings and workspace (10).** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and SettingsWindowShell, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, and WorkspaceShell. These come from `OpenClaw.Tray.WinUI` pages, `HubWindow`, and `WorkspaceWindow`. See the Workspace shell section.
 
 TextBox ships as the stock `Microsoft.UI.Xaml.Controls.TextBox`, as used by `DirectUrlBox` in `Pages/ConnectionPage.xaml`, not a custom control template. The Colophon preview uses 14px body text, 32px single-line height, `sm` corners, exact text-control padding, pointer-over and disabled resource tokens, and the accent focus underline. WinUI has no separate pressed background for the input itself; pressing enters its focused state. The browser preview approximates the native elevation border with `controlLine` and does not reproduce the native focused-fill transition or clear-button template.
 
 Card binds its title to `subtitle` (`SubtitleTextBlockStyle`, 20/28 SemiBold) and its description to `body` (`BodyTextBlockStyle`, 14/20 Regular). Its Open report action references the shared HyperlinkButton, not a separately styled link. The card remains static while the action inherits the shared control's typography, hover, pressed, disabled, and focus states.
 
+### Native normal and accent buttons
+
+Button is the accent example; ButtonStandard is its reusable normal variation. Both appear on Components. SetupWizardShell uses ButtonStandard for Back and Button for Continue; SettingsCard also uses ButtonStandard for Change. The old `variant` prop was ineffective because a CSS class could not override explicit accent appearance and states. Named component references now select the actual brushes, without duplicating button markup.
+
+The [native Button styles](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/CommonStyles/Button_themeresources.xaml) own exact 11,5,11,6 padding, a 1px border, 4px corners, normal-weight 14px content and an 83ms linear background transition. Foreground and border changes are discrete, not part of a generic all-color transition. The normal variation binds `Button*` resource aliases for every state; accent reuses the existing `accent`, `accentInk` and `chatAction*` aliases where their native resource values match. Its pressed foreground and borders have dedicated `buttonAccent*` tokens.
+
+High-contrast aliases are resolved through the Windows SDK's system resource dictionary, not inferred from their names: `SystemControlForegroundTransparentBrush` becomes button text, `SystemControlHighlightBaseHighBrush` and `SystemControlHighlightTransparentBrush` become highlight, and `SystemControlDisabledTransparentBrush` becomes gray text. The preview uses its representative black/white/yellow system palette; it is not a Windows high-contrast screenshot.
+
+`Pages/CapabilitiesPage.xaml` at production commit `0131e4ce1f7937b22c69b289564087061687fa14` uses an unstyled normal Back button and an `AccentButtonStyle` Next button, each with `MinWidth=100`. The catalog preserves its existing Continue sample label and shows both footer instances at 100px. That fixed preview width represents these short labels only: shipping code must retain the native minimum and grow for localization. The shared button itself is content-sized, with no universal 100px minimum.
+
+These are direct native style/resource mappings, **not a verified pixel-identical browser port**. Colophon cannot express `ControlElevationBorderBrush` / `AccentControlElevationBorderBrush` gradients or the normal button's `BackgroundSizing=InnerBorderEdge`; their preview borders use flat default stroke swatches. Body uses a 20px browser line box, and native font measurement/rasterization and the system focus visual (`FocusVisualMargin=-3`) remain WinUI-owned. Ship the stock Button styles and templates, not the browser approximation.
+
+### Setup badge and choice cards
+
+These references follow production commit `0131e4ce1f7937b22c69b289564087061687fa14`: `Controls/RecommendedBadge.xaml`, `Controls/ProviderArtwork.xaml`, `Pages/AiSetupPage.xaml`, and `Pages/CapabilitiesPage.xaml`. The shipped SettingsControls package is `8.3.260402-preview2`, whose [SettingsCard template](https://github.com/CommunityToolkit/Windows/blob/39c45efed2601b22170b9f6258c9cbe7e51031d1/components/SettingsControls/src/SettingsCard/SettingsCard.xaml) owns inherited padding, action-icon metrics, and interaction resources.
+
+- **Accent badge:** BadgeAccent composes Badge with Caption typography, a transparent fill, 1px `accentText` border, `sm` corners, and exact 8,4 padding. Both text and border use `AccentTextFillColorPrimaryBrush`; disabled uses `TextFillColorDisabledBrush`. It is read-only and has no hover/pressed action. Recommended is example text, not a separate control or Setup-page preview. Existing status-pill Badge instances keep their existing geometry and tones.
+- **Provider option:** the 8px-rounded group owns a 1px `setupCardStroke` border and `setupCardFill` backplate. The inner row is transparent at rest, with a bottom-only 1px divider and native MinHeight 64. Its preview uses `sm` corners to match CapabilityOptionRow, rather than the native `CompactChoice` square corners. Toolkit padding is 16 on all sides, not 16,12. Its 32px Viewbox contains the 42px ProviderArtwork tile (24px content + 8px padding + 1px border on each side); the title/detail stack sits 12px after the tile. Body Strong and Caption are separated by 4px. Trailing body action text precedes a 13px chevron with 14px leading margin. The artwork explicitly requests Dark, even on light pages; the representative glyph is not provider branding.
+- **Capability option:** the same group backplate surrounds a transparent ListViewItem with 16,12 padding. Body Strong title and BadgeAccent share the first line with an 8px gap; Caption detail follows 4px below. A full-width right-aligned badge is not the production layout. Nested rows in SetupWizardShell clear their standalone group paint so the parent paints the backplate once. The grouped wizard example adds one straight, full-width 1px `setupCardStroke` separator between options, with no gap or rounded divider ends.
+
+The catalog deliberately gives SetupOptionCard the same hover/pressed treatment as CapabilityOptionRow: `subtleHover` / `subtlePressed`, `sm` corners, and the shared renderer transition. The outer border and bottom divider stay `setupCardStroke`, with no extra hover underline. Pointer exit restores transparency without changing layout or tinting text/artwork. This user-directed preview choice differs from the stock SettingsCard state brushes, gradient border and 83ms transition; it does not change shipping code. Native minimum sizes, the action label's 112px maximum width, SettingsCard adaptive reflow, ListView selection/focus visuals, and provider image loading remain native behavior. Both preview controls use transparent interaction fills in high contrast, rather than simulating native system-highlight states.
+
 StatusDot is a non-interactive 10x10 indicator with `pill` corners and a semantic fill. Its standalone preview uses explicit Auto Layout so the empty span retains its width and height instead of collapsing as inline text.
 
 SubtleButton follows [`SubtleButtonStyle` and `ButtonPadding` in WinUI](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/Button_themeresources.xaml): 11,5,11,6 content padding, a 1px border, `ControlCornerRadius` (4px), and normal-weight 14px content. The default example is content-sized text, not a 40x40 icon button. The workspace's 40x40 icon buttons and their local padding overrides are usage variants, not defaults of the style. Rest and disabled backgrounds remain transparent in light/dark; hover and pressed states change background, border, and foreground through the native resource aliases above. Ship with `Style="{StaticResource SubtleButtonStyle}"` and leave its template intact.

From d780a9476932e29837bcabdd40a9b0456980a349 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Tue, 20 Oct 2026 16:30:32 -0400
Subject: [PATCH 31/32] design(colophon): refine settings and notification
 flyout previews

Checkpoint passive iconless settings rows, shared geometry, full-header disclosure and a content-only Settings shell. Restore the Fluent chevron slot and add the notification flyout presenter backplate with token-bound shadow and preview clearance.

Disclosure remains immediate with a fixed chevron. Native animation support is handed off to Colophon upstream; current-source browser and native visual proof remain uncollected. Application code and the installed plugin are unchanged.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc | 233 ++++++++++++++++++--------------
 DESIGN.md                       |  50 ++++++-
 2 files changed, 174 insertions(+), 109 deletions(-)

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 3200549a67..99b8b9cc89 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1852,7 +1852,7 @@
     },
     {
       "name": "NotificationFlyout",
-      "note": "App notifications flyout from Controls/NotificationFlyoutContent.xaml (#1541), opened from the Workspace footer bell. A 352px column: a right-aligned Clear all link, a scrolling list of notification cards, and a footer pairing an Open notifications link with a tertiary active-count caption. Each card is a `surface` (CardBackgroundFillColorDefault) panel with a 1px `line` border, `md` (8px) radius and 12px (token 3) padding, laying out a leading severity glyph, a stack of body-strong title + caption message + caption `muted` metadata, and a trailing dismiss button. A recurrence count rides a `warning` Badge beside the title. An empty state swaps the list for a single centered card. Severity glyphs are Segoe Fluent Icons in-app; previewed here with a stroked alert glyph.",
+      "note": "App notifications flyout from Controls/NotificationFlyoutContent.xaml (#1541), opened from the Workspace footer bell. The preview includes its presenter backplate: a surface sheet, 1px line frame, md (8px) corners, md drop shadow and 12px inset, consistent with the ConnectionStatusFlyout reference. Its 378px border box preserves the 352px content column. A transparent 32px outer margin leaves room for the shadow inside Colophon's overflow-clipped flyout portal; it is preview clearance, not native content padding or exact popup placement. Production keeps the stock FlyoutPresenter with FlyoutPresenterBackground (AcrylicInAppFillColorDefaultBrush), FlyoutBorderThemeBrush, FlyoutContentPadding and platform shadow; the solid surface and named shadow are browser approximations. The content has a right-aligned Clear all link, notification cards, and a footer pairing Open notifications with an active-count caption. Each card retains its surface panel, 1px line border, md radius and 12px padding, with a leading severity glyph, title/message/metadata stack and dismiss button. A recurrence count rides a warning Badge beside the title. An empty state swaps the list for a centered card. Severity glyphs are Segoe Fluent Icons in-app; previewed here with a stroked alert glyph.",
       "props": {
         "title": "Approval required",
         "message": "A Windows node capability is waiting for your approval.",
@@ -1865,7 +1865,17 @@
         "layout": {
           "mode": "vertical",
           "gap": "2",
-          "width": 352
+          "padding": "3",
+          "width": 378
+        },
+        "margin": "6",
+        "appearance": {
+          "background": "surface",
+          "borderColor": "line",
+          "borderWidth": 1,
+          "color": "ink",
+          "radius": "md",
+          "shadow": "md"
         },
         "children": [
           {
@@ -3355,19 +3365,19 @@
     },
     {
       "name": "SettingsSectionHeader",
-      "note": "Settings control. The group label above a stack of settings cards (used across SettingsPage / PermissionsPage / SandboxPage). Non-interactive. `body` BodyStrongTextBlockStyle in `ink`, with margin 4,18,4,4 (previewed as token `1` sides, `4` top, `1` bottom; the 18px top is off-grid and a port note).",
+      "note": "Settings control. The group label above a stack of settings cards (used across SettingsPage / PermissionsPage / SandboxPage), including General in SettingsWindowShell. Non-interactive. `bodyStrong` BodyStrongTextBlockStyle in `ink` gives the heading semibold weight without changing its 14px size or 20px line height, with margin 4,18,4,4 (previewed as token `1` sides, `4` top, `1` bottom; the 18px top is off-grid and a port note).",
       "props": { "children": "Permissions" },
       "root": {
         "id": "settings-section-header-root",
         "el": "h2",
         "margin": { "top": "4", "right": "1", "bottom": "1", "left": "1" },
-        "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" },
+        "appearance": { "fontFamily": "body", "textStyle": "bodyStrong", "color": "ink" },
         "children": [ "{children}" ]
       }
     },
     {
       "name": "SettingsCard",
-      "note": "Settings composite. The canonical settings row (hand-rolled Border, not the toolkit SettingsCard). STATIC: the card itself has no hover/pressed; the trailing control owns interaction. A `surface`-less `paper` Border with a 1px `line` (CardStrokeColorDefault) stroke, `md` radius (8px), and token `4` (16px) padding (some cards use 16,14; the 14 is off-grid). Layout is an optional 36px leading icon column, a growing content column (title `body` BodyStrong in `ink` over a wrapping `caption` description in `muted`), and a trailing Auto control column. Cards stack with token `2` (8px) spacing.",
+      "note": "Settings composite derived from SettingsPage.xaml's hand-rolled Border, with iconless Windows Settings alignment. The outer frame paints CardBackgroundFillColorDefaultBrush once, with a 1px CardStrokeColorDefaultBrush border and md (8px) corners. The passive row has 16px padding, no leading icon or reserved gutter, and a growing left-aligned Body/Caption column with no title/detail gap and a 24px trailing margin. Only the normal Change button has hover/pressed states or a keyboard stop. The row and backplate stay unchanged under the pointer. The two-line sample is content-sized at 68px inside its 1px frame, not a fixed height.",
       "props": {
         "title": "Startup",
         "detail": "Launch OpenClaw when you sign in to Windows."
@@ -3375,36 +3385,34 @@
       "root": {
         "id": "settings-card-root",
         "el": "div",
-        "layout": { "mode": "horizontal", "gap": "3", "padding": "4", "align": "center", "width": "fill" },
-        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "layout": { "mode": "vertical", "width": "fill" },
+        "appearance": { "background": "setupCardFill", "borderColor": "setupCardStroke", "borderWidth": 1, "radius": "md" },
         "children": [
           {
-            "id": "settings-card-icon",
-            "el": "span",
-            "attrs": {
-              "aria-hidden": "true",
-              "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px"
-            },
-            "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 36 },
-            "appearance": { "color": "ink" },
-            "children": [ "\uE7E8" ]
-          },
-          {
-            "id": "settings-card-text",
+            "id": "settings-card-row",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "layout": { "mode": "horizontal", "gap": "0", "padding": "4", "align": "center", "width": "fill" },
+            "appearance": { "background": "$none", "textAlign": "left" },
             "children": [
-              { "id": "settings-card-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
-              { "id": "settings-card-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+              {
+                "id": "settings-card-text",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "0", "grow": true },
+                "margin": { "right": "5" },
+                "children": [
+                  { "id": "settings-card-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+                  { "id": "settings-card-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                ]
+              },
+              { "id": "settings-card-action", "component": "ButtonStandard", "props": { "children": "Change" } }
             ]
-          },
-          { "id": "settings-card-action", "component": "ButtonStandard", "props": { "children": "Change" } }
+          }
         ]
       }
     },
     {
       "name": "SettingsToggleRow",
-      "note": "Settings composite. A SettingsCard whose trailing control is the Fluent ToggleSwitch (the most common settings row). Same static `paper` card: 1px `line` stroke, `md` radius, token `4` padding, token `1` title/detail stack. The ToggleSwitch owns the hover/pressed states (see ToggleSwitch); the card is static. Composes ToggleSwitch.",
+      "note": "Settings composite with the same single setupCardFill backplate, 1px setupCardStroke border and md corners as SettingsCard. The passive row has 16px padding and no icon gutter. Its left-aligned Body/Caption column has no title/detail gap and a 24px trailing margin. Only the shared ToggleSwitch has hover/pressed states, changes checked state, or participates in keyboard navigation. Its native 40x20 track is centered in a 36px-high compact control slot. The two-line sample is 68px inside its frame. SettingsExpanderRow reuses ToggleSwitch directly in its own item layout, not this padded standalone card. Shipping behavior is unchanged.",
       "props": {
         "title": "Run at startup",
         "detail": "Start the OpenClaw tray automatically."
@@ -3412,45 +3420,58 @@
       "root": {
         "id": "settings-toggle-root",
         "el": "div",
-        "layout": { "mode": "horizontal", "gap": "3", "padding": "4", "align": "center", "width": "fill" },
-        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "layout": { "mode": "vertical", "width": "fill" },
+        "appearance": { "background": "setupCardFill", "borderColor": "setupCardStroke", "borderWidth": 1, "radius": "md" },
         "children": [
           {
-            "id": "settings-toggle-text",
+            "id": "settings-toggle-row",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+            "layout": { "mode": "horizontal", "gap": "0", "padding": "4", "align": "center", "width": "fill" },
+            "appearance": { "background": "$none", "textAlign": "left" },
             "children": [
-              { "id": "settings-toggle-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
-              { "id": "settings-toggle-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+              {
+                "id": "settings-toggle-text",
+                "el": "div",
+                "layout": { "mode": "vertical", "gap": "0", "grow": true },
+                "margin": { "right": "5" },
+                "children": [
+                  { "id": "settings-toggle-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+                  { "id": "settings-toggle-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                ]
+              },
+              {
+                "id": "settings-toggle-control",
+                "el": "div",
+                "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 40, "height": 36 },
+                "children": [
+                  { "id": "settings-toggle-switch", "component": "ToggleSwitch", "props": { "label": "{title}" } }
+                ]
+              }
             ]
-          },
-          { "id": "settings-toggle-switch", "component": "ToggleSwitch", "props": { "label": "{title}" } }
+          }
         ]
       }
     },
     {
       "name": "SettingsExpanderRow",
-      "note": "Settings composite. An expandable settings group built on the stock WinUI Expander (SandboxPage.xaml), not the toolkit SettingsExpander. The header is an interactive row (ColumnSpacing 14, previewed token `3`; header padding 0,4) with an optional leading icon, a growing title (`body` BodyStrong) over `caption` description, and a trailing chevron (U+E70D) that rotates when open. The header carries stock Expander subtle states: hover = SubtleFillColorSecondary (`subtleHover`), pressed = SubtleFillColorTertiary (`subtlePressed`). The expanded content is a StackPanel, token `3` (12px) spacing, padding 0,4. Previewed expanded.",
+      "note": "Settings composite based on Community Toolkit SettingsExpander/SettingsCard at 34a57f969bf7966e0a3cbe9d4d10a47758d097a0, adapted to the requested iconless Windows Settings alignment. The entire header is one disclosure target with subtleHover/subtlePressed feedback, click/Enter/Space activation and browser-native expanded accessibility. The child row remains passive except for its shared ToggleSwitch. Native details/summary keeps each instance independent, preserves child switch state, and removes collapsed content from layout and keyboard navigation without shrinking focusable children to zero. Starts expanded. Header and child have a 16px left inset, 16px vertical padding, zero title/detail gap, a 24px trailing text margin, Body 20px and Caption 16px line heights: both shown rows are content-sized at 68px. The flex summary removes the browser triangle and RTL workaround. Header padding is 16,16,4,16; the trailing 32x32 slot has 8px right margin and a centered 16px Segoe Fluent ChevronDown glyph. This decorative span is part of the same header target, not a second button. The glyph retains the original fixed downward direction; state-linked direction and animation remain unimplemented. Child padding is 16,16,44,16, with the shared 40x20 switch centered in a 36px slot; no wrapper padding. WinUI Expander.xaml at 09cfc8ff3fbf556166dd813ae9b81646716f54bf animates downward opening from negative measured content height to zero over 333ms (0,0,0,1), and closing back over 167ms (1,1,0,1) before collapsing visibility. Its clipped translation and AnimatedChevronUpDownSmallVisualSource need additional disclosure support beyond the installed Colophon toggle transitions, so this preview opens/closes immediately. Native animation, system motion preferences, minimums and adaptive reflow remain port requirements. Application code is unchanged.",
       "props": {
         "title": "Advanced sandbox",
         "detail": "Fine-tune the command execution sandbox."
       },
       "root": {
         "id": "settings-expander-root",
-        "el": "div",
-        "layout": { "mode": "vertical", "width": "fill" },
-        "appearance": { "background": "paper", "borderColor": "line", "radius": "md" },
+        "el": "details",
+        "attrs": { "open": "" },
+        "layout": { "mode": "none", "width": "fill" },
+        "appearance": { "background": "setupCardFill", "borderColor": "setupCardStroke", "borderWidth": 1, "radius": "md" },
         "children": [
           {
             "id": "settings-expander-header",
-            "el": "button",
-            "attrs": { "type": "button", "aria-expanded": "true" },
-            "layout": { "mode": "horizontal", "gap": "3", "padding": { "x": "4", "y": "3" }, "align": "center", "width": "fill" },
-            "appearance": { "background": "$none", "radius": "md" },
-            "control": {
-              "chrome": "none",
-              "focus": { "kind": "outline", "color": "accent" }
-            },
+            "el": "summary",
+            "attrs": { "role": "button", "tabindex": "0", "aria-label": "{title}" },
+            "layout": { "mode": "horizontal", "gap": "0", "padding": { "left": "4", "top": "4", "right": "1", "bottom": "4" }, "align": "center", "width": "fill" },
+            "appearance": { "background": "$none", "borderWidth": 0, "radius": "md", "color": "ink", "textAlign": "left" },
             "states": {
               "hover": { "background": "subtleHover" },
               "pressed": { "background": "subtlePressed" },
@@ -3458,32 +3479,78 @@
             },
             "children": [
               {
-                "id": "settings-expander-text",
-                "el": "div",
-                "layout": { "mode": "vertical", "gap": "1", "grow": true, "width": "fill" },
+                "id": "settings-expander-header-card",
+                "el": "span",
+                "layout": { "mode": "vertical", "padding": "0", "grow": true },
                 "children": [
-                  { "id": "settings-expander-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
-                  { "id": "settings-expander-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                  {
+                    "id": "settings-expander-text",
+                    "el": "span",
+                    "layout": { "mode": "vertical", "gap": "0" },
+                    "margin": { "right": "5" },
+                    "appearance": { "textAlign": "left" },
+                    "children": [
+                      { "id": "settings-expander-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "{title}" ] },
+                      { "id": "settings-expander-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "{detail}" ] }
+                    ]
+                  }
                 ]
               },
               {
-                "id": "settings-expander-chevron",
+                "id": "settings-expander-chevron-slot",
                 "el": "span",
-                "attrs": {
-                  "aria-hidden": "true",
-                  "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:12px"
-                },
-                "appearance": { "color": "muted" },
-                "children": [ "\uE70D" ]
+                "attrs": { "aria-hidden": "true" },
+                "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 32, "height": 32 },
+                "margin": { "right": "2" },
+                "children": [
+                  {
+                    "id": "settings-expander-chevron",
+                    "el": "span",
+                    "appearance": { "textStyle": "chatIcon", "color": "ink" },
+                    "children": [ "\uE70D" ]
+                  }
+                ]
               }
             ]
           },
+          {
+            "id": "settings-expander-divider",
+            "el": "div",
+            "attrs": { "aria-hidden": "true" },
+            "layout": { "height": 1, "width": "fill" },
+            "appearance": { "background": "setupCardStroke" }
+          },
           {
             "id": "settings-expander-content",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "3", "padding": { "x": "4", "y": "3" }, "width": "fill" },
+            "layout": { "mode": "vertical", "gap": "0", "padding": "0", "width": "fill" },
             "children": [
-              { "id": "settings-expander-child", "component": "SettingsToggleRow", "props": { "title": "Allow network access", "detail": "Let sandboxed commands reach the network." } }
+              {
+                "id": "settings-expander-child",
+                "el": "div",
+                "layout": { "mode": "horizontal", "gap": "0", "padding": { "left": "4", "top": "4", "right": "settingsItemEnd", "bottom": "4" }, "align": "center", "width": "fill" },
+                "appearance": { "background": "$none", "borderWidth": 0, "textAlign": "left" },
+                "children": [
+                  {
+                    "id": "settings-expander-item-text",
+                    "el": "div",
+                    "layout": { "mode": "vertical", "gap": "0", "grow": true },
+                    "margin": { "right": "5" },
+                    "children": [
+                      { "id": "settings-expander-item-title", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "Allow network access" ] },
+                      { "id": "settings-expander-item-detail", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "muted" }, "children": [ "Let sandboxed commands reach the network." ] }
+                    ]
+                  },
+                  {
+                    "id": "settings-expander-item-control",
+                    "el": "div",
+                    "layout": { "mode": "horizontal", "align": "center", "justify": "center", "width": 40, "height": 36 },
+                    "children": [
+                      { "id": "settings-expander-item-switch", "component": "ToggleSwitch", "props": { "label": "Allow network access" } }
+                    ]
+                  }
+                ]
+              }
             ]
           }
         ]
@@ -3491,59 +3558,17 @@
     },
     {
       "name": "SettingsWindowShell",
-      "note": "Settings composite. The Settings host window frame (Windows/HubWindow.xaml). MinWidth 1000, Mica backdrop, title bar captioned \"OpenClaw Settings\". A left NavigationView rail (pane toggle and the stock settings item hidden) sits beside a scrolling content column padded token `5` (24px) with a MaxWidth of 900px (port note). The bottom of the window hosts a 40px status pill and a 40x40 toolbar button cluster. Composes SettingsSectionHeader and SettingsToggleRow; the nav items reuse the subtle-button interaction model.",
+      "note": "Settings composite, shown as a content-only window sample per user direction: no left navigation pane or hidden navigation keyboard stops. The full-width content column has 24px padding and a 4px card gap matching the supplied Windows Settings reference. General uses the shared semibold SettingsSectionHeader. SettingsToggleRow remains passive around its switch; SettingsExpanderRow has one actionable header and independently interactive expanded content. All settings text shares the iconless 16px left inset. Production Windows/HubWindow.xaml remains unchanged, including its NavigationView, MinWidth 1000, Mica backdrop, title bar, 900px maximum content width and bottom status/toolbar; this sample does not claim to reproduce the complete native window.",
       "root": {
         "id": "settings-window-root",
         "el": "section",
-        "layout": { "mode": "horizontal", "width": "fill" },
+        "layout": { "mode": "vertical", "width": "fill" },
         "appearance": { "background": "paper" },
         "children": [
-          {
-            "id": "settings-window-nav",
-            "el": "nav",
-            "layout": { "mode": "vertical", "gap": "1", "padding": "2", "width": 240 },
-            "appearance": { "background": "surface", "borderColor": "line" },
-            "children": [
-              {
-                "id": "settings-window-nav-general",
-                "el": "button",
-                "attrs": { "type": "button", "aria-current": "page" },
-                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2", "y": "2" }, "align": "center", "width": "fill" },
-                "appearance": { "background": "subtleHover", "radius": "sm", "color": "ink" },
-                "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
-                "states": {
-                  "hover": { "background": "subtleHover" },
-                  "pressed": { "background": "subtlePressed" },
-                  "hoverPressed": { "background": "subtlePressed" }
-                },
-                "children": [
-                  { "id": "settings-window-nav-general-glyph", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px" }, "appearance": { "color": "ink" }, "children": [ "\uE713" ] },
-                  { "id": "settings-window-nav-general-label", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "General" ] }
-                ]
-              },
-              {
-                "id": "settings-window-nav-perms",
-                "el": "button",
-                "attrs": { "type": "button" },
-                "layout": { "mode": "horizontal", "gap": "2", "padding": { "x": "2", "y": "2" }, "align": "center", "width": "fill" },
-                "appearance": { "background": "$none", "radius": "sm", "color": "ink" },
-                "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
-                "states": {
-                  "hover": { "background": "subtleHover" },
-                  "pressed": { "background": "subtlePressed" },
-                  "hoverPressed": { "background": "subtlePressed" }
-                },
-                "children": [
-                  { "id": "settings-window-nav-perms-glyph", "el": "span", "attrs": { "aria-hidden": "true", "style": "font-family:'Segoe Fluent Icons','Segoe MDL2 Assets',sans-serif;font-size:16px" }, "appearance": { "color": "ink" }, "children": [ "\uE72E" ] },
-                  { "id": "settings-window-nav-perms-label", "el": "span", "appearance": { "fontFamily": "body", "textStyle": "body", "color": "ink" }, "children": [ "Permissions" ] }
-                ]
-              }
-            ]
-          },
           {
             "id": "settings-window-content",
             "el": "div",
-            "layout": { "mode": "vertical", "gap": "2", "padding": "5", "grow": true, "width": "fill" },
+            "layout": { "mode": "vertical", "gap": "1", "padding": "5", "grow": true, "width": "fill" },
             "children": [
               { "id": "settings-window-section", "component": "SettingsSectionHeader", "props": { "children": "General" } },
               { "id": "settings-window-row-1", "component": "SettingsToggleRow" },
diff --git a/DESIGN.md b/DESIGN.md
index 8a57bc668f..3abb038b99 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -255,6 +255,7 @@ spacing:
   infoIconGap: 14px
   chatGutter: 40px
   workspaceSelectorEnd: 28px
+  settingsItemEnd: 44px
 rounded:
   sm: 4px
   md: 8px
@@ -294,7 +295,7 @@ x-colophon:
       - id: settings
         name: Settings
         description: Settings patterns, workspace chrome, identity controls, and flyouts.
-        content: Production reference from OpenClaw.Tray.WinUI settings pages, HubWindow, and the Home and Sessions workspace. The trailing control owns interaction on static settings cards. Shared building blocks remain in Components.
+        content: References from OpenClaw.Tray.WinUI settings pages, HubWindow, and the Home and Sessions workspace. Iconless settings rows share the setup backplate and 16px left text inset. Ordinary rows and expanded children stay passive around their trailing actions; the entire expander header has hover/pressed feedback and immediate browser-native expand/collapse. Native WinUI animation remains a port requirement. The Settings shell sample has no left pane. Shared building blocks remain in Components.
         components:
           - SettingsSectionHeader
           - SettingsCard
@@ -430,11 +431,11 @@ x-colophon:
       setupCardFill:
         resource: CardBackgroundFillColorDefaultBrush
         themes: { dark: "#ffffff0d", highContrast: "#000000" }
-        usage: Alpha-preserving backplate for setup choice groups. Paint once behind transparent rows, not on every nested row.
+        usage: Shared alpha-preserving backplate for setup choice groups and settings cards. Paint once behind transparent rows, not on every nested row.
       setupCardStroke:
         resource: CardStrokeColorDefaultBrush
         themes: { dark: "#00000019", highContrast: "#ffffff" }
-        usage: Native 1px setup group border and resting CompactChoice bottom divider. Unlike the generic line swatch, preserves native alpha.
+        usage: Native 1px setup/settings frame border and dividers. Unlike the generic line swatch, preserves native alpha.
       setupOptionDisabled:
         resource: SettingsCardBackgroundDisabled
         themes: { dark: "#ffffff0b", highContrast: "#000000" }
@@ -895,7 +896,7 @@ Personality: native, trustworthy, calm, precise.
 - **accent** {colors.accent}: Primary actions, links, selection, focus. Follows SystemAccentColor (default AccentDark1 on light).
 - **accentInk** {colors.accentInk}: Text/glyphs on accent fills.
 - **accentText** {colors.accentText}: `AccentTextFillColorPrimaryBrush` for outlined accent badge text and border. It uses Dark2 in light and Light3 in dark, not the primary button fill palette.
-- **Setup choice groups:** {colors.setupCardFill} and {colors.setupCardStroke} preserve `CardBackgroundFillColorDefaultBrush` and `CardStrokeColorDefaultBrush`, including their alpha. The group owns the backplate and 1px border; row hover/pressed fills are separate layers.
+- **Setup and settings cards:** {colors.setupCardFill} and {colors.setupCardStroke} preserve `CardBackgroundFillColorDefaultBrush` and `CardStrokeColorDefaultBrush`, including their alpha. The frame owns the single backplate and 1px border. Setup choice rows and actionable expander headers have separate hover/pressed layers; ordinary settings rows and expanded children stay static around their action controls. Existing token names are retained because both surfaces bind the same native resources.
 - **positive** {colors.positive}: Success / connected states. Fluent SystemFillColorSuccess.
 - **warning** {colors.warning}: Warnings / attention. Fluent SystemFillColorCaution.
 - **critical** {colors.critical}: Errors, disconnected, destructive. Fluent SystemFillColorCritical.
@@ -983,7 +984,7 @@ The landing window is the native Home and Sessions workspace (`Windows/Workspace
 - **Menu.** Home is a 36px row with 4px horizontal and 2px vertical outer margins, a 3x16 accent indicator and the original `Chat.svg` at 22px centered in a 24px column. The iconless native presenter reserves 8px before that column, followed by a 16px gap to Home. The Sessions header is 40px tall with 16px leading and 4px trailing insets, 14px semibold text, and a 40x36 add button. No conversations to show replaces session rows in the supplied state; add is disabled while disconnected.
 - **Owner footer.** The PaneFooter uses 4,8,4,8 margins and a 4px column gap. The Owner button is the shared `UserIdentityBadge`, with native SubtleButton states, 8px padding and a retained 1px border, a 24px PersonPicture, 12px column spacing and a 10px status dot followed by a 4px gap and Caption text. `statusTone` follows connection state, never authorization. It reads the authenticated `users.self` profile or falls back to Owner. The notification button is 40x36 with 8px padding, vertically centered against Owner, containing the original 20px `Notifications.svg` and a 16px InfoBadge offset -6px above and 8px beyond the icon's right edge.
 - **Connection status.** `Controls/GatewayStatusContent.xaml` is a 304px flyout of Gateway, Operator, and Node rows split by 1px `line` dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail, and reveals an `accent` action link (Reconnect, Approve) only when that layer needs one. The dot binds the Fluent system fill for its state: `positive` connected, `warning` attention, `critical` error, `muted` unknown, never color alone.
-- **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px flyout: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. Each card is a `surface` panel with a 1px `line` border, `md` (8px) corners, and 12px padding, laying out a leading severity glyph, a title/message/metadata stack, and a dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card.
+- **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px content column: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. The preview now includes a presenter backplate around the whole column, not just the individual cards: a `surface` fill, 1px `line` frame, `md` (8px) corners, `md` drop shadow and 12px inset. The 378px border box preserves the 352px content width. A transparent 32px outer margin gives the shadow room inside Colophon's overflow-clipped portal; this is preview clearance, not native content padding or exact popup placement. Each notification card retains its own `surface` panel, 1px `line` border, `md` corners, and 12px padding, laying out a severity glyph, title/message/metadata stack, and dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card. Production keeps the stock [FlyoutPresenter](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/CommonStyles/FlyoutPresenter_themeresources.xaml): bind `FlyoutPresenterBackground`, `FlyoutBorderThemeBrush`, `FlyoutContentPadding` and the native platform shadow rather than copying the solid browser sheet or shadow values. The browser's 12px inset approximates native 16,15,16,17 padding, and its 1px frame does not simulate the native 2px high-contrast override.
 - **Artwork and glyphs.** Pane, Back, Forward and Add use actual Segoe Fluent glyphs U+E90C, U+E76B, U+E76C and U+E710 at 16px, not hand-drawn SVG substitutes. Home and Notifications use exact production SVG bytes, including their authored gradients; these are artwork, not theme-color tokens. The title uses `BrandAssets.RedBotMarkUri` at 16px with a 16px gap before its 12px title. Native caption glyph references are U+E921, U+E922 and U+E8BB. The owner fallback uses PersonPicture's Contact glyph U+E77B at 24 * 0.42 = 10.08px.
 - **Content.** One `NavigationViewContentBackground` layer uses `chatLayer`, with a 1px top/left `line` stroke and the native 8,0,0,0 corner shape (`workspaceContent`). The disconnected placeholder is centered: U+E8F2 at 48px, Subtitle text, and the standard 32px Open Connection button, separated by 12px gaps.
 
@@ -1033,6 +1034,45 @@ These references follow production commit `0131e4ce1f7937b22c69b289564087061687f
 
 The catalog deliberately gives SetupOptionCard the same hover/pressed treatment as CapabilityOptionRow: `subtleHover` / `subtlePressed`, `sm` corners, and the shared renderer transition. The outer border and bottom divider stay `setupCardStroke`, with no extra hover underline. Pointer exit restores transparency without changing layout or tinting text/artwork. This user-directed preview choice differs from the stock SettingsCard state brushes, gradient border and 83ms transition; it does not change shipping code. Native minimum sizes, the action label's 112px maximum width, SettingsCard adaptive reflow, ListView selection/focus visuals, and provider image loading remain native behavior. Both preview controls use transparent interaction fills in high contrast, rather than simulating native system-highlight states.
 
+### Settings cards and disclosure feedback
+
+SettingsCard, SettingsToggleRow and SettingsExpanderRow reuse the setup cards' `setupCardFill` backplate, 1px `setupCardStroke` border and `md` outer corners. These map to the actual `CardBackgroundFillColorDefaultBrush` / `CardStrokeColorDefaultBrush` pair used by the hand-rolled Borders in `Pages/SettingsPage.xaml`, rather than painting the page background on the card. No new palette or duplicate control definitions are needed.
+
+The supplied Windows Settings screenshot guides alignment and spacing, not a new set of icons. OpenClaw's examples are iconless: SettingsCard, SettingsToggleRow, the expander header and its children all start text 16px inside the frame. There is no leading icon, empty icon column, or 58px child indentation. Body titles and Caption descriptions are left-aligned with zero stack gap and a 24px margin before trailing controls. Standalone cards use 16px padding and a content-derived 68px inner height for the shown two-line labels (70px including the frame). The expander header and expanded child use the same 20px/16px text line heights and 16px top/bottom padding, so both two-line rows are equally tall. SettingsWindowShell uses a 4px gap between cards. Its General section heading uses `bodyStrong` (`BodyStrongTextBlockStyle`, 14/20 SemiBold), as do other shared SettingsSectionHeader instances.
+
+SettingsCard, SettingsToggleRow and the expanded child have **no row-wide hover or pressed states**. Their wrappers are plain, non-focusable containers; clicking text/background cannot activate Change or toggle a switch. The expander header is the exception: its entire surface is one disclosure target with `subtleHover` / `subtlePressed` feedback, not a passive row with a separate chevron button. Click, Enter and Space expand/collapse it. ToggleSwitch retains its independent state and keyboard activation behavior; clicking the expanded switch does not collapse the header. Setup choice-row feedback is unchanged.
+
+SettingsWindowShell is a content-only sample: the left navigation subtree is removed, not hidden or reduced to zero width. Its content fills the available width with 24px padding. This is a user-directed catalog change, not a change to the shipping HubWindow NavigationView or the separate WorkspaceShell.
+
+The expander group has one straight, full-width 1px divider and one backplate. The child uses the shared ToggleSwitch inside the adapted Toolkit item layout, not a padded standalone SettingsToggleRow inside another padded container. Standalone and expanded switches both center their 40x20 track in a 36px-high control slot. SettingsWindowShell references these same definitions. High-contrast previews retain the system-colored frame; they do not claim native Windows high-contrast proof.
+
+### Toolkit settings expander geometry
+
+SettingsExpanderRow uses Community Toolkit's [SettingsExpander template](https://github.com/CommunityToolkit/Windows/blob/34a57f969bf7966e0a3cbe9d4d10a47758d097a0/components/SettingsControls/src/SettingsExpander/SettingsExpander.xaml) and [SettingsCard template](https://github.com/CommunityToolkit/Windows/blob/34a57f969bf7966e0a3cbe9d4d10a47758d097a0/components/SettingsControls/src/SettingsCard/SettingsCard.xaml) as geometry references, with user-directed iconless alignment, equal two-line row spacing and full-header disclosure feedback. Production SandboxPage uses a stock WinUI Expander and intentionally does not use the Toolkit's item indentation. Application code remains unchanged.
+
+| Part | Preview value and Toolkit provenance |
+| --- | --- |
+| Header padding (left, top, right, bottom) | 16,16,4,16, matching native Toolkit SettingsCard |
+| HeaderPanel margin | 0,0,24,0 |
+| Title / description stack spacing | 0; Body 14/20 above Caption 12/16, both left-aligned |
+| Disclosure affordance | 32x32 decorative slot, margin 0,0,8,0, centered 16px Segoe Fluent ChevronDown glyph; part of the full-header target, not a second button |
+| Expanded content wrapper padding / spacing | 0 / 0 |
+| Non-clickable item padding | 16,16,44,16 (`4`, `4`, `settingsItemEnd`, `4`); replaces Toolkit's 58px leading icon indentation with the shared 16px text inset and increases its 8px top/bottom padding to match the header |
+| Item HeaderPanel margin | 0,0,24,0 |
+| RightAlignedCompactToggleSwitchStyle slot | Height 36, shared track 40x20 centered vertically |
+
+Both the header and child interiors measure 68px for the shown two-line labels (20+16 text, 16px top and bottom padding). The child's 36px control slot fits that same text height; its 1px top separator is separate. The displayed shared frame is therefore 139px tall: 1px top + 68px header + 1px separator + 68px item + 1px bottom. These are content-derived sizes, not fixed heights that clip wrapped descriptions.
+
+Native `SettingsCardMinHeight=68`, `DefaultSettingsExpanderItemStyle.MinHeight=52`, `SettingsExpanderContentMinHeight=16`, and `MinWidth=148` remain implementation requirements. Colophon's semantic layout has no minimum-size fields, so empty-header variants and native wrapping breakpoints are not reproduced by inventing fixed heights or raw CSS. The native template's content presenter also overlaps separate borders with margin `0,-2,0,0`; the catalog instead paints one frame and one divider and does not claim identical native outer height. Native high-contrast border thickness and glyph rasterization remain native. The removed icon indentation, increased item vertical padding, fixed chevron direction, shared backplate, 8px outer corners and header-wide feedback are catalog adaptations, not a pixel-identical reproduction of the screenshot.
+
+### Expander behavior and native motion reference
+
+The preview uses native HTML `details` / `summary`, initially open, rather than Colophon's switch-only boolean action. This gives each instance a real disclosure state and browser-managed expanded accessibility, keeps the child switch mounted across collapse/reopen, and excludes collapsed descendants from layout and keyboard navigation. The header is one keyboard target with no nested action. Horizontal Auto Layout on the summary removes the browser triangle without an RTL workaround and restores the trailing Fluent chevron slot. The actual U+E70D glyph uses the existing 16/16 Fluent-icon typography token; it is decorative and retains the original downward direction in both states. State-linked chevron direction remains unimplemented, while native disclosure owns the accessible expanded state. The browser focus outline remains a fallback.
+
+The animation reference is WinUI's [Expander.xaml](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/Expander/Expander.xaml), together with [Expander.cpp](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/Expander/Expander.cpp) and its [header template](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/Expander/Expander_themeresources.xaml). For downward expansion, content becomes visible and translates from negative measured content height to zero in **333ms**, with spline **(0,0,0,1)**. Closing translates back in **167ms**, with spline **(1,1,0,1)**, then sets visibility to Collapsed. A composition inset clip prevents content crossing the header. `AnimatedChevronUpDownSmallVisualSource` owns the native chevron's checked/unchecked and pointer states; this is not a generic 180-degree CSS rotation.
+
+**Animation is not implemented in this preview.** ToggleSwitch became animatable after Colophon gained persistent boolean state and numeric geometry transitions. Expander can follow that same upstream-extension approach, but it additionally needs disclosure semantics, measured-height clipping, visibility/focus timing and state-linked chevrons. Those capabilities are not present in the installed read-only renderer; this is a missing feature, not an inherent inability to animate expanders. Browser-native disclosure therefore opens/closes immediately; it does not pretend that a zero-height, still-focusable container is collapsed. Preserve the stock WinUI animation and system motion settings in production. A faithful animated browser reference needs separately scoped renderer support. Browser behavior/geometry proof remains pending and is not native pixel or Windows high-contrast proof.
+
 StatusDot is a non-interactive 10x10 indicator with `pill` corners and a semantic fill. Its standalone preview uses explicit Auto Layout so the empty span retains its width and height instead of collapsing as inline text.
 
 SubtleButton follows [`SubtleButtonStyle` and `ButtonPadding` in WinUI](https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/CommonStyles/Button_themeresources.xaml): 11,5,11,6 content padding, a 1px border, `ControlCornerRadius` (4px), and normal-weight 14px content. The default example is content-sized text, not a 40x40 icon button. The workspace's 40x40 icon buttons and their local padding overrides are usage variants, not defaults of the style. Rest and disabled backgrounds remain transparent in light/dark; hover and pressed states change background, border, and foreground through the native resource aliases above. Ship with `Style="{StaticResource SubtleButtonStyle}"` and leave its template intact.

From 2b02fa90647c5f1f8d50493fc79b7d2df160b996 Mon Sep 17 00:00:00 2001
From: Karen Lai <7976322+karkarl@users.noreply.github.com>
Date: Wed, 21 Oct 2026 10:30:40 -0400
Subject: [PATCH 32/32] design(colophon): map notification flyout to native
 resources

Preserve native presenter/card alpha, authored spacing, Fluent glyphs and the supplied empty-state reference. Document browser rendering limits without claiming native pixel identity.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: ac8d03a2-7198-43dc-8506-709986d6e1d3
---
 .agents/design/components.jsonc               | 285 +++++++++---------
 .../reference/notification-native-empty.png   | Bin 0 -> 59857 bytes
 DESIGN.md                                     |  84 +++++-
 3 files changed, 221 insertions(+), 148 deletions(-)
 create mode 100644 .agents/design/reference/notification-native-empty.png

diff --git a/.agents/design/components.jsonc b/.agents/design/components.jsonc
index 99b8b9cc89..ec99f0f793 100644
--- a/.agents/design/components.jsonc
+++ b/.agents/design/components.jsonc
@@ -1852,7 +1852,7 @@
     },
     {
       "name": "NotificationFlyout",
-      "note": "App notifications flyout from Controls/NotificationFlyoutContent.xaml (#1541), opened from the Workspace footer bell. The preview includes its presenter backplate: a surface sheet, 1px line frame, md (8px) corners, md drop shadow and 12px inset, consistent with the ConnectionStatusFlyout reference. Its 378px border box preserves the 352px content column. A transparent 32px outer margin leaves room for the shadow inside Colophon's overflow-clipped flyout portal; it is preview clearance, not native content padding or exact popup placement. Production keeps the stock FlyoutPresenter with FlyoutPresenterBackground (AcrylicInAppFillColorDefaultBrush), FlyoutBorderThemeBrush, FlyoutContentPadding and platform shadow; the solid surface and named shadow are browser approximations. The content has a right-aligned Clear all link, notification cards, and a footer pairing Open notifications with an active-count caption. Each card retains its surface panel, 1px line border, md radius and 12px padding, with a leading severity glyph, title/message/metadata stack and dismiss button. A recurrence count rides a warning Badge beside the title. An empty state swaps the list for a centered card. Severity glyphs are Segoe Fluent Icons in-app; previewed here with a stroked alert glyph.",
+      "note": "Populated state from Controls/NotificationFlyoutContent.xaml. Native presenter padding is 16,15,16,17, with a 1px flyoutStroke border, md corners and a 352px content column inside the 386px frame. flyoutFill maps the acrylic fallback, not the card brush. Native medium-shadow outside insets are 10,2,10,18; the flyout shadow token is a light CSS reference, not native composition proof. Notification cards preserve CardBackgroundFillColorDefaultBrush alpha through setupCardFill/setupCardStroke, 12px padding and 4px vertical margins; the ListView's -4px horizontal margin cancels each card's +4px margin. Columns are 11px apart; text stack gap is 3px. Title is Body Strong, severity and Cancel use native Fluent glyphs, and recurrence uses the caution background with 7,1 padding and 10px radius. Header/footer reuse HyperlinkButton with native 4,0 padding and transparent 1px borders. NotificationFlyoutEmpty shows the supplied screenshot's empty state. Acrylic noise, font rasterization, native shadow/dark recipe, high-contrast 2px presenter border, scrolling and notification actions remain unverified/native-owned; do not claim pixel identity.",
       "props": {
         "title": "Approval required",
         "message": "A Windows node capability is waiting for your approval.",
@@ -1864,18 +1864,18 @@
         "el": "div",
         "layout": {
           "mode": "vertical",
-          "gap": "2",
-          "padding": "3",
-          "width": 378
+          "gap": "0",
+          "padding": { "left": "4", "top": "flyoutTop", "right": "4", "bottom": "flyoutBottom" },
+          "width": 386
         },
-        "margin": "6",
+        "margin": { "left": "textControlLeft", "top": "half", "right": "textControlLeft", "bottom": "flyoutShadowBottom" },
         "appearance": {
-          "background": "surface",
-          "borderColor": "line",
+          "background": "flyoutFill",
+          "borderColor": "flyoutStroke",
           "borderWidth": 1,
-          "color": "ink",
+          "color": "nativeText",
           "radius": "md",
-          "shadow": "md"
+          "shadow": "flyout"
         },
         "children": [
           {
@@ -1883,44 +1883,19 @@
             "el": "div",
             "layout": {
               "mode": "horizontal",
-              "justify": "end",
-              "width": "fill"
+              "justify": "end"
             },
+            "margin": { "left": "half", "right": "half", "bottom": "2" },
             "children": [
               {
                 "id": "notif-clear",
-                "el": "button",
-                "attrs": {
-                  "type": "button"
-                },
-                "layout": {
-                  "mode": "horizontal",
-                  "align": "center",
-                  "padding": {
-                    "x": "2",
-                    "y": "1"
-                  },
-                  "width": "hug"
-                },
+                "component": "HyperlinkButton",
+                "props": { "children": "Clear all" },
                 "appearance": {
-                  "fontFamily": "body",
-                  "textStyle": "body",
-                  "color": "accent",
-                  "background": "$none",
-                  "radius": "sm"
-                },
-                "control": {
-                  "chrome": "none",
-                  "focus": { "kind": "outline", "color": "accent" }
-                },
-                "states": {
-                  "hover": { "background": "subtleHover" },
-                  "pressed": { "background": "subtlePressed" },
-                  "hoverPressed": { "background": "subtlePressed" }
-                },
-                "children": [
-                  "Clear all"
-                ]
+                  "color": "accentText",
+                  "borderColor": "subtleButtonBorder",
+                  "borderWidth": 1
+                }
               }
             ]
           },
@@ -1929,65 +1904,40 @@
             "el": "div",
             "layout": {
               "mode": "horizontal",
-              "gap": "3",
+              "gap": "buttonHorizontal",
               "padding": "3",
               "align": "start",
               "width": "fill"
             },
+            "margin": { "y": "1" },
             "appearance": {
-              "background": "surface",
-              "borderColor": "line",
-              "color": "ink",
+              "background": "setupCardFill",
+              "borderColor": "setupCardStroke",
+              "borderWidth": 1,
+              "color": "nativeText",
               "radius": "md"
             },
             "children": [
               {
                 "id": "notif-card-glyph",
-                "el": "svg",
+                "el": "span",
                 "attrs": {
-                  "width": "16",
-                  "height": "16",
-                  "viewBox": "0 0 24 24",
-                  "fill": "none",
-                  "stroke": "currentColor",
-                  "stroke-width": "2",
-                  "stroke-linecap": "round",
-                  "stroke-linejoin": "round",
                   "aria-hidden": "true"
                 },
+                "layout": { "width": 16, "height": 16 },
+                "margin": { "top": "half" },
                 "appearance": {
-                  "color": "warning"
+                  "textStyle": "chatIcon",
+                  "color": "nativeText"
                 },
-                "children": [
-                  {
-                    "id": "notif-card-glyph-tri",
-                    "el": "path",
-                    "attrs": {
-                      "d": "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"
-                    }
-                  },
-                  {
-                    "id": "notif-card-glyph-line",
-                    "el": "path",
-                    "attrs": {
-                      "d": "M12 9v4"
-                    }
-                  },
-                  {
-                    "id": "notif-card-glyph-dot",
-                    "el": "path",
-                    "attrs": {
-                      "d": "M12 17h.01"
-                    }
-                  }
-                ]
+                "children": ["\uE7BA"]
               },
               {
                 "id": "notif-card-text",
                 "el": "div",
                 "layout": {
                   "mode": "vertical",
-                  "gap": "1",
+                  "gap": "notificationTextGap",
                   "grow": true
                 },
                 "children": [
@@ -2005,8 +1955,8 @@
                         "el": "span",
                         "appearance": {
                           "fontFamily": "body",
-                          "textStyle": "body",
-                          "color": "ink"
+                          "textStyle": "bodyStrong",
+                          "color": "nativeText"
                         },
                         "children": [
                           "{title}"
@@ -2016,8 +1966,17 @@
                         "id": "notif-card-count",
                         "component": "Badge",
                         "props": {
-                          "tone": "warning",
+                          "tone": "neutral",
                           "children": "{count}"
+                        },
+                        "layout": { "padding": { "x": "notificationBadgeX", "y": "notificationBadgeY" } },
+                        "appearance": {
+                          "fontFamily": "body",
+                          "textStyle": "caption",
+                          "background": "notificationBadgeFill",
+                          "color": "nativeText",
+                          "borderWidth": 0,
+                          "radius": "notificationBadge"
                         }
                       }
                     ]
@@ -2028,7 +1987,7 @@
                     "appearance": {
                       "fontFamily": "body",
                       "textStyle": "caption",
-                      "color": "ink"
+                      "color": "nativeText"
                     },
                     "children": [
                       "{message}"
@@ -2040,7 +1999,7 @@
                     "appearance": {
                       "fontFamily": "body",
                       "textStyle": "caption",
-                      "color": "muted"
+                      "color": "nativeSecondary"
                     },
                     "children": [
                       "{metadata}"
@@ -2050,9 +2009,9 @@
               },
               {
                 "id": "notif-card-dismiss",
-                "el": "div",
+                "el": "button",
                 "attrs": {
-                  "role": "button",
+                  "type": "button",
                   "title": "Dismiss",
                   "aria-label": "Dismiss notification"
                 },
@@ -2060,37 +2019,30 @@
                   "mode": "horizontal",
                   "align": "center",
                   "justify": "center",
+                  "padding": "textControlEnd",
                   "width": 30,
                   "height": 30
                 },
                 "appearance": {
-                  "color": "muted",
+                  "background": "$none",
+                  "borderWidth": 0,
+                  "color": "nativeText",
                   "radius": "sm"
                 },
+                "control": { "chrome": "none", "focus": { "kind": "outline", "color": "accent" } },
+                "states": {
+                  "hover": { "background": "buttonHoverFill", "color": "buttonHoverText" },
+                  "pressed": { "background": "buttonPressedFill", "color": "buttonPressedText" },
+                  "hoverPressed": { "background": "buttonPressedFill", "color": "buttonPressedText" },
+                  "disabled": { "background": "buttonDisabledFill", "color": "buttonDisabledText" }
+                },
                 "children": [
                   {
                     "id": "notif-card-dismiss-glyph",
-                    "el": "svg",
-                    "attrs": {
-                      "width": "12",
-                      "height": "12",
-                      "viewBox": "0 0 24 24",
-                      "fill": "none",
-                      "stroke": "currentColor",
-                      "stroke-width": "2",
-                      "stroke-linecap": "round",
-                      "stroke-linejoin": "round",
-                      "aria-hidden": "true"
-                    },
-                    "children": [
-                      {
-                        "id": "notif-card-dismiss-path",
-                        "el": "path",
-                        "attrs": {
-                          "d": "M18 6L6 18M6 6l12 12"
-                        }
-                      }
-                    ]
+                    "el": "span",
+                    "attrs": { "aria-hidden": "true" },
+                    "appearance": { "textStyle": "notificationDismissIcon" },
+                    "children": ["\uE711"]
                   }
                 ]
               }
@@ -2103,44 +2055,19 @@
               "mode": "horizontal",
               "gap": "2",
               "align": "center",
-              "justify": "space-between",
-              "width": "fill"
+              "justify": "space-between"
             },
+            "margin": { "left": "half", "top": "2", "right": "half" },
             "children": [
               {
                 "id": "notif-footer-open",
-                "el": "button",
-                "attrs": {
-                  "type": "button"
-                },
-                "layout": {
-                  "mode": "horizontal",
-                  "align": "center",
-                  "padding": {
-                    "x": "2",
-                    "y": "1"
-                  },
-                  "width": "hug"
-                },
+                "component": "HyperlinkButton",
+                "props": { "children": "Open notifications" },
                 "appearance": {
-                  "fontFamily": "body",
-                  "textStyle": "body",
-                  "color": "accent",
-                  "background": "$none",
-                  "radius": "sm"
-                },
-                "control": {
-                  "chrome": "none",
-                  "focus": { "kind": "outline", "color": "accent" }
-                },
-                "states": {
-                  "hover": { "background": "subtleHover" },
-                  "pressed": { "background": "subtlePressed" },
-                  "hoverPressed": { "background": "subtlePressed" }
-                },
-                "children": [
-                  "Open notifications"
-                ]
+                  "color": "accentText",
+                  "borderColor": "subtleButtonBorder",
+                  "borderWidth": 1
+                }
               },
               {
                 "id": "notif-footer-count",
@@ -2148,7 +2075,7 @@
                 "appearance": {
                   "fontFamily": "body",
                   "textStyle": "caption",
-                  "color": "muted"
+                  "color": "nativeTertiary"
                 },
                 "children": [
                   "1 active"
@@ -2159,6 +2086,78 @@
         ]
       }
     },
+    {
+      "name": "NotificationFlyoutEmpty",
+      "note": "Empty state of the same native notification flyout, matching the user-supplied reference in .agents/design/reference/notification-native-empty.png. Keep the 386px presenter, 352px content column, 16,15,16,17 presenter padding and native card alpha. The collapsed Clear all button leaves an 8px header-grid margin. Empty card has 20px padding, 4px vertical margins, Body Strong title and Caption detail with a 6px gap; footer margin is 2,8,2,0. No severity glyph, recurrence badge, dismiss target or active count appears in this state. Content determines height; native acrylic noise, font metrics, shadow composition and actual popup positioning cannot be claimed pixel-identical from this source mapping.",
+      "root": {
+        "id": "notif-empty-root",
+        "el": "div",
+        "layout": {
+          "mode": "vertical",
+          "gap": "0",
+          "padding": { "left": "4", "top": "flyoutTop", "right": "4", "bottom": "flyoutBottom" },
+          "width": 386
+        },
+        "margin": { "left": "textControlLeft", "top": "half", "right": "textControlLeft", "bottom": "flyoutShadowBottom" },
+        "appearance": {
+          "background": "flyoutFill",
+          "borderColor": "flyoutStroke",
+          "borderWidth": 1,
+          "color": "nativeText",
+          "radius": "md",
+          "shadow": "flyout"
+        },
+        "children": [
+          {
+            "id": "notif-empty-header",
+            "el": "div",
+            "attrs": { "aria-hidden": "true" },
+            "layout": { "mode": "vertical" },
+            "margin": { "bottom": "2" }
+          },
+          {
+            "id": "notif-empty-card",
+            "el": "div",
+            "layout": { "mode": "vertical", "gap": "textControlEnd", "padding": "notificationEmpty", "width": "fill" },
+            "margin": { "y": "1" },
+            "appearance": {
+              "background": "setupCardFill",
+              "borderColor": "setupCardStroke",
+              "borderWidth": 1,
+              "radius": "md"
+            },
+            "children": [
+              {
+                "id": "notif-empty-title",
+                "el": "span",
+                "appearance": { "fontFamily": "body", "textStyle": "bodyStrong", "color": "nativeText" },
+                "children": ["No notifications"]
+              },
+              {
+                "id": "notif-empty-description",
+                "el": "p",
+                "appearance": { "fontFamily": "body", "textStyle": "caption", "color": "nativeSecondary" },
+                "children": ["New app notifications will appear here until you dismiss or clear them."]
+              }
+            ]
+          },
+          {
+            "id": "notif-empty-footer",
+            "el": "div",
+            "layout": { "mode": "horizontal", "align": "center" },
+            "margin": { "left": "half", "top": "2", "right": "half" },
+            "children": [
+              {
+                "id": "notif-empty-open",
+                "component": "HyperlinkButton",
+                "props": { "children": "Open notifications" },
+                "appearance": { "color": "accentText", "borderColor": "subtleButtonBorder", "borderWidth": 1 }
+              }
+            ]
+          }
+        ]
+      }
+    },
     {
       "name": "WorkspaceShell",
       "note": "Production-derived expanded workspace at dc9f6345821075362580bd598cc32e4f2aa6a18a, showing the supplied screenshot's no-agent/no-session/error state. TitleBar is 32px; NavigationView is 256px. CollapsePaneButton is a separate 40x40 SubtleButton at (4,8), with native U+E90C; Back/Forward align to the right at 40px high and 8px apart, disabled with no history. Selector padding is 4,8,28,8 and its chevron is U+E70D. Home uses the original Chat.svg at 22px in a 24px column, 16px before the label. Session add and Notifications are 40x36, not 32px or 40px squares. Footer uses margin 4,8,4,8, a 4px gap, the shared Owner badge and original Notifications.svg at 20px with an InfoBadge. Artwork data URLs are exact bytes from production, not new theme colors. Caption buttons and red-bot title image mirror native chrome. Layout is measured in effective pixels; 852px is the supplied screenshot's client height at 125% scale. Native Mica tint, text rasterization, OS caption actions, pane collapse/reopen and navigation are not executed by this browser reference. The pane button has real hover/pressed/focus visuals, but remains a documented native action rather than an inaccessible width-only collapse. Production closes the pane entirely and exposes a 56px ReopenPaneSlot.",
diff --git a/.agents/design/reference/notification-native-empty.png b/.agents/design/reference/notification-native-empty.png
new file mode 100644
index 0000000000000000000000000000000000000000..41a31da9f42be875af1eb20fea5655f8030beab7
GIT binary patch
literal 59857
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
R_51igQ$tG#{<_<f{{uR&1IPdX

literal 0
HcmV?d00001

diff --git a/DESIGN.md b/DESIGN.md
index 3abb038b99..5b805d3897 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -13,6 +13,11 @@ colors:
   accentText: "#003e92"
   setupCardFill: "#ffffffb3"
   setupCardStroke: "#0000000f"
+  flyoutFill: "#f9f9f9"
+  flyoutStroke: "#0000000f"
+  nativeSecondary: "#0000009e"
+  nativeTertiary: "#00000072"
+  notificationBadgeFill: "#fff4ce"
   setupOptionDisabled: "#f9f9f94d"
   providerArtworkFill: "#202020"
   providerArtworkStroke: "#00000019"
@@ -234,6 +239,11 @@ typography:
     fontSize: 13px
     fontWeight: 400
     lineHeight: 13px
+  notificationDismissIcon:
+    fontFamily: '"Segoe Fluent Icons", "Segoe MDL2 Assets", sans-serif'
+    fontSize: 11px
+    fontWeight: 400
+    lineHeight: 11px
 spacing:
   "0": 0px
   half: 2px
@@ -256,6 +266,13 @@ spacing:
   chatGutter: 40px
   workspaceSelectorEnd: 28px
   settingsItemEnd: 44px
+  flyoutTop: 15px
+  flyoutBottom: 17px
+  flyoutShadowBottom: 18px
+  notificationEmpty: 20px
+  notificationTextGap: 3px
+  notificationBadgeX: 7px
+  notificationBadgeY: 1px
 rounded:
   sm: 4px
   md: 8px
@@ -264,6 +281,7 @@ rounded:
   composer: 20px
   pill: 999px
   workspaceContent: 8px 0 0 0
+  notificationBadge: 10px
 x-colophon:
   version: 1
   tokens:
@@ -303,6 +321,7 @@ x-colophon:
           - SettingsExpanderRow
           - SettingsWindowShell
           - NotificationFlyout
+          - NotificationFlyoutEmpty
           - ConnectionStatusFlyout
           - WorkspaceShell
           - AgentIdentityBadge
@@ -359,6 +378,8 @@ x-colophon:
         value: 0 4px 16px rgba(0,0,0,0.12)
       - name: lg
         value: 0 12px 40px rgba(0,0,0,0.16)
+      - name: flyout
+        value: 0 8px 16px rgba(0,0,0,0.14)
     principles:
       - Defer to Windows. Theme off SystemAccentColor and Fluent resources so the app follows the user's accent, light/dark, and high-contrast choices.
       - One accent, and it means "act here". Selection, focus, and primary actions share the system accent; don't spend it on decoration.
@@ -400,6 +421,36 @@ x-colophon:
           dark: "#2b2b2b"
           highContrast: "#000000"
         usage: Cards, flyouts, inputs. Fluent CardBackgroundFillColorDefault.
+      flyoutFill:
+        resource: FlyoutPresenterBackground
+        themes:
+          dark: "#2c2c2c"
+          highContrast: "#000000"
+        usage: Native AcrylicInAppFillColorDefaultBrush fallback, not a card fill. Light fallback F9F9F9 and dark fallback 2C2C2C come from AcrylicBrush_themeresources.xaml. Browser preview does not reproduce backdrop blur or acrylic noise.
+      flyoutStroke:
+        resource: FlyoutBorderThemeBrush
+        themes:
+          dark: "#00000033"
+          highContrast: "#ffffff"
+        usage: SurfaceStrokeColorFlyoutBrush in light/dark; SystemColorWindowTextColorBrush in high contrast. Preserve alpha rather than using the generic line swatch.
+      nativeSecondary:
+        resource: TextFillColorSecondaryBrush
+        themes:
+          dark: "#ffffffc5"
+          highContrast: "#ffffff"
+        usage: Alpha-preserving secondary native text for notification details and metadata.
+      nativeTertiary:
+        resource: TextFillColorTertiaryBrush
+        themes:
+          dark: "#ffffff87"
+          highContrast: "#ffffff"
+        usage: Alpha-preserving tertiary native text for the active notification count.
+      notificationBadgeFill:
+        resource: SystemFillColorCautionBackgroundBrush
+        themes:
+          dark: "#433519"
+          highContrast: "#000000"
+        usage: Recurrence-count background, not the caution foreground color or a generic status pill.
       muted:
         resource: TextFillColorSecondaryBrush
         themes:
@@ -972,7 +1023,7 @@ The chat transcript and composer ship via Reactor and follow the native chat vis
 
 The chat reference was reconciled against production commit `9e4999c6d43f166437afa204a556bd8ee9dbfcb2`, including `ChatVisuals.cs`, `ReactorChatComposer.cs`, `ReactorChatTimeline.cs`, `ChatMarkdownPresentation.cs`, `ChatCopyButton.cs`, `FluentIconCatalog.cs` and `Themes/ChatResources.xaml`. A separately built ARM64 Release app ran against the isolated synthetic Gateway at 120 DPI; native screenshots and UI Automation bounds cover light/dark, empty/drafted input and the wide avatar breakpoint. This is fixture proof, not live Gateway/provider proof.
 
-The [120-DPI comparison](.agents/design/reference/chat-comparison.png) preserves the unmodified native and browser composer pixels at the same scale. Both writing surfaces are 960x140 physical pixels (768x112 effective pixels), with 40x40 action targets and a 55px input height. User-footer spacing includes 8px of stack space plus its 2px top margin. Schema/expansion checks cover all 38 components; focused chat geometry and action-state checks cover all three preview themes.
+The [120-DPI comparison](.agents/design/reference/chat-comparison.png) preserves the unmodified native and browser composer pixels at the same scale. Both writing surfaces are 960x140 physical pixels (768x112 effective pixels), with 40x40 action targets and a 55px input height. User-footer spacing includes 8px of stack space plus its 2px top margin. At capture time, schema/expansion checks covered all 38 definitions then present; focused chat geometry and action-state checks covered all three preview themes. This historical proof does not cover subsequently added examples.
 
 The Colophon catalog now uses the actual geometry, semantic alpha brushes and Fluent glyphs. It is **not a verified pixel-identical native renderer**: Mica is wallpaper/activation-dependent; this host's native UI Automation reports Segoe UI Variable while Chromium resolves the requested family to Segoe UI; and text rasterization/layout rounding differ. The installed schema also lacks responsive breakpoints, row-hover opacity, gradient elevation borders and native input/flyout behavior. Fixed-size references must not become production layout code. High-contrast preview swatches are resource simulations, not evidence of Windows HC mode.
 
@@ -984,20 +1035,43 @@ The landing window is the native Home and Sessions workspace (`Windows/Workspace
 - **Menu.** Home is a 36px row with 4px horizontal and 2px vertical outer margins, a 3x16 accent indicator and the original `Chat.svg` at 22px centered in a 24px column. The iconless native presenter reserves 8px before that column, followed by a 16px gap to Home. The Sessions header is 40px tall with 16px leading and 4px trailing insets, 14px semibold text, and a 40x36 add button. No conversations to show replaces session rows in the supplied state; add is disabled while disconnected.
 - **Owner footer.** The PaneFooter uses 4,8,4,8 margins and a 4px column gap. The Owner button is the shared `UserIdentityBadge`, with native SubtleButton states, 8px padding and a retained 1px border, a 24px PersonPicture, 12px column spacing and a 10px status dot followed by a 4px gap and Caption text. `statusTone` follows connection state, never authorization. It reads the authenticated `users.self` profile or falls back to Owner. The notification button is 40x36 with 8px padding, vertically centered against Owner, containing the original 20px `Notifications.svg` and a 16px InfoBadge offset -6px above and 8px beyond the icon's right edge.
 - **Connection status.** `Controls/GatewayStatusContent.xaml` is a 304px flyout of Gateway, Operator, and Node rows split by 1px `line` dividers, closing with an Open Connection link. Each row pairs a 10px status dot with a body-strong label over a caption `muted` detail, and reveals an `accent` action link (Reconnect, Approve) only when that layer needs one. The dot binds the Fluent system fill for its state: `positive` connected, `warning` attention, `critical` error, `muted` unknown, never color alone.
-- **Notifications.** `Controls/NotificationFlyoutContent.xaml` is a 352px content column: a Clear all link, a list of notification cards, and a footer pairing Open notifications with an active-count caption. The preview now includes a presenter backplate around the whole column, not just the individual cards: a `surface` fill, 1px `line` frame, `md` (8px) corners, `md` drop shadow and 12px inset. The 378px border box preserves the 352px content width. A transparent 32px outer margin gives the shadow room inside Colophon's overflow-clipped portal; this is preview clearance, not native content padding or exact popup placement. Each notification card retains its own `surface` panel, 1px `line` border, `md` corners, and 12px padding, laying out a severity glyph, title/message/metadata stack, and dismiss button; a recurrence count rides a `warning` badge beside the title. An empty state swaps the list for one centered card. Production keeps the stock [FlyoutPresenter](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/CommonStyles/FlyoutPresenter_themeresources.xaml): bind `FlyoutPresenterBackground`, `FlyoutBorderThemeBrush`, `FlyoutContentPadding` and the native platform shadow rather than copying the solid browser sheet or shadow values. The browser's 12px inset approximates native 16,15,16,17 padding, and its 1px frame does not simulate the native 2px high-contrast override.
+- **Notifications.** `NotificationFlyout` and `NotificationFlyoutEmpty` map the populated and empty states of `Controls/NotificationFlyoutContent.xaml`. They retain separate presenter and card layers, native alpha, and exact authored spacing. See the notification mapping below; the former generic `surface`/`line` shell and 12px presenter inset were incorrect.
 - **Artwork and glyphs.** Pane, Back, Forward and Add use actual Segoe Fluent glyphs U+E90C, U+E76B, U+E76C and U+E710 at 16px, not hand-drawn SVG substitutes. Home and Notifications use exact production SVG bytes, including their authored gradients; these are artwork, not theme-color tokens. The title uses `BrandAssets.RedBotMarkUri` at 16px with a 16px gap before its 12px title. Native caption glyph references are U+E921, U+E922 and U+E8BB. The owner fallback uses PersonPicture's Contact glyph U+E77B at 24 * 0.42 = 10.08px.
 - **Content.** One `NavigationViewContentBackground` layer uses `chatLayer`, with a 1px top/left `line` stroke and the native 8,0,0,0 corner shape (`workspaceContent`). The disconnected placeholder is centered: U+E8F2 at 48px, Subtitle text, and the standard 32px Open Connection button, separated by 12px gaps.
 
 Workspace button instances reuse SubtleButton's resource-bound states rather than a generic `muted` foreground. The added `workspaceTitle`, `workspacePerson` and `workspacePlaceholder` typography tokens preserve native title, PersonPicture and empty-state metrics. `workspaceSelectorEnd` records the 28px native selector padding.
 
-This is a production-structure and geometry reference, not a pixel-identity claim. The supplied screenshot's client is approximately 1266x852 effective pixels; the preview uses that height and follows its available width. Mica's wallpaper tint, font rasterization, OS caption actions and native NavigationView interaction cannot be reproduced by this renderer. The pane button has hover/pressed/focus styling, but collapse/reopen remains a native action: production hides the pane entirely, shows a 56px ReopenPaneSlot, and transfers focus. Do not approximate that behavior by shrinking focusable children to zero width. The preview notification button opens the shared illustrative flyout; it does not read live notifications.
+This is a production-structure and geometry reference, not a pixel-identity claim. The supplied screenshot's client is approximately 1266x852 effective pixels; the preview uses that height and follows its available width. Mica's wallpaper tint, font rasterization, OS caption actions and native NavigationView interaction cannot be reproduced by this renderer. The pane button has hover/pressed/focus styling, but collapse/reopen remains a native action: production hides the pane entirely, shows a 56px ReopenPaneSlot, and transfers focus. Do not approximate that behavior by shrinking focusable children to zero width. The preview notification button opens the shared populated flyout; the empty reference is a separate Settings example. Neither reads live notifications.
+
+### Notification presenter and card mapping
+
+The [user-supplied native empty-state capture](.agents/design/reference/notification-native-empty.png) is the visual target, not a screenshot of this browser preview. Its approximately 482px outer width and 440px card width are consistent with native 386px and 352px widths at 125% scale.
+
+| Part | Native mapping retained in the preview |
+| --- | --- |
+| Presenter | `FlyoutPresenterBackground` (`AcrylicInAppFillColorDefaultBrush`), `FlyoutBorderThemeBrush`, 1px light/dark border, 8px `OverlayCornerRadius` |
+| Presenter padding | 16,15,16,17, exactly `FlyoutContentPadding`; outer width 386 = 352 + 16 + 16 + 1 + 1 |
+| Card fill and frame | Existing `setupCardFill` / `setupCardStroke`, which bind the same native card brushes. Light fill is white at B3/FF alpha, not opaque white or the generic `surface` swatch |
+| Clear-all row | Margin 2,0,2,8; shared HyperlinkButton with native 4,0 content padding and a retained transparent 1px border |
+| Populated card | Padding 12; vertical margin 4. Native ListView margin -4 and card margin +4 cancel horizontally, leaving a 352px-wide card |
+| Populated columns | 16px native severity glyph, 11px column gaps, Body Strong title, Caption message/metadata, 3px text-stack gaps; native Cancel glyph U+E711 at 11px in a 30px dismiss target |
+| Recurrence badge | Caution background, primary text, 10px radius, exact 7,1 padding; no generic warning foreground or pill padding |
+| Empty card | Padding 20, vertical margin 4, left-aligned Body Strong title and Caption description separated by 6px |
+| Empty header | The collapsed Clear all button leaves its parent Grid's 8px bottom margin; do not remove that spacer |
+| Footer | Margin 2,8,2,0; shared Open notifications link and native tertiary count. Empty state has no count |
+
+The [native acrylic dictionary](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/Materials/Acrylic/AcrylicBrush_themeresources.xaml) defines the light fallback as F9F9F9 and dark fallback as 2C2C2C. Sampling the supplied screenshot's blank presenter area gives mainly 249-250 per channel; its white card is mainly 253-254. Compositing the native B3-alpha white card over F9F9F9 gives approximately 253, preserving the small native contrast without inventing another gray panel.
+
+The named `flyout` shadow uses an 8px downward offset, 16px CSS blur and 14% black as a light-preview reference. The [native popup's medium shadow clearance](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/dxaml/xcp/components/graphics/ThemeShadow.cpp) is 10,2,10,18; the preview reserves those same outside insets instead of the old 32px margin. These insets are separate from content padding. Colophon's portal still positions its entire scroll box, including clearance, rather than anchoring the presenter like WinUI.
+
+**Pixel identity remains unverified.** The flat fallback cannot reproduce acrylic noise/backdrop composition, Chromium text measurement/rasterization differs from WinUI, and a CSS shadow is not the native composition shadow (including its dark-theme recipe). The empty example is content-sized, not forced to a screenshot height. The native high-contrast presenter uses a 2px border, while this schema keeps the authored 1px border. The exact resource and authored geometry mappings above are not a substitute for a same-scale native/browser image comparison. Production keeps the stock [FlyoutPresenter](https://github.com/microsoft/microsoft-ui-xaml/blob/09cfc8ff3fbf556166dd813ae9b81646716f54bf/controls/dev/CommonStyles/FlyoutPresenter_themeresources.xaml) and system resources; no application or installed-plugin code is changed.
 
 ## Components
 
 Reuse [component patterns](.agents/design/components.jsonc); these describe design intent, not shipping code.
 Optional click-through flows live in `.agents/design/prototypes.jsonc`.
 
-The catalog is organized into four families through `x-colophon.tokens.pages` above. The entry with `id: components` selects the built-in Components page; Setup, Chat, and Settings select their feature-specific previews. Each of the 38 definitions has exactly one standalone page assignment: Components 15, Setup 6, Chat 7, and Settings 10. Page selections do not copy or remove definitions, so shared controls still resolve inside compositions and flyouts. Keep control examples and variants beside their basic control, not on another feature page. The old synthetic Connection example screen and separate RecommendedBadge definition have been removed.
+The catalog is organized into four families through `x-colophon.tokens.pages` above. The entry with `id: components` selects the built-in Components page; Setup, Chat, and Settings select their feature-specific previews. Each of the 39 definitions has exactly one standalone page assignment: Components 15, Setup 6, Chat 7, and Settings 11. Page selections do not copy or remove definitions, so shared controls still resolve inside compositions and flyouts. Keep control examples and variants beside their basic control, not on another feature page. The old synthetic Connection example screen and separate RecommendedBadge definition have been removed.
 
 Every interactive control documents its hover and pressed states; static controls say so. States bind Fluent resources (`SubtleFillColorSecondary` for hover, `SubtleFillColorTertiary` for pressed, accent variants for primary actions), never raw hex.
 
@@ -1006,7 +1080,7 @@ ComposerPickerOptions rows use full-row `subtleHover` and `subtlePressed` fills
 - **Basic controls and their examples (15).** Button (accent), ButtonStandard (normal), SubtleButton (native default style), HyperlinkButton, TextBox, Field, Badge, BadgeAccent, ToggleSwitch, StatusDot, Avatar, AvatarStates, InfoBar, InfoBarStates, and Card. ButtonStandard references Button and overrides its state brushes, just as BadgeAccent references Badge; neither duplicates shared markup. TextBox is the reusable default WinUI single-line input. Field composes a label and TextBox; its Gateway address example passes the label and placeholder into that shared control. AvatarStates and InfoBarStates demonstrate their parent control's presentations, not separate app features.
 - **Setup (6).** SetupProgressIndicator, ProviderArtwork, SetupOptionCard, CapabilityOptionRow, SetupPhaseStatus, and the SetupWizardShell frame, ported from `OpenClaw.SetupEngine.UI`. Recommended labels reuse BadgeAccent from Components.
 - **Chat (7).** ChatBubble (assistant prose), ChatUserBubble (sent user message), ChatComposer, ChatThread, ComposerPicker, ComposerPickerOptions, and ChatCopyButton. See the Chat surface section.
-- **Settings and workspace (10).** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and SettingsWindowShell, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, and WorkspaceShell. These come from `OpenClaw.Tray.WinUI` pages, `HubWindow`, and `WorkspaceWindow`. See the Workspace shell section.
+- **Settings and workspace (11).** SettingsSectionHeader, SettingsCard, SettingsToggleRow, SettingsExpanderRow, and SettingsWindowShell, plus the native workspace identity controls (AgentIdentityBadge, UserIdentityBadge), ConnectionStatusFlyout, NotificationFlyout, NotificationFlyoutEmpty, and WorkspaceShell. These come from `OpenClaw.Tray.WinUI` pages, `HubWindow`, and `WorkspaceWindow`. See the Workspace shell section.
 
 TextBox ships as the stock `Microsoft.UI.Xaml.Controls.TextBox`, as used by `DirectUrlBox` in `Pages/ConnectionPage.xaml`, not a custom control template. The Colophon preview uses 14px body text, 32px single-line height, `sm` corners, exact text-control padding, pointer-over and disabled resource tokens, and the accent focus underline. WinUI has no separate pressed background for the input itself; pressing enters its focused state. The browser preview approximates the native elevation border with `controlLine` and does not reproduce the native focused-fill transition or clear-button template.