carthagent 1.0.7 → 1.1.0-beta.2

package/docs/patches/opencode-v2.0.32-glyphs.patch

@@ -0,0 +1,3670 @@
+diff --git a/packages/tui/src/app.tsx b/packages/tui/src/app.tsx
+index 88939ebc852824e6ef2371c719a528ab75092a7c..6c16e376aa10f28e767e4fba17c2220158330b53 100644
+--- a/packages/tui/src/app.tsx
++++ b/packages/tui/src/app.tsx
+@@ -2,6 +2,7 @@ import { existsSync } from "fs"
+ import path from "path"
+ import { render, useRenderer, useTerminalDimensions } from "@opentui/solid"
+ import { registerOpencodeSpinner } from "./component/register-spinner"
++import { chromeEllipsis, chromeLabel } from "./ui/glyphs"
+ import { Effect, Latch } from "effect"
+ import { Service, type Endpoint } from "@opencode/client/effect/service"
+ import { OpenCode, type SessionInfo } from "@opencode/client"
+@@ -618,7 +619,7 @@ function App() {
+         return
+       }
+ 
+-      renderer.setTerminalTitle(`OC | ${title.length > 40 ? title.slice(0, 37) + "…" : title}`)
++      renderer.setTerminalTitle(`OC | ${title.length > 40 ? title.slice(0, 37) + chromeEllipsis() : title}`)
+       return
+     }
+ 
+@@ -1046,7 +1047,7 @@ function App() {
+                 const restart = client.restart
+                 if (!restart) return
+                 dialog.clear()
+-                toast.show({ variant: "info", message: "Restarting service…", duration: 30000 })
++                toast.show({ variant: "info", message: chromeLabel("Restarting service…"), duration: 30000 })
+                 // restart resolves once the replacement service is healthy; the
+                 // event stream reattaches through the reconnect loop.
+                 await restart()
+@@ -1063,7 +1064,7 @@ function App() {
+         slash: { name: "reload" },
+         run: async () => {
+           dialog.clear()
+-          toast.show({ variant: "info", message: "Reloading configuration…", duration: 30000 })
++          toast.show({ variant: "info", message: chromeLabel("Reloading configuration…"), duration: 30000 })
+           await client.api.location
+             .reload()
+             .then(() => {
+diff --git a/packages/tui/src/component/command-palette.tsx b/packages/tui/src/component/command-palette.tsx
+index 4f46db3253589b4cc05bc32cb1c12087f2663cab..51390b70b51378d4de227a285870d909c4faf2b7 100644
+--- a/packages/tui/src/component/command-palette.tsx
++++ b/packages/tui/src/component/command-palette.tsx
+@@ -3,6 +3,7 @@ import { DialogSelect, type DialogSelectRef } from "../ui/dialog-select"
+ import { type DialogContext } from "../ui/dialog"
+ import { COMMAND_PALETTE_COMMAND, Keymap, type KeymapCommand } from "../context/keymap"
+ import { DialogConfig, settingID, settings } from "./dialog-config"
++import { chromeStatusSeparator } from "../ui/glyphs"
+ 
+ function isSuggestedPaletteCommand(command: KeymapCommand) {
+   const suggested = command.suggested
+@@ -23,7 +24,7 @@ export function CommandPaletteDialog() {
+         description: command.description,
+         category: command.group,
+         searchText: [command.id, command.description].filter(Boolean).join(" "),
+-        searchFooter: [command.group, footer].filter(Boolean).join(" · "),
++        searchFooter: [command.group, footer].filter(Boolean).join(` ${chromeStatusSeparator()} `),
+         footer,
+         value: command.id,
+         suggested: isSuggestedPaletteCommand(command),
+@@ -38,7 +39,7 @@ export function CommandPaletteDialog() {
+     title: setting.title,
+     category: setting.category,
+     searchText: setting.keywords?.join(" "),
+-    searchFooter: `Settings · ${setting.category}`,
++    searchFooter: `Settings ${chromeStatusSeparator()} ${setting.category}`,
+     value: `setting:${settingID(setting)}`,
+     onSelect: (dialog: DialogContext) => {
+       dialog.replace(() => <DialogConfig current={settingID(setting)} />)
+diff --git a/packages/tui/src/component/devtools-bar.tsx b/packages/tui/src/component/devtools-bar.tsx
+index 10af2019d600530eb9275a05216fe658e255c066..259b561364c8b9fd5c71afe9d647991ed9ff6817 100644
+--- a/packages/tui/src/component/devtools-bar.tsx
++++ b/packages/tui/src/component/devtools-bar.tsx
+@@ -17,6 +17,7 @@ import { useDialog } from "../ui/dialog"
+ import { DialogExperiments } from "./dialog-experiments"
+ import { usePlugin } from "../plugin/context"
+ import { errorMessage } from "../util/error"
++import { chromeGlyph, chromeLabel } from "../ui/glyphs"
+ 
+ const graphWidth = 23
+ const sampleIntervalMilliseconds = 2_000
+@@ -254,7 +255,7 @@ export function DevToolsBar() {
+                   : theme.text.base
+           }
+         >
+-          {serverIndicator().icon}
++          {chromeGlyph(serverIndicator().icon)}
+         </text>
+         <text
+           fg={
+@@ -360,7 +361,7 @@ export function DevToolsBar() {
+           <PanelBox>
+             <PanelTitle>Tools</PanelTitle>
+             <Action onClick={() => void dump()} disabled={dumping()} hoverBackground>
+-              {dumping() ? "Writing debug snapshot…" : "Write debug snapshot"}
++              {dumping() ? chromeLabel("Writing debug snapshot…") : "Write debug snapshot"}
+             </Action>
+             <Show when={dumpPath()}>
+               {(file) => (
+@@ -579,15 +580,15 @@ export function runtimeStatus(samples: readonly Readonly<{ delay: number; time:
+ }
+ 
+ export function statusIcon(status: RuntimeStatus) {
+-  if (status === "high") return "●"
+-  if (status === "medium") return "⦿"
+-  return "○"
++  if (status === "high") return chromeGlyph("●")
++  if (status === "medium") return chromeGlyph("⦿")
++  return chromeGlyph("○")
+ }
+ 
+ export function connectionIndicator(status: "connected" | "connecting" | "reconnecting", attempt: number) {
+-  if (status === "connected") return { state: "connected" as const, icon: "✓" }
+-  if (status === "reconnecting" && attempt >= 3) return { state: "disconnected" as const, icon: "×" }
+-  return { state: "reconnecting" as const, icon: "↻" }
++  if (status === "connected") return { state: "connected" as const, icon: chromeGlyph("✓") }
++  if (status === "reconnecting" && attempt >= 3) return { state: "disconnected" as const, icon: chromeGlyph("×") }
++  return { state: "reconnecting" as const, icon: chromeGlyph("↻") }
+ }
+ 
+ export function brailleGraph(values: readonly number[], width = graphWidth) {
+diff --git a/packages/tui/src/component/dialog-config.tsx b/packages/tui/src/component/dialog-config.tsx
+index f2e3f28b837d0af38f5ada1dc7b4fe3856462bcd..2e0d04234e730cb10c5a468647d456ea364391db 100644
+--- a/packages/tui/src/component/dialog-config.tsx
++++ b/packages/tui/src/component/dialog-config.tsx
+@@ -2,6 +2,7 @@ import { createMemo, createSignal } from "solid-js"
+ import { useConfig, useNewDesigns } from "../config"
+ import { useThemes } from "../context/theme"
+ import { DialogSelect } from "../ui/dialog-select"
++import { chromeGlyph } from "../ui/glyphs"
+ import { useToast } from "../ui/toast"
+ 
+ type Setting = {
+@@ -402,7 +403,7 @@ export function DialogConfig(props: { current?: string }) {
+       filterThreshold={0.7}
+       onMove={(option) => setSelected(option.value)}
+       onSelect={(option) => void change(1, option.value)}
+-      footerHints={newDesigns() ? [] : [{ title: "change", label: "←/→" }]}
++      footerHints={newDesigns() ? [] : [{ title: "change", label: `${chromeGlyph("←")}/${chromeGlyph("→")}` }]}
+       bindings={[
+         {
+           bind: "left",
+diff --git a/packages/tui/src/component/dialog-debug.tsx b/packages/tui/src/component/dialog-debug.tsx
+index 546f47c56c64eef5d5f2954d36dfb7ce4231e43d..1c1d4b81ab37461dc56bbb8c32571a0af928fadb 100644
+--- a/packages/tui/src/component/dialog-debug.tsx
++++ b/packages/tui/src/component/dialog-debug.tsx
+@@ -9,6 +9,7 @@ import { useToast } from "../ui/toast"
+ import { describeOS, describeTerminal } from "../util/system"
+ import { useTuiApp } from "../context/runtime"
+ import { useNewDesigns } from "../config"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+ export function DialogDebug() {
+   const theme = useTheme()
+@@ -54,7 +55,7 @@ export function DialogDebug() {
+   }))
+ 
+   const copyAction = () => ({
+-    title: copied() ? "✓ copied" : "copy",
++    title: copied() ? `${chromeGlyph("✓")} copied` : "copy",
+     key: newDesigns() ? "c" : "enter",
+     color: copied() ? theme.text.feedback.success.base : undefined,
+     onTrigger: copy,
+diff --git a/packages/tui/src/component/dialog-error-details.tsx b/packages/tui/src/component/dialog-error-details.tsx
+index fe8f122903e22b2b1cc20c07cdcf52fef044c783..ff8d521c992dbc219dc1ecf6f120e42936179c50 100644
+--- a/packages/tui/src/component/dialog-error-details.tsx
++++ b/packages/tui/src/component/dialog-error-details.tsx
+@@ -11,6 +11,7 @@ import { useTheme } from "../context/theme"
+ import { emptyPrompt } from "../prompt/history"
+ import { DIALOG_INSET, DialogFooter, DialogHeader, DialogLayout, dialogWidth, useDialog } from "../ui/dialog"
+ import { FilePath } from "../ui/file-path"
++import { chromeGlyph } from "../ui/glyphs"
+ import { useToast } from "../ui/toast"
+ import { errorDetails } from "../util/error-details"
+ 
+@@ -64,7 +65,7 @@ export function DialogErrorDetails(props: {
+   const actions = () => [
+     { title: "investigate", key: "i", onTrigger: investigate },
+     copied()
+-      ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: copy }
++      ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: copy }
+       : { title: "copy details", key: "c", onTrigger: copy },
+   ]
+ 
+@@ -109,7 +110,9 @@ export function DialogErrorDetails(props: {
+         </box>
+       }
+       footer={{ actions: { primary: actions() } }}
+-      legacyFooter={<DialogFooter actions={{ secondary: actions(), primary: [{ title: "scroll", key: "↑/↓" }] }} />}
++      legacyFooter={
++        <DialogFooter actions={{ secondary: actions(), primary: [{ title: "scroll", key: `${chromeGlyph("↑")}/${chromeGlyph("↓")}` }] }} />
++      }
+     >
+       <scrollbox
+         ref={(element: ScrollBoxRenderable) => (scroll = element)}
+diff --git a/packages/tui/src/component/dialog-experiments.tsx b/packages/tui/src/component/dialog-experiments.tsx
+index a8830000f88043ddaaafb100cf080932536cebcc..db00317858710f7e8ae08225b858e1d825591c43 100644
+--- a/packages/tui/src/component/dialog-experiments.tsx
++++ b/packages/tui/src/component/dialog-experiments.tsx
+@@ -3,6 +3,7 @@ import { useConfig, useNewDesigns } from "../config"
+ import { DIALOG_LIST_INSET } from "../ui/dialog"
+ import { DialogSelect } from "../ui/dialog-select"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph } from "../ui/glyphs"
+ import { useToast } from "../ui/toast"
+ 
+ type Experiment = {
+@@ -68,7 +69,11 @@ export function DialogExperiments() {
+           <text fg={theme.text.muted}>No experiments available</text>
+         </box>
+       }
+-      footerHints={experiments.length > 0 && !newDesigns() ? [{ title: "change", label: "←/→" }] : []}
++      footerHints={
++        experiments.length > 0 && !newDesigns()
++          ? [{ title: "change", label: `${chromeGlyph("←")}/${chromeGlyph("→")}` }]
++          : []
++      }
+       bindings={
+         experiments.length > 0
+           ? [
+diff --git a/packages/tui/src/component/dialog-highlights.tsx b/packages/tui/src/component/dialog-highlights.tsx
+index d11506eae7ababa0b7b7f8cbda571cc330296252..b04827d3b4ed44733931c2ea3d1ae1ef8f1dbd3e 100644
+--- a/packages/tui/src/component/dialog-highlights.tsx
++++ b/packages/tui/src/component/dialog-highlights.tsx
+@@ -6,6 +6,7 @@ import { Keymap } from "../context/keymap"
+ import type { TuiHighlight } from "../context/runtime"
+ import { useTheme } from "../context/theme"
+ import { DIALOG_INSET, DialogBleed, DialogFooter, DialogHeader, DialogLayout, useDialog } from "../ui/dialog"
++import { chromeGlyph } from "../ui/glyphs"
+ import { getScrollAcceleration } from "../util/scroll"
+ 
+ export function DialogHighlights(props: { version: string; items: ReadonlyArray<TuiHighlight> }) {
+@@ -38,7 +39,7 @@ export function DialogHighlights(props: { version: string; items: ReadonlyArray<
+       footer={{ actions: { primary: [{ title: "ok", key: "enter", onTrigger: () => dialog.clear() }] } }}
+       legacyFooter={
+         <box flexDirection="row" justifyContent="space-between" alignItems="center">
+-          <DialogFooter actions={{ secondary: [{ title: "scroll", key: "↑/↓" }] }} />
++          <DialogFooter actions={{ secondary: [{ title: "scroll", key: `${chromeGlyph("↑")}/${chromeGlyph("↓")}` }] }} />
+           <box
+             paddingLeft={3}
+             paddingRight={3}
+diff --git a/packages/tui/src/component/dialog-image-preview.tsx b/packages/tui/src/component/dialog-image-preview.tsx
+index f2bdd1d9e1b642dcd8707d585735f45fa6996a76..ae7811480ed9c02dbc9de58c1b38bc536d36ad23 100644
+--- a/packages/tui/src/component/dialog-image-preview.tsx
++++ b/packages/tui/src/component/dialog-image-preview.tsx
+@@ -2,6 +2,7 @@ import { useTerminalDimensions } from "@opentui/solid"
+ import { createMemo, createSignal } from "solid-js"
+ import { Keymap } from "../context/keymap"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph } from "../ui/glyphs"
+ import { DialogHeader, DialogLayout, useDialog } from "../ui/dialog"
+ 
+ type ImagePreviewItem = Readonly<{
+@@ -44,8 +45,8 @@ export function DialogImagePreview(props: { images: readonly ImagePreviewItem[];
+           primary:
+             props.images.length > 1
+               ? [
+-                  { title: "previous", key: "←", onTrigger: () => move(-1) },
+-                  { title: "next", key: "→", onTrigger: () => move(1) },
++                  { title: "previous", key: chromeGlyph("←"), onTrigger: () => move(-1) },
++                  { title: "next", key: chromeGlyph("→"), onTrigger: () => move(1) },
+                 ]
+               : [],
+         },
+@@ -60,13 +61,13 @@ export function DialogImagePreview(props: { images: readonly ImagePreviewItem[];
+       legacyFooter={
+         <box flexDirection="row" justifyContent="space-between">
+           <text fg={theme.text.muted} onMouseUp={() => move(-1)}>
+-            {props.images.length > 1 ? "← previous" : ""}
++            {props.images.length > 1 ? `${chromeGlyph("←")} previous` : ""}
+           </text>
+           <text fg={failed() ? theme.text.feedback.error.base : theme.text.muted} wrapMode="none" truncate>
+             {failed() ? "No preview" : (current().mention?.text ?? `Image ${index() + 1}`)}
+           </text>
+           <text fg={theme.text.muted} onMouseUp={() => move(1)}>
+-            {props.images.length > 1 ? "next →" : ""}
++            {props.images.length > 1 ? `next ${chromeGlyph("→")}` : ""}
+           </text>
+         </box>
+       }
+diff --git a/packages/tui/src/component/dialog-integration.tsx b/packages/tui/src/component/dialog-integration.tsx
+index 183e8df3af9f5449fd4e7dfc66f157071df31fb4..b346ae61839431fa60dc3e82dcf62aeb28778ac9 100644
+--- a/packages/tui/src/component/dialog-integration.tsx
++++ b/packages/tui/src/component/dialog-integration.tsx
+@@ -33,6 +33,7 @@ import {
+ } from "../ui/dialog"
+ import { DialogPrompt } from "../ui/dialog-prompt"
+ import { DialogSelect } from "../ui/dialog-select"
++import { chromeGlyph, chromeLabel } from "../ui/glyphs"
+ import { Link } from "../ui/link"
+ import { useToast } from "../ui/toast"
+ import { errorMessage } from "../util/error"
+@@ -135,13 +136,13 @@ export function DialogIntegration(
+         title: integration.name,
+         value: integration.id,
+         description: methods.length === 0 ? "Environment only" : undefined,
+-        footer: status ? "Sign in required →" : connectionSummary(integration) || undefined,
++        footer: status ? `Sign in required ${chromeGlyph("→")}` : connectionSummary(integration) || undefined,
+         footerColor: status ? theme.text.feedback.warning.base : undefined,
+         category,
+         disabled: methods.length === 0 && credentials.length === 0,
+         gutter:
+           integration.connections.length > 0 && !status
+-            ? () => <text fg={theme.text.feedback.success.base}>✓</text>
++            ? () => <text fg={theme.text.feedback.success.base}>{chromeGlyph("✓")}</text>
+             : undefined,
+         onSelect: () => {
+           if (credentials.length) return manageConnections(integration, methods, location, dialog, props.onConnected)
+@@ -218,7 +219,7 @@ function manageConnections(
+                   ? `Press ${shortcuts.get("dialog.integration.delete")} again to confirm`
+                   : connection.label,
+                 value: connection.id,
+-                footer: connection.status ? "Sign in required →" : undefined,
++                footer: connection.status ? `Sign in required ${chromeGlyph("→")}` : undefined,
+                 footerColor: connection.status ? theme.text.feedback.warning.base : undefined,
+                 category: "Connected accounts",
+                 bg: confirming ? theme.background.action.destructive.focused : undefined,
+@@ -381,7 +382,7 @@ function ExternalStarting(props: {
+         dialog.clear()
+       })
+   })
+-  return <OAuthView title={props.method.label} message="Connecting…" />
++  return <OAuthView title={props.method.label} message={chromeLabel("Connecting…")} />
+ }
+ 
+ async function beginKey(
+@@ -455,7 +456,7 @@ function CommandStarting(props: {
+     if (!handedOff) closed = true
+   })
+ 
+-  return <CommandView title={props.method.label} output="" message="Starting command…" />
++  return <CommandView title={props.method.label} output="" message={chromeLabel("Starting command…")} />
+ }
+ 
+ function CommandPending(props: {
+@@ -516,7 +517,7 @@ function CommandPending(props: {
+     })
+   })
+ 
+-  return <CommandView title={props.title} output={output()} message="Waiting for command to finish…" />
++  return <CommandView title={props.title} output={output()} message={chromeLabel("Waiting for command to finish…")} />
+ }
+ 
+ function CommandView(props: { title: string; output: string; message: string }) {
+@@ -649,7 +650,7 @@ function OAuthStarting(props: {
+       })
+   })
+ 
+-  return <OAuthView title={props.method.label} message="Starting authorization…" />
++  return <OAuthView title={props.method.label} message={chromeLabel("Starting authorization…")} />
+ }
+ 
+ function OAuthAuto(props: {
+@@ -737,7 +738,7 @@ function OAuthAuto(props: {
+       title={props.title}
+       url={props.attempt.url}
+       instructions={props.attempt.instructions}
+-      message="Waiting for authorization…"
++      message={chromeLabel("Waiting for authorization…")}
+       onCopy={copy}
+       onOpen={open}
+     />
+@@ -1013,7 +1014,7 @@ function StringChoiceField(props: {
+                 { title: "back", key: "esc", onTrigger: back },
+               ]
+             : [
+-                { title: "select", key: "↑/↓" },
++                { title: "select", key: `${chromeGlyph("↑")}/${chromeGlyph("↓")}` },
+                 { title: "confirm", key: "enter", onTrigger: () => select(store.selected) },
+                 { title: "cancel", key: "esc", onTrigger: () => dialog.clear() },
+               ],
+@@ -1232,7 +1233,7 @@ async function externalAnswer(
+     if (choice === true) return true
+     const result = await new Promise<boolean | typeof CANCELLED>((resolve) => {
+       dialog.replace(
+-        () => <OAuthView title={formLabel(field) || title} message="Opening link…" />,
++        () => <OAuthView title={formLabel(field) || title} message={chromeLabel("Opening link…")} />,
+         () => resolve(CANCELLED),
+       )
+       void openUrl(field.url).then(
+diff --git a/packages/tui/src/component/dialog-mcp.tsx b/packages/tui/src/component/dialog-mcp.tsx
+index 68e3778b42ffebbdf0138a05016a58c06cb20dda..aa0582b778e0fb93ad32bcaad13f3357302ed73c 100644
+--- a/packages/tui/src/component/dialog-mcp.tsx
++++ b/packages/tui/src/component/dialog-mcp.tsx
+@@ -5,6 +5,7 @@ import { pipe, sortBy } from "remeda"
+ import { DialogSelect } from "../ui/dialog-select"
+ import { useDialog } from "../ui/dialog"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph, chromeLabel } from "../ui/glyphs"
+ import { TextAttributes } from "@opentui/core"
+ import type { McpServer } from "@opencode/client"
+ import { useToast } from "../ui/toast"
+@@ -19,18 +20,18 @@ function statusError(status: McpServer["status"]) {
+ 
+ function Status(props: { status: McpServer["status"]; loading: boolean }) {
+   if (props.loading || props.status.status === "pending") {
+-    return <>Connecting …</>
++    return <>{chromeLabel("Connecting …")}</>
+   }
+   if (props.status.status === "connected") {
+-    return <span style={{ attributes: TextAttributes.BOLD }}>Connected ✓</span>
++    return <span style={{ attributes: TextAttributes.BOLD }}>Connected {chromeGlyph("✓")}</span>
+   }
+   if (props.status.status === "failed") {
+-    return <>Failed !</>
++    return <>Failed {chromeGlyph("✗")}</>
+   }
+   if (props.status.status === "needs_auth") {
+-    return <>Sign in required →</>
++    return <>Sign in required {chromeGlyph("→")}</>
+   }
+-  return <>Disabled ○</>
++  return <>Disabled {chromeGlyph("○")}</>
+ }
+ 
+ export function DialogMcp(props: { initialServer?: string; details?: boolean } = {}) {
+diff --git a/packages/tui/src/component/dialog-open.tsx b/packages/tui/src/component/dialog-open.tsx
+index f6d6412c1883ad5a7e61c6904fb17e653c0ea86c..ddab0c6ff55cb6dd1d68cd3015aaea9d0ce8d3ee 100644
+--- a/packages/tui/src/component/dialog-open.tsx
++++ b/packages/tui/src/component/dialog-open.tsx
+@@ -23,6 +23,7 @@ import { withTimestampedFallback } from "@opencode/util/session-title-fallback"
+ import { sessionStatusGutter } from "./dialog-session-list"
+ import { Spinner } from "./spinner"
+ import { projectName } from "../util/project"
++import { chromeEllipsis, chromeGlyph, chromeLabel, chromeStatusSeparator } from "../ui/glyphs"
+ 
+ const RECENT_LIMIT = 8
+ export const DialogOpenKey = Symbol("DialogOpen")
+@@ -211,7 +212,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+       const basename = path.basename(session.location.directory)
+       const label =
+         name && session.location.directory !== project?.canonical && name.toLowerCase() !== basename.toLowerCase()
+-          ? `${name} · ${basename}`
++          ? `${name} ${chromeGlyph("·")} ${basename}`
+           : name || basename
+       const state = attention(session.id)
+       const running =
+@@ -223,13 +224,13 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+         searchText: `${session.id} ${session.location.directory}`,
+         value: { type: "session", sessionID: session.id } as OpenTarget,
+         category: "Sessions",
+-        footer: `${label ? `${Locale.truncate(label, 30)} · ` : ""}${timeAgo(session.time.updated)}`,
++          footer: `${label ? `${Locale.truncate(label, 30, chromeEllipsis())} ${chromeGlyph("·")} ` : ""}${timeAgo(session.time.updated)}`,
+         onSelect: () => location.set(session.location),
+         gutter: sessionStatusGutter(
+           theme,
+           state,
+           running,
+-          tabs.has(session.id) ? () => <text fg={theme.hue.accent[200]}>▪</text> : undefined,
++          tabs.has(session.id) ? () => <text fg={theme.hue.accent[200]}>{chromeGlyph("▪")}</text> : undefined,
+         ),
+       }
+     })
+@@ -254,7 +255,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+           (git ? 2 : 0)
+         return {
+           title,
+-          footer: `${truncateFilePath(footer, width)}${git ? " →" : ""}`,
++          footer: `${truncateFilePath(footer, width)}${git ? ` ${chromeGlyph("→")}` : ""}`,
+           searchText: `${footer} ${projectName(item.project) ?? ""}`,
+           value: {
+             type: "project",
+@@ -265,7 +266,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+           gutter:
+             item.directory === current.directory ||
+             item.directory === location.current?.project.canonical
+-              ? () => <text fg={theme.text.formfield.selected}>●</text>
++              ? () => <text fg={theme.text.formfield.selected}>{chromeGlyph("●")}</text>
+               : undefined,
+         }
+       })
+@@ -316,7 +317,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+           footer: footer + " ".repeat(Math.max(0, width - stringWidth(footer))),
+           value: { type: "project", directory } as OpenTarget,
+           gutter:
+-            directory === current.directory ? () => <text fg={theme.text.formfield.selected}>●</text> : undefined,
++            directory === current.directory ? () => <text fg={theme.text.formfield.selected}>{chromeGlyph("●")}</text> : undefined,
+         }
+       })
+   })
+@@ -336,7 +337,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+               restore(previous)
+             }}
+             title={projectID() ? `${projectName(data.project.get(projectID()!)) ?? "Project"} / Worktrees` : "Open"}
+-            placeholder={projectID() ? "Search worktrees…" : "Search sessions and projects…"}
++            placeholder={projectID() ? chromeLabel("Search worktrees…") : chromeLabel("Search sessions and projects…")}
+             options={projectID() ? worktreeOptions() : options()}
+             current={
+               currentSessionID() ? ({ type: "session", sessionID: currentSessionID()! } as OpenTarget) : undefined
+@@ -367,10 +368,10 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+               >
+                 <box>
+                   <Show when={projectID() && worktrees.loading}>
+-                    <Spinner color={theme.text.muted}>Loading worktrees…</Spinner>
++                    <Spinner color={theme.text.muted}>{chromeLabel("Loading worktrees…")}</Spinner>
+                   </Show>
+                   <Show when={!projectID() && (recent.loading || projects.loading)}>
+-                    <Spinner color={theme.text.muted}>Refreshing sessions and projects…</Spinner>
++                    <Spinner color={theme.text.muted}>{chromeLabel("Refreshing sessions and projects…")}</Spinner>
+                   </Show>
+                   <Show when={!projectID() && (recent() === false || projects() === false)}>
+                     <text fg={theme.text.feedback.error.base}>
+@@ -422,12 +423,12 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+                 <text fg={theme.text.muted}>
+                   {projectID()
+                     ? worktrees.loading
+-                      ? "Loading worktrees…"
++                      ? chromeLabel("Loading worktrees…")
+                       : "No matching worktrees"
+                     : recent.loading || projects.loading || matched.loading
+-                      ? "Searching sessions and projects…"
++                      ? chromeLabel("Searching sessions and projects…")
+                       : shortcuts.get("session.list")
+-                        ? `No matches · search all sessions with ${shortcuts.get("session.list")}`
++                        ? `No matches ${chromeStatusSeparator()} search all sessions with ${shortcuts.get("session.list")}`
+                         : "No matches"}
+                 </text>
+               </box>
+@@ -453,7 +454,7 @@ export function DialogOpen(props: { sessions: SessionInfo[]; onLoad: (sessions:
+           placeholder="Worktree name (optional)"
+           description={() => <text fg={theme.text.muted}>Leave blank for a random name.</text>}
+           busy={creating()}
+-          busyText="Creating worktree…"
++          busyText={chromeLabel("Creating worktree…")}
+           onCancel={cancelCreation}
+           onConfirm={(value) => {
+             const id = projectID()!
+diff --git a/packages/tui/src/component/dialog-pair.tsx b/packages/tui/src/component/dialog-pair.tsx
+index 0bc0ce44b49ee4e332cbdf001ae8b02764c93973..5e9d875450ea17d1636083216bb94950f22d36f8 100644
+--- a/packages/tui/src/component/dialog-pair.tsx
++++ b/packages/tui/src/component/dialog-pair.tsx
+@@ -7,6 +7,7 @@ import { useTheme } from "../context/theme"
+ import { DialogHeader, DialogLayout, useDialog } from "../ui/dialog"
+ import { Link } from "../ui/link"
+ import { errorMessage } from "../util/error"
++import { chromeLabel } from "../ui/glyphs"
+ 
+ export function DialogPair() {
+   const client = useClient()
+@@ -91,7 +92,7 @@ export function DialogPair() {
+       <Show
+         when={loadError()}
+         fallback={
+-          <Show when={info()} fallback={<text fg={theme.text.muted}>Loading server information…</text>}>
++          <Show when={info()} fallback={<text fg={theme.text.muted}>{chromeLabel("Loading server information…")}</text>}>
+             <Show
+               when={dimensions().height >= 36}
+               fallback={
+diff --git a/packages/tui/src/component/dialog-session-list.tsx b/packages/tui/src/component/dialog-session-list.tsx
+index d5fb5ac4f9b0cb717f649d4d43ed121f3aff66f6..5a59c284734c104248784af91bd8a4758682b6ac 100644
+--- a/packages/tui/src/component/dialog-session-list.tsx
++++ b/packages/tui/src/component/dialog-session-list.tsx
+@@ -23,6 +23,7 @@ import { useConfig, useNewDesigns } from "../config"
+ import { withTimestampedFallback } from "@opencode/util/session-title-fallback"
+ import { projectName } from "../util/project"
+ import { useLocation } from "../context/location"
++import { chromeEllipsis, chromeLabel } from "../ui/glyphs"
+ 
+ export function DialogSessionList() {
+   const dialog = useDialog()
+@@ -111,7 +112,7 @@ export function DialogSessionList() {
+   const searchState = createMemo(() => {
+     const query = filter().trim()
+     if (query !== search().trim() || searchResults.loading)
+-      return { message: query ? "Searching sessions…" : "Loading sessions…", error: false }
++      return { message: query ? chromeLabel("Searching sessions…") : chromeLabel("Loading sessions…"), error: false }
+     const result = searchResults()
+     if (result?.query === query && result.error)
+       return {
+@@ -155,10 +156,7 @@ export function DialogSessionList() {
+       const project = data.project.get(session.projectID)
+       const root = session.subpath ? path.resolve(directory, ...session.subpath.split("/").map(() => "..")) : directory
+       const relative = path.relative(project?.canonical ?? root, root)
+-      const footer =
+-        relative.startsWith("..") || path.isAbsolute(relative)
+-          ? Locale.truncate(path.basename(relative), 25)
+-          : undefined
++      const footer = sessionListRelativePathFooter(relative)
+       const slot = sessionTabs.enabled() ? undefined : slotByID.get(session.id)
+       const deleting = toDelete() === session.id
+       const attention = sessionTabs.status(session.id).attention
+@@ -298,6 +296,12 @@ export function DialogSessionList() {
+   )
+ }
+ 
++export function sessionListRelativePathFooter(relative: string) {
++  return relative.startsWith("..") || path.isAbsolute(relative)
++    ? Locale.truncate(path.basename(relative), 25, chromeEllipsis())
++    : undefined
++}
++
+ function quickSwitchRange(first: string, last: string) {
+   const prefix = first.slice(0, -1)
+   if (first.endsWith("1") && last === `${prefix}9`) return `${prefix}1-9`
+diff --git a/packages/tui/src/component/dialog-shell-output.tsx b/packages/tui/src/component/dialog-shell-output.tsx
+index 42f0c98d1b0cd7e0f8244f71da4db6748e1621d3..4ba60790d24040227d4bcdc32e611330db8bb842 100644
+--- a/packages/tui/src/component/dialog-shell-output.tsx
++++ b/packages/tui/src/component/dialog-shell-output.tsx
+@@ -7,9 +7,14 @@ import { useClient } from "../context/client"
+ import { Keymap } from "../context/keymap"
+ import { useTheme } from "../context/theme"
+ import { DialogFooter, DialogHeader, DialogLayout, useDialog } from "../ui/dialog"
++import { chromeGlyph, chromeLabel } from "../ui/glyphs"
+ 
+ const PAGE_BYTES = 64 * 1024
+ 
++export function shellOutputOmittedLabel() {
++  return `Earlier output omitted ${chromeGlyph("·")} showing recent output`
++}
++
+ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationRef }) {
+   const client = useClient()
+   const dialog = useDialog()
+@@ -65,7 +70,7 @@ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationR
+         .catch((cause: unknown) => {
+           if (disposed) return
+           missing = isShellNotFoundError(cause)
+-          setError(missing ? "Shell output is no longer available." : "Unable to read shell output. Retrying…")
++      setError(missing ? "Shell output is no longer available." : chromeLabel("Unable to read shell output. Retrying…"))
+         })
+         .then((more) => {
+           // Poll only while the viewer is open, including after exit so the final
+@@ -84,7 +89,7 @@ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationR
+     if (info().status === "running") return "Running"
+     if (info().status === "timeout") return "Timed out"
+     if (info().status === "killed") return "Killed"
+-    return info().exit === undefined ? "Exited" : `Exited · code ${info().exit}`
++    return info().exit === undefined ? "Exited" : `Exited ${chromeGlyph("·")} code ${info().exit}`
+   }
+ 
+   Keymap.createLayer(() => ({
+@@ -117,7 +122,7 @@ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationR
+         <DialogFooter
+           actions={{
+             secondary: [
+-              { title: "scroll", key: "↑/↓" },
++              { title: "scroll", key: `${chromeGlyph("↑")}/${chromeGlyph("↓")}` },
+               { title: "follow", key: "end" },
+               { title: "back", key: "esc" },
+             ],
+@@ -130,7 +135,7 @@ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationR
+           {props.shell.command}
+         </text>
+         <Show when={omitted()}>
+-          <text fg={theme.text.muted}>Earlier output omitted · showing recent output</text>
++          <text fg={theme.text.muted}>{shellOutputOmittedLabel()}</text>
+         </Show>
+         <scrollbox
+           id="shell-output-scroll"
+@@ -143,7 +148,7 @@ export function DialogShellOutput(props: { shell: ShellInfo; location: LocationR
+           <text fg={theme.text.base} wrapMode="word">
+             {text() ||
+               (output() === undefined
+-                ? "Loading output…"
++                ? "Loading output..."
+                 : "No captured output. Output redirected to files is not shown here.")}
+           </text>
+         </scrollbox>
+diff --git a/packages/tui/src/component/dialog-skill.tsx b/packages/tui/src/component/dialog-skill.tsx
+index 5e45e628b1d72178fd6574922d0ef4016bb2b8f3..6d3d8ebb6cb6c0461f9789ae712b2dbdf0fa2435 100644
+--- a/packages/tui/src/component/dialog-skill.tsx
++++ b/packages/tui/src/component/dialog-skill.tsx
+@@ -6,6 +6,7 @@ import { useTheme } from "../context/theme"
+ import { errorMessage } from "../util/error"
+ import { useData } from "../context/data"
+ import type { LocationRef } from "@opencode/client"
++import { chromeLabel } from "../ui/glyphs"
+ 
+ export type DialogSkillProps = {
+   location?: LocationRef
+@@ -78,7 +79,7 @@ export function DialogSkill(props: DialogSkillProps) {
+           </Match>
+           <Match when={skills.loading}>
+             <box paddingLeft={DIALOG_LIST_INSET} paddingRight={DIALOG_LIST_INSET}>
+-              <text fg={theme.text.muted}>Loading skills…</text>
++              <text fg={theme.text.muted}>{chromeLabel("Loading skills…")}</text>
+             </box>
+           </Match>
+         </Switch>
+diff --git a/packages/tui/src/component/dialog-stash.tsx b/packages/tui/src/component/dialog-stash.tsx
+index 4113c7fd969f4d79709b049cada13a3faf7b8832..f80c7e9f35da2f2bb82083f0da4ada1ca965be19 100644
+--- a/packages/tui/src/component/dialog-stash.tsx
++++ b/packages/tui/src/component/dialog-stash.tsx
+@@ -5,6 +5,7 @@ import { Locale } from "../util/locale"
+ import { Keymap } from "../context/keymap"
+ import { useTheme } from "../context/theme"
+ import { usePromptStash, type StashEntry } from "../prompt/stash"
++import { chromeEllipsis } from "../ui/glyphs"
+ 
+ function getRelativeTime(timestamp: number): string {
+   const now = Date.now()
+@@ -23,7 +24,7 @@ function getRelativeTime(timestamp: number): string {
+ 
+ function getStashPreview(input: string, maxLength: number = 50): string {
+   const firstLine = input.split("\n")[0].trim()
+-  return Locale.truncate(firstLine, maxLength)
++  return Locale.truncate(firstLine, maxLength, chromeEllipsis())
+ }
+ 
+ export function DialogStash(props: { onSelect: (entry: StashEntry) => void }) {
+diff --git a/packages/tui/src/component/dialog-status.tsx b/packages/tui/src/component/dialog-status.tsx
+index f94f906cdf9d187234c24f575450d8ad13e3a559..2495eaf55ba47680be16e64a4110a99c0d11e116 100644
+--- a/packages/tui/src/component/dialog-status.tsx
++++ b/packages/tui/src/component/dialog-status.tsx
+@@ -2,6 +2,7 @@ import { useTheme } from "../context/theme"
+ import { DialogHeader, DialogLayout } from "../ui/dialog"
+ import { useData } from "../context/data"
+ import { For, Match, Switch, Show, createMemo } from "solid-js"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+ export function DialogStatus() {
+   const data = useData()
+@@ -25,7 +26,7 @@ export function DialogStatus() {
+             {(item) => (
+               <box flexDirection="row" gap={1}>
+                 <text flexShrink={0} style={{ fg: color(item.status.status) }}>
+-                  •
++                  {chromeGlyph("•")}
+                 </text>
+                 <text fg={theme.text.base} wrapMode="word">
+                   <b>{item.name}</b>{" "}
+diff --git a/packages/tui/src/component/dialog-update.tsx b/packages/tui/src/component/dialog-update.tsx
+index 9dcf07b21402bea0548420e0b53cd84f08f90cc3..54469a0b69bdb306414819c50b65b52d4356b08d 100644
+--- a/packages/tui/src/component/dialog-update.tsx
++++ b/packages/tui/src/component/dialog-update.tsx
+@@ -6,6 +6,7 @@ import type { UpdateState } from "../context/update-notification"
+ import { DialogHeader, DialogLayout, useDialog } from "../ui/dialog"
+ import { errorMessage } from "../util/error"
+ import { Spinner } from "./spinner"
++import { chromeEllipsis, chromeLabel } from "../ui/glyphs"
+ 
+ export function DialogUpdate(props: {
+   check?: (signal: AbortSignal) => Promise<string | undefined>
+@@ -133,7 +134,7 @@ export function DialogUpdate(props: {
+         {(current) => (
+           <Switch>
+             <Match when={current.type === "checking"}>
+-              <Spinner shimmer={theme.text.base}>Checking for updates…</Spinner>
++              <Spinner shimmer={theme.text.base}>{chromeLabel("Checking for updates…")}</Spinner>
+             </Match>
+             <Match when={current.type === "available"}>
+               <text fg={theme.text.muted}>
+@@ -142,7 +143,7 @@ export function DialogUpdate(props: {
+             </Match>
+             <Match when={current.type === "installing"}>
+               <Spinner shimmer={theme.text.base}>
+-                {current.type === "installing" ? `Installing OpenCode ${current.version}…` : ""}
++                {current.type === "installing" ? `Installing OpenCode ${current.version}${chromeEllipsis()}` : ""}
+               </Spinner>
+             </Match>
+             <Match when={current.type === "installed"}>
+diff --git a/packages/tui/src/component/dialog-workspaces.tsx b/packages/tui/src/component/dialog-workspaces.tsx
+index 70aaa8ff4bf2da36c787e59235af509391030dbe..4f3a04971459af5e93b10268573629a5a0ebf165 100644
+--- a/packages/tui/src/component/dialog-workspaces.tsx
++++ b/packages/tui/src/component/dialog-workspaces.tsx
+@@ -15,6 +15,7 @@ import { errorMessage } from "../util/error"
+ import { isRecord } from "../util/record"
+ import { useToast } from "../ui/toast"
+ import { Spinner } from "./spinner"
++import { chromeEllipsis, chromeLabel } from "../ui/glyphs"
+ import { DialogWorkspaceFileChanges } from "./dialog-workspace-file-changes"
+ import type { WorktreeListOutput } from "@opencode/client"
+ import { useRoute } from "../context/route"
+@@ -168,7 +169,7 @@ export function DialogWorkspaces(props: DialogWorkspacesProps) {
+       const title = abbreviateHome(item.location, paths.home)
+       const suffix =
+         item.location === item.root.directory ? undefined : path.sep + path.relative(item.root.directory, item.location)
+-      const visible = Locale.truncateLeft(title, titleWidth)
++      const visible = Locale.truncateLeft(title, titleWidth, chromeEllipsis())
+       const split = suffix ? Math.max(0, visible.length - suffix.length) : visible.length
+       const deleting = toDelete() === item.location
+       const isRemoving = removing() === item.location
+@@ -350,7 +351,7 @@ export function DialogWorkspaces(props: DialogWorkspacesProps) {
+             </box>
+           ) : directories.loading || loadedProject.loading ? (
+             <box paddingLeft={DIALOG_LIST_INSET} paddingRight={DIALOG_LIST_INSET}>
+-              <text fg={theme.text.muted}>Loading worktrees…</text>
++              <text fg={theme.text.muted}>{chromeLabel("Loading worktrees…")}</text>
+             </box>
+           ) : (
+             <box paddingLeft={DIALOG_LIST_INSET} paddingRight={DIALOG_LIST_INSET}>
+diff --git a/packages/tui/src/component/error-component.tsx b/packages/tui/src/component/error-component.tsx
+index 48ad4b107d755a296266c89ceb7479b6bd771b18..b4e46b9d8ebc3396009e9093be88f71a6c4967bc 100644
+--- a/packages/tui/src/component/error-component.tsx
++++ b/packages/tui/src/component/error-component.tsx
+@@ -6,6 +6,7 @@ import { useClipboard } from "../context/clipboard"
+ import { useExit } from "../context/exit"
+ import { useTuiApp } from "../context/runtime"
+ import { describeOS, describeTerminal } from "../util/system"
++import { chromeBorderChars, chromeGlyph, chromeLabel } from "../ui/glyphs"
+ 
+ export function ErrorComponent(props: { error: Error; reset: () => void; mode?: "dark" | "light" }) {
+   const term = useTerminalDimensions()
+@@ -55,7 +56,7 @@ export function ErrorComponent(props: { error: Error; reset: () => void; mode?:
+   const actions = [
+     {
+       key: "c",
+-      label: () => ({ idle: "Copy report", copied: "✓ Copied", failed: "Copy failed" })[copyState()],
++      label: () => ({ idle: "Copy report", copied: `${chromeGlyph("✓")} Copied`, failed: "Copy failed" })[copyState()],
+       copy: true,
+       onUse: copyReport,
+     },
+@@ -129,6 +130,7 @@ export function ErrorComponent(props: { error: Error; reset: () => void; mode?:
+           flexShrink={0}
+           border
+           borderStyle="rounded"
++          customBorderChars={chromeBorderChars()}
+           borderColor={colors.error}
+           title=" Error "
+           titleColor={colors.error}
+@@ -183,10 +185,11 @@ export function ErrorComponent(props: { error: Error; reset: () => void; mode?:
+           minHeight={3}
+           border
+           borderStyle="rounded"
++          customBorderChars={chromeBorderChars()}
+           borderColor={colors.borderSubtle}
+           title=" Stack trace "
+           titleColor={colors.muted}
+-          bottomTitle=" ↑↓ scroll "
++          bottomTitle={` ${chromeGlyph("↑")}${chromeGlyph("↓")} scroll `}
+           bottomTitleAlignment="right"
+           paddingLeft={1}
+           paddingRight={1}
+@@ -205,7 +208,7 @@ export function ErrorComponent(props: { error: Error; reset: () => void; mode?:
+           <box flexDirection="column" alignItems="center" flexShrink={0}>
+             <text fg={colors.muted}>
+               {copyState() === "copied"
+-                ? "Report copied — paste it into a new GitHub issue."
++                ? chromeLabel("Report copied — paste it into a new GitHub issue.")
+                 : copyState() === "failed"
+                   ? "Clipboard write failed. Try again or report the crash manually."
+                   : "Copy the report and open a GitHub issue to help us fix this."}
+@@ -237,7 +240,7 @@ function buildIssueURL(message: string, stack: string, version: string) {
+   // clipped trace is obvious. searchParams.set handles encoding without throwing,
+   // so measuring url.toString() is both correct and safe on any input.
+   const MAX_URL_LENGTH = 6000
+-  const marker = "\n… (truncated)"
++  const marker = `\n${chromeGlyph("…")} (truncated)`
+   const head = `The OpenCode TUI crashed with an unexpected error.\n\n**Error:** ${message}\n\n**Stack trace:**\n`
+   const setBody = (body: string) => url.searchParams.set("description", head + "```\n" + body + "\n```")
+ 
+diff --git a/packages/tui/src/component/logo.tsx b/packages/tui/src/component/logo.tsx
+index 2c3abc3cb0e8081ad654802d18e4eb93a08362a8..e9e4e3bf9567d423d68239c5157bda858ae530b4 100644
+--- a/packages/tui/src/component/logo.tsx
++++ b/packages/tui/src/component/logo.tsx
+@@ -4,10 +4,18 @@ import { useTerminalDimensions } from "@opentui/solid"
+ import { useTheme } from "../context/theme"
+ import { tint } from "../theme/color"
+ import { go, logo } from "../logo"
++import { ASCII_LOGO, asciiGlyphs } from "../ui/glyphs"
+ 
+ export function Logo() {
+   const theme = useTheme()
+   const dimensions = useTerminalDimensions()
++  const artwork = () => {
++    if (!asciiGlyphs()) return { logo, go }
++    return {
++      logo: { left: ASCII_LOGO.left, right: ASCII_LOGO.right },
++      go: { left: ASCII_LOGO.compact, right: ASCII_LOGO.compact },
++    }
++  }
+ 
+   const renderLine = (line: string, fg: RGBA, bold: boolean): JSX.Element[] => {
+     const shadow = tint(theme.background.base, fg, 0.25)
+@@ -52,24 +60,24 @@ export function Logo() {
+   return (
+     <box>
+       {dimensions().height < 12 ? null : dimensions().width < 22 ? (
+-        <For each={go.right.slice(1)}>
++        <For each={artwork().go.right.slice(1)}>
+           {(line) => <box flexDirection="row">{renderLine(line, theme.text.base, true)}</box>}
+         </For>
+       ) : dimensions().width < 44 ? (
+         <>
+-          <For each={logo.left.slice(1)}>
++          <For each={artwork().logo.left.slice(1)}>
+             {(line) => <box flexDirection="row">{renderLine(line, theme.text.muted, false)}</box>}
+           </For>
+-          <For each={logo.right}>
++          <For each={artwork().logo.right}>
+             {(line) => <box flexDirection="row">{renderLine(line, theme.text.base, true)}</box>}
+           </For>
+         </>
+       ) : (
+-        <For each={logo.left}>
++        <For each={artwork().logo.left}>
+           {(line, index) => (
+             <box flexDirection="row" gap={1}>
+               <box flexDirection="row">{renderLine(line, theme.text.muted, false)}</box>
+-              <box flexDirection="row">{renderLine(logo.right[index()], theme.text.base, true)}</box>
++              <box flexDirection="row">{renderLine(artwork().logo.right[index()] ?? "", theme.text.base, true)}</box>
+             </box>
+           )}
+         </For>
+diff --git a/packages/tui/src/component/prompt/autocomplete.tsx b/packages/tui/src/component/prompt/autocomplete.tsx
+index c669491c096edd5435ea8c976f1300282f35f334..a2b19c7ed3555c35d3b0ac2f1401760ed30eeee5 100644
+--- a/packages/tui/src/component/prompt/autocomplete.tsx
++++ b/packages/tui/src/component/prompt/autocomplete.tsx
+@@ -14,6 +14,7 @@ import { useConfig } from "../../config"
+ import { useLocation } from "../../context/location"
+ import { useTheme } from "../../context/theme"
+ import { SplitBorder } from "../../ui/border"
++import { chromeEllipsis, chromeLabel } from "../../ui/glyphs"
+ import { useTerminalDimensions } from "@opentui/solid"
+ import { Locale } from "../../util/locale"
+ import type { PromptInfo, PromptPartRef } from "../../prompt/history"
+@@ -345,7 +346,7 @@ export function Autocomplete(props: {
+             : { options: [], failed: true, mode: input.visible, query: input.query, resolved: false }
+         return {
+           options: result.map((item) => ({
+-            display: Locale.truncateMiddle(item.value, width),
++            display: Locale.truncateMiddle(item.value, width, chromeEllipsis()),
+             value: item.value,
+             isDirectory: true,
+             path: item.value,
+@@ -374,7 +375,7 @@ export function Autocomplete(props: {
+         ...result.data.map((item): AutocompleteOption => {
+           const { filename, part } = createFilePart(item, path.join(result.location.directory, item.path), lineRange)
+           return {
+-            display: Locale.truncateMiddle(filename, width),
++            display: Locale.truncateMiddle(filename, width, chromeEllipsis()),
+             value: filename,
+             isDirectory: item.type === "directory",
+             path: item.path,
+@@ -511,7 +512,7 @@ export function Autocomplete(props: {
+       const value = item.value
+       return {
+         ...item,
+-        display: Locale.truncateMiddle(item.display, width),
++        display: Locale.truncateMiddle(item.display, width, chromeEllipsis()),
+         onSelect: item.onSelect ?? (value ? () => insertDirectory(value) : undefined),
+       }
+     })
+@@ -833,11 +834,11 @@ export function Autocomplete(props: {
+     const fileSearch = visibleFiles()
+     if (store.visible === "command") return "No matching commands"
+     if (store.visible === "directory") {
+-      if (files.loading) return "Searching…"
++      if (files.loading) return chromeLabel("Searching…")
+       if (fileSearch.failed) return "Could not search directories. Keep typing to try again."
+       return "No matching directories"
+     }
+-    if (files.loading) return "Searching…"
++    if (files.loading) return chromeLabel("Searching…")
+     if (fileSearch.failed) return "Could not search files. Keep typing to try again."
+     return "No matching files, agents, or references"
+   })
+@@ -922,6 +923,7 @@ export function Autocomplete(props: {
+                   {Locale.truncateMiddle(
+                     confirmingAction() ? (destructive()?.confirm ?? "") : option().display,
+                     contentWidth(),
++                    chromeEllipsis(),
+                   )}
+                 </text>
+                 <Show when={!confirmingAction() && option().description}>
+diff --git a/packages/tui/src/component/prompt/index.tsx b/packages/tui/src/component/prompt/index.tsx
+index a9f699c08ad2c2d50da1ae8b8a47c1997dc512b8..3cce36c2390c3de084411cf822d1eb6211893f0f 100644
+--- a/packages/tui/src/component/prompt/index.tsx
++++ b/packages/tui/src/component/prompt/index.tsx
+@@ -14,6 +14,7 @@ import { useTheme, useThemes } from "../../context/theme"
+ import { tint } from "../../theme/color"
+ import { createAnimatable, tween } from "../../ui/animation"
+ import { EmptyBorder, SplitBorder } from "../../ui/border"
++import { asciiGlyphs, chromeEllipsis, chromeGlyph, chromeLabel } from "../../ui/glyphs"
+ import { useTuiPaths, useTuiTerminalEnvironment } from "../../context/runtime"
+ import { useClipboard } from "../../context/clipboard"
+ import { Spinner } from "../spinner"
+@@ -249,7 +250,7 @@ export function Prompt(props: PromptProps) {
+   const editorFileLabelDisplay = createMemo(() => {
+     const file = editorFileLabel()
+     if (!file) return
+-    return Locale.truncateMiddle(file, Math.max(12, Math.min(48, Math.floor(dimensions().width / 3))))
++    return Locale.truncateMiddle(file, Math.max(12, Math.min(48, Math.floor(dimensions().width / 3))), chromeEllipsis())
+   })
+   const editorContextLabelState = createMemo(() => editor.labelState())
+   const [auto, setAuto] = createSignal<AutocompleteRef>()
+@@ -1595,10 +1596,10 @@ export function Prompt(props: PromptProps) {
+     const value = (() => {
+       if (store.mode === "shell") {
+         if (!shell().length) return undefined
+-        return `Run a command… "${shell()[store.placeholder % shell().length]}"`
++        return `${chromeLabel("Run a command…")} "${shell()[store.placeholder % shell().length]}"`
+       }
+       if (!list().length) return undefined
+-      return `Ask anything… "${list()[store.placeholder % list().length]}"`
++      return `${chromeLabel("Ask anything…")} "${list()[store.placeholder % list().length]}"`
+     })()
+     if (!value) return undefined
+     const width = dimensions().width < 44 ? dimensions().width - 5 : Math.min(75, dimensions().width - 4) - 5
+@@ -1663,7 +1664,7 @@ export function Prompt(props: PromptProps) {
+           borderColor={borderHighlight()}
+           customBorderChars={{
+             ...SplitBorder.customBorderChars,
+-            bottomLeft: "╹",
++            bottomLeft: asciiGlyphs() ? "+" : "╹",
+           }}
+         >
+           <box
+@@ -1854,7 +1855,7 @@ export function Prompt(props: PromptProps) {
+           borderColor={borderHighlight()}
+           customBorderChars={{
+             ...EmptyBorder,
+-            vertical: promptBg().a !== 0 ? "╹" : " ",
++            vertical: promptBg().a !== 0 ? (asciiGlyphs() ? "|" : "╹") : " ",
+           }}
+         >
+           <box
+@@ -1865,7 +1866,7 @@ export function Prompt(props: PromptProps) {
+               promptBg().a !== 0
+                 ? {
+                     ...EmptyBorder,
+-                    horizontal: "▀",
++                    horizontal: asciiGlyphs() ? "-" : "▀",
+                   }
+                 : {
+                     ...EmptyBorder,
+@@ -1890,7 +1891,7 @@ export function Prompt(props: PromptProps) {
+                   <Match when={status() === "running"}>
+                     <box flexDirection="row" gap={1} flexGrow={1} justifyContent="flex-start">
+                       <box marginLeft={1}>
+-                        <Show when={config.animations ?? true} fallback={<text fg={theme.text.muted}>[⋯]</text>}>
++                        <Show when={config.animations ?? true} fallback={<text fg={theme.text.muted}>[{chromeGlyph("…")}]</text>}>
+                           <spinner color={spinnerDef().color} frames={spinnerDef().frames} interval={40} />
+                         </Show>
+                       </box>
+diff --git a/packages/tui/src/component/prompt/metadata.tsx b/packages/tui/src/component/prompt/metadata.tsx
+index 60c47397dcc7856912e2ed5cd4bdeb0a6a31692c..d9fddeb91e9a6bb6dec65711652b6ce2579e9b21 100644
+--- a/packages/tui/src/component/prompt/metadata.tsx
++++ b/packages/tui/src/component/prompt/metadata.tsx
+@@ -2,6 +2,7 @@ import { RGBA, TextAttributes } from "@opentui/core"
+ import { useTerminalDimensions } from "@opentui/solid"
+ import { createMemo, Show } from "solid-js"
+ import { useTheme } from "../../context/theme"
++import { chromeEllipsis, chromeGlyph } from "../../ui/glyphs"
+ import { Locale } from "../../util/locale"
+ import { stringWidth } from "../../util/string-width"
+ 
+@@ -48,7 +49,7 @@ export function PromptMetadataRow(props: {
+         <Show when={props.mode === "normal" && layout().model}>
+           <box flexDirection="row" gap={1} flexGrow={1} flexShrink={1} minWidth={0}>
+             <Show when={layout().agent}>
+-              <text fg={fade(theme.text.muted, props.modelAlpha)}>·</text>
++              <text fg={fade(theme.text.muted, props.modelAlpha)}>{chromeGlyph("·")}</text>
+             </Show>
+             <text
+               flexShrink={1}
+@@ -69,7 +70,7 @@ export function PromptMetadataRow(props: {
+             <Show when={layout().variant}>
+               {(variant) => (
+                 <>
+-                  <text fg={fade(theme.text.muted, props.variantAlpha)}>·</text>
++                  <text fg={fade(theme.text.muted, props.variantAlpha)}>{chromeGlyph("·")}</text>
+                   <text
+                     fg={fade(theme.text.feedback.warning.base, props.variantAlpha)}
+                     attributes={TextAttributes.BOLD}
+@@ -98,7 +99,7 @@ type Layout = {
+   variant?: string
+ }
+ 
+-function promptMetadataLayout(input: {
++export function promptMetadataLayout(input: {
+   width: number
+   terminalWidth: number
+   agent: string
+@@ -123,14 +124,16 @@ function promptMetadataLayout(input: {
+   const fit = candidates.find((candidate) => stringWidth(text(candidate)) <= input.width)
+   if (fit) return fit
+ 
+-  const prefix = agent ? `${agent} · ` : ""
+-  const suffix = input.variant ? ` · ${input.variant}` : ""
++  const separator = chromeGlyph("·")
++  const prefix = agent ? `${agent} ${separator} ` : ""
++  const suffix = input.variant ? ` ${separator} ` : ""
+   return {
+     agent,
+     model: Locale.truncateWidth(
+       input.model,
+       Math.max(9, input.width - stringWidth(prefix) - stringWidth(suffix)),
+-    ).replace(/\s+…$/, "…"),
++      chromeEllipsis(),
++    ),
+     variant: input.variant,
+   }
+ }
+@@ -139,8 +142,8 @@ function text(input: Layout) {
+   return [
+     ...(input.agent ? [input.agent] : []),
+     ...(input.auto ? ["auto"] : []),
+-    ...(input.model ? [...(input.agent ? ["·"] : []), input.model] : []),
++    ...(input.model ? [...(input.agent ? [chromeGlyph("·")] : []), input.model] : []),
+     ...(input.provider ? [input.provider] : []),
+-    ...(input.variant ? ["·", input.variant] : []),
++    ...(input.variant ? [chromeGlyph("·"), input.variant] : []),
+   ].join(" ")
+ }
+diff --git a/packages/tui/src/component/reconnecting.tsx b/packages/tui/src/component/reconnecting.tsx
+index 773eadaaeb1b5e1d0889ba032ae7e4edb4ea76ee..f612976132bba1d17585a6cbadd5c7c01e637757 100644
+--- a/packages/tui/src/component/reconnecting.tsx
++++ b/packages/tui/src/component/reconnecting.tsx
+@@ -1,6 +1,7 @@
+ import { RGBA } from "@opentui/core"
+ import { useTheme } from "../context/theme"
+ import { Spinner } from "./spinner"
++import { chromeLabel } from "../ui/glyphs"
+ 
+ export function Reconnecting(props: { managed?: boolean }) {
+   const theme = useTheme()
+@@ -28,7 +29,9 @@ export function Reconnecting(props: { managed?: boolean }) {
+         paddingRight={2}
+         gap={1}
+       >
+-        <Spinner color={theme.text.base}>{props.managed ? "Restarting service…" : "Connection lost…"}</Spinner>
++        <Spinner color={theme.text.base}>
++          {props.managed ? chromeLabel("Restarting service…") : chromeLabel("Connection lost…")}
++        </Spinner>
+         <text fg={theme.text.muted}>
+           {props.managed
+             ? "Your session will resume automatically."
+diff --git a/packages/tui/src/component/session-tabs-rail.tsx b/packages/tui/src/component/session-tabs-rail.tsx
+index 8ecaa95787e844368671800ac787ed9bd2f53852..65c0626d6a035797712d2a7bc26bb0db920634af 100644
+--- a/packages/tui/src/component/session-tabs-rail.tsx
++++ b/packages/tui/src/component/session-tabs-rail.tsx
+@@ -2,6 +2,7 @@ import { createMemo, createSignal } from "solid-js"
+ import type { RGBA } from "@opentui/core"
+ import { Keymap } from "../context/keymap"
+ import { useTheme } from "../context/theme"
++import { asciiGlyphs, chromeGlyph } from "../ui/glyphs"
+ import { tint } from "../theme/color"
+ import type { SessionTabsController } from "./session-tabs"
+ 
+@@ -48,7 +49,7 @@ export function SessionTabsRailControls(props: {
+         onMouseDragEnd={() => (pressed = false)}
+       >
+         <text width={1} height={1} fg={theme.text.action.secondary.base} selectable={false} wrapMode="none">
+-          ⌕
++          {chromeGlyph("⌕")}
+         </text>
+       </box>
+       <text
+@@ -62,7 +63,7 @@ export function SessionTabsRailControls(props: {
+         bg={hovered() && props.belowHighlighted ? hoverColor() : theme.background.raised.base}
+         selectable={false}
+       >
+-        {(hovered() ? "▀" : props.belowHighlighted ? "▄" : " ").repeat(props.width)}
++        {(asciiGlyphs() ? "-" : hovered() ? "▀" : props.belowHighlighted ? "▄" : " ").repeat(props.width)}
+       </text>
+     </box>
+   )
+@@ -88,7 +89,7 @@ export function SessionTabHalfRow(props: {
+       selectable={false}
+       wrapMode="none"
+     >
+-      {(props.edge === "top" ? "▄" : "▀").repeat(props.width)}
++      {(asciiGlyphs() ? "-" : props.edge === "top" ? "▄" : "▀").repeat(props.width)}
+     </text>
+   )
+ }
+diff --git a/packages/tui/src/component/session-tabs.tsx b/packages/tui/src/component/session-tabs.tsx
+index fdd23a43cbd4c3e318f211b7a8dc4fe2ab816fc1..540f63463e6e3120d6c7b374b4a545d2bf0b8092 100644
+--- a/packages/tui/src/component/session-tabs.tsx
++++ b/packages/tui/src/component/session-tabs.tsx
+@@ -51,6 +51,7 @@ import { DialogSessionRename } from "./dialog-session-rename"
+ import { Keymap } from "../context/keymap"
+ import { registerOpencodeSpinner } from "./register-spinner"
+ import { SPINNER_FRAMES } from "./spinner-frames"
++import { asciiGlyphs, chromeEllipsis, chromeGlyph } from "../ui/glyphs"
+ import { SessionTabsRailControls, SessionTabHalfRow } from "./session-tabs-rail"
+ import "./title-shimmer"
+ 
+@@ -58,8 +59,14 @@ registerOpencodeSpinner()
+ 
+ export const TAB_SPINNERS = {
+   dots: { frames: SPINNER_FRAMES, interval: 80 },
+-  arcs: { frames: ["◜", "◝", "◞", "◟"], interval: 120 },
+-  quadrants: { frames: ["◴", "◷", "◶", "◵"], interval: 120 },
++  arcs: {
++    frames: asciiGlyphs() ? ["/", "\\", "\\", "/"] : ["◜", "◝", "◞", "◟"],
++    interval: 120,
++  },
++  quadrants: {
++    frames: asciiGlyphs() ? ["|", "/", "-", "\\"] : ["◴", "◷", "◶", "◵"],
++    interval: 120,
++  },
+   line: { frames: ["|", "/", "-", "\\"], interval: 120 },
+ }
+ export type TabSpinner = keyof typeof TAB_SPINNERS
+@@ -71,6 +78,9 @@ export const TAB_UNREAD_MARKERS = {
+   "large-square": "■",
+ }
+ export type TabUnreadMarker = keyof typeof TAB_UNREAD_MARKERS
++export function tabUnreadMarker(marker: TabUnreadMarker = "small-dot") {
++  return chromeGlyph(TAB_UNREAD_MARKERS[marker])
++}
+ 
+ // A long title fades out over its last cells instead of cutting hard.
+ const FADE_WIDTH = 4
+@@ -170,14 +180,16 @@ function TabIndicator(props: {
+     const flash = Math.max(0, 1 - Math.abs(opacity - 0.8) / 0.2)
+     return tint(props.backgroundColor, tint(unreadColor(), props.flashColor, flash * 0.3), Math.min(1, opacity / 0.8))
+   }
+-  const spinner = () => TAB_SPINNERS[props.spinner ?? "dots"]
++  const spinner = () => {
++    return TAB_SPINNERS[props.spinner ?? "dots"]
++  }
+   const label = () => {
+     if (props.numbers) return props.label
+     if (props.status.attention === "permission") return "!"
+     if (props.status.attention === "question") return "?"
+     if (runs()) return spinner().frames[0]
+     if (props.label === "+") return "+"
+-    if (props.status.unread || fading()) return TAB_UNREAD_MARKERS[props.unreadMarker ?? "small-dot"]
++    if (props.status.unread || fading()) return tabUnreadMarker(props.unreadMarker)
+     return props.idleLabel ?? ""
+   }
+   return (
+@@ -1106,7 +1118,7 @@ function VerticalSessionTabs(props: {
+                             tabs.close(tab.sessionID)
+                           }}
+                         >
+-                          {hovered() === tab.sessionID ? "✕" : ""}
++                          {hovered() === tab.sessionID ? chromeGlyph("✕") : ""}
+                         </text>
+                       </box>
+                     </box>
+@@ -1230,7 +1242,7 @@ function VerticalSessionTabs(props: {
+                     tabs.close()
+                   }}
+                 >
+-                  {addHovered() ? "×" : ""}
++                  {addHovered() ? chromeGlyph("×") : ""}
+                 </text>
+               </Show>
+             </box>
+@@ -1262,6 +1274,7 @@ function VerticalSessionTabs(props: {
+                     items().find((tab) => tab.sessionID === sessionID())?.title ??
+                     "Untitled session",
+                   tooltipWidth() - 2,
++                  chromeEllipsis(),
+                 )}
+               </text>
+               <text fg={theme.text.muted} wrapMode="none" selectable={false}>
+@@ -1556,7 +1569,7 @@ function HorizontalSessionTabs(props: {
+     >
+       <Show when={layout().before > 0}>
+         <text width={sessionTabOverflowWidth(layout().before)} fg={theme.text.muted} selectable={false}>
+-          ‹{layout().before}
++          {chromeGlyph("‹")}{layout().before}
+         </text>
+       </Show>
+       <For each={layout().tabs}>
+@@ -1753,7 +1766,7 @@ function HorizontalSessionTabs(props: {
+                     tabs.close(tab === NEW_SESSION_TAB ? undefined : tab.sessionID)
+                   }}
+                 >
+-                  {hovered() === tab.sessionID ? "✕" : ""}
++                  {hovered() === tab.sessionID ? chromeGlyph("✕") : ""}
+                 </text>
+               </box>
+             </box>
+@@ -1762,7 +1775,7 @@ function HorizontalSessionTabs(props: {
+       </For>
+       <Show when={layout().after > 0}>
+         <text width={sessionTabOverflowWidth(layout().after)} fg={theme.text.muted} selectable={false}>
+-          {" " + layout().after}›
++          {" " + layout().after}{chromeGlyph("›")}
+         </text>
+       </Show>
+       <Show when={showPlus()}>
+diff --git a/packages/tui/src/component/spinner-frames.ts b/packages/tui/src/component/spinner-frames.ts
+index dca99b642a727b9846b0bb7b2b995cd2c7636683..3869068d90958c89ea97f8e3e4caccb6cf490db9 100644
+--- a/packages/tui/src/component/spinner-frames.ts
++++ b/packages/tui/src/component/spinner-frames.ts
+@@ -1 +1,7 @@
+-export const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"]
++import { ASCII_SPINNER_FRAMES, asciiGlyphs } from "../ui/glyphs"
++
++const UNICODE_SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"]
++export function spinnerFrames() {
++  return asciiGlyphs() ? ASCII_SPINNER_FRAMES : UNICODE_SPINNER_FRAMES
++}
++export const SPINNER_FRAMES = spinnerFrames()
+diff --git a/packages/tui/src/component/spinner.tsx b/packages/tui/src/component/spinner.tsx
+index 3207dcb6e4f4588297c24f88329e339d45df9b98..08a92ee9cfb22e8c94e61d36cedbc1a394b9c283 100644
+--- a/packages/tui/src/component/spinner.tsx
++++ b/packages/tui/src/component/spinner.tsx
+@@ -6,6 +6,7 @@ import type { RGBA } from "@opentui/core"
+ import { registerOpencodeSpinner } from "./register-spinner"
+ import { SPINNER_FRAMES } from "./spinner-frames"
+ import { ShimmerText } from "./shimmer-text"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+ export { SPINNER_FRAMES } from "./spinner-frames"
+ 
+@@ -26,7 +27,7 @@ export function Spinner(props: { children?: JSX.Element; color?: RGBA; shimmer?:
+   return (
+     <Show
+       when={config.animations ?? true}
+-      fallback={<text fg={color()}>{props.children ? <>⋯ {props.children}</> : "⋯"}</text>}
++      fallback={<text fg={color()}>{props.children ? <>{chromeGlyph("…")} {props.children}</> : chromeGlyph("…")}</text>}
+     >
+       <Show
+         when={props.shimmer}
+diff --git a/packages/tui/src/component/startup-loading.tsx b/packages/tui/src/component/startup-loading.tsx
+index 3df79782c63433021722986242d05dddd138a508..c1e437df95e8439f5fa82071e17cf8072a7d6157 100644
+--- a/packages/tui/src/component/startup-loading.tsx
++++ b/packages/tui/src/component/startup-loading.tsx
+@@ -1,11 +1,14 @@
+ import { createEffect, createMemo, createSignal, onCleanup, Show } from "solid-js"
+ import { useTheme } from "../context/theme"
+ import { Spinner } from "./spinner"
++import { chromeLabel } from "../ui/glyphs"
+ 
+ export function StartupLoading(props: { ready: () => boolean }) {
+   const theme = useTheme()
+   const [show, setShow] = createSignal(false)
+-  const text = createMemo(() => (props.ready() ? "Finishing startup…" : "Loading plugins…"))
++  const text = createMemo(() =>
++    props.ready() ? chromeLabel("Finishing startup…") : chromeLabel("Loading plugins…"),
++  )
+   let wait: NodeJS.Timeout | undefined
+   let hold: NodeJS.Timeout | undefined
+   let stamp = 0
+diff --git a/packages/tui/src/component/tab-pulse.tsx b/packages/tui/src/component/tab-pulse.tsx
+index a6072fe109bde1a8eaf72b34c32208ce26806a9d..59e891b8682c0d2d3f9b580c5b09d19e5c274be7 100644
+--- a/packages/tui/src/component/tab-pulse.tsx
++++ b/packages/tui/src/component/tab-pulse.tsx
+@@ -1,5 +1,6 @@
+ import { OptimizedBuffer, Renderable, RGBA, type RenderableOptions, type RenderContext } from "@opentui/core"
+ import { extend } from "@opentui/solid"
++import { asciiGlyphs } from "../ui/glyphs"
+ 
+ type TabPulseOptions = RenderableOptions<TabPulseRenderable> & {
+   edge?: "above" | "below"
+@@ -739,7 +740,7 @@ class TabPulseRenderable extends Renderable {
+       buffer.setCell(
+         this.screenX + index,
+         this.screenY,
+-        this._edge === "above" ? "▄" : "▀",
++        asciiGlyphs() ? "-" : this._edge === "above" ? "▄" : "▀",
+         this.renderColor,
+         this.outerRenderColor,
+       )
+diff --git a/packages/tui/src/context/keymap.tsx b/packages/tui/src/context/keymap.tsx
+index 521b3aeac86f97675ff7076c34a6ea278293db32..6d6ae30290ce6a6511b60dc3cb23523fbcdedf0e 100644
+--- a/packages/tui/src/context/keymap.tsx
++++ b/packages/tui/src/context/keymap.tsx
+@@ -25,6 +25,7 @@ import {
+ } from "solid-js"
+ import { useConfig } from "../config"
+ import { TuiKeybind } from "../config/keybind"
++import { asciiGlyphs } from "../ui/glyphs"
+ import { resolveInteractivity, useInteractivity } from "./interactivity"
+ 
+ declare module "@opentui/keymap" {
+@@ -459,10 +460,10 @@ function formatOptions(config: KeymapConfig) {
+       leader: leader ? (typeof leader === "string" ? leader : stringifyKeyStroke(leader)) : TuiKeybind.LeaderDefault,
+     },
+     keyNameAliases: {
+-      up: "↑",
+-      down: "↓",
+-      left: "←",
+-      right: "→",
++      up: asciiGlyphs() ? "up" : "↑",
++      down: asciiGlyphs() ? "down" : "↓",
++      left: asciiGlyphs() ? "left" : "←",
++      right: asciiGlyphs() ? "right" : "→",
+       pageup: "pgup",
+       pagedown: "pgdn",
+       delete: "del",
+diff --git a/packages/tui/src/context/session-tabs-model.ts b/packages/tui/src/context/session-tabs-model.ts
+index 856f9961e7fa8d7b880035f01c3c32a48551fffd..0a1356cedc938921f7dba1b985179a57b7848ca5 100644
+--- a/packages/tui/src/context/session-tabs-model.ts
++++ b/packages/tui/src/context/session-tabs-model.ts
+@@ -1,3 +1,5 @@
++import { chromeGlyph } from "../ui/glyphs"
++
+ export type SessionTab = {
+   sessionID: string
+   title?: string
+@@ -18,7 +20,7 @@ export function sessionTabDetail(
+   worktree: boolean,
+ ) {
+   const branch = worktree && current !== defaultBranch ? current : undefined
+-  return branch && project ? `${project} ⎇ ${branch}` : (branch ?? project)
++  return branch && project ? `${project} ${chromeGlyph("⎇")} ${branch}` : (branch ?? project)
+ }
+ 
+ export type SessionTabHistory = {
+diff --git a/packages/tui/src/feature-plugins/home/footer.tsx b/packages/tui/src/feature-plugins/home/footer.tsx
+index d31888c2770f27bc7143edc258f6446407f8278e..eb939a1b51ff0fb5d7d69923b13de0fe04eba971 100644
+--- a/packages/tui/src/feature-plugins/home/footer.tsx
++++ b/packages/tui/src/feature-plugins/home/footer.tsx
+@@ -1,6 +1,7 @@
+ import { Plugin } from "@opencode/plugin/tui"
+ import { createMemo, Match, Show, Switch } from "solid-js"
+ import { useTerminalDimensions } from "@opentui/solid"
++import { chromeGlyph } from "../../ui/glyphs"
+ import { usePlugin } from "../../plugin/context"
+ import { Slot } from "../../plugin/render"
+ 
+@@ -25,7 +26,7 @@ function Mcp(props: { context: Plugin.Context }) {
+         <text fg={props.context.theme.text.base}>
+           <Switch>
+             <Match when={failed()}>
+-              <span style={{ fg: props.context.theme.text.feedback.error.base }}>⊙ </span>
++              <span style={{ fg: props.context.theme.text.feedback.error.base }}>{chromeGlyph("⊙")} </span>
+               {failed()} MCP failed
+             </Match>
+             <Match when={true}>
+@@ -35,7 +36,7 @@ function Mcp(props: { context: Plugin.Context }) {
+                     count() > 0 ? props.context.theme.text.feedback.success.base : props.context.theme.text.muted,
+                 }}
+               >
+-                ⊙{" "}
++                {chromeGlyph("⊙")} {" "}
+               </span>
+               {count()} MCP
+             </Match>
+@@ -63,7 +64,7 @@ function Plugins(props: { context: Plugin.Context }) {
+     <Show when={failed()}>
+       <box gap={1} flexDirection="row" flexShrink={0} onMouseUp={() => props.context.keymap.dispatch("plugins.list")}>
+         <text fg={props.context.theme.text.base}>
+-          <span style={{ fg: props.context.theme.text.feedback.error.base }}>⊙ </span>
++          <span style={{ fg: props.context.theme.text.feedback.error.base }}>{chromeGlyph("⊙")} </span>
+           {failed()} plugin{failed() === 1 ? "" : "s"} failed
+         </text>
+         <Show when={visibility().pluginCommand}>
+diff --git a/packages/tui/src/feature-plugins/prompt/btw.tsx b/packages/tui/src/feature-plugins/prompt/btw.tsx
+index 6aca5607022df6b4a68acdda644928e70698e41d..1cc488b4eacaef463d422230f4e6469c63005fa2 100644
+--- a/packages/tui/src/feature-plugins/prompt/btw.tsx
++++ b/packages/tui/src/feature-plugins/prompt/btw.tsx
+@@ -3,6 +3,7 @@ import { TextAttributes, type ScrollBoxRenderable } from "@opentui/core"
+ import { useKeyboard, useTerminalDimensions } from "@opentui/solid"
+ import { createMemo, createSignal, Show } from "solid-js"
+ import { Spinner } from "../../component/spinner"
++import { chromeGlyph } from "../../ui/glyphs"
+ import { useConfig } from "../../config"
+ import { useClipboard } from "../../context/clipboard"
+ import { Keymap } from "../../context/keymap"
+@@ -143,7 +144,7 @@ export function Answer(props: {
+         actions: {
+           primary: [
+             copied()
+-              ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: copy }
++              ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: copy }
+               : { title: "copy response", key: "c", onTrigger: copy },
+           ],
+         },
+@@ -153,9 +154,9 @@ export function Answer(props: {
+           actions={{
+             secondary: [
+               copied()
+-                ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: copy }
++                ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: copy }
+                 : { title: "copy", key: "c", onTrigger: copy },
+-              { title: "scroll", key: "j/k ↑/↓" },
++              { title: "scroll", key: `j/k ${chromeGlyph("↑")}/${chromeGlyph("↓")}` },
+             ],
+           }}
+         />
+diff --git a/packages/tui/src/feature-plugins/prompt/footer.tsx b/packages/tui/src/feature-plugins/prompt/footer.tsx
+index f8fafdce21e086f156ead73edf1b3b88a1683b3f..b2bca2b046c74c8a7818a3b975679cb224856afc 100644
+--- a/packages/tui/src/feature-plugins/prompt/footer.tsx
++++ b/packages/tui/src/feature-plugins/prompt/footer.tsx
+@@ -5,6 +5,7 @@ import { useTerminalDimensions } from "@opentui/solid"
+ import { TextAttributes } from "@opentui/core"
+ import { useInteractivity } from "../../context/interactivity"
+ import { stringWidth } from "../../util/string-width"
++import { chromeGlyph } from "../../ui/glyphs"
+ 
+ const money = new Intl.NumberFormat("en-US", {
+   style: "currency",
+@@ -83,15 +84,15 @@ export function PromptFooter(props: {
+                       {(value) => <span style={{ fg: props.context.theme.text.base }}>{value()} </span>}
+                     </Show>
+                     <Show when={subagents()}>{(value) => <>{value()}</>}</Show>
+-                    <Show when={subagents() && shells()}> · </Show>
++                    <Show when={subagents() && shells()}> {chromeGlyph("·")} </Show>
+                     <Show when={shells()}>{(value) => <>{value()}</>}</Show>
+                   </text>
+                 </box>
+               </Show>
+               <Show when={props.showDetails && layout().usage && status().length > 0}>
+                 <text fg={props.context.theme.text.muted} wrapMode="none" flexShrink={0}>
+-                  <Show when={live()}> · </Show>
+-                  {status().join(" · ")}
++                  <Show when={live()}> {chromeGlyph("·")} </Show>
++                  {joinPromptFooterStatus(status())}
+                 </text>
+               </Show>
+             </box>
+@@ -143,11 +144,16 @@ export default Plugin.define({
+   },
+ })
+ 
+-function promptFooterLayout(input: { width: number; usage: string[]; shortcuts: string[] }) {
+-  const usage = input.usage.join(" · ")
+-  const shortcuts = input.shortcuts.join(" · ")
++export function joinPromptFooterStatus(status: string[]) {
++  return status.join(` ${chromeGlyph("·")} `)
++}
++
++export function promptFooterLayout(input: { width: number; usage: string[]; shortcuts: string[] }) {
++  const separator = ` ${chromeGlyph("·")} `
++  const usage = input.usage.join(separator)
++  const shortcuts = input.shortcuts.join(separator)
+   const available = Math.max(0, input.width - Math.min(28, Math.floor(input.width / 2)))
+-  if (usage && shortcuts && stringWidth(`${usage} · ${shortcuts}`) <= available) {
++  if (usage && shortcuts && stringWidth(`${usage}${separator}${shortcuts}`) <= available) {
+     return { usage: true, shortcuts: true }
+   }
+   if (usage && stringWidth(usage) <= available) return { usage: true, shortcuts: false }
+diff --git a/packages/tui/src/feature-plugins/sidebar/footer.tsx b/packages/tui/src/feature-plugins/sidebar/footer.tsx
+index b875d5ffe803c6b8eefa50460c55ce5c762d4629..75609b21f7c57e53851ee95a10b42592a7103635 100644
+--- a/packages/tui/src/feature-plugins/sidebar/footer.tsx
++++ b/packages/tui/src/feature-plugins/sidebar/footer.tsx
+@@ -5,6 +5,7 @@ import { FilePath } from "../../ui/file-path"
+ import { useWorkingDirectoryActions } from "../../ui/working-directory-actions"
+ import { usePromptMove } from "../../component/prompt/move"
+ import { hasConnectedProvider } from "../../util/connected-provider"
++import { chromeGlyph } from "../../ui/glyphs"
+ 
+ export function SidebarOnboarding(props: { context: Plugin.Context; sessionID: string }) {
+   const dimensions = useTerminalDimensions()
+@@ -35,7 +36,7 @@ export function SidebarOnboarding(props: { context: Plugin.Context; sessionID: s
+         gap={1}
+       >
+         <text flexShrink={0} fg={props.context.theme.text.base}>
+-          ⬖
++          {chromeGlyph("⬖")}
+         </text>
+         <box flexGrow={1} gap={1}>
+           <box flexDirection="row" justifyContent="space-between">
+@@ -51,7 +52,7 @@ export function SidebarOnboarding(props: { context: Plugin.Context; sessionID: s
+                 }).catch((error) => console.error("Failed to dismiss sidebar onboarding", error))
+               }}
+             >
+-              ✕
++              {chromeGlyph("✕")}
+             </text>
+           </box>
+           <text fg={props.context.theme.text.muted}>OpenCode includes free models so you can start immediately.</text>
+diff --git a/packages/tui/src/feature-plugins/sidebar/mcp.tsx b/packages/tui/src/feature-plugins/sidebar/mcp.tsx
+index 6018ff0ccb4334db84a00ef6c35c37c4dbfbb393..f192f9ebe118e05ecdc02879f2b3e93c1dcf54f6 100644
+--- a/packages/tui/src/feature-plugins/sidebar/mcp.tsx
++++ b/packages/tui/src/feature-plugins/sidebar/mcp.tsx
+@@ -1,6 +1,7 @@
+ import { Plugin } from "@opencode/plugin/tui"
+ import { createMemo, For, Match, Show, Switch } from "solid-js"
+ import { DialogMcp } from "../../component/dialog-mcp"
++import { chromeGlyph } from "../../ui/glyphs"
+ 
+ export function SidebarMcp(props: { context: Plugin.Context; sessionID: string }) {
+   const [view, updateView] = props.context.storage.store("view", { initial: { open: true } })
+@@ -34,7 +35,7 @@ export function SidebarMcp(props: { context: Plugin.Context; sessionID: string }
+           }}
+         >
+           <Show when={list().length > 2}>
+-            <text fg={theme.text.base}>{view.open ? "▼" : "▶"}</text>
++            <text fg={theme.text.base}>{view.open ? chromeGlyph("▼") : chromeGlyph("▶")}</text>
+           </Show>
+           <text fg={theme.text.base}>
+             <b>MCP</b>
+@@ -65,7 +66,7 @@ export function SidebarMcp(props: { context: Plugin.Context; sessionID: string }
+                     fg: dot(item.status.status),
+                   }}
+                 >
+-                  •
++                  {chromeGlyph("•")}
+                 </text>
+                 <text fg={theme.text.base} wrapMode="none" truncate flexGrow={1} flexShrink={1} minWidth={0}>
+                   <b>{item.name}</b>
+diff --git a/packages/tui/src/feature-plugins/system/diff-viewer-file-tree.tsx b/packages/tui/src/feature-plugins/system/diff-viewer-file-tree.tsx
+index 4a2c4dc06bc5be04057a97d152c2f07e2834f38c..7d0a7d4df510cf5001f4dca6b6a03e2f11241251 100644
+--- a/packages/tui/src/feature-plugins/system/diff-viewer-file-tree.tsx
++++ b/packages/tui/src/feature-plugins/system/diff-viewer-file-tree.tsx
+@@ -3,6 +3,7 @@ import { MouseButton, TextAttributes, type MouseEvent, type ScrollBoxRenderable
+ import { truncateFilePath } from "../../ui/file-path"
+ import { stringWidth } from "../../util/string-width"
+ import { useTheme } from "../../context/theme"
++import { chromeGlyph, chromeEllipsis } from "../../ui/glyphs"
+ import { tint } from "../../theme/color"
+ import { createEffect, createMemo, createSignal, For, Match, Show, Switch, type JSX } from "solid-js"
+ import { buildFileTree, flattenFileTree, type FileTreeItem, type FileTreeRow } from "./diff-viewer-file-tree-utils"
+@@ -97,7 +98,7 @@ export function DiffViewerFileTree(props: DiffViewerFileTreeProps) {
+             </text>
+             <Show when={props.sourceDetail}>
+               <text fg={theme.text.muted} selectable={false} flexGrow={1} minWidth={0} wrapMode="none" truncate>
+-                {` · ${props.sourceDetail}`}
++                {` ${chromeGlyph("·")} ${props.sourceDetail}`}
+               </text>
+             </Show>
+           </box>
+@@ -141,13 +142,15 @@ export function DiffViewerFileTree(props: DiffViewerFileTreeProps) {
+                       return theme.background.raised.base
+                     }
+                     const marker = () => {
+-                      if (row.kind !== "directory") return "≡ "
+-                      return props.expandedNodes && !props.expandedNodes.has(row.id) ? "▸ " : "▾ "
++                      if (row.kind !== "directory") return `${chromeGlyph("≡")} `
++                      return props.expandedNodes && !props.expandedNodes.has(row.id)
++                        ? `${chromeGlyph("▸")} `
++                        : `${chromeGlyph("▾")} `
+                     }
+                     // Rails run straight down from each ancestor folder; no end hooks.
+                     const indent = createMemo(() => {
+                       if (list()) return ""
+-                      return "│ ".repeat(Math.max(0, Math.min(row.depth, Math.floor((contentWidth() - 3) / 2))))
++                      return `${chromeGlyph("│")} `.repeat(Math.max(0, Math.min(row.depth, Math.floor((contentWidth() - 3) / 2))))
+                     })
+                     const status = () => fileTreeRowStatus(row, props.files, reviewed())
+                     const statusColor = () => {
+@@ -249,7 +252,7 @@ function scrollFileTreeRowIntoView(scroll: ScrollBoxRenderable | undefined, top:
+ 
+ function fileTreeRowStatus(row: FileTreeRow, files: readonly FileTreeItem[], reviewed: boolean) {
+   if (row.fileIndex === undefined) return ""
+-  if (reviewed) return "✓"
++  if (reviewed) return chromeGlyph("✓")
+   const status = files[row.fileIndex]?.status
+   return status === "modified" ? "M" : status === "added" ? "A" : status === "deleted" ? "D" : "?"
+ }
+@@ -259,7 +262,7 @@ function fileTreeRowStatus(row: FileTreeRow, files: readonly FileTreeItem[], rev
+ function truncateDirectoryChain(name: string, maxWidth: number) {
+   if (stringWidth(name) <= maxWidth) return name
+   const kept: string[] = []
+-  let width = stringWidth("…/")
++  let width = stringWidth(chromeEllipsis() + "/")
+   for (const segment of name.split("/").toReversed()) {
+     const next = stringWidth(segment) + (kept.length ? 1 : 0)
+     if (width + next > maxWidth) break
+@@ -267,5 +270,5 @@ function truncateDirectoryChain(name: string, maxWidth: number) {
+     width += next
+   }
+   if (kept.length === 0) return truncateFilePath(name, maxWidth)
+-  return `…/${kept.join("/")}`
++  return `${chromeEllipsis()}/${kept.join("/")}`
+ }
+diff --git a/packages/tui/src/feature-plugins/system/diff-viewer-image.tsx b/packages/tui/src/feature-plugins/system/diff-viewer-image.tsx
+index cb7f0801790b0c5c3bd6ac4900bddaa84056df03..7dc0b46ff826b7c522c01c6e90e04eb52f50ce80 100644
+--- a/packages/tui/src/feature-plugins/system/diff-viewer-image.tsx
++++ b/packages/tui/src/feature-plugins/system/diff-viewer-image.tsx
+@@ -5,6 +5,7 @@ import { createResource, createSignal, Match, onCleanup, Show, Switch } from "so
+ import { DialogImagePreview } from "../../component/dialog-image-preview"
+ import { useTheme } from "../../context/theme"
+ import { useDialog } from "../../ui/dialog"
++import { chromeLabel } from "../../ui/glyphs"
+ 
+ export function isDiffImageFile(file: string) {
+   return /\.(png|jpe?g|webp|gif)$/i.test(file)
+@@ -37,7 +38,7 @@ export function DiffViewerImage(props: {
+             <text fg={theme.text.feedback.error.base}>Could not load image</text>
+           </Match>
+           <Match when={image.loading}>
+-            <text fg={theme.text.muted}>Loading image…</text>
++            <text fg={theme.text.muted}>{chromeLabel("Loading image…")}</text>
+           </Match>
+           <Match when={!image.error && image()} keyed>
+             {(bytes) => {
+diff --git a/packages/tui/src/feature-plugins/system/diff-viewer.tsx b/packages/tui/src/feature-plugins/system/diff-viewer.tsx
+index 0e333fffcca30f73aeb2781cf7102236d93125c5..18fa75543bff1ceca79b639eb49849b1cf2eadda 100644
+--- a/packages/tui/src/feature-plugins/system/diff-viewer.tsx
++++ b/packages/tui/src/feature-plugins/system/diff-viewer.tsx
+@@ -20,6 +20,7 @@ import { DiffViewerImage, isDiffImageFile } from "./diff-viewer-image"
+ import { DIALOG_LIST_INSET, DialogHeader, DialogLayout } from "../../ui/dialog"
+ import { DialogSelect } from "../../ui/dialog-select"
+ import { EmptyBorder } from "../../ui/border"
++import { asciiGlyphs, chromeGlyph, chromeLabel } from "../../ui/glyphs"
+ import { SESSION_PANEL_SPLIT_MIN_WIDTH } from "../../ui/layout"
+ import { FilePath } from "../../ui/file-path"
+ import { getScrollAcceleration } from "../../util/scroll"
+@@ -185,7 +186,7 @@ function DiffViewer(props: {
+     if (mode() === "turn") return diff.error ? "Diff unavailable" : undefined
+     if (mode() === "working") return "vs HEAD"
+     if (diff.error) return "Base or diff unavailable"
+-    if (!result()) return "Resolving diff…"
++    if (!result()) return chromeLabel("Resolving diff…")
+     const base = result()?.base
+     if (!base) return "Base not reported"
+     return `vs ${base.name}`
+@@ -271,7 +272,7 @@ function DiffBaseDialog(props: {
+     <box paddingLeft={DIALOG_LIST_INSET} paddingRight={DIALOG_LIST_INSET}>
+       <text fg={branches.error ? theme.text.feedback.error.base : theme.text.muted}>
+         {branches.loading
+-          ? "Loading branches…"
++          ? chromeLabel("Loading branches…")
+           : branches.error
+             ? "Could not load branches. Reopen the picker to try again."
+             : "No branches found"}
+@@ -804,7 +805,7 @@ export function DiffViewerContent(props: {
+                   title: "Base",
+                   titleView: "Base".padEnd(11),
+                   value: "base" as const,
+-                  description: props.sourceBase?.name ?? "Choose…",
++      description: props.sourceBase?.name ?? chromeLabel("Choose…"),
+                   onSelect: props.onChooseBase,
+                 },
+               ]
+@@ -892,7 +893,7 @@ export function DiffViewerContent(props: {
+             </text>
+             <Show when={props.sourceDetail}>
+               <text fg={theme.text.muted} selectable={false} flexGrow={1} minWidth={0} wrapMode="none" truncate>
+-                {` · ${props.sourceDetail}`}
++                {` ${chromeGlyph("·")} ${props.sourceDetail}`}
+               </text>
+             </Show>
+           </box>
+@@ -905,7 +906,7 @@ export function DiffViewerContent(props: {
+         <Switch>
+           <Match when={props.loading}>
+             <box flexGrow={1} padding={2} paddingTop={compact() ? 1 : 2}>
+-              <text fg={theme.text.muted}>Loading diff…</text>
++              <text fg={theme.text.muted}>{chromeLabel("Loading diff…")}</text>
+             </box>
+           </Match>
+           <Match when={!props.loading && props.error}>
+@@ -997,7 +998,7 @@ export function DiffViewerContent(props: {
+                       return (
+                         <box ref={(element: BoxRenderable) => registerPatchNode(entry.fileIndex, element)}>
+                           <Show when={index() > 0}>
+-                            <CardGap glyph="▄" card={background()} surface={surface()} inset={inset()} />
++                            <CardGap edge="top" glyph={asciiGlyphs() ? "-" : "▄"} card={background()} surface={surface()} inset={inset()} />
+                           </Show>
+                           <box backgroundColor={background()} marginLeft={inset()} marginRight={inset()}>
+                             <box
+@@ -1038,7 +1039,7 @@ export function DiffViewerContent(props: {
+                               </box>
+                               <Show when={reviewed()}>
+                                 <text fg={theme.text.muted} flexShrink={0}>
+-                                  ✓
++                                  {chromeGlyph("✓")}
+                                 </text>
+                               </Show>
+                               <Show when={!image()} fallback={<text fg={theme.text.muted}>Image</text>}>
+@@ -1051,7 +1052,7 @@ export function DiffViewerContent(props: {
+                               </Show>
+                               <Show when={reviewed()}>
+                                 <box position="absolute" left={-inset()} right={-inset()} bottom={0} height={1}>
+-                                  <CardGap glyph="▀" card={background()} surface={surface()} inset={inset()} />
++                                  <CardGap edge="bottom" glyph={asciiGlyphs() ? "-" : "▀"} card={background()} surface={surface()} inset={inset()} />
+                                 </box>
+                               </Show>
+                             </box>
+@@ -1138,7 +1139,7 @@ export function DiffViewerContent(props: {
+               border={["bottom"]}
+               borderColor={surface()}
+               backgroundColor={theme.background.base}
+-              customBorderChars={{ ...EmptyBorder, horizontal: "▀" }}
++              customBorderChars={{ ...EmptyBorder, horizontal: asciiGlyphs() ? "-" : "▀" }}
+             />
+           </Show>
+           <box height={1} flexShrink={0} flexDirection="row" paddingLeft={2} paddingRight={1}>
+@@ -1190,17 +1191,17 @@ export function DiffViewerContent(props: {
+ }
+ 
+ /** A half-row of base background between cards: the card's color over its width, the pane surface in the insets. */
+-function CardGap(props: { glyph: "▄" | "▀"; card: RGBA; surface: RGBA; inset: number }) {
++function CardGap(props: { edge: "top" | "bottom"; glyph: string; card: RGBA; surface: RGBA; inset: number }) {
+   const theme = useTheme()
+   const half = (color: RGBA, width?: number) => (
+     <box
+       height={1}
+       flexShrink={0}
+       {...(width === undefined ? { flexGrow: 1 } : { width })}
+-      border={[props.glyph === "▄" ? "top" : "bottom"]}
++      border={[props.edge]}
+       borderColor={color}
+       backgroundColor={theme.background.base}
+-      customBorderChars={{ ...EmptyBorder, horizontal: props.glyph }}
++      customBorderChars={{ ...EmptyBorder, horizontal: asciiGlyphs() ? "-" : props.glyph }}
+     />
+   )
+   return (
+diff --git a/packages/tui/src/feature-plugins/system/stats.tsx b/packages/tui/src/feature-plugins/system/stats.tsx
+index 950d322422dc6bc14ee66ef8b6483f2d0c57319b..ec6fb8625c6b8db28e3ae00dd7c72224f107688d 100644
+--- a/packages/tui/src/feature-plugins/system/stats.tsx
++++ b/packages/tui/src/feature-plugins/system/stats.tsx
+@@ -6,6 +6,7 @@ import { useTerminalDimensions } from "@opentui/solid"
+ import { createMemo, createResource, createSignal, For, Show } from "solid-js"
+ import { Logo } from "../../component/logo"
+ import { useTheme } from "../../context/theme"
++import { chromeLabel } from "../../ui/glyphs"
+ import { tint } from "../../theme/color"
+ import { statsMetrics, statsNumber } from "./stats-data"
+ 
+@@ -170,7 +171,7 @@ function StatsPage(props: { context: Plugin.Context; onClose: () => void }) {
+             <text fg={theme.text.feedback.error.base}>Could not load stats. Reopen /stats to try again.</text>
+           }
+         >
+-          <Show when={result()} fallback={<text fg={theme.text.muted}>Gathering your stats…</text>}>
++          <Show when={result()} fallback={<text fg={theme.text.muted}>{chromeLabel("Gathering your stats…")}</text>}>
+             {(value) => <StatsPoster stats={value()} />}
+           </Show>
+         </Show>
+diff --git a/packages/tui/src/feature-plugins/system/storybook/footer.tsx b/packages/tui/src/feature-plugins/system/storybook/footer.tsx
+index 8b1fe2a51959f523f35cae10d223bfb55245934f..bead551cb82db977f41271877c51835bb0d524ea 100644
+--- a/packages/tui/src/feature-plugins/system/storybook/footer.tsx
++++ b/packages/tui/src/feature-plugins/system/storybook/footer.tsx
+@@ -1,5 +1,6 @@
+ import type { Plugin } from "@opencode/plugin/tui"
+ import { For, Show } from "solid-js"
++import { chromeGlyph } from "../../../ui/glyphs"
+ 
+ export type StoryFooterControl = {
+   shortcut: string
+@@ -21,7 +22,7 @@ export function StoryFooter(props: {
+       <box height={1} paddingLeft={1} paddingRight={1} flexDirection="row">
+         <text fg={theme.text.base}>{props.title}</text>
+         <Show when={props.details?.length}>
+-          <text fg={theme.text.muted}> · {props.details?.join(" · ")}</text>
++          <text fg={theme.text.muted}> {chromeGlyph("·")} {props.details?.join(` ${chromeGlyph("·")} `)}</text>
+         </Show>
+       </box>
+       <Show when={props.status || props.message}>
+@@ -29,7 +30,7 @@ export function StoryFooter(props: {
+           <text fg={theme.text.base} wrapMode="none">
+             {props.status ?? ""}
+             <span style={{ fg: theme.text.muted }}>
+-              {props.status && props.message ? " · " : ""}
++              {props.status && props.message ? ` ${chromeGlyph("·")} ` : ""}
+               {props.message ?? ""}
+             </span>
+           </text>
+diff --git a/packages/tui/src/feature-plugins/system/storybook/index.tsx b/packages/tui/src/feature-plugins/system/storybook/index.tsx
+index f69e3da68b8b14905443d7e77539d7db013e5599..aab75d8fc8242619d758ee95393af04e0aefdf0d 100644
+--- a/packages/tui/src/feature-plugins/system/storybook/index.tsx
++++ b/packages/tui/src/feature-plugins/system/storybook/index.tsx
+@@ -8,6 +8,7 @@ import { sessionLocationMissingStory } from "./session-location-missing"
+ import { oneCellSpinnerStory } from "./one-cell-spinner"
+ import { linkClicksStory } from "./link-clicks"
+ import { highlightsStory } from "./highlights"
++import { chromeGlyph } from "../../../ui/glyphs"
+ 
+ /**
+  * A story is a full-screen, fixture-driven simulation of a real production component. Stories own
+@@ -115,7 +116,7 @@ function StorybookIndex(props: { context: Plugin.Context }) {
+         <For each={stories}>
+           {(story, index) => (
+             <text fg={index() === selected() ? theme.text.base : theme.text.muted}>
+-              {index() === selected() ? "› " : "  "}
++              {index() === selected() ? `${chromeGlyph("›")} ` : "  "}
+               {index() + 1} {story.title}
+             </text>
+           )}
+@@ -126,7 +127,7 @@ function StorybookIndex(props: { context: Plugin.Context }) {
+         context={props.context}
+         title="storybook"
+         controls={[
+-          { shortcut: "↑/↓", label: "select" },
++          { shortcut: `${chromeGlyph("↑")}/${chromeGlyph("↓")}`, label: "select" },
+           { shortcut: "enter", label: "open" },
+           { shortcut: "esc", label: "home" },
+         ]}
+diff --git a/packages/tui/src/feature-plugins/system/storybook/merman-layouts.tsx b/packages/tui/src/feature-plugins/system/storybook/merman-layouts.tsx
+index 19c6ed906b936220047063ff1598b8d9e8d04717..d7348f8e3b10f387480eb10283fe71bec8b65765 100644
+--- a/packages/tui/src/feature-plugins/system/storybook/merman-layouts.tsx
++++ b/packages/tui/src/feature-plugins/system/storybook/merman-layouts.tsx
+@@ -5,6 +5,7 @@ import { useTheme, useThemes } from "../../../context/theme"
+ import { usePlugin } from "../../../plugin/context"
+ import type { Story } from "./index"
+ import { StoryFooter } from "./footer"
++import { chromeGlyph } from "../../../ui/glyphs"
+ 
+ const fixtures = [
+   {
+@@ -185,7 +186,7 @@ function MermanLayoutsStory(props: { context: Plugin.Context }) {
+         title="storybook / Mermaid layouts"
+         details={[`${selected() + 1}/${fixtures.length}`, fixture().id, `${dimensions().width}x${dimensions().height}`]}
+         controls={[
+-          { shortcut: "j/k or ←/→", label: "fixture" },
++          { shortcut: `j/k or ${chromeGlyph("←")}/${chromeGlyph("→")}`, label: "fixture" },
+           { shortcut: "r", label: "reset" },
+           { shortcut: "esc", label: "back" },
+         ]}
+diff --git a/packages/tui/src/feature-plugins/system/storybook/session-location-missing.tsx b/packages/tui/src/feature-plugins/system/storybook/session-location-missing.tsx
+index c62d07b95414c2d9cb0b2ecf60e20c939081cf12..fd17fd9a0e5e8c280c441d79f27fe2cd7d9b7e81 100644
+--- a/packages/tui/src/feature-plugins/system/storybook/session-location-missing.tsx
++++ b/packages/tui/src/feature-plugins/system/storybook/session-location-missing.tsx
+@@ -6,6 +6,7 @@ import { DialogWorkspaces } from "../../../component/dialog-workspaces"
+ import { SessionLocationUnavailable } from "../../../routes/session/location-missing"
+ import type { Story } from "./index"
+ import { StoryFooter } from "./footer"
++import { chromeGlyph } from "../../../ui/glyphs"
+ 
+ const directory = "/Users/kit/code/open-source/opencode-workerd-profile"
+ 
+@@ -50,12 +51,12 @@ function SessionLocationMissingStory(props: { context: Plugin.Context }) {
+         <text fg={theme.text.base} attributes={TextAttributes.BOLD}>
+           Workerd Modal workspace driver
+         </text>
+-        <text fg={theme.text.muted}>build · GPT-5.6 Sol (high)</text>
++        <text fg={theme.text.muted}>build {chromeGlyph("·")} GPT-5.6 Sol (high)</text>
+         <box height={1} />
+         <text fg={theme.text.base}>You</text>
+         <text fg={theme.text.muted}>Test the mounted workspace and verify the deployment.</text>
+         <box height={1} />
+-        <text fg={theme.text.base}>Build · GPT-5.6 Sol (high)</text>
++        <text fg={theme.text.base}>Build {chromeGlyph("·")} GPT-5.6 Sol (high)</text>
+         <text fg={theme.text.muted}>The deployment is verified and the worktree is clean.</text>
+         <box flexGrow={1} />
+         <SessionLocationUnavailable directory={directory} onMove={open} />
+diff --git a/packages/tui/src/feature-plugins/system/storybook/session-tabs.tsx b/packages/tui/src/feature-plugins/system/storybook/session-tabs.tsx
+index 81a854320c883fdcdf2dcb46c0920cc63e4517bf..69321995d903d39133e782c042ad6b9354e6fe43 100644
+--- a/packages/tui/src/feature-plugins/system/storybook/session-tabs.tsx
++++ b/packages/tui/src/feature-plugins/system/storybook/session-tabs.tsx
+@@ -13,6 +13,7 @@ import {
+ } from "../../../component/session-tabs"
+ import { closeSessionTab, cycleSessionTab, moveSessionTab } from "../../../context/session-tabs-model"
+ import { StoryFooter } from "./footer"
++import { chromeGlyph, chromeLabel } from "../../../ui/glyphs"
+ import { DialogPrompt } from "../../../ui/dialog-prompt"
+ import { useDialog } from "../../../ui/dialog"
+ import { DialogSelect } from "../../../ui/dialog-select"
+@@ -276,26 +277,26 @@ function SessionTabsStory(props: { context: Plugin.Context }) {
+       return lines
+     }
+     lines.push(
+-      { text: "● Taking a look — reading the relevant code first.", color: theme.text.base },
++      { text: `${chromeGlyph("●")} Taking a look — reading the relevant code first.`, color: theme.text.base },
+       { text: "", color: theme.text.base },
+-      { text: `  ✱ Read ${file}`, color: theme.text.muted },
+-      { text: `  ✱ Edit ${file}`, color: theme.text.muted },
+-      { text: `  ✱ Bash bun run test`, color: theme.text.muted },
++      { text: `  ${chromeGlyph("✱")} Read ${file}`, color: theme.text.muted },
++      { text: `  ${chromeGlyph("✱")} Edit ${file}`, color: theme.text.muted },
++      { text: `  ${chromeGlyph("✱")} Bash bun run test`, color: theme.text.muted },
+       { text: "", color: theme.text.base },
+     )
+     if (status.attention === "question")
+       lines.push({ text: "? Which approach should I take?", color: theme.hue.accent[200] })
+     else if (status.attention === "permission")
+       lines.push({ text: "! Waiting for permission to run the command", color: theme.hue.accent[200] })
+-    else if (status.busy) lines.push({ text: "● Working…", color: theme.hue.interactive[200] })
++    else if (status.busy) lines.push({ text: `${chromeGlyph("●")} ${chromeLabel("Working…")}`, color: theme.hue.interactive[200] })
+     else if (outcome === "failed")
+       lines.push({
+-        text: `✗ bun run test failed — 3 tests failing in ${file}`,
++        text: `${chromeGlyph("✗")} bun run test failed — 3 tests failing in ${file}`,
+         color: theme.text.feedback.error.base,
+       })
+     else
+       lines.push({
+-        text: `✓ Done — updated ${file} and the tests pass.`,
++        text: `${chromeGlyph("✓")} Done — updated ${file} and the tests pass.`,
+         color: theme.text.feedback.success.base,
+       })
+     return lines
+@@ -307,7 +308,7 @@ function SessionTabsStory(props: { context: Plugin.Context }) {
+     const waiting = values.filter((status) => status.attention).length
+     const unread = values.filter((status) => status.unread !== undefined).length
+     return [`selected ${number(active() ?? "")}`, `${running} running`, `${waiting} waiting`, `${unread} unread`].join(
+-      "  ·  ",
++      `  ${chromeGlyph("·")}  `,
+     )
+   }
+ 
+@@ -529,7 +530,7 @@ function SessionTabsStory(props: { context: Plugin.Context }) {
+         context={props.context}
+         title="storybook / tabs"
+         details={[
+-          vertical() ? `${railCompact() ? "compact rail" : "expanded rail"} · ${resize.size()} cols` : "top strip",
++          vertical() ? `${railCompact() ? "compact rail" : "expanded rail"} ${chromeGlyph("·")} ${resize.size()} cols` : "top strip",
+           spinner(),
+           indicators(),
+           `${TAB_UNREAD_MARKERS[marker()]} ${marker()}`,
+@@ -552,7 +553,7 @@ function SessionTabsStory(props: { context: Plugin.Context }) {
+           { shortcut: "g", label: "status/numbers" },
+           { shortcut: "u", label: "unread marker" },
+           { shortcut: "m", label: "motion" },
+-          { shortcut: "↑/↓", label: "select" },
++          { shortcut: `${chromeGlyph("↑")}/${chromeGlyph("↓")}`, label: "select" },
+           { shortcut: "o", label: "layout" },
+           { shortcut: "drag edge", label: "resize / double-click reset" },
+           { shortcut: "r", label: "reset idle" },
+diff --git a/packages/tui/src/routes/session/activity-summary.ts b/packages/tui/src/routes/session/activity-summary.ts
+index 6578f50d632ae57f4c15069dac23131664d95691..a9676c9031424d80969ee45d0b5b09a812e487a1 100644
+--- a/packages/tui/src/routes/session/activity-summary.ts
++++ b/packages/tui/src/routes/session/activity-summary.ts
+@@ -9,6 +9,7 @@ import { visitEntries } from "./anchor-view"
+ import { instructionPaths, type PartRef, type SessionEntry, type SessionNode } from "./grouping/session"
+ import { reasoningContent } from "./message-parts"
+ import { resolvePart } from "./rows"
++import { chromeEllipsis, chromeLabel } from "../../ui/glyphs"
+ 
+ type Item = {
+   message: SessionMessageAssistant
+@@ -45,10 +46,12 @@ export function summarizeActivity(
+ 
+ /** Status for a running item, independent of its details, so it doesn't flicker as they arrive. */
+ export function busyLabel(part: Item["part"]) {
+-  if (part.type === "reasoning") return "Thinking…"
++  if (part.type === "reasoning") return chromeLabel("Thinking…")
+   const name = canonicalToolName(part.name)
+   const noun = name === "shell" ? "command" : name === "execute" ? "code" : name
+-  return `${part.state.status === "streaming" ? "Preparing" : "Running"} ${noun}…`
++  const verb = part.state.status === "streaming" ? "Preparing" : "Running"
++  if (noun === "command" || noun === "code") return `${verb} ${noun}${chromeEllipsis()}`
++  return `${verb} ${noun}${chromeEllipsis()}`
+ }
+ 
+ /**
+diff --git a/packages/tui/src/routes/session/composer/index.tsx b/packages/tui/src/routes/session/composer/index.tsx
+index 2af8bfb521a6327967c1c57c1fdb13842518fa71..4427c90c996b0ce00b2120707c52202f71eb02db 100644
+--- a/packages/tui/src/routes/session/composer/index.tsx
++++ b/packages/tui/src/routes/session/composer/index.tsx
+@@ -3,6 +3,7 @@ import { createStore } from "solid-js/store"
+ import { TextAttributes } from "@opentui/core"
+ import { useTheme } from "../../../context/theme"
+ import { SplitBorder } from "../../../ui/border"
++import { chromeGlyph } from "../../../ui/glyphs"
+ import { Keymap } from "../../../context/keymap"
+ import { SubagentsTab } from "./subagents-tab"
+ import { ShellTab } from "./shell-tab"
+@@ -145,7 +146,7 @@ export function Composer(props: ComposerProps) {
+                   <span style={{ fg: theme.text.base }}>
+                     <b>tabs</b>{" "}
+                   </span>
+-                  <span style={{ fg: theme.text.muted }}>←/→</span>
++                  <span style={{ fg: theme.text.muted }}>{`${chromeGlyph("←")}/${chromeGlyph("→")}`}</span>
+                 </text>
+               </Show>
+             </box>
+diff --git a/packages/tui/src/routes/session/dialog-execute.tsx b/packages/tui/src/routes/session/dialog-execute.tsx
+index 86f9c8f1c52161f1135debb74cc2dc96e81c23e8..b8d17400714805aa8c9607a34fe6582e379242a5 100644
+--- a/packages/tui/src/routes/session/dialog-execute.tsx
++++ b/packages/tui/src/routes/session/dialog-execute.tsx
+@@ -17,6 +17,7 @@ import {
+   dialogWidth,
+   useDialog,
+ } from "../../ui/dialog"
++import { chromeGlyph, chromeLabel } from "../../ui/glyphs"
+ import { useToast } from "../../ui/toast"
+ import { Locale } from "../../util/locale"
+ import { getScrollAcceleration } from "../../util/scroll"
+@@ -67,10 +68,10 @@ export function DialogExecute(props: { part: SessionMessageAssistantTool }) {
+   })
+   const status = createMemo(() => {
+     const state = props.part.state
+-    if (state.status === "streaming") return "Receiving code…"
++    if (state.status === "streaming") return chromeLabel("Receiving code…")
+     if (state.status === "running") return "Running"
+     const duration = props.part.time.completed
+-      ? ` · ${Locale.duration(props.part.time.completed - (props.part.time.ran ?? props.part.time.created))}`
++      ? ` ${chromeGlyph("·")} ${Locale.duration(props.part.time.completed - (props.part.time.ran ?? props.part.time.created))}`
+       : ""
+     if (failed()) return `Failed${duration}`
+     return `Completed${duration}`
+@@ -101,10 +102,10 @@ export function DialogExecute(props: { part: SessionMessageAssistantTool }) {
+ 
+   const copyActions = () => [
+     copied() === "code"
+-      ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: () => copy("code") }
++      ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: () => copy("code") }
+       : { title: "copy code", key: "c", onTrigger: () => copy("code") },
+     copied() === "output"
+-      ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: () => copy("output") }
++      ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: () => copy("output") }
+       : { title: "copy output", key: "o", onTrigger: () => copy("output") },
+   ]
+ 
+@@ -127,7 +128,7 @@ export function DialogExecute(props: { part: SessionMessageAssistantTool }) {
+         <DialogFooter
+           actions={{
+             secondary: [
+-              { title: "scroll", key: "↑/↓" },
++              { title: "scroll", key: `${chromeGlyph("↑")}/${chromeGlyph("↓")}` },
+               ...copyActions(),
+               { title: "back", key: "esc", onTrigger: () => dialog.clear() },
+             ],
+@@ -150,7 +151,7 @@ export function DialogExecute(props: { part: SessionMessageAssistantTool }) {
+               <text fg={contentTheme.text.muted} attributes={TextAttributes.BOLD}>
+                 Code
+               </text>
+-              <Show when={code()} fallback={<text fg={contentTheme.text.muted}>Waiting for code…</text>}>
++              <Show when={code()} fallback={<text fg={contentTheme.text.muted}>{chromeLabel("Waiting for code…")}</text>}>
+                 {(value) => <GutteredCode content={value()} filetype="typescript" digits={digits()} />}
+               </Show>
+             </box>
+@@ -171,7 +172,7 @@ export function DialogExecute(props: { part: SessionMessageAssistantTool }) {
+                     }
+                     wrapMode="word"
+                   >
+-                    {text() ?? (props.part.state.status === "completed" ? "No output" : "Waiting for output…")}
++                    {text() ?? (props.part.state.status === "completed" ? "No output" : chromeLabel("Waiting for output…"))}
+                   </text>
+                 }
+               >
+diff --git a/packages/tui/src/routes/session/dialog-fork.tsx b/packages/tui/src/routes/session/dialog-fork.tsx
+index 2ba1a27fe144989498a33a5f113d4a9e41c0f25f..df2666114f13caa68e5c34a9b3c891d94b277fb7 100644
+--- a/packages/tui/src/routes/session/dialog-fork.tsx
++++ b/packages/tui/src/routes/session/dialog-fork.tsx
+@@ -3,6 +3,7 @@ import { useData } from "../../context/data"
+ import { useRoute } from "../../context/route"
+ import { useClient } from "../../context/client"
+ import { Spinner } from "../../component/spinner"
++import { chromeLabel } from "../../ui/glyphs"
+ import { DialogSelect, type DialogSelectOption } from "../../ui/dialog-select"
+ import { DIALOG_LIST_INSET, DialogHeader, DialogLayout, useDialog } from "../../ui/dialog"
+ import { useToast } from "../../ui/toast"
+@@ -75,7 +76,7 @@ export function DialogFork(props: { sessionID: string; messageID?: string; onMov
+       when={!pending()}
+       fallback={
+         <DialogLayout inset={DIALOG_LIST_INSET} header={<DialogHeader title="Fork session" />}>
+-          <Spinner>Forking session…</Spinner>
++          <Spinner>{chromeLabel("Forking session…")}</Spinner>
+         </DialogLayout>
+       }
+     >
+diff --git a/packages/tui/src/routes/session/form.tsx b/packages/tui/src/routes/session/form.tsx
+index cba007198f026230d5c2051379fa7a9056c6aa52..220b491c7eb10a6407f127f6b9afae4e14a01716 100644
+--- a/packages/tui/src/routes/session/form.tsx
++++ b/packages/tui/src/routes/session/form.tsx
+@@ -15,6 +15,7 @@ import type { FormAnswer, FormField, FormValue } from "@opencode/client"
+ import { useData, type FormWithLocation } from "../../context/data"
+ import { useClipboard } from "../../context/clipboard"
+ import { SplitBorder } from "../../ui/border"
++import { chromeGlyph, chromeEllipsis } from "../../ui/glyphs"
+ import { useToast } from "../../ui/toast"
+ import { Keymap } from "../../context/keymap"
+ import { useInteractivity } from "../../context/interactivity"
+@@ -38,7 +39,7 @@ import type { FormAnswerField } from "../../util/form"
+ export const FORM_MODE = "form"
+ 
+ function truncate(label: string, max: number) {
+-  return label.length > max ? label.slice(0, max - 1).trimEnd() + "…" : label
++  return label.length > max ? label.slice(0, max - 1).trimEnd() + chromeEllipsis() : label
+ }
+ 
+ type FormDraft = {
+@@ -787,7 +788,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+             </text>
+             <Show when={fields().length > 0}>
+               <text fg={theme.text.muted}>
+-                · {answered()}/{fields().length} completed
++                {chromeGlyph("·")} {answered()}/{fields().length} completed
+               </text>
+             </Show>
+           </box>
+@@ -868,7 +869,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+                 fg={store.answers[external().key] === true ? theme.text.feedback.success.base : theme.text.muted}
+               >
+                 {store.answers[external().key] === true
+-                  ? "✓ Acknowledged"
++                  ? `${chromeGlyph("✓")} Acknowledged`
+                   : store.externalReady[external().key]
+                     ? "Complete the external action, then press enter to confirm."
+                     : "Open or copy the URL, complete the external action, then confirm."}
+@@ -952,7 +953,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+                                       : theme.text.muted
+                                 }
+                               >
+-                                [{picked() ? "✓" : " "}]
++                                [{picked() ? chromeGlyph("✓") : " "}]
+                               </text>
+                             </Show>
+                             <text fg={active() ? theme.text.formfield.focused : theme.text.formfield.base}>
+@@ -960,7 +961,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+                             </text>
+                           </box>
+                           <Show when={!multi()}>
+-                            <text fg={theme.text.formfield.selected}>{picked() ? " ✓" : ""}</text>
++                            <text fg={theme.text.formfield.selected}>{picked() ? ` ${chromeGlyph("✓")}` : ""}</text>
+                           </Show>
+                         </box>
+                         <Show when={row.description}>
+@@ -1007,7 +1008,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+                                   : theme.text.muted
+                             }
+                           >
+-                            [{customChecked() ? "✓" : " "}]
++                            [{customChecked() ? chromeGlyph("✓") : " "}]
+                           </text>
+                         </Show>
+                         <Show
+@@ -1018,7 +1019,7 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+                                 {input() || "Type your own answer"}
+                               </text>
+                               <Show when={!multi() && customPicked()}>
+-                                <text fg={theme.text.formfield.selected}>✓</text>
++                                <text fg={theme.text.formfield.selected}>{chromeGlyph("✓")}</text>
+                               </Show>
+                             </>
+                           }
+@@ -1134,17 +1135,17 @@ export function FormPrompt(props: { form: FormWithLocation }) {
+         <box flexDirection="row" gap={2}>
+           <Show when={!single()}>
+             <text fg={theme.text.base}>
+-              {"⇆"} <span style={{ fg: theme.text.muted }}>tab</span>
++              {chromeGlyph("⇆")} <span style={{ fg: theme.text.muted }}>tab</span>
+             </text>
+           </Show>
+           <Show when={!confirm() && !textual() && !externalField() && !store.editing}>
+             <text fg={theme.text.base}>
+-              {"↑↓"} <span style={{ fg: theme.text.muted }}>select</span>
++              {`${chromeGlyph("↑")}${chromeGlyph("↓")}`} <span style={{ fg: theme.text.muted }}>select</span>
+             </text>
+           </Show>
+           <Show when={confirm() && reviewContentHeight() > reviewMaxHeight()}>
+             <text fg={theme.text.base}>
+-              {"↑↓"} <span style={{ fg: theme.text.muted }}>scroll</span>
++              {`${chromeGlyph("↑")}${chromeGlyph("↓")}`} <span style={{ fg: theme.text.muted }}>scroll</span>
+             </text>
+           </Show>
+           <text
+diff --git a/packages/tui/src/routes/session/group-view.tsx b/packages/tui/src/routes/session/group-view.tsx
+index 2e09fc5e84974454fdc4b2106ab89f68c99f13da..bcf83e0c9cbd66ac9e51791c4e880ca6e2b0f791 100644
+--- a/packages/tui/src/routes/session/group-view.tsx
++++ b/packages/tui/src/routes/session/group-view.tsx
+@@ -5,6 +5,7 @@ import type { SessionMessageAssistantTool, SessionMessageInfo } from "@opencode/
+ import { createSyntaxStyleMemo, useTheme, useThemes } from "../../context/theme"
+ import { reasoningSummary } from "../../context/thinking"
+ import { SplitBorder } from "../../ui/border"
++import { chromeGlyph } from "../../ui/glyphs"
+ import { Locale } from "../../util/locale"
+ import { EntryAnchor, GroupAnchor, visitEntries } from "./anchor-view"
+ import { groupID } from "./anchors"
+@@ -142,7 +143,7 @@ function GroupContent(props: GroupProps) {
+           <Show when={grouped()} fallback={children("normal")}>
+             <Show when={tools().length > 0}>
+               <InlineToolRow
+-                icon={completed() ? "→" : "✱"}
++                icon={chromeGlyph(completed() ? "→" : "✱")}
+                 color={hover() ? theme.text.base : theme.text.muted}
+                 complete={completed()}
+                 pending={label()}
+@@ -184,8 +185,8 @@ function GroupContent(props: GroupProps) {
+             >
+               {props.completed ? "Thought" : latest() ? `Thinking: ${latest()}` : "Thinking"}
+               <Show when={props.completed && !expanded() && latest()}>: {latest()}</Show>
+-              <Show when={props.completed && thoughts().length > 1}> · {thoughts().length} steps</Show>
+-              <Show when={props.completed && duration()}> · {Locale.duration(duration())}</Show>
++              <Show when={props.completed && thoughts().length > 1}> {chromeGlyph("·")} {thoughts().length} steps</Show>
++              <Show when={props.completed && duration()}> {chromeGlyph("·")} {Locale.duration(duration())}</Show>
+             </InlineToolRow>
+             <Show when={expanded()}>
+               <box paddingLeft={3}>{children("thought")}</box>
+@@ -209,7 +210,7 @@ function ActivityGroup(props: GroupProps) {
+     <GroupAnchor groupID={disclosure.id()} active={summary().label !== ""}>
+       <Show when={summary().label}>
+         <InlineToolRow
+-          icon={disclosure.expanded() ? "−" : "+"}
++          icon={activityGroupDisclosureIcon(disclosure.expanded())}
+           color={hover() ? theme.text.base : theme.text.muted}
+           complete={true}
+           pending={summary().label}
+@@ -247,7 +248,7 @@ function InstructionsGroup(props: GroupProps) {
+   return (
+     <GroupAnchor groupID={disclosure.id()} active={files() > 0}>
+       <InlineToolRow
+-        icon="◈"
++        icon={chromeGlyph("◈")}
+         color={hover() ? theme.text.base : theme.text.muted}
+         complete={true}
+         pending=""
+@@ -290,6 +291,10 @@ function descendants(node: Extract<SessionNode, { type: "group" }>) {
+ }
+ 
+ /** Permission-blocked tools stay visible below the root group, even when collapsed. */
++export function activityGroupDisclosureIcon(expanded: boolean) {
++  return expanded ? chromeGlyph("−") : "+"
++}
++
+ function PendingEntries(props: GroupProps & { entries: readonly SessionEntry[] }) {
+   return (
+     <Show when={!props.pendingOutside}>
+diff --git a/packages/tui/src/routes/session/index.tsx b/packages/tui/src/routes/session/index.tsx
+index 0b8228ef8714b05a4e675b6f9e58a116fb9367ba..e7077d07a8897c79659c7ba61d39113616886017 100644
+--- a/packages/tui/src/routes/session/index.tsx
++++ b/packages/tui/src/routes/session/index.tsx
+@@ -19,6 +19,7 @@ import { useRoute, useRouteData } from "../../context/route"
+ import { createStore } from "solid-js/store"
+ import { useData } from "../../context/data"
+ import { SplitBorder } from "../../ui/border"
++import { chromeEllipsis, chromeGlyph, chromeLabel } from "../../ui/glyphs"
+ import { useTuiTerminalEnvironment } from "../../context/runtime"
+ import { Spinner, SPINNER_FRAMES } from "../../component/spinner"
+ import { PatchDiff } from "../../component/patch-diff"
+@@ -191,7 +192,7 @@ export function Session(props: {
+   createEffect(() => currentLocation.set(location()))
+ 
+   createEffect(() => {
+-    const title = Locale.truncate(session()?.title ?? "", 50)
++    const title = Locale.truncate(session()?.title ?? "", 50, chromeEllipsis())
+     setEpilogue(sessionEpilogue({ title, sessionID: session()?.id }))
+   })
+   onCleanup(() => setEpilogue())
+@@ -1441,7 +1442,7 @@ export function Session(props: {
+             </box>
+             <box height={1} flexShrink={0} flexDirection="row" justifyContent="flex-end">
+               <Show when={firstJump()}>
+-                <text fg={theme.text.feedback.info.base}>Loading session history…</text>
++                <text fg={theme.text.feedback.info.base}>{chromeLabel("Loading session history…")}</text>
+               </Show>
+               <Show when={!firstJump() && awayFromBottom()}>
+                 <box
+@@ -1454,7 +1455,7 @@ export function Session(props: {
+                   <text
+                     fg={latestHovered() ? theme.text.action.secondary.hovered : theme.text.action.secondary.base}
+                   >
+-                    Jump to latest ↓
++                    Jump to latest {chromeGlyph("↓")}
+                   </text>
+                 </box>
+               </Show>
+@@ -1677,14 +1678,14 @@ function TurnTokenUsage(props: {
+             <span>{expanded() ? "- " : "+ "}</span>
+             <span style={{ attributes: TextAttributes.BOLD }}>Tokens</span>
+             <span>
+-              : {summary().count} {summary().count === 1 ? "step" : "steps"} · latest:{" "}
+-              {summary().latestNewTokens.toLocaleString()} new · {summary().latestCached.toLocaleString()} cached ·{" "}
++              : {summary().count} {summary().count === 1 ? "step" : "steps"} {chromeGlyph("·")} latest:{" "}
++              {summary().latestNewTokens.toLocaleString()} new {chromeGlyph("·")} {summary().latestCached.toLocaleString()} cached {chromeGlyph("·")}{" "}
+               {summary().latestTotal.toLocaleString()} total
+             </span>
+             <Show when={summary().reuseDrops > 0}>
+               <span style={{ fg: theme.text.feedback.warning.base }}>
+                 {" "}
+-                · ! {summary().reuseDrops} likely cache {summary().reuseDrops === 1 ? "bust" : "busts"}
++                {chromeGlyph("·")} ! {summary().reuseDrops} likely cache {summary().reuseDrops === 1 ? "bust" : "busts"}
+               </span>
+             </Show>
+           </text>
+@@ -1914,16 +1915,16 @@ function AssistantFooter(props: { message: SessionMessageAssistant }) {
+             {Locale.titlecase(props.message.agent)}
+           </span>
+           <Show when={ctx.terminal.width >= 28}>
+-            <span style={{ fg: theme.text.muted }}> · {model()}</span>
++            <span style={{ fg: theme.text.muted }}> {chromeGlyph("·")} {model()}</span>
+           </Show>
+           <Show when={duration() && (ctx.terminal.width < 28 || ctx.terminal.width >= 36)}>
+-            <span style={{ fg: theme.text.muted }}> · {Locale.duration(duration())}</span>
++            <span style={{ fg: theme.text.muted }}> {chromeGlyph("·")} {Locale.duration(duration())}</span>
+           </Show>
+           <Show when={config.data.session.tps && tokensPerSecond()}>
+-            {(value) => <span style={{ fg: theme.text.muted }}> · {value().toFixed(1)} tok/s</span>}
++            {(value) => <span style={{ fg: theme.text.muted }}> {chromeGlyph("·")} {value().toFixed(1)} tok/s</span>}
+           </Show>
+           <Show when={interrupted()}>
+-            <span style={{ fg: theme.text.muted }}> · interrupted</span>
++            <span style={{ fg: theme.text.muted }}> {chromeGlyph("·")} interrupted</span>
+           </Show>
+         </text>
+       </box>
+@@ -1938,7 +1939,7 @@ function SessionSwitchMessageV2(props: { message: SessionMessageInfo }) {
+     return (
+       <box paddingLeft={3}>
+         <text>
+-          <span style={{ fg: theme.text.muted }}>↳ Moved to </span>
++          <span style={{ fg: theme.text.muted }}>{chromeGlyph("↳")} Moved to </span>
+           <span style={{ fg: theme.text.feedback.info.base }}>{props.message.location.directory}</span>
+         </text>
+       </box>
+@@ -1984,8 +1985,9 @@ function SessionNoticeMessageV2(props: { message: SessionMessageInfo }) {
+     if (state() === "error") return "failed"
+     return state() ?? "finished"
+   }
+-  const heading = () => `${state() === "completed" ? "↳" : "!"} ${actor()} ${status()}`
+-  const suffix = () => Locale.truncateWidth(` · ${description()}`, Math.max(0, ctx.width - 3 - stringWidth(heading())))
++  const heading = () => `${chromeGlyph(state() === "completed" ? "↳" : "!")} ${actor()} ${status()}`
++  const suffix = () =>
++    Locale.truncateWidth(` ${chromeGlyph("·")} ${description()}`, Math.max(0, ctx.width - 3 - stringWidth(heading())), chromeEllipsis())
+   const color = () => {
+     if (state() === "error") return theme.text.feedback.error.base
+     if (state() === "cancelled") return theme.text.feedback.warning.base
+@@ -1996,7 +1998,7 @@ function SessionNoticeMessageV2(props: { message: SessionMessageInfo }) {
+     <Show
+       when={completion()}
+       fallback={
+-        <InlineToolRow icon="◈" color={theme.text.muted} pending="Notice" complete={true}>
++        <InlineToolRow icon={chromeGlyph("◈")} color={theme.text.muted} pending="Notice" complete={true}>
+           {text()}
+         </InlineToolRow>
+       }
+@@ -2023,7 +2025,7 @@ function SessionNoticeMessageV2(props: { message: SessionMessageInfo }) {
+ function SessionSkillMessage(props: { message: Extract<SessionMessageInfo, { type: "skill" }> }) {
+   const theme = useTheme()
+   return (
+-    <InlineToolRow icon="→" color={theme.text.muted} pending="Skill" complete={true}>
++    <InlineToolRow icon={chromeGlyph("→")} color={theme.text.muted} pending="Skill" complete={true}>
+       Skill {props.message.name}
+     </InlineToolRow>
+   )
+@@ -2047,7 +2049,7 @@ function CompactionMessage(props: { message: Extract<SessionMessageInfo, { type:
+     const input = tokens.input + tokens.cache.read + tokens.cache.write
+     const output = tokens.output + tokens.reasoning
+     if (input + output <= 0) return
+-    return `${Locale.number(input)} in · ${Locale.number(output)} out`
++    return `${Locale.number(input)} in ${chromeGlyph("·")} ${Locale.number(output)} out`
+   }
+   return (
+     <box>
+@@ -2056,12 +2058,12 @@ function CompactionMessage(props: { message: Extract<SessionMessageInfo, { type:
+         <box flexDirection="row" gap={1} paddingLeft={1} paddingRight={1}>
+           <Switch>
+             <Match when={status() === "running"}>
+-              <Show when={ctx.config.animations ?? true} fallback={<text fg={color()}>⋯</text>}>
++              <Show when={ctx.config.animations ?? true} fallback={<text fg={color()}>{chromeGlyph("…")}</text>}>
+                 <spinner frames={SPINNER_FRAMES} interval={80} color={color()} />
+               </Show>
+             </Match>
+             <Match when={status() === "failed" && !cancelled()}>
+-              <text fg={color()}>✗</text>
++              <text fg={color()}>{chromeGlyph("✗")}</text>
+             </Match>
+           </Switch>
+           <text fg={color()}>
+@@ -2070,10 +2072,10 @@ function CompactionMessage(props: { message: Extract<SessionMessageInfo, { type:
+               : "Compaction"}
+           </text>
+           <Show when={cancelled()}>
+-            <text fg={color()}>· cancelled</text>
++            <text fg={color()}>{chromeGlyph("·")} cancelled</text>
+           </Show>
+           <Show when={usage()}>
+-            <text fg={color()}>· {usage()}</text>
++            <text fg={color()}>{chromeGlyph("·")} {usage()}</text>
+           </Show>
+         </box>
+         <box border={["top"]} borderColor={color()} flexGrow={1} />
+@@ -2103,7 +2105,7 @@ function CompactionQueued() {
+     <box flexDirection="row" alignItems="center">
+       <box border={["top"]} borderColor={theme.border.base} flexGrow={1} />
+       <box flexDirection="row" gap={1} paddingLeft={1} paddingRight={1}>
+-        <text fg={theme.text.muted}>◇</text>
++        <text fg={theme.text.muted}>{chromeGlyph("◇")}</text>
+         <text fg={theme.text.muted}>Compaction queued</text>
+       </box>
+       <box border={["top"]} borderColor={theme.border.base} flexGrow={1} />
+@@ -2369,7 +2371,7 @@ function QueuedPromptDock(props: { prompts: { id: string; text: string }[]; onOp
+       >
+         <text fg={theme.text.muted} wrapMode="none" truncate flexGrow={1} flexShrink={1} minWidth={0}>
+           <span style={{ fg: theme.text.base }}>{props.prompts.length} queued</span>
+-          <Show when={next()}>{(text) => <> · {text()}</>}</Show>
++          <Show when={next()}>{(text) => <> {chromeGlyph("·")} {text()}</>}</Show>
+         </text>
+       </box>
+     </box>
+@@ -2394,7 +2396,7 @@ function AssistantRetry(props: { retry: SessionMessageAssistant["retry"] }) {
+       {(retry) => (
+         <box paddingLeft={3}>
+           <text fg={theme.text.feedback.warning.base}>
+-            ⚠ {seconds() > 0 ? `Retrying in ${seconds()}s` : "Retry due"} · attempt {retry().attempt} ·{" "}
++            {chromeGlyph("⚠")} {seconds() > 0 ? `Retrying in ${seconds()}s` : "Retry due"} {chromeGlyph("·")} attempt {retry().attempt} {chromeGlyph("·")} {" "}
+             {retry().error.message}
+           </text>
+         </box>
+@@ -2575,7 +2577,7 @@ function GenericTool(props: ToolProps) {
+   return (
+     <>
+       <InlineTool
+-        icon={props.part.state.status === "error" ? "✗" : "✓"}
++        icon={chromeGlyph(props.part.state.status === "error" ? "✗" : "✓")}
+         complete={props.part.state.status === "completed"}
+         pending={props.tool}
+         spinner={loading()}
+@@ -2943,9 +2945,9 @@ function ShellDisplay(props: {
+           when={props.command}
+           fallback={
+             isRunning() || props.status === "streaming" ? (
+-              <Spinner color={color()}>Writing command…</Spinner>
++              <Spinner color={color()}>{chromeLabel("Writing command…")}</Spinner>
+             ) : (
+-              <text fg={theme.text.muted}>Writing command…</text>
++              <text fg={theme.text.muted}>{chromeLabel("Writing command…")}</text>
+             )
+           }
+         >
+@@ -3014,7 +3016,7 @@ function Write(props: ToolProps) {
+         </BlockTool>
+       </Match>
+       <Match when={true}>
+-        <InlineTool icon="←" pending="Preparing write…" complete={stringValue(props.input.path)} part={props.part}>
++        <InlineTool icon={chromeGlyph("←")} pending={chromeLabel("Preparing write…")} complete={stringValue(props.input.path)} part={props.part}>
+           Write {pathFormatter.format(stringValue(props.input.path))}
+         </InlineTool>
+       </Match>
+@@ -3025,7 +3027,7 @@ function Write(props: ToolProps) {
+ function Glob(props: ToolProps) {
+   const pathFormatter = usePathFormatter()
+   return (
+-    <InlineTool icon="✱" pending="Finding files…" complete={stringValue(props.input.pattern)} part={props.part}>
++    <InlineTool icon={chromeGlyph("✱")} pending={chromeLabel("Finding files…")} complete={stringValue(props.input.pattern)} part={props.part}>
+       Glob "{stringValue(props.input.pattern)}"{" "}
+       <Show when={stringValue(props.input.path)}>in {pathFormatter.format(stringValue(props.input.path))} </Show>
+       <Show when={finiteNumber(props.metadata.count)}>
+@@ -3048,8 +3050,8 @@ function Read(props: ToolProps) {
+   return (
+     <>
+       <InlineTool
+-        icon="→"
+-        pending="Reading file…"
++        icon={chromeGlyph("→")}
++        pending={chromeLabel("Reading file…")}
+         complete={stringValue(props.input.path)}
+         spinner={isRunning()}
+         part={props.part}
+@@ -3064,7 +3066,7 @@ function Read(props: ToolProps) {
+         {(filepath) => (
+           <box paddingLeft={3}>
+             <text paddingLeft={3} fg={theme.text.muted}>
+-              ↳ Loaded {pathFormatter.format(filepath)}
++              {chromeGlyph("↳")} Loaded {pathFormatter.format(filepath)}
+             </text>
+           </box>
+         )}
+@@ -3076,7 +3078,7 @@ function Read(props: ToolProps) {
+ function Grep(props: ToolProps) {
+   const pathFormatter = usePathFormatter()
+   return (
+-    <InlineTool icon="✱" pending="Searching content…" complete={stringValue(props.input.pattern)} part={props.part}>
++    <InlineTool icon={chromeGlyph("✱")} pending={chromeLabel("Searching content…")} complete={stringValue(props.input.pattern)} part={props.part}>
+       Grep "{stringValue(props.input.pattern)}"{" "}
+       <Show when={stringValue(props.input.path)}>in {pathFormatter.format(stringValue(props.input.path))} </Show>
+       <Show when={finiteNumber(props.metadata.matches)}>
+@@ -3088,7 +3090,7 @@ function Grep(props: ToolProps) {
+ 
+ function WebFetch(props: ToolProps) {
+   return (
+-    <InlineTool icon="%" pending="Fetching from the web…" complete={stringValue(props.input.url)} part={props.part}>
++    <InlineTool icon="%" pending={chromeLabel("Fetching from the web…")} complete={stringValue(props.input.url)} part={props.part}>
+       WebFetch {stringValue(props.input.url)}
+     </InlineTool>
+   )
+@@ -3098,7 +3100,7 @@ function WebSearch(props: ToolProps) {
+   const ctx = use()
+   const provider = createMemo(() => stringValue(props.metadata.provider))
+   return (
+-    <InlineTool icon="◈" pending="Searching web…" complete={stringValue(props.input.query)} part={props.part}>
++    <InlineTool icon={chromeGlyph("◈")} pending={chromeLabel("Searching web…")} complete={stringValue(props.input.query)} part={props.part}>
+       <Show when={provider()} fallback="Web Search">
+         {(value) => (
+           <>
+@@ -3133,11 +3135,11 @@ function Subagent(props: ToolProps) {
+ 
+   return (
+     <InlineTool
+-      icon={continuation() ? "↳" : isRunning() ? "│" : props.part.state.status === "completed" ? "✓" : "│"}
++      icon={chromeGlyph(continuation() ? "↳" : isRunning() ? "│" : props.part.state.status === "completed" ? "✓" : "│")}
+       spinner={!continuation() && isRunning()}
+       running={isRunning()}
+       complete={description()}
+-      pending="Delegating…"
++      pending={chromeLabel("Delegating…")}
+       part={props.part}
+       onClick={() => {
+         const id = sessionID()
+@@ -3149,7 +3151,7 @@ function Subagent(props: ToolProps) {
+         ) : undefined
+       }
+     >
+-      {`${continuation() ? "Continue subagent" : `${Locale.titlecase(stringValue(props.input.agent) ?? stringValue(props.input.subagent_type) ?? "General")} Subagent`} — ${description() ?? "Subagent"}${model() ? ` · ${model()}` : ""}`}
++      {`${continuation() ? "Continue subagent" : `${Locale.titlecase(stringValue(props.input.agent) ?? stringValue(props.input.subagent_type) ?? "General")} Subagent`} ${chromeGlyph("—")} ${description() ?? "Subagent"}${model() ? ` ${chromeGlyph("·")} ${model()}` : ""}`}
+     </InlineTool>
+   )
+ }
+@@ -3202,7 +3204,7 @@ function ExecuteCallView(props: { call: Accessor<ExecuteCall> }) {
+     >
+       <box flexDirection="row">
+         <box width={INLINE_TOOL_ICON_WIDTH} flexShrink={0}>
+-          <text fg={color()}>{props.call().status === "error" ? "✗" : "›"}</text>
++          <text fg={color()}>{chromeGlyph(props.call().status === "error" ? "✗" : "›")}</text>
+         </box>
+         <text flexGrow={1} wrapMode="none" truncate fg={color()}>
+           {expanded() ? props.call().tool : executeCallSummary(props.call())}
+@@ -3248,7 +3250,7 @@ function Execute(props: ToolProps) {
+   return (
+     <>
+       <InlineTool
+-        icon={hasRuntimeError() ? "✗" : props.part.state.status === "completed" ? "✓" : "│"}
++        icon={chromeGlyph(hasRuntimeError() ? "✗" : props.part.state.status === "completed" ? "✓" : "│")}
+         color={hasRuntimeError() ? theme.text.feedback.error.base : undefined}
+         spinner={isLoading()}
+         pending="execute"
+@@ -3265,7 +3267,7 @@ function Execute(props: ToolProps) {
+           <For each={outputPreview().split("\n")}>
+             {(line, index) => (
+               <text paddingLeft={3} fg={theme.text.feedback.error.base}>
+-                {index() === 0 ? "↳ " : "  "}
++                {index() === 0 ? `${chromeGlyph("↳")} ` : "  "}
+                 {line}
+               </text>
+             )}
+@@ -3297,7 +3299,7 @@ function Edit(props: ToolProps) {
+     <Switch>
+       <Match when={file()}>
+         {(item) => (
+-          <BlockTool path={{ label: "← Edit", value: pathFormatter.format(path()) }} part={props.part}>
++          <BlockTool path={{ label: `${chromeGlyph("←")} Edit`, value: pathFormatter.format(path()) }} part={props.part}>
+             <box paddingLeft={1}>
+               <PatchDiff
+                 diff={item().patch}
+@@ -3328,10 +3330,10 @@ function Edit(props: ToolProps) {
+         <BlockTool
+           path={
+             stringValue(props.input.path)
+-              ? { label: "← Edit", value: pathFormatter.format(stringValue(props.input.path)) }
++              ? { label: `${chromeGlyph("←")} Edit`, value: pathFormatter.format(stringValue(props.input.path)) }
+               : undefined
+           }
+-          title={stringValue(props.input.path) ? undefined : "# Preparing edit…"}
++          title={stringValue(props.input.path) ? undefined : `# ${chromeLabel("Preparing edit…")}`}
+           part={props.part}
+           spinner={props.part.state.status === "streaming"}
+         />
+@@ -3375,7 +3377,7 @@ function ApplyPatch(props: ToolProps) {
+             {(file) => (
+               <BlockTool
+                 path={{
+-                  label: file.type === "add" ? "# Created" : file.type === "delete" ? "# Deleted" : "← Patched",
++                  label: file.type === "add" ? "# Created" : file.type === "delete" ? "# Deleted" : `${chromeGlyph("←")} Patched`,
+                   value: pathFormatter.format(file.relativePath),
+                 }}
+                 part={props.part}
+@@ -3422,7 +3424,7 @@ function ApplyPatch(props: ToolProps) {
+             {(file) => (
+               <BlockTool
+                 path={{
+-                  label: file.type === "add" ? "# Created" : file.type === "delete" ? "# Deleted" : "← Patched",
++                  label: file.type === "add" ? "# Created" : file.type === "delete" ? "# Deleted" : `${chromeGlyph("←")} Patched`,
+                   value: pathFormatter.format(file.resource),
+                 }}
+                 part={props.part}
+@@ -3488,7 +3490,7 @@ function Question(props: ToolProps) {
+         </BlockTool>
+       </Match>
+       <Match when={true}>
+-        <InlineTool icon="→" pending="Asking questions…" complete={count()} part={props.part}>
++        <InlineTool icon={chromeGlyph("→")} pending={chromeLabel("Asking questions…")} complete={count()} part={props.part}>
+           Asked {count()} question{count() !== 1 ? "s" : ""}
+         </InlineTool>
+       </Match>
+@@ -3499,7 +3501,7 @@ function Question(props: ToolProps) {
+ function Skill(props: ToolProps) {
+   const name = createMemo(() => stringValue(props.metadata.name) ?? stringValue(props.input.id))
+   return (
+-    <InlineTool icon="→" pending="Loading skill…" complete={name()} part={props.part}>
++    <InlineTool icon={chromeGlyph("→")} pending={chromeLabel("Loading skill…")} complete={name()} part={props.part}>
+       Skill "{name()}"
+     </InlineTool>
+   )
+diff --git a/packages/tui/src/routes/session/location-missing.tsx b/packages/tui/src/routes/session/location-missing.tsx
+index d42aada29fac26b1dec5372f03941be08aed14d5..15f1d0ec37179a74e1c8d35c1930cc8a97a4d6d5 100644
+--- a/packages/tui/src/routes/session/location-missing.tsx
++++ b/packages/tui/src/routes/session/location-missing.tsx
+@@ -10,6 +10,7 @@ import { useToast } from "../../ui/toast"
+ import { errorMessage } from "../../util/error"
+ import { DialogWorkspaces, type WorkspaceSelection } from "../../component/dialog-workspaces"
+ import { useData } from "../../context/data"
++import { chromeEllipsis } from "../../ui/glyphs"
+ 
+ export function SessionLocationMissing(props: { directory: string; projectID: string; sessionID: string }) {
+   const dialog = useDialog()
+@@ -59,7 +60,7 @@ export function SessionLocationMissing(props: { directory: string; projectID: st
+ export function SessionLocationUnavailable(props: { directory: string; onMove: () => void }) {
+   const paths = useTuiPaths()
+   const theme = useTheme()
+-  const directory = createMemo(() => Locale.truncateMiddle(abbreviateHome(props.directory, paths.home), 72))
++  const directory = createMemo(() => Locale.truncateMiddle(abbreviateHome(props.directory, paths.home), 72, chromeEllipsis()))
+ 
+   return (
+     <SessionQuestion
+diff --git a/packages/tui/src/routes/session/message-parts.tsx b/packages/tui/src/routes/session/message-parts.tsx
+index f63ba65250e854f423e0b624e1f3629c750d4a6b..a4b361664eab3078b055f5669bf2a6baf19f5ec2 100644
+--- a/packages/tui/src/routes/session/message-parts.tsx
++++ b/packages/tui/src/routes/session/message-parts.tsx
+@@ -11,6 +11,7 @@ import { createSyntaxStyleMemo, useTheme, useThemes } from "../../context/theme"
+ import { reasoningSummary } from "../../context/thinking"
+ import { usePlugin } from "../../plugin/context"
+ import { SplitBorder } from "../../ui/border"
++import { chromeGlyph } from "../../ui/glyphs"
+ import { Locale } from "../../util/locale"
+ import { use } from "./render-context"
+ import { generateThinkingSyntax } from "./thinking-syntax"
+@@ -156,7 +157,7 @@ function ReasoningHeader(props: {
+           </Show>
+           <Show when={props.duration}>
+             <span>
+-              {props.title ? " · " : ""}
++              {props.title ? ` ${chromeGlyph("·")} ` : ""}
+               {props.duration}
+             </span>
+           </Show>
+@@ -237,7 +238,7 @@ export function InlineToolRow(props: {
+                 fg={props.failed ? props.errorColor : (props.iconColor ?? props.color)}
+                 attributes={props.denied ? TextAttributes.STRIKETHROUGH : undefined}
+               >
+-                {props.icon}
++                {chromeGlyph(props.icon)}
+               </text>
+               <Show
+                 when={props.status}
+diff --git a/packages/tui/src/routes/session/permission.tsx b/packages/tui/src/routes/session/permission.tsx
+index 07338aba69d81e27d5213e61131f7d2db0e2ff0a..812d3e97e6fa3085113e9af310b03fd2b5d64161 100644
+--- a/packages/tui/src/routes/session/permission.tsx
++++ b/packages/tui/src/routes/session/permission.tsx
+@@ -5,6 +5,7 @@ import type { TextareaRenderable } from "@opentui/core"
+ import { useTheme, useThemes } from "../../context/theme"
+ import type { PermissionReply, PermissionRequest } from "@opencode/client"
+ import { SplitBorder } from "../../ui/border"
++import { chromeGlyph } from "../../ui/glyphs"
+ import { useData } from "../../context/data"
+ import { filetype } from "../../util/filetype"
+ import { permissionAlwaysLines, permissionOptionLabel, permissionPresentation } from "../../util/permission"
+@@ -200,7 +201,7 @@ export function PermissionPrompt(props: { request: PermissionRequest; directory?
+           const header = () => (
+             <box flexDirection="column" gap={0}>
+               <box flexDirection="row" gap={1} flexShrink={0}>
+-                <text fg={theme.text.feedback.warning.base}>{"△"}</text>
++                <text fg={theme.text.feedback.warning.base}>{chromeGlyph("△")}</text>
+                 <text fg={theme.text.base}>Permission required</text>
+               </box>
+               <Show when={props.request.action !== "shell" && current.title}>
+@@ -321,7 +322,7 @@ function RejectPrompt(props: {
+     >
+       <box gap={1} paddingLeft={1} paddingRight={3} paddingTop={1} paddingBottom={1}>
+         <box flexDirection="row" gap={1} paddingLeft={1}>
+-          <text fg={theme.text.feedback.error.base}>{"△"}</text>
++          <text fg={theme.text.feedback.error.base}>{chromeGlyph("△")}</text>
+           <text fg={theme.text.base}>Reject permission</text>
+         </box>
+         <box paddingLeft={1}>
+@@ -527,7 +528,7 @@ export function SessionQuestion<const T extends Record<string, string>>(props: {
+           when={props.header}
+           fallback={
+             <box flexDirection="row" gap={1} paddingLeft={1} flexShrink={0}>
+-              <text fg={theme.text.feedback.warning.base}>{"△"}</text>
++              <text fg={theme.text.feedback.warning.base}>{chromeGlyph("△")}</text>
+               <text fg={theme.text.base}>{props.title}</text>
+             </box>
+           }
+@@ -603,7 +604,7 @@ export function SessionQuestion<const T extends Record<string, string>>(props: {
+           </Show>
+           <Show when={keys.length > 1}>
+             <text fg={theme.text.base}>
+-              {"⇆"} <span style={{ fg: theme.text.muted }}>select</span>
++              {chromeGlyph("⇆")} <span style={{ fg: theme.text.muted }}>select</span>
+             </text>
+           </Show>
+           <text fg={theme.text.base}>
+diff --git a/packages/tui/src/ui/border.ts b/packages/tui/src/ui/border.ts
+index 333071020c4b3ce74aad47ec9ba758a566761565..d03cce890838bae1df70d0b9bdab06bbf8131e46 100644
+--- a/packages/tui/src/ui/border.ts
++++ b/packages/tui/src/ui/border.ts
+@@ -1,3 +1,5 @@
++import { chromeBorderChars } from "./glyphs"
++
+ export const EmptyBorder = {
+   topLeft: "",
+   bottomLeft: "",
+@@ -14,8 +16,8 @@ export const EmptyBorder = {
+ 
+ export const SplitBorder = {
+   border: ["left" as const, "right" as const],
+-  customBorderChars: {
+-    ...EmptyBorder,
+-    vertical: "┃",
++  get customBorderChars() {
++    const chars = chromeBorderChars()
++    return chars ? { ...EmptyBorder, ...chars } : { ...EmptyBorder, vertical: "┃" }
+   },
+ }
+diff --git a/packages/tui/src/ui/dialog-export-options.tsx b/packages/tui/src/ui/dialog-export-options.tsx
+index 2a38f6292279460734430cd74894b8ed53056422..a60018289a09ce7c68f1e782a44cb408b35101f1 100644
+--- a/packages/tui/src/ui/dialog-export-options.tsx
++++ b/packages/tui/src/ui/dialog-export-options.tsx
+@@ -1,6 +1,7 @@
+ import { Keymap } from "../context/keymap"
+ import { useNewDesigns } from "../config"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph } from "./glyphs"
+ import { DialogHeader, DialogLayout, type DialogContext } from "./dialog"
+ import { createStore } from "solid-js/store"
+ import { For, Show } from "solid-js"
+@@ -153,7 +154,7 @@ export function DialogExportOptions(props: DialogExportOptionsProps) {
+                           : theme.text.formfield.base
+                     }
+                   >
+-                    {store.format === format ? "◉" : "○"} {format === "markdown" ? "Markdown" : "JSON"}
++                    {store.format === format ? chromeGlyph("◉") : "○"} {format === "markdown" ? "Markdown" : "JSON"}
+                   </text>
+                 </box>
+               )}
+diff --git a/packages/tui/src/ui/dialog-export-result.tsx b/packages/tui/src/ui/dialog-export-result.tsx
+index 6304fbdb307b218f13945547a81ff9faed281975..4751cc8d57c60f60729cba79acc21851852948a1 100644
+--- a/packages/tui/src/ui/dialog-export-result.tsx
++++ b/packages/tui/src/ui/dialog-export-result.tsx
+@@ -3,6 +3,7 @@ import { useNewDesigns } from "../config"
+ import { useClipboard } from "../context/clipboard"
+ import { Keymap } from "../context/keymap"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph } from "./glyphs"
+ import { DialogHeader, DialogLayout, useDialog, type DialogContext } from "./dialog"
+ import { useToast } from "./toast"
+ 
+@@ -51,7 +52,7 @@ export function DialogExportResult(props: { path: string; onClose?: () => void }
+         actions: {
+           primary: [
+             copied()
+-              ? { title: "✓ copied", color: theme.text.feedback.success.base, onTrigger: copy }
++              ? { title: `${chromeGlyph("✓")} copied`, color: theme.text.feedback.success.base, onTrigger: copy }
+               : { title: "copy path", key: "c", onTrigger: copy },
+           ],
+         },
+diff --git a/packages/tui/src/ui/dialog-prompt.tsx b/packages/tui/src/ui/dialog-prompt.tsx
+index b85074c491e86c1e34b646db5b09697df43b9950..00badea28607a4cc3471c906d6588f7d13cd8e20 100644
+--- a/packages/tui/src/ui/dialog-prompt.tsx
++++ b/packages/tui/src/ui/dialog-prompt.tsx
+@@ -6,6 +6,7 @@ import { Show, createEffect, createSignal, onMount, type JSX } from "solid-js"
+ import { Spinner } from "../component/spinner"
+ import { useConfig, useNewDesigns } from "../config"
+ import { useRenderer } from "@opentui/solid"
++import { chromeLabel } from "./glyphs"
+ 
+ export type DialogPromptAction = {
+   title: string
+@@ -148,7 +149,7 @@ export function DialogPrompt(props: DialogPromptProps) {
+         },
+       }}
+       legacyFooter={
+-        <Show when={!props.busy} fallback={<text fg={theme.text.muted}>processing…</text>}>
++        <Show when={!props.busy} fallback={<text fg={theme.text.muted}>{chromeLabel("processing…")}</text>}>
+           <DialogFooter
+             actions={{
+               secondary: [{ title: "submit", command: "dialog.prompt.submit", onTrigger: confirm }, ...extraActions()],
+@@ -175,7 +176,7 @@ export function DialogPrompt(props: DialogPromptProps) {
+           cursorStyle={config.cursor}
+         />
+         <Show when={props.busy}>
+-          <Spinner color={theme.text.muted}>{props.busyText ?? "Working…"}</Spinner>
++          <Spinner color={theme.text.muted}>{props.busyText ?? chromeLabel("Working…")}</Spinner>
+         </Show>
+       </box>
+     </DialogLayout>
+diff --git a/packages/tui/src/ui/dialog-select.tsx b/packages/tui/src/ui/dialog-select.tsx
+index f86d8b507f79920ac75de168f1cd1b1076a70380..acf4b6d5285c7478182c845f6847fc95d4a17c58 100644
+--- a/packages/tui/src/ui/dialog-select.tsx
++++ b/packages/tui/src/ui/dialog-select.tsx
+@@ -22,6 +22,7 @@ import { Locale } from "../util/locale"
+ import { getScrollAcceleration } from "../util/scroll"
+ import { useConfig, useNewDesigns } from "../config"
+ import { moveSelection, reconcileSelection } from "./select-controller"
++import { chromeEllipsis, chromeGlyph } from "./glyphs"
+ 
+ export interface DialogSelectProps<T> {
+   title: string
+@@ -789,7 +790,7 @@ export function DialogSelect<T>(props: DialogSelectProps<T>) {
+           </scrollbox>
+           <Show when={overflows()}>
+             <box paddingLeft={DIALOG_LIST_INSET} flexShrink={0}>
+-              <text fg={theme.text.faint}>{moreBelow() ? "…" : " "}</text>
++              <text fg={theme.text.faint}>{moreBelow() ? chromeGlyph("…") : " "}</text>
+             </box>
+           </Show>
+         </Show>
+@@ -855,7 +856,7 @@ function DialogSelectRow(props: {
+       </Show>
+       <Show when={props.current && !props.gutter}>
+         <text flexShrink={0} fg={newDesigns() ? theme.text.formfield.selected : text()}>
+-          {newDesigns() ? "▪" : "●"}
++          {chromeGlyph(newDesigns() ? "▪" : "●")}
+         </text>
+       </Show>
+       <Show when={props.gutter}>
+@@ -873,8 +874,8 @@ function DialogSelectRow(props: {
+           (props.truncateTitle === false
+             ? props.title
+             : props.truncateTitle === "left"
+-              ? Locale.truncateLeft(props.title, props.titleWidth ?? 61)
+-              : Locale.truncate(props.title, props.titleWidth ?? 61))}
++              ? Locale.truncateLeft(props.title, props.titleWidth ?? 61, chromeEllipsis())
++              : Locale.truncate(props.title, props.titleWidth ?? 61, chromeEllipsis()))}
+         <Show when={props.description}>
+           <span style={{ fg: props.active ? secondary() : theme.text.muted }}>{" " + props.description}</span>
+         </Show>
+@@ -891,7 +892,7 @@ function DialogSelectRow(props: {
+     <Show when={newDesigns()} fallback={row()}>
+       <box flexDirection="row">
+         <text width={1} flexShrink={0} fg={theme.text.formfield.focused}>
+-          {props.active ? "┃" : " "}
++          {props.active ? chromeGlyph("┃") : " "}
+         </text>
+         {row()}
+       </box>
+@@ -913,7 +914,7 @@ function DialogSelectDetails(props: { details?: string[] }) {
+           paddingRight={DIALOG_LIST_INSET - (newDesigns() ? 0 : 1)}
+         >
+           <text fg={theme.text.muted} wrapMode="none">
+-            {Locale.truncateMiddle(detail, Math.max(1, width()))}
++            {Locale.truncateMiddle(detail, Math.max(1, width()), chromeEllipsis())}
+           </text>
+         </box>
+       )}
+diff --git a/packages/tui/src/ui/file-path.tsx b/packages/tui/src/ui/file-path.tsx
+index 09b38066707cdfcf1aa3e8dd55cee47236b5888c..5fc5dd57257c9fc88855b1760761308404f51eff 100644
+--- a/packages/tui/src/ui/file-path.tsx
++++ b/packages/tui/src/ui/file-path.tsx
+@@ -1,6 +1,7 @@
+ import type { RGBA } from "@opentui/core"
+ import { createMemo } from "solid-js"
+ import { stringWidth } from "../util/string-width"
++import { chromeEllipsis } from "./glyphs"
+ 
+ const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" })
+ 
+@@ -29,6 +30,7 @@ export function FilePath(props: FilePathProps) {
+ }
+ 
+ export function truncateFilePath(value: string, maxWidth: number) {
++  const ellipsis = chromeEllipsis()
+   if (maxWidth <= 0) return ""
+   if (stringWidth(value) <= maxWidth) return value
+ 
+@@ -52,7 +54,7 @@ export function truncateFilePath(value: string, maxWidth: number) {
+     return root + truncateBasename(basename, maxWidth - rootWidth)
+   }
+ 
+-  const prefix = `${root}…${separator}`
++  const prefix = `${root}${ellipsis}${separator}`
+   const basenameWidth = maxWidth - stringWidth(prefix)
+   if (basenameWidth <= 0) return takeStart(prefix, maxWidth)
+   const compact = truncateBasename(basename, basenameWidth)
+@@ -66,7 +68,7 @@ export function truncateFilePath(value: string, maxWidth: number) {
+     const next = stringWidth(segment) + separatorWidth
+     if (width + next > maxWidth) {
+       const available = maxWidth - width - separatorWidth
+-      if (available > 1) selected.unshift(takeStart(segment, available - 1) + "…")
++      if (available > stringWidth(ellipsis)) selected.unshift(takeStart(segment, available - stringWidth(ellipsis)) + ellipsis)
+       break
+     }
+     selected.unshift(segment)
+@@ -77,15 +79,17 @@ export function truncateFilePath(value: string, maxWidth: number) {
+ 
+ function truncateBasename(value: string, maxWidth: number) {
+   if (stringWidth(value) <= maxWidth) return value
+-  if (maxWidth <= 1) return takeStart("…", maxWidth)
++  const ellipsis = chromeEllipsis()
++  const markerWidth = stringWidth(ellipsis)
++  if (maxWidth <= markerWidth) return takeStart(ellipsis, maxWidth)
+ 
+   const dot = value.lastIndexOf(".")
+   const extension = dot > 0 ? value.slice(dot) : ""
+   const extensionWidth = stringWidth(extension)
+-  if (extensionWidth >= maxWidth) return "…" + takeEnd(extension, maxWidth - 1)
++  if (extensionWidth + markerWidth >= maxWidth) return ellipsis + takeEnd(extension, maxWidth - markerWidth)
+ 
+   const stem = extension ? value.slice(0, dot) : value
+-  return takeStart(stem, maxWidth - extensionWidth - 1) + "…" + extension
++  return takeStart(stem, maxWidth - extensionWidth - markerWidth) + ellipsis + extension
+ }
+ 
+ function takeStart(value: string, maxWidth: number) {
+diff --git a/packages/tui/src/ui/glyphs.ts b/packages/tui/src/ui/glyphs.ts
+new file mode 100644
+index 0000000000000000000000000000000000000000..f20313f4ce974158bdcca422dc7fc812a6091308
+--- /dev/null
++++ b/packages/tui/src/ui/glyphs.ts
+@@ -0,0 +1,188 @@
++/** Host chrome glyphs. This deliberately does not transform arbitrary text. */
++export type GlyphMode = "auto" | "unicode" | "ascii"
++
++export function glyphMode(value = process.env.CTG_TUI_GLYPHS): GlyphMode {
++  if (value === "ascii" || value === "unicode" || value === "auto") return value
++  return "unicode"
++}
++
++export function asciiGlyphs() {
++  return glyphMode() === "ascii"
++}
++
++/** Replace known OpenCode chrome icons, leaving unknown/user supplied strings unchanged. */
++export function chromeGlyph(value: string) {
++  if (!asciiGlyphs()) return value
++  const replacements: Record<string, string> = {
++    "→": ">",
++    "←": "<",
++    "↳": "`",
++    "↻": "~",
++    "⟳": "~",
++    "✱": "*",
++    "◈": "@",
++    "⚙": "#",
++    "✓": "+",
++    "✗": "x",
++    "×": "x",
++    "•": "*",
++    "●": "*",
++    "▪": "*",
++    "■": "#",
++    "◉": "o",
++    "○": "o",
++    "⇆": "<>",
++    "✕": "x",
++    "⦿": "o",
++    "‹": "<",
++    "⌕": "?",
++    "⊙": "*",
++    "⬖": "*",
++    "⎇": "*",
++    "≡": "=",
++    "▸": ">",
++    "▾": "v",
++    "▼": "v",
++    "▶": ">",
++    "⚠": "!",
++    "◇": "o",
++    "△": "!",
++    "›": ">",
++    "┃": "|",
++    "│": "|",
++    "↑": "^",
++    "↓": "v",
++    "├": "|-",
++    "└": "`-",
++    "─": "-",
++    "…": "...",
++    "·": ".",
++    "−": "-",
++    "—": "-",
++    "’": "'",
++  }
++  return replacements[value] ?? value
++}
++
++/** Static host copy can opt in separately; dynamic/user text is deliberately not normalized. */
++const ASCII_CHROME_LABELS: Record<string, string> = {
++  "Searching…": "Searching...",
++  "Run a command…": "Run a command...",
++  "Ask anything…": "Ask anything...",
++  "Search worktrees…": "Search worktrees...",
++  "Search sessions and projects…": "Search sessions and projects...",
++  "Connecting …": "Connecting ...",
++  "Connecting…": "Connecting...",
++  "Searching sessions…": "Searching sessions...",
++  "Loading sessions…": "Loading sessions...",
++  "Writing debug snapshot…": "Writing debug snapshot...",
++  "Checking for updates…": "Checking for updates...",
++  "Loading skills…": "Loading skills...",
++  "Gathering your stats…": "Gathering your stats...",
++  "Restarting service…": "Restarting service...",
++  "Connection lost…": "Connection lost...",
++  "Receiving code…": "Receiving code...",
++  "Waiting for code…": "Waiting for code...",
++  "Waiting for output…": "Waiting for output...",
++  "Loading worktrees…": "Loading worktrees...",
++  "Refreshing sessions and projects…": "Refreshing sessions and projects...",
++  "Searching sessions and projects…": "Searching sessions and projects...",
++  "Creating worktree…": "Creating worktree...",
++  "Loading server information…": "Loading server information...",
++  "Starting command…": "Starting command...",
++  "Waiting for command to finish…": "Waiting for command to finish...",
++  "Starting authorization…": "Starting authorization...",
++  "Waiting for authorization…": "Waiting for authorization...",
++  "Opening link…": "Opening link...",
++  "Finishing startup…": "Finishing startup...",
++  "Loading plugins…": "Loading plugins...",
++  "Loading image…": "Loading image...",
++  "Loading session history…": "Loading session history...",
++  "Writing command…": "Writing command...",
++  "Fetching from the web…": "Fetching from the web...",
++  "Delegating…": "Delegating...",
++  "Preparing edit…": "Preparing edit...",
++  "Forking session…": "Forking session...",
++  "Installing OpenCode …": "Installing OpenCode ...",
++  "Resolving diff…": "Resolving diff...",
++  "Loading branches…": "Loading branches...",
++  "Choose…": "Choose...",
++  "Loading diff…": "Loading diff...",
++  "processing…": "processing...",
++  "Working…": "Working...",
++  "Search sessions…": "Search sessions...",
++  "Loading output…": "Loading output...",
++  "Searching content…": "Searching content...",
++  "Reading file…": "Reading file...",
++  "Preparing write…": "Preparing write...",
++  "Finding files…": "Finding files...",
++  "Searching web…": "Searching web...",
++  "Asking questions…": "Asking questions...",
++  "Loading skill…": "Loading skill...",
++  "Waiting for permission event…": "Waiting for permission event...",
++  "Waiting…": "Waiting...",
++  "No matching files…": "No matching files...",
++  "Reloading configuration…": "Reloading configuration...",
++  "Unable to read shell output. Retrying…": "Unable to read shell output. Retrying...",
++  "Thinking…": "Thinking...",
++  "Running command…": "Running command...",
++  "Preparing command…": "Preparing command...",
++  "Running code…": "Running code...",
++  "Preparing code…": "Preparing code...",
++  "Report copied — paste it into a new GitHub issue.": "Report copied - paste it into a new GitHub issue.",
++}
++
++export function chromeLabel(value: string) {
++  if (!asciiGlyphs()) return value
++  return ASCII_CHROME_LABELS[value] ?? value
++}
++
++export function chromeEllipsis() {
++  return asciiGlyphs() ? "..." : "…"
++}
++
++export function chromeStatusSeparator() {
++  return asciiGlyphs() ? "|" : "·"
++}
++
++export const ASCII_SPINNER_FRAMES = ["-", "\\", "|", "/"]
++
++export const ASCII_BORDER_CHARS = {
++  topLeft: "+",
++  bottomLeft: "+",
++  vertical: "|",
++  topRight: "+",
++  bottomRight: "+",
++  horizontal: "-",
++  bottomT: "+",
++  topT: "+",
++  cross: "+",
++  leftT: "+",
++  rightT: "+",
++}
++
++export function chromeBorderChars() {
++  return asciiGlyphs() ? { ...ASCII_BORDER_CHARS } : undefined
++}
++
++export const CHROME_GLYPHS = {
++  action: "→",
++  back: "←",
++  continuation: "↳",
++  reconnect: "↻",
++  search: "✱",
++  web: "◈",
++  tool: "⚙",
++  success: "✓",
++  error: "✗",
++  pending: "•",
++  selection: "▪",
++  permission: "△",
++  border: "┃",
++} as const
++
++export const ASCII_LOGO = {
++  left: ["                   ", " O P E N C O D E  ", " O P E N C O D E  ", " O P E N C O D E  "],
++  right: ["                   ", " O P E N C O D E  ", " O P E N C O D E  ", " O P E N C O D E  "],
++  compact: ["    ", " OC ", " OC ", " OC "],
++} as const
+diff --git a/packages/tui/src/ui/spinner.ts b/packages/tui/src/ui/spinner.ts
+index c185ea7b833f2087b4c925aa40feb0b72239a19e..83aa3e97230f3522832f2125bb43c292ae8d4951 100644
+--- a/packages/tui/src/ui/spinner.ts
++++ b/packages/tui/src/ui/spinner.ts
+@@ -1,5 +1,6 @@
+ import type { ColorInput } from "@opentui/core"
+ import { RGBA } from "@opentui/core"
++import { asciiGlyphs } from "./glyphs"
+ import type { ColorGenerator } from "opentui-spinner"
+ 
+ interface AdvancedGradientOptions {
+@@ -311,17 +312,17 @@ export function createFrames(options: KnightRiderOptions = {}): string[] {
+       const index = calculateColorIndex(frameIndex, charIndex, width, trailOptions)
+ 
+       if (style === "diamonds") {
+-        const shapes = ["⬥", "◆", "⬩", "⬪"]
++        const shapes = asciiGlyphs() ? ["*", "#", "o", "+"] : ["⬥", "◆", "⬩", "⬪"]
+         if (index >= 0 && index < trailOptions.colors.length) {
+           return shapes[Math.min(index, shapes.length - 1)]
+         }
+-        return "·"
++        return asciiGlyphs() ? "." : "·"
+       }
+ 
+       // Default to blocks
+       // It's active if we have a valid color index that is within our colors array
+       const isActive = index >= 0 && index < trailOptions.colors.length
+-      return isActive ? "■" : "⬝"
++      return isActive ? (asciiGlyphs() ? "#" : "■") : asciiGlyphs() ? "." : "⬝"
+     }).join("")
+   })
+ 
+diff --git a/packages/tui/src/ui/toast.tsx b/packages/tui/src/ui/toast.tsx
+index 8f44284c2fae13fb1a897d4950416fa3b918c578..b6da5b2f676f2e0502044e69f365c4e557c73f3c 100644
+--- a/packages/tui/src/ui/toast.tsx
++++ b/packages/tui/src/ui/toast.tsx
+@@ -1,6 +1,7 @@
+ import { createContext, createSignal, onCleanup, useContext, type ParentProps, Show } from "solid-js"
+ import { createStore } from "solid-js/store"
+ import { useTheme } from "../context/theme"
++import { chromeGlyph } from "./glyphs"
+ import { useRenderer, useTerminalDimensions } from "@opentui/solid"
+ import { SplitBorder } from "./border"
+ import { TextAttributes } from "@opentui/core"
+@@ -39,7 +40,7 @@ function ToastSurface(props: {
+       attributes={hovered() && props.toast.action ? TextAttributes.BOLD : undefined}
+       fg={hovered() ? theme.text.action.primary.base : theme.text.muted}
+     >
+-      {props.toast.action ? `› ${props.toast.action.label}` : "x"}
++      {props.toast.action ? `${chromeGlyph("›")} ${props.toast.action.label}` : "x"}
+     </text>
+   )
+ 
+diff --git a/packages/tui/src/util/collapse-tool-output.ts b/packages/tui/src/util/collapse-tool-output.ts
+index dbdf6e5a1908cae9afe2ceb0c51f5a57f82dcfd3..f8c07cacf0ff15e1f42ca8612f425b929ccf286b 100644
+--- a/packages/tui/src/util/collapse-tool-output.ts
++++ b/packages/tui/src/util/collapse-tool-output.ts
+@@ -1,3 +1,4 @@
++import { chromeEllipsis } from "../ui/glyphs"
+ import { Locale } from "./locale"
+ import { stringWidth } from "./string-width"
+ 
+@@ -8,14 +9,11 @@ export function collapseToolOutput(output: string, maxLines: number, maxChars: n
+   }
+ 
+   const visible = lines.slice(0, maxLines)
+-  if (lines.length > maxLines && visible.length > 0) visible[visible.length - 1] += "…"
++  if (lines.length > maxLines && visible.length > 0) visible[visible.length - 1] += chromeEllipsis()
+   const preview = visible.join("\n")
+   if (Array.from(preview).length > maxChars) {
+     return {
+-      output:
+-        Array.from(preview)
+-          .slice(0, Math.max(0, maxChars - 1))
+-          .join("") + "…",
++      output: Array.from(preview).slice(0, Math.max(0, maxChars - chromeEllipsis().length)).join("") + chromeEllipsis(),
+       overflow: true,
+     }
+   }
+@@ -77,7 +75,7 @@ function collapseShellCommand(input: string, maxLines: number, lineWidth: number
+     const removed = visible.pop()
+     if (removed !== undefined && removed !== "\n") width -= stringWidth(removed)
+   }
+-  return { output: visible.join("") + "…", overflow, lines }
++  return { output: visible.join("") + chromeEllipsis(), overflow, lines }
+ }
+ 
+ function collapseTail(output: string, maxLines: number, maxChars: number) {
+diff --git a/packages/tui/src/util/error.ts b/packages/tui/src/util/error.ts
+index 33dff7be582228dc7b6b3c634c3bd387f035881f..96cd6c31ca3a82a7d53a3b147f102e04974999c6 100644
+--- a/packages/tui/src/util/error.ts
++++ b/packages/tui/src/util/error.ts
+@@ -1,4 +1,5 @@
+ import { isRecord } from "./record"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+ type ConfigIssue = { message: string; path: string[] }
+ 
+@@ -63,7 +64,7 @@ export function cliErrorMessage(input: unknown): string | undefined {
+       : []
+     return [
+       `Configuration is invalid${path && path !== "config" ? ` at ${path}` : ""}` + (message ? `: ${message}` : ""),
+-      ...issues.map((issue) => "↳ " + issue.message + " " + issue.path.join(".")),
++      ...issues.map((issue) => `${chromeGlyph("↳")} ` + issue.message + " " + issue.path.join(".")),
+     ].join("\n")
+   }
+ 
+diff --git a/packages/tui/src/util/locale.ts b/packages/tui/src/util/locale.ts
+index ac3371eb07959e77e44ab1a7eb3776e8a199642b..4ed4225fbf0147ab9be2eaf0699ccd513b26974d 100644
+--- a/packages/tui/src/util/locale.ts
++++ b/packages/tui/src/util/locale.ts
+@@ -1,4 +1,5 @@
+ import { stringWidth } from "./string-width"
++import { chromeEllipsis, chromeGlyph } from "../ui/glyphs"
+ 
+ export function titlecase(str: string) {
+   return str.replace(/\b\w/g, (c) => c.toUpperCase())
+@@ -13,7 +14,7 @@ export function datetime(input: number): string {
+   const date = new Date(input)
+   const localTime = time(input)
+   const localDate = date.toLocaleDateString()
+-  return `${localTime} · ${localDate}`
++  return `${localTime} ${chromeGlyph("·")} ${localDate}`
+ }
+ 
+ export function number(num: number): string {
+@@ -48,9 +49,10 @@ export function duration(input: number) {
+   return `${days}d ${hours}h`
+ }
+ 
+-export function truncate(str: string, len: number): string {
++export function truncate(str: string, len: number, ellipsis = chromeEllipsis()): string {
+   if (str.length <= len) return str
+-  return str.slice(0, len - 1) + "…"
++  if (len <= ellipsis.length) return ellipsis.slice(0, Math.max(0, len))
++  return str.slice(0, len - ellipsis.length) + ellipsis
+ }
+ 
+ const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" })
+@@ -74,22 +76,24 @@ export function takeWidth(str: string, width: number) {
+   return result.join("")
+ }
+ 
+-export function truncateWidth(str: string, width: number): string {
++export function truncateWidth(str: string, width: number, ellipsis = chromeEllipsis()): string {
+   if (width <= 0) return ""
+   if (stringWidth(str) <= width) return str
+-  if (width === 1) return "…"
+-  return takeWidth(str, width - 1) + "…"
++  const markerWidth = stringWidth(ellipsis)
++  if (width <= markerWidth) return takeWidth(ellipsis, width)
++  return takeWidth(str, width - markerWidth) + ellipsis
+ }
+ 
+-export function truncateLeft(str: string, len: number): string {
++export function truncateLeft(str: string, len: number, ellipsis = chromeEllipsis()): string {
+   if (str.length <= len) return str
+-  return "…" + str.slice(-(len - 1))
++  if (len <= ellipsis.length) return ellipsis.slice(0, Math.max(0, len))
++  return ellipsis + str.slice(-(len - ellipsis.length))
+ }
+ 
+-export function truncateMiddle(str: string, maxLength: number = 35): string {
++export function truncateMiddle(str: string, maxLength: number = 35, ellipsis = chromeEllipsis()): string {
+   if (str.length <= maxLength) return str
+ 
+-  const ellipsis = "…"
++  if (maxLength <= ellipsis.length) return ellipsis.slice(0, maxLength)
+   const keepStart = Math.ceil((maxLength - ellipsis.length) / 2)
+   const keepEnd = Math.floor((maxLength - ellipsis.length) / 2)
+ 
+diff --git a/packages/tui/src/util/marquee.ts b/packages/tui/src/util/marquee.ts
+index 8b9428ed4bde4d3da0a00c9daff970564846a4bc..798fa67117f931c425ebfc2cd5f999fc76945e00 100644
+--- a/packages/tui/src/util/marquee.ts
++++ b/packages/tui/src/util/marquee.ts
+@@ -1,7 +1,8 @@
+ import { Locale } from "./locale"
+ import { stringWidth } from "./string-width"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+-const GAP = " · "
++const GAP = ` ${chromeGlyph("·")} `
+ 
+ export type MarqueeTextPart = {
+   value: string
+@@ -29,7 +30,7 @@ export function marqueeTextParts(value: string, width: number, offset: number):
+ 
+   const loop = [
+     ...Locale.graphemes(value).map((value) => ({ value, separator: false })),
+-    ...Locale.graphemes(GAP).map((value) => ({ value, separator: value === "·" })),
++    ...Locale.graphemes(GAP).map((value) => ({ value, separator: value === chromeGlyph("·") })),
+   ]
+   const cursor = offset % marqueeCycleWidth(value)
+   const parts = [...loop, ...loop]
+diff --git a/packages/tui/src/util/permission.ts b/packages/tui/src/util/permission.ts
+index 09d607ff373ea1075a024b2a14a3aaf522713840..f9bc32c7b380a4bb1e86abfe102c32ba7a7eeeed 100644
+--- a/packages/tui/src/util/permission.ts
++++ b/packages/tui/src/util/permission.ts
+@@ -1,5 +1,6 @@
+ import { Locale } from "./locale"
+ import { canonicalToolName, finiteNumber, webSearchProviderLabel } from "./tool-display"
++import { chromeGlyph } from "../ui/glyphs"
+ 
+ type Dict = Record<string, unknown>
+ 
+@@ -34,7 +35,7 @@ export function permissionPresentation(
+     const first = dict(Array.isArray(metadata.files) ? metadata.files[0] : undefined)
+     const diff = text(first.patch) || text(first.diff) || text(metadata.diff) || undefined
+     return {
+-      icon: "→",
++      icon: chromeGlyph("→"),
+       title: `Edit ${formatPath(file)}`,
+       lines: [],
+       diff,
+@@ -47,7 +48,7 @@ export function permissionPresentation(
+     const value = text(input.path) || resources[0] || ""
+     const title = action === "read" ? "Read" : "List"
+     return {
+-      icon: "→",
++      icon: chromeGlyph("→"),
+       title: `${title} ${formatPath(value)}`,
+       lines: value ? [`Path: ${formatPath(value)}`] : [],
+     }
+@@ -57,7 +58,7 @@ export function permissionPresentation(
+     const pattern = text(input.pattern) || resources[0] || ""
+     const title = action === "glob" ? "Glob" : "Grep"
+     return {
+-      icon: "✱",
++      icon: chromeGlyph("✱"),
+       title: `${title} "${pattern}"`,
+       lines: pattern ? [`Pattern: ${pattern}`] : [],
+     }
+@@ -78,7 +79,7 @@ export function permissionPresentation(
+     return {
+       icon: "#",
+       title: `${Locale.titlecase(agent)} Subagent`,
+-      lines: description ? [`◉ ${description}`] : [],
++      lines: description ? [`${chromeGlyph("◉")} ${description}`] : [],
+     }
+   }
+ 
+@@ -95,7 +96,7 @@ export function permissionPresentation(
+     const query = text(input.query) || text(metadata.query)
+     const title = webSearchProviderLabel(metadata.provider)
+     return {
+-      icon: "◈",
++      icon: chromeGlyph("◈"),
+       title: query ? `${title} "${query}"` : title,
+       lines: query ? [`Query: ${query}`] : [],
+     }
+@@ -108,7 +109,7 @@ export function permissionPresentation(
+     const character = finiteNumber(input.character)
+     const position = line !== undefined && character !== undefined ? `${line}:${character}` : undefined
+     return {
+-      icon: "→",
++      icon: chromeGlyph("→"),
+       title: `LSP ${operation}${file ? ` ${formatPath(file)}${position ? `:${position}` : ""}` : ""}`,
+       lines: [
+         ...(input.operation ? [`Operation: ${operation}`] : []),
+@@ -122,7 +123,7 @@ export function permissionPresentation(
+     const raw = text(metadata.parentDir) || text(metadata.filepath) || resources[0] || ""
+     const directory = wildcardDirectory(raw)
+     return {
+-      icon: "←",
++      icon: chromeGlyph("←"),
+       title: `Access external directory ${formatPath(directory)}`,
+       lines: resources.map((item) => `- ${item}`),
+     }
+@@ -130,14 +131,14 @@ export function permissionPresentation(
+ 
+   if (action === "doom_loop") {
+     return {
+-      icon: "⟳",
++      icon: chromeGlyph("⟳"),
+       title: "Continue after repeated failures",
+       lines: ["This keeps the session running despite repeated failures."],
+     }
+   }
+ 
+   return {
+-    icon: "⚙",
++    icon: chromeGlyph("⚙"),
+     title: `Call tool ${source.action}`,
+     lines: [`Tool: ${source.action}`],
+   }
+diff --git a/packages/tui/src/util/session.ts b/packages/tui/src/util/session.ts
+index c7213e2205edc6d3bf1e068998527722b83fb75a..95f4dd09b2c3cb0e571d3e8ea6b4d673b0ae652a 100644
+--- a/packages/tui/src/util/session.ts
++++ b/packages/tui/src/util/session.ts
+@@ -1,6 +1,7 @@
+ import type { ModelInfo, SessionMessageInfo } from "@opencode/client"
+ import { lastAssistantWithUsage } from "@opencode/client/solid"
+ import { Locale } from "./locale"
++import { asciiGlyphs, chromeGlyph } from "../ui/glyphs"
+ 
+ type SessionNode = {
+   id: string
+@@ -32,10 +33,12 @@ export function sessionFamily<T extends SessionNode>(sessions: readonly T[], ses
+       const prefix =
+         ancestors.length === 0
+           ? ""
+-          : ancestors
++          : asciiGlyphs()
++            ? ancestors.slice(1).map((ancestor) => (ancestor ? "   " : "|  ")).join("") + (last ? "`- " : "|- ")
++            : ancestors
+               .slice(1)
+-              .map((ancestor) => (ancestor ? "   " : "│  "))
+-              .join("") + (last ? "└─ " : "├─ ")
++              .map((ancestor) => (ancestor ? "   " : `${chromeGlyph("│")}  `))
++              .join("") + (last ? `${chromeGlyph("└")}─ ` : `${chromeGlyph("├")}─ `)
+       return [{ session, prefix }, ...walk(session.id, [...ancestors, last])]
+     })
+   }
+diff --git a/packages/tui/test/glyphs.test.ts b/packages/tui/test/glyphs.test.ts
+new file mode 100644
+index 0000000000000000000000000000000000000000..d89b7b9eb18810db774560c3c864a562cb8dc31d
+--- /dev/null
++++ b/packages/tui/test/glyphs.test.ts
+@@ -0,0 +1,207 @@
++import { describe, expect, test } from "bun:test"
++
++describe("host chrome glyph compatibility", () => {
++  test("maps known chrome symbols only in ASCII mode", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { chromeGlyph, chromeLabel, glyphMode } = await import("../src/ui/glyphs")
++    expect(glyphMode()).toBe("ascii")
++    expect(chromeGlyph("✓")).toBe("+")
++    expect(chromeGlyph("✗")).toBe("x")
++    expect(chromeGlyph("◈")).toBe("@")
++    expect(chromeGlyph("┃")).toBe("|")
++    expect(chromeGlyph("·")).toBe(".")
++    expect(chromeGlyph("−")).toBe("-")
++    expect(chromeGlyph("—")).toBe("-")
++    expect(chromeLabel("Searching…")).toBe("Searching...")
++    expect(chromeLabel("literal user title…")).toBe("literal user title…")
++    for (const label of [
++      "Run a command…", "Ask anything…", "Searching…", "Search worktrees…",
++      "Search sessions and projects…", "Connecting …", "Searching sessions…", "Loading sessions…",
++      "Writing debug snapshot…", "Checking for updates…", "Loading skills…", "Gathering your stats…",
++      "Restarting service…", "Connection lost…", "Receiving code…", "Waiting for code…",
++      "Waiting for output…", "Loading worktrees…", "Refreshing sessions and projects…", "Creating worktree…",
++      "Loading server information…", "Starting command…", "Waiting for command to finish…",
++      "Starting authorization…", "Waiting for authorization…", "Opening link…", "Finishing startup…",
++      "Loading plugins…", "Loading image…", "Loading session history…", "Writing command…",
++      "Fetching from the web…", "Delegating…", "Preparing edit…", "Forking session…", "Resolving diff…",
++      "Loading branches…", "Choose…", "Loading diff…", "processing…", "Working…", "Search sessions…",
++      "Loading output…", "Searching content…", "Reading file…", "Preparing write…", "Finding files…",
++      "Searching web…", "Asking questions…", "Loading skill…", "Waiting for permission event…", "Waiting…",
++      "No matching files…",
++    ]) expect(chromeLabel(label)).not.toContain("…")
++    expect(chromeGlyph("model text ✓ stays intact")).toBe("model text ✓ stays intact")
++    for (const glyph of ["→", "←", "↳", "↻", "⟳", "✱", "◈", "⚙", "✓", "✗", "×", "•", "●", "▪", "■", "◉", "△", "›", "┃", "│", "…", "↑", "↓", "├", "└", "─"])
++      expect(chromeGlyph(glyph)).toMatch(/^[\x00-\x7f]+$/)
++  })
++
++  test("selects ASCII spinner and border chrome without changing Unicode defaults", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { SPINNER_FRAMES } = await import("../src/component/spinner-frames")
++    const { SplitBorder, EmptyBorder } = await import("../src/ui/border")
++    expect(SPINNER_FRAMES).toEqual(["-", "\\", "|", "/"])
++    expect(SplitBorder.customBorderChars).toEqual({
++      topLeft: "+", bottomLeft: "+", vertical: "|", topRight: "+", bottomRight: "+",
++      horizontal: "-", bottomT: "+", topT: "+", cross: "+", leftT: "+", rightT: "+",
++    })
++
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    // Border characters are resolved at render time, so explicit Unicode remains intact.
++    expect(SplitBorder.customBorderChars).toEqual({ ...EmptyBorder, vertical: "┃" })
++  })
++
++  test("keeps Unicode by default and supports explicit Unicode", async () => {
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    const { chromeGlyph, glyphMode } = await import("../src/ui/glyphs")
++    expect(glyphMode()).toBe("unicode")
++    expect(chromeGlyph("✓")).toBe("✓")
++    const { spinnerFrames } = await import("../src/component/spinner-frames")
++    expect(spinnerFrames()).toEqual(["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"])
++    delete process.env.CTG_TUI_GLYPHS
++    expect(glyphMode()).toBe("unicode")
++  })
++
++  test("auto is Unicode until the launcher supplies a probe result", async () => {
++    process.env.CTG_TUI_GLYPHS = "auto"
++    const { glyphMode, chromeGlyph } = await import("../src/ui/glyphs")
++    expect(glyphMode()).toBe("auto")
++    expect(chromeGlyph("✓")).toBe("✓")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("permission and session-tree chrome follow ASCII mode", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { permissionPresentation } = await import("../src/util/permission")
++    expect(permissionPresentation({ action: "edit", resources: ["file.ts"] }).icon).toBe(">")
++    const { sessionFamily } = await import("../src/util/session")
++    const family = sessionFamily(
++      [
++        { id: "root" },
++        { id: "child", parentID: "root" },
++        { id: "grandchild", parentID: "child" },
++      ],
++      "grandchild",
++    )
++    expect(family.map((item) => item.prefix)).toEqual(["", "`- "])
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    expect(
++      sessionFamily(
++        [{ id: "root" }, { id: "child", parentID: "root" }, { id: "grandchild", parentID: "child" }],
++        "grandchild",
++      )[1]?.prefix,
++    ).toBe("└─ ")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("full TUI status, truncation, and secondary chrome have ASCII consumers", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { chromeGlyph, chromeStatusSeparator } = await import("../src/ui/glyphs")
++    expect(chromeGlyph("⇆")).toBe("<>")
++    expect(chromeGlyph("✕")).toBe("x")
++    expect(chromeGlyph("⦿")).toBe("o")
++    expect(chromeGlyph("⬖")).toBe("*")
++    expect(chromeGlyph("⌕")).toBe("?")
++    expect(chromeGlyph("↑")).toBe("^")
++    expect(chromeGlyph("↓")).toBe("v")
++    expect(chromeGlyph("⎇")).toBe("*")
++    expect(chromeStatusSeparator()).toBe("|")
++    const { tabUnreadMarker } = await import("../src/component/session-tabs")
++    expect(tabUnreadMarker("small-dot")).toBe("*")
++    expect(tabUnreadMarker("large-square")).toBe("#")
++    const { sessionTabDetail } = await import("../src/context/session-tabs-model")
++    expect(sessionTabDetail("project", "feature", "main", true)).toBe("project * feature")
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    expect(sessionTabDetail("project", "feature", "main", true)).toBe("project ⎇ feature")
++    process.env.CTG_TUI_GLYPHS = "ascii"
++
++    const { chromeEllipsis, chromeBorderChars } = await import("../src/ui/glyphs")
++    expect(chromeEllipsis()).toBe("...")
++    expect(chromeBorderChars()).toEqual({
++      topLeft: "+", bottomLeft: "+", vertical: "|", topRight: "+", bottomRight: "+",
++      horizontal: "-", bottomT: "+", topT: "+", cross: "+", leftT: "+", rightT: "+",
++    })
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("ASCII mode changes generated truncation markers, not source text", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { truncate, truncateWidth, truncateMiddle } = await import("../src/util/locale")
++    const { truncateFilePath } = await import("../src/ui/file-path")
++    const { collapseToolOutput } = await import("../src/util/collapse-tool-output")
++    expect(truncate("αβγδε", 4)).toBe("α...")
++    expect(truncateWidth("αβγδε", 4)).toBe("α...")
++    expect(truncateMiddle("αβγδεζηθ", 7)).toBe("αβ...ηθ")
++    expect(truncateFilePath("/home/alex/projects/éclair.ts", 16)).toContain("...")
++    expect(collapseToolOutput("first\nsecond\nthird", 2, 100).output).toBe("first\nsecond...")
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    expect(truncate("αβγδε", 4)).toBe("αβγ…")
++    expect(truncateWidth("αβγδε", 4)).toBe("αβγ…")
++    expect(truncateFilePath("/home/alex/projects/éclair.ts", 16)).toContain("…")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("ASCII logo artwork is selected by the mounted full-TUI logo consumer", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { ASCII_LOGO, asciiGlyphs } = await import("../src/ui/glyphs")
++    expect(asciiGlyphs()).toBe(true)
++    expect(ASCII_LOGO.left.join("") + ASCII_LOGO.right.join("") + ASCII_LOGO.compact.join("")).toMatch(/^[\x00-\x7f]+$/)
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    expect(asciiGlyphs()).toBe(false)
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("runtime host separators, shell omitted marker, and disclosures are ASCII while values stay intact", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { chromeGlyph } = await import("../src/ui/glyphs")
++    const { shellOutputOmittedLabel } = await import("../src/component/dialog-shell-output")
++    const { activityGroupDisclosureIcon } = await import("../src/routes/session/group-view")
++    const { promptMetadataLayout } = await import("../src/component/prompt/metadata")
++    const { joinPromptFooterStatus } = await import("../src/feature-plugins/prompt/footer")
++    const { datetime } = await import("../src/util/locale")
++    expect(shellOutputOmittedLabel()).toBe("Earlier output omitted . showing recent output")
++    expect(activityGroupDisclosureIcon(true)).toBe("-")
++    expect(activityGroupDisclosureIcon(false)).toBe("+")
++    const metadata = promptMetadataLayout({
++      width: 60, terminalWidth: 80, agent: "agent·name", model: "model−name", provider: "provider", variant: "variant",
++    })
++    expect(metadata.agent).toBe("agent·name")
++    expect(metadata.model).toBe("model−name")
++    expect(joinPromptFooterStatus(["shell·label", "user−value"])).toBe("shell·label . user−value")
++    expect(datetime(Date.UTC(2024, 0, 1))).toContain(" . ")
++    expect("Earlier output omitted · showing recent output".replace("·", chromeGlyph("·"))).toBe("Earlier output omitted . showing recent output")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("visible prompt metadata and marquee separator map chrome without rewriting dynamic values", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { promptMetadataLayout } = await import("../src/component/prompt/metadata")
++    const { marqueeText } = await import("../src/util/marquee")
++    const metadata = promptMetadataLayout({
++      width: 60, terminalWidth: 80, agent: "Agent·Name", model: "Model−Name", provider: "Provider", variant: "Variant",
++    })
++    expect(metadata.agent).toBe("Agent·Name")
++    expect(metadata.model).toBe("Model−Name")
++    expect(marqueeText("input·text", 30, 1)).toBe("input·text")
++    expect(marqueeText("input·text", 5, 7)).toBe("ext .")
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    const unicode = promptMetadataLayout({
++      width: 60, terminalWidth: 80, agent: "Agent", model: "Model", provider: "Provider", variant: "Variant",
++    })
++    expect(unicode.agent).toBe("Agent")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++
++  test("session-list relative-path footer executes its truncation branch in both modes", async () => {
++    process.env.CTG_TUI_GLYPHS = "ascii"
++    const { sessionListRelativePathFooter } = await import("../src/component/dialog-session-list")
++    const relative = "../folder·model−name/feature·with-a-long-path-segment-that-needs-truncation.ts"
++    const ascii = sessionListRelativePathFooter(relative)
++    expect(ascii).toContain("...")
++    expect(ascii).toContain("feature·")
++    expect(ascii).not.toContain("−")
++    process.env.CTG_TUI_GLYPHS = "unicode"
++    const unicode = sessionListRelativePathFooter(relative)
++    expect(unicode).toContain("…")
++    expect(unicode).toContain("feature·")
++    delete process.env.CTG_TUI_GLYPHS
++  })
++})