@north-light/crouter 0.3.172 → 0.3.174

package/dist/commands/sys/setup-wizard.js

@@ -1,1375 +1,54 @@
-import { BROKER_LIMIT_OVERRIDE_PRECEDENCE } from './setup.js';
-import { getMarkdownTheme, getSelectListTheme, getSettingsListTheme } from '@earendil-works/pi-coding-agent';
-import { TUI, ProcessTerminal, Input, matchesKey, truncateToWidth, visibleWidth } from '@earendil-works/pi-tui';
-import { LoginDialogComponent, ModelRegistry, ModelRuntime, ModelSelectorComponent, ThinkingSelectorComponent, SettingsManager } from '@earendil-works/pi-coding-agent';
-import { readAuthCredentials } from '../../core/auth-file.js';
-import { PoolCredentialStore } from '../../core/pool-credential-store.js';
-import { dialogAuthInteraction } from '../../core/auth-interaction.js';
-import { execFile } from 'node:child_process';
-import { basename, dirname, join } from 'node:path';
-import { applyTheme, defaultAgentDir } from '../../clients/attach/config.js';
-import { ANTHROPIC_PROVIDER_ID, OPENAI_CODEX_PROVIDER_ID, isManagedProvider, promoteSubscription, readSubscriptionPool, renameSubscription, } from '../../core/subscription-state.js';
-import { removeProviderRow } from '../../core/provider-management.js';
-import { readConfig, readRawConfigAtRoot, readRawScopeConfig, updateConfig, updateRawConfigAtomically, persistDefaultKindModel, persistModelLadders, readMergedLaunchConfig } from '../../core/config.js';
-import { findProjectScopeRoots, userScopeRoot } from '../../core/scope.js';
-import { loadProfileManifest, profileRoot } from '../../core/profiles/manifest.js';
-import { USER_SETTINGS } from '../../core/user-settings.js';
-import { BINDING_CATALOG, formatBinding, formatGesture, isAttachPaneBinding, matchesPiTuiInput, persistUserKeybindings, resolveKeybindings, KeybindingConcurrentEditError, KeybindingValidationError, } from '../../core/keybindings/index.js';
-import { configuredLadderProviders, inferPortableModelSelection } from '../../core/runtime/model-selection.js';
-import { cliClient } from '../api-client.js';
-import { installTmuxBindings, occupiedTmuxRootGestures } from '../../core/runtime/tmux-chrome.js';
-const ANSI_GREEN = (s) => `\x1b[32m${s}\x1b[39m`;
-const ANSI_YELLOW = (s) => `\x1b[33m${s}\x1b[39m`;
-const theme = {
-    fg(role, text) {
-        switch (role) {
-            case 'border':
-                return getMarkdownTheme().hr(text);
-            case 'accent':
-                return getMarkdownTheme().heading(text);
-            case 'dim':
-                return getSettingsListTheme().description(text);
-            case 'muted':
-                return getSelectListTheme().description(text);
-            case 'mdLink':
-                return getMarkdownTheme().link(text);
-            case 'mdLinkUrl':
-                return getMarkdownTheme().linkUrl(text);
-            case 'success':
-                return ANSI_GREEN(text);
-            case 'warning':
-                return ANSI_YELLOW(text);
-        }
-    },
-    bg(_role, text) {
-        return text;
-    },
-    bold(text) {
-        return getMarkdownTheme().bold(text);
-    },
-};
-import { buildSetupInitialState, executeSetupSubmission, formatSetupExecutionSummary, reconcileInboxFrontDoor, renderSetupStaticInstructions, resolveExaKeyPath, detectExaKey, SetupKeybindingsDraft, } from './setup-core.js';
-function wrapText(text, width) {
-    const clean = text.trim();
-    if (clean === '')
-        return [''];
-    if (width <= 1)
-        return [truncateToWidth(clean, width)];
-    const words = clean.split(/\s+/);
-    const lines = [];
-    let current = '';
-    for (const word of words) {
-        if (current === '') {
-            current = word;
-            continue;
-        }
-        const next = `${current} ${word}`;
-        if (truncateToWidth(next, width) === next) {
-            current = next;
-        }
-        else {
-            lines.push(truncateToWidth(current, width));
-            current = word;
-        }
-    }
-    if (current !== '')
-        lines.push(truncateToWidth(current, width));
-    return lines.length > 0 ? lines : [''];
-}
-function currentWidth() {
-    return Math.max(1, process.stdout.columns ?? 80);
-}
-function toolLabel(tool) {
-    if (tool === 'nvim')
-        return 'nvim';
-    if (tool === 'nerd-font')
-        return 'Nerd Font';
-    return 'tmux';
-}
-function positiveInteger(value) {
-    if (typeof value !== 'number' || !Number.isSafeInteger(value) || value < 1)
-        return undefined;
-    return value;
-}
-function parsePositiveInteger(value) {
-    if (!/^\d+$/.test(value))
-        return undefined;
-    return positiveInteger(Number(value));
-}
-/** Inline badge for an optional API-key tab header: green ✓ when a key is
- *  already resolvable (naming its source so an env-provided key isn't mistaken
- *  for the writable file), dim — when absent. */
-function keyStatusBadge(presence, envVar) {
-    if (!presence.present)
-        return theme.fg('dim', '  · not set');
-    const where = presence.source === 'env' ? `${envVar} env` : 'saved';
-    return theme.fg('success', `  ✓ configured (${where})`);
-}
-function renderRows(lines, width) {
-    return lines.map((line) => truncateToWidth(line, width));
-}
-function padAnsi(text, width) {
-    const used = visibleWidth(text);
-    if (used >= width)
-        return truncateToWidth(text, width);
-    return `${text}${' '.repeat(width - used)}`;
-}
-function rule(width) {
-    return theme.fg('border', '─'.repeat(Math.max(0, width)));
-}
-function tabPill(label, active) {
-    return active
-        ? theme.bg('selectedBg', theme.fg('accent', theme.bold(` ${label} `)))
-        : theme.fg('dim', ` ${label} `);
-}
-/** Centered, selection-following [start, end) slice of `count` items that
- *  always includes `selected`, clamped to at most `capacity` entries. Mirrors
- *  the oauth/config/session selector formula used elsewhere in pi. Exported for
- *  direct unit coverage of the windowing math (see setup-providers-viewport.test.ts). */
-export function visibleRange(count, selected, capacity) {
-    if (count <= 0)
-        return { start: 0, end: 0 };
-    const cap = Math.max(1, Math.min(capacity, count));
-    const start = Math.max(0, Math.min(selected - Math.floor(cap / 2), count - cap));
-    return { start, end: Math.min(count, start + cap) };
-}
-function framed(lines, width) {
-    if (width < 4)
-        return lines.map((line) => truncateToWidth(line, width));
-    const innerWidth = width - 4;
-    const border = theme.fg('border', '│');
-    const top = theme.fg('border', `┌${'─'.repeat(width - 2)}┐`);
-    const bottom = theme.fg('border', `└${'─'.repeat(width - 2)}┘`);
-    const body = lines.map((line) => {
-        const content = padAnsi(truncateToWidth(line, innerWidth), innerWidth);
-        return `${border} ${content} ${border}`;
-    });
-    return [top, ...body, bottom];
-}
-// The frame's top/bottom border rows, spent by `framed()`.
-const FRAME_OVERHEAD = 2;
-// Models panel chrome: title, subtitle, blank — the first lines dropped when the
-// panel body has to fit a short terminal.
-const MODELS_CHROME_LINES = 3;
-/** Fits a modal's static content lines into `budget`, keeping the tail — the
- *  actionable line every modal ends on (a confirm prompt, a live text input,
- *  a login dialog's current prompt/hint) — and dropping from the head, where
- *  informational chrome (title, count, a dialog's older status lines) lives.
- *  Mirrors the roster/catalog priority (mandatory content survives, chrome
- *  collapses first) for the panel's static modal bodies. */
-function fitTail(lines, budget) {
-    return budget >= lines.length ? lines : lines.slice(lines.length - budget);
-}
-// Every panel interested in the same auth file shares its in-flight snapshot. The setup wizard
-// can rebuild panels faster than a cross-process lock round-trip; sharing that read avoids a
-// backlog of obsolete lock contenders while each panel still updates from the completed snapshot.
-const pendingAuthSnapshots = new Map();
-function readAuthSnapshot(authPath) {
-    const existing = pendingAuthSnapshots.get(authPath);
-    if (existing !== undefined)
-        return existing;
-    const pending = readAuthCredentials(authPath);
-    pendingAuthSnapshots.set(authPath, pending);
-    void pending.then(() => { if (pendingAuthSnapshots.get(authPath) === pending)
-        pendingAuthSnapshots.delete(authPath); }, () => { if (pendingAuthSnapshots.get(authPath) === pending)
-        pendingAuthSnapshots.delete(authPath); });
-    return pending;
-}
-/** Curated setup-catalog view over pi's OAuth providers + the model registry. */
-export function buildProviderCatalog(runtime, registry) {
-    const oauth = runtime.getProviders().filter((provider) => provider.auth.oauth !== undefined);
-    const oauthIds = new Set(oauth.map((provider) => provider.id));
-    const seen = new Set();
-    return [
-        ...oauth.map((provider) => ({
-            providerId: provider.id,
-            name: provider.name,
-            managed: provider.id === ANTHROPIC_PROVIDER_ID || provider.id === OPENAI_CODEX_PROVIDER_ID,
-            authType: 'oauth',
-        })),
-        ...registry.getAll().map((model) => ({
-            providerId: model.provider,
-            name: registry.getProviderDisplayName(model.provider),
-            managed: model.provider === ANTHROPIC_PROVIDER_ID || model.provider === OPENAI_CODEX_PROVIDER_ID,
-            authType: oauthIds.has(model.provider) ? 'oauth' : 'api_key',
-        })),
-    ].filter((provider) => !seen.has(provider.providerId) && Boolean(seen.add(provider.providerId)));
-}
-/** Classifies a `startLogin` failure into a user-facing status line. */
-export function classifyLoginFailure(error, aborted) {
-    if (aborted)
-        return 'Login cancelled';
-    if (error instanceof Error && error.name === 'AbortError')
-        return 'Login cancelled';
-    return `Login error: ${error instanceof Error ? error.message : String(error)}`;
-}
-class ProviderPanel {
-    tui;
-    agentDir;
-    runtime;
-    registry;
-    renameInput = new Input();
-    rows = [];
-    selected = 0;
-    mode = 'list';
-    notice = '';
-    catalog = [];
-    catalogIndex = 0;
-    loginProvider;
-    dialog;
-    loginFlow;
-    mutationInFlight = false;
-    reloadGeneration = 0;
-    disposed = false;
-    // Wired by the host wizard to bust its render-line cache. The panel proxies pi's
-    // LoginDialogComponent (it is not a real pi TUI child), so the host only repaints on
-    // synchronous input. startLogin drives OAuth through async promise chains whose state
-    // transitions land between keystrokes; notifyChange() lets each one force a fresh frame.
-    onChange;
-    constructor(tui, agentDir, runtime, registry) {
-        this.tui = tui;
-        this.agentDir = agentDir;
-        this.runtime = runtime;
-        this.registry = registry;
-        this.renameInput.onSubmit = () => this.rename();
-        this.renameInput.onEscape = () => { this.mode = 'list'; };
-        this.reload();
-    }
-    // Repaint the host after an async login transition: bust the wizard's cached lines
-    // (onChange) so render() recomputes the NEW state, then ask pi's loop to draw a frame.
-    notifyChange() {
-        this.onChange?.();
-        this.tui.requestRender();
-    }
-    /** auth.json changed under us (a login landed, a provider was removed). pi 0.82
-     *  serves provider auth status from the runtime's SNAPSHOT rather than a live file
-     *  read, so the snapshot has to be re-taken before the roster can see the change.
-     *  `refresh()` is local-only here (the runtime is composed with model network access
-     *  off), so this is a credential re-list, not a catalog fetch. */
-    reloadAfterAuthChange() {
-        this.reload();
-        void this.registry.refresh().then(() => {
-            this.reload();
-            this.notifyChange();
-        });
-    }
-    reload() {
-        const registry = this.registry;
-        const authPath = join(this.agentDir, 'auth.json');
-        const rows = [];
-        for (const provider of buildProviderCatalog(this.runtime, registry)) {
-            const status = registry.getProviderAuthStatus(provider.providerId);
-            if (provider.managed) {
-                const pool = readSubscriptionPool(provider.providerId);
-                if (pool.length === 0 && !status.source)
-                    continue;
-                // Every stored account carries a credential, so pool occupancy is what makes the
-                // provider configured.
-                rows.push({ ...provider, configured: pool.length > 0 || status.configured, source: status.source, sourceLabel: status.label });
-                pool.forEach((account, index) => rows.push({ ...provider, label: account.label, preferred: index === 0, cooldownUntil: account.rateLimitedUntil, accountId: account.accountId }));
-                continue;
-            }
-            if (!status.source)
-                continue;
-            rows.push({ ...provider, configured: status.configured, source: status.source, sourceLabel: status.label });
-        }
-        this.rows = rows;
-        this.selected = Math.min(this.selected, Math.max(0, rows.length));
-        const generation = ++this.reloadGeneration;
-        void readAuthSnapshot(authPath).then((credentials) => {
-            if (this.disposed || generation !== this.reloadGeneration)
-                return;
-            for (const row of this.rows) {
-                if (row.managed)
-                    continue;
-                const accountId = credentials[row.providerId]?.accountId;
-                row.accountId = typeof accountId === 'string' ? accountId : undefined;
-            }
-            this.notifyChange();
-        }).catch((error) => {
-            if (this.disposed || generation !== this.reloadGeneration)
-                return;
-            this.notice = error instanceof Error ? error.message : String(error);
-            this.notifyChange();
-        });
-    }
-    selectedRow() { return this.rows[this.selected]; }
-    openBrowser(url) {
-        const command = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'cmd' : 'xdg-open';
-        const args = process.platform === 'win32' ? ['/c', 'start', '', url] : [url];
-        execFile(command, args, { timeout: 5_000 }, () => { });
-    }
-    openCatalog() {
-        this.catalog = buildProviderCatalog(this.runtime, this.registry);
-        this.catalogIndex = 0;
-        this.mode = 'catalog';
-    }
-    startLogin(provider, label) {
-        this.loginProvider = provider;
-        let flow;
-        const complete = (message) => {
-            if (!flow.active || this.loginFlow !== flow)
-                return;
-            flow.active = false;
-            this.loginFlow = undefined;
-            this.dialog = undefined;
-            this.mode = 'list';
-            this.notice = message;
-            this.reloadAfterAuthChange();
-            this.notifyChange();
-        };
-        const dialog = new LoginDialogComponent(this.tui, provider.providerId, (success, message) => {
-            if (!success)
-                complete(message ? `Login failed: ${message}` : 'Login cancelled');
-        }, provider.name);
-        flow = { dialog, active: true, committing: false };
-        this.loginFlow = flow;
-        this.dialog = dialog;
-        this.mode = 'login';
-        const handleDialogInput = dialog.handleInput.bind(dialog);
-        dialog.handleInput = (data) => { if (!flow.committing)
-            handleDialogInput(data); };
-        const isActive = () => flow.active && this.loginFlow === flow && !dialog.signal.aborted;
-        const beginCommit = () => {
-            if (!isActive())
-                return false;
-            flow.committing = true;
-            dialog.showDetails(['Saving credentials…']);
-            return true;
-        };
-        const fail = (error) => {
-            complete(classifyLoginFailure(error, dialog.signal.aborted));
-        };
-        if (provider.authType === 'api_key') {
-            void dialog.showPrompt(`Enter API key for ${provider.name}:`, 'sk-...').then(async (key) => {
-                if (!isActive())
-                    return;
-                if (!key.trim()) {
-                    complete('No key entered — login cancelled');
-                    return;
-                }
-                // Interactive collection stays client-side (TTY); the WRITE moves to the
-                // API (PUT /model-auth/{provider}) so this process never touches auth.json.
-                if (!beginCommit())
-                    return;
-                await cliClient().installCredential(provider.providerId, { kind: 'api_key', api_key: key.trim() });
-                complete(`API key saved for ${provider.name}`);
-            }).catch(fail);
-            return;
-        }
-        // pi 0.82 collapsed the six login callbacks into one AuthInteraction; the adapter
-        // onto LoginDialogComponent is shared with the attach viewer's /login overlay.
-        const interaction = dialogAuthInteraction(dialog, {
-            openBrowser: (url) => this.openBrowser(url),
-            onChange: () => this.notifyChange(),
-            isActive,
-        });
-        const oauth = this.runtime.getProvider(provider.providerId)?.auth.oauth;
-        if (!oauth) {
-            complete(`Unknown OAuth provider: ${provider.providerId}`);
-            return;
-        }
-        if (!provider.managed) {
-            // Collect tokens client-side (browser/TTY), then WRITE via the API so this
-            // process never touches auth.json. In 0.82 `provider.auth.oauth.login()`
-            // RETURNS the credential without persisting it (persistence is app-owned),
-            // which is exactly the collect-without-persist half this needs.
-            void oauth.login(interaction).then(async (credentials) => {
-                if (!isActive())
-                    return;
-                if (!beginCommit())
-                    return;
-                // Forward non-standard credential keys (e.g. github-copilot's `enterpriseUrl`)
-                // so enterprise routing and token refresh retain the provider data they require.
-                // The named tokens and store `type` are handled separately; all other keys travel
-                // through `extra` and the handler writes them into auth.json.
-                const { type: _type, access, refresh, expires, ...extra } = credentials;
-                await cliClient().installCredential(provider.providerId, {
-                    kind: 'oauth',
-                    access_token: access,
-                    refresh_token: refresh,
-                    expires_at: new Date(expires).toISOString(),
-                    ...(Object.keys(extra).length > 0 ? { extra } : {}),
-                });
-                if (isActive())
-                    complete(`Logged in to ${provider.name}`);
-            }).catch(fail);
-            return;
-        }
-        // Snapshot the newest pool cooldown before OAuth so a later 429 remains authoritative.
-        const lastRateLimitedAt = Math.max(0, ...readSubscriptionPool(provider.providerId).map((entry) => entry.lastRateLimitedAt));
-        void oauth.login(interaction).then(async (credential) => {
-            if (!isActive())
-                return;
-            if (!beginCommit())
-                return;
-            const accountId = typeof credential.accountId === 'string' && credential.accountId.trim() ? credential.accountId.trim() : undefined;
-            // Collected via pi's managed login (client); the API persists it into the pool, where
-            // account identity selects an existing row or labels a newly seen account.
-            await cliClient().installCredential(provider.providerId, {
-                kind: 'managed_account',
-                ...(label ? { label } : {}),
-                ...(label ? {} : { auto_label: true }),
-                ...(accountId ? { account_id: accountId } : {}),
-                access_token: credential.access,
-                refresh_token: credential.refresh,
-                expires_at: new Date(credential.expires).toISOString(),
-                last_rate_limited_at: lastRateLimitedAt,
-            });
-            if (isActive())
-                complete(`Logged in to ${provider.name}`);
-        }).catch(fail);
-    }
-    isNestedFlowActive() { return this.mode === 'login'; }
-    dispose() {
-        this.disposed = true;
-        const flow = this.loginFlow;
-        if (!flow)
-            return;
-        flow.active = false;
-        this.loginFlow = undefined;
-        this.dialog = undefined;
-        flow.dialog.handleInput('\u001b');
-    }
-    runMutation(operation) {
-        if (this.mutationInFlight)
-            return;
-        this.mutationInFlight = true;
-        void operation().catch((error) => {
-            this.notice = error instanceof Error ? error.message : String(error);
-        }).finally(() => {
-            this.mutationInFlight = false;
-            this.notifyChange();
-        });
-    }
-    rename() {
-        const row = this.selectedRow();
-        if (!row?.managed || !row.label)
-            return;
-        this.mode = 'list';
-        this.runMutation(async () => {
-            await renameSubscription(row.providerId, row.label, this.renameInput.getValue());
-            this.notice = `Renamed ${row.name} account`;
-            this.reload();
-        });
-    }
-    remove(row) {
-        this.runMutation(async () => {
-            this.notice = await removeProviderRow(this.agentDir, row);
-            this.reloadAfterAuthChange();
-        });
-    }
-    promote(row) {
-        this.runMutation(async () => {
-            await promoteSubscription(row.providerId, row.label);
-            this.notice = `Preferred ${row.name} account`;
-            this.reload();
-        });
-    }
-    handleInput(data) {
-        if (this.mode === 'login') {
-            this.dialog?.handleInput(data);
-            return true;
-        }
-        if (this.mutationInFlight)
-            return true;
-        if (this.mode === 'rename' || this.mode === 'label') {
-            this.renameInput.handleInput(data);
-            return true;
-        }
-        if (this.mode === 'catalog') {
-            if (matchesKey(data, 'escape')) {
-                this.mode = 'list';
-                return true;
-            }
-            if (matchesKey(data, 'j') || matchesKey(data, 'down')) {
-                this.catalogIndex = Math.min(this.catalog.length - 1, this.catalogIndex + 1);
-                return true;
-            }
-            if (matchesKey(data, 'k') || matchesKey(data, 'up')) {
-                this.catalogIndex = Math.max(0, this.catalogIndex - 1);
-                return true;
-            }
-            if (matchesKey(data, 'enter')) {
-                const provider = this.catalog[this.catalogIndex];
-                if (provider.managed) {
-                    this.loginProvider = provider;
-                    this.renameInput.setValue('');
-                    this.renameInput.onSubmit = () => { const label = this.renameInput.getValue().trim(); if (label)
-                        this.startLogin(provider, label); };
-                    this.mode = 'label';
-                }
-                else
-                    this.startLogin(provider);
-                return true;
-            }
-            return true;
-        }
-        if (this.mode === 'remove') {
-            if (matchesKey(data, 'y') || matchesKey(data, 'enter')) {
-                const row = this.selectedRow();
-                if (row && (row.managed || row.configured)) {
-                    this.remove(row);
-                }
-            }
-            this.mode = 'list';
-            return true;
-        }
-        if (matchesKey(data, 'j') || matchesKey(data, 'down')) {
-            this.selected = Math.min(this.rows.length, this.selected + 1);
-            return true;
-        }
-        if (matchesKey(data, 'k') || matchesKey(data, 'up')) {
-            this.selected = Math.max(0, this.selected - 1);
-            return true;
-        }
-        const row = this.selectedRow();
-        if (matchesKey(data, 'p') && row?.managed && row.label) {
-            this.promote(row);
-            return true;
-        }
-        if (matchesKey(data, 'r') && row?.managed && row.label) {
-            this.renameInput.setValue(row.label);
-            this.renameInput.onSubmit = () => this.rename();
-            this.mode = 'rename';
-            return true;
-        }
-        if (matchesKey(data, 'x') && (row?.managed || row?.configured)) {
-            this.mode = 'remove';
-            return true;
-        }
-        if (matchesKey(data, 'a')) {
-            this.openCatalog();
-            return true;
-        }
-        const viewOnly = row?.source === 'environment' || row?.source === 'runtime';
-        if (matchesKey(data, 'l') && row && !viewOnly) {
-            if (row.managed && row.label)
-                this.startLogin(row, row.label);
-            else
-                this.startLogin(row);
-            return true;
-        }
-        if (matchesKey(data, 'enter')) {
-            if (row && !viewOnly)
-                this.startLogin(row, row.managed && row.label ? row.label : undefined);
-            else if (!row)
-                this.openCatalog();
-            return true;
-        }
-        return false;
-    }
-    // `height` is the panel's full framed budget (as returned by `framed()` — border
-    // rows included), supplied by the host wizard's live terminal-row callback. It can
-    // shrink to just a couple of rows, so every part of the panel below the mandatory
-    // content is chrome that collapses under pressure. For the roster/catalog list this
-    // is: the frame itself drops first (there's no room for both borders and a row),
-    // then the title/count header, then the hint/notice/empty-state line, then the
-    // position indicator — never letting the selected row scroll out of view. The
-    // login/rename/label/remove modals have no list to window, so they apply the same
-    // budget via `fitTail`: their bodies always end on the actionable line (a live
-    // input, a confirm prompt, a login dialog's current prompt), so clipping from the
-    // head sheds chrome (title/count/older status lines) first and keeps that line.
-    render(width, height) {
-        const titleLine = theme.fg('accent', theme.bold('Providers'));
-        const countLine = theme.fg('dim', `${this.rows.filter((row) => row.label === undefined).length} configured`);
-        const useFrame = height >= FRAME_OVERHEAD + 1;
-        const contentBudget = Math.max(1, useFrame ? height - FRAME_OVERHEAD : height);
-        let body;
-        if (this.mode === 'login') {
-            body = fitTail(this.dialog?.render(Math.max(1, width - 4)) ?? [], contentBudget);
-        }
-        else if (this.mode === 'rename' || this.mode === 'label') {
-            body = fitTail([titleLine, countLine, '', theme.fg('accent', this.mode === 'rename' ? 'Rename account' : `Name the ${this.loginProvider?.name ?? 'provider'} account`), ...this.renameInput.render(Math.max(1, width - 8))], contentBudget);
-        }
-        else if (this.mode === 'remove') {
-            const target = this.selectedRow();
-            const label = target?.label ?? (target?.managed ? `${target.name} · all accounts` : target?.name ?? 'account');
-            body = fitTail([titleLine, countLine, '', theme.fg('warning', `Remove ${label}? y/enter confirm · any other key cancel`)], contentBudget);
-        }
-        else {
-            // The title/count header is the first chrome to give way: only as many of its
-            // two lines are kept as fit while still reserving at least one row for the
-            // mandatory selected entry.
-            const header = [titleLine, countLine].slice(0, Math.max(0, contentBudget - 1));
-            const remaining = contentBudget - header.length; // always >= 1
-            body = [...header];
-            if (this.mode === 'catalog') {
-                const items = this.catalog.length;
-                const clipped = items > remaining;
-                // Only trade a row for the position indicator when there's a spare row to trade;
-                // at `remaining === 1` the sole row goes to the mandatory selected entry instead.
-                const reserveIndicator = clipped && remaining >= 2;
-                const rowBudget = reserveIndicator ? remaining - 1 : remaining;
-                const { start, end } = visibleRange(items, this.catalogIndex, rowBudget);
-                let leftover = remaining - (end - start) - (reserveIndicator ? 1 : 0);
-                if (leftover > 0) {
-                    body.push(theme.fg('dim', 'Select a provider to add · esc back'));
-                    leftover -= 1;
-                }
-                for (let index = start; index < end; index++) {
-                    const provider = this.catalog[index];
-                    body.push(`${index === this.catalogIndex ? theme.fg('accent', '▶') : ' '} ${provider.name}`);
-                }
-                if (reserveIndicator)
-                    body.push(theme.fg('dim', `(${this.catalogIndex + 1}/${items})`));
-            }
-            else {
-                const totalEntries = this.rows.length + 1; // + the trailing "Add provider" sentinel
-                const clipped = totalEntries > remaining;
-                const reserveIndicator = clipped && remaining >= 2;
-                const rowBudget = reserveIndicator ? remaining - 1 : remaining;
-                const { start, end } = visibleRange(totalEntries, this.selected, rowBudget);
-                let leftover = remaining - (end - start) - (reserveIndicator ? 1 : 0);
-                const showEmpty = this.rows.length === 0 && leftover > 0;
-                if (showEmpty)
-                    leftover -= 1;
-                const showNotice = Boolean(this.notice) && leftover > 0;
-                if (showEmpty)
-                    body.push(theme.fg('warning', 'No provider configured yet.'));
-                for (let index = start; index < end; index++) {
-                    if (index === this.rows.length) {
-                        body.push(`${this.selected === this.rows.length ? theme.fg('accent', '▶') : ' '} ${theme.fg('accent', '＋ Add provider')}`);
-                        continue;
-                    }
-                    const row = this.rows[index];
-                    const selected = index === this.selected ? theme.fg('accent', '▶') : ' ';
-                    if (!row.label) {
-                        const state = row.managed
-                            ? `${this.rows.filter((item) => item.providerId === row.providerId && item.label).length} accounts`
-                            : row.source === 'environment' || row.source === 'runtime'
-                                ? `${row.source}${row.sourceLabel ? ` · ${row.sourceLabel}` : ''} (view only)`
-                                : 'configured';
-                        body.push(`${selected} ${theme.fg('accent', row.name)}${theme.fg('dim', `  ${state}`)}`);
-                    }
-                    else {
-                        const health = row.cooldownUntil && row.cooldownUntil > Date.now() ? `cooldown ${Math.ceil((row.cooldownUntil - Date.now()) / 60000)}m` : 'ready';
-                        const identity = row.accountId ? ` · ${row.accountId.length > 12 ? `${row.accountId.slice(0, 8)}…${row.accountId.slice(-4)}` : row.accountId}` : '';
-                        body.push(`${selected}   ${row.preferred ? theme.fg('success', '●') : ' '} ${row.label}${theme.fg('dim', identity)}  ${theme.fg('dim', health)}${row.preferred ? theme.fg('accent', '  preferred') : ''}`);
-                    }
-                }
-                if (reserveIndicator)
-                    body.push(theme.fg('dim', `(${this.selected + 1}/${totalEntries})`));
-                if (showNotice)
-                    body.push(theme.fg('dim', this.notice));
-            }
-        }
-        return useFrame ? framed(body, width) : body.map((line) => truncateToWidth(line, width));
-    }
-}
-const TAB_LABELS = ['Providers', 'Plugins', 'System', 'Exa', 'Keybindings', 'Models', 'Broker limits', 'Settings'];
-const SETTINGS_TAB = 7;
-const STRENGTHS = ['ultra', 'strong', 'medium', 'light'];
-const LADDER_PROVIDER_KEYS = ['anthropic', 'openai'];
-const THINKING_LEVELS = ['off', 'minimal', 'low', 'medium', 'high', 'xhigh', 'max'];
-const RUNTIME_PROVIDER_ID = { anthropic: ANTHROPIC_PROVIDER_ID, openai: OPENAI_CODEX_PROVIDER_ID };
-const PROVIDER_LABEL = { anthropic: 'Anthropic', openai: 'OpenAI' };
-const KIND_COLUMNS = [
-    { mode: 'base', dimension: 'provider' },
-    { mode: 'base', dimension: 'strength' },
-    { mode: 'orchestrator', dimension: 'provider' },
-    { mode: 'orchestrator', dimension: 'strength' },
-];
-function modelConfigTargets() {
-    const userRoot = userScopeRoot();
-    const profileId = process.env['CRTR_PROFILE_ID'] || null;
-    let profileTarget;
-    if (profileId !== null) {
-        try {
-            const entry = loadProfileManifest(profileId);
-            profileTarget = { label: `Profile: ${entry.manifest.name}`, root: profileRoot(entry.profileId) };
-        }
-        catch {
-            // A stale profile env should not make setup unusable; user/project
-            // targets remain valid and launch resolution already ignores it.
-        }
-    }
-    const projectRoots = findProjectScopeRoots(process.cwd(), profileId);
-    const projectTargets = projectRoots.map((root) => ({
-        label: `Project: ${basename(dirname(root))}`,
-        root,
-    }));
-    return {
-        targets: [{ label: 'User', root: userRoot }, ...(profileTarget ? [profileTarget] : []), ...projectTargets],
-        precedenceRoots: [...projectRoots, ...(profileTarget ? [profileTarget.root] : []), userRoot],
-    };
-}
-/** Parse a model ref `<provider>/<modelId>:<level>` into parts. */
-function parseModelRef(ref) {
-    if (!ref)
-        return {};
-    const trimmed = ref.trim();
-    const slash = trimmed.indexOf('/');
-    const provider = slash === -1 ? undefined : trimmed.slice(0, slash);
-    const rest = slash === -1 ? trimmed : trimmed.slice(slash + 1);
-    const m = rest.match(/^(.*?):(off|minimal|low|medium|high|xhigh|max)$/i);
-    return { provider, id: m ? m[1] : rest, level: m ? m[2].toLowerCase() : undefined };
-}
-/** Short display for a ladder cell value — strip the `<provider>/` prefix. */
-function shortRef(ref) {
-    if (!ref)
-        return '\u2014';
-    const slash = ref.indexOf('/');
-    return slash === -1 ? ref : ref.slice(slash + 1);
-}
-class ModelsPanel {
-    tui;
-    runtime;
-    registry;
-    matches;
-    label;
-    mode = 'list';
-    ladders;
-    kinds;
-    /** The ladder providers this panel offers — only columns whose runtime
-     *  provider is signed in (all of them when nobody is, so config stays
-     *  reachable pre-login). Recomputed with every reload/refresh so a login
-     *  made on the Providers tab shows up when this tab is next entered. */
-    providerKeys = LADDER_PROVIDER_KEYS;
-    targets;
-    precedenceRoots;
-    targetIndex = 0;
-    rawTarget;
-    rows = [];
-    selected = 0;
-    column = 0;
-    notice = '';
-    modelSelector;
-    thinkingSelector;
-    pending;
-    // The kind cell being edited: which mode/dimension, the options to choose
-    // from, and the current mode selection so the untouched dimension survives.
-    pendingDim;
-    dimPickIndex = 0;
-    onChange;
-    constructor(tui, runtime, registry, matches, label) {
-        this.tui = tui;
-        this.runtime = runtime;
-        this.registry = registry;
-        this.matches = matches;
-        this.label = label;
-        const scopes = modelConfigTargets();
-        this.targets = scopes.targets;
-        this.precedenceRoots = scopes.precedenceRoots;
-        this.rawTarget = readRawConfigAtRoot(this.currentTarget().root);
-        const merged = readMergedLaunchConfig();
-        this.ladders = merged.modelLadders;
-        this.kinds = merged.kinds;
-        this.providerKeys = this.offeredProviders();
-        this.rows = this.buildRows();
-    }
-    /** Same signed-in rule as the broker's Alt+M cycle: pool occupancy for a
-     *  managed provider (read live), else the registry's auth status. */
-    offeredProviders() {
-        try {
-            return configuredLadderProviders((providerId) => (isManagedProvider(providerId) && readSubscriptionPool(providerId).length > 0)
-                || this.registry.getProviderAuthStatus(providerId).configured, this.ladders);
-        }
-        catch {
-            return LADDER_PROVIDER_KEYS; // auth state unreadable — offer the full grid
-        }
-    }
-    currentTarget() {
-        return this.targets[this.targetIndex];
-    }
-    cycleTarget() {
-        this.targetIndex = (this.targetIndex + 1) % this.targets.length;
-        this.rawTarget = readRawConfigAtRoot(this.currentTarget().root);
-        this.notice = '';
-        this.notify();
-    }
-    shadowingPath(hasOverride) {
-        for (const root of this.precedenceRoots) {
-            if (root === this.currentTarget().root)
-                break;
-            const raw = readRawConfigAtRoot(root);
-            if (raw && hasOverride(raw))
-                return join(root, 'config.json');
-        }
-        return undefined;
-    }
-    savedButShadowed(path) {
-        return `Saved to ${this.currentTarget().label}; overridden by ${path ?? 'a more specific config'}`;
-    }
-    buildRows() {
-        const rows = [{ section: 'ladder', kind: 'defaultProvider' }];
-        for (const strength of STRENGTHS)
-            rows.push({ section: 'ladder', kind: 'strength', strength });
-        for (const name of Object.keys(this.kinds)) {
-            if (name.includes('/'))
-                continue;
-            rows.push({ section: 'kind', name });
-        }
-        return rows;
-    }
-    reload() {
-        const merged = readMergedLaunchConfig();
-        this.ladders = merged.modelLadders;
-        this.kinds = merged.kinds;
-        this.rawTarget = readRawConfigAtRoot(this.currentTarget().root);
-        this.providerKeys = this.offeredProviders();
-        this.rows = this.buildRows();
-        this.selected = Math.min(this.selected, this.rows.length - 1);
-        this.clampColumn();
-    }
-    /** Re-read config and auth state — called when the Models tab is entered so
-     *  a provider signed in (or out) on the Providers tab is reflected here. */
-    refresh() {
-        this.reload();
-        this.notify();
-    }
-    notify() {
-        this.onChange?.();
-        this.tui.requestRender();
-    }
-    isPickerOpen() {
-        return this.mode !== 'list';
-    }
-    currentRow() {
-        return this.rows[Math.min(this.selected, this.rows.length - 1)];
-    }
-    columnsFor(row) {
-        if (row.section === 'ladder')
-            return row.kind === 'strength' ? this.providerKeys.length : 1;
-        return KIND_COLUMNS.length;
-    }
-    clampColumn() {
-        this.column = Math.min(this.column, this.columnsFor(this.currentRow()) - 1);
-    }
-    handleInput(data) {
-        if (this.mode === 'dimension-picker') {
-            if (this.matches('crtr.setup.models.commit', data)) {
-                this.commitDimensionPick();
-                return true;
-            }
-            if (this.matches('crtr.setup.models.cancel', data)) {
-                this.closePicker();
-                return true;
-            }
-            if (this.matches('crtr.setup.list-down', data)) {
-                this.dimPickIndex = Math.min((this.pendingDim?.options.length ?? 1) - 1, this.dimPickIndex + 1);
-                return true;
-            }
-            if (this.matches('crtr.setup.list-up', data)) {
-                this.dimPickIndex = Math.max(0, this.dimPickIndex - 1);
-                return true;
-            }
-            return true;
-        }
-        if (this.mode === 'model-picker') {
-            const input = this.matches('crtr.setup.models.commit', data)
-                ? '\r'
-                : this.matches('crtr.setup.models.cancel', data) ? '\u001b' : data;
-            this.modelSelector?.handleInput(input);
-            return true;
-        }
-        if (this.mode === 'thinking-picker') {
-            const input = this.matches('crtr.setup.models.commit', data)
-                ? '\r'
-                : this.matches('crtr.setup.models.cancel', data) ? '\u001b' : data;
-            this.thinkingSelector?.getSelectList().handleInput(input);
-            return true;
-        }
-        if (this.matches('crtr.setup.list-down', data)) {
-            this.selected = Math.min(this.rows.length - 1, this.selected + 1);
-            this.clampColumn();
-            this.notice = '';
-            return true;
-        }
-        if (this.matches('crtr.setup.list-up', data)) {
-            this.selected = Math.max(0, this.selected - 1);
-            this.clampColumn();
-            this.notice = '';
-            return true;
-        }
-        if (this.matches('crtr.setup.cell-previous', data)) {
-            this.column = Math.max(0, this.column - 1);
-            return true;
-        }
-        if (this.matches('crtr.setup.cell-next', data)) {
-            this.column = Math.min(this.columnsFor(this.currentRow()) - 1, this.column + 1);
-            return true;
-        }
-        if (this.matches('crtr.setup.models.scope-next', data)) {
-            this.cycleTarget();
-            return true;
-        }
-        if (this.matches('crtr.setup.models.open', data)) {
-            this.activateCell();
-            return true;
-        }
-        return false;
-    }
-    activateCell() {
-        const row = this.currentRow();
-        this.notice = '';
-        if (row.section === 'ladder' && row.kind === 'defaultProvider') {
-            const currentProvider = inferPortableModelSelection(undefined, this.ladders).provider;
-            // Cycle within the offered providers only; with a single signed-in
-            // provider the default has nowhere else to go.
-            const offered = this.providerKeys;
-            const next = offered[(Math.max(0, offered.indexOf(currentProvider)) + 1) % offered.length];
-            if (next === currentProvider)
-                return;
-            try {
-                persistModelLadders(this.currentTarget().root, { defaultProvider: next });
-            }
-            catch (error) {
-                this.notice = `Could not save: ${error instanceof Error ? error.message : String(error)}`;
-                this.notify();
-                return;
-            }
-            this.reload();
-            if ((this.ladders.defaultProvider ?? 'anthropic') !== next) {
-                const path = this.shadowingPath((raw) => raw.modelLadders?.defaultProvider !== undefined);
-                this.notice = this.savedButShadowed(path);
-            }
-            this.notify();
-            return;
-        }
-        if (row.section === 'ladder' && row.kind === 'strength') {
-            this.openModelPicker(this.providerKeys[this.column], row.strength);
-            return;
-        }
-        if (row.section === 'kind') {
-            const col = KIND_COLUMNS[this.column];
-            if (!col)
-                return;
-            this.openDimensionPicker(row.name, col.mode, col.dimension);
-        }
-    }
-    /** Snapshot of the mode's current provider+strength. For orchestrator this
-     *  falls back to the base `model` when no explicit override exists, so the
-     *  inherited pair is what an edit preserves. */
-    kindSelection(name, mode) {
-        const cfg = this.kinds[name];
-        const value = mode === 'orchestrator' ? (cfg?.orchestratorModel ?? cfg?.model) : cfg?.model;
-        return inferPortableModelSelection(value, this.ladders);
-    }
-    openDimensionPicker(name, mode, dimension) {
-        const current = this.kindSelection(name, mode);
-        const options = dimension === 'provider' ? this.providerKeys : STRENGTHS;
-        const currentToken = dimension === 'provider' ? current.provider : current.strength;
-        this.pendingDim = { name, mode, dimension, options, current };
-        this.dimPickIndex = Math.max(0, options.indexOf(currentToken));
-        this.mode = 'dimension-picker';
-        this.notify();
-    }
-    commitDimensionPick() {
-        const pending = this.pendingDim;
-        const chosen = pending?.options[this.dimPickIndex];
-        if (!pending || chosen === undefined) {
-            this.closePicker();
-            return;
-        }
-        const provider = pending.dimension === 'provider' ? chosen : pending.current.provider;
-        const strength = pending.dimension === 'strength' ? chosen : pending.current.strength;
-        const token = `${provider}/${strength}`;
-        try {
-            persistDefaultKindModel({
-                root: this.currentTarget().root,
-                kind: pending.name,
-                model: token,
-                orchestrator: pending.mode === 'orchestrator',
-            });
-        }
-        catch (error) {
-            this.notice = `Could not save: ${error instanceof Error ? error.message : String(error)}`;
-            this.mode = 'list';
-            this.pendingDim = undefined;
-            this.notify();
-            return;
-        }
-        this.mode = 'list';
-        this.pendingDim = undefined;
-        this.reload();
-        const after = this.kinds[pending.name];
-        const effective = pending.mode === 'orchestrator' ? after?.orchestratorModel : after?.model;
-        if (effective !== token) {
-            const field = pending.mode === 'orchestrator' ? 'orchestratorModel' : 'model';
-            const path = this.shadowingPath((raw) => {
-                const entry = raw.kinds?.[pending.name];
-                return entry?.[field] !== undefined;
-            });
-            this.notice = this.savedButShadowed(path);
-        }
-        this.notify();
-    }
-    openModelPicker(providerKey, strength) {
-        const expectedRuntime = RUNTIME_PROVIDER_ID[providerKey];
-        const registry = this.registry;
-        const parsed = parseModelRef(this.ladders[providerKey][strength]);
-        const currentModel = parsed.provider && parsed.id ? registry.find(parsed.provider, parsed.id) : undefined;
-        const scoped = registry.getAvailable().filter((m) => m.provider === expectedRuntime).map((m) => ({ model: m }));
-        if (scoped.length === 0) {
-            this.notice = `No ${providerKey} models available \u2014 sign in first.`;
-            this.notify();
-            return;
-        }
-        this.pending = { providerKey, strength, expectedRuntime };
-        this.modelSelector = new ModelSelectorComponent(this.tui, currentModel, SettingsManager.inMemory(), this.runtime, scoped, (model) => this.onModelPicked(model), () => this.closePicker());
-        this.modelSelector.focused = true;
-        this.mode = 'model-picker';
-        this.notify();
-    }
-    onModelPicked(model) {
-        if (!this.pending) {
-            this.closePicker();
-            return;
-        }
-        if (model.provider !== this.pending.expectedRuntime) {
-            this.notice = `That is a ${model.provider} model \u2014 pick an ${this.pending.providerKey} model for this column.`;
-            this.closePicker();
-            return;
-        }
-        this.pending.model = model;
-        if (model.reasoning) {
-            const currentLevel = parseModelRef(this.ladders[this.pending.providerKey][this.pending.strength]).level ?? 'medium';
-            this.thinkingSelector = new ThinkingSelectorComponent(currentLevel, [...THINKING_LEVELS], (level) => this.onThinkingPicked(level), () => this.closePicker());
-            this.modelSelector = undefined;
-            this.mode = 'thinking-picker';
-            this.notify();
-            return;
-        }
-        this.writeLadder(model, undefined);
-        this.closePicker();
-    }
-    onThinkingPicked(level) {
-        if (this.pending?.model)
-            this.writeLadder(this.pending.model, level);
-        this.closePicker();
-    }
-    writeLadder(model, level) {
-        if (!this.pending)
-            return;
-        const ref = `${model.provider}/${model.id}${level && level !== 'off' ? `:${level}` : ''}`;
-        const { providerKey, strength } = this.pending;
-        try {
-            persistModelLadders(this.currentTarget().root, { [providerKey]: { [strength]: ref } });
-        }
-        catch (error) {
-            this.notice = `Could not save: ${error instanceof Error ? error.message : String(error)}`;
-            return;
-        }
-        this.reload();
-        if (this.ladders[providerKey][strength] !== ref) {
-            const path = this.shadowingPath((raw) => raw.modelLadders?.[providerKey]?.[strength] !== undefined);
-            this.notice = this.savedButShadowed(path);
-        }
-    }
-    closePicker() {
-        this.mode = 'list';
-        this.modelSelector = undefined;
-        this.thinkingSelector = undefined;
-        this.pending = undefined;
-        this.pendingDim = undefined;
-        this.notify();
-    }
-    dispose() {
-        this.closePicker();
-    }
-    targetLadderOverride(providerKey, strength) {
-        const raw = this.rawTarget?.modelLadders;
-        return raw?.[providerKey]?.[strength] !== undefined;
-    }
-    targetKindOverride(name, orchestrator) {
-        const kinds = this.rawTarget?.kinds;
-        const field = orchestrator ? 'orchestratorModel' : 'model';
-        return kinds?.[name]?.[field] !== undefined;
-    }
-    footerHint() {
-        if (this.mode === 'dimension-picker') {
-            return `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} choice \u00b7 ${this.label('crtr.setup.models.commit')} save \u00b7 ${this.label('crtr.setup.models.cancel')} cancel`;
-        }
-        if (this.mode === 'model-picker')
-            return `type to search \u00b7 ${this.label('crtr.setup.models.commit')} select \u00b7 tab all/scoped \u00b7 ${this.label('crtr.setup.models.cancel')} cancel`;
-        if (this.mode === 'thinking-picker')
-            return `\u2191/\u2193 level \u00b7 ${this.label('crtr.setup.models.commit')} set \u00b7 ${this.label('crtr.setup.models.cancel')} cancel`;
-        return '';
-    }
-    /** Body lines only — the caller frames and windows them. */
-    renderDimensionPicker(width) {
-        const pending = this.pendingDim;
-        if (!pending)
-            return [theme.fg('warning', 'No setting selected.')];
-        const modeLabel = pending.mode === 'orchestrator' ? 'orchestrator' : 'base';
-        const dimLabel = pending.dimension;
-        const paired = pending.dimension === 'provider'
-            ? `strength ${pending.current.strength}`
-            : `provider ${PROVIDER_LABEL[pending.current.provider]}`;
-        const body = [
-            theme.fg('accent', theme.bold(`Choose ${modeLabel} ${dimLabel}`)),
-            theme.fg('dim', `${pending.name} \u00b7 keeps ${modeLabel} ${paired}`),
-            '',
-        ];
-        for (const [index, option] of pending.options.entries()) {
-            const active = index === this.dimPickIndex;
-            const marker = active ? theme.fg('accent', '\u25b6') : ' ';
-            const label = pending.dimension === 'provider' ? PROVIDER_LABEL[option] : option;
-            body.push(`${marker} ${active ? theme.fg('accent', `[${label}]`) : theme.fg('dim', ` ${label} `)}`);
-        }
-        return body;
-    }
-    /** Fits the panel body into `budget` rows. The wizard draws header/tabs above
-     *  and a footer below, so a body taller than its budget pushes the tab strip
-     *  off the top of the terminal — the panel must window itself instead. Chrome
-     *  (title/subtitle/blank) sheds first, then the remaining lines scroll just
-     *  far enough to keep the selected row on screen. */
-    fitBody(lines, selected, budget) {
-        if (lines.length <= budget)
-            return lines;
-        const chrome = Math.min(MODELS_CHROME_LINES, lines.length - budget);
-        const rest = lines.slice(chrome);
-        if (rest.length <= budget)
-            return rest;
-        const anchor = Math.max(0, selected - chrome);
-        const start = Math.max(0, Math.min(anchor - budget + 2, rest.length - budget));
-        return rest.slice(start, start + budget);
-    }
-    render(width, height) {
-        const useFrame = height >= FRAME_OVERHEAD + 1;
-        const contentBudget = Math.max(1, useFrame ? height - FRAME_OVERHEAD : height);
-        const frame = (lines) => (useFrame ? framed(lines, width) : renderRows(lines, width));
-        if (this.mode === 'dimension-picker')
-            return frame(fitTail(this.renderDimensionPicker(width), contentBudget));
-        if (this.mode === 'model-picker')
-            return frame(fitTail(this.modelSelector?.render(Math.max(1, width - 4)) ?? [], contentBudget));
-        if (this.mode === 'thinking-picker')
-            return frame(fitTail(this.thinkingSelector?.render(Math.max(1, width - 4)) ?? [], contentBudget));
-        let selectedLine = 0;
-        const body = [
-            theme.fg('accent', theme.bold('Models')),
-            theme.fg('dim', 'global user defaults \u00b7 project/profile scopes can shadow these'),
-            '',
-        ];
-        const selectedRow = this.currentRow();
-        const strengthSelected = selectedRow.section === 'ladder' && selectedRow.kind === 'strength';
-        // Ladder grid layout. The provider columns share the width left after the
-        // 2-space marker gutter and the strength label, divided across as many
-        // columns as fit at a minimum cell width; any that don't fit scroll into a
-        // horizontal viewport that follows the selected column, so the grid scales
-        // to N providers instead of truncating the last column off-screen.
-        const innerWidth = Math.max(1, width - 4);
-        const ladderLabelWidth = Math.max(12, Math.min(20, Math.floor(innerWidth * 0.24)));
-        const providerCount = this.providerKeys.length;
-        const gridWidth = Math.max(1, innerWidth - 2 - ladderLabelWidth);
-        const minCellWidth = 12;
-        const maxVisible = Math.max(1, Math.floor((gridWidth + 1) / (minCellWidth + 1)));
-        const visibleCount = Math.min(providerCount, maxVisible);
-        const ladderCellWidth = Math.max(minCellWidth, Math.floor((gridWidth - (visibleCount - 1)) / visibleCount));
-        const activeColumn = strengthSelected ? Math.min(this.column, providerCount - 1) : 0;
-        const viewStart = Math.max(0, Math.min(activeColumn >= visibleCount ? activeColumn - visibleCount + 1 : 0, providerCount - visibleCount));
-        const viewEnd = viewStart + visibleCount;
-        const visibleCols = this.providerKeys
-            .map((provider, column) => ({ provider, column }))
-            .slice(viewStart, viewEnd);
-        const moreLeft = viewStart > 0;
-        const moreRight = viewEnd < providerCount;
-        const scrollHint = moreLeft || moreRight
-            ? `  ${theme.fg('dim', `${moreLeft ? '\u2039 ' : ''}${viewStart + 1}\u2013${viewEnd} of ${providerCount}${moreRight ? ' \u203a' : ''}`)}`
-            : '';
-        const target = this.currentTarget();
-        body.push(`${theme.fg('accent', 'Editing config')}  ${theme.fg('accent', `[${target.label}]`)}${theme.fg('dim', `  ${this.targetIndex + 1}/${this.targets.length}`)}`);
-        body.push(theme.fg('muted', join(target.root, 'config.json')), '');
-        body.push(theme.fg('accent', 'Strength ladders') + scrollHint);
-        const effectiveDefaultProvider = inferPortableModelSelection(undefined, this.ladders).provider;
-        const defaultRow = this.rows.find((row) => row.section === 'ladder' && row.kind === 'defaultProvider');
-        const defaultSelected = defaultRow === selectedRow;
-        if (defaultSelected)
-            selectedLine = body.length;
-        body.push(`${defaultSelected ? theme.fg('accent', '\u25b6') : ' '} ${padAnsi(defaultSelected ? theme.fg('accent', 'Default provider') : 'Default provider', 20)} ${theme.fg('success', effectiveDefaultProvider)}`);
-        const providerHeading = (provider, column) => {
-            const heading = padAnsi(theme.bold(PROVIDER_LABEL[provider]), ladderCellWidth);
-            return strengthSelected && this.column === column ? theme.fg('accent', heading) : theme.fg('dim', heading);
-        };
-        const ladderCell = (text, active) => {
-            const content = padAnsi(truncateToWidth(text, Math.max(1, ladderCellWidth - 2)), Math.max(1, ladderCellWidth - 2));
-            return active ? theme.fg('accent', `[${content}]`) : theme.fg('dim', ` ${content} `);
-        };
-        body.push(`${' '.repeat(2)}${padAnsi(theme.fg('dim', 'Strength'), ladderLabelWidth)}${visibleCols.map(({ provider, column }) => providerHeading(provider, column)).join(' ')}`);
-        for (const row of this.rows) {
-            if (row.section !== 'ladder' || row.kind !== 'strength')
-                continue;
-            const isSel = row === selectedRow;
-            const marker = isSel ? theme.fg('accent', '\u25b6') : ' ';
-            if (isSel)
-                selectedLine = body.length;
-            const cells = visibleCols.map(({ provider, column }) => {
-                const over = this.targetLadderOverride(provider, row.strength) ? theme.fg('warning', '\u2022') : ' ';
-                return ladderCell(`${over}${shortRef(this.ladders[provider][row.strength])}`, isSel && column === this.column);
-            });
-            body.push(`${marker} ${padAnsi(row.strength, ladderLabelWidth)}${cells.join(' ')}`);
-        }
-        body.push('', theme.fg('accent', 'Kind defaults'));
-        body.push(theme.fg('dim', `${theme.fg('warning', '\u2022')} override in ${target.label} \u00b7 orchestrator inherits base until you set it`));
-        const nameW = 16;
-        const provCellW = 12;
-        const strCellW = 9;
-        const groupW = provCellW + 1 + strCellW;
-        // Fixed-width cell: `[value]` when the column is selected, faint (muted) for
-        // an inherited orchestrator value, plain dim otherwise. The 2 brackets/spaces
-        // keep every cell exactly `w` wide so the column headers line up.
-        const cell = (raw, w, active, faint) => {
-            const inner = padAnsi(truncateToWidth(raw, Math.max(1, w - 2)), Math.max(1, w - 2));
-            return active ? theme.fg('accent', `[${inner}]`) : faint ? theme.fg('muted', ` ${inner} `) : theme.fg('dim', ` ${inner} `);
-        };
-        body.push(`${' '.repeat(2 + nameW)}${padAnsi(theme.bold(theme.fg('dim', 'Base')), groupW)} ${padAnsi(theme.bold(theme.fg('dim', 'Orchestrator')), groupW)}`);
-        body.push(`${' '.repeat(2)}${padAnsi(theme.fg('dim', 'Kind'), nameW)}${padAnsi(theme.fg('dim', 'Provider'), provCellW)} ${padAnsi(theme.fg('dim', 'Strength'), strCellW)} ${padAnsi(theme.fg('dim', 'Provider'), provCellW)} ${padAnsi(theme.fg('dim', 'Strength'), strCellW)}`);
-        for (const row of this.rows) {
-            if (row.section !== 'kind')
-                continue;
-            const isSel = row === selectedRow;
-            const marker = isSel ? theme.fg('accent', '\u25b6') : ' ';
-            if (isSel)
-                selectedLine = body.length;
-            const cfg = this.kinds[row.name];
-            const baseSel = inferPortableModelSelection(cfg?.model, this.ladders);
-            const orchInherited = cfg?.orchestratorModel === undefined;
-            const orchSel = inferPortableModelSelection(cfg?.orchestratorModel ?? cfg?.model, this.ladders);
-            const baseOver = this.targetKindOverride(row.name, false) ? theme.fg('warning', '\u2022') : ' ';
-            const orchOver = this.targetKindOverride(row.name, true) ? theme.fg('warning', '\u2022') : ' ';
-            const cells = [
-                cell(`${baseOver}${PROVIDER_LABEL[baseSel.provider]}`, provCellW, isSel && this.column === 0, false),
-                cell(`${baseOver}${baseSel.strength}`, strCellW, isSel && this.column === 1, false),
-                cell(`${orchOver}${PROVIDER_LABEL[orchSel.provider]}`, provCellW, isSel && this.column === 2, orchInherited),
-                cell(`${orchOver}${orchSel.strength}`, strCellW, isSel && this.column === 3, orchInherited),
-            ];
-            body.push(`${marker} ${padAnsi(row.name, nameW)}${cells[0]} ${cells[1]} ${cells[2]} ${cells[3]}`);
-        }
-        if (this.notice)
-            body.push('', theme.fg('warning', this.notice));
-        return frame(this.fitBody(body, selectedLine, contentBudget));
-    }
-}
-/** Collapse explicitly-paired catalog definitions into one setup action row.
- *  Pair membership and field roles come only from catalog metadata; neither
- *  rendering nor installation guesses from binding ID names. */
-function buildSetupKeybindingRows() {
-    const byId = new Map(BINDING_CATALOG.map((definition) => [definition.id, definition]));
-    const consumed = new Set();
-    const rows = [];
-    for (const definition of BINDING_CATALOG) {
-        if (consumed.has(definition.id))
-            continue;
-        if (definition.pair === undefined) {
-            rows.push({
-                group: definition.group,
-                name: definition.name,
-                description: definition.description,
-                fields: [{ definition }],
-            });
-            consumed.add(definition.id);
-            continue;
-        }
-        const paired = byId.get(definition.pair.pairedId);
-        if (paired?.pair?.pairedId !== definition.id || paired.pair.field === definition.pair.field) {
-            throw new Error(`invalid keybinding pair metadata for ${definition.id}`);
-        }
-        const members = [definition, paired];
-        const menu = members.find((member) => member.pair?.field === 'menu');
-        const second = members.find((member) => member.pair?.field !== 'menu');
-        if (menu === undefined || second === undefined)
-            throw new Error(`incomplete keybinding pair for ${definition.id}`);
-        const secondLabel = second.pair?.field === 'global' ? 'Global' : 'Direct';
-        rows.push({
-            group: menu.group,
-            name: menu.name,
-            description: menu.description,
-            fields: [
-                { label: 'Menu', definition: menu },
-                { label: secondLabel, definition: second },
-            ],
-        });
-        consumed.add(menu.id);
-        consumed.add(second.id);
-    }
-    return rows;
-}
-const SETUP_KEYBINDING_ROWS = buildSetupKeybindingRows();
+// The `crtr sys setup` first-run installer: log in a provider, then install the
+// companion packages, system dependencies and API key a fresh machine needs.
+//
+// Ongoing configuration — models, keybindings, display preferences, panes,
+// broker limits, updates — lives in settings-shell.ts. Both hosts share the
+// panels in ./panels; this one is a linear stepper that ends in a single
+// confirmed install, that one is a persistent editor that saves as you go.
+import { matchesKey, truncateToWidth, visibleWidth, } from "@earendil-works/pi-tui";
+import { formatGesture, matchesPiTuiInput, } from "../../core/keybindings/index.js";
+import { buildSetupInitialState, executeSetupSubmission, formatSetupExecutionSummary, reconcileInboxFrontDoor, renderSetupStaticInstructions, resolveExaKeyPath, } from "./setup-core.js";
+import { runSetupSettingsProcess } from "./setup-settings-runner.js";
+import { DependenciesPanel } from "./panels/dependencies-panel.js";
+import { KeysPanel } from "./panels/keys-panel.js";
+import { PAGE_CHROME_ROWS, pageFrame, theme, } from "./panels/panel.js";
+import { PluginsPanel } from "./panels/plugins-panel.js";
+import { ProviderPanel } from "./panels/provider-panel.js";
+const STEPS = ["Providers", "Plugins", "Dependencies", "Exa key"];
+/** The host owns step navigation, focus, submission and composition. Each step
+ *  owns its own mutable UI state. */
 export class SetupWizard {
-    manifest;
-    installedPackageIds;
-    systemTools;
-    exaInput = new Input();
-    keyInput = new Input();
-    brokerWarningInput = new Input();
-    brokerHardCapInput = new Input();
-    openingBindings;
-    keyDraft;
+    bindings;
     terminalRows;
-    selectedPackageIds = new Set();
-    selectedSystemTools = new Set();
     providers;
-    models;
-    activeTab = 0;
-    pluginIndex = 0;
-    systemIndex = 0;
-    expandedPluginId = null;
+    plugins;
+    dependencies;
+    keys;
+    step = 0;
     confirming = false;
-    keyIndex = 0;
-    keyFieldIndex = 0;
-    keyScroll = 0;
-    keyFilter = '';
-    filteringKeys = false;
-    editingKey = null;
-    keyEditError;
-    keyDiagnostics = [];
-    keyConfirm = null;
-    keyNotice;
-    keyTmuxOccupancy;
-    brokerLimitIndex = 0;
-    brokerLimitNotice;
-    settingsIndex = 0;
-    settingsNotice;
     cachedWidth;
     cachedHeight;
     cachedLines;
     _focused = false;
+    installedPackageIds;
     onSubmit;
     onCancel;
-    constructor(manifest, installedPackageIds, systemTools, tui, agentDir, runtime, registry, openingBindings, rawKeybindings, terminalRows, rawTmuxPassthrough = undefined) {
-        this.manifest = manifest;
-        this.providers = new ProviderPanel(tui, agentDir, runtime, registry);
-        // The panel drives OAuth async; bust our line cache when it transitions so the panel's
-        // requestRender repaints the NEW frame (progress → success notice → roster) without a keypress.
-        this.providers.onChange = () => this.invalidate();
-        this.models = new ModelsPanel(tui, runtime, registry, (id, data) => this.matches(id, data), (id) => this.label(id));
-        this.models.onChange = () => this.invalidate();
-        this.installedPackageIds = installedPackageIds;
-        this.systemTools = systemTools;
+    constructor(manifest, installedPackageIds, systemPlans, tui, agentDir, runtime, registry, bindings, terminalRows) {
+        this.bindings = bindings;
         this.terminalRows = terminalRows;
-        this.openingBindings = openingBindings;
-        this.keyDraft = new SetupKeybindingsDraft(rawKeybindings, rawTmuxPassthrough);
-        this.keyDiagnostics = this.keyDraft.resolution().diagnostics;
-        for (const entry of this.manifest)
-            this.selectedPackageIds.add(entry.id);
-        for (const tool of this.systemTools) {
-            if (tool.plan.checked)
-                this.selectedSystemTools.add(tool.tool);
-        }
-        const firstMissingSystem = this.systemTools.findIndex((tool) => !tool.installed);
-        this.systemIndex = firstMissingSystem >= 0 ? firstMissingSystem : 0;
-        this.exaInput.onSubmit = () => this.finalize();
-        this.exaInput.onEscape = () => this.cancel();
-        const brokerThresholds = readConfig('user').brokerThresholds;
-        this.brokerWarningInput.setValue(String(brokerThresholds.warning));
-        this.brokerWarningInput.handleInput('\x05');
-        this.brokerHardCapInput.setValue(String(brokerThresholds.automaticReviveCap));
-        this.brokerHardCapInput.handleInput('\x05');
-        this.brokerWarningInput.onSubmit = () => this.saveBrokerLimits();
-        this.brokerHardCapInput.onSubmit = () => this.saveBrokerLimits();
-        // Edit-mode Enter/Escape are routed through the opening snapshot's
-        // `crtr.setup.keybindings.commit-edit` / `.cancel-edit` bindings in
-        // handleKeybindingsInput (before the pi Input sees them), so the pi Input's
-        // own submit/escape handlers stay unset — those catalog rows are honored
-        // even when remapped away from Enter/Escape.
+        this.installedPackageIds = installedPackageIds;
+        const invalidate = () => this.invalidate();
+        this.providers = new ProviderPanel(tui, agentDir, runtime, registry);
+        this.providers.onChange = invalidate;
+        this.plugins = new PluginsPanel(manifest, installedPackageIds, invalidate);
+        this.dependencies = new DependenciesPanel(systemPlans, invalidate);
+        this.keys = new KeysPanel();
+        this.keys.onSubmit = () => this.finalize();
+        this.keys.onCancel = () => this.cancel();
     }
     set focused(value) {
         this._focused = value;
-        this.exaInput.focused = value && this.activeTab === 3 && !this.confirming;
-        this.keyInput.focused = value && this.activeTab === 4 && this.editingKey !== null;
-        this.brokerWarningInput.focused = value && this.activeTab === 6 && this.brokerLimitIndex === 0;
-        this.brokerHardCapInput.focused = value && this.activeTab === 6 && this.brokerLimitIndex === 1;
+        this.syncFocus();
     }
     get focused() {
         return this._focused;
@@ -1379,1195 +58,252 @@ export class SetupWizard {
         this.cachedHeight = undefined;
         this.cachedLines = undefined;
     }
-    setTab(next) {
-        // Entering Models re-reads auth state so a provider signed in (or out) on
-        // the Providers tab immediately gains (or loses) its column here.
-        if (next === 5 && this.activeTab !== 5)
-            this.models.refresh();
-        this.activeTab = next;
-        this.exaInput.focused = this.focused && next === 3 && !this.confirming;
-        this.keyInput.focused = this.focused && next === 4 && this.editingKey !== null;
-        this.brokerWarningInput.focused = this.focused && next === 6 && this.brokerLimitIndex === 0;
-        this.brokerHardCapInput.focused = this.focused && next === 6 && this.brokerLimitIndex === 1;
-        this.invalidate();
-    }
-    moveTab(delta) {
-        const next = ((this.activeTab + delta + TAB_LABELS.length) % TAB_LABELS.length);
-        this.setTab(next);
-    }
-    moveSettingsRow(delta) {
-        this.settingsIndex = (this.settingsIndex + delta + USER_SETTINGS.length) % USER_SETTINGS.length;
-        this.settingsNotice = undefined;
-        this.invalidate();
-    }
-    /** Advance the selected preference and persist it immediately to user config.
-     *  The shared descriptor owns cycling, rendering, validation, and applicability,
-     *  so setup and `sys config set` cannot drift onto different setting catalogs. */
-    cycleSetting(delta) {
-        const setting = USER_SETTINGS[this.settingsIndex];
-        const config = updateConfig('user', (current) => setting.cycle(current, delta));
-        this.settingsNotice = `Saved ${setting.key} = ${setting.format(config)}. ${setting.applies}`;
-        this.invalidate();
-    }
-    handleSettingsInput(data) {
-        if (this.matches('crtr.setup.list-down', data))
-            this.moveSettingsRow(1);
-        else if (this.matches('crtr.setup.list-up', data))
-            this.moveSettingsRow(-1);
-        else if (this.matches('crtr.setup.toggle', data) || this.matches('crtr.setup.cell-next', data))
-            this.cycleSetting(1);
-        else if (this.matches('crtr.setup.cell-previous', data))
-            this.cycleSetting(-1);
-        else if (this.matches('crtr.setup.advance', data))
-            this.moveTab(1);
-    }
-    cancel() {
-        if (this.confirming) {
-            this.confirming = false;
-            this.invalidate();
-            return;
-        }
-        this.providers.dispose();
-        this.models.dispose();
-        this.onCancel?.();
+    syncFocus() {
+        this.keys.focused = this._focused && this.step === 3 && !this.confirming;
     }
-    dispose() { this.providers.dispose(); this.models.dispose(); }
     matches(id, data) {
-        return matchesPiTuiInput(this.openingBindings, id, data, (input, gesture) => matchesKey(input, gesture));
+        return matchesPiTuiInput(this.bindings, id, data, (input, gesture) => matchesKey(input, gesture));
     }
-    /** Human hint label for an action, derived from the opening snapshot so footers
-     *  reflect the effective (possibly remapped) gestures the wizard actually honors. */
     label(id) {
-        return formatBinding(this.openingBindings, id);
+        const gestures = this.bindings.gestures(id);
+        return gestures.length === 0
+            ? "disabled"
+            : formatGesture(gestures[0].split(" > ").pop());
     }
-    /** Like `label`, but drops gestures a focused pi text Input consumes as data
-     *  (single printable chars and the arrow keys), so the Exa footer does
-     *  not claim keys that never reach the wizard while a field owns focus. */
+    /** Gestures safe to advertise while a text field owns the keyboard. */
     fieldSafeLabel(id) {
-        const survives = this.openingBindings.gestures(id).filter((gesture) => {
-            if (gesture.includes(' > '))
+        const gestures = this.bindings.gestures(id).filter((gesture) => {
+            if (gesture.includes(" > "))
                 return true;
-            const key = gesture.split('+').pop();
-            if (key === 'up' || key === 'down' || key === 'left' || key === 'right')
-                return false;
-            return key.length > 1 || gesture.includes('+');
+            const key = gesture.split("+").pop();
+            return (!(key === "up" || key === "down" || key === "left" || key === "right") &&
+                (key.length > 1 || gesture.includes("+")));
         });
-        return survives.length === 0 ? 'Disabled' : survives.map(formatGesture).join(' / ');
-    }
-    handleGlobalTabSwitch(data) {
-        if (this.matches('crtr.setup.tab-next', data)) {
-            this.moveTab(1);
-            return true;
-        }
-        if (this.matches('crtr.setup.tab-previous', data)) {
-            this.moveTab(-1);
-            return true;
-        }
-        return false;
-    }
-    selectedPackage() {
-        return this.manifest[this.pluginIndex];
-    }
-    selectedSystem() {
-        return this.systemTools[this.systemIndex];
+        return gestures.length === 0
+            ? "Disabled"
+            : gestures.map(formatGesture).join(" / ");
     }
-    movePlugin(delta) {
-        if (this.manifest.length === 0)
-            return;
-        this.pluginIndex = (this.pluginIndex + delta + this.manifest.length) % this.manifest.length;
+    setStep(next) {
+        this.step = next;
+        this.syncFocus();
         this.invalidate();
     }
-    moveSystem(delta) {
-        const interactives = this.systemTools
-            .map((tool, index) => ({ tool, index }))
-            .filter(({ tool }) => !tool.installed);
-        if (interactives.length === 0)
-            return;
-        const currentIndex = interactives.findIndex(({ index }) => index === this.systemIndex);
-        const nextPos = ((currentIndex >= 0 ? currentIndex : 0) + delta + interactives.length) % interactives.length;
-        this.systemIndex = interactives[nextPos].index;
-        this.invalidate();
+    moveStep(delta) {
+        this.setStep(((this.step + delta + STEPS.length) % STEPS.length));
     }
-    togglePackage() {
-        const entry = this.selectedPackage();
-        if (!entry)
-            return;
-        if (this.selectedPackageIds.has(entry.id))
-            this.selectedPackageIds.delete(entry.id);
+    /** Enter on a non-final step walks forward; on the last one it finishes. */
+    advance() {
+        if (this.step === 3)
+            this.finalize();
         else
-            this.selectedPackageIds.add(entry.id);
-        this.invalidate();
+            this.moveStep(1);
     }
-    toggleSystem() {
-        const tool = this.selectedSystem();
-        if (!tool || tool.installed)
+    cancel() {
+        if (this.confirming) {
+            this.confirming = false;
+            this.syncFocus();
+            this.invalidate();
             return;
-        if (this.selectedSystemTools.has(tool.tool))
-            this.selectedSystemTools.delete(tool.tool);
-        else
-            this.selectedSystemTools.add(tool.tool);
-        this.invalidate();
+        }
+        this.onCancel?.();
     }
-    toggleDetails() {
-        const entry = this.selectedPackage();
-        if (!entry)
-            return;
-        this.expandedPluginId = this.expandedPluginId === entry.id ? null : entry.id;
-        this.invalidate();
+    dispose() {
+        this.providers.dispose();
+        this.keys.focused = false;
     }
     hasPendingInstalls() {
-        const packages = this.manifest.some((entry) => this.selectedPackageIds.has(entry.id) && !this.installedPackageIds.has(entry.id));
-        const system = this.systemTools.some((tool) => !tool.installed && this.selectedSystemTools.has(tool.tool));
-        return packages || system;
+        return (this.plugins.selected.some((entry) => !this.installedPackageIds.has(entry.id)) || this.dependencies.selected.length > 0);
     }
     buildSubmission() {
         return {
-            packages: this.manifest.filter((entry) => this.selectedPackageIds.has(entry.id)),
+            packages: [...this.plugins.selected],
             installedPackageIds: new Set(this.installedPackageIds),
-            systemDeps: this.systemTools.filter((tool) => !tool.installed && this.selectedSystemTools.has(tool.tool)).map((tool) => tool.plan),
-            exaKey: this.exaInput.getValue().trim(),
+            systemDeps: [...this.dependencies.selected],
+            exaKey: this.keys.value,
             exaKeyPath: resolveExaKeyPath(),
         };
     }
     finalize() {
-        if (this.confirming) {
+        if (this.confirming || !this.hasPendingInstalls()) {
             this.onSubmit?.(this.buildSubmission());
             return;
         }
-        if (this.hasPendingInstalls()) {
-            this.confirming = true;
-            this.invalidate();
-            return;
-        }
-        this.onSubmit?.(this.buildSubmission());
-    }
-    filteredKeybindings() {
-        const resolution = this.keyDraft.resolution();
-        const needle = this.keyFilter.trim().toLowerCase();
-        if (needle === '')
-            return SETUP_KEYBINDING_ROWS;
-        return SETUP_KEYBINDING_ROWS.filter((row) => [
-            row.name,
-            row.group,
-            row.description,
-            ...row.fields.flatMap((field) => [
-                field.label ?? '',
-                field.definition.id,
-                field.definition.name,
-                field.definition.description,
-                formatBinding(resolution, field.definition.id),
-            ]),
-        ].some((value) => value.toLowerCase().includes(needle)));
-    }
-    selectedKeyRow() {
-        const rows = this.filteredKeybindings();
-        if (rows.length === 0)
-            return undefined;
-        this.keyIndex = Math.max(0, Math.min(this.keyIndex, rows.length - 1));
-        const row = rows[this.keyIndex];
-        this.keyFieldIndex = Math.max(0, Math.min(this.keyFieldIndex, row.fields.length - 1));
-        return row;
-    }
-    selectedKeybinding() {
-        return this.selectedKeyRow()?.fields[this.keyFieldIndex]?.definition;
-    }
-    tmuxPassthroughOffer() {
-        const definition = this.selectedKeybinding();
-        if (definition === undefined || !isAttachPaneBinding(definition))
-            return undefined;
-        const gestures = this.keyDraft.resolution().gestures(definition.id);
-        const expression = gestures.join('\u0000');
-        if (this.keyTmuxOccupancy?.id !== definition.id || this.keyTmuxOccupancy.expression !== expression) {
-            this.keyTmuxOccupancy = {
-                id: definition.id,
-                expression,
-                gestures: occupiedTmuxRootGestures(gestures),
-            };
-        }
-        const gesture = this.keyTmuxOccupancy.gestures[0];
-        return gesture === undefined ? undefined : { id: definition.id, gesture };
-    }
-    toggleTmuxPassthrough() {
-        const offer = this.tmuxPassthroughOffer();
-        if (offer === undefined)
-            return false;
-        this.keyDraft.toggleTmuxPassthrough(offer.id);
-        this.keyTmuxOccupancy = undefined;
-        this.keyNotice = undefined;
-        this.invalidate();
-        return true;
-    }
-    moveKey(delta) {
-        const rows = this.filteredKeybindings();
-        if (rows.length === 0)
-            return;
-        this.keyIndex = Math.max(0, Math.min(rows.length - 1, this.keyIndex + delta));
-        this.keyFieldIndex = Math.min(this.keyFieldIndex, rows[this.keyIndex].fields.length - 1);
-        const page = this.keyPageSize();
-        if (this.keyIndex < this.keyScroll)
-            this.keyScroll = this.keyIndex;
-        if (this.keyIndex >= this.keyScroll + page)
-            this.keyScroll = this.keyIndex - page + 1;
-        this.keyEditError = undefined;
-        this.invalidate();
-    }
-    moveKeyField(delta) {
-        const row = this.selectedKeyRow();
-        if (row === undefined)
-            return;
-        this.keyFieldIndex = Math.max(0, Math.min(row.fields.length - 1, this.keyFieldIndex + delta));
-        this.keyEditError = undefined;
+        this.confirming = true;
+        this.syncFocus();
         this.invalidate();
     }
-    // Max output lines the row region may emit before it starts clipping the
-    // confirm prompt / notice / footer. Budgets the fixed chrome around the list:
-    // header (3) + blank + tab header/count (2) + blank + footer (1) plus a small
-    // reserve for a diagnostic line and the notice/confirm block.
-    keyViewportLines() {
-        return Math.max(4, this.terminalRows() - 11);
-    }
-    // Rows moved per PageUp/PageDown and used for scroll clamping. Kept below the
-    // raw viewport so interleaved group-heading lines and the selected row's
-    // diagnostic line cannot push the selection off-screen.
-    keyPageSize() {
-        return Math.max(3, this.keyViewportLines() - 4);
-    }
-    beginKeyEdit() {
-        const row = this.selectedKeybinding();
-        if (!row)
-            return;
-        if (this.keyDraft.hasInvalidRoot()) {
-            this.keyNotice = `Saved keybindings root is invalid — ${this.label('crtr.setup.keybindings.reset-all')} (reset all) before editing.`;
-            this.invalidate();
-            return;
-        }
-        this.editingKey = row.id;
-        this.keyInput.setValue(this.keyDraft.expression(row.id));
-        // pi Input.setValue only clamps the cursor; seed it, then send ctrl+e
-        // (cursorLineEnd) so the cursor sits at end-of-value and the first keystroke
-        // appends after the seed instead of prepending before it.
-        this.keyInput.handleInput('\x05');
-        this.keyInput.focused = this.focused;
-        this.keyEditError = undefined;
-        this.invalidate();
-    }
-    commitKeyEdit() {
-        if (this.editingKey === null)
-            return;
-        const result = this.keyDraft.edit(this.editingKey, this.keyInput.getValue());
-        if (!result.ok) {
-            this.keyEditError = result.diagnostics[0]?.message ?? 'Invalid keybinding';
-            this.keyDiagnostics = result.diagnostics;
-            this.invalidate();
-            return;
-        }
-        this.editingKey = null;
-        this.keyInput.focused = false;
-        this.keyEditError = undefined;
-        this.keyDiagnostics = this.keyDraft.resolution().diagnostics;
-        this.keyNotice = undefined;
-        this.invalidate();
-    }
-    cancelKeyEdit() {
-        this.editingKey = null;
-        this.keyInput.focused = false;
-        this.keyEditError = undefined;
-        // Drop the rejected edit's collision diagnostics: the draft never took the
-        // offending value, so restore diagnostics from the committed draft state.
-        this.keyDiagnostics = this.keyDraft.resolution().diagnostics;
-        this.invalidate();
-    }
-    saveKeybindings() {
-        const resolution = this.keyDraft.resolution();
-        this.keyDiagnostics = resolution.diagnostics;
-        const errors = resolution.diagnostics.filter((diagnostic) => diagnostic.severity === 'error');
-        if (errors.length > 0) {
-            this.keyNotice = errors[0].message;
-            this.invalidate();
-            return;
-        }
-        try {
-            const saved = persistUserKeybindings(this.keyDraft.overrides(), {
-                expectedKeybindings: this.keyDraft.expectedKeybindings(),
-                tmuxPassthrough: this.keyDraft.tmuxPassthrough(),
-                expectedTmuxPassthrough: this.keyDraft.expectedTmuxPassthrough(),
-            });
-            this.keyDraft.markSaved(saved.overrides, saved.tmuxPassthrough);
-            this.keyNotice = 'Saved. Reload attach and reopen active views to apply changes; refreshing tmux…';
-            // The config is already persisted; a tmux-refresh failure (installer throw)
-            // must land in the notice, never as an unhandled rejection that tears down
-            // the wizard mid-TUI right after a good save.
-            void this.refreshTmuxBindingsAfterSave().catch((error) => {
-                this.keyNotice = `Saved, but tmux refresh failed: ${error instanceof Error ? error.message : String(error)}`;
-                this.invalidate();
-            });
-        }
-        catch (error) {
-            if (error instanceof KeybindingConcurrentEditError) {
-                this.keyNotice = 'Keybindings changed on disk. Reopen setup before saving.';
-            }
-            else if (error instanceof KeybindingValidationError) {
-                this.keyDiagnostics = error.diagnostics;
-                this.keyNotice = error.message;
-            }
-            else {
-                this.keyNotice = error instanceof Error ? error.message : String(error);
-            }
-        }
-        this.invalidate();
-    }
-    async refreshTmuxBindingsAfterSave() {
-        // Unit 2's frozen tmux-chrome seam: no-arg install re-reads the
-        // just-persisted user config and reconciles the crouter-owned bindings.
-        const result = installTmuxBindings();
-        const occupied = result.diagnostics.filter((diagnostic) => diagnostic.code === 'occupied');
-        if (result.ok && occupied.length === 0) {
-            this.keyNotice = 'Saved and applied to tmux. Reload attach and reopen active views.';
-        }
-        else if (result.ok) {
-            this.keyNotice = `Saved; tmux kept occupied keys: ${occupied.map((diagnostic) => diagnostic.message).join('; ')}`;
-        }
-        else {
-            this.keyNotice = `Saved, but tmux refresh failed: ${result.diagnostics.find((diagnostic) => diagnostic.code === 'tmux-error')?.message ?? 'tmux unavailable'}`;
-        }
-        this.invalidate();
-    }
-    confirmKeyAction() {
-        if (this.keyConfirm === 'reset-all') {
-            this.keyDraft.resetAll();
-            this.keyDiagnostics = [];
-            this.keyNotice = 'All rows reset to catalog defaults. Press save to write.';
-        }
-        else if (this.keyConfirm === 'discard') {
-            this.keyDraft.discard();
-            this.keyDiagnostics = this.keyDraft.resolution().diagnostics;
-            this.keyNotice = 'Unsaved keybinding changes discarded.';
-        }
-        this.keyConfirm = null;
-        this.invalidate();
-    }
-    selectedBrokerLimitInput() {
-        return this.brokerLimitIndex === 0 ? this.brokerWarningInput : this.brokerHardCapInput;
-    }
-    moveBrokerLimit(delta) {
-        this.brokerLimitIndex = ((this.brokerLimitIndex + delta + 2) % 2);
-        this.brokerWarningInput.focused = this.focused && this.brokerLimitIndex === 0;
-        this.brokerHardCapInput.focused = this.focused && this.brokerLimitIndex === 1;
-        this.brokerLimitNotice = undefined;
-        this.invalidate();
-    }
-    saveBrokerLimits() {
-        const warningThreshold = parsePositiveInteger(this.brokerWarningInput.getValue());
-        const automaticReviveHardCap = parsePositiveInteger(this.brokerHardCapInput.getValue());
-        if (warningThreshold === undefined || automaticReviveHardCap === undefined) {
-            this.brokerLimitNotice = 'Both broker limits must be positive integers.';
-            this.invalidate();
-            return;
-        }
-        if (warningThreshold > automaticReviveHardCap) {
-            this.brokerLimitNotice = 'Warning threshold cannot exceed the automatic-revive hard cap.';
-            this.invalidate();
-            return;
-        }
-        updateRawConfigAtomically('user', (latest) => ({
-            ...latest,
-            brokerThresholds: { warning: warningThreshold, automaticReviveCap: automaticReviveHardCap },
-        }));
-        this.brokerLimitNotice = `Saved to user config. Applies next tick. ${BROKER_LIMIT_OVERRIDE_PRECEDENCE}`;
-        this.invalidate();
-    }
-    handleBrokerLimitsInput(data) {
-        // Values take precedence over remappable navigation keys, so binding a
-        // setup action to a digit never makes that digit impossible to enter here.
-        if (/^\d+$/.test(data)) {
-            this.selectedBrokerLimitInput().handleInput(data);
-            this.brokerLimitNotice = undefined;
-            this.invalidate();
-            return;
-        }
-        if (this.matches('crtr.setup.list-down', data)) {
-            this.moveBrokerLimit(1);
-            return;
-        }
-        if (this.matches('crtr.setup.list-up', data)) {
-            this.moveBrokerLimit(-1);
-            return;
-        }
-        // Input receives bracketed pastes as one event. Reject a non-digit event as
-        // a whole so a saved broker limit is always an unambiguous positive integer.
-        if (data.length > 0 && [...data].every((char) => char.codePointAt(0) >= 32) && !/^\d+$/.test(data)) {
-            this.brokerLimitNotice = 'Broker limits accept digits only.';
-            this.invalidate();
-            return;
-        }
-        this.selectedBrokerLimitInput().handleInput(data);
-        // Input invokes its submit callback synchronously for Enter; preserve that
-        // callback's validation or saved notice instead of immediately clearing it.
-        if (data !== '\r' && data !== '\n')
-            this.brokerLimitNotice = undefined;
-        this.invalidate();
-    }
-    handleKeybindingsInput(data) {
-        if (this.keyConfirm !== null) {
-            if (this.matches('crtr.setup.confirm.accept', data))
-                this.confirmKeyAction();
-            else if (this.matches('crtr.setup.confirm.back', data)) {
-                this.keyConfirm = null;
-                this.invalidate();
-            }
-            return;
-        }
-        if (this.editingKey !== null) {
-            // Honor the catalog rows for commit/cancel BEFORE the pi Input sees the
-            // keystroke, so a remap of `commit-edit`/`cancel-edit` takes effect.
-            if (this.matches('crtr.setup.keybindings.commit-edit', data)) {
-                this.commitKeyEdit();
-                return;
-            }
-            if (this.matches('crtr.setup.keybindings.cancel-edit', data)) {
-                this.cancelKeyEdit();
-                return;
-            }
-            if (this.matches('crtr.setup.keybindings.page-up', data)) {
-                this.moveKey(-this.keyPageSize());
-                return;
-            }
-            if (this.matches('crtr.setup.keybindings.page-down', data)) {
-                this.moveKey(this.keyPageSize());
-                return;
-            }
-            this.keyInput.handleInput(data);
-            this.invalidate();
-            return;
-        }
-        if (this.filteringKeys) {
-            if (this.matches('crtr.setup.keybindings.filter-clear', data)) {
-                this.keyFilter = '';
-                this.filteringKeys = false;
-                this.keyIndex = 0;
-                this.keyScroll = 0;
-            }
-            else if (this.matches('crtr.setup.keybindings.edit', data)) {
-                // Enter commits the filter: leave filter-entry but KEEP keyFilter so the
-                // narrowed list can be navigated and its rows edited.
-                this.filteringKeys = false;
-            }
-            else if (this.matches('crtr.setup.keybindings.filter-delete', data)) {
-                this.keyFilter = this.keyFilter.slice(0, -1);
-                this.keyIndex = 0;
-                this.keyScroll = 0;
-            }
-            else if (data.length === 1 && data.charCodeAt(0) >= 32) {
-                this.keyFilter += data;
-                this.keyIndex = 0;
-                this.keyScroll = 0;
-            }
-            this.invalidate();
-            return;
-        }
-        if (this.matches('crtr.setup.keybindings.filter', data)) {
-            this.filteringKeys = true;
-        }
-        else if (this.matches('crtr.setup.list-down', data)) {
-            this.moveKey(1);
-            return;
-        }
-        else if (this.matches('crtr.setup.list-up', data)) {
-            this.moveKey(-1);
-            return;
-        }
-        else if (this.matches('crtr.setup.cell-previous', data)) {
-            this.moveKeyField(-1);
-            return;
-        }
-        else if (this.matches('crtr.setup.cell-next', data)) {
-            this.moveKeyField(1);
-            return;
-        }
-        else if (this.matches('crtr.setup.keybindings.page-up', data)) {
-            this.moveKey(-this.keyPageSize());
-            return;
-        }
-        else if (this.matches('crtr.setup.keybindings.page-down', data)) {
-            this.moveKey(this.keyPageSize());
-            return;
-        }
-        else if (this.matches('crtr.setup.toggle', data)) {
-            if (this.toggleTmuxPassthrough())
-                return;
-        }
-        else if (this.matches('crtr.setup.keybindings.edit', data)) {
-            this.beginKeyEdit();
-            return;
-        }
-        else if (this.matches('crtr.setup.keybindings.unbind', data)) {
-            const row = this.selectedKeybinding();
-            if (row) {
-                const result = this.keyDraft.unbind(row.id);
-                this.keyDiagnostics = result.ok ? this.keyDraft.resolution().diagnostics : result.diagnostics;
-                this.keyEditError = result.ok ? undefined : result.diagnostics[0]?.message;
-            }
-        }
-        else if (this.matches('crtr.setup.keybindings.reset-row', data)) {
-            const row = this.selectedKeybinding();
-            if (row)
-                this.keyDraft.resetRow(row.id);
-            this.keyDiagnostics = this.keyDraft.resolution().diagnostics;
-        }
-        else if (this.matches('crtr.setup.keybindings.reset-all', data)) {
-            this.keyConfirm = 'reset-all';
-        }
-        else if (this.matches('crtr.setup.keybindings.save', data)) {
-            this.saveKeybindings();
-            return;
-        }
-        else if (this.matches('crtr.setup.keybindings.discard', data)) {
-            // A committed (kept) filter is cleared first, before discard is considered.
-            if (this.keyFilter !== '') {
-                this.keyFilter = '';
-                this.keyIndex = 0;
-                this.keyScroll = 0;
-                this.keyNotice = undefined;
-            }
-            else if (this.keyDraft.dirty)
-                this.keyConfirm = 'discard';
-            else
-                this.keyNotice = 'No unsaved keybinding changes.';
-        }
-        else {
-            return;
-        }
-        this.invalidate();
+    currentPanel() {
+        return this.step === 0
+            ? this.providers
+            : this.step === 1
+                ? this.plugins
+                : this.step === 2
+                    ? this.dependencies
+                    : this.keys;
     }
     handleInput(data) {
-        // A nested provider login owns all input until it settles. In particular, do not let
-        // wizard-wide q/Tab navigation abandon the panel while its OAuth promise can still resolve.
-        if (this.activeTab === 0 && this.providers.isNestedFlowActive()) {
-            if (this.providers.handleInput(data))
-                this.invalidate();
-            return;
-        }
-        // A nested model/thinking picker owns all input until it settles, before any
-        // wizard-wide cancel/tab gesture can steal it.
-        if (this.activeTab === 5 && this.models.isPickerOpen()) {
-            if (this.models.handleInput(data))
+        const panel = this.currentPanel();
+        const match = (id, input) => this.matches(id, input);
+        const nestedInput = (this.step === 0 && this.providers.isNestedFlowActive()) ||
+            (this.step === 3 &&
+                ((data.length === 1 && data.charCodeAt(0) >= 32) ||
+                    matchesKey(data, "left") ||
+                    matchesKey(data, "right") ||
+                    matchesKey(data, "up") ||
+                    matchesKey(data, "down")));
+        if (nestedInput) {
+            if (panel.handleInput(data, match))
                 this.invalidate();
             return;
         }
         if (this.confirming) {
-            if (this.matches('crtr.setup.confirm.accept', data)) {
+            if (this.matches("crtr.setup.confirm.accept", data))
                 this.onSubmit?.(this.buildSubmission());
-                return;
-            }
-            if (this.matches('crtr.setup.confirm.back', data)) {
+            else if (this.matches("crtr.setup.confirm.back", data)) {
                 this.confirming = false;
+                this.syncFocus();
                 this.invalidate();
             }
             return;
         }
-        // Keybindings sub-states (editing / filtering / confirm) own input before the
-        // wizard-level cancel and tab gestures can steal it.
-        if (this.activeTab === 4 && (this.editingKey !== null || this.filteringKeys || this.keyConfirm !== null)) {
-            this.handleKeybindingsInput(data);
-            return;
-        }
-        // Printable chars and arrows on the API-key tab go to the focused field.
-        if (this.activeTab === 3
-            && ((data.length === 1 && data.charCodeAt(0) >= 32)
-                || matchesKey(data, 'left') || matchesKey(data, 'right') || matchesKey(data, 'up') || matchesKey(data, 'down'))) {
-            this.exaInput.handleInput(data);
-            this.invalidate();
-            return;
-        }
-        // Numeric broker-limit input owns digits before remappable setup navigation
-        // can consume them as a tab or list binding.
-        if (this.activeTab === 6 && /^\d+$/.test(data)) {
-            this.handleBrokerLimitsInput(data);
-            return;
-        }
-        // On the keybindings tab in list mode, a dirty draft must not be dropped
-        // silently by the wizard-level cancel gesture — route it through the same
-        // discard-confirm the discard path uses.
-        if (this.activeTab === 4 && this.keyDraft.dirty && this.matches('crtr.setup.cancel', data)) {
-            this.keyConfirm = 'discard';
-            this.invalidate();
-            return;
-        }
-        if (this.matches('crtr.setup.cancel', data)) {
+        if (this.matches("crtr.setup.cancel", data)) {
             this.cancel();
             return;
         }
-        if (this.handleGlobalTabSwitch(data))
-            return;
-        if (this.activeTab === 0) {
-            if (this.providers.handleInput(data))
-                this.invalidate();
-            return;
-        }
-        if (this.activeTab === 1) {
-            if (this.matches('crtr.setup.list-down', data))
-                this.movePlugin(1);
-            else if (this.matches('crtr.setup.list-up', data))
-                this.movePlugin(-1);
-            else if (this.matches('crtr.setup.toggle', data))
-                this.togglePackage();
-            else if (this.matches('crtr.setup.details', data))
-                this.toggleDetails();
-            else if (this.matches('crtr.setup.advance', data))
-                this.moveTab(1);
+        if (this.matches("crtr.setup.tab-next", data)) {
+            this.moveStep(1);
             return;
         }
-        if (this.activeTab === 2) {
-            if (this.matches('crtr.setup.list-down', data))
-                this.moveSystem(1);
-            else if (this.matches('crtr.setup.list-up', data))
-                this.moveSystem(-1);
-            else if (this.matches('crtr.setup.toggle', data))
-                this.toggleSystem();
-            else if (this.matches('crtr.setup.advance', data))
-                this.moveTab(1);
+        if (this.matches("crtr.setup.tab-previous", data)) {
+            this.moveStep(-1);
             return;
         }
-        if (this.activeTab === 3) {
-            this.exaInput.handleInput(data);
+        if (panel.handleInput(data, match)) {
             this.invalidate();
             return;
         }
-        if (this.activeTab === 4) {
-            this.handleKeybindingsInput(data);
-            return;
-        }
-        if (this.activeTab === 5) {
-            if (this.models.handleInput(data))
-                this.invalidate();
-            return;
-        }
-        if (this.activeTab === SETTINGS_TAB) {
-            this.handleSettingsInput(data);
-            return;
-        }
-        this.handleBrokerLimitsInput(data);
+        if (this.matches("crtr.setup.advance", data))
+            this.advance();
     }
-    renderHeader(width) {
-        const tabs = TAB_LABELS;
-        const fullTabLine = tabs.slice()
-            .map((label, index) => tabPill(label, index === this.activeTab))
-            .join(theme.fg('dim', '  ·  '));
-        const tabLine = visibleWidth(fullTabLine) <= width
-            ? fullTabLine
-            : `${theme.fg('dim', `${this.activeTab + 1}/${tabs.length}`)} ${tabPill(tabs[this.activeTab], true)}`;
-        return [
-            truncateToWidth(theme.fg('accent', theme.bold('crtr sys setup')), width),
-            truncateToWidth(tabLine, width),
-            truncateToWidth(rule(width), width),
-        ];
-    }
-    renderFooter(width) {
-        const tabs = `${this.label('crtr.setup.tab-next')} next · ${this.label('crtr.setup.tab-previous')} prev`;
-        if (this.activeTab === 5) {
-            const hint = this.models.isPickerOpen()
-                ? this.models.footerHint()
-                : `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} row · ${this.label('crtr.setup.cell-previous')}/${this.label('crtr.setup.cell-next')} column · ${this.label('crtr.setup.models.scope-next')} scope · ${this.label('crtr.setup.models.open')} edit · ${this.label('crtr.setup.tab-next')} next · ${this.label('crtr.setup.cancel')} cancel`;
-            return [truncateToWidth(theme.fg('dim', hint), width)];
-        }
-        if (this.activeTab === SETTINGS_TAB) {
-            return [truncateToWidth(theme.fg('dim', `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} row · ${this.label('crtr.setup.toggle')} or ${this.label('crtr.setup.cell-next')}/${this.label('crtr.setup.cell-previous')} change value · ${tabs} · ${this.label('crtr.setup.cancel')} cancel`), width)];
-        }
-        if (this.activeTab === 6) {
-            return [truncateToWidth(theme.fg('dim', `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} field · type value · Enter save · ${this.fieldSafeLabel('crtr.setup.tab-next')}/${this.fieldSafeLabel('crtr.setup.tab-previous')} switch tabs · ${this.label('crtr.setup.cancel')} cancel`), width)];
-        }
-        const line = this.confirming
-            ? `${this.label('crtr.setup.confirm.accept')} confirm · ${this.label('crtr.setup.confirm.back')} go back`
-            : this.activeTab === 0 && this.providers.isNestedFlowActive()
-                ? 'OAuth in progress · esc cancel'
-                : this.activeTab === 0
-                    ? `↑/↓ select · a add · p prefer · r rename · l re-login · x remove · ${this.label('crtr.setup.tab-next')} next · ${this.label('crtr.setup.cancel')} cancel`
-                    : this.activeTab === 1
-                        ? `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} move · ${this.label('crtr.setup.toggle')} toggle · ${this.label('crtr.setup.details')} details · ${this.label('crtr.setup.advance')} advance · ${tabs} · ${this.label('crtr.setup.cancel')} cancel`
-                        : this.activeTab === 2
-                            ? `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} move · ${this.label('crtr.setup.toggle')} toggle · ${this.label('crtr.setup.advance')} advance · ${tabs} · ${this.label('crtr.setup.cancel')} cancel`
-                            : this.activeTab === 3
-                                ? `type EXA_API_KEY · Enter finish · ${this.fieldSafeLabel('crtr.setup.tab-next')}/${this.fieldSafeLabel('crtr.setup.tab-previous')} switch tabs · Esc or ${this.fieldSafeLabel('crtr.setup.cancel')} cancel`
-                                : this.keyConfirm !== null
-                                    ? `${this.label('crtr.setup.confirm.accept')} confirm · ${this.label('crtr.setup.confirm.back')} go back`
-                                    : this.editingKey !== null
-                                        ? `type gestures separated by commas · ${this.label('crtr.setup.keybindings.commit-edit')} commit · ${this.label('crtr.setup.keybindings.cancel-edit')} cancel · ${this.label('crtr.setup.keybindings.page-up')}/${this.label('crtr.setup.keybindings.page-down')} scroll`
-                                        : this.filteringKeys
-                                            ? `filter: ${this.keyFilter || 'type to search'} · ${this.label('crtr.setup.keybindings.edit')} keep · ${this.label('crtr.setup.keybindings.filter-delete')} delete · ${this.label('crtr.setup.keybindings.filter-clear')} clear`
-                                            : `${this.label('crtr.setup.list-down')}/${this.label('crtr.setup.list-up')} move · ${this.label('crtr.setup.cell-previous')}/${this.label('crtr.setup.cell-next')} field · ${this.label('crtr.setup.keybindings.edit')} edit · ${this.tmuxPassthroughOffer() === undefined ? '' : `${this.label('crtr.setup.toggle')} tmux · `}${this.label('crtr.setup.keybindings.unbind')} disable · ${this.label('crtr.setup.keybindings.reset-row')} reset · ${this.label('crtr.setup.keybindings.reset-all')} reset all · ${this.label('crtr.setup.keybindings.filter')} filter · ${this.label('crtr.setup.keybindings.save')} save · ${this.label('crtr.setup.keybindings.discard')} ${this.keyFilter !== '' ? 'clear filter' : 'discard'}`;
-        return [truncateToWidth(theme.fg('dim', line), width)];
-    }
-    renderProviders(width) {
-        return this.providers.render(width, Math.max(1, this.terminalRows() - 6));
-    }
-    renderPlugins(width) {
-        const out = [];
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('Plugins'))}${theme.fg('dim', '  default ON')}`, width));
-        for (const [index, entry] of this.manifest.entries()) {
-            const selected = index === this.pluginIndex;
-            const checked = this.selectedPackageIds.has(entry.id) ? theme.fg('success', '[x]') : theme.fg('dim', '[ ]');
-            const marker = selected ? theme.fg('accent', '▶') : theme.fg('dim', ' ');
-            const name = selected ? theme.fg('accent', entry.name) : entry.name;
-            const status = this.installedPackageIds.has(entry.id)
-                ? theme.fg('success', '✓ installed')
-                : theme.fg('warning', 'not installed');
-            const line = `${marker} ${checked} ${name} ${theme.fg('dim', '—')} ${theme.fg('muted', entry.shortDescription)} ${status}`;
-            out.push(truncateToWidth(line, width));
-            if (this.expandedPluginId === entry.id) {
-                for (const line of wrapText(entry.longDescription, Math.max(1, width - 4))) {
-                    out.push(truncateToWidth(theme.fg('dim', `    ${line}`), width));
-                }
-            }
-        }
-        return out;
-    }
-    renderSystems(width) {
-        const out = [];
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('System deps'))}${theme.fg('dim', '  tmux + nvim + Nerd Font check')}`, width));
-        for (const [index, tool] of this.systemTools.entries()) {
-            const selected = index === this.systemIndex;
-            const marker = selected ? theme.fg('accent', '▶') : theme.fg('dim', ' ');
-            if (tool.installed) {
-                const line = `${marker} ${theme.fg('success', '✓ installed')} ${theme.fg('muted', toolLabel(tool.tool))}`;
-                out.push(truncateToWidth(line, width));
-                continue;
-            }
-            const checked = this.selectedSystemTools.has(tool.tool) ? theme.fg('success', '[x]') : theme.fg('dim', '[ ]');
-            const label = tool.plan.command ?? tool.plan.hint;
-            const name = selected ? theme.fg('accent', `Install ${toolLabel(tool.tool)}`) : `Install ${toolLabel(tool.tool)}`;
-            const line = `${marker} ${checked} ${name} ${theme.fg('dim', '—')} ${theme.fg('muted', label)} ${theme.fg('warning', 'not installed')}`;
-            out.push(truncateToWidth(line, width));
-        }
-        return out;
+    /** `Providers › Plugins › Dependencies › Exa key`, active step lit, done
+     *  steps checked — a first run should always show how much is left. */
+    renderTrail(width) {
+        const parts = STEPS.map((label, index) => {
+            if (index === this.step)
+                return theme.bg("selectedBg", ` ${index + 1} ${label} `);
+            const mark = index < this.step ? theme.fg("success", "\u2713") : `${index + 1}`;
+            return theme.fg("dim", ` ${mark} ${label} `);
+        });
+        const trail = parts.join(theme.fg("dim", "\u203a"));
+        return visibleWidth(trail) <= width
+            ? [truncateToWidth(trail, width), ""]
+            : [
+                truncateToWidth(`${theme.fg("dim", `Step ${this.step + 1} of ${STEPS.length}`)}  ${theme.fg("accent", theme.bold(STEPS[this.step]))}`, width),
+                "",
+            ];
     }
-    renderExa(width) {
-        const out = [];
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('Exa key'))}${theme.fg('dim', '  optional')}${keyStatusBadge(detectExaKey(), 'EXA_API_KEY')}`, width));
-        out.push(truncateToWidth(`${theme.fg('mdLink', 'Create a key: ')}${theme.fg('mdLinkUrl', 'https://dashboard.exa.ai/api-keys')}`, width));
-        out.push(truncateToWidth(theme.fg('dim', `Will write to: ${resolveExaKeyPath()}`), width));
-        out.push(...framed([
-            theme.fg('accent', theme.bold('Paste EXA_API_KEY here')),
-            theme.fg('dim', detectExaKey().present ? 'Leave blank to keep the existing key; paste to replace it.' : 'Leave blank to skip.'),
-            ...this.exaInput.render(Math.max(1, width - 4)),
-        ], width));
-        return out;
+    footer(width) {
+        const steps = `${this.fieldSafeLabel("crtr.setup.tab-next")}/${this.fieldSafeLabel("crtr.setup.tab-previous")} step \u00b7 ${this.label("crtr.setup.cancel")} cancel`;
+        const move = `${this.label("crtr.setup.list-down")}/${this.label("crtr.setup.list-up")}`;
+        let left;
+        if (this.confirming)
+            left = `${this.label("crtr.setup.confirm.accept")} confirm \u00b7 ${this.label("crtr.setup.confirm.back")} go back`;
+        else if (this.step === 0)
+            left = this.providers.isNestedFlowActive()
+                ? "OAuth in progress \u00b7 esc cancel"
+                : `${move} select \u00b7 a add \u00b7 p prefer \u00b7 r rename \u00b7 l re-login \u00b7 x remove \u00b7 ${this.label("crtr.setup.advance")} next`;
+        else if (this.step === 1)
+            left = `${move} move \u00b7 ${this.label("crtr.setup.toggle")} toggle \u00b7 ${this.label("crtr.setup.details")} details \u00b7 ${this.label("crtr.setup.advance")} next`;
+        else if (this.step === 2)
+            left = `${move} move \u00b7 ${this.label("crtr.setup.toggle")} toggle \u00b7 ${this.label("crtr.setup.advance")} next`;
+        else
+            left = `paste EXA_API_KEY \u00b7 ${this.label("crtr.setup.advance")} finish`;
+        const gap = width - visibleWidth(left) - visibleWidth(steps);
+        return gap >= 2
+            ? `${theme.fg("dim", left)}${" ".repeat(gap)}${theme.fg("dim", steps)}`
+            : theme.fg("dim", left);
     }
     renderConfirm(width) {
-        const out = [truncateToWidth(theme.fg('warning', theme.bold('Confirm installs')), width)];
         const submission = this.buildSubmission();
-        if (submission.packages.length === 0 && submission.systemDeps.length === 0 && submission.exaKey === '') {
-            out.push(truncateToWidth(theme.fg('success', `Nothing to install; ${this.label('crtr.setup.confirm.accept')} finish.`), width));
-            return out;
-        }
-        if (submission.packages.length > 0) {
-            out.push(truncateToWidth(theme.fg('accent', 'Packages'), width));
-            for (const entry of submission.packages) {
-                const action = this.installedPackageIds.has(entry.id)
-                    ? theme.fg('success', 'skip (already installed)')
-                    : theme.fg('muted', `pi install ${entry.installSource}`);
-                out.push(truncateToWidth(`  • ${entry.name} ${theme.fg('dim', '→')} ${action}`, width));
-            }
-        }
-        if (submission.systemDeps.length > 0) {
-            out.push(truncateToWidth(theme.fg('accent', 'System deps'), width));
-            for (const plan of submission.systemDeps) {
-                out.push(truncateToWidth(`  • ${plan.tool} ${theme.fg('dim', '→')} ${theme.fg('muted', plan.command ?? plan.hint)}`, width));
-            }
-        }
-        if (submission.exaKey !== '') {
-            out.push(truncateToWidth(`${theme.fg('accent', 'Exa key')} ${theme.fg('dim', '→')} ${theme.fg('warning', `write ${submission.exaKeyPath}`)}`, width));
-        }
-        out.push(truncateToWidth(theme.fg('dim', `${this.label('crtr.setup.confirm.accept')} confirm · ${this.label('crtr.setup.confirm.back')} go back`), width));
-        return out;
-    }
-    keyRowMessage(rows, index) {
-        const row = rows[index];
-        const selected = index === this.keyIndex;
-        const editing = row.fields.find((field) => field.definition.id === this.editingKey);
-        if (!selected && editing === undefined)
-            return undefined;
-        if (editing !== undefined && this.keyEditError)
-            return { label: editing.label, message: this.keyEditError };
-        const diagnostic = this.keyDiagnostics.find((entry) => row.fields.some((field) => entry.bindingId === field.definition.id || entry.relatedBindingIds?.includes(field.definition.id)));
-        if (diagnostic === undefined)
-            return undefined;
-        const responsible = row.fields.find((field) => diagnostic.bindingId === field.definition.id || diagnostic.relatedBindingIds?.includes(field.definition.id));
-        return { label: responsible?.label, message: diagnostic.message };
-    }
-    /** Number of lines needed to keep the active paired field legible. A narrow
-     *  row stacks the action and field instead of sacrificing the action name,
-     *  selected-field identity, or value to fixed columns. */
-    keyRowBodyLineCount(row, index, resolution, width) {
-        const editingFieldIndex = row.fields.findIndex((field) => field.definition.id === this.editingKey);
-        const active = editingFieldIndex >= 0 || index === this.keyIndex;
-        if (!active || row.fields.length < 2)
-            return 1;
-        const fieldIndex = editingFieldIndex >= 0 ? editingFieldIndex : Math.min(this.keyFieldIndex, row.fields.length - 1);
-        const field = row.fields[fieldIndex];
-        const value = editingFieldIndex >= 0 ? `> ${this.keyInput.getValue()}` : formatBinding(resolution, field.definition.id);
-        const bracketedLabel = `[${field.label}]`;
-        const inlineWidth = 3 + visibleWidth(row.name) + 1 + visibleWidth(bracketedLabel) + 1 + visibleWidth(value);
-        if (inlineWidth <= width)
-            return 1;
-        const compactFieldWidth = visibleWidth(field.label ?? '') + 1 + visibleWidth(value);
-        return compactFieldWidth <= width ? 2 : 3;
-    }
-    // Output lines the visible rows [start..end] cost, counting group headings,
-    // responsive row bodies, and diagnostics. Used to clamp the scroll so the
-    // anchor row always renders.
-    keyLineCost(rows, start, end, resolution, width) {
-        let lines = 0;
-        let previousGroup;
-        for (let index = start; index <= end; index += 1) {
-            const row = rows[index];
-            lines += (row.group !== previousGroup ? 1 : 0)
-                + this.keyRowBodyLineCount(row, index, resolution, width)
-                + (this.keyRowMessage(rows, index) ? 1 : 0)
-                + (index === this.keyIndex && this.tmuxPassthroughOffer() !== undefined ? 1 : 0);
-            previousGroup = row.group;
-        }
-        return lines;
-    }
-    renderKeybindings(width) {
-        const out = [];
-        const rows = this.filteredKeybindings();
-        const resolution = this.keyDraft.resolution();
-        const viewport = this.keyViewportLines();
-        const pageSize = this.keyPageSize();
-        const maxScroll = Math.max(0, rows.length - pageSize);
-        this.keyScroll = Math.max(0, Math.min(this.keyScroll, maxScroll));
-        if (this.keyIndex < this.keyScroll)
-            this.keyScroll = this.keyIndex;
-        if (this.keyIndex >= this.keyScroll + pageSize)
-            this.keyScroll = Math.max(0, this.keyIndex - pageSize + 1);
-        // Anchor that must stay on screen: the row being edited (so the editor never
-        // vanishes while paging moves the selection — m3), else the selection itself.
-        // Injected group-heading and diagnostic lines can make a pageSize-row window
-        // exceed the raw viewport, so instead of a fixed reserve, clamp the scroll
-        // dynamically until the anchor is guaranteed to render within `viewport`.
-        const editIndex = this.editingKey !== null
-            ? rows.findIndex((row) => row.fields.some((field) => field.definition.id === this.editingKey))
-            : -1;
-        const anchor = editIndex >= 0 ? editIndex : this.keyIndex;
-        if (anchor >= 0) {
-            if (anchor < this.keyScroll)
-                this.keyScroll = anchor;
-            while (this.keyScroll < anchor && this.keyLineCost(rows, this.keyScroll, anchor, resolution, width) > viewport) {
-                this.keyScroll += 1;
-            }
-        }
-        const dirty = this.keyDraft.dirty ? theme.fg('warning', 'unsaved') : theme.fg('success', 'saved');
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('Keybindings'))}${theme.fg('dim', '  crouter-owned only · ')}${dirty}`, width));
-        out.push(truncateToWidth(theme.fg('dim', this.keyFilter === ''
-            ? `${rows.length} actions`
-            : `${rows.length} matches for “${this.keyFilter}”${this.filteringKeys ? '' : ` · ${this.label('crtr.setup.keybindings.discard')} clears filter`}`), width));
-        if (resolution.diagnostics.some((diagnostic) => diagnostic.code === 'invalid-keybindings')) {
-            out.push(truncateToWidth(theme.fg('warning', theme.bold(`Saved keybindings root is invalid — ${this.label('crtr.setup.keybindings.reset-all')} (reset all) to clear it before editing.`)), width));
-        }
-        if (rows.length === 0) {
-            out.push('');
-            out.push(truncateToWidth(theme.fg('warning', 'No matching keybindings.'), width));
-            return out;
-        }
-        const nameWidth = Math.max(10, Math.min(26, Math.floor(width * 0.28)));
-        let emitted = 0;
-        let previousGroup;
-        for (let index = this.keyScroll; index < rows.length; index += 1) {
-            const row = rows[index];
-            const selected = index === this.keyIndex;
-            const editingFieldIndex = row.fields.findIndex((field) => field.definition.id === this.editingKey);
-            const activeFieldIndex = editingFieldIndex >= 0
-                ? editingFieldIndex
-                : selected ? Math.min(this.keyFieldIndex, row.fields.length - 1) : 0;
-            const message = this.keyRowMessage(rows, index);
-            const tmuxOffer = selected ? this.tmuxPassthroughOffer() : undefined;
-            const bodyLines = this.keyRowBodyLineCount(row, index, resolution, width);
-            // Budget output lines (heading + responsive row + optional diagnostic) so
-            // the list never clips the confirm prompt / notice / footer below it.
-            const cost = (row.group !== previousGroup ? 1 : 0) + bodyLines + (message ? 1 : 0) + (tmuxOffer ? 1 : 0);
-            if (emitted > 0 && emitted + cost > viewport)
-                break;
-            if (row.group !== previousGroup) {
-                out.push(truncateToWidth(theme.fg('accent', row.group), width));
-                previousGroup = row.group;
-            }
-            const marker = selected ? theme.fg('accent', '▶') : ' ';
-            const sourceMark = row.fields.some((field) => resolution.get(field.definition.id).source === 'user')
-                ? theme.fg('warning', '•')
-                : ' ';
-            if (bodyLines > 1) {
-                const field = row.fields[activeFieldIndex];
-                const editing = field.definition.id === this.editingKey;
-                const plainValue = editing ? `> ${this.keyInput.getValue()}` : formatBinding(resolution, field.definition.id);
-                const bracketedLabel = `[${field.label}]`;
-                const compactLabel = field.label ?? '';
-                out.push(truncateToWidth(`${marker}${sourceMark} ${selected ? theme.fg('accent', row.name) : row.name}`, width));
-                if (bodyLines === 2) {
-                    const useBracketed = visibleWidth(bracketedLabel) + 1 + visibleWidth(plainValue) <= width;
-                    const plainLabel = useBracketed ? bracketedLabel : compactLabel;
-                    const label = theme.fg('accent', theme.bold(plainLabel));
-                    const indent = ' '.repeat(Math.max(0, Math.min(3, width - visibleWidth(plainLabel) - 1 - visibleWidth(plainValue))));
-                    const valueWidth = Math.max(1, width - visibleWidth(indent) - visibleWidth(label) - 1);
-                    const value = editing ? (this.keyInput.render(valueWidth)[0] ?? '') : plainValue;
-                    out.push(truncateToWidth(`${indent}${label} ${value}`, width));
-                }
-                else {
-                    const label = theme.fg('accent', theme.bold(bracketedLabel));
-                    const labelIndent = ' '.repeat(Math.max(0, Math.min(3, width - visibleWidth(label))));
-                    const value = editing ? (this.keyInput.render(width)[0] ?? '') : plainValue;
-                    out.push(truncateToWidth(`${labelIndent}${label}`, width));
-                    out.push(truncateToWidth(value, width));
-                }
-            }
-            else {
-                const name = padAnsi(selected ? theme.fg('accent', row.name) : row.name, nameWidth);
-                const available = Math.max(1, width - 4 - nameWidth);
-                const showAllFields = row.fields.length === 1 || available >= 28;
-                const visibleFields = showAllFields ? row.fields : [row.fields[activeFieldIndex]];
-                const fieldAreaWidth = row.fields.length > 1
-                    ? Math.min(61, available)
-                    : Math.min(34, available);
-                const gapWidth = Math.max(0, visibleFields.length - 1);
-                const fieldWidth = Math.max(1, Math.floor((fieldAreaWidth - gapWidth) / visibleFields.length));
-                const renderedFields = visibleFields.map((field) => {
-                    const fieldIndex = row.fields.indexOf(field);
-                    const editing = field.definition.id === this.editingKey;
-                    const active = editing || (selected && fieldIndex === activeFieldIndex);
-                    const label = field.label === undefined
-                        ? ''
-                        : active
-                            ? theme.fg('accent', theme.bold(`[${field.label}]`))
-                            : theme.fg('dim', `${field.label}:`);
-                    const labelWidth = visibleWidth(label);
-                    const valueWidth = Math.max(1, fieldWidth - labelWidth - (label === '' ? 0 : 1));
-                    // Render the edit field whenever THIS underlying definition is being
-                    // edited, even if paging moved row selection elsewhere.
-                    const value = editing
-                        ? (this.keyInput.render(valueWidth)[0] ?? '')
-                        : formatBinding(resolution, field.definition.id);
-                    const content = label === '' ? value : `${label} ${value}`;
-                    return padAnsi(truncateToWidth(content, fieldWidth), fieldWidth);
-                });
-                const fieldsText = renderedFields.join(' ');
-                const descriptionWidth = available - visibleWidth(fieldsText) - 1;
-                const description = descriptionWidth >= 16
-                    ? ` ${theme.fg('dim', truncateToWidth(row.description, descriptionWidth))}`
-                    : '';
-                out.push(truncateToWidth(`${marker}${sourceMark} ${name} ${fieldsText}${description}`, width));
-            }
-            if (tmuxOffer) {
-                const checked = this.keyDraft.usesTmuxPassthrough(tmuxOffer.id)
-                    ? theme.fg('success', '[x]')
-                    : theme.fg('dim', '[ ]');
-                out.push(truncateToWidth(`   ${checked} ${theme.fg('accent', `Use tmux's ${formatGesture(tmuxOffer.gesture)} here`)}`, width));
-            }
-            if (message) {
-                const fieldPrefix = message.label === undefined ? '' : `${message.label}: `;
-                out.push(truncateToWidth(theme.fg('warning', `   ${fieldPrefix}${message.message}`), width));
-            }
-            emitted += cost;
-        }
-        if (this.keyConfirm !== null) {
-            out.push('');
-            out.push(truncateToWidth(theme.fg('warning', theme.bold(this.keyConfirm === 'reset-all'
-                ? 'Reset every keybinding to its catalog default?'
-                : 'Discard every unsaved keybinding change?')), width));
-        }
-        if (this.keyNotice)
-            out.push(truncateToWidth(theme.fg('muted', this.keyNotice), width));
-        return out;
-    }
-    renderModels(width) {
-        return this.models.render(width, Math.max(1, this.terminalRows() - 6));
-    }
-    renderBrokerLimits(width) {
-        const out = [];
-        const inputWidth = Math.max(8, width - 28);
-        const renderLimit = (index, label, description, input) => {
-            const selected = index === this.brokerLimitIndex;
-            const marker = selected ? theme.fg('accent', '▶') : ' ';
-            const name = selected ? theme.fg('accent', label) : label;
-            const value = input.render(inputWidth)[0] ?? '';
-            out.push(truncateToWidth(`${marker} ${padAnsi(name, 24)} ${value}`, width));
-            out.push(truncateToWidth(theme.fg('dim', `    ${description}`), width));
-        };
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('Broker limits'))}${theme.fg('dim', '  user scope · defaults 128 / 256')}`, width));
-        out.push(truncateToWidth(theme.fg('dim', 'These bounds govern daemon automatic revive; explicit node revives remain available.'), width));
-        out.push('');
-        renderLimit(0, 'Warning threshold', 'Warn when live brokers reach this count. Default: 128.', this.brokerWarningInput);
-        renderLimit(1, 'Automatic-revive hard cap', 'Defer automatic revives at this count. Default: 256.', this.brokerHardCapInput);
-        out.push('');
-        for (const line of wrapText(`Configured limits apply next tick. ${BROKER_LIMIT_OVERRIDE_PRECEDENCE}`, width)) {
-            out.push(theme.fg('dim', line));
-        }
-        if (this.brokerLimitNotice) {
-            const role = this.brokerLimitNotice.startsWith('Saved') ? 'success' : 'warning';
-            for (const line of wrapText(this.brokerLimitNotice, width))
-                out.push(theme.fg(role, line));
-        }
-        return out;
-    }
-    renderSettings(width) {
-        const out = [];
-        const config = readConfig('user');
-        const capacity = Math.max(1, Math.floor((this.terminalRows() - 13) / 2));
-        const range = visibleRange(USER_SETTINGS.length, this.settingsIndex, capacity);
-        out.push(truncateToWidth(`${theme.fg('accent', theme.bold('Settings'))}${theme.fg('dim', '  user scope')}`, width));
-        out.push(truncateToWidth(theme.fg('dim', 'General preferences live here; specialized settings keep their own tabs. Changes save immediately.'), width));
-        out.push('');
-        for (let index = range.start; index < range.end; index += 1) {
-            const setting = USER_SETTINGS[index];
-            const selected = index === this.settingsIndex;
-            const marker = selected ? theme.fg('accent', '▶') : ' ';
-            const name = selected ? theme.fg('accent', setting.label) : setting.label;
-            out.push(truncateToWidth(`${marker} ${padAnsi(name, 24)} ${theme.fg('success', setting.format(config))}`, width));
-            out.push(truncateToWidth(theme.fg('dim', `    ${setting.description}`), width));
-        }
-        if (range.start > 0 || range.end < USER_SETTINGS.length) {
-            out.push(theme.fg('dim', `(${this.settingsIndex + 1}/${USER_SETTINGS.length})`));
-        }
-        if (this.settingsNotice) {
-            out.push('');
-            for (const line of wrapText(this.settingsNotice, width))
-                out.push(theme.fg('success', line));
-        }
+        const out = [
+            truncateToWidth(theme.fg("warning", theme.bold("Confirm installs")), width),
+            "",
+        ];
+        if (submission.packages.length === 0 &&
+            submission.systemDeps.length === 0 &&
+            submission.exaKey === "")
+            return [
+                ...out,
+                truncateToWidth(theme.fg("success", `Nothing to install; ${this.label("crtr.setup.confirm.accept")} finish.`), width),
+            ];
+        if (submission.packages.length) {
+            out.push(truncateToWidth(theme.fg("accent", "Packages"), width));
+            for (const entry of submission.packages)
+                out.push(truncateToWidth(`  \u2022 ${entry.name} ${theme.fg("dim", "\u2192")} ${this.installedPackageIds.has(entry.id) ? theme.fg("success", "skip (already installed)") : theme.fg("muted", `pi install ${entry.installSource}`)}`, width));
+        }
+        if (submission.systemDeps.length) {
+            out.push(truncateToWidth(theme.fg("accent", "System deps"), width));
+            for (const plan of submission.systemDeps)
+                out.push(truncateToWidth(`  \u2022 ${plan.tool} ${theme.fg("dim", "\u2192")} ${theme.fg("muted", plan.command ?? plan.hint)}`, width));
+        }
+        if (submission.exaKey)
+            out.push(truncateToWidth(`${theme.fg("accent", "Exa key")} ${theme.fg("dim", "\u2192")} ${theme.fg("warning", `write ${submission.exaKeyPath}`)}`, width));
         return out;
     }
     render(width) {
-        const bypass = this.activeTab === 5 && this.models.isPickerOpen();
+        const bypass = this.step === 0;
         const height = this.terminalRows();
-        if (!bypass && this.cachedLines && this.cachedWidth === width && this.cachedHeight === height)
+        if (!bypass &&
+            this.cachedLines &&
+            this.cachedWidth === width &&
+            this.cachedHeight === height)
             return this.cachedLines;
-        const lines = [
-            ...this.renderHeader(width),
-            '',
-            ...(this.confirming
-                ? this.renderConfirm(width)
-                : this.activeTab === 0
-                    ? this.renderProviders(width)
-                    : this.activeTab === 1
-                        ? this.renderPlugins(width)
-                        : this.activeTab === 2
-                            ? this.renderSystems(width)
-                            : this.activeTab === 3
-                                ? this.renderExa(width)
-                                : this.activeTab === 4
-                                    ? this.renderKeybindings(width)
-                                    : this.activeTab === 5
-                                        ? this.renderModels(width)
-                                        : this.activeTab === 6
-                                            ? this.renderBrokerLimits(width)
-                                            : this.renderSettings(width)),
-            '',
-            ...this.renderFooter(width),
-        ];
-        const rendered = renderRows(lines, width);
+        const panel = this.currentPanel();
+        // On a terminal too short for both, the step content wins over the trail:
+        // a frame that shows only "which step" and none of the step is useless.
+        const budget = Math.max(1, height - PAGE_CHROME_ROWS);
+        const trail = this.confirming || budget <= 2 ? [] : this.renderTrail(width);
+        const bodyHeight = Math.max(1, budget - trail.length);
+        const lines = pageFrame({
+            width,
+            height,
+            title: "crouter setup",
+            meta: this.confirming
+                ? "review"
+                : `step ${this.step + 1} of ${STEPS.length}`,
+            body: [
+                ...trail,
+                ...(this.confirming
+                    ? this.renderConfirm(width)
+                    : panel.render(width, bodyHeight)),
+            ],
+            footer: this.footer(width),
+        });
         if (!bypass) {
             this.cachedWidth = width;
             this.cachedHeight = height;
-            this.cachedLines = rendered;
+            this.cachedLines = lines;
         }
-        return rendered;
+        return lines;
     }
 }
 export async function runSetup() {
     const state = buildSetupInitialState();
-    // Front-door reconciliation: invoking `crtr sys setup` — TTY or not —
-    // refreshes crouter-owned tmux bindings and registers known nodes' interaction
-    // roots so resolved tickets can call back into the asking node. Best-effort +
-    // idempotent, so it is safe to run on every invocation regardless of whether
-    // the wizard is opened, canceled, or submitted (the post-submission call
-    // re-runs it harmlessly).
     await reconcileInboxFrontDoor();
     if (!process.stdout.isTTY) {
         process.stdout.write(renderSetupStaticInstructions(state));
         return;
     }
-    applyTheme({ cwd: process.cwd() });
-    const agentDir = defaultAgentDir();
-    // The runtime reads the SAME credentials every crouter surface does, through crouter's
-    // own CredentialStore (pi 0.82 made credential storage app-owned): the subscription pool
-    // for managed providers, auth.json for the rest. `registry` is pi's synchronous facade
-    // over it, which the panels' sync reads need.
-    const runtime = await ModelRuntime.create({
-        credentials: new PoolCredentialStore(join(agentDir, 'auth.json')),
-        modelsPath: join(agentDir, 'models.json'),
-    });
-    const registry = new ModelRegistry(runtime);
-    const rawUserConfig = readRawScopeConfig('user');
-    const rawKeybindings = rawUserConfig?.keybindings;
-    const openingBindings = resolveKeybindings(rawKeybindings);
-    const terminal = new ProcessTerminal();
-    const tui = new TUI(terminal, true);
-    const wizard = new SetupWizard(state.manifest, state.installedPackageIds, state.systemTools, tui, agentDir, runtime, registry, openingBindings, rawKeybindings, () => terminal.rows, rawUserConfig?.tmux_passthrough);
-    tui.addChild(wizard);
-    tui.setFocus(wizard);
-    await new Promise((resolve, reject) => {
-        let restored = false;
-        const restore = () => {
-            if (restored)
-                return;
-            restored = true;
-            wizard.dispose();
-            try {
-                tui.stop();
-            }
-            catch {
-                /* best-effort terminal restore */
-            }
-        };
-        let done = false;
-        const finish = () => {
-            if (done)
-                return;
-            done = true;
-            restore();
-            resolve();
-        };
-        const fail = (error) => {
-            if (done)
-                return;
-            done = true;
-            restore();
-            reject(error);
-        };
-        const onSignal = () => finish();
-        process.once('exit', restore);
-        process.once('SIGTERM', onSignal);
-        process.once('SIGHUP', onSignal);
-        process.once('SIGINT', onSignal);
-        // Emergency cancel: the control gestures of `crtr.setup.cancel` (ctrl+c /
-        // ctrl+d in the shipped catalog) must always exit setup — from filter entry,
-        // the confirm prompts, or while a nested ProviderPanel login flow owns focus —
-        // where the focused component would otherwise swallow them. Matching is driven
-        // by the opening snapshot; the control-char guard keeps printable cancel gestures
-        // (e.g. q) as data for text fields and the filter buffer, which the wizard
-        // handles as cancel only in its own non-text states.
-        tui.addInputListener((data) => {
-            if (data.length > 0 && data.charCodeAt(0) < 32
-                && matchesPiTuiInput(openingBindings, 'crtr.setup.cancel', data, (input, gesture) => matchesKey(input, gesture))) {
-                finish();
-                return { consume: true };
-            }
-            return undefined;
-        });
-        wizard.onCancel = finish;
-        wizard.onSubmit = (submission) => {
-            restore();
-            void executeSetupSubmission(submission)
-                .then((summary) => {
-                if (done)
-                    return;
-                done = true;
-                process.stdout.write(formatSetupExecutionSummary(summary));
-                resolve();
-            }, fail);
-        };
-        try {
-            tui.start();
-        }
-        catch (error) {
-            fail(error);
-        }
-    });
+    const submission = await runSetupSettingsProcess(({ tui, terminal, agentDir, runtime, registry, bindings }, control) => {
+        const wizard = new SetupWizard(state.manifest, state.installedPackageIds, state.systemPlans, tui, agentDir, runtime, registry, bindings, () => terminal.rows);
+        wizard.onCancel = control.cancel;
+        wizard.onSubmit = control.submit;
+        return wizard;
+    }, (data, bindings) => data.length > 0 &&
+        data.charCodeAt(0) < 32 &&
+        matchesPiTuiInput(bindings, "crtr.setup.cancel", data, (input, gesture) => matchesKey(input, gesture)));
+    if (submission === undefined)
+        return;
+    const summary = await executeSetupSubmission(submission);
+    process.stdout.write(formatSetupExecutionSummary(summary));
 }