praxis-agent 0.35.0 → 0.36.0

package/dist/cli/tui/claude-style.js

@@ -5,7 +5,7 @@ import { composerEditorSegments } from './composer-editor.js';
 import { composerLayoutForWidth } from './composer-layout.js';
 import { visiblePatchLines } from './git-diff.js';
 import { TUI_HOOK_MENU } from './hook-settings.js';
-import { tuiPalette, tuiSyntaxStyle, useTuiPalette, } from './theme.js';
+import { resolveTuiTheme, tuiSyntaxStyle, useTuiTheme, } from './theme.js';
 const SPINNER = ['✳', '✢', '✣', '✤', '✥'];
 export function useTerminalWidth(override) {
     const { stdout } = useStdout();
@@ -106,8 +106,13 @@ function selectionPrefix(selected, screenReader) {
         return screenReader ? 'Selected: ' : '  ❯ ';
     return screenReader ? '' : '    ';
 }
+function dashboardSelectionPrefix(selected, screenReader, noColor) {
+    if (selected)
+        return screenReader || noColor ? 'Selected: ' : '❯ ';
+    return screenReader || noColor ? '' : '  ';
+}
 export function WelcomePanel({ display, width, showTips, dataPlane = 'claude', }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     if (!showTips)
         return null;
     const panelWidth = Math.min(100, Math.max(32, width));
@@ -124,7 +129,7 @@ export function WelcomePanel({ display, width, showTips, dataPlane = 'claude', }
     const fill = Math.max(1, panelWidth - title.length - 6);
     const leftWidth = Math.max(12, Math.floor((panelWidth - 4) / 2));
     const rightWidth = Math.max(12, panelWidth - leftWidth - 4);
-    return (_jsxs(Box, { flexDirection: "column", width: panelWidth, children: [_jsxs(Text, { color: palette.muted, children: ['╭───', _jsx(Text, { color: palette.brand, bold: true, children: brand }), ` Code v${display.version} `, _jsx(Text, { dimColor: true, children: '─'.repeat(fill) }), '╮'] }), _jsxs(Box, { borderStyle: "round", borderColor: palette.muted, borderTop: false, flexDirection: wide ? 'row' : 'column', width: panelWidth, paddingX: 1, children: [_jsxs(Box, { alignItems: wide ? 'center' : undefined, flexDirection: "column", width: wide ? leftWidth : '100%', children: [_jsx(Text, { children: " " }), _jsxs(Text, { bold: true, children: ["Welcome to ", brand] }), _jsx(Text, { children: " " }), _jsx(Text, { color: palette.brand, bold: true, children: "\u2590\u259B\u2588\u2588\u2588\u259C\u258C" }), _jsx(Text, { color: palette.brand, children: "\u259D\u259C\u2588\u2588\u2588\u2588\u2588\u259B\u2598" }), _jsx(Text, { color: palette.brand, children: " \u2598\u2598 \u259D\u259D" }), _jsx(Text, { children: " " }), _jsxs(Text, { wrap: "truncate-end", children: [model, effort] }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: cwd })] }), _jsxs(Box, { flexDirection: "column", width: wide ? rightWidth : '100%', marginTop: wide ? 0 : 1, children: [_jsx(Text, { bold: true, children: "Get started" }), _jsxs(Text, { wrap: "truncate-end", children: ["/init to create ", dataPlane === 'native' ? 'PRAXIS.md' : 'CLAUDE.md'] }), _jsx(Text, { wrap: "truncate-end", children: "/config to open settings" }), _jsx(Text, { dimColor: true, children: " " }), _jsx(Text, { bold: true, children: dataPlane === 'native'
+    return (_jsxs(Box, { flexDirection: "column", width: panelWidth, children: [_jsxs(Text, { ...theme.text.muted, children: ['╭───', _jsx(Text, { ...theme.text.productIdentity, bold: true, children: brand }), ` Code v${display.version} `, _jsx(Text, { dimColor: true, children: '─'.repeat(fill) }), '╮'] }), _jsxs(Box, { borderStyle: "round", ...theme.surface.neutralBorder, borderTop: false, flexDirection: wide ? 'row' : 'column', width: panelWidth, paddingX: 1, children: [_jsxs(Box, { alignItems: wide ? 'center' : undefined, flexDirection: "column", width: wide ? leftWidth : '100%', children: [_jsx(Text, { children: " " }), _jsxs(Text, { bold: true, children: ["Welcome to ", brand] }), _jsx(Text, { children: " " }), _jsx(Text, { ...theme.text.productIdentity, bold: true, children: "\u2590\u259B\u2588\u2588\u2588\u259C\u258C" }), _jsx(Text, { ...theme.text.productIdentity, children: "\u259D\u259C\u2588\u2588\u2588\u2588\u2588\u259B\u2598" }), _jsx(Text, { ...theme.text.productIdentity, children: " \u2598\u2598 \u259D\u259D" }), _jsx(Text, { children: " " }), _jsxs(Text, { wrap: "truncate-end", children: [model, effort] }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: cwd })] }), _jsxs(Box, { flexDirection: "column", width: wide ? rightWidth : '100%', marginTop: wide ? 0 : 1, children: [_jsx(Text, { bold: true, children: "Get started" }), _jsxs(Text, { wrap: "truncate-end", children: ["/init to create ", dataPlane === 'native' ? 'PRAXIS.md' : 'CLAUDE.md'] }), _jsx(Text, { wrap: "truncate-end", children: "/config to open settings" }), _jsx(Text, { dimColor: true, children: " " }), _jsx(Text, { bold: true, children: dataPlane === 'native'
                                     ? 'Stored by Praxis'
                                     : 'Shared with Claude Code' }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Sessions \u00B7 memory \u00B7 skills" })] })] })] }));
 }
@@ -132,12 +137,12 @@ export function WelcomePanel({ display, width, showTips, dataPlane = 'claude', }
 // conversation content. Keeps the same product/model/cwd facts as WelcomePanel
 // in a small fixed footprint, truncating every line to the supplied width.
 export function SessionIdentity({ display, width, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const identityWidth = Math.max(1, Math.floor(width));
     const model = display.model ?? 'provider default';
     const effort = display.effort ? ` · ${display.effort} effort` : '';
     const cwd = compactPath(display.cwd);
-    return (_jsxs(Box, { flexDirection: "column", width: identityWidth, children: [_jsx(Text, { wrap: "truncate-end", children: _jsx(Text, { color: palette.brand, bold: true, children: `Praxis Code v${display.version}` }) }), _jsxs(Text, { wrap: "truncate-end", children: [model, effort] }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: cwd })] }));
+    return (_jsxs(Box, { flexDirection: "column", width: identityWidth, children: [_jsx(Text, { wrap: "truncate-end", children: _jsx(Text, { ...theme.text.productIdentity, bold: true, children: `Praxis Code v${display.version}` }) }), _jsxs(Text, { wrap: "truncate-end", children: [model, effort] }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: cwd })] }));
 }
 const INLINE_SEGMENT_CACHE_MAX = 4096;
 const inlineSegmentCache = new Map();
@@ -168,14 +173,14 @@ function cachedInlineSegments(text) {
     }
     return segments;
 }
-function inlineTextElement(text, palette) {
+function inlineTextElement(text, theme) {
     return (_jsx(Text, { children: cachedInlineSegments(text).map((segment, index) => {
             if (segment.kind === 'code')
-                return (_jsx(Text, { color: palette.info, children: segment.text }, index));
+                return (_jsx(Text, { ...theme.text.info, children: segment.text }, index));
             if (segment.kind === 'bold')
                 return (_jsx(Text, { bold: true, children: segment.text }, index));
             if (segment.kind === 'link')
-                return (_jsx(Text, { color: palette.link, underline: true, children: segment.text }, index));
+                return (_jsx(Text, { ...theme.text.link, underline: true, children: segment.text }, index));
             return segment.text;
         }) }));
 }
@@ -211,35 +216,40 @@ function cachedMarkdownLineShape(line) {
     return shape;
 }
 const ELEMENT_CACHE_KEY_SEPARATOR = String.fromCharCode(0);
-function markdownLineStyleSignature(palette) {
-    return [palette.accent, palette.brand, palette.info, palette.link].join(ELEMENT_CACHE_KEY_SEPARATOR);
+function markdownLineStyleSignature(theme) {
+    return [
+        theme.text.focusMarker.color,
+        theme.text.productIdentity.color,
+        theme.text.info.color,
+        theme.text.link.color,
+    ].join(ELEMENT_CACHE_KEY_SEPARATOR);
 }
 const MARKDOWN_LINE_ELEMENT_CACHE_MAX = 4096;
 const markdownLineElementCache = new Map();
-function buildMarkdownLine(line, palette) {
+function buildMarkdownLine(line, theme) {
     const shape = cachedMarkdownLineShape(line);
     if (shape.role === 'h3')
-        return _jsx(Text, { bold: true, children: inlineTextElement(shape.content, palette) });
+        return _jsx(Text, { bold: true, children: inlineTextElement(shape.content, theme) });
     if (shape.role === 'h2')
-        return (_jsx(Text, { bold: true, color: palette.accent, children: inlineTextElement(shape.content, palette) }));
+        return (_jsx(Text, { bold: true, ...theme.text.focusMarker, children: inlineTextElement(shape.content, theme) }));
     if (shape.role === 'h1')
-        return (_jsx(Text, { bold: true, color: palette.brand, children: inlineTextElement(shape.content, palette) }));
+        return (_jsx(Text, { bold: true, ...theme.text.productIdentity, children: inlineTextElement(shape.content, theme) }));
     if (shape.role === 'bullet')
-        return (_jsxs(Text, { children: ['  • ', inlineTextElement(shape.content, palette)] }));
+        return (_jsxs(Text, { children: ['  • ', inlineTextElement(shape.content, theme)] }));
     if (shape.role === 'ordered')
-        return (_jsxs(Text, { children: ['  ', inlineTextElement(shape.content, palette)] }));
+        return (_jsxs(Text, { children: ['  ', inlineTextElement(shape.content, theme)] }));
     if (shape.role === 'quote')
-        return (_jsxs(Text, { dimColor: true, children: ['│ ', inlineTextElement(shape.content, palette)] }));
+        return (_jsxs(Text, { dimColor: true, children: ['│ ', inlineTextElement(shape.content, theme)] }));
     if (shape.role === 'plain')
-        return inlineTextElement(shape.content, palette);
+        return inlineTextElement(shape.content, theme);
     return _jsx(Text, { children: " " });
 }
-function cachedMarkdownLineElement(line, palette) {
-    const key = [line, markdownLineStyleSignature(palette)].join(ELEMENT_CACHE_KEY_SEPARATOR);
+function cachedMarkdownLineElement(line, theme) {
+    const key = [line, markdownLineStyleSignature(theme)].join(ELEMENT_CACHE_KEY_SEPARATOR);
     const cached = markdownLineElementCache.get(key);
     if (cached)
         return cached;
-    const element = buildMarkdownLine(line, palette);
+    const element = buildMarkdownLine(line, theme);
     markdownLineElementCache.set(key, element);
     if (markdownLineElementCache.size > MARKDOWN_LINE_ELEMENT_CACHE_MAX) {
         const oldest = markdownLineElementCache.keys().next().value;
@@ -271,6 +281,7 @@ const CODE_KEYWORDS = new Set([
 const CODE_TOKEN_PATTERN = /("(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\b(?:async|await|class|const|else|export|false|from|function|if|import|let|new|null|return|true|undefined|var)\b|\b[A-Za-z_$][\w$]*(?=\s*\())/gu;
 const SYNTAX_TOKEN_CACHE_MAX = 2048;
 const syntaxTokenCache = new Map();
+const syntaxStyleSignatureCache = new WeakMap();
 function cachedSyntaxTokens(text) {
     const cached = syntaxTokenCache.get(text);
     if (cached)
@@ -293,37 +304,42 @@ function cachedSyntaxTokens(text) {
     }
     return tokens;
 }
-function syntaxStyleSignature(palette) {
-    const syntax = palette.syntax;
-    return [
-        palette.syntaxHighlightingDisabled ? '1' : '0',
-        syntax.text,
-        syntax.keyword,
-        syntax.identifier,
-        syntax.string,
-        syntax.removedBackground ?? '',
-        syntax.addedBackground ?? '',
+function syntaxStyleSignature(theme) {
+    const cached = syntaxStyleSignatureCache.get(theme);
+    if (cached)
+        return cached;
+    const signature = [
+        theme.syntaxHighlightingDisabled ? '1' : '0',
+        JSON.stringify(theme.syntax('text')),
+        JSON.stringify(theme.syntax('keyword')),
+        JSON.stringify(theme.syntax('identifier')),
+        JSON.stringify(theme.syntax('string')),
+        JSON.stringify(theme.syntax('text', 'removed')),
+        JSON.stringify(theme.syntax('text', 'added')),
+        JSON.stringify(theme.syntax('addedHighlight')),
     ].join(ELEMENT_CACHE_KEY_SEPARATOR);
+    syntaxStyleSignatureCache.set(theme, signature);
+    return signature;
 }
 const SYNTAX_LINE_ELEMENT_CACHE_MAX = 4096;
 const syntaxLineElementCache = new Map();
-function buildSyntaxCodeLine(text, prefix, change, palette) {
-    if (palette.syntaxHighlightingDisabled) {
+function buildSyntaxCodeLine(text, prefix, change, theme) {
+    if (theme.syntaxHighlightingDisabled) {
         return (_jsxs(Text, { children: [prefix, text || ' '] }));
     }
-    const lineStyle = tuiSyntaxStyle(palette, 'text', change);
+    const lineStyle = tuiSyntaxStyle(theme, 'text', change);
     return (_jsxs(Text, { children: [prefix, _jsx(Text, { ...lineStyle, children: cachedSyntaxTokens(text).map(({ kind, token }, index) => {
                     if (kind === 'text')
                         return token;
-                    return (_jsx(Text, { ...tuiSyntaxStyle(palette, kind), children: token }, index));
+                    return (_jsx(Text, { ...tuiSyntaxStyle(theme, kind), children: token }, index));
                 }) })] }));
 }
-function cachedSyntaxCodeLine(text, prefix, change, palette) {
-    const key = [text, prefix, change ?? '', syntaxStyleSignature(palette)].join(ELEMENT_CACHE_KEY_SEPARATOR);
+function cachedSyntaxCodeLine(text, prefix, change, theme) {
+    const key = [text, prefix, change ?? '', syntaxStyleSignature(theme)].join(ELEMENT_CACHE_KEY_SEPARATOR);
     const cached = syntaxLineElementCache.get(key);
     if (cached)
         return cached;
-    const element = buildSyntaxCodeLine(text, prefix, change, palette);
+    const element = buildSyntaxCodeLine(text, prefix, change, theme);
     syntaxLineElementCache.set(key, element);
     if (syntaxLineElementCache.size > SYNTAX_LINE_ELEMENT_CACHE_MAX) {
         const oldest = syntaxLineElementCache.keys().next().value;
@@ -333,14 +349,12 @@ function cachedSyntaxCodeLine(text, prefix, change, palette) {
     return element;
 }
 function SyntaxCodeLine({ text, prefix = '', change, }) {
-    const palette = useTuiPalette();
-    return cachedSyntaxCodeLine(text, prefix, change, palette);
+    const theme = useTuiTheme();
+    return cachedSyntaxCodeLine(text, prefix, change, theme);
 }
 function ToolResultText({ text, prefix = '', }) {
-    const palette = useTuiPalette();
-    return (_jsx(Box, { flexDirection: "column", children: text.split('\n').map((line, index) => line.startsWith('+') && !line.startsWith('+++') ? (_jsx(SyntaxCodeLine, { prefix: index === 0 ? prefix : prefix ? '   ' : '', text: line, change: "added" }, index)) : line.startsWith('-') && !line.startsWith('---') ? (_jsx(SyntaxCodeLine, { prefix: index === 0 ? prefix : prefix ? '   ' : '', text: line, change: "removed" }, index)) : (_jsxs(Text, { ...(line.startsWith('@@')
-                ? { color: palette.info }
-                : { dimColor: true }), children: [index === 0 ? prefix : prefix ? '   ' : '', line || ' '] }, index))) }));
+    const theme = useTuiTheme();
+    return (_jsx(Box, { flexDirection: "column", children: text.split('\n').map((line, index) => line.startsWith('+') && !line.startsWith('+++') ? (_jsx(SyntaxCodeLine, { prefix: index === 0 ? prefix : prefix ? '   ' : '', text: line, change: "added" }, index)) : line.startsWith('-') && !line.startsWith('---') ? (_jsx(SyntaxCodeLine, { prefix: index === 0 ? prefix : prefix ? '   ' : '', text: line, change: "removed" }, index)) : (_jsxs(Text, { ...(line.startsWith('@@') ? theme.text.info : { dimColor: true }), children: [index === 0 ? prefix : prefix ? '   ' : '', line || ' '] }, index))) }));
 }
 function inputString(call, key) {
     const value = call.input[key];
@@ -362,7 +376,7 @@ function toolHeading(call) {
     return call.name;
 }
 function ToolTranscriptEntry({ call, detail, result, detailed, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const displayResult = call.name === 'Read' &&
         result?.text.startsWith('Wasted call — file unchanged since your last Read')
         ? 'Unchanged since last read'
@@ -380,15 +394,24 @@ function ToolTranscriptEntry({ call, detail, result, detailed, }) {
         : displayResult;
     const oldLines = contentLines(inputString(call, 'old_string'));
     const newLines = contentLines(inputString(call, 'new_string'));
-    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: palette.accent, children: "\u23FA" }), ' ', _jsx(Text, { bold: true, children: toolHeading(call) })] }), !['Bash', 'Read', 'Edit'].includes(call.name) && detail ? (_jsxs(Text, { dimColor: true, children: [" ", detail] })) : null, result ? (_jsx(Box, { marginLeft: 2, flexDirection: "column", children: result.isError ? (_jsxs(Text, { color: palette.error, children: ["\u23BF Error: ", errorText] })) : call.name === 'Edit' ? (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ["\u23BF Added ", newLines.length, " line", newLines.length === 1 ? '' : 's', ", removed ", oldLines.length, " line", oldLines.length === 1 ? '' : 's'] }), detailed &&
+    const markerStyle = result
+        ? result.isError
+            ? theme.text.error
+            : theme.text.success
+        : theme.text.active;
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { children: [_jsx(Text, { ...markerStyle, children: "\u23FA" }), ' ', _jsx(Text, { ...theme.text.heading, bold: true, children: toolHeading(call) })] }), !['Bash', 'Read', 'Edit'].includes(call.name) && detail ? (_jsxs(Text, { dimColor: true, children: [" ", detail] })) : null, result ? (_jsx(Box, { marginLeft: 2, flexDirection: "column", children: result.isError ? (_jsxs(Text, { ...theme.text.error, children: ["\u23BF Error: ", errorText] })) : call.name === 'Edit' ? (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ["\u23BF Added ", newLines.length, " line", newLines.length === 1 ? '' : 's', ", removed ", oldLines.length, " line", oldLines.length === 1 ? '' : 's'] }), detailed &&
                             oldLines.map((line, index) => (_jsx(SyntaxCodeLine, { prefix: `   ${index + 1} -`, text: line, change: "removed" }, `old-${index}`))), detailed &&
                             newLines.map((line, index) => (_jsx(SyntaxCodeLine, { prefix: `   ${index + 1} +`, text: line, change: "added" }, `new-${index}`)))] })) : resultIsDiff ? (_jsx(ToolResultText, { text: visible.join('\n'), prefix: "\u23BF " })) : (_jsxs(_Fragment, { children: [visible.map((line, index) => (_jsxs(Text, { dimColor: true, children: [index === 0 ? '⎿ ' : '   ', line || ' '] }, index))), hidden > 0 ? (_jsxs(Text, { dimColor: true, children: ['   ', "\u2026 +", hidden, " lines (ctrl+o to expand)"] })) : null] })) })) : null] }));
 }
 function ThinkingBlock({ text, active, expanded, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const summary = text.replace(/\s+/gu, ' ').trim();
     const showFull = screenReader || active || expanded;
-    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { ...(!screenReader ? { color: palette.accent } : {}), dimColor: !screenReader, italic: !screenReader, children: [screenReader ? 'Thinking:' : '✻ ', active ? 'Thinking…' : 'Thought for a moment', !showFull && summary ? ` · ${summary.slice(0, 160)}` : ''] }), showFull && text ? (_jsx(Box, { marginLeft: screenReader ? 0 : 2, flexDirection: "column", children: _jsx(MarkdownText, { text: text }) })) : !screenReader && summary.length > 160 ? (_jsx(Text, { dimColor: true, children: " ctrl+o to expand thinking" })) : null] }));
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { ...(active
+                    ? theme.text.active
+                    : !screenReader
+                        ? theme.text.focusMarker
+                        : {}), dimColor: !screenReader, italic: !screenReader, children: [screenReader ? 'Thinking:' : '✻ ', active ? 'Thinking…' : 'Thought for a moment', !showFull && summary ? ` · ${summary.slice(0, 160)}` : ''] }), showFull && text ? (_jsx(Box, { marginLeft: screenReader ? 0 : 2, flexDirection: "column", children: _jsx(MarkdownText, { text: text }) })) : !screenReader && summary.length > 160 ? (_jsx(Text, { dimColor: true, children: " ctrl+o to expand thinking" })) : null] }));
 }
 function compactTokens(tokens) {
     if (tokens >= 1_000_000)
@@ -401,16 +424,17 @@ function percent(tokens, total) {
     return `${Math.round((tokens / Math.max(1, total)) * 100 * 10) / 10}%`;
 }
 function ContextUsageBlock({ usedTokens, contextWindowTokens, model, skills, memoryFiles, screenReader, }) {
+    const theme = useTuiTheme();
     const totalTokens = Math.max(1, contextWindowTokens);
     const compactBuffer = Math.round(totalTokens * 0.165);
     const usable = Math.max(1, totalTokens - compactBuffer);
     if (screenReader) {
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: "Context Usage" }), _jsxs(Text, { children: [model ?? 'provider default', " \u00B7 ", usedTokens.toLocaleString(), "/", totalTokens.toLocaleString(), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsxs(Text, { children: ["Autocompact buffer: ", compactBuffer.toLocaleString(), " tokens"] }), _jsxs(Text, { children: ["Skills: ", skills.map(({ name }) => name).join(', ') || 'none'] })] }));
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { ...theme.text.heading, children: "Context Usage" }), _jsxs(Text, { children: [model ?? 'provider default', " \u00B7 ", usedTokens.toLocaleString(), "/", totalTokens.toLocaleString(), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsxs(Text, { children: ["Autocompact buffer: ", compactBuffer.toLocaleString(), " tokens"] }), _jsxs(Text, { children: ["Skills: ", skills.map(({ name }) => name).join(', ') || 'none'] })] }));
     }
     const usedCells = Math.min(25, Math.round((usedTokens / totalTokens) * 25));
     const bufferCells = Math.min(25 - usedCells, Math.round((compactBuffer / totalTokens) * 25));
     const cells = Array.from({ length: 25 }, (_, index) => index < usedCells ? '⛁' : index >= 25 - bufferCells ? '⛝' : '⛶');
-    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, marginLeft: 2, children: [_jsx(Text, { bold: true, children: "Context Usage" }), _jsxs(Box, { children: [_jsx(Box, { flexDirection: "column", marginRight: 2, children: Array.from({ length: 5 }, (_, row) => (_jsx(Text, { children: cells.slice(row * 5, row * 5 + 5).join(' ') }, row))) }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { dimColor: true, children: [model ?? 'provider default', " \u00B7 ", compactTokens(usedTokens), "/", compactTokens(totalTokens), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, italic: true, children: "Estimated usage by category" }), _jsxs(Text, { children: ["\u26C1 Messages and other context: ", compactTokens(usedTokens), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsxs(Text, { children: ["\u26F6 Free space: ", compactTokens(Math.max(0, usable - usedTokens)), " (", percent(Math.max(0, usable - usedTokens), totalTokens), ")"] }), _jsxs(Text, { children: ["\u26DD Autocompact buffer: ", compactTokens(compactBuffer), " tokens (", percent(compactBuffer, totalTokens), ")"] })] })] }), _jsx(Text, { children: " " }), _jsx(Text, { bold: true, children: "Memory files \u00B7 /memory" }), memoryFiles.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u2514 No memory files" })) : (memoryFiles.map((file, index) => (_jsxs(Text, { dimColor: true, children: [index === memoryFiles.length - 1 ? '└' : '├', " ", file.path, ":", ' ', file.tokens, " tokens"] }, file.path)))), _jsx(Text, { children: " " }), _jsx(Text, { bold: true, children: "Skills \u00B7 /skills" }), _jsx(Text, { children: " " }), _jsx(Text, { children: "Loaded" }), skills.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u2514 No skills loaded" })) : (skills.map((skill, index) => (_jsxs(Text, { dimColor: true, children: [index === skills.length - 1 ? '└' : '├', " ", skill.name, ": ~", skill.tokens, " tokens"] }, skill.name))))] }));
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, marginLeft: 2, children: [_jsx(Text, { ...theme.text.heading, bold: true, children: "Context Usage" }), _jsxs(Box, { children: [_jsx(Box, { flexDirection: "column", marginRight: 2, children: Array.from({ length: 5 }, (_, row) => (_jsx(Text, { children: cells.slice(row * 5, row * 5 + 5).join(' ') }, row))) }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { dimColor: true, children: [model ?? 'provider default', " \u00B7 ", compactTokens(usedTokens), "/", compactTokens(totalTokens), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, italic: true, children: "Estimated usage by category" }), _jsxs(Text, { children: ["\u26C1 Messages and other context: ", compactTokens(usedTokens), " tokens (", percent(usedTokens, totalTokens), ")"] }), _jsxs(Text, { children: ["\u26F6 Free space: ", compactTokens(Math.max(0, usable - usedTokens)), " (", percent(Math.max(0, usable - usedTokens), totalTokens), ")"] }), _jsxs(Text, { children: ["\u26DD Autocompact buffer: ", compactTokens(compactBuffer), " tokens (", percent(compactBuffer, totalTokens), ")"] })] })] }), _jsx(Text, { children: " " }), _jsx(Text, { ...theme.text.heading, bold: true, children: "Memory files \u00B7 /memory" }), memoryFiles.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u2514 No memory files" })) : (memoryFiles.map((file, index) => (_jsxs(Text, { dimColor: true, children: [index === memoryFiles.length - 1 ? '└' : '├', " ", file.path, ":", ' ', file.tokens, " tokens"] }, file.path)))), _jsx(Text, { children: " " }), _jsx(Text, { ...theme.text.heading, bold: true, children: "Skills \u00B7 /skills" }), _jsx(Text, { children: " " }), _jsx(Text, { children: "Loaded" }), skills.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u2514 No skills loaded" })) : (skills.map((skill, index) => (_jsxs(Text, { dimColor: true, children: [index === skills.length - 1 ? '└' : '├', " ", skill.name, ": ~", skill.tokens, " tokens"] }, skill.name))))] }));
 }
 const MARKDOWN_TEXT_CACHE_MAX = 2048;
 const markdownTextCache = new Map();
@@ -439,33 +463,30 @@ function cachedMarkdownText(text) {
     }
     return parsed;
 }
-function markdownTextStyleSignature(palette) {
-    return [
-        syntaxStyleSignature(palette),
-        markdownLineStyleSignature(palette),
-    ].join(ELEMENT_CACHE_KEY_SEPARATOR);
+function markdownTextStyleSignature(theme) {
+    return [syntaxStyleSignature(theme), markdownLineStyleSignature(theme)].join(ELEMENT_CACHE_KEY_SEPARATOR);
 }
 const MARKDOWN_TEXT_ELEMENT_CACHE_MAX = 4096;
 const markdownTextElementCache = new Map();
-function buildMarkdownText(text, palette) {
+function buildMarkdownText(text, theme) {
     return (_jsx(Box, { flexDirection: "column", children: cachedMarkdownText(text).map((line, index) => {
             if (line.type === 'fence-open')
                 return (_jsx(Text, { dimColor: true, children: `╭─ ${line.label}` }, index));
             if (line.type === 'fence-close')
                 return (_jsx(Text, { dimColor: true, children: '╰─' }, index));
             if (line.type === 'code')
-                return cloneElement(cachedSyntaxCodeLine(line.text, '│ ', undefined, palette), { key: index });
-            return cloneElement(cachedMarkdownLineElement(line.line, palette), {
+                return cloneElement(cachedSyntaxCodeLine(line.text, '│ ', undefined, theme), { key: index });
+            return cloneElement(cachedMarkdownLineElement(line.line, theme), {
                 key: index,
             });
         }) }));
 }
-function cachedMarkdownTextElement(text, palette) {
-    const key = [text, markdownTextStyleSignature(palette)].join(ELEMENT_CACHE_KEY_SEPARATOR);
+function cachedMarkdownTextElement(text, theme) {
+    const key = [text, markdownTextStyleSignature(theme)].join(ELEMENT_CACHE_KEY_SEPARATOR);
     const cached = markdownTextElementCache.get(key);
     if (cached)
         return cached;
-    const element = buildMarkdownText(text, palette);
+    const element = buildMarkdownText(text, theme);
     markdownTextElementCache.set(key, element);
     if (markdownTextElementCache.size > MARKDOWN_TEXT_ELEMENT_CACHE_MAX) {
         const oldest = markdownTextElementCache.keys().next().value;
@@ -475,8 +496,8 @@ function cachedMarkdownTextElement(text, palette) {
     return element;
 }
 export function MarkdownText({ text }) {
-    const palette = useTuiPalette();
-    return cachedMarkdownTextElement(text, palette);
+    const theme = useTuiTheme();
+    return cachedMarkdownTextElement(text, theme);
 }
 // Bounded streaming-text presentation. While a turn is in progress the active
 // assistant text grows on every frame; re-parsing the entire Markdown document
@@ -517,7 +538,7 @@ function ActiveStreamText({ text }) {
     return (_jsxs(Box, { flexDirection: "column", children: [truncated ? _jsx(Text, { dimColor: true, children: "\u2026 earlier streaming content \u2026" }) : null, stableText ? _jsx(MarkdownText, { text: stableText }) : null, pendingText ? _jsx(Text, { children: pendingText }) : null] }));
 }
 export function Transcript({ entries, activeText, activeThinking = '', activeStreamVisible = true, thinkingExpanded = false, detailedTranscript = false, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const detailed = thinkingExpanded || detailedTranscript;
     return (_jsxs(Box, { flexDirection: "column", children: [entries.map((entry, index) => {
                 if (entry.kind === 'read-summary') {
@@ -525,16 +546,16 @@ export function Transcript({ entries, activeText, activeThinking = '', activeStr
                 }
                 const item = entry.item;
                 if (item.kind === 'user') {
-                    return (_jsxs(Box, { marginTop: index === 0 ? 0 : 1, children: [_jsx(Text, { color: palette.brand, bold: true, children: screenReader ? 'You: ' : '❯ ' }), _jsx(Text, { bold: true, children: item.text })] }, entry.key));
+                    return (_jsxs(Box, { marginTop: index === 0 ? 0 : 1, children: [_jsx(Text, { ...theme.text.productIdentity, bold: true, children: screenReader ? 'You: ' : '❯ ' }), _jsx(Text, { bold: true, children: item.text })] }, entry.key));
                 }
                 if (item.kind === 'assistant') {
-                    return (_jsxs(Box, { marginTop: 1, children: [screenReader ? _jsx(Text, { children: "Praxis:" }) : null, !screenReader ? _jsx(Text, { color: palette.accent, children: "\u23FA " }) : null, _jsx(MarkdownText, { text: item.text })] }, entry.key));
+                    return (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { ...theme.text.heading, children: "Praxis:" })) : null, !screenReader ? (_jsx(Text, { ...theme.text.focusMarker, children: "\u23FA " })) : null, _jsx(MarkdownText, { text: item.text })] }, entry.key));
                 }
                 if (item.kind === 'thinking') {
                     return (_jsx(ThinkingBlock, { text: item.text, active: false, expanded: detailed, screenReader: screenReader }, entry.key));
                 }
                 if (item.kind === 'compact') {
-                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: palette.accent, italic: true, children: screenReader
+                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { ...theme.text.focusMarker, italic: true, children: screenReader
                                     ? 'Conversation compacted'
                                     : '✻ Conversation compacted (ctrl+o for history)' }), detailed ? (_jsx(Box, { marginLeft: screenReader ? 0 : 2, children: _jsx(MarkdownText, { text: item.summary }) })) : null] }, entry.key));
                 }
@@ -548,7 +569,7 @@ export function Transcript({ entries, activeText, activeThinking = '', activeStr
                 }
                 if (item.kind === 'tool-result') {
                     const text = item.text.length > 500 ? `${item.text.slice(0, 497)}...` : item.text;
-                    return (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [_jsx(Text, { color: item.isError ? palette.error : palette.muted, children: item.isError ? '└ Error' : '└ Result' }), item.isError ? (_jsx(Text, { color: palette.error, children: text })) : (_jsx(ToolResultText, { text: text }))] }, entry.key));
+                    return (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [_jsx(Text, { ...(item.isError ? theme.text.error : theme.text.muted), children: item.isError ? '└ Error' : '└ Result' }), item.isError ? (_jsx(Text, { ...theme.text.error, children: text })) : (_jsx(ToolResultText, { text: text }))] }, entry.key));
                 }
                 if (item.kind === 'shell') {
                     const result = entry.kind === 'shell' ? entry.result : undefined;
@@ -564,20 +585,20 @@ export function Transcript({ entries, activeText, activeThinking = '', activeStr
                     const lines = contentLines(output);
                     const visible = detailed || screenReader ? lines : lines.slice(0, 3);
                     const hidden = lines.length - visible.length;
-                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { children: _jsxs(Text, { bold: true, children: [screenReader ? 'Shell command: ' : '! ', item.command] }) }), result ? (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [lines.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u23BF " })) : (visible.map((line, lineIndex) => (_jsxs(Text, { ...(result.isError ? { color: palette.error } : {}), dimColor: !result.isError, children: [lineIndex === 0 ? '⎿ ' : '   ', line || ' '] }, lineIndex)))), hidden > 0 ? (_jsxs(Text, { dimColor: true, children: ['   ', "\u2026 +", hidden, " lines (ctrl+o to expand)"] })) : null] })) : null] }, entry.key));
+                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { children: _jsxs(Text, { bold: true, children: [screenReader ? 'Shell command: ' : '! ', item.command] }) }), result ? (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [lines.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u23BF " })) : (visible.map((line, lineIndex) => (_jsxs(Text, { ...(result.isError ? theme.text.error : {}), dimColor: !result.isError, children: [lineIndex === 0 ? '⎿ ' : '   ', line || ' '] }, lineIndex)))), hidden > 0 ? (_jsxs(Text, { dimColor: true, children: ['   ', "\u2026 +", hidden, " lines (ctrl+o to expand)"] })) : null] })) : null] }, entry.key));
                 }
                 if (item.kind === 'shell-result') {
                     const output = [item.stdout, item.stderr].filter(Boolean).join('\n');
-                    return (_jsxs(Text, { ...(item.isError ? { color: palette.error } : {}), children: ["\u23BF ", output] }, entry.key));
+                    return (_jsxs(Text, { ...(item.isError ? theme.text.error : {}), children: ["\u23BF ", output] }, entry.key));
                 }
                 if (item.kind === 'local-result') {
                     return (_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { dimColor: true, children: ["\u23BF ", item.text] }) }, entry.key));
                 }
-                return (_jsxs(Text, { ...(item.kind === 'warning' ? { color: palette.error } : {}), dimColor: item.kind === 'notice', children: [item.kind === 'warning' ? '⚠ ' : '· ', item.text] }, entry.key));
-            }), activeStreamVisible && activeThinking ? (_jsx(ThinkingBlock, { text: activeThinking, active: true, expanded: detailed, screenReader: screenReader })) : activeStreamVisible && activeText ? (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { children: "Praxis: " })) : (_jsx(Text, { color: palette.accent, children: "\u2733 " })), screenReader ? (_jsx(MarkdownText, { text: activeText })) : (_jsx(ActiveStreamText, { text: activeText }))] })) : null] }));
+                return (_jsxs(Text, { ...(item.kind === 'warning' ? theme.text.error : {}), dimColor: item.kind === 'notice', children: [item.kind === 'warning' ? '⚠ ' : '· ', item.text] }, entry.key));
+            }), activeStreamVisible && activeThinking ? (_jsx(ThinkingBlock, { text: activeThinking, active: true, expanded: detailed, screenReader: screenReader })) : activeStreamVisible && activeText ? (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { ...theme.text.active, children: "Praxis: " })) : (_jsx(Text, { ...theme.text.active, children: "\u2733 " })), screenReader ? (_jsx(MarkdownText, { text: activeText })) : (_jsx(ActiveStreamText, { text: activeText }))] })) : null] }));
 }
 export function DiffDashboard({ snapshots, sourceIndex, selectedIndex, viewingFile, scrollOffset, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const source = snapshots[sourceIndex];
     const snapshot = source?.snapshot ?? { files: [], additions: 0, deletions: 0 };
     const selected = snapshot.files[selectedIndex];
@@ -585,11 +606,12 @@ export function DiffDashboard({ snapshots, sourceIndex, selectedIndex, viewingFi
     const line = '─'.repeat(panelWidth);
     if (viewingFile && selected) {
         const lines = visiblePatchLines(selected.patch).slice(scrollOffset, scrollOffset + 18);
-        return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsx(Text, { bold: true, children: " Uncommitted changes (git diff HEAD)" }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { inverse: !screenReader && index === sourceIndex, children: [screenReader && index === sourceIndex ? 'Current source: ' : ' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { bold: true, children: [" ", selected.path] }), !screenReader ? (_jsxs(Text, { dimColor: true, children: [" ", '─'.repeat(Math.max(1, panelWidth - 4))] })) : null, lines.map((patchLine, index) => patchLine.startsWith('+') && !patchLine.startsWith('+++') ? (_jsx(SyntaxCodeLine, { prefix: "  ", text: patchLine, change: "added" }, `${scrollOffset}-${index}`)) : patchLine.startsWith('-') && !patchLine.startsWith('---') ? (_jsx(SyntaxCodeLine, { prefix: "  ", text: patchLine, change: "removed" }, `${scrollOffset}-${index}`)) : (_jsxs(Text, { dimColor: true, children: ['  ', patchLine] }, `${scrollOffset}-${index}`))), _jsx(Text, { dimColor: true, children: " \u2191/\u2193 to scroll \u00B7 Esc to back" })] }));
+        return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Uncommitted changes (git diff HEAD)"] }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { ...(index === sourceIndex ? theme.text.selectedTab : {}), children: [screenReader && index === sourceIndex ? 'Current source: ' : ' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', selected.path] }), !screenReader ? (_jsxs(Text, { dimColor: true, children: [" ", '─'.repeat(Math.max(1, panelWidth - 4))] })) : null, lines.map((patchLine, index) => patchLine.startsWith('+') && !patchLine.startsWith('+++') ? (_jsx(SyntaxCodeLine, { prefix: "  ", text: patchLine, change: "added" }, `${scrollOffset}-${index}`)) : patchLine.startsWith('-') && !patchLine.startsWith('---') ? (_jsx(SyntaxCodeLine, { prefix: "  ", text: patchLine, change: "removed" }, `${scrollOffset}-${index}`)) : (_jsxs(Text, { dimColor: true, children: ['  ', patchLine] }, `${scrollOffset}-${index}`))), _jsx(Text, { dimColor: true, children: " \u2191/\u2193 to scroll \u00B7 Esc to back" })] }));
     }
-    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsx(Text, { bold: true, children: " Uncommitted changes (git diff HEAD)" }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { inverse: !screenReader && index === sourceIndex, children: [screenReader && index === sourceIndex ? 'Current source: ' : ' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshot.files.length, " file", snapshot.files.length === 1 ? '' : 's', ' ', "changed ", _jsxs(Text, { color: palette.success, children: ["+", snapshot.additions] }), ' ', _jsxs(Text, { color: palette.error, children: ["-", snapshot.deletions] })] }), _jsx(Text, { children: " " }), snapshot.files.length === 0 ? (_jsx(Text, { dimColor: true, children: " No uncommitted changes." })) : (snapshot.files.map((file, index) => (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [selectionPrefix(index === selectedIndex, screenReader), file.path, ' ', _jsxs(Text, { ...(!screenReader ? { color: palette.success } : {}), children: ["+", file.additions] }), ' ', _jsxs(Text, { ...(!screenReader ? { color: palette.error } : {}), children: ["-", file.deletions] })] }, file.path)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192 to switch source \u00B7 \u2191/\u2193 to select \u00B7 Enter to view \u00B7 Esc to close" })] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Uncommitted changes (git diff HEAD)"] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { ...(index === sourceIndex ? theme.text.selectedTab : {}), children: [screenReader && index === sourceIndex ? 'Current source: ' : ' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshot.files.length, " file", snapshot.files.length === 1 ? '' : 's', ' ', "changed ", _jsxs(Text, { ...theme.text.diffAdded, children: ["+", snapshot.additions] }), ' ', _jsxs(Text, { ...theme.text.diffRemoved, children: ["-", snapshot.deletions] })] }), _jsx(Text, { children: " " }), snapshot.files.length === 0 ? (_jsx(Text, { dimColor: true, children: " No uncommitted changes." })) : (snapshot.files.map((file, index) => (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [selectionPrefix(index === selectedIndex, screenReader), file.path, ' ', _jsxs(Text, { ...(!screenReader ? theme.text.diffAdded : {}), children: ["+", file.additions] }), ' ', _jsxs(Text, { ...(!screenReader ? theme.text.diffRemoved : {}), children: ["-", file.deletions] })] }, file.path)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192 to switch source \u00B7 \u2191/\u2193 to select \u00B7 Enter to view \u00B7 Esc to close" })] }));
 }
 export function PermissionDashboard({ tabIndex, selectedIndex, query, rules, recentDenied, retryingDeniedId, workspaceDirectories, width, screenReader, }) {
+    const theme = useTuiTheme();
     const tabs = ['Recently denied', 'Allow', 'Ask', 'Deny', 'Workspace'];
     const behavior = ['allow', 'ask', 'deny'][tabIndex - 1];
     const normalizedQuery = query.trim().toLowerCase();
@@ -613,7 +635,9 @@ export function PermissionDashboard({ tabIndex, selectedIndex, query, rules, rec
                 : tabIndex === 3
                     ? 'Praxis Code will reject requests to use denied tools.'
                     : 'Praxis Code can read files in the workspace, and make edits when auto-accept edits is on.';
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsx(Text, { bold: true, children: " Permissions" }), _jsxs(Text, { children: ['  ', tabs.map((tab, index) => (_jsxs(Text, { inverse: !screenReader && index === tabIndex, children: [screenReader && index === tabIndex ? 'Current tab: ' : ' ', tab, ' '] }, tab)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: [" ", description] }), tabIndex >= 1 && tabIndex <= 3 ? (_jsx(Box, { borderStyle: screenReader ? undefined : 'round', paddingX: 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: [screenReader ? 'Search: ' : '⌕ ', query || 'Search…'] }) })) : (_jsx(Text, { children: " " })), tabIndex >= 1 && tabIndex <= 3 ? (['Add a new rule…', ...rows].map((row, index) => (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", row] }, `${index}-${row}`)))) : tabIndex === 0 ? (recentDenied.map((action, index) => (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", action.id === retryingDeniedId ? '✔' : '✘', ' ', action.display, action.id === retryingDeniedId ? ' (retry)' : '', action.reason ? `  ${action.reason}` : ''] }, action.id)))) : tabIndex === 4 ? (_jsxs(_Fragment, { children: [originalWorkspace ? (_jsxs(Text, { children: ['    -  ', originalWorkspace.path, " (Original working directory)"] })) : null, additionalWorkspaces.map((directory, index) => (_jsxs(Text, { inverse: !screenReader && selectedIndex === index, children: [selectionPrefix(selectedIndex === index, screenReader), index + 1, ". ", directory.path] }, directory.path))), _jsxs(Text, { inverse: !screenReader && selectedIndex === additionalWorkspaces.length, children: [selectionPrefix(selectedIndex === additionalWorkspaces.length, screenReader), additionalWorkspaces.length + 1, ". Add directory\u2026"] })] })) : rows.length > 0 ? (rows.map((row, index) => (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", row] }, `${index}-${row}`)))) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: tabIndex === 0 && recentDenied.length > 0
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsxs(Text, { ...theme.text.navigation, bold: true, children: [' ', "Permissions"] }), _jsxs(Text, { children: ['  ', tabs.map((tab, index) => (_jsxs(Text, { ...(index === tabIndex ? theme.text.selectedTab : {}), children: [screenReader && index === tabIndex ? 'Current tab: ' : ' ', tab, ' '] }, tab)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: [" ", description] }), tabIndex >= 1 && tabIndex <= 3 ? (_jsx(Box, { borderStyle: screenReader ? undefined : 'round', paddingX: 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: [screenReader ? 'Search: ' : '⌕ ', query || 'Search…'] }) })) : (_jsx(Text, { children: " " })), tabIndex >= 1 && tabIndex <= 3 ? (['Add a new rule…', ...rows].map((row, index) => (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", row] }, `${index}-${row}`)))) : tabIndex === 0 ? (recentDenied.map((action, index) => (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", action.id === retryingDeniedId ? '✔' : '✘', ' ', action.display, action.id === retryingDeniedId ? ' (retry)' : '', action.reason ? `  ${action.reason}` : ''] }, action.id)))) : tabIndex === 4 ? (_jsxs(_Fragment, { children: [originalWorkspace ? (_jsxs(Text, { children: ['    -  ', originalWorkspace.path, " (Original working directory)"] })) : null, additionalWorkspaces.map((directory, index) => (_jsxs(Text, { ...(selectedIndex === index ? theme.text.selectedRow : {}), children: [selectionPrefix(selectedIndex === index, screenReader), index + 1, ". ", directory.path] }, directory.path))), _jsxs(Text, { ...(selectedIndex === additionalWorkspaces.length
+                            ? theme.text.selectedRow
+                            : {}), children: [selectionPrefix(selectedIndex === additionalWorkspaces.length, screenReader), additionalWorkspaces.length + 1, ". Add directory\u2026"] })] })) : rows.length > 0 ? (rows.map((row, index) => (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [selectionPrefix(index === selectedIndex, screenReader), index + 1, ". ", row] }, `${index}-${row}`)))) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: tabIndex === 0 && recentDenied.length > 0
                     ? 'Enter to approve · r to retry · ↑/↓ to navigate · Esc to cancel'
                     : selectedIndex >= 0
                         ? '↑/↓ navigate · Enter to select · ←/→ to switch · Esc to cancel'
@@ -629,6 +653,7 @@ const THEME_OPTIONS = [
     { theme: 'light-ansi', label: 'Light mode (ANSI colors only)' },
 ];
 export function ThemePicker({ currentTheme, selectedIndex, syntaxHighlightingDisabled, customThemes = [], allowCustomThemes = true, width, screenReader, }) {
+    const theme = useTuiTheme();
     const options = [
         ...THEME_OPTIONS.map((option) => ({ ...option, customTheme: undefined })),
         ...customThemes.map((theme) => ({
@@ -648,43 +673,45 @@ export function ThemePicker({ currentTheme, selectedIndex, syntaxHighlightingDis
             ? 'dark'
             : (selected?.theme ??
                 (currentTheme.startsWith('custom:') ? 'dark' : currentTheme));
-    const preview = tuiPalette(previewTheme, syntaxHighlightingDisabled, process.env, selectedCustomTheme);
-    const syntax = preview.syntax;
-    const syntaxColor = (color) => syntaxHighlightingDisabled ? {} : { color };
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { children: '▔'.repeat(Math.min(100, width)) }) : null, _jsx(Text, { bold: true, children: " Theme" }), _jsx(Text, { children: " " }), _jsx(Text, { children: " Choose the text style that looks best with your terminal" }), _jsx(Text, { children: " " }), options.map((option, index) => screenReader ? (_jsxs(Text, { children: [index + 1, ". ", option.label, option.theme === currentTheme ? ' (current)' : '', index === selectedIndex ? ' (focused)' : ''] }, option.theme)) : (_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? ' ❯ ' : '   ', index + 1, ". ", option.label, option.theme === currentTheme ? ' ✔' : ''] }, option.theme))), _jsx(Text, { children: " " }), screenReader ? (_jsxs(Text, { children: ["Selected: ", options[selectedIndex]?.label] })) : null, !screenReader ? (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: [' ', '╌'.repeat(Math.max(1, Math.min(96, width - 3)))] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 1 " }), _jsx(Text, { ...syntaxColor(syntax.keyword), children: "function" }), _jsx(Text, { ...syntaxColor(syntax.text), children: " " }), _jsx(Text, { ...syntaxColor(syntax.identifier), children: "greet" }), _jsxs(Text, { ...syntaxColor(syntax.text), children: ["() ", '{'] })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 2 - " }), _jsx(Text, { ...syntaxColor(syntax.text), ...(syntaxHighlightingDisabled || !syntax.removedBackground
-                                    ? {}
-                                    : { backgroundColor: syntax.removedBackground }), children: ' console.log("Hello, World!"); ' })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 2 + " }), _jsxs(Text, { ...syntaxColor(syntax.text), ...(syntaxHighlightingDisabled || !syntax.addedBackground
-                                    ? {}
-                                    : { backgroundColor: syntax.addedBackground }), children: [' console.', _jsx(Text, { ...syntaxColor(syntax.identifier), children: "log" }), '(', _jsx(Text, { ...syntaxColor(syntax.string), children: "\"Hello, " }), _jsx(Text, { ...(syntaxHighlightingDisabled || !syntax.addedHighlight
-                                            ? {}
-                                            : { backgroundColor: syntax.addedHighlight }), children: "Claude" }), _jsx(Text, { ...syntaxColor(syntax.string), children: "!\"" }), '); '] })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 3 " }), _jsx(Text, { ...syntaxColor(syntax.text), children: '}' })] }), _jsxs(Text, { dimColor: true, children: [' ', '╌'.repeat(Math.max(1, Math.min(96, width - 3)))] })] })) : null, _jsxs(Text, { dimColor: true, children: [' ', selected?.theme === '__new__'
+    const preview = resolveTuiTheme({
+        theme: previewTheme,
+        syntaxHighlightingDisabled,
+        ...(selectedCustomTheme === undefined
+            ? {}
+            : { customTheme: selectedCustomTheme }),
+    }, { environment: process.env, screenReader });
+    const syntaxColor = (token, change) => preview.syntax(token, change);
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { children: '▔'.repeat(Math.min(100, width)) }) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Theme"] }), _jsx(Text, { children: " " }), _jsx(Text, { children: " Choose the text style that looks best with your terminal" }), _jsx(Text, { children: " " }), options.map((option, index) => screenReader ? (_jsxs(Text, { children: [index + 1, ". ", option.label, option.theme === currentTheme ? ' (current)' : '', index === selectedIndex ? ' (focused)' : ''] }, option.theme)) : (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [index === selectedIndex ? ' ❯ ' : '   ', index + 1, ". ", option.label, option.theme === currentTheme ? ' ✔' : ''] }, option.theme))), _jsx(Text, { children: " " }), screenReader ? (_jsxs(Text, { children: ["Selected: ", options[selectedIndex]?.label] })) : null, !screenReader ? (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: [' ', '╌'.repeat(Math.max(1, Math.min(96, width - 3)))] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 1 " }), _jsx(Text, { ...syntaxColor('keyword'), children: "function" }), _jsx(Text, { ...syntaxColor('text'), children: " " }), _jsx(Text, { ...syntaxColor('identifier'), children: "greet" }), _jsx(Text, { ...syntaxColor('text'), children: '() {' })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 2 - " }), _jsx(Text, { ...syntaxColor('text', 'removed'), children: ' console.log("Hello, World!"); ' })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 2 + " }), _jsxs(Text, { ...syntaxColor('text', 'added'), children: [' console.', _jsx(Text, { ...syntaxColor('identifier'), children: "log" }), '(', _jsx(Text, { ...syntaxColor('string'), children: "\"Hello, " }), _jsx(Text, { ...syntaxColor('addedHighlight'), children: "Claude" }), _jsx(Text, { ...syntaxColor('string'), children: "!\"" }), '); '] })] }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " 3 " }), _jsx(Text, { ...syntaxColor('text'), children: '}' })] }), _jsxs(Text, { dimColor: true, children: [' ', '╌'.repeat(Math.max(1, Math.min(96, width - 3)))] })] })) : null, _jsxs(Text, { dimColor: true, children: [' ', selected?.theme === '__new__'
                         ? 'Enter to create a custom theme'
                         : syntaxHighlightingDisabled
                             ? 'Syntax highlighting disabled (ctrl+t to enable)'
                             : `Syntax theme: ${preview.syntaxTheme} (ctrl+t to disable)`] }), _jsx(Text, { dimColor: true, children: " Enter to select \u00B7 Esc to cancel" })] }));
 }
 export function CustomThemeEditor({ theme, token, value, tokens = [], selectedIndex = 0, query = '', width, screenReader, }) {
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [_jsx(Text, { bold: true, children: theme.name }), token ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsxs(Text, { children: ["\u2588\u2588 ", token] }), _jsxs(Text, { dimColor: true, children: ["preset: ", value || '(not customized)'] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ["Value: ", value] }), _jsx(Text, { dimColor: true, children: "Accepts rgb(r,g,b), #rrggbb, ansi256(n), or ansi:name" }), _jsx(Text, { dimColor: true, children: "Enter to save \u00B7 Esc to cancel" })] })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ["\u2315 ", query || 'Filter color tokens…'] }), tokens
+    const semanticTheme = useTuiTheme();
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [_jsx(Text, { ...semanticTheme.text.heading, bold: true, children: theme.name }), token ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsxs(Text, { children: ["\u2588\u2588 ", token] }), _jsxs(Text, { dimColor: true, children: ["preset: ", value || '(not customized)'] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ["Value: ", value] }), _jsx(Text, { dimColor: true, children: "Accepts rgb(r,g,b), #rrggbb, ansi256(n), or ansi:name" }), _jsx(Text, { dimColor: true, children: "Enter to save \u00B7 Esc to cancel" })] })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ["\u2315 ", query || 'Filter color tokens…'] }), tokens
                         .slice(selectedIndex, selectedIndex + 8)
-                        .map((entry, index) => (_jsxs(Text, { inverse: index === 0, children: [index === 0 ? '❯ ' : '  ', "\u2588\u2588 ", entry, theme.overrides[entry] === undefined ? '' : ' (custom)'] }, entry))), _jsx(Text, { dimColor: true, children: "\u2191/\u2193 to nav \u00B7 Enter to edit \u00B7 Tab to reset \u00B7 Esc to done" })] })), screenReader ? _jsx(Text, { children: "Editing custom theme token" }) : null] }));
+                        .map((entry, index) => (_jsxs(Text, { ...(index === 0 ? semanticTheme.text.selectedRow : {}), children: [dashboardSelectionPrefix(index === 0, screenReader, semanticTheme.noColor), "\u2588\u2588 ", entry, theme.overrides[entry] === undefined ? '' : ' (custom)'] }, entry))), _jsx(Text, { dimColor: true, children: "\u2191/\u2193 to nav \u00B7 Enter to edit \u00B7 Tab to reset \u00B7 Esc to done" })] })), screenReader ? _jsx(Text, { children: "Editing custom theme token" }) : null] }));
 }
 export function ListDashboard({ title, rows, emptyText, selectedIndex, width, screenReader, }) {
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsxs(Text, { bold: true, children: [" ", title] }), _jsx(Text, { children: " " }), rows.length === 0 ? (_jsxs(Text, { dimColor: true, children: [" ", emptyText] })) : (rows.map((row, index) => (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', row.label] }), row.description ? _jsxs(Text, { dimColor: true, children: [" ", row.description] }) : null] }, `${index}-${row.label}`)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2191/\u2193 to select \u00B7 Esc to close" })] }));
+    const theme = useTuiTheme();
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', title] }), _jsx(Text, { children: " " }), rows.length === 0 ? (_jsxs(Text, { dimColor: true, children: [" ", emptyText] })) : (rows.map((row, index) => (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [dashboardSelectionPrefix(index === selectedIndex, screenReader, theme.noColor), row.label] }), row.description ? _jsxs(Text, { dimColor: true, children: [" ", row.description] }) : null] }, `${index}-${row.label}`)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2191/\u2193 to select \u00B7 Esc to close" })] }));
 }
 export function MemoryDashboard({ autoMemoryEnabled, entries, selectedIndex, openedIndex, loading = false, width, screenReader, dataPlane = 'claude', }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const panelWidth = Math.min(100, width);
-    return (_jsxs(Box, { flexDirection: "column", width: panelWidth, children: [!screenReader ? (_jsx(Text, { color: palette.accent, children: '─'.repeat(panelWidth) })) : null, _jsx(Text, { bold: true, children: " Memory" }), _jsx(Text, { children: " " }), loading ? (_jsx(Text, { dimColor: true, children: " \u2736 Loading memory files\u2026" })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { children: [" Auto-memory: ", autoMemoryEnabled ? 'on' : 'off'] }), _jsx(Text, { children: " " }), entries.map((entry, index) => (_jsxs(Box, { children: [_jsx(Box, { width: Math.max(24, Math.min(52, panelWidth - 28)), children: _jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', index + 1, ". ", entry.label, openedIndex === index ? ' ✔' : ''] }) }), entry.annotation ? (_jsx(Text, { dimColor: true, children: entry.annotation })) : null] }, `${entry.kind}-${entry.path}`)))] })), _jsx(Text, { children: " " }), dataPlane === 'claude' ? (_jsxs(Text, { dimColor: true, children: [' ', "Learn more: https://code.claude.com/docs/en/memory"] })) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, italic: true, children: "Enter to confirm \u00B7 Esc to cancel" })] }));
+    return (_jsxs(Box, { flexDirection: "column", width: panelWidth, children: [!screenReader ? (_jsx(Text, { ...theme.text.focusMarker, children: '─'.repeat(panelWidth) })) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Memory"] }), _jsx(Text, { children: " " }), loading ? (_jsx(Text, { dimColor: true, children: " \u2736 Loading memory files\u2026" })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { children: [" Auto-memory: ", autoMemoryEnabled ? 'on' : 'off'] }), _jsx(Text, { children: " " }), entries.map((entry, index) => (_jsxs(Box, { children: [_jsx(Box, { width: Math.max(24, Math.min(52, panelWidth - 28)), children: _jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [dashboardSelectionPrefix(index === selectedIndex, screenReader, theme.noColor), index + 1, ". ", entry.label, openedIndex === index ? ' ✔' : ''] }) }), entry.annotation ? (_jsx(Text, { dimColor: true, children: entry.annotation })) : null] }, `${entry.kind}-${entry.path}`)))] })), _jsx(Text, { children: " " }), dataPlane === 'claude' ? (_jsxs(Text, { dimColor: true, children: [' ', "Learn more: https://code.claude.com/docs/en/memory"] })) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, italic: true, children: "Enter to confirm \u00B7 Esc to cancel" })] }));
 }
 function selectedWindow(length, selectedIndex, size) {
     return Math.max(0, Math.min(selectedIndex - Math.floor(size / 2), Math.max(0, length - size)));
 }
 export function HookDashboard({ configuration, depth, eventIndex, matcherIndex, hookIndex, width, screenReader, }) {
+    const theme = useTuiTheme();
     const event = configuration.events[eventIndex];
     const matcher = event?.matchers[matcherIndex];
     const hook = matcher?.hooks[hookIndex];
     if (depth === 'detail') {
-        return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(12, Math.min(100, width))) })) : null, _jsx(Text, { bold: true, children: " Hook details" }), _jsxs(Text, { children: [" Event: ", event?.name ?? 'Hooks'] }), _jsxs(Text, { children: [" Matcher: ", matcher?.matcher ?? '(all)'] }), _jsxs(Text, { children: [" Type: ", hook?.type ?? 'command'] }), _jsxs(Text, { children: [" Source: ", hook?.scopeLabel ?? 'Settings'] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: [" ", hook?.label ?? ''] }), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "Esc to go back" })] }));
+        return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(12, Math.min(100, width))) })) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Hook details"] }), _jsxs(Text, { children: [" Event: ", event?.name ?? 'Hooks'] }), _jsxs(Text, { children: [" Matcher: ", matcher?.matcher ?? '(all)'] }), _jsxs(Text, { children: [" Type: ", hook?.type ?? 'command'] }), _jsxs(Text, { children: [" Source: ", hook?.scopeLabel ?? 'Settings'] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: [" ", hook?.label ?? ''] }), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "Esc to go back" })] }));
     }
     const rows = depth === 'events'
         ? configuration.events
@@ -700,7 +727,7 @@ export function HookDashboard({ configuration, depth, eventIndex, matcherIndex,
     const start = selectedWindow(rows.length, selectedIndex, maxVisible);
     const visible = rows.slice(start, start + maxVisible);
     const line = '─'.repeat(Math.max(12, Math.min(100, width)));
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Text, { bold: true, children: [' ', depth === 'events'
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', depth === 'events'
                         ? TUI_HOOK_MENU.title
                         : depth === 'matchers'
                             ? `${event?.name ?? 'Hooks'} - Matchers`
@@ -711,7 +738,7 @@ export function HookDashboard({ configuration, depth, eventIndex, matcherIndex,
                 const selected = index === selectedIndex;
                 if (depth === 'events') {
                     const item = row;
-                    return (_jsxs(Box, { children: [_jsx(Box, { width: 30, children: _jsxs(Text, { inverse: !screenReader && selected, children: [screenReader && selected
+                    return (_jsxs(Box, { children: [_jsx(Box, { width: 30, children: _jsxs(Text, { ...(selected ? theme.text.selectedRow : {}), children: [screenReader && selected
                                             ? 'Selected: '
                                             : selected
                                                 ? '❯ '
@@ -721,14 +748,14 @@ export function HookDashboard({ configuration, depth, eventIndex, matcherIndex,
                 }
                 if (depth === 'matchers') {
                     const item = row;
-                    return (_jsxs(Text, { inverse: !screenReader && selected, children: [screenReader && selected
+                    return (_jsxs(Text, { ...(selected ? theme.text.selectedRow : {}), children: [screenReader && selected
                                 ? 'Selected: '
                                 : selected
                                     ? '❯ '
                                     : '  ', index + 1, ". [", item.scope, "] ", item.matcher, " ", item.hooks.length, ' ', item.hooks.length === 1 ? 'hook' : 'hooks'] }, `${item.scope}-${item.matcher}-${index}`));
                 }
                 const item = row;
-                return (_jsxs(Box, { children: [_jsx(Box, { flexGrow: 1, children: _jsxs(Text, { inverse: !screenReader && selected, wrap: "truncate-end", children: [screenReader && selected
+                return (_jsxs(Box, { children: [_jsx(Box, { flexGrow: 1, children: _jsxs(Text, { ...(selected ? theme.text.selectedRow : {}), wrap: "truncate-end", children: [screenReader && selected
                                         ? 'Selected: '
                                         : selected
                                             ? '❯ '
@@ -738,7 +765,7 @@ export function HookDashboard({ configuration, depth, eventIndex, matcherIndex,
                     : 'Enter to confirm · Esc to cancel' })] }));
 }
 export function BtwPanel({ entries, selectedIndex, scrollOffset, copied, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const selected = entries[selectedIndex];
     const lines = selected?.answer.split('\n') ?? [];
     const visibleLines = lines.slice(scrollOffset, scrollOffset + 16);
@@ -762,22 +789,22 @@ export function BtwPanel({ entries, selectedIndex, scrollOffset, copied, width,
         ].join(' · ');
     return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, entries.map((entry, index) => (_jsxs(Text, { dimColor: index !== selectedIndex, children: ['  ', "/btw ", entry.question] }, entry.id))), _jsx(Text, { children: " " }), selected?.status === 'answering' ? (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [" ", '  ', "\u00B7 Answering\u2026"] }), selected.answer
                         ? visibleLines.map((line, index) => (_jsxs(Text, { children: [' ', '  ', line || ' '] }, `${scrollOffset + index}-${line}`)))
-                        : null] })) : selected?.status === 'forking' ? (_jsxs(Text, { children: [" ", '  ', "\u00B7 Forking\u2026"] })) : selected?.status === 'error' ? (_jsxs(Text, { color: palette.error, children: [' ', '  ', selected.error ?? 'Side question failed'] })) : (visibleLines.map((line, index) => (_jsxs(Text, { children: [' ', '  ', line || ' '] }, `${scrollOffset + index}-${line}`)))), _jsx(Text, { children: " " }), _jsxs(Text, { dimColor: true, children: [" ", footer] })] }));
+                        : null] })) : selected?.status === 'forking' ? (_jsxs(Text, { children: [" ", '  ', "\u00B7 Forking\u2026"] })) : selected?.status === 'error' ? (_jsxs(Text, { ...theme.text.error, children: [' ', '  ', selected.error ?? 'Side question failed'] })) : (visibleLines.map((line, index) => (_jsxs(Text, { children: [' ', '  ', line || ' '] }, `${scrollOffset + index}-${line}`)))), _jsx(Text, { children: " " }), _jsxs(Text, { dimColor: true, children: [" ", footer] })] }));
 }
 export function SessionPicker({ sessions, selectedIndex, screenReader, query = '', }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const maxVisible = 8;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), sessions.length - maxVisible));
     const visible = sessions.slice(start, start + maxVisible);
-    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: '─'.repeat(80) }) : null, _jsx(Text, { bold: true, children: " Resume session" }), _jsx(Box, { borderStyle: screenReader ? undefined : 'round', borderColor: palette.muted, paddingX: screenReader ? 0 : 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: ["\u2315 ", query || 'Search…'] }) }), start > 0 ? _jsxs(Text, { dimColor: true, children: [" \u2191 ", start, " earlier"] }) : null, visible.length === 0 ? _jsx(Text, { dimColor: true, children: "No sessions found." }) : null, visible.map((session, visibleIndex) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: '─'.repeat(80) }) : null, _jsxs(Text, { ...theme.text.heading, bold: true, children: [' ', "Resume session"] }), _jsx(Box, { borderStyle: screenReader ? undefined : 'round', ...theme.surface.neutralBorder, paddingX: screenReader ? 0 : 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: ["\u2315 ", query || 'Search…'] }) }), start > 0 ? _jsxs(Text, { dimColor: true, children: [" \u2191 ", start, " earlier"] }) : null, visible.length === 0 ? _jsx(Text, { dimColor: true, children: "No sessions found." }) : null, visible.map((session, visibleIndex) => {
                 const index = start + visibleIndex;
-                return (_jsxs(Box, { children: [_jsxs(Text, { ...(index === selectedIndex ? { color: palette.brand } : {}), bold: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', session
+                return (_jsxs(Box, { children: [_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), bold: index === selectedIndex, children: [dashboardSelectionPrefix(index === selectedIndex, screenReader, theme.noColor), session
                                     ? (session.name ?? session.lastPrompt ?? 'Untitled')
                                     : 'Start a new session'] }), session ? (_jsxs(Text, { dimColor: true, children: [' ', "\u00B7 ", session.sessionId, " \u00B7 ", session.status] })) : null] }, session?.sessionId ?? 'new'));
             }), start + visible.length < sessions.length ? (_jsxs(Text, { dimColor: true, children: [" \u2193 ", sessions.length - start - visible.length, " more"] })) : null, !screenReader ? (_jsx(Text, { dimColor: true, children: "\u2191/\u2193 to navigate \u00B7 Enter to select \u00B7 Type to search \u00B7 Esc to cancel" })) : null] }));
 }
 export function CommandPalette({ commands, selectedIndex, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const paletteWidth = Math.max(1, Math.min(100, width));
     const nameWidth = Math.min(30, paletteWidth);
     const descriptionWidth = Math.max(0, paletteWidth - nameWidth);
@@ -790,19 +817,21 @@ export function CommandPalette({ commands, selectedIndex, width, screenReader, }
     return (_jsx(Box, { flexDirection: "column", width: paletteWidth, children: visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No matching commands." })) : (visible.map((command, visibleIndex) => {
             const index = start + visibleIndex;
             const selected = index === selectedIndex;
-            return (_jsxs(Box, { flexDirection: "row", width: paletteWidth, children: [_jsx(Box, { width: nameWidth, flexShrink: 0, children: _jsxs(Text, { wrap: "truncate-end", ...(selected ? { color: palette.brand, bold: true } : {}), children: ["/", command.name] }) }), _jsx(Box, { width: descriptionWidth, flexShrink: 1, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: command.description }) })] }, command.name));
+            return (_jsxs(Box, { flexDirection: "row", width: paletteWidth, children: [_jsx(Box, { width: nameWidth, flexShrink: 0, children: _jsxs(Text, { wrap: "truncate-end", ...(selected ? theme.text.selectedRow : {}), children: ["/", command.name] }) }), _jsx(Box, { width: descriptionWidth, flexShrink: 1, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: command.description }) })] }, command.name));
         })) }));
 }
 export function FilePicker({ entries, selectedIndex, width, screenReader, }) {
+    const theme = useTuiTheme();
     const maxVisible = 12;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, entries.length - maxVisible)));
     const visible = entries.slice(start, start + maxVisible);
     return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No matching files." })) : (visible.map((entry, visibleIndex) => {
             const index = start + visibleIndex;
-            return (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [screenReader && index === selectedIndex ? 'Selected: ' : '+ ', entry.path] }, entry.path));
+            return (_jsxs(Text, { ...(index === selectedIndex ? theme.text.selectedRow : {}), children: [screenReader && index === selectedIndex ? 'Selected: ' : '+ ', entry.path] }, entry.path));
         })) }));
 }
 export function MentionPicker({ entries, selectedIndex, width, screenReader, }) {
+    const theme = useTuiTheme();
     const maxVisible = 12;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, entries.length - maxVisible)));
     const visible = entries.slice(start, start + maxVisible);
@@ -810,9 +839,9 @@ export function MentionPicker({ entries, selectedIndex, width, screenReader, })
             const index = start + visibleIndex;
             const selected = index === selectedIndex;
             if (entry.kind === 'agent') {
-                return (_jsxs(Text, { inverse: !screenReader && selected, ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected agent: ' : '* ', entry.name, screenReader ? '' : ' (agent)', entry.description ? ` – ${entry.description}` : ''] }, `agent:${entry.name}`));
+                return (_jsxs(Text, { ...(selected ? theme.text.selectedRow : {}), ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected agent: ' : '* ', entry.name, screenReader ? '' : ' (agent)', entry.description ? ` – ${entry.description}` : ''] }, `agent:${entry.name}`));
             }
-            return (_jsxs(Text, { inverse: !screenReader && selected, ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected: ' : '+ ', entry.path] }, `file:${entry.path}`));
+            return (_jsxs(Text, { ...(selected ? theme.text.selectedRow : {}), ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected: ' : '+ ', entry.path] }, `file:${entry.path}`));
         })) }));
 }
 const SHORTCUT_ROWS = [
@@ -842,38 +871,34 @@ export function ShortcutHelp({ width }) {
     return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: SHORTCUT_ROWS.map((row, rowIndex) => wide ? (_jsx(Box, { flexDirection: "row", children: row.map((cell, cellIndex) => (_jsx(Box, { width: cellIndex === 2 ? undefined : '33%', children: _jsx(Text, { dimColor: true, children: cell }) }, cellIndex))) }, rowIndex)) : (row.filter(Boolean).map((cell, cellIndex) => (_jsx(Text, { dimColor: true, children: cell }, `${rowIndex}-${cellIndex}`))))) }));
 }
 export function HelpMenu({ tabIndex, selectedIndex, builtinCommands, customCommands, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const tabs = ['General', 'Commands', 'Custom commands'];
     const commands = tabIndex === 1 ? builtinCommands : customCommands;
     const maxVisible = 10;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, commands.length - maxVisible)));
     const visible = commands.slice(start, start + maxVisible);
     const line = '─'.repeat(Math.max(12, Math.min(100, width)));
-    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Box, { children: [_jsx(Text, { bold: true, children: " Help " }), tabs.map((tab, index) => (_jsxs(Text, { ...(index === tabIndex
-                            ? { color: palette.brand, bold: true }
-                            : {}), children: [' ', tab, ' '] }, tab)))] }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: tabIndex === 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: "Praxis understands your codebase, makes edits with your permission, and executes commands from your terminal." }), _jsx(Text, { bold: true, children: "Shortcuts" }), _jsx(ShortcutHelp, { width: width })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: tabIndex === 1
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Box, { children: [_jsxs(Text, { ...theme.text.navigation, bold: true, children: [' ', "Help", ' '] }), tabs.map((tab, index) => (_jsxs(Text, { ...(index === tabIndex ? theme.text.selectedTab : {}), children: [' ', tab, ' '] }, tab)))] }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: tabIndex === 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: "Praxis understands your codebase, makes edits with your permission, and executes commands from your terminal." }), _jsx(Text, { ...theme.text.heading, bold: true, children: "Shortcuts" }), _jsx(ShortcutHelp, { width: width })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: tabIndex === 1
                                 ? 'Browse default commands'
                                 : 'Browse shared commands and skills' }), visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No commands found." })) : (visible.map((command, visibleIndex) => {
                             const index = start + visibleIndex;
                             return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { ...(index === selectedIndex
-                                            ? { color: palette.brand, bold: true }
+                                            ? theme.text.selectedRow
                                             : {}), children: [index === selectedIndex ? '↓ ' : '  ', "/", command.name] }), _jsxs(Text, { dimColor: true, children: [" ", command.description] })] }, command.name));
                         }))] })) }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192 to switch \u00B7 \u2191/\u2193 to navigate \u00B7 Esc to cancel" })] }));
 }
 export function SelectionMenu({ title, description, options, selectedIndex, footer, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const maxVisible = 7;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, options.length - maxVisible)));
     const visible = options.slice(start, start + maxVisible);
     const current = options.find((option) => option.selected);
     const maxLabelWidth = options.reduce((max, option, index) => Math.max(max, `${index + 1}. ${option.label}`.length), 0);
-    return (_jsxs(Box, { borderStyle: screenReader ? undefined : 'round', borderColor: palette.muted, flexDirection: "column", marginTop: 1, paddingX: screenReader ? 0 : 1, width: screenReader ? undefined : Math.min(80, width), children: [_jsx(Text, { bold: true, children: title }), description ? _jsx(Text, { dimColor: true, children: description }) : null, screenReader && current ? _jsxs(Text, { children: ["Current: ", current.label] }) : null, visible.map((option, visibleIndex) => {
+    return (_jsxs(Box, { borderStyle: screenReader ? undefined : 'round', ...theme.surface.neutralBorder, flexDirection: "column", marginTop: 1, paddingX: screenReader ? 0 : 1, width: screenReader ? undefined : Math.min(80, width), children: [_jsx(Text, { ...theme.text.heading, bold: true, children: title }), description ? _jsx(Text, { dimColor: true, children: description }) : null, screenReader && current ? _jsxs(Text, { children: ["Current: ", current.label] }) : null, visible.map((option, visibleIndex) => {
                 const index = start + visibleIndex;
                 const selected = index === selectedIndex;
                 const rowLabel = `${index + 1}. ${option.label}`;
-                return (_jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsxs(Text, { ...(!screenReader && selected
-                            ? { color: palette.brand, bold: true }
-                            : {}), children: [selectionPrefix(selected, screenReader), rowLabel, !screenReader && option.selected ? ' ✔' : '', option.description ? (_jsxs(Text, { dimColor: true, children: [' '.repeat(Math.max(2, maxLabelWidth -
+                return (_jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsxs(Text, { ...(!screenReader && selected ? theme.text.selectedRow : {}), children: [selectionPrefix(selected, screenReader), rowLabel, !screenReader && option.selected ? ' ✔' : '', option.description ? (_jsxs(Text, { dimColor: true, children: [' '.repeat(Math.max(2, maxLabelWidth -
                                         rowLabel.length -
                                         (option.selected && !screenReader ? 2 : 0))), option.description] })) : null] }) }, `${index}-${option.label}`));
             }), start > 0 || start + visible.length < options.length ? (_jsxs(Text, { dimColor: true, children: [start > 0 ? `↑ ${start} earlier` : '', start > 0 && start + visible.length < options.length ? ' · ' : '', start + visible.length < options.length
@@ -881,27 +906,26 @@ export function SelectionMenu({ title, description, options, selectedIndex, foot
                         : ''] })) : null, _jsx(Text, { dimColor: true, children: footer })] }));
 }
 export function ModelMenu({ options, effort, selectedIndex, width, screenReader, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const current = options.find((option) => option.selected);
     const maxLabelWidth = options.reduce((max, option, index) => Math.max(max, `${index + 1}. ${option.label}`.length), 0);
-    return (_jsxs(Box, { borderStyle: screenReader ? undefined : 'round', borderColor: palette.muted, flexDirection: "column", marginTop: 1, paddingX: screenReader ? 0 : 1, width: screenReader ? undefined : Math.min(80, width), children: [_jsx(Text, { bold: true, children: "Select model" }), _jsx(Text, { dimColor: true, children: 'Switch between models. Your pick applies to this and future Praxis Code sessions. For other model names, specify with --model.' }), screenReader && current ? _jsxs(Text, { children: ["Current: ", current.label] }) : null, options.map((option, index) => {
+    return (_jsxs(Box, { borderStyle: screenReader ? undefined : 'round', ...theme.surface.neutralBorder, flexDirection: "column", marginTop: 1, paddingX: screenReader ? 0 : 1, width: screenReader ? undefined : Math.min(80, width), children: [_jsx(Text, { ...theme.text.heading, bold: true, children: "Select model" }), _jsx(Text, { dimColor: true, children: 'Switch between models. Your pick applies to this and future Praxis Code sessions. For other model names, specify with --model.' }), screenReader && current ? _jsxs(Text, { children: ["Current: ", current.label] }) : null, options.map((option, index) => {
                 const selected = index === selectedIndex;
                 const rowLabel = `${index + 1}. ${option.label}`;
-                return (_jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsxs(Text, { ...(!screenReader && selected
-                            ? { color: palette.brand, bold: true }
-                            : {}), children: [selectionPrefix(selected, screenReader), rowLabel, !screenReader && option.selected ? ' ✔' : '', option.description ? (_jsxs(Text, { dimColor: true, children: [' '.repeat(Math.max(2, maxLabelWidth -
+                return (_jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsxs(Text, { ...(!screenReader && selected ? theme.text.selectedRow : {}), children: [selectionPrefix(selected, screenReader), rowLabel, !screenReader && option.selected ? ' ✔' : '', option.description ? (_jsxs(Text, { dimColor: true, children: [' '.repeat(Math.max(2, maxLabelWidth -
                                         rowLabel.length -
                                         (option.selected && !screenReader ? 2 : 0))), option.description] })) : null] }) }, `${index}-${option.label}`));
-            }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { children: [_jsx(Text, { color: palette.accent, children: "\u25CF " }), effort.charAt(0).toUpperCase() + effort.slice(1), " effort (default)", _jsx(Text, { dimColor: true, children: " \u2190/\u2192 to adjust" })] }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "Enter to select \u00B7 Esc to cancel" }) })] }));
+            }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { children: [_jsx(Text, { ...theme.text.focusMarker, children: "\u25CF " }), effort.charAt(0).toUpperCase() + effort.slice(1), " effort (default)", _jsx(Text, { dimColor: true, children: " \u2190/\u2192 to adjust" })] }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "Enter to select \u00B7 Esc to cancel" }) })] }));
 }
 function ComposerInput({ input, cursor }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const { before, current, after } = composerEditorSegments({
         text: input,
         cursor,
     });
     const cursorText = current === '\n' ? '↵' : (current ?? ' ');
-    return (_jsxs(Text, { children: [before, _jsx(Text, { color: palette.selectionText, backgroundColor: palette.accent, children: cursorText }), after] }));
+    const noColorCursorText = current === undefined ? ` ${'\u0332'}` : `${cursorText}\u0332`;
+    return (_jsxs(Text, { children: [before, _jsx(Text, { ...theme.text.inputCursor, children: theme.noColor ? noColorCursorText : cursorText }), after] }));
 }
 export function ExternalEditorWait({ screenReader, }) {
     if (screenReader)
@@ -909,7 +933,7 @@ export function ExternalEditorWait({ screenReader, }) {
     return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }), _jsx(Text, { children: "Save and close editor to continue..." }), _jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" })] }));
 }
 export function Composer({ input, cursor, busy, clipboardBusy = false, status, display, usage, costUsd, width, screenReader, hasThinking = false, thinkingExpanded = false, shortcutsVisible = false, shellMode = false, footerMessage, reduceMotion = false, progressBar = true, turnDuration, editorMode = 'normal', prStatus, sessionColor, commandArgumentHint, }) {
-    const palette = useTuiPalette();
+    const theme = useTuiTheme();
     const [spinnerIndex, setSpinnerIndex] = useState(0);
     useEffect(() => {
         if (!busy || screenReader || reduceMotion)
@@ -927,7 +951,7 @@ export function Composer({ input, cursor, busy, clipboardBusy = false, status, d
                         : `Prompt: ${input}` }));
     const { lineWidth, footerWidth, showEditorHint } = composerLayoutForWidth(width);
     const line = '─'.repeat(lineWidth);
-    const separatorColor = sessionColor === undefined ? undefined : palette.sessionColors[sessionColor];
+    const separatorColor = sessionColor === undefined ? undefined : theme.session(sessionColor);
     const footerMode = `⏵⏵ ${permissionLabel(display.permissionMode)}`;
     const footerCompactMode = `⏵⏵ ${compactPermissionLabel(display.permissionMode)}`;
     const footerLeft = composerFooterLeft(footerWidth, busy, hasThinking, thinkingExpanded, footerMode, footerCompactMode);
@@ -940,14 +964,14 @@ export function Composer({ input, cursor, busy, clipboardBusy = false, status, d
                         ? ` · ${usage.cacheReadInputTokens} cached`
                         : '', costUsd === undefined ? '' : ` · $${costUsd.toFixed(6)}`] })) : null, _jsx(Text, { ...(separatorColor === undefined
                     ? { dimColor: true }
-                    : { color: separatorColor }), children: line }), clipboardBusy ? (_jsx(Text, { children: "Pasting\u2026" })) : busy ? (_jsxs(Text, { children: [progressBar ? (_jsx(Text, { color: palette.accent, children: reduceMotion ? '•' : SPINNER[spinnerIndex] })) : null, ' ', status, "\u2026 ", _jsx(Text, { dimColor: true, children: "\u00B7 esc to interrupt" })] })) : (_jsxs(Text, { children: [_jsx(Text, { ...(shellMode ? {} : { color: palette.brand }), bold: true, children: shellMode ? '! ' : '❯ ' }), input ? (_jsxs(Text, { children: [_jsx(ComposerInput, { cursor: cursor ?? Array.from(input).length, input: input }), commandArgumentHint ? (_jsxs(Text, { dimColor: true, children: [input.endsWith(' ') ? '' : ' ', commandArgumentHint] })) : null] })) : (_jsx(Text, { dimColor: true, children: shellMode
+                    : { color: separatorColor }), children: line }), clipboardBusy ? (_jsx(Text, { children: "Pasting\u2026" })) : busy ? (_jsxs(Text, { children: [progressBar ? (_jsx(Text, { ...theme.text.focusMarker, children: reduceMotion ? '•' : SPINNER[spinnerIndex] })) : null, ' ', _jsxs(Text, { ...theme.text.active, children: [status, "\u2026"] }), ' ', _jsx(Text, { dimColor: true, children: "\u00B7 esc to interrupt" })] })) : (_jsxs(Text, { children: [_jsx(Text, { ...(shellMode ? theme.text.shellMode : theme.text.inputMarker), children: shellMode ? '! ' : '❯ ' }), input ? (_jsxs(Text, { children: [_jsx(ComposerInput, { cursor: cursor ?? Array.from(input).length, input: input }), commandArgumentHint ? (_jsxs(Text, { dimColor: true, children: [input.endsWith(' ') ? '' : ' ', commandArgumentHint] })) : null] })) : (_jsx(Text, { dimColor: true, children: shellMode
                             ? 'Enter a shell command'
                             : 'Try "review this project"' }))] })), _jsx(Text, { ...(separatorColor === undefined
                     ? { dimColor: true }
-                    : { color: separatorColor }), children: line }), shortcutsVisible ? (_jsx(ShortcutHelp, { width: width })) : (_jsx(Box, { width: footerWidth, children: _jsx(Text, { wrap: "truncate", children: shellMode ? (_jsx(Text, { dimColor: true, children: "! for bash mode" })) : footerMessage ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerMessageLeft, " \u00B7 "] }), footerMessage.isError ? (_jsx(Text, { color: palette.error, children: footerMessage.text })) : (_jsx(Text, { dimColor: true, children: footerMessage.text }))] })) : prStatus ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerLeft, " \u00B7 "] }), _jsx(Text, { dimColor: true, children: prStatus })] })) : turnDuration ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerLeft, " \u00B7 "] }), _jsxs(Text, { dimColor: true, children: ["Cooked for ", turnDuration] })] })) : display.effort ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: footerLeft }), _jsx(Text, { dimColor: true, children: " \u00B7 " }), _jsxs(Text, { color: palette.accent, children: ["\u25CF ", display.effort] }), showEditorHint ? (_jsxs(Text, { dimColor: true, children: [' ', "\u00B7 ", editorMode === 'vim' ? 'vim' : '/effort'] })) : null] })) : (_jsx(Text, { dimColor: true, children: footerLeft })) }) }))] }));
+                    : { color: separatorColor }), children: line }), shortcutsVisible ? (_jsx(ShortcutHelp, { width: width })) : (_jsx(Box, { width: footerWidth, children: _jsx(Text, { wrap: "truncate", children: shellMode ? (_jsx(Text, { dimColor: true, children: "! for bash mode" })) : footerMessage ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerMessageLeft, " \u00B7 "] }), footerMessage.isError ? (_jsx(Text, { ...theme.text.error, children: footerMessage.text })) : (_jsx(Text, { dimColor: true, children: footerMessage.text }))] })) : prStatus ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerLeft, " \u00B7 "] }), _jsx(Text, { dimColor: true, children: prStatus })] })) : turnDuration ? (_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: [footerLeft, " \u00B7 "] }), _jsxs(Text, { dimColor: true, children: ["Cooked for ", turnDuration] })] })) : display.effort ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: footerLeft }), _jsx(Text, { dimColor: true, children: " \u00B7 " }), _jsxs(Text, { ...theme.text.focusMarker, children: ["\u25CF ", display.effort] }), showEditorHint ? (_jsxs(Text, { dimColor: true, children: [' ', "\u00B7 ", editorMode === 'vim' ? 'vim' : '/effort'] })) : null] })) : (_jsx(Text, { dimColor: true, children: footerLeft })) }) }))] }));
 }
 export function DialogFrame({ title, children, screenReader, }) {
-    const palette = useTuiPalette();
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: screenReader ? undefined : 'round', borderColor: palette.warning, paddingX: screenReader ? 0 : 1, marginTop: 1, children: [_jsx(Text, { color: palette.warning, bold: true, children: title }), children] }));
+    const theme = useTuiTheme();
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: screenReader ? undefined : 'round', ...theme.surface.decision, paddingX: screenReader ? 0 : 1, marginTop: 1, children: [_jsx(Text, { ...theme.text.heading, ...theme.text.warning, bold: true, children: title }), children] }));
 }
 //# sourceMappingURL=claude-style.js.map