From 497b29804cec3f7878df0c9200a84ec1e6a8bbe0 Mon Sep 17 00:00:00 2001
From: amosblomqvist <amosblomqvist@gmail.com>
Date: Thu, 8 Oct 2026 18:32:21 +0300
Subject: [PATCH] =?UTF-8?q?ui:=20round=20three=20=E2=80=94=20the=20tight?=
 =?UTF-8?q?=20band,=20one=20geometry=20everywhere?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Owner round three on the user rows: (1) the band padding halves,
py-2.5 -> py-[5px] — subtle, not tall; same for the messages. (2) The
in-card thinking joins the band: identical styling and heights for
collapsed thinking in the chat and inside question cards (card-on-card
is quiet by design; revert if it reads too light). (3) The left gap
MATCHES the new 5px padding, so the rail fills the rest of the 3ch
inset - border-l-[calc(3ch-5px)] pl-[5px]: a thick muted rail, total
inset still 3ch (the chevron-alignment law survives). The banded prop
dies - one geometry, cards included.
---
 components/answered-card.tsx           | 15 ++++------
 components/chat.tsx                    | 11 ++++----
 components/thinking-block.tsx          | 38 ++++++++++++--------------
 tests/render-cards.test.tsx            |  9 +++---
 tests/render-md-blocks.test.tsx        | 15 +++-------
 tests/render-practice-surface.test.tsx |  2 +-
 6 files changed, 39 insertions(+), 51 deletions(-)

diff --git a/components/answered-card.tsx b/components/answered-card.tsx
index 30c509a..67c5f6c 100644
--- a/components/answered-card.tsx
+++ b/components/answered-card.tsx
@@ -143,16 +143,11 @@ export function AnsweredCard({ answer }: { answer: QuestionAnswerData }) {
 
 			{(answer.thinking ?? answer.note) && (
 				/* The SAME unified row (owner round, 2026-10-05): the quiz answer's
-				    thinking is the identical collapsible ThinkingBlock — it just
-				    happens to sit INSIDE the card, so it takes the rail but no band
-				    (owner round two, 2026-10-07: card-color on card-color would be
-				    invisible; geometry alone carries it there). */
-				<ThinkingBlock
-					testId="your-thinking"
-					label="YOUR THINKING"
-					text={answer.thinking ?? answer.note ?? ""}
-					banded={false}
-				/>
+				    thinking is the identical collapsible ThinkingBlock — and since
+				    owner round three (2026-10-07) IDENTICALLY styled, band and all:
+				    collapsed thinking matches in height everywhere, card or chat
+				    (card-on-card is quiet by design; too light → revert). */
+				<ThinkingBlock testId="your-thinking" label="YOUR THINKING" text={answer.thinking ?? answer.note ?? ""} />
 			)}
 
 			{/* px-3→removed: card p-4 + box px-3 double-inset sat the "Why" label deeper
diff --git a/components/chat.tsx b/components/chat.tsx
index 7b6e9b4..e2e23d1 100644
--- a/components/chat.tsx
+++ b/components/chat.tsx
@@ -1399,13 +1399,14 @@ export function Chat({
 										    Rendered WITHOUT the Message wrapper — that is the bubble. */
 											<div
 										data-testid="user-message"
-										/* THE DOCUMENT, ALL-IN (owner round two, 2026-10-07): no
-										    chat side — the user message is a full-width card-color
-										    BAND with the 6px rail, the same geometry as the thinking
-										    rows (the band is the authorship mark against the agent's
+										/* THE DOCUMENT, ALL-IN (owner rounds two+three, 2026-10-07):
+										    no chat side — the user message is a full-width card-color
+										    BAND, the IDENTICAL geometry as the thinking rows: 5px band
+										    padding, the left gap matches it, the rail fills the 3ch
+										    inset (the band is the authorship mark against the agent's
 										    transparent prose). The "You" label stays — one register
 										    with the thinking labels. */
-										className="my-2 w-full border-l-[6px] border-muted-foreground/30 bg-card py-2.5 pl-[calc(3ch-6px)] pr-2 font-ui text-xs"
+										className="my-2 w-full border-l-[calc(3ch-5px)] border-muted-foreground/30 bg-card py-[5px] pl-[5px] pr-2 font-ui text-xs"
 									>
 												{/* The rail GROUPS (owner round 4, 2026-10-05): the YOU heading
 												    sits INSIDE the rail, same mono-xs register and same 1ch
diff --git a/components/thinking-block.tsx b/components/thinking-block.tsx
index 9af771d..67d0c67 100644
--- a/components/thinking-block.tsx
+++ b/components/thinking-block.tsx
@@ -17,17 +17,19 @@ import { cn } from "@/lib/utils";
  *  The glance-level law (owner): user thinking = rail + 50% italic;
  *  agent thinking = no rail.
  *
- *  THE DOCUMENT, ALL-IN (owner round two, 2026-10-07): no chat sides —
- *  transcript-level user rows (this block, the "You" message) are
- *  full-width CARD-COLOR BANDS: the band is the authorship mark against
- *  the agent's transparent prose, and the rail runs along the band's left
- *  edge. The rail keeps its muted color but is now 6px wide, eating the
- *  artificial air of the old 3ch inset — the total inset STAYS 3ch so the
- *  chevron-alignment law with the agent's flush rows survives; the gap
- *  between rail and text drops to natural (3ch - 6px). In-card rows
- *  (inside the answered card, on the card's own background) take the rail
- *  but NO band (`banded: false`). `defaultOpen` marks transcript rows,
- *  which arrive EXPANDED (clearly conveyed that the thinking was sent).
+ *  THE DOCUMENT, ALL-IN (owner rounds two+three, 2026-10-07): no chat
+ *  sides — user rows are full-width CARD-COLOR BANDS (the band is the
+ *  authorship mark against the agent's transparent prose) with the rail
+ *  along the left edge. ONE geometry everywhere, in cards and out: the
+ *  band padding is a tight 5px (round three: halved — subtle, not tall),
+ *  and the left gap MATCHES it, so the rail fills the rest of the 3ch
+ *  inset — border-l-[calc(3ch-5px)] pl-[5px]. Total inset stays 3ch (the
+ *  chevron-alignment law with the agent's flush rows survives); the rail
+ *  grows as the padding shrinks. In-card rows carry the identical
+ *  styling (owner round three: same band, same heights — card-on-card is
+ *  quiet by design; if it reads too light we revert). `defaultOpen`
+ *  marks transcript rows, which arrive EXPANDED (clearly conveyed that
+ *  the thinking was sent).
  *
  *  ⌘T (toggle-user-thinking) sets EVERY row to one state via the module
  *  store below — one source of truth, no provider tree: rows subscribe on
@@ -66,7 +68,6 @@ export function ThinkingBlock({
 	text,
 	testId,
 	dataCommit,
-	banded = true,
 	defaultOpen = false,
 }: {
 	label?: string;
@@ -74,8 +75,6 @@ export function ThinkingBlock({
 	testId?: string;
 	/** The practice marker's register flag (commit vs nudge). */
 	dataCommit?: boolean;
-	/** Transcript rows carry the card-color band; in-card rows rail only. */
-	banded?: boolean;
 	/** Transcript rows arrive expanded (owner, 2026-10-07). */
 	defaultOpen?: boolean;
 }) {
@@ -101,13 +100,12 @@ export function ThinkingBlock({
 			data-testid={testId}
 			data-commit={dataCommit === undefined ? undefined : dataCommit ? "true" : "false"}
 			className={cn(
-				// The rail geometry (owner round two, 2026-10-07): total inset
+				// The rail geometry (owner round three, 2026-10-07): total inset
 				// STAYS 3ch (the chevron-alignment law with the agent's flush
-				// rows), re-split — 6px rail (was 2px) + a natural 3ch-6px gap
-				// (was the too-wide 3ch-2px). In-card rows keep the 12px my-3
-				// rhythm; banded rows sit my-2 apart (the band's own air).
-				"lh-card-enter w-full border-l-[6px] border-muted-foreground/30 pl-[calc(3ch-6px)] font-ui text-xs",
-				banded ? "my-2 bg-card py-2.5" : "my-3",
+				// rows). The band padding is a tight 5px (halved from 10px) and
+				// the left gap MATCHES it — the rail fills the rest:
+				// calc(3ch-5px) wide. One geometry everywhere, cards included.
+				"lh-card-enter my-2 w-full border-l-[calc(3ch-5px)] border-muted-foreground/30 bg-card py-[5px] pl-[5px] font-ui text-xs",
 			)}
 		>
 			<button
diff --git a/tests/render-cards.test.tsx b/tests/render-cards.test.tsx
index 4bda35f..0ede969 100644
--- a/tests/render-cards.test.tsx
+++ b/tests/render-cards.test.tsx
@@ -295,13 +295,14 @@ describe("render smoke tests", () => {
 		// trigger row only — the thinking text is one click away, never loud.
 		assert.ok(html.includes('data-testid="your-thinking-trigger"'), "the trigger row");
 		assert.ok(html.includes('aria-expanded="false"'), "arrives collapsed");
-		// IN-CARD = RAIL ONLY (owner round two, 2026-10-07): no band on the
-		// card's own background; geometry alone carries it there.
+		// IDENTICAL GEOMETRY (owner round three, 2026-10-07): the in-card row
+		// carries the band too — collapsed thinking matches in height
+		// everywhere, card or chat.
 		const yourRow = html.slice(html.indexOf('data-testid="your-thinking"'));
-		assert.ok(!yourRow.slice(0, 400).includes("bg-card"), "no band inside the card");
+		assert.ok(yourRow.slice(0, 400).includes("bg-card"), "the band inside the card as well");
 		// THE RAIL GROUPS (owner correction): the label sits INSIDE the rail —
 		// ownership readable from the rail alone, collapsed or expanded.
-		const railAt = html.indexOf("border-l-[6px]");
+		const railAt = html.indexOf("border-l-[calc(3ch-5px)]");
 		const trigAt = html.indexOf("your-thinking-trigger");
 		assert.ok(railAt !== -1 && railAt < trigAt, "the rail opens before the label (same quote)");
 		assert.ok(!html.includes("brightness isn&#x27;t distance"), "the text is hidden until expanded");
diff --git a/tests/render-md-blocks.test.tsx b/tests/render-md-blocks.test.tsx
index a67df08..781f937 100644
--- a/tests/render-md-blocks.test.tsx
+++ b/tests/render-md-blocks.test.tsx
@@ -242,24 +242,17 @@ describe("md-blocks — the restored plain blockquote (owner round, 2026-10-07)"
 	});
 });
 
-describe("ThinkingBlock — side-based authorship + ⌘T sync (owner round, 2026-10-07)", () => {
-	it("the banded row is the document band — full-width card color, 6px rail", () => {
+describe("ThinkingBlock — the document band + ⌘T sync (owner rounds, 2026-10-07)", () => {
+	it("the row is the document band — one geometry, cards included (owner round three)", () => {
 		const html = renderToStaticMarkup(<ThinkingBlock text="banded" defaultOpen />);
 		assert.ok(html.includes("bg-card"), "the card-color band");
-		assert.ok(html.includes("border-l-[6px]"), "the 6px rail");
-		assert.ok(html.includes("pl-[calc(3ch-6px)]"), "natural gap, 3ch total inset preserved");
+		assert.ok(html.includes("border-l-[calc(3ch-5px)]"), "the rail fills the 3ch inset");
+		assert.ok(html.includes("py-[5px]") && html.includes("pl-[5px]"), "tight 5px padding, gap matches it");
 		assert.ok(html.includes("w-full"), "full width — no chat side");
 		assert.match(html, /aria-expanded="true"/);
 		assert.ok(html.includes("banded"), "text visible on arrival");
 	});
 
-	it("in-card rows take the rail but no band", () => {
-		const html = renderToStaticMarkup(<ThinkingBlock text="in card" banded={false} />);
-		assert.ok(!html.includes("bg-card"), "no band on the card's own background");
-		assert.ok(html.includes("border-l-[6px]"), "the rail stays");
-		assert.ok(html.includes("my-3"), "the 12px in-card rhythm");
-	});
-
 	it("⌘T sets every row — explicit sets stomp individual state, late mounts honor the last set", () => {
 		setAllUserThinkingOpen(false);
 		const collapsed = renderToStaticMarkup(<ThinkingBlock text="synced" defaultOpen />);
diff --git a/tests/render-practice-surface.test.tsx b/tests/render-practice-surface.test.tsx
index e4d16d0..721c783 100644
--- a/tests/render-practice-surface.test.tsx
+++ b/tests/render-practice-surface.test.tsx
@@ -185,7 +185,7 @@ describe("the practice transcript cards", () => {
 		assert.match(trace, /aria-expanded="true"/);
 		assert.ok(trace.includes("stuck at step two"), "the text is visible on arrival");
 		assert.ok(trace.includes("bg-card"), "the card-color band");
-		assert.ok(trace.includes("border-l-[6px]"), "the 6px rail, left side");
+		assert.ok(trace.includes("border-l-[calc(3ch-5px)]"), "the rail fills the 3ch inset");
 		const legacy = renderToStaticMarkup(<ThinkingCard data={{ problemCallId: "c", commit: true, text: "It is 42." }} />);
 		assert.match(legacy, /YOUR THINKING/);
 		assert.doesNotMatch(legacy, /Your solution/);