style(transcript): the chevron trails what it discloses

"Ran 2 commands ⌄", not "⌄ Ran 2 commands" — matching the reference.

Flipped in BOTH headers, not just the group. A trailing chevron on the group summary and a
leading one on a command card would be two disclosure controls disagreeing inside the same
transcript, which is a worse inconsistency than the one being fixed.

It hugs the label rather than right-aligning to the card edge. A disclosure control belongs
beside the thing it opens; a chevron alone at the far right of a wide row reads as unrelated
chrome. Change counts (+42 -8) stay trailing after it — they are status, not a control.

Moved in the MARKUP rather than with CSS `order`, so tab order and visual order stay the
same thing. The guard pins that too: reordering with `order` would satisfy a
looks-right-on-screen check while leaving a keyboard user tabbing through a line backwards.

Bypass-verified by flipping it back.

21 tests in groupReducer, 38 suites green.

Author: ndemianc

extensions/levelcode-ai/media/chat.html

@@ -528,7 +528,11 @@
   .tl-group.gok .tl-node .ci, .tl-group.gfailed .tl-node .ci { width: 18px; height: 18px; }
   @keyframes nodepulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 40%, transparent); } 70%, 100% { box-shadow: 0 0 0 6px transparent; } }
   .tl-cmd .cmdhead { display: flex; align-items: center; gap: 7px; min-width: 0; cursor: pointer; user-select: none; padding: 2px 0; }
-  .tl-cmd .cmdchev { flex: 0 0 auto; display: inline-flex; color: var(--muted); }
+  /* The chevron TRAILS what it discloses, matching the reference: "Ran 2 commands ⌄", not
+     "⌄ Ran 2 commands". It hugs the label rather than right-aligning to the card edge — a
+     disclosure control belongs next to the thing it opens, and a chevron alone at the far right of
+     a wide row reads as unrelated chrome. */
+  .tl-cmd .cmdchev { flex: 0 0 auto; display: inline-flex; color: var(--muted); margin-left: 1px; }
   .tl-cmd .cmdchev .ci { width: 11px; height: 11px; transition: transform .15s ease; }
   .tl-cmd.collapsed .cmdchev .ci { transform: rotate(-90deg); }
   .tl-cmd .cmdverb { flex: 0 0 auto; font-size: 12.5px; color: var(--vscode-foreground); }
@@ -2167,9 +2171,9 @@
       '<div class="tl-rail"><span class="tl-node">' + codicon('sync') + '</span></div>'
       + '<div class="tl-body">'
         + '<div class="grouphead cmdhead" title="Expand / collapse">'
-          + '<span class="cmdchev">' + codicon('chevron-down') + '</span>'
           + '<span class="groupmark"></span>'
           + '<span class="grouplabel"></span>'
+          + '<span class="cmdchev">' + codicon('chevron-down') + '</span>'
           + '<span class="groupcounts"></span>'
           + '<button class="groupstop" hidden title="Stop the running command">' + codicon('stop-circle') + '</button>'
           + '<span class="cmdstate groupstate running">' + LC_DOTS + '</span>'
@@ -2574,8 +2578,8 @@
       '<div class="tl-rail"><span class="tl-node">' + codicon('terminal') + '</span></div>'
       + '<div class="tl-body">'
         + '<div class="cmdhead" title="Collapse / expand">'
-          + '<span class="cmdchev">' + codicon('chevron-down') + '</span>'
           + '<span class="cmdverb">' + (m.background ? 'Running in background' : 'Running') + '</span>'
+          + '<span class="cmdchev">' + codicon('chevron-down') + '</span>'
           + '<span class="cmdchips">' + chips + '</span>'
           + '<span class="cmdstate running">' + LC_DOTS + '</span>'
         + '</div>'

extensions/levelcode-ai/test/groupReducer.test.js

@@ -374,4 +374,26 @@ test('FALLBACK: an unrecognised step is named, not counted', () => {
 		'name the first and count the rest, sentence-cased like every other path: ' + out);
 });
 
+
+test('CHEVRON: the disclosure control TRAILS what it discloses', () => {
+	// "Ran 2 commands ⌄", not "⌄ Ran 2 commands" — matching the reference. Pinned on DOM order, not
+	// on CSS `order`, so the tab order and the visual order stay the same thing.
+	const html = fs.readFileSync(path.join(__dirname, '..', 'media', 'chat.html'), 'utf8');
+
+	const head = html.slice(html.indexOf("'<div class=\"grouphead cmdhead\""), html.indexOf("'<div class=\"groupbody\""));
+	assert.ok(head.indexOf('grouplabel') < head.indexOf('cmdchev'),
+		'the group chevron must come AFTER the label');
+	assert.ok(head.indexOf('groupmark') < head.indexOf('grouplabel'),
+		'the outcome glyph still leads the line');
+	assert.ok(head.indexOf('cmdchev') < head.indexOf('groupcounts'),
+		'the chevron hugs the label; counts stay trailing chrome');
+
+	const cmd = html.slice(html.indexOf("'<div class=\"cmdhead\" title=\"Collapse / expand\""), html.indexOf("'<div class=\"cmdbox\""));
+	assert.ok(cmd.indexOf('cmdverb') < cmd.indexOf('cmdchev'),
+		'a command card must flip too, or the two disclosure controls disagree');
+
+	assert.ok(!/\.cmdchev[^{]*\{[^}]*order:/.test(html),
+		'do not reorder with CSS `order` — it desynchronises tab order from what is on screen');
+});
+
 console.log('groupReducer: ' + n + ' tests passed');