diff --git a/content/solid/ask-card.mdx b/content/solid/ask-card.mdx
index 7066f52..bf25230 100644
--- a/content/solid/ask-card.mdx
+++ b/content/solid/ask-card.mdx
@@ -34,4 +34,10 @@ import { AskCard } from "@/components/ui/ask-card"
 
 ## After the answer
 
-Once the conversation has moved on, leave `onAnswer` out. The choices are then no longer offered, and the card stays as a record of what was asked.
+Once the conversation has moved on, leave `onAnswer` out. The choices are then no longer offered, and the card stays as a record of what was asked. Give `chosen` the answer and it is a record of what was said too: that choice keeps its pane, the others fade to words.
+
+```tsx
+<AskCard question={question} options={options} onAnswer={answered ? undefined : send} chosen={answered} />
+```
+
+The choices are not disabled once answered, only inert: a disabled button drops the keyboard to the page on the very press that answers.
diff --git a/content/solid/composer.mdx b/content/solid/composer.mdx
index c731494..18976a2 100644
--- a/content/solid/composer.mdx
+++ b/content/solid/composer.mdx
@@ -50,6 +50,8 @@ continue to apply to the outer wrapper.
 
 The send mark has no block behind it in any state: its brightness says what it will do. With `running`, it is the quiet square that stops the turn, until something is typed, which is then sent behind it.
 
+The mark is never disabled. With nothing to send and nothing to stop it is dim and does nothing, but it stays where it is, so the keyboard on it is not dropped to the page as the text goes or the turn ends. Sent or stopped from the keyboard, the focus returns to the text; the pointer never takes it away. While the text is being written, the pane's hairline is drawn in the focus line.
+
 <ComponentPreview name="composer-running" />
 
 ## Footer
diff --git a/content/solid/tag.mdx b/content/solid/tag.mdx
index 63ba06f..a414e5f 100644
--- a/content/solid/tag.mdx
+++ b/content/solid/tag.mdx
@@ -34,3 +34,7 @@ import { Tag } from "@/components/ui/tag"
 ## States
 
 `progress` between 0 and 1 fills the tag from the left. `error` turns it to the colour of failure and says why on hover. `armed` is the same pane lit a step brighter, for the tag the next Backspace will remove.
+
+## Removed
+
+A tag removed on its own x hands the keyboard on before it goes: to the next tag's x, else the one before, else the text of the composer it is in. Nothing is dropped to the page.
diff --git a/content/solid/tool-steps.mdx b/content/solid/tool-steps.mdx
index 28f4125..d8be1d8 100644
--- a/content/solid/tool-steps.mdx
+++ b/content/solid/tool-steps.mdx
@@ -43,6 +43,8 @@ const steps: Step[] = [
 
 `StepList` is the opened list on its own. A row opens to the call itself, or to its diff when it changed a file.
 
+A group keeps the state of its rows. One call is one line; when a second joins it the group forms round the first, and if that call was open the group opens with it, with the keyboard still on the row it was on.
+
 <ComponentPreview name="tool-steps-list" align="start" />
 
 ## API Reference
diff --git a/content/solid/turn-status.mdx b/content/solid/turn-status.mdx
index 5b01dc7..7064533 100644
--- a/content/solid/turn-status.mdx
+++ b/content/solid/turn-status.mdx
@@ -41,7 +41,7 @@ import { TurnStatus } from "@/components/ui/turn-status"
 
 ## With steps
 
-Given children, the line is a button and opens to show them: the calls of the step in hand.
+Given children, the line is a button and opens to show them: the calls of the step in hand. Once it has had children it stays a button, with nothing to open between steps, so the keyboard on it is not dropped as a step ends.
 The activity label is announced by a separate status region, so the button keeps
 its native role and updates to the clock and token count do not repeat the announcement.
 When `label` is omitted or blank, the activity name supplies the announcement and
diff --git a/src/components/ui/ask-card.tsx b/src/components/ui/ask-card.tsx
index 2f63447..e281c23 100644
--- a/src/components/ui/ask-card.tsx
+++ b/src/components/ui/ask-card.tsx
@@ -6,38 +6,53 @@ import { cn } from "@/lib/utils"
  * A decision the agent has put to the user: the question, and its choices as
  * buttons when it gave any. Once the conversation has moved on, leave
  * `onAnswer` out: the choices are then no longer offered, and the card stays
- * as a record of what was asked.
+ * as a record of what was asked — and, given `chosen`, of what was said: that
+ * choice keeps its pane, the others fade to words.
  */
 function AskCard({
   question,
   options = [],
   onAnswer,
+  chosen,
   eyebrow = "Needs your decision",
   className,
 }: {
   question: string
   options?: string[]
   onAnswer?: (option: string) => void
+  /** The option that was taken, once one was. */
+  chosen?: string
   eyebrow?: string
   className?: string
 }) {
+  const answered = !onAnswer
   return (
     <div data-slot="ask-card" className={cn("glass-panel rounded-md px-3.5 py-3", className)}>
       <p className="text-[11.5px] text-status-interrupted">{eyebrow}</p>
       <p className="mt-1 text-[14px] leading-relaxed whitespace-pre-wrap">{question}</p>
       {options.length > 0 && (
         <div className="mt-2.5 flex flex-wrap gap-1.5">
-          {options.map((option) => (
-            <button
-              key={option}
-              type="button"
-              disabled={!onAnswer}
-              onClick={() => onAnswer?.(option)}
-              className="glass-chosen h-7 rounded-sm px-2.5 text-[12.5px] text-foreground/90 transition-colors outline-none hover:bg-foreground/[0.12] hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/60 disabled:pointer-events-none disabled:opacity-50"
-            >
-              {option}
-            </button>
-          ))}
+          {options.map((option) => {
+            const taken = option === chosen
+            return (
+              // Not disabled once answered: that drops the keyboard to the page
+              // on the very press that answers. Inert, and still reachable.
+              <button
+                key={option}
+                type="button"
+                aria-disabled={answered || undefined}
+                aria-current={taken || undefined}
+                onClick={() => onAnswer?.(option)}
+                className={cn(
+                  "h-7 rounded-sm px-2.5 text-[12.5px] transition-colors outline-none",
+                  answered && !taken ? "cursor-default text-muted-foreground/70" : "glass-chosen text-foreground/90",
+                  answered ? "cursor-default" : "hover:bg-foreground/[0.12] hover:text-foreground"
+                )}
+              >
+                {option}
+              </button>
+            )
+          })}
         </div>
       )}
     </div>
diff --git a/src/components/ui/composer.tsx b/src/components/ui/composer.tsx
index 2cd5528..1f3b3bc 100644
--- a/src/components/ui/composer.tsx
+++ b/src/components/ui/composer.tsx
@@ -70,6 +70,11 @@ function Composer({
   // which is then queued behind the turn like any other message.
   const stops = running && !ready
   const Icon = stops ? Square : ArrowUp
+  // With nothing to send and nothing to stop, the mark does nothing. It is
+  // not disabled for that: a disabled button drops the keyboard to the page
+  // at the moment the text is sent or the turn ends, which is when the
+  // keyboard was last on it.
+  const inert = !stops && !ready
 
   const resize = React.useCallback(() => {
     const el = textarea.current
@@ -102,7 +107,9 @@ function Composer({
     <div
       data-slot="composer"
       className={cn(
-        "group/composer relative rounded-xl bg-card py-2 pr-1 pl-2 transition-colors focus-within:border-ring/60",
+        // The pane has no border for a focus colour to show on; while the text
+        // is being written, its hairline is drawn again in the focus line.
+        "group/composer relative rounded-xl bg-card py-2 pr-1 pl-2 transition-colors focus-within:outline-1 focus-within:-outline-offset-1 focus-within:outline-(--focus-line)",
         className
       )}
       {...props}
@@ -153,15 +160,23 @@ function Composer({
           <Button
             size="icon"
             aria-label={stops ? stopLabel : sendLabel}
-            disabled={!stops && !ready}
-            onClick={stops ? onStop : submit}
+            aria-disabled={inert || undefined}
+            // The pointer sends; the keyboard stays in the text, as in any composer.
+            onMouseDown={(event) => event.preventDefault()}
+            onClick={() => {
+              if (inert) return
+              if (stops) onStop?.()
+              else submit()
+              // Sent or stopped from the keyboard, the next thing to do is write.
+              textarea.current?.focus()
+            }}
             className={cn(
-              "shrink-0 rounded-md bg-transparent transition-colors hover:bg-accent",
+              "shrink-0 rounded-md bg-transparent transition-colors hover:bg-accent aria-disabled:cursor-default aria-disabled:active:translate-y-0",
               stops
                 ? "text-muted-foreground hover:text-foreground"
                 : ready
                   ? "text-foreground"
-                  : "text-muted-foreground/50 hover:bg-transparent disabled:opacity-100"
+                  : "text-muted-foreground/50 hover:bg-transparent"
             )}
           >
             <Icon className={cn("size-4", stops && "size-2.5 fill-current")} />
@@ -217,6 +232,7 @@ function ComposerPick<T extends string>({
   return (
     <DropdownMenu>
       <DropdownMenuTrigger
+        data-slot="composer-pick"
         aria-label={label}
         className="glass-held flex h-6 items-center gap-1 rounded-sm px-1.5 text-[12px] text-muted-foreground transition-colors outline-none hover:text-foreground focus-visible:text-foreground aria-expanded:text-foreground"
       >
diff --git a/src/components/ui/context-ring.tsx b/src/components/ui/context-ring.tsx
index 300c66f..ac55043 100644
--- a/src/components/ui/context-ring.tsx
+++ b/src/components/ui/context-ring.tsx
@@ -79,6 +79,7 @@ function ContextRing({
       <PopoverContent side="top" align="end" sideOffset={8} className="w-72 gap-2 p-3">
         <button
           type="button"
+          data-slot="context-ring-detail"
           disabled={!parts.length}
           aria-expanded={detailed}
           onClick={() => setDetailed((open) => !open)}
diff --git a/src/components/ui/tag.tsx b/src/components/ui/tag.tsx
index 6dbc87c..5638e33 100644
--- a/src/components/ui/tag.tsx
+++ b/src/components/ui/tag.tsx
@@ -22,6 +22,7 @@ function Tag({
   removeLabel = "Remove",
   className,
   children,
+  ref,
   ...props
 }: React.ComponentProps<"span"> & {
   icon?: React.ReactNode
@@ -35,8 +36,33 @@ function Tag({
 }) {
   const going = progress !== undefined && !error
   const percent = Math.round((progress ?? 0) * 100)
+
+  // A tag removed on its own x takes the keyboard with it: the page has the
+  // focus, and the next Tab starts from its top. The cleanup runs while the
+  // tag is still in the page, so it can hand the focus on first — to the next
+  // tag's x, else the one before, else the text the tags are attached to.
+  const root = React.useRef<HTMLSpanElement | null>(null)
+  React.useLayoutEffect(() => {
+    const el = root.current
+    return () => {
+      if (!el || !el.contains(document.activeElement)) return
+      const tags = el.parentElement ? [...el.parentElement.querySelectorAll<HTMLElement>('[data-slot="tag"]')] : []
+      const at = tags.indexOf(el)
+      const neighbour = tags[at + 1] ?? tags[at - 1]
+      const next =
+        neighbour?.querySelector<HTMLElement>("button") ??
+        el.closest('[data-slot="composer"]')?.querySelector<HTMLElement>("textarea")
+      next?.focus()
+    }
+  }, [])
+
   return (
     <span
+      ref={(node) => {
+        root.current = node
+        if (typeof ref === "function") return ref(node)
+        if (ref) ref.current = node
+      }}
       data-slot="tag"
       title={error}
       className={cn(
diff --git a/src/components/ui/tool-steps.tsx b/src/components/ui/tool-steps.tsx
index 4722bf6..b0a3e82 100644
--- a/src/components/ui/tool-steps.tsx
+++ b/src/components/ui/tool-steps.tsx
@@ -55,19 +55,65 @@ function OutputBlock({
   )
 }
 
-/** One call on one line; opened, the call itself — or its diff, when it changed a file. */
-function StepRow({ step, labels }: { step: Step; labels?: Partial<StepLabels> }) {
-  const [open, setOpen] = React.useState(false)
+/**
+ * The row the keyboard was on as it was taken down, if any. A row made again
+ * in the same moment for the same call — the one call of a turn becoming the
+ * first of a group — takes the focus back, so a keyboard reading a call is
+ * not thrown to the top of the page. Forgotten right after, so a row made
+ * later for the same call does not take it.
+ */
+let focusedRowId: string | null = null
+
+/**
+ * One call on one line; opened, the call itself — or its diff, when it changed
+ * a file. Open on its own, or as told (`open`, `onOpenChange`) by a group that
+ * keeps the state of its rows.
+ */
+function StepRow({
+  step,
+  labels,
+  open: openProp,
+  onOpenChange,
+}: {
+  step: Step
+  labels?: Partial<StepLabels>
+  open?: boolean
+  onOpenChange?: (open: boolean) => void
+}) {
+  const [openState, setOpenState] = React.useState(false)
+  const open = openProp ?? openState
   const words = { ...defaultLabels, ...labels }
   const canOpen = Boolean(step.patch || step.detail || step.output || step.error)
+  const button = React.useRef<HTMLButtonElement>(null)
+
+  React.useLayoutEffect(() => {
+    const el = button.current
+    if (focusedRowId === step.id) {
+      focusedRowId = null
+      el?.focus()
+    }
+    return () => {
+      // Runs while the row is still in the page, so the focus can be seen.
+      if (el && el === document.activeElement) {
+        focusedRowId = step.id
+        queueMicrotask(() => {
+          if (focusedRowId === step.id) focusedRowId = null
+        })
+      }
+    }
+  }, [step.id])
 
   return (
     <div data-slot="step-row" className="flex flex-col gap-1.5">
       <button
+        ref={button}
         type="button"
         aria-expanded={canOpen ? open : undefined}
         disabled={!canOpen}
-        onClick={() => setOpen((value) => !value)}
+        onClick={() => {
+          setOpenState(!open)
+          onOpenChange?.(!open)
+        }}
         className={cn(lineClass, step.status === "running" && "animate-pulse motion-reduce:animate-none")}
       >
         <span className="truncate text-[12.5px]">{step.label}</span>
@@ -96,12 +142,30 @@ type StepLabels = { detail: string; output: string; error: string }
 const defaultLabels: StepLabels = { detail: "Input", output: "Output", error: "Error" }
 
 /** Calls as a list of what each one did; a row opens to the call itself. */
-function StepList({ steps, labels, className }: { steps: Step[]; labels?: Partial<StepLabels>; className?: string }) {
+function StepList({
+  steps,
+  labels,
+  className,
+  openRows,
+  onRowOpenChange,
+}: {
+  steps: Step[]
+  labels?: Partial<StepLabels>
+  className?: string
+  /** Which rows are open, by call; without it each row keeps its own. */
+  openRows?: Record<string, boolean>
+  onRowOpenChange?: (id: string, open: boolean) => void
+}) {
   return (
     <div data-slot="step-list" className={cn("glass-panel flex flex-col divide-y divide-border rounded-md", className)}>
       {steps.map((step) => (
         <div key={step.id} className="px-2.5 py-1.5">
-          <StepRow step={step} labels={labels} />
+          <StepRow
+            step={step}
+            labels={labels}
+            open={openRows ? (openRows[step.id] ?? false) : undefined}
+            onOpenChange={onRowOpenChange && ((open) => onRowOpenChange(step.id, open))}
+          />
         </div>
       ))}
     </div>
@@ -137,10 +201,33 @@ function StepGroup({
   const running = steps.some((step) => step.status === "running")
   const [open, setOpen] = React.useState(defaultOpen)
   const stats = totalStats(steps)
+  // Which rows are open, by call, held here rather than in the rows: a row
+  // is made again when the group forms round it, and must not forget.
+  const [openRows, setOpenRows] = React.useState<Record<string, boolean>>({})
+  const setRowOpen = (id: string, value: boolean) => setOpenRows((rows) => ({ ...rows, [id]: value }))
+
+  // When a second call joins the first, the group opens if that call was
+  // open, so what was being read stays in view instead of folding away.
+  const single = steps.length === 1 ? steps[0].id : null
+  const [lastSingle, setLastSingle] = React.useState(single)
+  if (single !== lastSingle) {
+    setLastSingle(single)
+    if (lastSingle !== null && steps.length > 1 && openRows[lastSingle]) setOpen(true)
+  }
 
   // Finishing the same call must not close its details or remove its focused
   // button. A different call starts closed instead of inheriting that state.
-  if (steps.length === 1) return <StepRow key={steps[0].id} step={steps[0]} labels={labels} />
+  if (single !== null) {
+    return (
+      <StepRow
+        key={single}
+        step={steps[0]}
+        labels={labels}
+        open={openRows[single] ?? false}
+        onOpenChange={(value) => setRowOpen(single, value)}
+      />
+    )
+  }
 
   return (
     <div data-slot="step-group" className="flex flex-col gap-1.5">
@@ -151,7 +238,7 @@ function StepGroup({
         {stats && <DiffStats {...stats} />}
         <ChevronRight className={cn("size-3.5 shrink-0 transition-transform", open && "rotate-90")} />
       </button>
-      {open && <StepList steps={steps} labels={labels} />}
+      {open && <StepList steps={steps} labels={labels} openRows={openRows} onRowOpenChange={setRowOpen} />}
     </div>
   )
 }
diff --git a/src/components/ui/turn-status.tsx b/src/components/ui/turn-status.tsx
index 89773da..9744ca4 100644
--- a/src/components/ui/turn-status.tsx
+++ b/src/components/ui/turn-status.tsx
@@ -62,7 +62,13 @@ function TurnStatus({
 }) {
   const [open, setOpen] = React.useState(false)
   const elapsed = useElapsed(since)
-  const opens = Boolean(children)
+  // Once the line has had something to open it stays a button. Turned back
+  // into plain words between steps, it would drop the keyboard on it to the
+  // page; between steps it is a button with nothing to open, and still there.
+  const [hadChildren, setHadChildren] = React.useState(Boolean(children))
+  if (children && !hadChildren) setHadChildren(true)
+  const opens = Boolean(children) || hadChildren
+  const openable = Boolean(children)
   // The glyph is decorative. Even without visible words, expose the activity
   // and keep the disclosure's name independent of the clock and token count.
   const activityLabel = label?.trim() || activity
@@ -93,12 +99,16 @@ function TurnStatus({
           <button
             type="button"
             aria-label={activityLabel}
-            aria-expanded={open}
-            onClick={() => setOpen((value) => !value)}
-            className="flex w-fit max-w-full items-center gap-2 text-[12.5px] text-muted-foreground transition-colors outline-none hover:text-foreground focus-visible:text-foreground"
+            aria-expanded={openable ? open : undefined}
+            aria-disabled={!openable || undefined}
+            onClick={() => openable && setOpen((value) => !value)}
+            className={cn(
+              "flex w-fit max-w-full items-center gap-2 text-[12.5px] text-muted-foreground transition-colors outline-none",
+              openable ? "hover:text-foreground focus-visible:text-foreground" : "cursor-default"
+            )}
           >
             {line}
-            <ChevronRight className={cn("size-3.5 shrink-0 transition-transform", open && "rotate-90")} />
+            {openable && <ChevronRight className={cn("size-3.5 shrink-0 transition-transform", open && "rotate-90")} />}
           </button>
         ) : (
           <div className="flex w-fit max-w-full items-center gap-2 text-[12.5px] text-muted-foreground">
diff --git a/src/examples/ask-card-demo.tsx b/src/examples/ask-card-demo.tsx
index 893e2b0..fb14be6 100644
--- a/src/examples/ask-card-demo.tsx
+++ b/src/examples/ask-card-demo.tsx
@@ -12,7 +12,12 @@ export default function AskCardDemo() {
   return (
     <div className="w-full max-w-md">
       {/* Once answered, onAnswer is left out: the choices stay as a record. */}
-      <AskCard question={QUESTION} options={["Raise to 120s and rerun", "Leave out and say so"]} onAnswer={answer ? undefined : setAnswer} />
+      <AskCard
+        question={QUESTION}
+        options={["Raise to 120s and rerun", "Leave out and say so"]}
+        onAnswer={answer ? undefined : setAnswer}
+        chosen={answer ?? undefined}
+      />
       {answer && (
         <p className="mt-3 text-[12.5px] text-muted-foreground">
           Answered “{answer}”.{" "}
diff --git a/src/examples/tool-steps-demo.tsx b/src/examples/tool-steps-demo.tsx
index 1ff4d00..425fe7d 100644
--- a/src/examples/tool-steps-demo.tsx
+++ b/src/examples/tool-steps-demo.tsx
@@ -22,14 +22,22 @@ const steps: Step[] = [
 
 export default function ToolStepsDemo() {
   const [status, setStatus] = React.useState<Step["status"]>("running")
+  // A second call joining the first: the one line becomes a group round it.
+  const [joined, setJoined] = React.useState(false)
   const timer = React.useRef(0)
   React.useEffect(() => () => window.clearTimeout(timer.current), [])
 
   const finish = (next: "done" | "error") => {
     window.clearTimeout(timer.current)
     setStatus("running")
+    setJoined(false)
     timer.current = window.setTimeout(() => setStatus(next), 2000)
   }
+  const join = () => {
+    window.clearTimeout(timer.current)
+    setJoined(false)
+    timer.current = window.setTimeout(() => setJoined(true), 2000)
+  }
   const single: Step = {
     id: "single-run",
     label: status === "running" ? "Running python research.py" : "Ran python research.py",
@@ -45,11 +53,18 @@ export default function ToolStepsDemo() {
       <StepGroup steps={steps} />
       <div className="flex flex-col gap-2">
         <p className="text-xs text-muted-foreground">Schedule a result, then open the call while it runs.</p>
-        <div className="flex gap-2">
+        <div className="flex flex-wrap gap-2">
           <Button variant="outline" size="sm" onClick={() => finish("done")}>Finish after 2s</Button>
           <Button variant="outline" size="sm" onClick={() => finish("error")}>Fail after 2s</Button>
+          <Button variant="outline" size="sm" onClick={join}>Second call after 2s</Button>
         </div>
-        <StepGroup steps={[single]} />
+        <StepGroup
+          steps={
+            joined
+              ? [single, { id: "second-run", label: "Running pytest", status: "running", detail: "pytest -q", detailLabel: "Command" }]
+              : [single]
+          }
+        />
       </div>
     </div>
   )
diff --git a/src/solid-glass.css b/src/solid-glass.css
index 2511839..0cd3ccc 100644
--- a/src/solid-glass.css
+++ b/src/solid-glass.css
@@ -861,6 +861,28 @@
   --tw-ring-shadow: 0 0 0 1px var(--background), 0 0 0 3px var(--focus-line);
 }
 
+/* The lines of text that are buttons: a turn's status line, a step, a
+   thought's heading, a tag's x, the choices on a card, a pick under the
+   composer. They are neither fields nor panes, so a ring would be a smudge
+   round a word, and a change of grey alone cannot be seen (it was tried). The
+   one the keyboard is on gets a hairline a little off the words, in the line
+   the ring is drawn in. Outside the layers, so a component's outline-none
+   cannot take it away. */
+:is(
+    [data-slot="turn-status"],
+    [data-slot="step-row"],
+    [data-slot="step-group"],
+    [data-slot="ask-card"],
+    [data-slot="tag"]
+  )
+  :is(button, summary):focus-visible,
+[data-slot="reasoning"] > summary:focus-visible,
+[data-slot="context-ring-detail"]:focus-visible,
+[data-slot="composer-pick"]:focus-visible {
+  outline: 1px solid var(--focus-line);
+  outline-offset: 2px;
+}
+
 /* Some of shadcn/ui's menus are painted in a see-through popover colour.
    Here what floats is the thickest glass, whichever component it belongs to. */
 [data-slot="select-content"],