@compilr-dev/cli 0.5.0 → 0.5.2

package/dist/ui/terminal-ui.js

@@ -14,93 +14,23 @@
  * - All output goes through TerminalUI (no external console.log)
  */
 import { EventEmitter } from 'events';
-import * as readline from 'readline';
-import * as terminal from './terminal.js';
-import { getPhysicalLineCount, getVisibleLength } from './line-utils.js';
+import { getVisibleLength } from './line-utils.js';
 import { getStyles } from '../themes/index.js';
-import { MODE_INFO } from './types.js';
-import { getAutocompleteCommands } from '../commands.js';
-import { getFileMatches, extractAtMention, replaceAtMention, } from './file-autocomplete.js';
-import { LiveRegion } from './live-region.js';
-import { renderMarkdown } from './conversation.js';
-export const DEFAULT_TERMINAL_UI_CONFIG = {
-    verbose: false,
-    theme: 'default',
-    showMascot: true,
-};
-// =============================================================================
-// Constants
-// =============================================================================
-const MAX_VISIBLE_COMMANDS = 10;
-// =============================================================================
-// Mascot Expressions
-// =============================================================================
-/**
- * Inline mascot expressions for agent identity and state feedback.
- * Used to prefix agent messages and in spinner animations.
- */
-export const MASCOT = {
-    // Core expressions
-    neutral: '[•_•]', // Default state - regular messages
-    thinking: '[°_°]', // Processing/thinking
-    searching: '[◐_◐]', // Searching/scanning files
-    success: '[^_^]', // Task completed successfully
-    error: '[×_×]', // Error occurred
-    confused: '[?_?]', // Needs clarification
-    working: '[•̀_•́]', // Actively working on task
-    // CRT monitor animation frames (subtle scanner effect)
-    crt: ['[░░░]', '[▒░░]', '[░▒░]', '[░░▒]', '[░▒░]', '[▒░░]'],
-};
-// =============================================================================
-// Fuzzy Matching
-// =============================================================================
-/**
- * Calculate fuzzy match score for a query against a target string.
- * Higher score = better match. Returns -1 if no match.
- */
-function fuzzyMatchScore(query, target) {
-    const queryLower = query.toLowerCase();
-    const targetLower = target.toLowerCase();
-    // Exact prefix match - highest priority (score 1000+)
-    if (targetLower.startsWith(queryLower)) {
-        return 1000 + (100 - target.length); // Shorter commands rank higher
-    }
-    // Contiguous substring match - high priority (score 500+)
-    if (targetLower.includes(queryLower)) {
-        const index = targetLower.indexOf(queryLower);
-        return 500 + (100 - index); // Earlier matches rank higher
-    }
-    // Fuzzy match - characters appear in order (score 100+)
-    let queryIdx = 0;
-    let consecutiveBonus = 0;
-    let lastMatchIdx = -1;
-    for (let i = 0; i < targetLower.length && queryIdx < queryLower.length; i++) {
-        if (targetLower[i] === queryLower[queryIdx]) {
-            if (lastMatchIdx === i - 1) {
-                consecutiveBonus += 10;
-            }
-            lastMatchIdx = i;
-            queryIdx++;
-        }
-    }
-    if (queryIdx === queryLower.length) {
-        return 100 + consecutiveBonus + (100 - target.length);
-    }
-    return -1;
-}
-/**
- * Filter and rank commands matching input using fuzzy matching
- */
-function filterCommands(input, commands) {
-    const scored = commands
-        .map((cmd) => ({
-        cmd,
-        score: fuzzyMatchScore(input, cmd.command),
-    }))
-        .filter((item) => item.score >= 0);
-    scored.sort((a, b) => b.score - a.score);
-    return scored.map((item) => item.cmd);
-}
+import { renderItem } from './terminal-render-item.js';
+import { TurnMetrics } from './turn-metrics.js';
+import { StatusBarController } from './status-bar-controller.js';
+import { ConversationStore } from './conversation-store.js';
+import { AutocompleteController } from './autocomplete-controller.js';
+import { InputController } from './input-controller.js';
+import { LiveRegionFacade } from './live-region-facade.js';
+import { OverlayManager } from './overlay-manager.js';
+import { FooterRenderer } from './footer-renderer.js';
+import { KeyboardHandler } from './keyboard-handler.js';
+import { DEFAULT_TERMINAL_UI_CONFIG, } from './terminal-types.js';
+export { DEFAULT_TERMINAL_UI_CONFIG, MASCOT } from './terminal-types.js';
+import { getPendingRequestsManager } from '../multi-agent/index.js';
+import { getSessionRegistry } from '../multi-agent/session-registry.js';
+import { getNotificationManager } from '../multi-agent/notification-manager.js';
 // =============================================================================
 // Footer V2 Class
 // =============================================================================
@@ -109,68 +39,120 @@ export class TerminalUI extends EventEmitter {
     promptPrefix;
     promptPrefixLen;
     config;
-    // Conversation history (for re-rendering on config change)
-    conversationHistory = [];
-    // Input state (multiline)
-    lines = [''];
-    currentLine = 0;
-    cursorPos = 0;
+    // Conversation history, restored history, and filtering
+    conversation = new ConversationStore();
+    // Input state (delegated to InputController)
+    input = new InputController();
+    get lines() { return this.input.lines; }
+    set lines(v) { this.input.lines = v; }
+    get currentLine() { return this.input.currentLine; }
+    set currentLine(v) { this.input.currentLine = v; }
+    get cursorPos() { return this.input.cursorPos; }
+    set cursorPos(v) { this.input.cursorPos = v; }
+    get suggestion() { return this.input.suggestion; }
+    set suggestion(v) { this.input.suggestion = v; }
+    get queuedInputs() { return this.input.queuedInputs; }
+    set queuedInputs(v) { this.input.queuedInputs = v; }
     mode;
     projectName = null;
     todos = [];
+    // Plan mode state
+    activePlanId = null;
+    activePlanName = null;
     spinnerText = null;
-    spinnerFrame = 0;
     agentRunning = false;
-    queuedInputs = [];
     agentMessageQueue = [];
     currentTool = null;
+    // Per-turn token and tool call tracking
+    turnMetrics = new TurnMetrics();
     // LiveRegion for running tools (bash, subagents)
-    liveRegion = new LiveRegion();
-    // Command autocomplete state (for /commands)
-    autocomplete = {
-        active: false,
-        matches: [],
-        selectedIndex: 0,
-        scrollOffset: 0,
-    };
-    // File autocomplete state (for @paths)
-    fileAutocomplete = {
-        active: false,
-        matches: [],
-        selectedIndex: 0,
-        scrollOffset: 0,
-        partial: '',
-    };
-    // History state
-    history = [];
-    historyIndex = -1;
-    savedInput = '';
+    live = new LiveRegionFacade({
+        requestRender: () => { this.needsRender = true; },
+        print: (item) => { this.print(item); },
+        emit: (event, ...args) => { this.emit(event, ...args); },
+        setSpinnerText: (text) => { this.spinnerText = text; },
+    });
+    // Autocomplete controller (command, file, agent)
+    ac = new AutocompleteController();
     // Render tracking
-    lastRenderHeight = 0;
-    cursorLineFromBottom = 0;
     isRunning = false;
     isPaused = false;
     renderTimer = null;
     needsRender = false;
-    // Double Esc detection
-    lastEscapeTime = 0;
-    // Ghost text suggestion
-    suggestion = null;
+    // Active team agent (for multi-agent footer display)
+    activeTeamAgent = null;
     // Todo visibility (Ctrl+T to toggle)
     showTodos = true;
     // View mode (Ctrl+O to toggle verbose view)
     // normal: compact output
     // verbose-temp: temporarily show last N items verbose (any key returns to normal)
     viewMode = 'normal';
-    // Spinner animation - CRT monitor fill effect
-    spinnerFrames = MASCOT.crt;
-    spinnerTimer = null;
-    // Overlay stack (supports nested overlays)
-    overlayStack = [];
-    overlayResolvers = new Map();
-    overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-    // Buffer for items printed while overlay is active (to prevent cursor corruption)
-    overlayPrintBuffer = [];
+    // Status bar navigation (down arrow into footer indicators)
+    statusBar = new StatusBarController({
+        requestRender: () => { this.needsRender = true; },
+        emit: (event, ...args) => { this.emit(event, ...args); },
+    });
+    // Overlay lifecycle (stack, resolvers, render state, print buffer)
+    overlay = new OverlayManager({
+        clearFooter: () => { this.footer.clear(); },
+        renderFooter: () => { this.footer.render(); },
+        print: (item) => { this.print(item); },
+        renderItemToConsole: (item) => { this.renderItemToConsole(item); },
+    });
+    // Footer renderer (clear, render, spinner animation, line builders)
+    footer = new FooterRenderer({
+        isFooterRenderAllowed: () => this.isRunning && !this.isPaused && !this.overlay.hasActiveOverlay(),
+        getRenderData: () => ({
+            liveRegion: this.live.region,
+            liveVerbose: this.config.verbose,
+            agentRunning: this.agentRunning,
+            currentTool: this.currentTool,
+            spinnerText: this.spinnerText,
+            activeBashInfo: this.live.getActiveBashInfo(),
+            turnMetrics: this.turnMetrics,
+            todos: this.todos,
+            showTodos: this.showTodos,
+            lines: this.lines,
+            currentLine: this.currentLine,
+            cursorPos: this.cursorPos,
+            queuedInputs: this.queuedInputs,
+            suggestion: this.suggestion,
+            promptPrefix: this.promptPrefix,
+            promptPrefixLen: this.promptPrefixLen,
+            ac: this.ac,
+            statusBar: this.statusBar,
+            mode: this.mode,
+            activePlanName: this.activePlanName,
+            activeTeamAgent: this.activeTeamAgent,
+            projectName: this.projectName,
+            conversationFilterActive: this.conversation.isFilterActive,
+            hasRestoredHistory: this.conversation.hasRestoredHistory(),
+            config: this.config,
+        }),
+    });
+    // Keyboard input handler (capture, escape, overlay routing, keypress dispatch)
+    keyboard = new KeyboardHandler({
+        isGuardActive: () => !this.isRunning || this.isPaused,
+        isAgentRunning: () => this.agentRunning,
+        getViewMode: () => this.viewMode,
+        setViewMode: (mode) => { this.viewMode = mode; },
+        requestRender: () => { this.needsRender = true; },
+        emit: (event, ...args) => { this.emit(event, ...args); },
+        input: this.input,
+        ac: this.ac,
+        overlay: this.overlay,
+        statusBar: this.statusBar,
+        getActiveOverlay: () => this.overlay.getActiveOverlay(),
+        hasActiveOverlay: () => this.overlay.hasActiveOverlay(),
+        hasActiveBash: () => this.live.hasActiveBash(),
+        backgroundBashCommand: () => { this.backgroundBashCommand(); },
+        hasRestoredHistory: () => this.conversation.hasRestoredHistory(),
+        showRestoredHistory: () => { this.showRestoredHistory(); },
+        toggleVerboseView: () => { this.toggleVerboseView(); },
+        toggleLiveRegionExpanded: () => { this.toggleLiveRegionExpanded(); },
+        toggleTodos: () => { this.toggleTodos(); },
+        reRenderConversationVerbose: (verbose) => { this.reRenderConversationVerbose(verbose); },
+    });
     constructor(options = {}) {
         super();
         const s = getStyles();
@@ -180,38 +162,53 @@ export class TerminalUI extends EventEmitter {
         this.config = { ...DEFAULT_TERMINAL_UI_CONFIG, ...options.config };
     }
     // ===========================================================================
-    // Input value helpers
+    // Status bar navigation (delegated to StatusBarController)
     // ===========================================================================
-    /** Get the full input value (all lines joined with newlines) */
-    getInputValue() {
-        return this.lines.join('\n');
-    }
-    /** Get the current line content */
-    getCurrentLineContent() {
-        return this.lines[this.currentLine];
+    /** Set background agent count (called by REPL to keep UI in sync). */
+    setBackgroundAgentCount(count) {
+        this.statusBar.setBackgroundAgentCount(count);
     }
-    /** Clear input and reset to single empty line */
-    clearInput() {
-        this.lines = [''];
-        this.currentLine = 0;
-        this.cursorPos = 0;
+    /** Set MCP loading state for status bar indicator. */
+    setMCPLoading(loading, toolCount) {
+        this.statusBar.setMCPLoading(loading, toolCount);
     }
     // ===========================================================================
     // Lifecycle
     // ===========================================================================
-    start() {
+    start(skipInitialRender) {
         if (this.isRunning)
             return;
         this.isRunning = true;
         this.isPaused = false;
         // Start keyboard input handling
-        this.startKeyboardCapture();
-        // Initial render
-        this.render();
+        this.keyboard.startCapture();
+        // Initial render (skip when a startup overlay will be shown immediately)
+        if (!skipInitialRender) {
+            this.footer.render();
+        }
+        // Phase 3b: Listen for pending requests changes to trigger re-render
+        const pendingManager = getPendingRequestsManager();
+        pendingManager.on('count-changed', () => {
+            this.needsRender = true;
+        });
+        // Multi-terminal: Listen for session count changes (other terminals joining/leaving)
+        const registry = getSessionRegistry();
+        if (registry) {
+            registry.onCountChange(() => {
+                this.needsRender = true;
+            });
+        }
+        // Cross-session notifications: re-render when count changes
+        const notifMgr = getNotificationManager();
+        if (notifMgr) {
+            notifMgr.on('count-changed', () => {
+                this.needsRender = true;
+            });
+        }
         // Start render loop (60ms = ~16fps)
         this.renderTimer = setInterval(() => {
             if (this.needsRender && !this.isPaused) {
-                this.render();
+                this.footer.render();
                 this.needsRender = false;
             }
         }, 60);
@@ -226,11 +223,11 @@ export class TerminalUI extends EventEmitter {
             this.renderTimer = null;
         }
         // Stop spinner
-        this.stopSpinnerAnimation();
+        this.footer.stopSpinnerAnimation();
         // Stop keyboard capture
-        this.stopKeyboardCapture();
+        this.keyboard.stopCapture();
         // Clear footer
-        this.clear();
+        this.footer.clear();
     }
     // ===========================================================================
     // Public API - Output (THE KEY METHODS)
@@ -245,222 +242,38 @@ export class TerminalUI extends EventEmitter {
      */
     print(item) {
         // Store in history for re-render capability
-        this.conversationHistory.push(item);
+        this.conversation.addItem(item);
+        // Check if item should be shown based on current filter
+        if (!this.conversation.shouldShowItem(item)) {
+            return; // Filtered out - stored but not displayed
+        }
         // If overlay is active, buffer the item to render later
         // This prevents output from corrupting overlay cursor tracking
-        if (this.hasActiveOverlay()) {
-            this.overlayPrintBuffer.push(item);
+        if (this.overlay.hasActiveOverlay()) {
+            this.overlay.bufferItem(item);
             return;
         }
         // IMPORTANT: If needsRender is true, render FIRST to update lastRenderHeight.
         // This prevents ghost lines when footer height changed (e.g., spinner started)
         // but render loop hasn't fired yet. Without this, clear() uses stale height.
         if (this.needsRender) {
-            this.render();
+            this.footer.render();
             this.needsRender = false;
         }
         // Clear footer, render item, re-render footer
-        this.clear();
-        this.renderItem(item);
-        this.render();
+        this.footer.clear();
+        this.renderItemToConsole(item);
+        this.footer.render();
     }
     /**
      * Render a single item to the console.
      * Config-aware: respects verbose, showMascot settings.
+     * Delegates to standalone renderItem() function.
      */
-    renderItem(item) {
-        const s = getStyles();
-        switch (item.type) {
-            case 'user-message':
-                console.log('');
-                console.log(s.primaryBold('> ') + item.text);
-                console.log(''); // Trailing blank for separation
-                break;
-            case 'agent-text': {
-                // Render markdown for proper formatting (headers, lists, bold, code, etc.)
-                const rendered = renderMarkdown(item.text);
-                // Prefix agent messages with mascot expression (if enabled)
-                if (this.config.showMascot) {
-                    const expr = item.expression ? MASCOT[item.expression] : MASCOT.neutral;
-                    // Only prefix the first line with mascot
-                    const lines = rendered.split('\n');
-                    if (lines.length > 0) {
-                        console.log(s.primary(expr) + s.muted(' > ') + lines[0]);
-                        for (let i = 1; i < lines.length; i++) {
-                            console.log(lines[i]);
-                        }
-                    }
-                }
-                else {
-                    console.log(rendered);
-                }
-                console.log(''); // Trailing blank for separation
-                break;
-            }
-            case 'thinking':
-                // Only show thinking in verbose mode
-                if (this.config.verbose) {
-                    console.log(s.muted(`∴ Thinking…`));
-                    console.log('');
-                    // Indent thinking text
-                    const lines = item.text.split('\n');
-                    for (const line of lines) {
-                        console.log(s.muted(`  ${line}`));
-                    }
-                    console.log('');
-                }
-                // If not verbose, skip entirely (but still stored in history)
-                break;
-            case 'tool-start': {
-                // Truncate long params (e.g., long bash commands)
-                const maxLen = Math.min(60, terminal.getTerminalWidth() - 15);
-                let params = item.params;
-                // Handle multi-line params
-                const nlIdx = params.indexOf('\n');
-                if (nlIdx !== -1) {
-                    const first = params.slice(0, nlIdx).trim();
-                    const count = params.split('\n').length;
-                    params = first.length > 0 ? `${first}… (${String(count)} lines)` : `(${String(count)} line script)`;
-                }
-                // Truncate if still too long
-                if (params.length > maxLen) {
-                    params = params.slice(0, maxLen) + '…';
-                }
-                console.log(s.info(`● ${item.name}`) + s.muted(`(${params})`));
-                break;
-            }
-            case 'tool-result': {
-                // Truncate long params (e.g., long bash commands)
-                const maxParamsLen = Math.min(60, terminal.getTerminalWidth() - 15);
-                let paramsDisplay = item.params;
-                // Handle multi-line params (show first line + count)
-                const newlineIdx = paramsDisplay.indexOf('\n');
-                if (newlineIdx !== -1) {
-                    const firstLine = paramsDisplay.slice(0, newlineIdx).trim();
-                    const lineCount = paramsDisplay.split('\n').length;
-                    paramsDisplay = firstLine.length > 0
-                        ? `${firstLine}… (${String(lineCount)} lines)`
-                        : `(${String(lineCount)} line script)`;
-                }
-                // Truncate if still too long
-                if (paramsDisplay.length > maxParamsLen) {
-                    paramsDisplay = paramsDisplay.slice(0, maxParamsLen) + '…';
-                }
-                console.log(s.info(`● ${item.name}`) + s.muted(`(${paramsDisplay})`));
-                if (item.content) {
-                    const lines = item.content.split('\n').filter((l) => l.length > 0);
-                    const maxPreviewLines = 3;
-                    if (this.config.verbose) {
-                        // Verbose: show all lines
-                        for (const line of lines) {
-                            console.log(s.muted(`  ⎿  ${line}`));
-                        }
-                    }
-                    else if (lines.length > 0) {
-                        // Compact: show first few lines + hidden count
-                        const previewLines = lines.slice(0, maxPreviewLines);
-                        const hiddenCount = lines.length - maxPreviewLines;
-                        for (let i = 0; i < previewLines.length; i++) {
-                            if (i === 0) {
-                                console.log(s.muted(`  ⎿  ${previewLines[i]}`));
-                            }
-                            else {
-                                console.log(s.muted(`     ${previewLines[i]}`));
-                            }
-                        }
-                        if (hiddenCount > 0) {
-                            console.log(s.muted(`     … +${String(hiddenCount)} lines`) + s.muted(' (ctrl+o to expand)'));
-                        }
-                    }
-                    else {
-                        // No output lines
-                        const expandHint = s.muted(' (ctrl+o to expand)');
-                        if (item.success === false) {
-                            console.log(s.error(`  ⎿  ${item.summary}`) + expandHint);
-                        }
-                        else {
-                            console.log(s.muted(`  ⎿  ${item.summary}`) + expandHint);
-                        }
-                    }
-                }
-                else {
-                    // No content, just show summary
-                    if (item.success === false) {
-                        console.log(s.error(`  ⎿  ${item.summary}`));
-                    }
-                    else {
-                        console.log(s.muted(`  ⎿  ${item.summary}`));
-                    }
-                }
-                console.log('');
-                break;
-            }
-            case 'tool-error': {
-                // Truncate long params
-                const maxErrLen = Math.min(60, terminal.getTerminalWidth() - 15);
-                let errParams = item.params;
-                const errNlIdx = errParams.indexOf('\n');
-                if (errNlIdx !== -1) {
-                    const errFirst = errParams.slice(0, errNlIdx).trim();
-                    const errCount = errParams.split('\n').length;
-                    errParams = errFirst.length > 0 ? `${errFirst}… (${String(errCount)} lines)` : `(${String(errCount)} line script)`;
-                }
-                if (errParams.length > maxErrLen) {
-                    errParams = errParams.slice(0, maxErrLen) + '…';
-                }
-                console.log(s.info(`● ${item.name}`) + s.muted(`(${errParams})`));
-                console.log(s.error(`  ⎿  Error: ${item.error}`));
-                console.log('');
-                break;
-            }
-            case 'interrupted': {
-                // Show what was ongoing (if provided)
-                if (item.action) {
-                    console.log(s.info(`● ${item.action}`));
-                }
-                else {
-                    // No action means interrupted right after user message.
-                    // Move cursor up to consume the trailing blank from user-message.
-                    //
-                    // ⚠️ WARNING: This cursor manipulation is fragile!
-                    // It assumes the previous item was user-message which adds a trailing blank.
-                    // If we add items that don't add trailing blanks, or if the rendering
-                    // order changes, this could cause visual artifacts (overwriting content).
-                    // If issues arise, consider tracking the last printed item type instead.
-                    process.stdout.write('\x1b[1A'); // Move up one line
-                }
-                // Show interrupted line with mascot
-                const suggestion = item.suggestion ?? 'What should I do instead?';
-                console.log(s.warning(`  ⎿  ${MASCOT.confused} Interrupted - ${suggestion}`));
-                console.log('');
-                // Also set as ghost text suggestion
-                this.setSuggestion(suggestion);
-                break;
-            }
-            case 'error':
-                console.log(s.error(`${MASCOT.error} ${item.message}`));
-                console.log('');
-                break;
-            case 'success':
-                console.log(s.success(`${MASCOT.success} ${item.message}`));
-                console.log('');
-                break;
-            case 'info':
-                console.log(s.info(item.message));
-                console.log('');
-                break;
-            case 'warning':
-                console.log(s.warning(item.message));
-                console.log('');
-                break;
-            case 'raw':
-                console.log(item.text);
-                break;
-            case 'raw-lines':
-                for (const line of item.lines) {
-                    console.log(line);
-                }
-                break;
+    renderItemToConsole(item) {
+        const suggestion = renderItem(item, this.config);
+        if (suggestion !== null) {
+            this.setSuggestion(suggestion);
         }
     }
     /**
@@ -470,9 +283,9 @@ export class TerminalUI extends EventEmitter {
      * @deprecated Prefer using print() with PrintableItem
      */
     output(callback) {
-        this.clear();
+        this.footer.clear();
         callback();
-        this.render();
+        this.footer.render();
     }
     // ===========================================================================
     // Public API - State setters
@@ -481,11 +294,11 @@ export class TerminalUI extends EventEmitter {
         const wasRunning = this.agentRunning;
         this.agentRunning = running;
         if (running && !wasRunning) {
-            this.startSpinnerAnimation();
+            this.footer.startSpinnerAnimation(() => { this.needsRender = true; });
             // Let render loop handle it
         }
         else if (!running && wasRunning) {
-            this.stopSpinnerAnimation();
+            this.footer.stopSpinnerAnimation();
             this.currentTool = null;
         }
         this.needsRender = true;
@@ -511,6 +324,51 @@ export class TerminalUI extends EventEmitter {
         }
         this.needsRender = true;
     }
+    /**
+     * Set whether extended thinking mode is active
+     * Shows "thinking" indicator in status line
+     */
+    setThinking(thinking) {
+        this.turnMetrics.isThinking = thinking;
+        this.needsRender = true;
+    }
+    // ===========================================================================
+    // Token Tracking (per-turn metrics)
+    // ===========================================================================
+    /**
+     * Add input/output tokens for live display
+     * @param thinkingTokens - Optional thinking tokens (Gemini 2.5+ models)
+     * @param cacheReadTokens - Optional cache read tokens (Anthropic/Gemini)
+     * @param debugPayload - Optional debug payload sizes (char counts)
+     */
+    addTokens(inputTokens, outputTokens, thinkingTokens, cacheReadTokens, debugPayload) {
+        this.turnMetrics.addTokens(inputTokens, outputTokens, thinkingTokens, cacheReadTokens, debugPayload);
+        this.needsRender = true;
+    }
+    /**
+     * Increment tool call counter
+     */
+    incrementToolCalls() {
+        this.turnMetrics.incrementToolCalls();
+    }
+    /**
+     * Increment API call counter (called on each LLM request completion)
+     */
+    incrementApiCalls() {
+        this.turnMetrics.incrementApiCalls();
+    }
+    /**
+     * Reset turn metrics (call when agent starts a new turn)
+     */
+    resetTurnMetrics() {
+        this.turnMetrics.reset();
+    }
+    /**
+     * Get current turn metrics
+     */
+    getTurnMetrics() {
+        return this.turnMetrics.getSnapshot();
+    }
     setMode(mode) {
         this.mode = mode;
         this.needsRender = true;
@@ -526,215 +384,117 @@ export class TerminalUI extends EventEmitter {
         return this.projectName;
     }
     /**
-     * Set ghost text suggestion (shown when input is empty)
+     * Set the active team agent (displayed in footer)
+     * Pass null to clear (default agent or no team)
      */
-    setSuggestion(text) {
-        this.suggestion = text;
-        this.needsRender = true;
-    }
-    getSuggestion() {
-        return this.suggestion;
-    }
-    clearSuggestion() {
-        this.suggestion = null;
+    setActiveTeamAgent(agent) {
+        this.activeTeamAgent = agent;
         this.needsRender = true;
     }
-    // ===========================================================================
-    // Public API - LiveRegion (subagents, bash commands)
-    // ===========================================================================
     /**
-     * Add a subagent to the live region.
+     * Get the active team agent
      */
-    addSubagent(id, agentType, description) {
-        const item = {
-            id,
-            type: 'subagent',
-            status: 'running',
-            startTime: Date.now(),
-            agentType,
-            description,
-            toolCount: 0,
-            tokenCount: 0,
-            lastAction: '',
-            lastActionDetails: [],
-        };
-        this.liveRegion.addItem(item);
-        // Let render loop handle it (same as addBashCommand)
-        this.needsRender = true;
+    getActiveTeamAgent() {
+        return this.activeTeamAgent;
     }
     /**
-     * Update a subagent's tool usage.
+     * Set the callback to get available team agents for $ autocomplete
      */
-    updateSubagentTool(id, toolName, summary) {
-        const item = this.liveRegion.getItem(id);
-        if (item && item.type === 'subagent') {
-            const newAction = `${toolName}: ${summary}`;
-            // Add previous action to history (for expanded view)
-            const updatedDetails = item.lastAction
-                ? [...item.lastActionDetails, item.lastAction]
-                : [...item.lastActionDetails];
-            this.liveRegion.updateItem(id, {
-                toolCount: item.toolCount + 1,
-                lastAction: newAction,
-                lastActionDetails: updatedDetails,
-            });
-            this.needsRender = true;
-        }
+    setAgentSuggestionsCallback(callback) {
+        this.ac.getAgentSuggestions = callback;
     }
     /**
-     * Mark a subagent as completed.
+     * Set the callback to get available commands for / autocomplete
      */
-    completeSubagent(id, success, tokenCount, _error) {
-        const item = this.liveRegion.getItem(id);
-        if (item && item.type === 'subagent') {
-            this.liveRegion.updateItem(id, {
-                status: success ? 'done' : 'error',
-                tokenCount: tokenCount ?? item.tokenCount,
-                endTime: Date.now(),
-            });
-            this.liveRegion.completeItem(id, success ? 'done' : 'error');
-            this.needsRender = true;
-        }
+    setCommandsCallback(callback) {
+        this.ac.getCommands = callback;
     }
     /**
-     * Remove a subagent and return it for committing to scrolling zone.
+     * Set the active plan (for Plan Mode display in footer)
      */
-    removeSubagent(id) {
-        const item = this.liveRegion.removeItem(id);
+    setActivePlan(planId, planName) {
+        this.activePlanId = planId;
+        this.activePlanName = planName;
         this.needsRender = true;
-        return item;
     }
     /**
-     * Clear all subagents from live region.
+     * Get the active plan info
      */
-    clearLiveRegion() {
-        this.liveRegion.clear();
-        this.needsRender = true;
+    getActivePlan() {
+        return { id: this.activePlanId, name: this.activePlanName };
     }
     /**
-     * Toggle expanded view in live region (Ctrl+O).
+     * Clear the active plan
      */
-    toggleLiveRegionExpanded() {
-        this.liveRegion.toggleExpanded();
+    clearActivePlan() {
+        this.activePlanId = null;
+        this.activePlanName = null;
         this.needsRender = true;
     }
     /**
-     * Check if live region has items.
+     * Set ghost text suggestion (shown when input is empty)
      */
-    hasLiveItems() {
-        return this.liveRegion.hasItems();
+    setSuggestion(text) {
+        this.input.suggestion = text;
+        this.needsRender = true;
     }
-    /**
-     * Get live region for direct access if needed.
-     */
-    getLiveRegion() {
-        return this.liveRegion;
+    getSuggestion() {
+        return this.input.suggestion;
+    }
+    clearSuggestion() {
+        this.input.suggestion = null;
+        this.needsRender = true;
     }
     // ===========================================================================
-    // Live Region - Bash Commands
+    // Public API - LiveRegion (subagents, bash commands)
     // ===========================================================================
-    /**
-     * Add a bash command to the live region.
-     */
+    addSubagent(id, agentType, description) {
+        this.live.addSubagent(id, agentType, description);
+    }
+    updateSubagentTool(id, toolName, summary) {
+        this.live.updateSubagentTool(id, toolName, summary);
+    }
+    completeSubagent(id, success, tokenCount, _error) {
+        this.live.completeSubagent(id, success, tokenCount, _error);
+    }
+    removeSubagent(id) {
+        return this.live.removeSubagent(id);
+    }
+    clearLiveRegion() {
+        this.live.clearLiveRegion();
+    }
+    toggleLiveRegionExpanded() {
+        this.live.toggleLiveRegionExpanded();
+    }
+    hasLiveItems() {
+        return this.live.hasLiveItems();
+    }
+    getLiveRegion() {
+        return this.live.getLiveRegion();
+    }
     addBashCommand(id, command) {
-        const item = {
-            id,
-            type: 'bash',
-            status: 'running',
-            startTime: Date.now(),
-            command,
-            output: [],
-        };
-        this.liveRegion.addItem(item);
-        this.needsRender = true;
+        this.live.addBashCommand(id, command);
     }
-    /**
-     * Add output line to a bash command.
-     */
     updateBashOutput(id, line) {
-        const item = this.liveRegion.getItem(id);
-        if (item && item.type === 'bash') {
-            item.output.push(line);
-            this.liveRegion.updateItem(id, { output: [...item.output] });
-            this.needsRender = true;
-        }
+        this.live.updateBashOutput(id, line);
     }
-    /**
-     * Mark a bash command as completed.
-     */
     completeBashCommand(id, exitCode) {
-        const item = this.liveRegion.getItem(id);
-        if (item && item.type === 'bash') {
-            this.liveRegion.updateItem(id, {
-                status: exitCode === 0 ? 'done' : 'error',
-                exitCode,
-                endTime: Date.now(),
-            });
-            this.liveRegion.completeItem(id, exitCode === 0 ? 'done' : 'error');
-            this.needsRender = true;
-        }
+        this.live.completeBashCommand(id, exitCode);
     }
-    /**
-     * Remove a bash command and commit it to the scrolling zone.
-     */
     commitBashCommand(id) {
-        const item = this.liveRegion.removeItem(id);
-        if (item && item.type === 'bash') {
-            const output = item.output.join('\n') || '(no output)';
-            const exitCode = item.exitCode ?? 0;
-            // Print the bash output to scrolling zone
-            this.print({
-                type: 'tool-result',
-                name: 'Bash',
-                params: item.command,
-                summary: exitCode === 0 ? 'Completed' : `Exit code ${String(exitCode)}`,
-                content: output,
-                success: exitCode === 0,
-            });
-        }
-        this.needsRender = true;
+        this.live.commitBashCommand(id);
     }
-    /**
-     * Remove a subagent and commit it to the scrolling zone.
-     * This is the atomic equivalent of commitBashCommand for subagents.
-     * The result content comes from tool_end, not from the LiveRegion item.
-     */
-    commitSubagent(id, resultContent, success) {
-        // Remove from LiveRegion FIRST (no needsRender yet - that's the key!)
-        const item = this.liveRegion.removeItem(id);
-        if (item && item.type === 'subagent') {
-            // Build summary from item stats
-            const toolCount = item.toolCount;
-            const tokenCount = item.tokenCount;
-            const duration = item.endTime
-                ? Math.round((item.endTime - item.startTime) / 1000)
-                : Math.round((Date.now() - item.startTime) / 1000);
-            const tokenStr = tokenCount > 0 ? `, ${this.formatTokens(tokenCount)} tokens` : '';
-            const summary = `${String(toolCount)} tool calls${tokenStr}, ${String(duration)}s`;
-            // Print atomically (uses current lastRenderHeight before it changes)
-            this.print({
-                type: 'tool-result',
-                name: item.agentType,
-                params: item.description,
-                summary,
-                content: resultContent.length > 200 ? resultContent : undefined,
-                success,
-            });
-            // Reset spinner text
-            this.spinnerText = null;
-        }
-        // Set needsRender AFTER print (same pattern as commitBashCommand)
-        this.needsRender = true;
-        return item;
+    backgroundBashCommand() {
+        this.live.backgroundBashCommand();
     }
-    /**
-     * Format token count (e.g., 5000 -> "5.0k")
-     */
-    formatTokens(tokens) {
-        if (tokens >= 1000) {
-            return `${(tokens / 1000).toFixed(1)}k`;
-        }
-        return String(tokens);
+    hasActiveBash() {
+        return this.live.hasActiveBash();
+    }
+    getActiveBashInfo() {
+        return this.live.getActiveBashInfo();
+    }
+    commitSubagent(id, resultContent, success) {
+        return this.live.commitSubagent(id, resultContent, success);
     }
     /**
      * Toggle todo list visibility (Ctrl+T)
@@ -779,8 +539,7 @@ export class TerminalUI extends EventEmitter {
         // Clear screen and scrollback buffer
         process.stdout.write('\x1b[2J\x1b[3J\x1b[H');
         // Reset footer state
-        this.lastRenderHeight = 0;
-        this.cursorLineFromBottom = 0;
+        this.footer.resetRenderState();
         // Show mode indicator at top
         if (verbose) {
             console.log(s.info(`[Verbose View Mode] Press any key to return to normal view`));
@@ -789,8 +548,8 @@ export class TerminalUI extends EventEmitter {
         // Re-render all items with temporary verbose override
         const originalVerbose = this.config.verbose;
         this.config.verbose = verbose;
-        for (const item of this.conversationHistory) {
-            this.renderItem(item);
+        for (const item of this.conversation.history) {
+            this.renderItemToConsole(item);
         }
         // Restore original config
         this.config.verbose = originalVerbose;
@@ -798,6 +557,46 @@ export class TerminalUI extends EventEmitter {
         this.needsRender = true;
     }
     // ===========================================================================
+    // Public API - Restored History (Ctrl+R)
+    // ===========================================================================
+    /**
+     * Store restored conversation items for Ctrl+R history view.
+     * Called when a session is resumed/restored.
+     */
+    setRestoredHistory(items) {
+        this.conversation.setRestoredHistory(items);
+    }
+    /**
+     * Check if there is restored history available.
+     */
+    hasRestoredHistory() {
+        return this.conversation.hasRestoredHistory();
+    }
+    /**
+     * Show restored conversation history (Ctrl+R).
+     * Renders items permanently into the scrollback buffer.
+     * Stays in normal mode — the output persists like any other printed content.
+     */
+    showRestoredHistory() {
+        const s = getStyles();
+        // Clear existing footer to make room for output
+        this.footer.clear();
+        // Print header
+        console.log('');
+        console.log(s.info(`── Conversation History (${String(this.conversation.restoredHistory.length)} items) ──`));
+        console.log('');
+        // Render each restored item into the scrollback
+        for (const item of this.conversation.restoredHistory) {
+            this.renderItemToConsole(item);
+        }
+        console.log('');
+        console.log(s.muted(`── End of history ──`));
+        console.log('');
+        // Reset footer state so it re-renders cleanly below the output
+        this.footer.resetRenderState();
+        this.needsRender = true;
+    }
+    // ===========================================================================
     // Public API - Config
     // ===========================================================================
     /**
@@ -829,16 +628,21 @@ export class TerminalUI extends EventEmitter {
      */
     reRenderConversation() {
         // Clear screen AND scrollback buffer, then move to home
-        // \x1b[2J - clear entire screen
-        // \x1b[3J - clear scrollback buffer (prevents accumulation)
-        // \x1b[H  - move cursor to home position
         process.stdout.write('\x1b[2J\x1b[3J\x1b[H');
         // Reset footer state since we cleared everything
-        this.lastRenderHeight = 0;
-        this.cursorLineFromBottom = 0;
-        // Re-render all items with new config
-        for (const item of this.conversationHistory) {
-            this.renderItem(item);
+        this.footer.resetRenderState();
+        // Show filter indicator if active
+        if (this.conversation.isFilterActive) {
+            const agentList = [...this.conversation.filterAgentIds].map(id => `$${id}`).join(', ');
+            const s = getStyles();
+            console.log(s.muted(`── Showing messages from: ${agentList} ──`));
+            console.log('');
+        }
+        // Re-render all items with new config (applying filter)
+        for (const item of this.conversation.history) {
+            if (this.conversation.shouldShowItem(item)) {
+                this.renderItemToConsole(item);
+            }
         }
         // Footer will be re-rendered by the render loop
         this.needsRender = true;
@@ -851,336 +655,66 @@ export class TerminalUI extends EventEmitter {
      * Called by /clear command.
      */
     clearConversationHistory() {
-        this.conversationHistory = [];
+        this.conversation.clearHistory();
     }
     /**
      * Get conversation history (copy).
      */
     getConversationHistory() {
-        return [...this.conversationHistory];
+        return this.conversation.getHistory();
     }
     // ===========================================================================
-    // Public API - Overlays
+    // Public API - Conversation Filter (delegated to ConversationStore)
     // ===========================================================================
-    /**
-     * Check if an overlay is currently active.
-     */
-    hasActiveOverlay() {
-        return this.overlayStack.length > 0;
+    setConversationFilter(agentIds) {
+        this.conversation.setFilter(agentIds);
+        this.reRenderConversation();
     }
-    /**
-     * Get the currently active overlay (if any).
-     */
-    getActiveOverlay() {
-        return this.overlayStack.length > 0
-            ? this.overlayStack[this.overlayStack.length - 1]
-            : null;
+    clearConversationFilter() {
+        this.conversation.clearFilter();
+        this.reRenderConversation();
     }
-    /**
-     * Show an overlay and wait for result.
-     * Returns promise that resolves when overlay closes.
-     */
-    async showOverlay(overlay) {
-        // Check if we're pushing onto an existing overlay (stack has items before this push)
-        const isPushingOntoExisting = this.overlayStack.length > 0;
-        // 1. If pushing onto existing overlay, clear its render first
-        if (isPushingOntoExisting) {
-            this.clearOverlayRender();
-        }
-        // 2. Push overlay onto stack
-        this.overlayStack.push(overlay);
-        // 3. Call onMount lifecycle (alternate screen overlays enter alternate screen here)
-        await overlay.onMount?.();
-        // 4. Switch render mode based on overlay type
-        // Skip for alternate screen overlays - they manage their own screen buffer
-        if (!overlay.usesAlternateScreen) {
-            if (overlay.type === 'fullscreen') {
-                this.enterFullscreenOverlayMode();
-            }
-            else {
-                this.enterInlineOverlayMode();
-            }
-        }
-        // 5. Initial render
-        this.renderOverlay();
-        // 6. Wait for close
-        return new Promise((resolve) => {
-            this.overlayResolvers.set(overlay.id, resolve);
-        });
+    getConversationFilter() {
+        return this.conversation.getFilter();
     }
-    /**
-     * Close current overlay with result.
-     * Called internally when overlay returns close action.
-     */
-    closeCurrentOverlay(result, cancelled) {
-        const overlay = this.overlayStack.pop();
-        if (!overlay)
-            return;
-        // Check if overlay uses alternate screen (manages its own screen buffer)
-        const usesAlternateScreen = overlay.usesAlternateScreen === true;
-        // 1. Call onUnmount lifecycle (this exits alternate screen if used)
-        overlay.onUnmount?.();
-        // 2. Get close summary before clearing (needs overlay reference)
-        const summary = (!cancelled && result !== null)
-            ? overlay.getCloseSummary?.(result)
-            : null;
-        // 3. Restore render mode FIRST (clears overlay from screen)
-        if (this.overlayStack.length === 0) {
-            // Skip exitOverlayMode for alternate screen overlays - exiting alternate
-            // screen already restored the main screen, clearing would corrupt it
-            if (usesAlternateScreen) {
-                // Just reset state, skip clearing AND skip re-rendering footer
-                // (alternate screen restore already put the screen back to its previous state)
-                this.overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-                this.flushOverlayPrintBuffer();
-                // Don't call render() - the footer was restored by alternate screen exit
-            }
-            else {
-                this.exitOverlayMode();
-            }
-        }
-        else {
-            // Popping back to parent overlay:
-            // 1. Clear the child overlay's render (skip for alternate screen)
-            if (!usesAlternateScreen) {
-                this.clearOverlayRender();
-            }
-            // 2. Reset render state for parent
-            this.overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-            // 3. Re-render parent overlay
-            this.renderOverlay();
-        }
-        // 4. Show close summary AFTER clearing overlay
-        if (summary) {
-            this.print({ type: 'info', message: summary });
-        }
-        // 5. Resolve promise
-        const resolver = this.overlayResolvers.get(overlay.id);
-        resolver?.(result);
-        this.overlayResolvers.delete(overlay.id);
+    addToConversationFilter(agentId) {
+        return this.conversation.addToFilter(agentId);
     }
-    /**
-     * Enter fullscreen overlay mode.
-     * Clears screen and prepares for overlay rendering.
-     */
-    enterFullscreenOverlayMode() {
-        // Clear footer first
-        this.clear();
-        // Clear screen for fullscreen overlay
-        process.stdout.write('\x1b[2J\x1b[H');
-        // Reset overlay render state (both lineCount and maxLineCount)
-        this.overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-    }
-    /**
-     * Enter inline overlay mode.
-     * Clears footer but keeps conversation visible.
-     */
-    enterInlineOverlayMode() {
-        // Clear footer to make room for inline overlay
-        this.clear();
-        // Reset overlay render state (both lineCount and maxLineCount)
-        this.overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-    }
-    /**
-     * Exit overlay mode and restore normal rendering.
-     */
-    exitOverlayMode() {
-        // Clear overlay content (uses maxLineCount to ensure all lines are cleared)
-        this.clearOverlayRender();
-        // Reset state
-        this.overlayRenderState = { lineCount: 0, maxLineCount: 0 };
-        // Flush any items that were buffered while overlay was active
-        this.flushOverlayPrintBuffer();
-        // Re-render footer
-        this.render();
+    isAgentInFilter(agentId) {
+        return this.conversation.isAgentInFilter(agentId);
     }
-    /**
-     * Flush items that were buffered while an overlay was active.
-     * Called after overlay closes to render any pending output.
-     */
-    flushOverlayPrintBuffer() {
-        if (this.overlayPrintBuffer.length === 0)
-            return;
-        // Render all buffered items
-        for (const item of this.overlayPrintBuffer) {
-            this.renderItem(item);
-        }
-        // Clear the buffer
-        this.overlayPrintBuffer = [];
-    }
-    /**
-     * Clear previous overlay render.
-     * Uses maxLineCount to ensure all lines are cleared even if content shrank between renders.
-     */
-    clearOverlayRender() {
-        // Use maxLineCount to handle cases where overlay content varied between renders
-        const linesToClear = this.overlayRenderState.maxLineCount;
-        if (linesToClear > 0) {
-            // Move cursor up to start of overlay
-            process.stdout.write(`\x1b[${String(linesToClear)}A`);
-            // Move to column 1
-            process.stdout.write('\r');
-            // Clear from cursor to end of screen
-            process.stdout.write('\x1b[J');
-        }
-    }
-    /**
-     * Render the active overlay.
-     */
-    renderOverlay() {
-        const overlay = this.getActiveOverlay();
-        if (!overlay)
-            return;
-        const termWidth = terminal.getTerminalWidth();
-        const termHeight = terminal.getTerminalHeight();
-        const s = getStyles();
-        const context = {
-            width: termWidth,
-            height: termHeight,
-            styles: s,
-        };
-        const content = overlay.render(context);
-        if (overlay.type === 'fullscreen') {
-            this.renderFullscreenOverlay(content, termWidth);
-        }
-        else {
-            this.renderInlineOverlay(content, termWidth);
-        }
+    // ===========================================================================
+    // Public API - Overlays (delegated to OverlayManager)
+    // ===========================================================================
+    hasActiveOverlay() {
+        return this.overlay.hasActiveOverlay();
     }
-    /**
-     * Render fullscreen overlay.
-     *
-     * CRITICAL: Cursor positioning must be consistent between renders.
-     * Same logic as renderInlineOverlay - pad to maxLineCount for consistency.
-     */
-    renderFullscreenOverlay(content, termWidth) {
-        // Clear previous render
-        this.clearOverlayRender();
-        // Calculate physical lines
-        let physicalLines = 0;
-        for (const line of content.lines) {
-            const visibleLen = getVisibleLength(line);
-            physicalLines += Math.max(1, Math.ceil(visibleLen / termWidth));
-        }
-        // Update maxLineCount BEFORE padding (track the natural maximum)
-        const contentMinHeight = content.minHeight ?? 0;
-        const naturalHeight = Math.max(physicalLines, contentMinHeight);
-        this.overlayRenderState.maxLineCount = Math.max(this.overlayRenderState.maxLineCount, naturalHeight);
-        // CRITICAL: Pad to maxLineCount for consistent cursor positioning
-        const targetHeight = this.overlayRenderState.maxLineCount;
-        const paddedLines = [...content.lines];
-        while (physicalLines < targetHeight) {
-            paddedLines.push('');
-            physicalLines++;
-        }
-        // Update lineCount to actual rendered height
-        this.overlayRenderState.lineCount = physicalLines;
-        // Render lines
-        for (let i = 0; i < paddedLines.length; i++) {
-            process.stdout.write(paddedLines[i]);
-            if (i < paddedLines.length - 1) {
-                process.stdout.write('\n');
-            }
-        }
-        // Position cursor if specified
-        if (content.cursorPosition) {
-            const { line, column } = content.cursorPosition;
-            // Move to the correct line (relative from end)
-            const linesFromEnd = paddedLines.length - 1 - line;
-            if (linesFromEnd > 0) {
-                process.stdout.write(`\x1b[${String(linesFromEnd)}A`);
-            }
-            process.stdout.write(`\x1b[${String(column)}G`);
-        }
-        terminal.showCursor();
+    getActiveOverlay() {
+        return this.overlay.getActiveOverlay();
     }
-    /**
-     * Render inline overlay (above footer).
-     *
-     * CRITICAL: Cursor positioning must be consistent between renders.
-     * After rendering, cursor MUST be at maxLineCount position, not at
-     * actual content height. Otherwise, the next clear will move cursor
-     * up by maxLineCount from the wrong position, causing "ghost lines".
-     */
-    renderInlineOverlay(content, termWidth) {
-        // Clear previous render
-        this.clearOverlayRender();
-        // Calculate physical lines
-        let physicalLines = 0;
-        for (const line of content.lines) {
-            const visibleLen = getVisibleLength(line);
-            physicalLines += Math.max(1, Math.ceil(visibleLen / termWidth));
-        }
-        // Update maxLineCount BEFORE padding (track the natural maximum)
-        const contentMinHeight = content.minHeight ?? 0;
-        const naturalHeight = Math.max(physicalLines, contentMinHeight);
-        this.overlayRenderState.maxLineCount = Math.max(this.overlayRenderState.maxLineCount, naturalHeight);
-        // CRITICAL: Pad to maxLineCount, not just minHeight!
-        // This ensures cursor position is consistent between renders.
-        // Without this, going from tall content (e.g., detail screen with 25 lines)
-        // to short content (e.g., main list with 20 lines) leaves cursor at line 20,
-        // but next clear moves up 25 lines → cursor goes to line -5 → ghost lines!
-        const targetHeight = this.overlayRenderState.maxLineCount;
-        const paddedLines = [...content.lines];
-        while (physicalLines < targetHeight) {
-            paddedLines.push('');
-            physicalLines++;
-        }
-        // Update lineCount to actual rendered height
-        this.overlayRenderState.lineCount = physicalLines;
-        // Render lines (each line ends with \n for consistent cursor positioning)
-        for (const line of paddedLines) {
-            process.stdout.write(line + '\n');
-        }
-        terminal.showCursor();
+    async showOverlay(overlay) {
+        return this.overlay.showOverlay(overlay);
     }
-    /**
-     * Process overlay action returned by handleKey.
-     */
-    processOverlayAction(action) {
-        switch (action.type) {
-            case 'none':
-                // Do nothing
-                break;
-            case 'render':
-                this.renderOverlay();
-                break;
-            case 'close':
-                if (action.cancelled) {
-                    this.closeCurrentOverlay(null, true);
-                }
-                else {
-                    this.closeCurrentOverlay(action.result ?? null, false);
-                }
-                break;
-            case 'push':
-                if (action.overlay) {
-                    void this.showOverlay(action.overlay);
-                }
-                break;
-            case 'pop':
-                this.closeCurrentOverlay(null, true);
-                break;
-        }
+    requestOverlayRender() {
+        this.overlay.requestOverlayRender();
     }
     // ===========================================================================
     // Public API - Input queue
     // ===========================================================================
     getQueuedInputs() {
-        return [...this.queuedInputs];
+        return this.input.getQueuedInputs();
     }
     popQueuedInput() {
-        if (this.queuedInputs.length === 0)
-            return null;
-        const input = this.queuedInputs.shift();
-        this.needsRender = true;
-        return input ?? null;
+        const result = this.input.popQueuedInput();
+        if (result !== null)
+            this.needsRender = true;
+        return result;
     }
     hasQueuedInput() {
-        return this.queuedInputs.length > 0;
+        return this.input.hasQueuedInput();
     }
     clearQueue() {
-        this.queuedInputs = [];
+        this.input.clearQueue();
         this.needsRender = true;
     }
     // ===========================================================================
@@ -1225,11 +759,11 @@ export class TerminalUI extends EventEmitter {
             this.renderTimer = null;
         }
         // Stop spinner
-        this.stopSpinnerAnimation();
+        this.footer.stopSpinnerAnimation();
         // Stop keyboard capture
-        this.stopKeyboardCapture();
+        this.keyboard.stopCapture();
         // Clear footer from screen
-        this.clear();
+        this.footer.clear();
     }
     /**
      * Resume footer after pause
@@ -1238,15 +772,15 @@ export class TerminalUI extends EventEmitter {
         this.isPaused = false;
         // Resume spinner if agent running
         if (this.agentRunning) {
-            this.startSpinnerAnimation();
+            this.footer.startSpinnerAnimation(() => { this.needsRender = true; });
         }
         // Restart keyboard capture
-        this.startKeyboardCapture();
+        this.keyboard.startCapture();
         // Restart render loop
-        this.render();
+        this.footer.render();
         this.renderTimer = setInterval(() => {
             if (this.needsRender && !this.isPaused) {
-                this.render();
+                this.footer.render();
                 this.needsRender = false;
             }
         }, 60);
@@ -1255,7 +789,7 @@ export class TerminalUI extends EventEmitter {
      * Restart input after command
      */
     restartInput() {
-        this.render();
+        this.footer.render();
     }
     /**
      * Refresh prompt with theme colors
@@ -1273,1024 +807,13 @@ export class TerminalUI extends EventEmitter {
      * @deprecated Use print() or output() instead
      */
     clearForOutput() {
-        this.clear();
+        this.footer.clear();
     }
     /**
      * @deprecated Use print() or output() instead
      */
     forceRender() {
-        this.render();
+        this.footer.render();
         this.needsRender = false;
     }
-    // ===========================================================================
-    // Private - Rendering
-    // ===========================================================================
-    clear() {
-        if (this.lastRenderHeight === 0) {
-            return;
-        }
-        terminal.moveCursorToLineStart();
-        // Move cursor to TOP of footer
-        // cursorRowFromTop = which row the cursor is on (1-indexed from top of footer)
-        const cursorRowFromTop = this.lastRenderHeight - this.cursorLineFromBottom;
-        const rowsToMoveUp = cursorRowFromTop - 1;
-        if (rowsToMoveUp > 0) {
-            terminal.moveCursorUp(rowsToMoveUp);
-        }
-        terminal.clearToEndOfScreen();
-        this.lastRenderHeight = 0;
-        this.cursorLineFromBottom = 0;
-    }
-    render() {
-        if (!this.isRunning || this.isPaused) {
-            return;
-        }
-        // Don't render footer when overlay is active
-        if (this.hasActiveOverlay()) {
-            return;
-        }
-        const termWidth = terminal.getTerminalWidth();
-        const s = getStyles();
-        // Build all lines in order
-        const lines = [];
-        // 0. LiveRegion (if has items) - rendered at top of footer
-        if (this.liveRegion.hasItems()) {
-            const liveLines = this.liveRegion.render({
-                width: termWidth,
-                verbose: this.config.verbose,
-                showTokens: true,
-            });
-            for (const line of liveLines) {
-                lines.push({
-                    content: line,
-                    physicalLines: getPhysicalLineCount(line, termWidth),
-                });
-            }
-            // Blank line after live region for spacing
-            if (liveLines.length > 0) {
-                lines.push({ content: '', physicalLines: 1 });
-            }
-        }
-        // 1. Header: Spinner (when running) or "Todos" (when idle with todos)
-        if (this.agentRunning) {
-            const spinnerLine = this.buildSpinnerLine();
-            lines.push({
-                content: spinnerLine,
-                physicalLines: getPhysicalLineCount(spinnerLine, termWidth),
-            });
-        }
-        else if (this.todos.length > 0) {
-            const headerLine = s.muted('Todos');
-            lines.push({
-                content: headerLine,
-                physicalLines: 1,
-            });
-        }
-        // 2. Todo list (show if there are todos AND showTodos is true)
-        if (this.todos.length > 0 && this.showTodos) {
-            for (const todo of this.todos) {
-                const todoLine = this.buildTodoLine(todo);
-                lines.push({
-                    content: todoLine,
-                    physicalLines: getPhysicalLineCount(todoLine, termWidth),
-                });
-            }
-            // Blank line after todos for spacing
-            lines.push({ content: '', physicalLines: 1 });
-        }
-        // 3. Queued inputs (show multiline as single line with ↵ indicator)
-        for (const queued of this.queuedInputs) {
-            const displayText = queued.replace(/\n/g, ' ↵ ');
-            const queuedLine = s.muted(`queued: "${displayText}"`);
-            lines.push({
-                content: queuedLine,
-                physicalLines: getPhysicalLineCount(queuedLine, termWidth),
-            });
-        }
-        // 4. Top separator
-        const separator = '─'.repeat(termWidth);
-        lines.push({ content: separator, physicalLines: 1 });
-        // 5. Input prompt (multiline support)
-        const continuationPrompt = s.muted('   \\ ');
-        const continuationPromptLen = getVisibleLength(continuationPrompt);
-        const cursorLineIndex = lines.length + this.currentLine; // Index where cursor is
-        for (let i = 0; i < this.lines.length; i++) {
-            const linePrompt = i === 0 ? this.promptPrefix : continuationPrompt;
-            const linePromptLen = i === 0 ? this.promptPrefixLen : continuationPromptLen;
-            const lineContent = this.lines[i];
-            // Show ghost text on first line when input is empty and no autocomplete
-            let fullLine;
-            let totalLen;
-            if (i === 0 &&
-                lineContent === '' &&
-                this.lines.length === 1 &&
-                this.suggestion &&
-                !this.autocomplete.active &&
-                !this.fileAutocomplete.active) {
-                // Build: [prompt][suggestion]...[↵ send]
-                const rightHint = '↵ send';
-                const leftContent = linePrompt + s.muted(this.suggestion);
-                const leftLen = linePromptLen + this.suggestion.length;
-                const rightLen = rightHint.length;
-                const padding = Math.max(1, termWidth - leftLen - rightLen);
-                fullLine = leftContent + ' '.repeat(padding) + s.muted(rightHint);
-                totalLen = termWidth; // Full width
-            }
-            else {
-                fullLine = linePrompt + lineContent;
-                totalLen = linePromptLen + getVisibleLength(lineContent);
-            }
-            const physicalLines = totalLen === 0 ? 1 : Math.ceil(totalLen / termWidth) || 1;
-            lines.push({
-                content: fullLine,
-                physicalLines,
-            });
-        }
-        // 6. Bottom separator
-        lines.push({ content: separator, physicalLines: 1 });
-        // 7. Mode indicator
-        const modeLine = this.buildModeLine(termWidth);
-        lines.push({
-            content: modeLine,
-            physicalLines: getPhysicalLineCount(modeLine, termWidth),
-        });
-        // 8. Autocomplete dropdown (if active) - file autocomplete takes priority
-        const fileAutocompleteLines = this.buildFileAutocompleteLines(termWidth);
-        const autocompleteLines = fileAutocompleteLines.length > 0
-            ? fileAutocompleteLines
-            : this.buildAutocompleteLines(termWidth);
-        for (const line of autocompleteLines) {
-            lines.push({
-                content: line,
-                physicalLines: getPhysicalLineCount(line, termWidth),
-            });
-        }
-        // Calculate total physical height
-        let totalPhysicalLines = 0;
-        for (const line of lines) {
-            totalPhysicalLines += line.physicalLines;
-        }
-        // Clear existing footer
-        this.clear();
-        // Write all lines
-        for (let i = 0; i < lines.length; i++) {
-            terminal.write(lines[i].content);
-            if (i < lines.length - 1) {
-                terminal.write('\n');
-            }
-        }
-        // Calculate cursor position (for multiline, position on the line where cursor is)
-        let rowsAfterCursor = 0;
-        for (let i = cursorLineIndex + 1; i < lines.length; i++) {
-            rowsAfterCursor += lines[i].physicalLines;
-        }
-        if (rowsAfterCursor > 0) {
-            terminal.moveCursorUp(rowsAfterCursor);
-        }
-        // Calculate column within current line
-        const currentLinePromptLen = this.currentLine === 0 ? this.promptPrefixLen : continuationPromptLen;
-        const totalPos = currentLinePromptLen + this.cursorPos;
-        const cursorCol = (totalPos % termWidth) + 1;
-        terminal.moveCursorToColumn(cursorCol);
-        terminal.showCursor();
-        this.lastRenderHeight = totalPhysicalLines;
-        this.cursorLineFromBottom = rowsAfterCursor;
-    }
-    // ===========================================================================
-    // Private - Line builders
-    // ===========================================================================
-    buildSpinnerLine() {
-        const s = getStyles();
-        const frame = this.spinnerFrames[this.spinnerFrame % this.spinnerFrames.length];
-        const text = this.currentTool ?? this.spinnerText ?? 'Thinking...';
-        // Build hints
-        const hints = ['esc to interrupt'];
-        if (this.todos.length > 0 && this.showTodos) {
-            hints.push('ctrl+t to hide todos');
-        }
-        else if (this.todos.length > 0 && !this.showTodos) {
-            hints.push('ctrl+t to show todos');
-        }
-        const hintsText = hints.length > 0 ? ` (${hints.join(' · ')})` : '';
-        // Format: [CRT scanner] text (hints)
-        return s.muted(`${frame} ${text}${hintsText}`);
-    }
-    buildTodoLine(todo) {
-        const s = getStyles();
-        const icon = todo.status === 'completed' ? '✓' :
-            todo.status === 'in_progress' ? '→' : '☐';
-        const style = todo.status === 'completed' ? s.muted :
-            todo.status === 'in_progress' ? s.info : s.muted;
-        return style(`${icon} ${todo.content}`);
-    }
-    buildModeLine(termWidth) {
-        const s = getStyles();
-        const modeInfo = MODE_INFO[this.mode];
-        let leftPart;
-        switch (this.mode) {
-            case 'normal':
-                leftPart = s.muted(`mode: ${modeInfo.label}  (Shift+Tab to change)`);
-                break;
-            case 'auto-accept':
-                leftPart = s.warning(`mode: ${modeInfo.label}`) + s.muted('  (Shift+Tab to change)');
-                break;
-            case 'plan':
-                leftPart = s.info(`mode: ${modeInfo.label}`) + s.muted('  (Shift+Tab to change)');
-                break;
-            default:
-                leftPart = s.muted(`mode: ${modeInfo.label}  (Shift+Tab to change)`);
-        }
-        if (!this.projectName) {
-            return leftPart;
-        }
-        const projectText = `Project: ${this.projectName}`;
-        const rightPart = s.muted(projectText);
-        const leftVisible = getVisibleLength(leftPart);
-        const padding = Math.max(2, termWidth - leftVisible - projectText.length);
-        return leftPart + ' '.repeat(padding) + rightPart;
-    }
-    buildAutocompleteLines(termWidth) {
-        if (!this.autocomplete.active || this.autocomplete.matches.length === 0) {
-            return [];
-        }
-        const s = getStyles();
-        const lines = [];
-        const { matches, selectedIndex, scrollOffset } = this.autocomplete;
-        const visible = matches.slice(scrollOffset, scrollOffset + MAX_VISIBLE_COMMANDS);
-        const total = matches.length;
-        // Show scroll indicator if there are more items above
-        if (scrollOffset > 0) {
-            lines.push(s.muted(`  ↑ ${String(scrollOffset)} more above`));
-        }
-        for (let i = 0; i < visible.length; i++) {
-            const cmd = visible[i];
-            const actualIndex = scrollOffset + i;
-            const isSelected = actualIndex === selectedIndex;
-            const prefix = isSelected ? s.primary('❯ ') : '  ';
-            const name = isSelected ? s.primaryBold(cmd.command) : cmd.command;
-            // Truncate if too long
-            const baseLen = getVisibleLength(prefix) + getVisibleLength(name) + 3; // 3 for ' - '
-            const maxDescLen = termWidth - baseLen - 2;
-            const truncatedDesc = cmd.description.length > maxDescLen
-                ? cmd.description.slice(0, maxDescLen - 1) + '…'
-                : cmd.description;
-            lines.push(`${prefix}${name} ${s.muted('- ' + truncatedDesc)}`);
-        }
-        // Show scroll indicator if there are more items below
-        const belowCount = total - scrollOffset - visible.length;
-        if (belowCount > 0) {
-            lines.push(s.muted(`  ↓ ${String(belowCount)} more below`));
-        }
-        return lines;
-    }
-    buildFileAutocompleteLines(termWidth) {
-        if (!this.fileAutocomplete.active || this.fileAutocomplete.matches.length === 0) {
-            return [];
-        }
-        const s = getStyles();
-        const lines = [];
-        const { matches, selectedIndex, scrollOffset } = this.fileAutocomplete;
-        const visible = matches.slice(scrollOffset, scrollOffset + MAX_VISIBLE_COMMANDS);
-        const total = matches.length;
-        // Show scroll indicator if there are more items above
-        if (scrollOffset > 0) {
-            lines.push(s.muted(`  ↑ ${String(scrollOffset)} more above`));
-        }
-        for (let i = 0; i < visible.length; i++) {
-            const file = visible[i];
-            const actualIndex = scrollOffset + i;
-            const isSelected = actualIndex === selectedIndex;
-            const prefix = isSelected ? s.primary('❯ ') : '  ';
-            const icon = file.isDirectory ? '📁 ' : '📄 ';
-            const name = isSelected ? s.primaryBold(file.path) : file.path;
-            // Truncate if too long
-            const baseLen = getVisibleLength(prefix) + 3 + getVisibleLength(file.path); // 3 for icon
-            if (baseLen > termWidth - 2) {
-                const maxLen = termWidth - getVisibleLength(prefix) - 5; // 3 for icon, 2 for padding
-                const truncatedPath = file.path.length > maxLen
-                    ? '…' + file.path.slice(-(maxLen - 1))
-                    : file.path;
-                const truncatedName = isSelected ? s.primaryBold(truncatedPath) : truncatedPath;
-                lines.push(`${prefix}${icon}${truncatedName}`);
-            }
-            else {
-                lines.push(`${prefix}${icon}${name}`);
-            }
-        }
-        // Show scroll indicator if there are more items below
-        const belowCount = total - scrollOffset - visible.length;
-        if (belowCount > 0) {
-            lines.push(s.muted(`  ↓ ${String(belowCount)} more below`));
-        }
-        return lines;
-    }
-    // ===========================================================================
-    // Private - Cursor calculations
-    // ===========================================================================
-    // ===========================================================================
-    // Private - Autocomplete
-    // ===========================================================================
-    updateAutocomplete() {
-        const currentLine = this.getCurrentLineContent();
-        // Check for @ file path autocomplete first (works on any line)
-        const atMention = extractAtMention(currentLine, this.cursorPos);
-        if (atMention !== null) {
-            // File autocomplete mode - disable command autocomplete
-            this.autocomplete.active = false;
-            this.autocomplete.matches = [];
-            this.autocomplete.selectedIndex = 0;
-            this.autocomplete.scrollOffset = 0;
-            // Enable file autocomplete
-            this.fileAutocomplete.active = true;
-            this.fileAutocomplete.partial = atMention;
-            this.fileAutocomplete.matches = getFileMatches(atMention);
-            if (this.fileAutocomplete.selectedIndex >= this.fileAutocomplete.matches.length) {
-                this.fileAutocomplete.selectedIndex = Math.max(0, this.fileAutocomplete.matches.length - 1);
-                this.fileAutocomplete.scrollOffset = 0;
-            }
-            return;
-        }
-        // Reset file autocomplete
-        this.fileAutocomplete.active = false;
-        this.fileAutocomplete.matches = [];
-        this.fileAutocomplete.selectedIndex = 0;
-        this.fileAutocomplete.scrollOffset = 0;
-        this.fileAutocomplete.partial = '';
-        // Activate command autocomplete when first line starts with /
-        const firstLine = this.lines[0];
-        if (this.currentLine === 0 && firstLine.startsWith('/')) {
-            this.autocomplete.active = true;
-            const freshCommands = getAutocompleteCommands();
-            this.autocomplete.matches = filterCommands(firstLine, freshCommands);
-            // Reset selection if it's out of bounds
-            if (this.autocomplete.selectedIndex >= this.autocomplete.matches.length) {
-                this.autocomplete.selectedIndex = Math.max(0, this.autocomplete.matches.length - 1);
-                this.autocomplete.scrollOffset = 0;
-            }
-        }
-        else {
-            this.autocomplete.active = false;
-            this.autocomplete.matches = [];
-            this.autocomplete.selectedIndex = 0;
-            this.autocomplete.scrollOffset = 0;
-        }
-    }
-    acceptAutocomplete() {
-        // File autocomplete takes priority (works on current line)
-        if (this.fileAutocomplete.active && this.fileAutocomplete.matches.length > 0) {
-            const selectedFile = this.fileAutocomplete.matches[this.fileAutocomplete.selectedIndex];
-            const currentLine = this.getCurrentLineContent();
-            const result = replaceAtMention(currentLine, this.cursorPos, selectedFile.path);
-            this.lines[this.currentLine] = result.input;
-            this.cursorPos = result.cursorPos;
-            this.fileAutocomplete.active = false;
-            this.fileAutocomplete.matches = [];
-            this.fileAutocomplete.selectedIndex = 0;
-            this.fileAutocomplete.scrollOffset = 0;
-            this.fileAutocomplete.partial = '';
-            // Check if still in @ context (e.g., directory selected, might want to continue)
-            this.updateAutocomplete();
-            return;
-        }
-        // Command autocomplete (works on first line only)
-        if (this.autocomplete.active && this.autocomplete.matches.length > 0) {
-            const selected = this.autocomplete.matches[this.autocomplete.selectedIndex];
-            this.lines[0] = selected.command;
-            this.currentLine = 0;
-            this.cursorPos = this.lines[0].length;
-            this.autocomplete.active = false;
-            this.autocomplete.matches = [];
-            this.autocomplete.selectedIndex = 0;
-            this.autocomplete.scrollOffset = 0;
-        }
-    }
-    closeAutocomplete() {
-        // Close file autocomplete
-        this.fileAutocomplete.active = false;
-        this.fileAutocomplete.matches = [];
-        this.fileAutocomplete.selectedIndex = 0;
-        this.fileAutocomplete.scrollOffset = 0;
-        this.fileAutocomplete.partial = '';
-        // Close command autocomplete
-        this.autocomplete.active = false;
-        this.autocomplete.matches = [];
-        this.autocomplete.selectedIndex = 0;
-        this.autocomplete.scrollOffset = 0;
-    }
-    navigateAutocompleteUp() {
-        // File autocomplete navigation takes priority
-        if (this.fileAutocomplete.active && this.fileAutocomplete.matches.length > 0) {
-            if (this.fileAutocomplete.selectedIndex > 0) {
-                this.fileAutocomplete.selectedIndex--;
-                if (this.fileAutocomplete.selectedIndex < this.fileAutocomplete.scrollOffset) {
-                    this.fileAutocomplete.scrollOffset = this.fileAutocomplete.selectedIndex;
-                }
-                return true;
-            }
-            return false;
-        }
-        // Command autocomplete navigation
-        if (!this.autocomplete.active || this.autocomplete.matches.length === 0) {
-            return false;
-        }
-        if (this.autocomplete.selectedIndex > 0) {
-            this.autocomplete.selectedIndex--;
-            // Adjust scroll if selection goes above visible area
-            if (this.autocomplete.selectedIndex < this.autocomplete.scrollOffset) {
-                this.autocomplete.scrollOffset = this.autocomplete.selectedIndex;
-            }
-            return true;
-        }
-        return false;
-    }
-    navigateAutocompleteDown() {
-        // File autocomplete navigation takes priority
-        if (this.fileAutocomplete.active && this.fileAutocomplete.matches.length > 0) {
-            if (this.fileAutocomplete.selectedIndex < this.fileAutocomplete.matches.length - 1) {
-                this.fileAutocomplete.selectedIndex++;
-                const maxVisibleIndex = this.fileAutocomplete.scrollOffset + MAX_VISIBLE_COMMANDS - 1;
-                if (this.fileAutocomplete.selectedIndex > maxVisibleIndex) {
-                    this.fileAutocomplete.scrollOffset = this.fileAutocomplete.selectedIndex - MAX_VISIBLE_COMMANDS + 1;
-                }
-                return true;
-            }
-            return false;
-        }
-        // Command autocomplete navigation
-        if (!this.autocomplete.active || this.autocomplete.matches.length === 0) {
-            return false;
-        }
-        if (this.autocomplete.selectedIndex < this.autocomplete.matches.length - 1) {
-            this.autocomplete.selectedIndex++;
-            // Adjust scroll if selection goes below visible area
-            const maxVisibleIndex = this.autocomplete.scrollOffset + MAX_VISIBLE_COMMANDS - 1;
-            if (this.autocomplete.selectedIndex > maxVisibleIndex) {
-                this.autocomplete.scrollOffset = this.autocomplete.selectedIndex - MAX_VISIBLE_COMMANDS + 1;
-            }
-            return true;
-        }
-        return false;
-    }
-    // ===========================================================================
-    // Private - History
-    // ===========================================================================
-    addToHistory(input) {
-        const trimmed = input.trim();
-        // Don't add empty or duplicate consecutive entries
-        if (trimmed && (this.history.length === 0 || this.history[this.history.length - 1] !== trimmed)) {
-            this.history.push(trimmed);
-        }
-    }
-    navigateHistoryUp() {
-        if (this.autocomplete.active)
-            return false;
-        if (this.history.length === 0)
-            return false;
-        // Save current input when starting to navigate
-        if (this.historyIndex === -1) {
-            this.savedInput = this.getInputValue();
-        }
-        // Navigate to older entry
-        if (this.historyIndex < this.history.length - 1) {
-            this.historyIndex++;
-            const historyEntry = this.history[this.history.length - 1 - this.historyIndex];
-            // History entries are single-line (newlines stripped on save)
-            this.lines = [historyEntry];
-            this.currentLine = 0;
-            this.cursorPos = historyEntry.length;
-            return true;
-        }
-        return false;
-    }
-    navigateHistoryDown() {
-        if (this.autocomplete.active)
-            return false;
-        if (this.historyIndex < 0)
-            return false;
-        this.historyIndex--;
-        if (this.historyIndex === -1) {
-            // Restore saved input (may be multiline)
-            this.lines = this.savedInput.split('\n');
-            if (this.lines.length === 0)
-                this.lines = [''];
-            this.currentLine = this.lines.length - 1;
-            this.cursorPos = this.lines[this.currentLine].length;
-        }
-        else {
-            // Navigate to newer entry
-            const historyEntry = this.history[this.history.length - 1 - this.historyIndex];
-            this.lines = [historyEntry];
-            this.currentLine = 0;
-            this.cursorPos = historyEntry.length;
-        }
-        return true;
-    }
-    resetHistoryNavigation() {
-        this.historyIndex = -1;
-        this.savedInput = '';
-    }
-    // ===========================================================================
-    // Private - Spinner animation
-    // ===========================================================================
-    startSpinnerAnimation() {
-        if (this.spinnerTimer)
-            return;
-        this.spinnerTimer = setInterval(() => {
-            this.spinnerFrame++;
-            this.needsRender = true;
-        }, 200); // Slower, more relaxed animation
-    }
-    stopSpinnerAnimation() {
-        if (this.spinnerTimer) {
-            clearInterval(this.spinnerTimer);
-            this.spinnerTimer = null;
-        }
-        this.spinnerFrame = 0;
-    }
-    // ===========================================================================
-    // Private - Keyboard handling
-    // ===========================================================================
-    keyHandler = null;
-    dataHandler = null;
-    startKeyboardCapture() {
-        if (this.keyHandler)
-            return; // Already capturing
-        readline.emitKeypressEvents(process.stdin);
-        if (process.stdin.isTTY) {
-            process.stdin.setRawMode(true);
-        }
-        // Handle raw data for reliable Escape and Option+Arrow detection
-        this.dataHandler = (data) => {
-            if (!this.isRunning || this.isPaused)
-                return;
-            // Pure Escape key is a single byte 0x1B
-            if (data.length === 1 && data[0] === 0x1b) {
-                this.handleEscape();
-                return;
-            }
-            // Mac Option+Left (word left): ESC b or ESC [ 1 ; 9 D
-            const isOptionLeft = (data.length === 2 && data[0] === 0x1b && data[1] === 0x62) ||
-                (data.length === 6 &&
-                    data[0] === 0x1b &&
-                    data[1] === 0x5b &&
-                    data[2] === 0x31 &&
-                    data[3] === 0x3b &&
-                    data[4] === 0x39 &&
-                    data[5] === 0x44);
-            // Mac Option+Right (word right): ESC f or ESC [ 1 ; 9 C
-            const isOptionRight = (data.length === 2 && data[0] === 0x1b && data[1] === 0x66) ||
-                (data.length === 6 &&
-                    data[0] === 0x1b &&
-                    data[1] === 0x5b &&
-                    data[2] === 0x31 &&
-                    data[3] === 0x3b &&
-                    data[4] === 0x39 &&
-                    data[5] === 0x43);
-            if (isOptionLeft) {
-                this.handleWordLeft();
-                return;
-            }
-            if (isOptionRight) {
-                this.handleWordRight();
-                return;
-            }
-            // Home/Cmd+Left: Ctrl+A (\x01) or ESC [ H
-            const isHome = (data.length === 1 && data[0] === 0x01) ||
-                (data.length === 3 && data[0] === 0x1b && data[1] === 0x5b && data[2] === 0x48);
-            // End/Cmd+Right: Ctrl+E (\x05) or ESC [ F
-            const isEnd = (data.length === 1 && data[0] === 0x05) ||
-                (data.length === 3 && data[0] === 0x1b && data[1] === 0x5b && data[2] === 0x46);
-            if (isHome) {
-                this.cursorPos = 0;
-                this.needsRender = true;
-                return;
-            }
-            if (isEnd) {
-                this.cursorPos = this.lines[this.currentLine].length;
-                this.needsRender = true;
-                return;
-            }
-        };
-        this.keyHandler = (str, key) => {
-            if (!this.isRunning || this.isPaused)
-                return;
-            // Skip escape here - handled by dataHandler
-            if (key.name === 'escape')
-                return;
-            this.handleKeypress(str, key);
-        };
-        process.stdin.on('data', this.dataHandler);
-        process.stdin.on('keypress', this.keyHandler);
-        process.stdin.resume();
-    }
-    stopKeyboardCapture() {
-        if (this.dataHandler) {
-            process.stdin.removeListener('data', this.dataHandler);
-            this.dataHandler = null;
-        }
-        if (this.keyHandler) {
-            process.stdin.removeListener('keypress', this.keyHandler);
-            this.keyHandler = null;
-        }
-        if (process.stdin.isTTY) {
-            process.stdin.setRawMode(false);
-        }
-    }
-    /**
-     * Handle word left (Option+Left) - move cursor to previous word boundary
-     */
-    handleWordLeft() {
-        const line = this.lines[this.currentLine];
-        if (this.cursorPos > 0) {
-            let pos = this.cursorPos;
-            // Skip spaces
-            while (pos > 0 && line[pos - 1] === ' ')
-                pos--;
-            // Skip word
-            while (pos > 0 && line[pos - 1] !== ' ')
-                pos--;
-            this.cursorPos = pos;
-            this.needsRender = true;
-        }
-        else if (this.currentLine > 0) {
-            // Move to end of previous line
-            this.currentLine--;
-            this.cursorPos = this.lines[this.currentLine].length;
-            this.needsRender = true;
-        }
-    }
-    /**
-     * Handle word right (Option+Right) - move cursor to next word boundary
-     */
-    handleWordRight() {
-        const line = this.lines[this.currentLine];
-        if (this.cursorPos < line.length) {
-            let pos = this.cursorPos;
-            // Skip word
-            while (pos < line.length && line[pos] !== ' ')
-                pos++;
-            // Skip spaces
-            while (pos < line.length && line[pos] === ' ')
-                pos++;
-            this.cursorPos = pos;
-            this.needsRender = true;
-        }
-        else if (this.currentLine < this.lines.length - 1) {
-            // Move to start of next line
-            this.currentLine++;
-            this.cursorPos = 0;
-            this.needsRender = true;
-        }
-    }
-    /**
-     * Handle Escape key - called from raw data handler for reliable detection
-     */
-    handleEscape() {
-        // In verbose-temp mode, escape returns to normal
-        if (this.viewMode === 'verbose-temp') {
-            this.viewMode = 'normal';
-            this.reRenderConversationVerbose(false);
-            return;
-        }
-        // Route escape to active overlay if present
-        const overlay = this.getActiveOverlay();
-        if (overlay) {
-            const keyEvent = {
-                raw: Buffer.from([0x1b]),
-                name: 'escape',
-                ctrl: false,
-                shift: false,
-                meta: false,
-            };
-            const actionOrPromise = overlay.handleKey(keyEvent);
-            // Handle both sync and async handleKey
-            if (actionOrPromise instanceof Promise) {
-                actionOrPromise
-                    .then((action) => { this.processOverlayAction(action); })
-                    .catch((err) => { console.error('Overlay handleKey error:', err); });
-            }
-            else {
-                this.processOverlayAction(actionOrPromise);
-            }
-            return;
-        }
-        const now = Date.now();
-        const timeSinceLastEsc = now - this.lastEscapeTime;
-        const isDoubleEsc = timeSinceLastEsc < 500;
-        this.lastEscapeTime = now;
-        if (this.fileAutocomplete.active) {
-            // 1. Close file autocomplete first
-            this.closeAutocomplete();
-            this.needsRender = true;
-        }
-        else if (this.autocomplete.active) {
-            // 2. Close command autocomplete
-            this.closeAutocomplete();
-            this.needsRender = true;
-        }
-        else if (isDoubleEsc && this.getInputValue().length > 0) {
-            // 3. Double Esc clears input (if there's content)
-            this.clearInput();
-            this.resetHistoryNavigation();
-            this.needsRender = true;
-        }
-        else if (this.agentRunning) {
-            // 4. Single Esc cancels agent
-            this.emit('cancel');
-        }
-        else {
-            // 5. Single Esc emits escape
-            this.emit('escape');
-        }
-    }
-    /**
-     * Handle keypress when overlay is active.
-     * Converts keyboard event to KeyEvent and routes to overlay.
-     */
-    handleOverlayKeypress(str, key) {
-        const overlay = this.getActiveOverlay();
-        if (!overlay)
-            return;
-        // Build KeyEvent from keypress data
-        const rawData = key.sequence ?? str;
-        const keyName = key.name ?? (str ? str.toLowerCase() : '');
-        const keyEvent = {
-            raw: Buffer.from(rawData),
-            name: keyName,
-            char: str && str.length === 1 && str.charCodeAt(0) >= 32 ? str : undefined,
-            ctrl: key.ctrl ?? false,
-            shift: key.shift ?? false,
-            meta: key.meta ?? false,
-        };
-        const actionOrPromise = overlay.handleKey(keyEvent);
-        // Handle both sync and async handleKey
-        if (actionOrPromise instanceof Promise) {
-            actionOrPromise
-                .then((action) => { this.processOverlayAction(action); })
-                .catch((err) => { console.error('Overlay handleKey error:', err); });
-        }
-        else {
-            this.processOverlayAction(actionOrPromise);
-        }
-    }
-    handleKeypress(str, key) {
-        // Route to active overlay if present
-        if (this.hasActiveOverlay()) {
-            this.handleOverlayKeypress(str, key);
-            return;
-        }
-        // In verbose-temp mode, any key (except Ctrl+O) returns to normal
-        if (this.viewMode === 'verbose-temp') {
-            // Ctrl+O toggles back
-            if (key.ctrl && key.name === 'o') {
-                this.toggleVerboseView();
-                this.toggleLiveRegionExpanded();
-                return;
-            }
-            // Any other key returns to normal
-            this.viewMode = 'normal';
-            this.reRenderConversationVerbose(false);
-            // Don't consume the key - let it be processed normally
-        }
-        // Ctrl+C - interrupt/exit
-        if (key.ctrl && key.name === 'c') {
-            this.emit('interrupt');
-            return;
-        }
-        // Ctrl+T - toggle todo list visibility
-        if (key.ctrl && key.name === 't') {
-            this.toggleTodos();
-            return;
-        }
-        // Ctrl+O - toggle verbose view mode AND LiveRegion expansion
-        if (key.ctrl && key.name === 'o') {
-            this.toggleVerboseView();
-            this.toggleLiveRegionExpanded();
-            return;
-        }
-        // Tab - accept suggestion, or autocomplete
-        if (key.name === 'tab' && !key.shift) {
-            // Accept ghost text suggestion if input is empty
-            if (this.suggestion && this.getInputValue() === '') {
-                this.lines[0] = this.suggestion;
-                this.cursorPos = this.suggestion.length;
-                this.suggestion = null;
-                this.needsRender = true;
-                return;
-            }
-            if (this.fileAutocomplete.active && this.fileAutocomplete.matches.length > 0) {
-                this.acceptAutocomplete();
-                this.needsRender = true;
-                return;
-            }
-            if (this.autocomplete.active && this.autocomplete.matches.length > 0) {
-                this.acceptAutocomplete();
-                this.needsRender = true;
-                return;
-            }
-            // Otherwise ignore tab (or could insert spaces)
-            return;
-        }
-        // Enter - handle multiline continuation, autocomplete, then execute
-        if (key.name === 'return') {
-            // Check for backslash continuation at end of current line
-            const currentLine = this.getCurrentLineContent();
-            if (currentLine.endsWith('\\')) {
-                // Remove backslash and add new line
-                this.lines[this.currentLine] = currentLine.slice(0, -1);
-                this.lines.push('');
-                this.currentLine++;
-                this.cursorPos = 0;
-                this.closeAutocomplete();
-                this.resetHistoryNavigation();
-                this.needsRender = true;
-                return;
-            }
-            // If file autocomplete is active, accept the selection and submit
-            if (this.fileAutocomplete.active && this.fileAutocomplete.matches.length > 0) {
-                this.acceptAutocomplete();
-                // Fall through to submit the message
-            }
-            // If command autocomplete is active, accept the selection first
-            if (this.autocomplete.active && this.autocomplete.matches.length > 0) {
-                this.acceptAutocomplete();
-                // Fall through to execute the command
-            }
-            let input = this.getInputValue().trim();
-            // If input is empty but we have a ghost text suggestion, accept it
-            if (!input && this.suggestion) {
-                input = this.suggestion;
-                this.suggestion = null;
-            }
-            if (input) {
-                // Add to history before processing (store as single line for history)
-                this.addToHistory(input.replace(/\n/g, ' '));
-                this.resetHistoryNavigation();
-                if (this.agentRunning) {
-                    this.queuedInputs.push(input);
-                    this.needsRender = true;
-                }
-                else if (input.startsWith('/')) {
-                    const spaceIndex = input.indexOf(' ');
-                    const cmd = spaceIndex > 0 ? input.slice(1, spaceIndex) : input.slice(1);
-                    const args = spaceIndex > 0 ? input.slice(spaceIndex + 1) : '';
-                    this.closeAutocomplete();
-                    this.emit('command', cmd, args);
-                }
-                else {
-                    this.emit('submit', input);
-                }
-                this.clearInput();
-                this.closeAutocomplete();
-                this.needsRender = true;
-            }
-            return;
-        }
-        // Arrow Up - autocomplete > multiline navigation > history
-        if (key.name === 'up') {
-            // 1. Autocomplete navigation takes priority
-            if (this.navigateAutocompleteUp()) {
-                this.needsRender = true;
-                return;
-            }
-            // 2. Navigate to previous line in multiline input
-            if (this.currentLine > 0) {
-                this.currentLine--;
-                // Try to keep same cursor position, but clamp to line length
-                this.cursorPos = Math.min(this.cursorPos, this.lines[this.currentLine].length);
-                this.needsRender = true;
-                return;
-            }
-            // 3. History navigation (only when at first line)
-            if (this.navigateHistoryUp()) {
-                this.closeAutocomplete();
-                this.needsRender = true;
-            }
-            return;
-        }
-        // Arrow Down - autocomplete > multiline navigation > history
-        if (key.name === 'down') {
-            // 1. Autocomplete navigation takes priority
-            if (this.navigateAutocompleteDown()) {
-                this.needsRender = true;
-                return;
-            }
-            // 2. Navigate to next line in multiline input
-            if (this.currentLine < this.lines.length - 1) {
-                this.currentLine++;
-                // Try to keep same cursor position, but clamp to line length
-                this.cursorPos = Math.min(this.cursorPos, this.lines[this.currentLine].length);
-                this.needsRender = true;
-                return;
-            }
-            // 3. History forward (only when at last line)
-            if (this.historyIndex >= 0 && this.navigateHistoryDown()) {
-                this.needsRender = true;
-            }
-            return;
-        }
-        // Backspace
-        if (key.name === 'backspace') {
-            if (this.cursorPos > 0) {
-                // Delete character in current line
-                const line = this.lines[this.currentLine];
-                this.lines[this.currentLine] = line.slice(0, this.cursorPos - 1) + line.slice(this.cursorPos);
-                this.cursorPos--;
-                this.resetHistoryNavigation();
-                this.updateAutocomplete();
-                this.needsRender = true;
-            }
-            else if (this.currentLine > 0) {
-                // At start of line - merge with previous line
-                const currentLine = this.lines[this.currentLine];
-                const prevLine = this.lines[this.currentLine - 1];
-                this.lines[this.currentLine - 1] = prevLine + currentLine;
-                this.lines.splice(this.currentLine, 1);
-                this.currentLine--;
-                this.cursorPos = prevLine.length;
-                this.resetHistoryNavigation();
-                this.updateAutocomplete();
-                this.needsRender = true;
-            }
-            return;
-        }
-        // Delete
-        if (key.name === 'delete') {
-            const line = this.lines[this.currentLine];
-            if (this.cursorPos < line.length) {
-                // Delete character in current line
-                this.lines[this.currentLine] = line.slice(0, this.cursorPos) + line.slice(this.cursorPos + 1);
-                this.resetHistoryNavigation();
-                this.updateAutocomplete();
-                this.needsRender = true;
-            }
-            else if (this.currentLine < this.lines.length - 1) {
-                // At end of line - merge with next line
-                const nextLine = this.lines[this.currentLine + 1];
-                this.lines[this.currentLine] = line + nextLine;
-                this.lines.splice(this.currentLine + 1, 1);
-                this.resetHistoryNavigation();
-                this.updateAutocomplete();
-                this.needsRender = true;
-            }
-            return;
-        }
-        // Arrow keys (left/right for cursor movement with multiline support)
-        if (key.name === 'left') {
-            if (this.cursorPos > 0) {
-                this.cursorPos--;
-                this.needsRender = true;
-            }
-            else if (this.currentLine > 0) {
-                // Move to end of previous line
-                this.currentLine--;
-                this.cursorPos = this.lines[this.currentLine].length;
-                this.needsRender = true;
-            }
-            return;
-        }
-        if (key.name === 'right') {
-            const lineLen = this.lines[this.currentLine].length;
-            if (this.cursorPos < lineLen) {
-                this.cursorPos++;
-                this.needsRender = true;
-            }
-            else if (this.currentLine < this.lines.length - 1) {
-                // Move to start of next line
-                this.currentLine++;
-                this.cursorPos = 0;
-                this.needsRender = true;
-            }
-            return;
-        }
-        if (key.name === 'home') {
-            this.cursorPos = 0;
-            this.needsRender = true;
-            return;
-        }
-        if (key.name === 'end') {
-            this.cursorPos = this.lines[this.currentLine].length;
-            this.needsRender = true;
-            return;
-        }
-        // Shift+Tab - mode change
-        if (key.shift && key.name === 'tab') {
-            this.emit('modeChange');
-            return;
-        }
-        // Regular character
-        if (str && str.length === 1 && str.charCodeAt(0) >= 32) {
-            // Clear ghost text suggestion when user starts typing
-            if (this.suggestion) {
-                this.suggestion = null;
-            }
-            const line = this.lines[this.currentLine];
-            this.lines[this.currentLine] =
-                line.slice(0, this.cursorPos) + str + line.slice(this.cursorPos);
-            this.cursorPos++;
-            this.resetHistoryNavigation();
-            this.updateAutocomplete();
-            this.needsRender = true;
-        }
-    }
 }