42173ed tui: user bubble layout, OSC 11 theme detection, image footprint fix · zut

M internal/agent/cli.go +1 -1


@@ -637,7 +637,7 @@ func runInteractive(ctx context.Context, args Args, version string) error {
637	637
638	638		iv = modes.NewInteractive(modes.InteractiveConfig{
639	639		Terminal: term,
640		-	Theme: tui.Dark,
	640	+	Theme: tui.DetectThemeFromBackground(80 * time.Millisecond),
641	641		Model: r.Model,
642	642		Provider: r.Provider,
643	643		AuthMethod: r.AuthMethod,


@@ -637,7 +637,7 @@ func runInteractive(ctx context.Context, args Args, version string) error {
637			637
638		iv = modes.NewInteractive(modes.InteractiveConfig{	638		iv = modes.NewInteractive(modes.InteractiveConfig{
639		Terminal: term,	639		Terminal: term,
640	-	Theme: tui.Dark,	640	+	Theme: tui.DetectThemeFromBackground(80 * time.Millisecond),
641		Model: r.Model,	641		Model: r.Model,
642		Provider: r.Provider,	642		Provider: r.Provider,
643		AuthMethod: r.AuthMethod,	643		AuthMethod: r.AuthMethod,

M internal/agent/modes/btw_dialog.go +39 -8


@@ -300,15 +300,14 @@ func (d *btwDialog) Render(th tui.Theme, width int) []string {
300	300
301	301		for _, t := range d.turns {
302	302		out = append(out, "")
303		-	out = append(out, " "+th.AccentBar(th.User)+th.FG256(th.User, "you"))
304		-	for _, line := range strings.Split(t.User, "\n") {
305		-	out = append(out, " "+th.FG256(th.Muted, line))
306		-	}
	303	+	out = append(out, btwUserBubbleRows(th, t.User, width-2)...)
307	304		if t.Assistant != "" {
308	305		out = append(out, "")
309		-	out = append(out, " "+th.AccentBar(th.Assistant)+th.FG256(th.Assistant, "zot"))
310	306		md := tui.RenderMarkdown(t.Assistant, th, width-4)
311	307		for _, line := range strings.Split(md, "\n") {
	308	+	if len(line) > 0 && line[0] == tui.FlushLeftSentinel {
	309	+	line = line[1:]
	310	+	}
312	311		out = append(out, " "+line)
313	312		}
314	313		}

@@ -339,6 +338,7 @@ func (d *btwDialog) Render(th tui.Theme, width int) []string {
339	338		// marker, so just two cells of pad.
340	339		out = append(out, " "+l)
341	340		}
	341	+	out = append(out, "") // breathing room between editor and frame rule
342	342		}
343	343		out = append(out, frameRuleColor(th, width, th.Accent))
344	344		return out

@@ -362,11 +362,9 @@ func (d *btwDialog) CursorPos(width int) (row, col int) {
362	362		}
363	363		for _, t := range d.turns {
364	364		editorOffset++ // blank
365		-	editorOffset++ // "you" header
366		-	editorOffset += len(strings.Split(t.User, "\n"))
	365	+	editorOffset += len(btwUserBubbleRows(d.theme, t.User, width-2))
367	366		if t.Assistant != "" {
368	367		editorOffset++ // blank
369		-	editorOffset++ // "zot" header
370	368		editorOffset += len(strings.Split(tui.RenderMarkdown(t.Assistant, d.theme, width-4), "\n"))
371	369		}
372	370		if t.Err != "" {

@@ -382,6 +380,39 @@ func (d *btwDialog) CursorPos(width int) (row, col int) {
382	380		return editorOffset + eRow, eCol + 2 /* matches render indent */
383	381		}
384	382
	383	+	// btwUserBubbleRows renders a user message inside the /btw dialog
	384	+	// using the same bubble layout the main chat uses (full-width tinted
	385	+	// panel, left-edge ▌ bar, padding rows above and below). The frame
	386	+	// padding is the caller's job; bubbleWidth is the available row
	387	+	// width inside the frame.
	388	+	func btwUserBubbleRows(th tui.Theme, text string, bubbleWidth int) []string {
	389	+	const leftGutter = 0
	390	+	const rightGutter = 2
	391	+	innerWidth := bubbleWidth - 2 - leftGutter - rightGutter // 2 = bar's two cells
	392	+	if innerWidth < 1 {
	393	+	innerWidth = 1
	394	+	}
	395	+	bar := th.BG256(th.UserBubbleBG, th.FG256(th.Accent, "▌ "))
	396	+	row := func(content string) string {
	397	+	inner := strings.Repeat(" ", leftGutter) + content
	398	+	return " " + bar + th.UserBubble(inner, bubbleWidth-2)
	399	+	}
	400	+	var bubble []string
	401	+	for _, l := range strings.Split(text, "\n") {
	402	+	for _, w := range tui.WrapANSILine(l, innerWidth) {
	403	+	bubble = append(bubble, row(w))
	404	+	}
	405	+	}
	406	+	if len(bubble) == 0 {
	407	+	return nil
	408	+	}
	409	+	out := make([]string, 0, len(bubble)+2)
	410	+	out = append(out, row(""))
	411	+	out = append(out, bubble...)
	412	+	out = append(out, row(""))
	413	+	return out
	414	+	}
	415	+
385	416		// errMessage is a tiny helper for the future when we want to surface
386	417		// retryable failures in a styled way.
387	418		func errMessage(err error) string {

 	for _, t := range d.turns {
 		out = append(out, "")
-		out = append(out, "  "+th.AccentBar(th.User)+th.FG256(th.User, "you"))
+		out = append(out, btwUserBubbleRows(th, t.User, width-2)...)
-		for _, line := range strings.Split(t.User, "\n") {
-			out = append(out, "    "+th.FG256(th.Muted, line))
-		}
 		if t.Assistant != "" {
 			out = append(out, "")
-			out = append(out, "  "+th.AccentBar(th.Assistant)+th.FG256(th.Assistant, "zot"))
 			md := tui.RenderMarkdown(t.Assistant, th, width-4)
 			for _, line := range strings.Split(md, "\n") {
+				if len(line) > 0 && line[0] == tui.FlushLeftSentinel {
+					line = line[1:]
+				}
 				out = append(out, "    "+line)
 			}
 		}
 			// marker, so just two cells of pad.
 			out = append(out, "  "+l)
 		}
+		out = append(out, "") // breathing room between editor and frame rule
 	}
 	out = append(out, frameRuleColor(th, width, th.Accent))
 	return out
 	}
 	for _, t := range d.turns {
 		editorOffset++ // blank
-		editorOffset++ // "you" header
+		editorOffset += len(btwUserBubbleRows(d.theme, t.User, width-2))
-		editorOffset += len(strings.Split(t.User, "\n"))
 		if t.Assistant != "" {
 			editorOffset++ // blank
-			editorOffset++ // "zot" header
 			editorOffset += len(strings.Split(tui.RenderMarkdown(t.Assistant, d.theme, width-4), "\n"))
 		}
 		if t.Err != "" {
 	return editorOffset + eRow, eCol + 2 /* matches render indent */
 }
+// btwUserBubbleRows renders a user message inside the /btw dialog
+// using the same bubble layout the main chat uses (full-width tinted
+// panel, left-edge ▌ bar, padding rows above and below). The frame
+// padding is the caller's job; bubbleWidth is the available row
+// width inside the frame.
+func btwUserBubbleRows(th tui.Theme, text string, bubbleWidth int) []string {
+	const leftGutter = 0
+	const rightGutter = 2
+	innerWidth := bubbleWidth - 2 - leftGutter - rightGutter // 2 = bar's two cells
+	if innerWidth < 1 {
+		innerWidth = 1
+	}
+	bar := th.BG256(th.UserBubbleBG, th.FG256(th.Accent, "▌ "))
+	row := func(content string) string {
+		inner := strings.Repeat(" ", leftGutter) + content
+		return "  " + bar + th.UserBubble(inner, bubbleWidth-2)
+	}
+	var bubble []string
+	for _, l := range strings.Split(text, "\n") {
+		for _, w := range tui.WrapANSILine(l, innerWidth) {
+			bubble = append(bubble, row(w))
+		}
+	}
+	if len(bubble) == 0 {
+		return nil
+	}
+	out := make([]string, 0, len(bubble)+2)
+	out = append(out, row(""))
+	out = append(out, bubble...)
+	out = append(out, row(""))
+	return out
+}
 // errMessage is a tiny helper for the future when we want to surface
 // retryable failures in a styled way.
 func errMessage(err error) string {

M internal/agent/modes/changelog_dialog.go +3 -0


@@ -93,6 +93,9 @@ func (d *changelogDialog) Render(th tui.Theme, width int) []string {
93	93		// Regular line: render through markdown for bullet points etc.
94	94		rendered := tui.RenderMarkdown(l, th, width-4)
95	95		for _, rl := range strings.Split(rendered, "\n") {
	96	+	if len(rl) > 0 && rl[0] == tui.FlushLeftSentinel {
	97	+	rl = rl[1:]
	98	+	}
96	99		bodyLines = append(bodyLines, rl)
97	100		}
98	101		}


@@ -93,6 +93,9 @@ func (d *changelogDialog) Render(th tui.Theme, width int) []string {
93	// Regular line: render through markdown for bullet points etc.	93		// Regular line: render through markdown for bullet points etc.
94	rendered := tui.RenderMarkdown(l, th, width-4)	94		rendered := tui.RenderMarkdown(l, th, width-4)
95	for _, rl := range strings.Split(rendered, "\n") {	95		for _, rl := range strings.Split(rendered, "\n") {
		96	+	if len(rl) > 0 && rl[0] == tui.FlushLeftSentinel {
		97	+	rl = rl[1:]
		98	+	}
96	bodyLines = append(bodyLines, rl)	99		bodyLines = append(bodyLines, rl)
97	}	100		}
98	}	101		}

M internal/agent/modes/skills_dialog.go +5 -0


@@ -137,6 +137,11 @@ func (d *skillsDialog) renderBody(th tui.Theme, width int) []string {
137	137
138	138		rendered := tui.RenderMarkdown(s.Body, th, width-4)
139	139		bodyLines := strings.Split(rendered, "\n")
	140	+	for i, l := range bodyLines {
	141	+	if len(l) > 0 && l[0] == tui.FlushLeftSentinel {
	142	+	bodyLines[i] = l[1:]
	143	+	}
	144	+	}
140	145
141	146		const maxRows = 16
142	147		if d.scroll > len(bodyLines)-1 {


@@ -137,6 +137,11 @@ func (d *skillsDialog) renderBody(th tui.Theme, width int) []string {
137		137
138	rendered := tui.RenderMarkdown(s.Body, th, width-4)	138		rendered := tui.RenderMarkdown(s.Body, th, width-4)
139	bodyLines := strings.Split(rendered, "\n")	139		bodyLines := strings.Split(rendered, "\n")
		140	+	for i, l := range bodyLines {
		141	+	if len(l) > 0 && l[0] == tui.FlushLeftSentinel {
		142	+	bodyLines[i] = l[1:]
		143	+	}
		144	+	}
140		145
141	const maxRows = 16	146		const maxRows = 16
142	if d.scroll > len(bodyLines)-1 {	147		if d.scroll > len(bodyLines)-1 {

M internal/agent/modes/spinner.go +1 -1


@@ -38,7 +38,7 @@ var funnyWorkingLines = []string{
38	38		"picking a fight with syntax",
39	39		"reading between the bits",
40	40		"tasting the semicolons",
41		-	"pretending to understand go generics",
	41	+	"pretending to understand the code",
42	42		"petting the cache",
43	43		"drafting clever replies",
44	44		"warming up the GPU choir",


@@ -38,7 +38,7 @@ var funnyWorkingLines = []string{
38		"picking a fight with syntax",	38		"picking a fight with syntax",
39		"reading between the bits",	39		"reading between the bits",
40		"tasting the semicolons",	40		"tasting the semicolons",
41	-	"pretending to understand go generics",	41	+	"pretending to understand the code",
42		"petting the cache",	42		"petting the cache",
43		"drafting clever replies",	43		"drafting clever replies",
44		"warming up the GPU choir",	44		"warming up the GPU choir",

A internal/tui/detect_bg.go +161 -0

@@ -0,0 +1,161 @@
	1	+	package tui
	2	+
	3	+	import (
	4	+	"fmt"
	5	+	"os"
	6	+	"strconv"
	7	+	"strings"
	8	+	"time"
	9	+
	10	+	"golang.org/x/term"
	11	+	)
	12	+
	13	+	// DetectThemeFromBackground queries the controlling tty for its
	14	+	// current background colour using the OSC 11 escape sequence and
	15	+	// returns Dark or Light based on the response's perceived
	16	+	// luminance. Falls back to Dark when the terminal does not
	17	+	// reply within timeout, which is the expected behaviour for
	18	+	// terminals that do not implement OSC 11 (Linux console, VS Code's
	19	+	// integrated terminal in some configurations, tmux without
	20	+	// pass-through, very old emulators).
	21	+	//
	22	+	// The query / parse runs synchronously before the TUI is
	23	+	// initialised so the returned theme can drive the entire session.
	24	+	// We briefly put stdin into raw mode and disable echo so the OSC
	25	+	// reply doesn't leak onto the user's screen as visible bytes.
	26	+	func DetectThemeFromBackground(timeout time.Duration) Theme {
	27	+	// Honour explicit override env var first; some users / CI envs
	28	+	// know better than the heuristic.
	29	+	switch strings.ToLower(strings.TrimSpace(os.Getenv("ZOT_THEME"))) {
	30	+	case "dark":
	31	+	return Dark
	32	+	case "light":
	33	+	return Light
	34	+	}
	35	+
	36	+	if !term.IsTerminal(int(os.Stdin.Fd())) \|\| !term.IsTerminal(int(os.Stdout.Fd())) {
	37	+	return Dark
	38	+	}
	39	+
	40	+	fd := int(os.Stdin.Fd())
	41	+	st, err := term.MakeRaw(fd)
	42	+	if err != nil {
	43	+	return Dark
	44	+	}
	45	+	defer term.Restore(fd, st)
	46	+
	47	+	// Send the query. ST (\x1b\\) and BEL (\x07) are both accepted
	48	+	// terminators; some terminals only honour one of them, so we
	49	+	// send BEL which is more widely supported.
	50	+	if _, err := os.Stdout.Write([]byte("\x1b]11;?\x07")); err != nil {
	51	+	return Dark
	52	+	}
	53	+
	54	+	deadline := time.Now().Add(timeout)
	55	+	resp := readOSCResponse(deadline)
	56	+	if resp == "" {
	57	+	return Dark
	58	+	}
	59	+
	60	+	r, g, b, ok := parseOSC11Reply(resp)
	61	+	if !ok {
	62	+	return Dark
	63	+	}
	64	+
	65	+	// Rec. 709 luma. Threshold at 0.5: anything brighter than
	66	+	// mid-grey gets the light theme.
	67	+	luma := 0.2126float64(r) + 0.7152float64(g) + 0.0722*float64(b)
	68	+	if luma >= 0.5 {
	69	+	return Light
	70	+	}
	71	+	return Dark
	72	+	}
	73	+
	74	+	// readOSCResponse drains stdin into a small buffer until either a
	75	+	// terminator (BEL or ST) is seen, the deadline expires, or stdin
	76	+	// hits EOF. Returns whatever was collected, or "" on no usable
	77	+	// response.
	78	+	func readOSCResponse(deadline time.Time) string {
	79	+	var buf [128]byte
	80	+	n := 0
	81	+	for time.Now().Before(deadline) {
	82	+	remaining := time.Until(deadline)
	83	+	if remaining <= 0 {
	84	+	break
	85	+	}
	86	+	b, ok, err := peekStdin(os.Stdin, remaining)
	87	+	if err != nil \|\| !ok {
	88	+	return string(buf[:n])
	89	+	}
	90	+	if n < len(buf) {
	91	+	buf[n] = b
	92	+	n++
	93	+	}
	94	+	// BEL terminator
	95	+	if b == 0x07 {
	96	+	return string(buf[:n])
	97	+	}
	98	+	// ST terminator: ESC then '\\'. We saw it the moment the
	99	+	// previous byte was ESC and the current byte is '\\'.
	100	+	if n >= 2 && buf[n-2] == 0x1b && buf[n-1] == '\\' {
	101	+	return string(buf[:n])
	102	+	}
	103	+	}
	104	+	return string(buf[:n])
	105	+	}
	106	+
	107	+	// parseOSC11Reply extracts the (r, g, b) colour components from an
	108	+	// OSC 11 reply of the form "\x1b]11;rgb:RRRR/GGGG/BBBB\x07" (or with
	109	+	// ST terminator). The component widths can be 1, 2, 3, or 4 hex
	110	+	// digits per channel; we normalise them into the 0..1 range.
	111	+	func parseOSC11Reply(s string) (float64, float64, float64, bool) {
	112	+	// Locate "rgb:" within the response.
	113	+	i := strings.Index(s, "rgb:")
	114	+	if i < 0 {
	115	+	return 0, 0, 0, false
	116	+	}
	117	+	body := s[i+len("rgb:"):]
	118	+	// Trim trailing terminator(s).
	119	+	body = strings.TrimRight(body, "\x07")
	120	+	if strings.HasSuffix(body, "\x1b\\") {
	121	+	body = strings.TrimSuffix(body, "\x1b\\")
	122	+	}
	123	+	parts := strings.Split(body, "/")
	124	+	if len(parts) != 3 {
	125	+	return 0, 0, 0, false
	126	+	}
	127	+	parse := func(hexstr string) (float64, bool) {
	128	+	if len(hexstr) == 0 \|\| len(hexstr) > 4 {
	129	+	return 0, false
	130	+	}
	131	+	v, err := strconv.ParseUint(hexstr, 16, 32)
	132	+	if err != nil {
	133	+	return 0, false
	134	+	}
	135	+	// Normalise to 0..1: max value is (16^len - 1).
	136	+	max := uint64(1)
	137	+	for j := 0; j < len(hexstr); j++ {
	138	+	max *= 16
	139	+	}
	140	+	max--
	141	+	if max == 0 {
	142	+	return 0, false
	143	+	}
	144	+	return float64(v) / float64(max), true
	145	+	}
	146	+	r, ok1 := parse(parts[0])
	147	+	g, ok2 := parse(parts[1])
	148	+	b, ok3 := parse(parts[2])
	149	+	if !ok1 \|\| !ok2 \|\| !ok3 {
	150	+	return 0, 0, 0, false
	151	+	}
	152	+	return r, g, b, true
	153	+	}
	154	+
	155	+	// debugDetect is used only in development to help diagnose
	156	+	// detection issues; never invoked in production code paths.
	157	+	func debugDetect() {
	158	+	fmt.Fprintf(os.Stderr, "zot theme detection: stdin tty=%v stdout tty=%v\n",
	159	+	term.IsTerminal(int(os.Stdin.Fd())),
	160	+	term.IsTerminal(int(os.Stdout.Fd())))
	161	+	}

@@ -0,0 +1,161 @@
	1	+	package tui
	2	+
	3	+	import (
	4	+	"fmt"
	5	+	"os"
	6	+	"strconv"
	7	+	"strings"
	8	+	"time"
	9	+
	10	+	"golang.org/x/term"
	11	+	)
	12	+
	13	+	// DetectThemeFromBackground queries the controlling tty for its
	14	+	// current background colour using the OSC 11 escape sequence and
	15	+	// returns Dark or Light based on the response's perceived
	16	+	// luminance. Falls back to Dark when the terminal does not
	17	+	// reply within timeout, which is the expected behaviour for
	18	+	// terminals that do not implement OSC 11 (Linux console, VS Code's
	19	+	// integrated terminal in some configurations, tmux without
	20	+	// pass-through, very old emulators).
	21	+	//
	22	+	// The query / parse runs synchronously before the TUI is
	23	+	// initialised so the returned theme can drive the entire session.
	24	+	// We briefly put stdin into raw mode and disable echo so the OSC
	25	+	// reply doesn't leak onto the user's screen as visible bytes.
	26	+	func DetectThemeFromBackground(timeout time.Duration) Theme {
	27	+	// Honour explicit override env var first; some users / CI envs
	28	+	// know better than the heuristic.
	29	+	switch strings.ToLower(strings.TrimSpace(os.Getenv("ZOT_THEME"))) {
	30	+	case "dark":
	31	+	return Dark
	32	+	case "light":
	33	+	return Light
	34	+	}
	35	+
	36	+	if !term.IsTerminal(int(os.Stdin.Fd())) \|\| !term.IsTerminal(int(os.Stdout.Fd())) {
	37	+	return Dark
	38	+	}
	39	+
	40	+	fd := int(os.Stdin.Fd())
	41	+	st, err := term.MakeRaw(fd)
	42	+	if err != nil {
	43	+	return Dark
	44	+	}
	45	+	defer term.Restore(fd, st)
	46	+
	47	+	// Send the query. ST (\x1b\\) and BEL (\x07) are both accepted
	48	+	// terminators; some terminals only honour one of them, so we
	49	+	// send BEL which is more widely supported.
	50	+	if _, err := os.Stdout.Write([]byte("\x1b]11;?\x07")); err != nil {
	51	+	return Dark
	52	+	}
	53	+
	54	+	deadline := time.Now().Add(timeout)
	55	+	resp := readOSCResponse(deadline)
	56	+	if resp == "" {
	57	+	return Dark
	58	+	}
	59	+
	60	+	r, g, b, ok := parseOSC11Reply(resp)
	61	+	if !ok {
	62	+	return Dark
	63	+	}
	64	+
	65	+	// Rec. 709 luma. Threshold at 0.5: anything brighter than
	66	+	// mid-grey gets the light theme.
	67	+	luma := 0.2126float64(r) + 0.7152float64(g) + 0.0722*float64(b)
	68	+	if luma >= 0.5 {
	69	+	return Light
	70	+	}
	71	+	return Dark
	72	+	}
	73	+
	74	+	// readOSCResponse drains stdin into a small buffer until either a
	75	+	// terminator (BEL or ST) is seen, the deadline expires, or stdin
	76	+	// hits EOF. Returns whatever was collected, or "" on no usable
	77	+	// response.
	78	+	func readOSCResponse(deadline time.Time) string {
	79	+	var buf [128]byte
	80	+	n := 0
	81	+	for time.Now().Before(deadline) {
	82	+	remaining := time.Until(deadline)
	83	+	if remaining <= 0 {
	84	+	break
	85	+	}
	86	+	b, ok, err := peekStdin(os.Stdin, remaining)
	87	+	if err != nil \|\| !ok {
	88	+	return string(buf[:n])
	89	+	}
	90	+	if n < len(buf) {
	91	+	buf[n] = b
	92	+	n++
	93	+	}
	94	+	// BEL terminator
	95	+	if b == 0x07 {
	96	+	return string(buf[:n])
	97	+	}
	98	+	// ST terminator: ESC then '\\'. We saw it the moment the
	99	+	// previous byte was ESC and the current byte is '\\'.
	100	+	if n >= 2 && buf[n-2] == 0x1b && buf[n-1] == '\\' {
	101	+	return string(buf[:n])
	102	+	}
	103	+	}
	104	+	return string(buf[:n])
	105	+	}
	106	+
	107	+	// parseOSC11Reply extracts the (r, g, b) colour components from an
	108	+	// OSC 11 reply of the form "\x1b]11;rgb:RRRR/GGGG/BBBB\x07" (or with
	109	+	// ST terminator). The component widths can be 1, 2, 3, or 4 hex
	110	+	// digits per channel; we normalise them into the 0..1 range.
	111	+	func parseOSC11Reply(s string) (float64, float64, float64, bool) {
	112	+	// Locate "rgb:" within the response.
	113	+	i := strings.Index(s, "rgb:")
	114	+	if i < 0 {
	115	+	return 0, 0, 0, false
	116	+	}
	117	+	body := s[i+len("rgb:"):]
	118	+	// Trim trailing terminator(s).
	119	+	body = strings.TrimRight(body, "\x07")
	120	+	if strings.HasSuffix(body, "\x1b\\") {
	121	+	body = strings.TrimSuffix(body, "\x1b\\")
	122	+	}
	123	+	parts := strings.Split(body, "/")
	124	+	if len(parts) != 3 {
	125	+	return 0, 0, 0, false
	126	+	}
	127	+	parse := func(hexstr string) (float64, bool) {
	128	+	if len(hexstr) == 0 \|\| len(hexstr) > 4 {
	129	+	return 0, false
	130	+	}
	131	+	v, err := strconv.ParseUint(hexstr, 16, 32)
	132	+	if err != nil {
	133	+	return 0, false
	134	+	}
	135	+	// Normalise to 0..1: max value is (16^len - 1).
	136	+	max := uint64(1)
	137	+	for j := 0; j < len(hexstr); j++ {
	138	+	max *= 16
	139	+	}
	140	+	max--
	141	+	if max == 0 {
	142	+	return 0, false
	143	+	}
	144	+	return float64(v) / float64(max), true
	145	+	}
	146	+	r, ok1 := parse(parts[0])
	147	+	g, ok2 := parse(parts[1])
	148	+	b, ok3 := parse(parts[2])
	149	+	if !ok1 \|\| !ok2 \|\| !ok3 {
	150	+	return 0, 0, 0, false
	151	+	}
	152	+	return r, g, b, true
	153	+	}
	154	+
	155	+	// debugDetect is used only in development to help diagnose
	156	+	// detection issues; never invoked in production code paths.
	157	+	func debugDetect() {
	158	+	fmt.Fprintf(os.Stderr, "zot theme detection: stdin tty=%v stdout tty=%v\n",
	159	+	term.IsTerminal(int(os.Stdin.Fd())),
	160	+	term.IsTerminal(int(os.Stdout.Fd())))
	161	+	}

M internal/tui/markdown.go +7 -0


@@ -5,6 +5,13 @@ import (
5	5		"strings"
6	6		)
7	7
	8	+	// FlushLeftSentinel was used previously to opt fenced code blocks
	9	+	// out of the prose indent. The current rendering keeps fences
	10	+	// aligned with surrounding prose, so the sentinel is no longer
	11	+	// emitted; the constant is kept (and exported) so any older
	12	+	// caller that still strips it remains a harmless no-op.
	13	+	const FlushLeftSentinel = '\x1c'
	14	+
8	15		// RenderMarkdown renders a small subset of Markdown to styled terminal
9	16		// text using theme colors. Supported: headings, bold, italic, inline
10	17		// code, fenced code blocks, bullet lists, numbered lists, blockquotes.


@@ -5,6 +5,13 @@ import (
5	"strings"	5		"strings"
6	)	6		)
7		7
		8	+	// FlushLeftSentinel was used previously to opt fenced code blocks
		9	+	// out of the prose indent. The current rendering keeps fences
		10	+	// aligned with surrounding prose, so the sentinel is no longer
		11	+	// emitted; the constant is kept (and exported) so any older
		12	+	// caller that still strips it remains a harmless no-op.
		13	+	const FlushLeftSentinel = '\x1c'
		14	+
8	// RenderMarkdown renders a small subset of Markdown to styled terminal	15		// RenderMarkdown renders a small subset of Markdown to styled terminal
9	// text using theme colors. Supported: headings, bold, italic, inline	16		// text using theme colors. Supported: headings, bold, italic, inline
10	// code, fenced code blocks, bullet lists, numbered lists, blockquotes.	17		// code, fenced code blocks, bullet lists, numbered lists, blockquotes.

M internal/tui/theme.go +72 -36


@@ -8,48 +8,54 @@ import "strings"
8	8		// ANSI 256-color palette used by zot. Defined as numeric codes so we
9	9		// can swap themes without changing any render code.
10	10		type Theme struct {
11		-	FG int
12		-	Muted int
13		-	Accent int
14		-	User int // label color for the user role
15		-	Assistant int // label color for the zot role
16		-	Tool int
17		-	ToolOut int
18		-	Error int
19		-	Warning int
20		-	Spinner int // spinner + funny working line
21		-	SelectionBG int // background for highlighted rows
22		-	SelectionFG int // foreground for highlighted rows
	11	+	FG int
	12	+	Muted int
	13	+	Accent int
	14	+	User int // label color for the user role
	15	+	UserBubbleBG int // background tint behind user message rows
	16	+	UserBubbleFG int // foreground colour for user message rows
	17	+	Assistant int // label color for the zot role
	18	+	Tool int
	19	+	ToolOut int
	20	+	Error int
	21	+	Warning int
	22	+	Spinner int // spinner + funny working line
	23	+	SelectionBG int // background for highlighted rows
	24	+	SelectionFG int // foreground for highlighted rows
23	25		}
24	26
25	27		var Dark = Theme{
26		-	FG: 253,
27		-	Muted: 244,
28		-	Accent: 111, // soft blue
29		-	User: 180, // warm tan
30		-	Assistant: 117, // bright cyan — the zot label color
31		-	Tool: 114, // green
32		-	ToolOut: 245,
33		-	Error: 203,
34		-	Warning: 214,
35		-	Spinner: 183, // soft purple
36		-	SelectionBG: 24, // deep blue background
37		-	SelectionFG: 231, // near-white foreground
	28	+	FG: 253,
	29	+	Muted: 244,
	30	+	Accent: 111, // soft blue
	31	+	User: 180, // warm tan (unused now that the speaker label is gone, kept for skin compat)
	32	+	UserBubbleBG: 237, // soft mid-dark grey panel behind user rows
	33	+	UserBubbleFG: 246, // matches Theme.Muted (status bar text colour)
	34	+	Assistant: 117, // bright cyan — the zot label color
	35	+	Tool: 114, // green
	36	+	ToolOut: 245,
	37	+	Error: 203,
	38	+	Warning: 214,
	39	+	Spinner: 183, // soft purple
	40	+	SelectionBG: 24, // deep blue background
	41	+	SelectionFG: 231, // near-white foreground
38	42		}
39	43
40	44		var Light = Theme{
41		-	FG: 236,
42		-	Muted: 244,
43		-	Accent: 33,
44		-	User: 94,
45		-	Assistant: 31, // deep cyan
46		-	Tool: 28,
47		-	ToolOut: 240,
48		-	Error: 160,
49		-	Warning: 166,
50		-	Spinner: 91, // purple
51		-	SelectionBG: 153, // light blue
52		-	SelectionFG: 232, // near-black
	45	+	FG: 236,
	46	+	Muted: 244,
	47	+	Accent: 33,
	48	+	User: 94,
	49	+	UserBubbleBG: 254, // very pale grey panel behind user rows on light theme
	50	+	UserBubbleFG: 240, // dark grey text, legible on the pale panel
	51	+	Assistant: 31, // deep cyan
	52	+	Tool: 28,
	53	+	ToolOut: 240,
	54	+	Error: 160,
	55	+	Warning: 166,
	56	+	Spinner: 91, // purple
	57	+	SelectionBG: 153, // light blue
	58	+	SelectionFG: 232, // near-black
53	59		}
54	60
55	61		// FG256 wraps s in foreground color c using ANSI 256-color SGR.

@@ -91,6 +97,36 @@ func (t Theme) PadHighlight(s string, width int) string {
91	97		return sgrFG(t.SelectionFG) + sgrBG(t.SelectionBG) + s + reset
92	98		}
93	99
	100	+	// UserBubble paints a single user message row with the bubble
	101	+	// background colour, padding to width so the tint extends to the
	102	+	// full terminal width. Foreground stays in UserBubbleFG so text
	103	+	// remains legible against the tint.
	104	+	func (t Theme) UserBubble(s string, width int) string {
	105	+	visible := visibleWidth(s)
	106	+	if visible < width {
	107	+	s += strings.Repeat(" ", width-visible)
	108	+	}
	109	+	return sgrFG(t.UserBubbleFG) + sgrBG(t.UserBubbleBG) + s + reset
	110	+	}
	111	+
	112	+	// UserBubbleRow renders one user-bubble row prefixed with a coloured
	113	+	// half-block accent bar ("▌ ") so every line of the bubble has the
	114	+	// zot-blue gutter at the very left. The bar lives outside the bubble
	115	+	// tint (chat bg) so the bubble itself sits inside it. Width is the
	116	+	// outer width including the bar; the bubble content is padded to
	117	+	// width-2 (the bar + its trailing space).
	118	+	func (t Theme) UserBubbleRow(content string, width int) string {
	119	+	// Bar plus a single space gutter, in the assistant accent colour
	120	+	// so it matches the tool-box / app accent and reads as zot's voice
	121	+	// marker. Two cells wide.
	122	+	bar := t.FG256(t.Assistant, "▌ ")
	123	+	bubbleW := width - 2
	124	+	if bubbleW < 1 {
	125	+	bubbleW = 1
	126	+	}
	127	+	return bar + t.UserBubble(content, bubbleW)
	128	+	}
	129	+
94	130		// Bold wraps s in bold SGR.
95	131		func Bold(s string) string { return "\x1b[1m" + s + "\x1b[22m" }
96	132


@@ -8,48 +8,54 @@ import "strings"
8		// ANSI 256-color palette used by zot. Defined as numeric codes so we	8		// ANSI 256-color palette used by zot. Defined as numeric codes so we
9		// can swap themes without changing any render code.	9		// can swap themes without changing any render code.
10		type Theme struct {	10		type Theme struct {
11	-	FG int	11	+	FG int
12	-	Muted int	12	+	Muted int
13	-	Accent int	13	+	Accent int
14	-	User int // label color for the user role	14	+	User int // label color for the user role
15	-	Assistant int // label color for the zot role	15	+	UserBubbleBG int // background tint behind user message rows
16	-	Tool int	16	+	UserBubbleFG int // foreground colour for user message rows
17	-	ToolOut int	17	+	Assistant int // label color for the zot role
18	-	Error int	18	+	Tool int
19	-	Warning int	19	+	ToolOut int
20	-	Spinner int // spinner + funny working line	20	+	Error int
21	-	SelectionBG int // background for highlighted rows	21	+	Warning int
22	-	SelectionFG int // foreground for highlighted rows	22	+	Spinner int // spinner + funny working line
			23	+	SelectionBG int // background for highlighted rows
			24	+	SelectionFG int // foreground for highlighted rows
23		}	25		}
24			26
25		var Dark = Theme{	27		var Dark = Theme{
26	-	FG: 253,	28	+	FG: 253,
27	-	Muted: 244,	29	+	Muted: 244,
28	-	Accent: 111, // soft blue	30	+	Accent: 111, // soft blue
29	-	User: 180, // warm tan	31	+	User: 180, // warm tan (unused now that the speaker label is gone, kept for skin compat)
30	-	Assistant: 117, // bright cyan — the zot label color	32	+	UserBubbleBG: 237, // soft mid-dark grey panel behind user rows
31	-	Tool: 114, // green	33	+	UserBubbleFG: 246, // matches Theme.Muted (status bar text colour)
32	-	ToolOut: 245,	34	+	Assistant: 117, // bright cyan — the zot label color
33	-	Error: 203,	35	+	Tool: 114, // green
34	-	Warning: 214,	36	+	ToolOut: 245,
35	-	Spinner: 183, // soft purple	37	+	Error: 203,
36	-	SelectionBG: 24, // deep blue background	38	+	Warning: 214,
37	-	SelectionFG: 231, // near-white foreground	39	+	Spinner: 183, // soft purple
			40	+	SelectionBG: 24, // deep blue background
			41	+	SelectionFG: 231, // near-white foreground
38		}	42		}
39			43
40		var Light = Theme{	44		var Light = Theme{
41	-	FG: 236,	45	+	FG: 236,
42	-	Muted: 244,	46	+	Muted: 244,
43	-	Accent: 33,	47	+	Accent: 33,
44	-	User: 94,	48	+	User: 94,
45	-	Assistant: 31, // deep cyan	49	+	UserBubbleBG: 254, // very pale grey panel behind user rows on light theme
46	-	Tool: 28,	50	+	UserBubbleFG: 240, // dark grey text, legible on the pale panel
47	-	ToolOut: 240,	51	+	Assistant: 31, // deep cyan
48	-	Error: 160,	52	+	Tool: 28,
49	-	Warning: 166,	53	+	ToolOut: 240,
50	-	Spinner: 91, // purple	54	+	Error: 160,
51	-	SelectionBG: 153, // light blue	55	+	Warning: 166,
52	-	SelectionFG: 232, // near-black	56	+	Spinner: 91, // purple
			57	+	SelectionBG: 153, // light blue
			58	+	SelectionFG: 232, // near-black
53		}	59		}
54			60
55		// FG256 wraps s in foreground color c using ANSI 256-color SGR.	61		// FG256 wraps s in foreground color c using ANSI 256-color SGR.

@@ -91,6 +97,36 @@ func (t Theme) PadHighlight(s string, width int) string {
91		return sgrFG(t.SelectionFG) + sgrBG(t.SelectionBG) + s + reset	97		return sgrFG(t.SelectionFG) + sgrBG(t.SelectionBG) + s + reset
92		}	98		}
93			99
			100	+	// UserBubble paints a single user message row with the bubble
			101	+	// background colour, padding to width so the tint extends to the
			102	+	// full terminal width. Foreground stays in UserBubbleFG so text
			103	+	// remains legible against the tint.
			104	+	func (t Theme) UserBubble(s string, width int) string {
			105	+	visible := visibleWidth(s)
			106	+	if visible < width {
			107	+	s += strings.Repeat(" ", width-visible)
			108	+	}
			109	+	return sgrFG(t.UserBubbleFG) + sgrBG(t.UserBubbleBG) + s + reset
			110	+	}
			111	+
			112	+	// UserBubbleRow renders one user-bubble row prefixed with a coloured
			113	+	// half-block accent bar ("▌ ") so every line of the bubble has the
			114	+	// zot-blue gutter at the very left. The bar lives outside the bubble
			115	+	// tint (chat bg) so the bubble itself sits inside it. Width is the
			116	+	// outer width including the bar; the bubble content is padded to
			117	+	// width-2 (the bar + its trailing space).
			118	+	func (t Theme) UserBubbleRow(content string, width int) string {
			119	+	// Bar plus a single space gutter, in the assistant accent colour
			120	+	// so it matches the tool-box / app accent and reads as zot's voice
			121	+	// marker. Two cells wide.
			122	+	bar := t.FG256(t.Assistant, "▌ ")
			123	+	bubbleW := width - 2
			124	+	if bubbleW < 1 {
			125	+	bubbleW = 1
			126	+	}
			127	+	return bar + t.UserBubble(content, bubbleW)
			128	+	}
			129	+
94		// Bold wraps s in bold SGR.	130		// Bold wraps s in bold SGR.
95		func Bold(s string) string { return "\x1b[1m" + s + "\x1b[22m" }	131		func Bold(s string) string { return "\x1b[1m" + s + "\x1b[22m" }
96			132

M internal/tui/view.go +116 -72


@@ -250,34 +250,16 @@ func (v *View) BuildWithAnchors(width int) ([]string, []MessageAnchor) {
250	250		// overlay below is the real content and a naked "zot" bar
251	251		// above it reads as a stray empty message.
252	252		if v.StreamingActive && strings.TrimSpace(v.Streaming) != "" {
253		-	// Suppress the streaming "▍ zot" header if the turn is
254		-	// already open (a previous assistant/tool message in this
255		-	// turn already rendered one). Otherwise the streaming text
256		-	// would jump from headerless to under a new header once it
257		-	// finalises into a transcript message.
258		-	turnOpen := false
259		-	for j := len(v.Messages) - 1; j >= 0; j-- {
260		-	prev := v.Messages[j]
261		-	if prev.Meta["compaction"] == "true" {
262		-	continue
263		-	}
264		-	if prev.Role == provider.RoleAssistant \|\| prev.Role == provider.RoleTool {
265		-	turnOpen = true
266		-	}
267		-	break
268		-	}
269		-	if !turnOpen {
270		-	out = append(out, v.Theme.AccentBar(v.Theme.Assistant)+v.Theme.FG256(v.Theme.Assistant, "zot"))
271		-	}
272	253		// Stream the partial assistant text through the same markdown
273	254		// renderer used for finalised messages so code fences, diffs,
274	255		// lists, and inline styles look the same while streaming and
275		-	// don't suddenly reflow when the turn ends. Indent matches the
276		-	// finalised assistant body in renderMessage so the column
277		-	// stays consistent across the stream/finalise transition.
278		-	// Width is capped so ultra-wide terminals don't produce
279		-	// edge-to-edge rules / unreadably long prose lines.
280		-	const indent = " "
	256	+	// don't suddenly reflow when the turn ends. No speaker header
	257	+	// is drawn; the indent matches the finalised assistant body in
	258	+	// renderMessage so the column stays consistent across the
	259	+	// stream/finalise transition. Width is capped so ultra-wide
	260	+	// terminals don't produce edge-to-edge code-fence rules or
	261	+	// unreadably long prose lines.
	262	+	const indent = " "
281	263		inner := assistantBodyWidth(width - len(indent))
282	264		md := RenderMarkdown(v.Streaming, v.Theme, inner)
283	265		for _, l := range strings.Split(md, "\n") {

@@ -438,10 +420,8 @@ const (
438	420		)
439	421
440	422		// assistantBodyRightPad is the blank gutter kept on the right
441		-	// side of every assistant prose line so text doesn't kiss the
442		-	// terminal edge. Matches the 4-cell left indent, so a line of
443		-	// fully-wrapped prose sits in a symmetric column.
444		-	const assistantBodyRightPad = 4
	423	+	// side of every assistant prose line.
	424	+	const assistantBodyRightPad = 2
445	425
446	426		// assistantBodyWidth returns the usable width for the assistant
447	427		// message body (markdown prose + code fences). Uses the full

@@ -486,34 +466,56 @@ func (v *View) renderMessage(m provider.Message, width int, turnOpen bool) []str
486	466
487	467		switch m.Role {
488	468		case provider.RoleUser:
489		-	header := v.Theme.AccentBar(v.Theme.User) + v.Theme.FG256(v.Theme.User, "you")
490		-	lines = append(lines, header)
	469	+	// User rows: no speaker label. Each line is painted with a
	470	+	// faint bubble background tint (UserBubble) so the user's
	471	+	// turns visually segment the chat without needing a header.
	472	+	// One tinted blank row above and below approximates CSS
	473	+	// padding-top / padding-bottom (terminals can't do fractional
	474	+	// rows, so a full row of bubble-coloured whitespace is the
	475	+	// closest analogue and gives the bubble visible breathing
	476	+	// room).
	477	+	// User rows: a 1-cell "▌" accent bar at column 0 painted on
	478	+	// the bubble bg, so the bar's cell shares the panel tint and
	479	+	// there is no visible gap between bar and panel. (Some terminals
	480	+	// — iTerm2, Apple Terminal — may smear the cell-0 bg into the
	481	+	// window inset to the left; that's a terminal-side rendering
	482	+	// quirk we accept in exchange for a clean bar-to-panel join.)
	483	+	const leftGutter = 0 // cells of bubble bg between bar and text
	484	+	const rightGutter = 2 // cells of bubble bg between text and right edge
	485	+	innerWidth := width - 2 - leftGutter - rightGutter // 2 = bar's two cells (▌ + trailing space)
	486	+	if innerWidth < 1 {
	487	+	innerWidth = 1
	488	+	}
	489	+	row := func(content string) string {
	490	+	inner := strings.Repeat(" ", leftGutter) + content
	491	+	padded := v.Theme.UserBubble(inner, width-2)
	492	+	bar := v.Theme.BG256(v.Theme.UserBubbleBG, v.Theme.FG256(v.Theme.Accent, "▌ "))
	493	+	return bar + padded
	494	+	}
	495	+	var bubble []string
491	496		for _, c := range m.Content {
492	497		switch b := c.(type) {
493	498		case provider.TextBlock:
494	499		for _, l := range strings.Split(b.Text, "\n") {
495		-	for _, w := range wrapLine(l, width-4, "") {
496		-	lines = append(lines, " "+v.Theme.FG256(v.Theme.Muted, w))
	500	+	for _, w := range wrapLine(l, innerWidth, "") {
	501	+	bubble = append(bubble, row(w))
497	502		}
498	503		}
499	504		case provider.ImageBlock:
500		-	lines = append(lines, " "+v.Theme.FG256(v.Theme.Muted, fmt.Sprintf("[image %s, %d bytes]", b.MimeType, len(b.Data))))
	505	+	bubble = append(bubble, row(fmt.Sprintf("[image %s, %d bytes]", b.MimeType, len(b.Data))))
501	506		}
502	507		}
	508	+	if len(bubble) > 0 {
	509	+	lines = append(lines, row(""))
	510	+	lines = append(lines, bubble...)
	511	+	lines = append(lines, row(""))
	512	+	}
503	513		case provider.RoleAssistant:
504		-	// Only draw the agent header at the start of a turn. Mid-turn
505		-	// assistant messages (e.g. another tool_use round-trip after a
506		-	// tool result) reuse the header that's already on screen.
507		-	if !turnOpen {
508		-	lines = append(lines, v.Theme.AccentBar(v.Theme.Assistant)+v.Theme.FG256(v.Theme.Assistant, "zot"))
509		-	}
510		-	// Indent assistant body the same 4 cells the user body uses,
511		-	// so the conversation column lines up vertically. The width
512		-	// passed into the markdown renderer / wrap is reduced by the
513		-	// indent so long lines wrap inside the indented column, and
514		-	// capped so ultra-wide terminals don't produce edge-to-edge
515		-	// code-fence rules or unreadably long prose lines.
516		-	const indent = " "
	514	+	// Assistant rows: no speaker label either. Prose still gets a
	515	+	// small left indent so it visually aligns with tool box body
	516	+	// content, but no "zot" header.
	517	+	_ = turnOpen
	518	+	const indent = " "
517	519		inner := assistantBodyWidth(width - len(indent))
518	520		for _, c := range m.Content {
519	521		switch b := c.(type) {

@@ -565,17 +567,18 @@ func (v *View) renderMessage(m provider.Message, width int, turnOpen bool) []str
565	567		if tr.IsError {
566	568		lines = append(lines, toolBoxSide(v.Theme, v.Theme.FG256(color, " error"), width))
567	569		}
568		-	for _, body := range v.renderToolResultContent(tr.Content, width, color, path, startLine) {
569		-	// Image escapes paint into a graphics layer that
570		-	// doesn't share the text grid; wrapping such a row
571		-	// in │ … │ produces visible artefacts on iTerm /
572		-	// Kitty, so leave image rows un-bordered. The
573		-	// surrounding lines still close the box top + bottom.
574		-	if hasImageEscapeLine(body) {
575		-	lines = append(lines, body)
576		-	continue
	570	+	for _, line := range v.renderToolResultContent(tr.Content, width, color, path, startLine) {
	571	+	// Image-footprint rows (the escape row, the blank
	572	+	// reservation rows beneath it, and the gap row
	573	+	// before the metadata caption) are tagged with the
	574	+	// imageFootprintSentinel by renderImageBlock. Strip
	575	+	// the tag, then wrap the row in the usual │ … │ box
	576	+	// edges so the box frame stays continuous around
	577	+	// the image.
	578	+	if strings.HasPrefix(line, imageFootprintSentinel) {
	579	+	line = line[len(imageFootprintSentinel):]
577	580		}
578		-	lines = append(lines, toolBoxSide(v.Theme, body, width))
	581	+	lines = append(lines, toolBoxSide(v.Theme, line, width))
579	582		}
580	583		lines = append(lines, toolBoxSide(v.Theme, "", width))
581	584		lines = append(lines, toolBoxBottom(v.Theme, width))

@@ -643,9 +646,8 @@ func (v *View) renderToolCall(tc ToolCallView, width int) []string {
643	646		}
644	647		body := toolResultBlock(v.Theme, tc.Result, width, color)
645	648		for _, l := range v.collapseToolBody(body, false) {
646		-	if hasImageEscapeLine(l) {
647		-	lines = append(lines, l)
648		-	continue
	649	+	if strings.HasPrefix(l, imageFootprintSentinel) {
	650	+	l = l[len(imageFootprintSentinel):]
649	651		}
650	652		lines = append(lines, toolBoxSide(v.Theme, l, width))
651	653		}

@@ -696,9 +698,8 @@ func (v *View) wrapLiveBody(body []string, width int) []string {
696	698		body = v.collapseToolBody(body, false)
697	699		out := make([]string, 0, len(body))
698	700		for _, l := range body {
699		-	if hasImageEscapeLine(l) {
700		-	out = append(out, l)
701		-	continue
	701	+	if strings.HasPrefix(l, imageFootprintSentinel) {
	702	+	l = l[len(imageFootprintSentinel):]
702	703		}
703	704		out = append(out, toolBoxSide(v.Theme, l, width))
704	705		}

@@ -725,6 +726,13 @@ func toolBlockRule(th Theme, width int) string {
725	726		// the corner, and gives body lines a tiny gutter from the left side.
726	727		const toolBoxInnerPad = 1
727	728
	729	+	// toolBoxOuterMargin is the number of blank cells kept to the left of
	730	+	// the opening corner and to the right of the closing corner. Aligns
	731	+	// the box's frame with the column where user-bubble text begins, so
	732	+	// the conversation reads as one column instead of having tool boxes
	733	+	// running edge-to-edge while user/assistant rows sit indented.
	734	+	const toolBoxOuterMargin = 2
	735	+
728	736		// toolBoxTop renders the labelled top edge of a tool block:
729	737		//
730	738		// ┌─ bash xcrun simctl list devices ─────────────────────────────┐

@@ -734,10 +742,11 @@ const toolBoxInnerPad = 1
734	742		// of the line so the right corner sits at column width-1, matching the
735	743		// closing edge.
736	744		func toolBoxTop(th Theme, label string, width int) string {
737		-	w := width
	745	+	w := width - 2*toolBoxOuterMargin
738	746		if w < 12 {
739	747		w = 12
740	748		}
	749	+	margin := strings.Repeat(" ", toolBoxOuterMargin)
741	750		innerPad := strings.Repeat(" ", toolBoxInnerPad)
742	751		// "┌─" + innerPad + " " + label + " " + innerPad = used; pad
743	752		// with ─ to width-1, then "┐".

@@ -763,7 +772,7 @@ func toolBoxTop(th Theme, label string, width int) string {
763	772		}
764	773		}
765	774		line := prefix + label + suffix + strings.Repeat("─", fill) + "┐"
766		-	return th.FG256(th.Muted, line)
	775	+	return margin + th.FG256(th.Muted, line) + margin
767	776		}
768	777
769	778		// toolBoxBottom renders the bottom edge of a tool block:

@@ -772,12 +781,13 @@ func toolBoxTop(th Theme, label string, width int) string {
772	781		//
773	782		// Spans the same width as toolBoxTop so the corners line up.
774	783		func toolBoxBottom(th Theme, width int) string {
775		-	w := width
	784	+	w := width - 2*toolBoxOuterMargin
776	785		if w < 12 {
777	786		w = 12
778	787		}
	788	+	margin := strings.Repeat(" ", toolBoxOuterMargin)
779	789		line := "└" + strings.Repeat("─", w-2) + "┘"
780		-	return th.FG256(th.Muted, line)
	790	+	return margin + th.FG256(th.Muted, line) + margin
781	791		}
782	792
783	793		// hasImageEscapeLine reports whether s contains a Kitty (\x1b_G) or

@@ -788,6 +798,16 @@ func hasImageEscapeLine(s string) bool {
788	798		return strings.Contains(s, "\x1b]1337;File=") \|\| strings.Contains(s, "\x1b_G")
789	799		}
790	800
	801	+	// imageFootprintSentinel marks rows that belong to an inline-image's
	802	+	// reserved footprint — the escape row plus the blank rows below it
	803	+	// plus the gap row before the metadata caption. Any consumer that
	804	+	// wraps content in box edges (│ … │) detects the sentinel, strips
	805	+	// it, and emits the row un-bordered so the box's vertical edges
	806	+	// don't show through next to the image's graphics rectangle. Uses a
	807	+	// non-printing C0 control byte so it can never appear in normal
	808	+	// text or in an ANSI escape sequence body.
	809	+	const imageFootprintSentinel = "\x1e"
	810	+
791	811		// toolBoxBodyTrimLeft is the number of leading literal spaces stripped
792	812		// from each body line as it enters toolBoxSide. Body renderers
793	813		// (renderToolText, renderRawFile, the diff/bash helpers, ...) all

@@ -807,14 +827,26 @@ const toolBoxBodyTrimLeft = 2
807	827		// of inner padding sits on each side so the content breathes from the
808	828		// edges; the right padding fills to column width-1.
809	829		func toolBoxSide(th Theme, line string, width int) string {
810		-	w := width
	830	+	w := width - 2*toolBoxOuterMargin
811	831		if w < 12 {
812	832		w = 12
813	833		}
	834	+	margin := strings.Repeat(" ", toolBoxOuterMargin)
814	835		left := th.FG256(th.Muted, "│") + strings.Repeat(" ", toolBoxInnerPad)
815	836		right := strings.Repeat(" ", toolBoxInnerPad) + th.FG256(th.Muted, "│")
816	837		inner := w - 2 - 2*toolBoxInnerPad // available between the two pads
817	838		line = trimLeadingSpaces(line, toolBoxBodyTrimLeft)
	839	+
	840	+	// Inline-image escapes (iTerm OSC 1337, Kitty APC G) carry
	841	+	// thousands of bytes of base64 payload that visibleWidth and
	842	+	// stripANSI don't recognise as ANSI. Measuring or truncating
	843	+	// such a row destroys the escape and the image disappears.
	844	+	// Pass the row through with edges + a fixed inner padding
	845	+	// based on the visible prefix only.
	846	+	if hasImageEscapeLine(line) {
	847	+	return margin + left + line + right + margin
	848	+	}
	849	+
818	850		cur := visibleWidth(line)
819	851		if cur > inner {
820	852		// Last-resort truncation. Strips ANSI styling at the cut

@@ -830,7 +862,7 @@ func toolBoxSide(th Theme, line string, width int) string {
830	862		if pad < 0 {
831	863		pad = 0
832	864		}
833		-	return left + line + strings.Repeat(" ", pad) + right
	865	+	return margin + left + line + strings.Repeat(" ", pad) + right + margin
834	866		}
835	867
836	868		// trimLeadingSpaces removes up to n literal space characters from the

@@ -1154,12 +1186,21 @@ func (v *View) renderImageBlock(b provider.ImageBlock, width int) []string {
1154	1186		// below the reserved rectangle is more stable and easier to
1155	1187		// read. One extra blank row before the metadata gives the
1156	1188		// caption breathing room from the image's last pixel row.
	1189	+	//
	1190	+	// Every footprint row (escape, reservations, gap) is tagged
	1191	+	// with imageFootprintSentinel so callers wrapping content in
	1192	+	// box edges can recognise these rows and emit them bare —
	1193	+	// the image's graphics rectangle paints over them and any
	1194	+	// │ character drawn alongside would visibly bleed through.
	1195	+	// 4 leading cells push the escape past the box's left
	1196	+	// edge plus a small interior gutter so the image rectangle
	1197	+	// sits visibly inside the frame instead of kissing the │.
1157	1198		out := make([]string, 0, rows+3)
1158		-	out = append(out, " "+seq)
	1199	+	out = append(out, imageFootprintSentinel+" "+seq)
1159	1200		for i := 1; i < rows; i++ {
1160		-	out = append(out, "")
	1201	+	out = append(out, imageFootprintSentinel)
1161	1202		}
1162		-	out = append(out, "")
	1203	+	out = append(out, imageFootprintSentinel)
1163	1204		out = append(out, v.Theme.FG256(v.Theme.Muted, info))
1164	1205		return out
1165	1206		}

@@ -1589,6 +1630,9 @@ func (v *View) renderCompactionBlock(m provider.Message, width int) []string {
1589	1630		}
1590	1631		md := RenderMarkdown(text, th, width-4)
1591	1632		for _, l := range strings.Split(md, "\n") {
	1633	+	if len(l) > 0 && l[0] == FlushLeftSentinel {
	1634	+	l = l[1:]
	1635	+	}
1592	1636		lines = append(lines, indent+l)
1593	1637		}
1594	1638		}

 	// overlay below is the real content and a naked "zot" bar
 	// above it reads as a stray empty message.
 	if v.StreamingActive && strings.TrimSpace(v.Streaming) != "" {
-		// Suppress the streaming "▍ zot" header if the turn is
-		// already open (a previous assistant/tool message in this
-		// turn already rendered one). Otherwise the streaming text
-		// would jump from headerless to under a new header once it
-		// finalises into a transcript message.
-		turnOpen := false
-		for j := len(v.Messages) - 1; j >= 0; j-- {
-			prev := v.Messages[j]
-			if prev.Meta["compaction"] == "true" {
-				continue
-			}
-			if prev.Role == provider.RoleAssistant || prev.Role == provider.RoleTool {
-				turnOpen = true
-			}
-			break
-		}
-		if !turnOpen {
-			out = append(out, v.Theme.AccentBar(v.Theme.Assistant)+v.Theme.FG256(v.Theme.Assistant, "zot"))
-		}
 		// Stream the partial assistant text through the same markdown
 		// renderer used for finalised messages so code fences, diffs,
 		// lists, and inline styles look the same while streaming and
-		// don't suddenly reflow when the turn ends. Indent matches the
+		// don't suddenly reflow when the turn ends. No speaker header
-		// finalised assistant body in renderMessage so the column
+		// is drawn; the indent matches the finalised assistant body in
-		// stays consistent across the stream/finalise transition.
+		// renderMessage so the column stays consistent across the
-		// Width is capped so ultra-wide terminals don't produce
+		// stream/finalise transition. Width is capped so ultra-wide
-		// edge-to-edge rules / unreadably long prose lines.
+		// terminals don't produce edge-to-edge code-fence rules or
-		const indent = "    "
+		// unreadably long prose lines.
+		const indent = "  "
 		inner := assistantBodyWidth(width - len(indent))
 		md := RenderMarkdown(v.Streaming, v.Theme, inner)
 		for _, l := range strings.Split(md, "\n") {
 )
 // assistantBodyRightPad is the blank gutter kept on the right
-// side of every assistant prose line so text doesn't kiss the
+// side of every assistant prose line.
-// terminal edge. Matches the 4-cell left indent, so a line of
+const assistantBodyRightPad = 2
-// fully-wrapped prose sits in a symmetric column.
-const assistantBodyRightPad = 4
 // assistantBodyWidth returns the usable width for the assistant
 // message body (markdown prose + code fences). Uses the full
 	switch m.Role {
 	case provider.RoleUser:
-		header := v.Theme.AccentBar(v.Theme.User) + v.Theme.FG256(v.Theme.User, "you")
+		// User rows: no speaker label. Each line is painted with a
-		lines = append(lines, header)
+		// faint bubble background tint (UserBubble) so the user's
+		// turns visually segment the chat without needing a header.
+		// One tinted blank row above and below approximates CSS
+		// padding-top / padding-bottom (terminals can't do fractional
+		// rows, so a full row of bubble-coloured whitespace is the
+		// closest analogue and gives the bubble visible breathing
+		// room).
+		// User rows: a 1-cell "▌" accent bar at column 0 painted on
+		// the bubble bg, so the bar's cell shares the panel tint and
+		// there is no visible gap between bar and panel. (Some terminals
+		// — iTerm2, Apple Terminal — may smear the cell-0 bg into the
+		// window inset to the left; that's a terminal-side rendering
+		// quirk we accept in exchange for a clean bar-to-panel join.)
+		const leftGutter = 0                               // cells of bubble bg between bar and text
+		const rightGutter = 2                              // cells of bubble bg between text and right edge
+		innerWidth := width - 2 - leftGutter - rightGutter // 2 = bar's two cells (▌ + trailing space)
+		if innerWidth < 1 {
+			innerWidth = 1
+		}
+		row := func(content string) string {
+			inner := strings.Repeat(" ", leftGutter) + content
+			padded := v.Theme.UserBubble(inner, width-2)
+			bar := v.Theme.BG256(v.Theme.UserBubbleBG, v.Theme.FG256(v.Theme.Accent, "▌ "))
+			return bar + padded
+		}
+		var bubble []string
 		for _, c := range m.Content {
 			switch b := c.(type) {
 			case provider.TextBlock:
 				for _, l := range strings.Split(b.Text, "\n") {
-					for _, w := range wrapLine(l, width-4, "") {
+					for _, w := range wrapLine(l, innerWidth, "") {
-						lines = append(lines, "    "+v.Theme.FG256(v.Theme.Muted, w))
+						bubble = append(bubble, row(w))
 					}
 				}
 			case provider.ImageBlock:
-				lines = append(lines, "    "+v.Theme.FG256(v.Theme.Muted, fmt.Sprintf("[image %s, %d bytes]", b.MimeType, len(b.Data))))
+				bubble = append(bubble, row(fmt.Sprintf("[image %s, %d bytes]", b.MimeType, len(b.Data))))
 			}
 		}
+		if len(bubble) > 0 {
+			lines = append(lines, row(""))
+			lines = append(lines, bubble...)
+			lines = append(lines, row(""))
+		}
 	case provider.RoleAssistant:
-		// Only draw the agent header at the start of a turn. Mid-turn
+		// Assistant rows: no speaker label either. Prose still gets a
-		// assistant messages (e.g. another tool_use round-trip after a
+		// small left indent so it visually aligns with tool box body
-		// tool result) reuse the header that's already on screen.
+		// content, but no "zot" header.
-		if !turnOpen {
+		_ = turnOpen
-			lines = append(lines, v.Theme.AccentBar(v.Theme.Assistant)+v.Theme.FG256(v.Theme.Assistant, "zot"))
+		const indent = "  "
-		}
-		// Indent assistant body the same 4 cells the user body uses,
-		// so the conversation column lines up vertically. The width
-		// passed into the markdown renderer / wrap is reduced by the
-		// indent so long lines wrap inside the indented column, and
-		// capped so ultra-wide terminals don't produce edge-to-edge
-		// code-fence rules or unreadably long prose lines.
-		const indent = "    "
 		inner := assistantBodyWidth(width - len(indent))
 		for _, c := range m.Content {
 			switch b := c.(type) {
 				if tr.IsError {
 					lines = append(lines, toolBoxSide(v.Theme, v.Theme.FG256(color, "  error"), width))
 				}
-				for _, body := range v.renderToolResultContent(tr.Content, width, color, path, startLine) {
+				for _, line := range v.renderToolResultContent(tr.Content, width, color, path, startLine) {
-					// Image escapes paint into a graphics layer that
+					// Image-footprint rows (the escape row, the blank
-					// doesn't share the text grid; wrapping such a row
+					// reservation rows beneath it, and the gap row
-					// in │ … │ produces visible artefacts on iTerm /
+					// before the metadata caption) are tagged with the
-					// Kitty, so leave image rows un-bordered. The
+					// imageFootprintSentinel by renderImageBlock. Strip
-					// surrounding lines still close the box top + bottom.
+					// the tag, then wrap the row in the usual │ … │ box
-					if hasImageEscapeLine(body) {
+					// edges so the box frame stays continuous around
-						lines = append(lines, body)
+					// the image.
-						continue
+					if strings.HasPrefix(line, imageFootprintSentinel) {
+						line = line[len(imageFootprintSentinel):]
 					}
-					lines = append(lines, toolBoxSide(v.Theme, body, width))
+					lines = append(lines, toolBoxSide(v.Theme, line, width))
 				}
 				lines = append(lines, toolBoxSide(v.Theme, "", width))
 				lines = append(lines, toolBoxBottom(v.Theme, width))
 	}
 	body := toolResultBlock(v.Theme, tc.Result, width, color)
 	for _, l := range v.collapseToolBody(body, false) {
-		if hasImageEscapeLine(l) {
+		if strings.HasPrefix(l, imageFootprintSentinel) {
-			lines = append(lines, l)
+			l = l[len(imageFootprintSentinel):]
-			continue
 		}
 		lines = append(lines, toolBoxSide(v.Theme, l, width))
 	}
 	body = v.collapseToolBody(body, false)
 	out := make([]string, 0, len(body))
 	for _, l := range body {
-		if hasImageEscapeLine(l) {
+		if strings.HasPrefix(l, imageFootprintSentinel) {
-			out = append(out, l)
+			l = l[len(imageFootprintSentinel):]
-			continue
 		}
 		out = append(out, toolBoxSide(v.Theme, l, width))
 	}
 // the corner, and gives body lines a tiny gutter from the left side.
 const toolBoxInnerPad = 1
+// toolBoxOuterMargin is the number of blank cells kept to the left of
+// the opening corner and to the right of the closing corner. Aligns
+// the box's frame with the column where user-bubble text begins, so
+// the conversation reads as one column instead of having tool boxes
+// running edge-to-edge while user/assistant rows sit indented.
+const toolBoxOuterMargin = 2
 // toolBoxTop renders the labelled top edge of a tool block:
 //
 //	┌─  bash xcrun simctl list devices ─────────────────────────────┐
 // of the line so the right corner sits at column width-1, matching the
 // closing edge.
 func toolBoxTop(th Theme, label string, width int) string {
-	w := width
+	w := width - 2*toolBoxOuterMargin
 	if w < 12 {
 		w = 12
 	}
+	margin := strings.Repeat(" ", toolBoxOuterMargin)
 	innerPad := strings.Repeat(" ", toolBoxInnerPad)
 	// "┌─" + innerPad + " " + label + " " + innerPad = used; pad
 	// with ─ to width-1, then "┐".
 		}
 	}
 	line := prefix + label + suffix + strings.Repeat("─", fill) + "┐"
-	return th.FG256(th.Muted, line)
+	return margin + th.FG256(th.Muted, line) + margin
 }
 // toolBoxBottom renders the bottom edge of a tool block:
 //
 // Spans the same width as toolBoxTop so the corners line up.
 func toolBoxBottom(th Theme, width int) string {
-	w := width
+	w := width - 2*toolBoxOuterMargin
 	if w < 12 {
 		w = 12
 	}
+	margin := strings.Repeat(" ", toolBoxOuterMargin)
 	line := "└" + strings.Repeat("─", w-2) + "┘"
-	return th.FG256(th.Muted, line)
+	return margin + th.FG256(th.Muted, line) + margin
 }
 // hasImageEscapeLine reports whether s contains a Kitty (\x1b_G) or
 	return strings.Contains(s, "\x1b]1337;File=") || strings.Contains(s, "\x1b_G")
 }
+// imageFootprintSentinel marks rows that belong to an inline-image's
+// reserved footprint — the escape row plus the blank rows below it
+// plus the gap row before the metadata caption. Any consumer that
+// wraps content in box edges (│ … │) detects the sentinel, strips
+// it, and emits the row un-bordered so the box's vertical edges
+// don't show through next to the image's graphics rectangle. Uses a
+// non-printing C0 control byte so it can never appear in normal
+// text or in an ANSI escape sequence body.
+const imageFootprintSentinel = "\x1e"
 // toolBoxBodyTrimLeft is the number of leading literal spaces stripped
 // from each body line as it enters toolBoxSide. Body renderers
 // (renderToolText, renderRawFile, the diff/bash helpers, ...) all
 // of inner padding sits on each side so the content breathes from the
 // edges; the right padding fills to column width-1.
 func toolBoxSide(th Theme, line string, width int) string {
-	w := width
+	w := width - 2*toolBoxOuterMargin
 	if w < 12 {
 		w = 12
 	}
+	margin := strings.Repeat(" ", toolBoxOuterMargin)
 	left := th.FG256(th.Muted, "│") + strings.Repeat(" ", toolBoxInnerPad)
 	right := strings.Repeat(" ", toolBoxInnerPad) + th.FG256(th.Muted, "│")
 	inner := w - 2 - 2*toolBoxInnerPad // available between the two pads
 	line = trimLeadingSpaces(line, toolBoxBodyTrimLeft)
+	// Inline-image escapes (iTerm OSC 1337, Kitty APC G) carry
+	// thousands of bytes of base64 payload that visibleWidth and
+	// stripANSI don't recognise as ANSI. Measuring or truncating
+	// such a row destroys the escape and the image disappears.
+	// Pass the row through with edges + a fixed inner padding
+	// based on the visible prefix only.
+	if hasImageEscapeLine(line) {
+		return margin + left + line + right + margin
+	}
 	cur := visibleWidth(line)
 	if cur > inner {
 		// Last-resort truncation. Strips ANSI styling at the cut
 	if pad < 0 {
 		pad = 0
 	}
-	return left + line + strings.Repeat(" ", pad) + right
+	return margin + left + line + strings.Repeat(" ", pad) + right + margin
 }
 // trimLeadingSpaces removes up to n literal space characters from the
 			// below the reserved rectangle is more stable and easier to
 			// read. One extra blank row before the metadata gives the
 			// caption breathing room from the image's last pixel row.
+			//
+			// Every footprint row (escape, reservations, gap) is tagged
+			// with imageFootprintSentinel so callers wrapping content in
+			// box edges can recognise these rows and emit them bare —
+			// the image's graphics rectangle paints over them and any
+			// │ character drawn alongside would visibly bleed through.
+			// 4 leading cells push the escape past the box's left
+			// edge plus a small interior gutter so the image rectangle
+			// sits visibly inside the frame instead of kissing the │.
 			out := make([]string, 0, rows+3)
-			out = append(out, "    "+seq)
+			out = append(out, imageFootprintSentinel+"    "+seq)
 			for i := 1; i < rows; i++ {
-				out = append(out, "")
+				out = append(out, imageFootprintSentinel)
 			}
-			out = append(out, "")
+			out = append(out, imageFootprintSentinel)
 			out = append(out, v.Theme.FG256(v.Theme.Muted, info))
 			return out
 		}
 				}
 				md := RenderMarkdown(text, th, width-4)
 				for _, l := range strings.Split(md, "\n") {
+					if len(l) > 0 && l[0] == FlushLeftSentinel {
+						l = l[1:]
+					}
 					lines = append(lines, indent+l)
 				}
 			}