@astralyn/pi 0.87.6 → 1.0.0

package/dist/modes/interactive/interactive-mode.js

@@ -1,3 +1,5 @@
+import { bindTasksUI } from "./tasks/index.js";
+import { cleanTaskText, firstCommandLine } from "./tasks/text.js";
 /**
  * Interactive mode for the coding agent.
  * Handles TUI rendering and user interaction, delegating business logic to AgentSession.
@@ -25,6 +27,7 @@ import { createCompactionSummaryMessage, createCustomMessage } from "../../core/
 import { defaultModelPerProvider, findExactModelReferenceMatch, resolveModelScopeFromModels, } from "../../core/model-resolver.js";
 import { CredentialSynchronizationError } from "../../core/model-runtime.js";
 import { DefaultPackageManager } from "../../core/package-manager.js";
+import { RADIUS_MCP_URL, RADIUS_PROVIDER_ID } from "../../core/radius.js";
 import { formatMissingSessionCwdPrompt, MissingSessionCwdError } from "../../core/session-cwd.js";
 import { SessionManager, sessionEntryToContextMessages, } from "../../core/session-manager.js";
 import { BUILTIN_SLASH_COMMANDS } from "../../core/slash-commands.js";
@@ -32,8 +35,9 @@ import { isInstallTelemetryEnabled } from "../../core/telemetry.js";
 import { withBuiltInRenderers } from "../../core/tools/renderers/index.js";
 import { hasTrustRequiringProjectResources, ProjectTrustStore } from "../../core/trust-manager.js";
 import { getUsageCostBreakdown } from "../../core/usage-totals.js";
+import { addMcpServerConfig, loadMcpConfig } from "../../extensions/mcp/config.js";
 import { getChangelogPath, getNewEntries, normalizeChangelogLinks, parseChangelog } from "../../utils/changelog.js";
-import { copyToClipboard, readClipboardText } from "../../utils/clipboard.js";
+import { copyToClipboard, readClipboardFilePaths, readClipboardText } from "../../utils/clipboard.js";
 import { extensionForImageMimeType, readClipboardImage } from "../../utils/clipboard-image.js";
 import { parseGitUrl } from "../../utils/git.js";
 import { getCwdRelativePath } from "../../utils/paths.js";
@@ -63,12 +67,16 @@ import { formatKeyText, keyDisplayText, keyHint, keyText, rawKeyHint } from "./c
 import { LoginDialogComponent } from "./components/login-dialog.js";
 import { createMermaidMarkdownTransformer } from "./components/mermaid.js";
 import { ModelSelectorComponent } from "./components/model-selector.js";
-import { formatAuthSelectorProviderType, OAuthSelectorComponent, } from "./components/oauth-selector.js";
+import { formatAuthSelectorProviderStatus, formatAuthSelectorProviderType, OAuthSelectorComponent, } from "./components/oauth-selector.js";
+import { piLogoLines, piWordmark, supportsPiLogo } from "./components/pi-logo.js";
+import { playPiLogoAnimation } from "./components/pi-logo-animation.lazy.js";
+import { createLoginMenuSelector } from "./components/radius-login-selector.js";
 import { ScopedModelsSelectorComponent } from "./components/scoped-models-selector.js";
 import { SessionSelectorComponent } from "./components/session-selector.js";
 import { SettingsSelectorComponent } from "./components/settings-selector.js";
 import { SkillInvocationMessageComponent } from "./components/skill-invocation-message.js";
 import { BranchSummaryStatusIndicator, CompactionStatusIndicator, IdleStatus, RetryStatusIndicator, WorkingStatusIndicator, } from "./components/status-indicator.js";
+import { ThemedText } from "./components/themed-text.js";
 import { ThinkingSelectorComponent } from "./components/thinking-selector.js";
 import { TreeSelectorComponent } from "./components/tree-selector.js";
 import { TrustSelectorComponent } from "./components/trust-selector.js";
@@ -79,7 +87,7 @@ import { editInExternalEditor } from "./external-editor.js";
 import { refreshModelCatalogs } from "./model-catalog-refresh.js";
 import { getModelSearchText } from "./model-search.js";
 import { shareSession } from "./session-share.js";
-import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
+import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, SYSTEM_THEME_NAME, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
 import { InteractiveThemeController } from "./theme/theme-controller.js";
 import { disposeChatRows, PendingToolMap, ToolChatContainer } from "./tool-view/chat.js";
 import { ToolExecutionComponent } from "./tool-view/tool-execution.js";
@@ -94,14 +102,24 @@ function isWorkingStatusEditor(editor) {
 function isExpandable(obj) {
     return typeof obj === "object" && obj !== null && "setExpanded" in obj && typeof obj.setExpanded === "function";
 }
-class ExpandableText extends Text {
+class ExpandableText extends ThemedText {
     constructor(getCollapsedText, getExpandedText, expanded = false, paddingX = 0, paddingY = 0) {
-        super(expanded ? getExpandedText() : getCollapsedText(), paddingX, paddingY);
-        this.getCollapsedText = getCollapsedText;
-        this.getExpandedText = getExpandedText;
+        const state = { expanded };
+        super(() => (state.expanded ? getExpandedText() : getCollapsedText()), paddingX, paddingY);
+        this.state = state;
     }
     setExpanded(expanded) {
-        this.setText(expanded ? this.getExpandedText() : this.getCollapsedText());
+        this.state.expanded = expanded;
+        this.invalidate();
+    }
+}
+/** The built-in header. Clicking its logo (the first two lines, after one column of padding) plays an easter egg. */
+class BuiltInHeader extends ExpandableText {
+    handleMouse(event) {
+        if (event.type !== "click" || event.y > 1 || event.x < 1 || event.x > 4 || !this.onLogoClick)
+            return undefined;
+        this.onLogoClick(event.screenX - event.x + 1, event.screenY - event.y);
+        return { handled: true };
     }
 }
 function isCustomSessionEntry(item) {
@@ -173,6 +191,7 @@ function llamaCppPostLoginGuidance(actionLabel, loadedModelCount) {
         ? `${actionLabel}. No llama.cpp models are loaded. Use /llama to load a model, then /model to select it.`
         : `${actionLabel}. Use /model to select a loaded llama.cpp model, or /llama to manage models.`;
 }
+const RADIUS_LOGIN_INTRO = "Radius is a service crafted for Pi by the builders of Pi, Earendil Works";
 const AUTH_TYPE_ORDER = { oauth: 0, api_key: 1 };
 function createFuzzyAutocompleteItems(items, prefix, getSearchText, toAutocompleteItem) {
     const filtered = fuzzyFilter(items, prefix, getSearchText);
@@ -195,18 +214,21 @@ function getLoginProviderCompletionOptions(providerOptions) {
             id: provider.id,
             name: provider.name,
             authTypes: [provider.authType],
+            subscription: provider.subscription,
         });
     }
     return Array.from(byId.values()).sort((a, b) => a.name.localeCompare(b.name));
 }
 function getLoginProviderSearchText(provider) {
     const authTypes = provider.authTypes
-        .map((authType) => `${authType} ${formatAuthSelectorProviderType(authType)}`)
+        .map((authType) => `${authType} ${formatAuthSelectorProviderType(authType, provider.subscription)}`)
         .join(" ");
     return `${provider.id} ${provider.name} ${authTypes}`;
 }
 function formatLoginProviderCompletionDescription(provider) {
-    const authTypes = provider.authTypes.map(formatAuthSelectorProviderType).join("/");
+    const authTypes = provider.authTypes
+        .map((authType) => formatAuthSelectorProviderType(authType, provider.subscription))
+        .join("/");
     return provider.name === provider.id ? authTypes : `${provider.name} · ${authTypes}`;
 }
 export class InteractiveMode {
@@ -244,6 +266,7 @@ export class InteractiveMode {
         // Status line tracking (for mutating immediately-sequential status updates)
         this.lastStatusSpacer = undefined;
         this.lastStatusText = undefined;
+        this.lastStatusMessage = "";
         this.managedToolStatusStarted = false;
         // Streaming message tracking
         this.streamingComponent = undefined;
@@ -316,11 +339,12 @@ export class InteractiveMode {
         this.options = { ...options, tuiMode };
         this.autoTrustOnReloadCwd = options.autoTrustOnReloadCwd;
         this.runtimeHost.setBeforeSessionInvalidate(() => {
+            this.tasksUI?.dispose();
             this.resetExtensionUI();
         });
         this.runtimeHost.setRebindSession(async () => {
             await this.rebindCurrentSession({ renderBeforeBind: true });
-            await this.themeController.applyFromSettings();
+            this.themeController.applyFromSettings();
         });
         this.version = VERSION;
         this.renderer = createInteractiveTui({
@@ -330,6 +354,7 @@ export class InteractiveMode {
             terminal: options.terminal,
             onRightClickPaste: this.onRightClickPaste,
             fullscreenCopyOnSelect: this.settingsManager.getFullscreenCopyOnSelect(),
+            fullscreenWheelScrollLines: this.settingsManager.getFullscreenWheelScrollLines(),
         });
         this.ui = createInteractiveTuiReference(() => this.renderer);
         this.ui.setClearOnShrink(this.settingsManager.getClearOnShrink());
@@ -374,7 +399,8 @@ export class InteractiveMode {
         });
     }
     getAutocompleteSourceTag(sourceInfo) {
-        if (!sourceInfo) {
+        // Built-in extension commands are untagged, like built-in commands.
+        if (!sourceInfo || sourceInfo.source === "builtin") {
             return undefined;
         }
         const scopePrefix = sourceInfo.scope === "user" ? "u" : sourceInfo.scope === "project" ? "p" : "t";
@@ -527,7 +553,7 @@ export class InteractiveMode {
             this.chatContainer.addChild(new Text(condensedText, 1, 0));
         }
         else {
-            this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0));
+            this.chatContainer.addChild(new ThemedText(() => theme.bold(theme.fg("accent", "What's New")), 1, 0));
             this.chatContainer.addChild(new Spacer(1));
             this.chatContainer.addChild(new Markdown(this.changelogMarkdown.trim(), 1, 0, this.getMarkdownThemeWithSettings()));
             this.chatContainer.addChild(new Spacer(1));
@@ -579,6 +605,7 @@ export class InteractiveMode {
             terminal,
             onRightClickPaste: this.onRightClickPaste,
             fullscreenCopyOnSelect: this.settingsManager.getFullscreenCopyOnSelect(),
+            fullscreenWheelScrollLines: this.settingsManager.getFullscreenWheelScrollLines(),
         });
         nextUi.setClearOnShrink(clearOnShrink);
         nextUi.onDebug = onDebug;
@@ -608,7 +635,7 @@ export class InteractiveMode {
         this.registerSignalHandlers();
         // Load changelog (only show new entries, skip for resumed sessions)
         this.changelogMarkdown = this.getChangelogForDisplay();
-        if (this.session.scopedModels.length > 0 && (this.options.verbose || !this.settingsManager.getQuietStartup())) {
+        if (this.session.scopedModels.length > 0 && this.shouldShowStartupDetails()) {
             const modelList = this.session.scopedModels
                 .map((sm) => {
                 const thinkingStr = sm.thinkingLevel ? `:${sm.thinkingLevel}` : "";
@@ -654,13 +681,26 @@ export class InteractiveMode {
         // Start the UI before initializing extensions so session_start handlers can use interactive dialogs
         this.ui.start();
         this.isInitialized = true;
-        await this.themeController.applyFromSettings();
+        this.themeController.applyFromSettings();
+        // The header and startup notices bake theme colors into their text, so build them once the terminal
+        // reported its colors. This ends at the terminal's DA1 reply, or after 100 ms if it answers nothing.
+        await this.themeController.waitForTerminalColors();
         // Add header with keybindings from config (unless silenced)
-        if (this.options.verbose || !this.settingsManager.getQuietStartup()) {
-            const logo = theme.bold(theme.fg("accent", APP_NAME)) + theme.fg("dim", ` v${this.version}`);
+        if (this.shouldShowStartupHeader()) {
+            const showDetails = this.shouldShowStartupDetails();
+            // Built on demand so the header follows theme changes. The logo's first line carries the version,
+            // its second line the first line of key hints. Terminals that cannot render the logo get a
+            // "Pi vX" line instead, with the key hints below it.
+            const showLogo = supportsPiLogo();
+            const withLogo = (hints) => {
+                if (!showLogo)
+                    return `${piWordmark()} ${theme.fg("dim", `v${this.version}`)}\n${hints}`;
+                const [top, bottom] = piLogoLines();
+                return `${top} ${theme.fg("dim", `v${this.version}`)}\n${bottom} ${hints}`;
+            };
             // Build startup instructions using keybinding hint helpers
             const hint = (keybinding, description) => keyHint(keybinding, description);
-            const expandedInstructions = [
+            const expandedInstructions = () => [
                 hint("app.interrupt", "to interrupt"),
                 hint("app.clear", "to clear"),
                 rawKeyHint(`${keyText("app.clear")} twice`, "to exit"),
@@ -678,19 +718,22 @@ export class InteractiveMode {
                 rawKeyHint("!!", "to run bash (no context)"),
                 hint("app.message.followUp", "to queue follow-up"),
                 hint("app.message.dequeue", "to edit all queued messages"),
-                hint("app.clipboard.pasteImage", "to paste image (with text fallback)"),
+                hint("app.clipboard.pasteImage", "to paste files on macOS, images, or text"),
                 rawKeyHint("drop files", "to attach"),
             ].join("\n");
-            const compactInstructions = [
+            const compactInstructions = () => [
                 hint("app.interrupt", "interrupt"),
                 rawKeyHint(`${keyText("app.clear")}/${keyText("app.exit")}`, "clear/exit"),
                 rawKeyHint("/", "commands"),
                 rawKeyHint("!", "bash"),
                 hint("app.tools.expand", "more"),
             ].join(theme.fg("muted", " · "));
-            const compactOnboarding = theme.fg("dim", `Press ${keyText("app.tools.expand")} to show full startup help and loaded resources.`);
-            const onboarding = theme.fg("dim", `Pi can explain its own features and look up its docs. Ask it how to use or extend Pi.`);
-            this.builtInHeader = new ExpandableText(() => `${logo}\n${compactInstructions}\n${compactOnboarding}\n\n${onboarding}`, () => `${logo}\n${expandedInstructions}\n\n${onboarding}`, this.getStartupExpansionState(), 1, 0);
+            const compactOnboarding = () => theme.fg("dim", `Press ${keyText("app.tools.expand")} to show full startup help${showDetails ? " and loaded resources" : ""}.`);
+            const onboarding = () => theme.fg("dim", `Pi can explain its own features and look up its docs. Ask it how to use or extend Pi.`);
+            const header = new BuiltInHeader(() => `${withLogo(compactInstructions())}\n${compactOnboarding()}\n\n${onboarding()}`, () => `${withLogo(expandedInstructions())}\n\n${onboarding()}`, this.getStartupExpansionState(), 1, 0);
+            if (showLogo)
+                header.onLogoClick = (column, row) => playPiLogoAnimation(this.renderer, column, row);
+            this.builtInHeader = header;
             // Setup UI layout
             this.headerContainer.addChild(new Spacer(1));
             this.headerContainer.addChild(this.builtInHeader);
@@ -991,6 +1034,14 @@ export class InteractiveMode {
     getStartupExpansionState() {
         return this.options.verbose || this.toolOutputExpanded;
     }
+    /** Startup header (logo, version, key hints). Hidden only by quietStartup: true. */
+    shouldShowStartupHeader() {
+        return this.options.verbose === true || this.settingsManager.getQuietStartup() !== true;
+    }
+    /** Startup details (model scope, loaded resources). Hidden by quietStartup: true or "header". */
+    shouldShowStartupDetails() {
+        return this.options.verbose === true || this.settingsManager.getQuietStartup() === false;
+    }
     /**
      * Get a short path relative to the package root for display.
      */
@@ -1252,7 +1303,7 @@ export class InteractiveMode {
     showLoadedResources(options) {
         // Resource rendering is idempotent; chat clears no longer clear this separate container.
         this.loadedResourcesContainer.clear();
-        const showListing = options?.force || this.options.verbose || !this.settingsManager.getQuietStartup();
+        const showListing = options?.force || this.shouldShowStartupDetails();
         const showDiagnostics = showListing || options?.showDiagnosticsWhenQuiet === true;
         if (!showListing && !showDiagnostics) {
             return;
@@ -1265,8 +1316,9 @@ export class InteractiveMode {
             }
             return theme.fg("dim", `  ${labels.join(", ")}`);
         };
+        // Bodies are built on demand so the listing follows theme changes.
         const addLoadedSection = (name, collapsedBody, expandedBody = collapsedBody, color = "mdHeading") => {
-            const section = new ExpandableText(() => `${sectionHeader(name, color)}\n${collapsedBody}`, () => `${sectionHeader(name, color)}\n${expandedBody}`, this.getStartupExpansionState(), 0, 0);
+            const section = new ExpandableText(() => `${sectionHeader(name, color)}\n${collapsedBody()}`, () => `${sectionHeader(name, color)}\n${expandedBody()}`, this.getStartupExpansionState(), 0, 0);
             this.loadedResourcesContainer.addChild(section);
             this.loadedResourcesContainer.addChild(new Spacer(1));
         };
@@ -1311,27 +1363,25 @@ export class InteractiveMode {
             ];
             if (contextFiles.length > 0) {
                 this.loadedResourcesContainer.addChild(new Spacer(1));
-                const contextList = contextFiles
-                    .map((f) => theme.fg("dim", `  ${this.formatDisplayPath(f.path)}`))
-                    .join("\n");
-                const contextCompactList = formatCompactList(contextFiles.map((contextFile) => this.formatContextPath(contextFile.path)), { sort: false });
+                const contextList = () => contextFiles.map((f) => theme.fg("dim", `  ${this.formatDisplayPath(f.path)}`)).join("\n");
+                const contextCompactList = () => formatCompactList(contextFiles.map((contextFile) => this.formatContextPath(contextFile.path)), { sort: false });
                 addLoadedSection("Context", contextCompactList, contextList);
             }
             const skills = skillsResult.skills;
             if (skills.length > 0) {
                 const groups = this.buildScopeGroups(skills.map((skill) => ({ path: skill.filePath, sourceInfo: skill.sourceInfo })));
-                const skillList = this.formatScopeGroups(groups, {
+                const skillList = () => this.formatScopeGroups(groups, {
                     formatPath: (item) => this.formatDisplayPath(item.path),
                     formatPackagePath: (item) => this.getShortPath(item.path, item.sourceInfo),
                 });
-                const skillCompactList = formatCompactList(skills.map((skill) => skill.name));
+                const skillCompactList = () => formatCompactList(skills.map((skill) => skill.name));
                 addLoadedSection("Skills", skillCompactList, skillList);
             }
             const templates = this.session.promptTemplates;
             if (templates.length > 0) {
                 const groups = this.buildScopeGroups(templates.map((template) => ({ path: template.filePath, sourceInfo: template.sourceInfo })));
                 const templateByPath = new Map(templates.map((t) => [t.filePath, t]));
-                const templateList = this.formatScopeGroups(groups, {
+                const templateList = () => this.formatScopeGroups(groups, {
                     formatPath: (item) => {
                         const template = templateByPath.get(item.path);
                         return template ? `/${template.name}` : this.formatDisplayPath(item.path);
@@ -1341,53 +1391,40 @@ export class InteractiveMode {
                         return template ? `/${template.name}` : this.formatDisplayPath(item.path);
                     },
                 });
-                const promptCompactList = formatCompactList(templates.map((template) => `/${template.name}`));
+                const promptCompactList = () => formatCompactList(templates.map((template) => `/${template.name}`));
                 addLoadedSection("Prompts", promptCompactList, templateList);
             }
             if (extensions.length > 0) {
                 const groups = this.buildScopeGroups(extensions);
-                const extList = this.formatScopeGroups(groups, {
+                const extList = () => this.formatScopeGroups(groups, {
                     formatPath: (item) => this.formatExtensionDisplayPath(item.path),
                     formatPackagePath: (item) => this.formatExtensionDisplayPath(this.getShortPath(item.path, item.sourceInfo)),
                 });
-                const extensionCompactList = formatCompactList(this.getCompactExtensionLabels(extensions));
+                const extensionLabels = this.getCompactExtensionLabels(extensions);
+                const extensionCompactList = () => formatCompactList(extensionLabels);
                 addLoadedSection("Extensions", extensionCompactList, extList, "mdHeading");
             }
-            // Show loaded themes (excluding built-in)
-            const loadedThemes = themesResult.themes;
-            const customThemes = loadedThemes.filter((t) => t.sourcePath);
-            if (customThemes.length > 0) {
-                const groups = this.buildScopeGroups(customThemes.map((loadedTheme) => ({
-                    path: loadedTheme.sourcePath,
-                    sourceInfo: loadedTheme.sourceInfo,
-                })));
-                const themeList = this.formatScopeGroups(groups, {
-                    formatPath: (item) => this.formatDisplayPath(item.path),
-                    formatPackagePath: (item) => this.getShortPath(item.path, item.sourceInfo),
-                });
-                const themeCompactList = formatCompactList(customThemes.map((loadedTheme) => loadedTheme.name ?? this.getCompactPathLabel(loadedTheme.sourcePath, loadedTheme.sourceInfo)));
-                addLoadedSection("Themes", themeCompactList, themeList);
-            }
         }
         if (showDiagnostics) {
             const skillDiagnostics = skillsResult.diagnostics;
             if (skillDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(skillDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Skill conflicts]")}\n${warningLines}`, 0, 0));
+                const warningLines = () => this.formatDiagnostics(skillDiagnostics, sourceInfos);
+                this.loadedResourcesContainer.addChild(new ThemedText(() => `${theme.fg("warning", "[Skill conflicts]")}\n${warningLines()}`, 0, 0));
                 this.loadedResourcesContainer.addChild(new Spacer(1));
             }
             const promptDiagnostics = promptsResult.diagnostics;
             if (promptDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(promptDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Prompt conflicts]")}\n${warningLines}`, 0, 0));
+                const warningLines = () => this.formatDiagnostics(promptDiagnostics, sourceInfos);
+                this.loadedResourcesContainer.addChild(new ThemedText(() => `${theme.fg("warning", "[Prompt conflicts]")}\n${warningLines()}`, 0, 0));
                 this.loadedResourcesContainer.addChild(new Spacer(1));
             }
             const extensionDiagnostics = [];
-            const extensionErrors = this.session.resourceLoader.getExtensions().errors;
-            if (extensionErrors.length > 0) {
-                for (const error of extensionErrors) {
-                    extensionDiagnostics.push({ type: "error", message: error.error, path: error.path });
-                }
+            const extensionsResult = this.session.resourceLoader.getExtensions();
+            for (const error of extensionsResult.errors) {
+                extensionDiagnostics.push({ type: "error", message: error.error, path: error.path });
+            }
+            for (const warning of extensionsResult.warnings ?? []) {
+                extensionDiagnostics.push({ type: "warning", message: warning.warning, path: warning.path });
             }
             const commandDiagnostics = this.session.extensionRunner.getCommandDiagnostics();
             extensionDiagnostics.push(...commandDiagnostics);
@@ -1395,14 +1432,14 @@ export class InteractiveMode {
             const shortcutDiagnostics = this.session.extensionRunner.getShortcutDiagnostics();
             extensionDiagnostics.push(...shortcutDiagnostics);
             if (extensionDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(extensionDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Extension issues]")}\n${warningLines}`, 0, 0));
+                const warningLines = () => this.formatDiagnostics(extensionDiagnostics, sourceInfos);
+                this.loadedResourcesContainer.addChild(new ThemedText(() => `${theme.fg("warning", "[Extension issues]")}\n${warningLines()}`, 0, 0));
                 this.loadedResourcesContainer.addChild(new Spacer(1));
             }
             const themeDiagnostics = themesResult.diagnostics;
             if (themeDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(themeDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Theme conflicts]")}\n${warningLines}`, 0, 0));
+                const warningLines = () => this.formatDiagnostics(themeDiagnostics, sourceInfos);
+                this.loadedResourcesContainer.addChild(new ThemedText(() => `${theme.fg("warning", "[Theme conflicts]")}\n${warningLines()}`, 0, 0));
                 this.loadedResourcesContainer.addChild(new Spacer(1));
             }
         }
@@ -1411,11 +1448,12 @@ export class InteractiveMode {
      * Initialize the extension system with TUI-based UI context.
      */
     async bindCurrentSessionExtensions() {
+        this.tasksUI?.dispose();
         const uiContext = this.createExtensionUIContext();
         await this.session.bindExtensions({
             uiContext,
             mode: "tui",
-            backgroundEnabled: true,
+            tasksEnabled: true,
             abortHandler: () => {
                 this.restoreQueuedMessagesToEditor({ abort: true });
             },
@@ -1479,6 +1517,7 @@ export class InteractiveMode {
                 this.showExtensionError(error.extensionPath, error.error, error.stack);
             },
         });
+        this.tasksUI = bindTasksUI({ tasks: this.session.tasks, ui: uiContext });
         setRegisteredThemes(this.session.resourceLoader.getThemes().themes);
         this.setupAutocompleteProvider();
         const extensionRunner = this.session.extensionRunner;
@@ -1495,6 +1534,7 @@ export class InteractiveMode {
         this.applyFullscreenScrollbarSetting();
         if (this.renderer instanceof TuiAltScreen) {
             this.renderer.setCopyOnSelect(this.settingsManager.getFullscreenCopyOnSelect());
+            this.renderer.setWheelScrollLines(this.settingsManager.getFullscreenWheelScrollLines());
         }
         this.footer.setSession(this.session);
         this.footer.setAutoCompactEnabled(this.session.autoCompactionEnabled);
@@ -1541,10 +1581,11 @@ export class InteractiveMode {
         this.showError(`${prefix}: ${message}`);
         const extensionHint = this.getCrashExtensionHint(error);
         if (extensionHint) {
-            this.chatContainer.addChild(new Text(theme.fg("warning", extensionHint), this.outputPad, 0));
+            this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", extensionHint), this.outputPad, 0));
         }
         if (this.recordCrash("fatal_error", error)) {
-            this.chatContainer.addChild(new Text(theme.fg("muted", this.crashReportInstructions()), this.outputPad, 0));
+            const instructions = this.crashReportInstructions();
+            this.chatContainer.addChild(new ThemedText(() => theme.fg("muted", instructions), this.outputPad, 0));
         }
         stopThemeWatcher();
         this.stop("transcript");
@@ -1580,7 +1621,7 @@ export class InteractiveMode {
         if (this.bugReportHintShown)
             return;
         this.bugReportHintShown = true;
-        this.chatContainer.addChild(new Text(theme.fg("muted", `If this looks like a ${APP_NAME} bug, /bug sends a report to the developers.`), this.outputPad, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("muted", `If this looks like a ${APP_NAME} bug, /bug sends a report to the developers.`), this.outputPad, 0));
         this.ui.requestRender();
     }
     maybeSuggestBugReport(message) {
@@ -1741,7 +1782,7 @@ export class InteractiveMode {
                 container.addChild(new Text(line, 1, 0));
             }
             if (content.length > InteractiveMode.MAX_WIDGET_LINES) {
-                container.addChild(new Text(theme.fg("muted", "... (widget truncated)"), 1, 0));
+                container.addChild(new ThemedText(() => theme.fg("muted", "... (widget truncated)"), 1, 0));
             }
             component = container;
         }
@@ -2263,17 +2304,14 @@ export class InteractiveMode {
      */
     showExtensionError(extensionPath, error, stack) {
         const errorMsg = `Extension "${extensionPath}" error: ${error}`;
-        const errorText = new Text(theme.fg("error", errorMsg), 1, 0);
+        const errorText = new ThemedText(() => theme.fg("error", errorMsg), 1, 0);
         this.chatContainer.addChild(errorText);
         if (stack) {
             // Show stack trace in dim color, indented
-            const stackLines = stack
-                .split("\n")
-                .slice(1) // Skip first line (duplicates error message)
-                .map((line) => theme.fg("dim", `  ${line.trim()}`))
-                .join("\n");
-            if (stackLines) {
-                this.chatContainer.addChild(new Text(stackLines, 1, 0));
+            const stackLines = stack.split("\n").slice(1); // Skip first line (duplicates error message)
+            if (stackLines.length > 0) {
+                const renderStack = () => stackLines.map((line) => theme.fg("dim", `  ${line.trim()}`)).join("\n");
+                this.chatContainer.addChild(new ThemedText(renderStack, 1, 0));
             }
         }
         this.ui.requestRender();
@@ -2343,8 +2381,8 @@ export class InteractiveMode {
                 this.updateEditorBorderColor();
             }
         };
-        // Handle clipboard paste (triggered on Ctrl+V). Images are attached by path;
-        // otherwise, paste plain text from the system clipboard.
+        // Handle clipboard paste (triggered on Ctrl+V). Copied files use their original paths,
+        // images are attached via temporary files, and plain text is the final fallback.
         this.defaultEditor.onPasteImage = () => {
             void this.handleClipboardPaste();
         };
@@ -2367,6 +2405,22 @@ export class InteractiveMode {
     }
     async handleClipboardPaste() {
         try {
+            const filePaths = await readClipboardFilePaths();
+            if (filePaths) {
+                if (filePaths.some((filePath) => /\p{Cc}/u.test(filePath))) {
+                    throw new Error("Clipboard file path contains control characters");
+                }
+                const paths = this.isBashMode ? filePaths.map(quoteIfNeeded).join(" ") : filePaths.join("\n");
+                const cursor = this.editor.getCursor?.();
+                const currentLine = cursor ? (this.editor.getText().split("\n")[cursor.line] ?? "") : "";
+                const characterBeforeCursor = cursor && cursor.col > 0 ? currentLine[cursor.col - 1] : "";
+                const characterAfterCursor = cursor ? currentLine[cursor.col] : "";
+                const leadingSpace = characterBeforeCursor && !/\s/.test(characterBeforeCursor) ? " " : "";
+                const trailingSpace = characterAfterCursor && !/\s/.test(characterAfterCursor) ? " " : "";
+                this.editor.insertTextAtCursor?.(`${leadingSpace}${paths}${trailingSpace}`);
+                this.ui.requestRender();
+                return;
+            }
             const image = await readClipboardImage();
             if (image) {
                 const tmpDir = os.tmpdir();
@@ -2384,8 +2438,8 @@ export class InteractiveMode {
                 this.ui.requestRender();
             }
         }
-        catch {
-            // Silently ignore clipboard errors (may not have permission, etc.)
+        catch (error) {
+            this.showError(`Failed to paste from clipboard: ${error instanceof Error ? error.message : String(error)}`);
         }
     }
     handleStartupSubmit(text) {
@@ -2400,6 +2454,11 @@ export class InteractiveMode {
             if (this.editorHost.intercept(text, "steer"))
                 return;
             // Handle commands
+            if (text === "/tasks") {
+                this.editor.setText("");
+                await this.tasksUI?.open();
+                return;
+            }
             if (text === "/settings") {
                 this.showSettingsSelector();
                 this.editor.setText("");
@@ -2768,6 +2827,9 @@ export class InteractiveMode {
                 // The bash execution callback handles TUI output rendering.
                 break;
             case "tool_execution_start": {
+                // Nested calls (from codemode scripts) are shown inside their parent's row.
+                if (event.parentToolCallId)
+                    break;
                 let component = this.pendingTools.get(event.toolCallId);
                 if (!component) {
                     component = new ToolExecutionComponent(event.toolName, event.toolCallId, event.args, {
@@ -2869,7 +2931,8 @@ export class InteractiveMode {
                     }
                     else {
                         this.chatContainer.addChild(new Spacer(1));
-                        this.chatContainer.addChild(new Text(theme.fg("error", event.errorMessage), 1, 0));
+                        const errorMessage = event.errorMessage;
+                        this.chatContainer.addChild(new ThemedText(() => theme.fg("error", errorMessage), 1, 0));
                     }
                 }
                 void this.flushCompactionQueue({ willRetry: event.willRetry });
@@ -2941,7 +3004,7 @@ export class InteractiveMode {
         }
         const message = status.type === "warning" ? `Warning: ${status.message}` : status.message;
         const color = status.type === "warning" ? "warning" : "dim";
-        this.chatContainer.addChild(new Text(theme.fg(color, message), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg(color, message), 1, 0));
         this.lastStatusSpacer = undefined;
         this.lastStatusText = undefined;
         this.ui.requestRender();
@@ -2957,12 +3020,14 @@ export class InteractiveMode {
         const last = children.length > 0 ? children[children.length - 1] : undefined;
         const secondLast = children.length > 1 ? children[children.length - 2] : undefined;
         if (last && secondLast && last === this.lastStatusText && secondLast === this.lastStatusSpacer) {
-            this.lastStatusText.setText(theme.fg("dim", message));
+            this.lastStatusMessage = message;
+            this.lastStatusText.invalidate();
             this.ui.requestRender();
             return;
         }
         const spacer = new Spacer(1);
-        const text = new Text(theme.fg("dim", message), 1, 0);
+        this.lastStatusMessage = message;
+        const text = new ThemedText(() => theme.fg("dim", this.lastStatusMessage), 1, 0);
         this.chatContainer.addChild(spacer);
         this.chatContainer.addChild(text);
         this.lastStatusSpacer = spacer;
@@ -3171,7 +3236,8 @@ export class InteractiveMode {
         if (!this.settingsManager.getShowCacheMissNotices())
             return;
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("dim", formatCacheWarmingUsage(entry)), 1, 0));
+        const usage = formatCacheWarmingUsage(entry);
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("dim", usage), 1, 0));
     }
     /**
      * Render billing usage for a compaction or branch summary. The notice is derived
@@ -3185,7 +3251,7 @@ export class InteractiveMode {
         const cost = usage.cost.total >= 0.01 ? ` (~$${usage.cost.total.toFixed(2)})` : "";
         const label = notice.kind === "compaction" ? "Compaction" : "Branch summary";
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("warning", `${label}: ${formatTokens(tokens)} tokens billed${cost}`), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", `${label}: ${formatTokens(tokens)} tokens billed${cost}`), 1, 0));
     }
     static countDroppedThinkingBlocks(message) {
         let count = 0;
@@ -3222,7 +3288,7 @@ export class InteractiveMode {
             return;
         const noun = droppedCount === 1 ? "thinking block" : "thinking blocks";
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("warning", `Anthropic dropped ${droppedCount} ${noun} (details in session)`), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", `Anthropic dropped ${droppedCount} ${noun} (details in session)`), 1, 0));
     }
     /**
      * Show a transcript notice when a completed assistant message paid for a
@@ -3249,9 +3315,8 @@ export class InteractiveMode {
         else if (miss.idleMs >= CACHE_TTL_MS) {
             label = `Cache miss after ${Math.round(miss.idleMs / 60_000)}m idle`;
         }
-        const text = theme.fg("warning", `${label}: ${reBilled}`);
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(text, 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", `${label}: ${reBilled}`), 1, 0));
     }
     renderInitialMessages() {
         const entries = this.sessionManager.buildContextEntries();
@@ -3275,7 +3340,7 @@ export class InteractiveMode {
         if (this.chatContainer.children.length > 0) {
             this.chatContainer.addChild(new Spacer(1));
         }
-        this.chatContainer.addChild(new Text(theme.fg("warning", `This project is not trusted. Project ${CONFIG_DIR_NAME} resources and packages are ignored. Use /trust to save a trust decision, then restart pi.`), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", `This project is not trusted. Project ${CONFIG_DIR_NAME} resources and packages are ignored. Use /trust to save a trust decision, then restart pi.`), 1, 0));
     }
     async getUserInput() {
         const queuedInput = this.pendingUserInputs.shift();
@@ -3314,7 +3379,8 @@ export class InteractiveMode {
         if (this.isShuttingDown)
             return;
         this.isShuttingDown = true;
-        this.session.background.close();
+        this.tasksUI?.dispose();
+        this.session.tasks.close();
         // Keep signal handlers registered until terminal cleanup has completed.
         // `signal-exit` checks the listener list during the same SIGTERM/SIGHUP
         // dispatch and re-sends the signal if only its own listeners remain.
@@ -3619,28 +3685,30 @@ export class InteractiveMode {
     }
     showError(errorMessage) {
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("error", `Error: ${errorMessage}`), this.outputPad, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("error", `Error: ${errorMessage}`), this.outputPad, 0));
         this.ui.requestRender();
     }
     showWarning(warningMessage) {
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("warning", `Warning: ${warningMessage}`), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("warning", `Warning: ${warningMessage}`), 1, 0));
         this.ui.requestRender();
     }
     showNewVersionNotification(release) {
-        const action = theme.fg("accent", `${APP_NAME} update`);
-        const updateInstruction = theme.fg("muted", `New version ${release.version} is available. Run `) + action;
+        const updateInstruction = () => theme.fg("muted", `New version ${release.version} is available. Run `) +
+            theme.fg("accent", `${APP_NAME} update`);
         const changelogUrl = "https://pi.dev/changelog";
-        const changelogLink = getCapabilities().hyperlinks
-            ? hyperlink(theme.fg("accent", changelogUrl), changelogUrl)
-            : theme.fg("accent", changelogUrl);
-        const changelogLine = UPDATE_CHANGELOG_HINT
-            ? theme.fg("muted", UPDATE_CHANGELOG_HINT)
-            : theme.fg("muted", "Changelog: ") + changelogLink;
+        const changelogLine = () => {
+            const changelogLink = getCapabilities().hyperlinks
+                ? hyperlink(theme.fg("accent", changelogUrl), changelogUrl)
+                : theme.fg("accent", changelogUrl);
+            return UPDATE_CHANGELOG_HINT
+                ? theme.fg("muted", UPDATE_CHANGELOG_HINT)
+                : theme.fg("muted", "Changelog: ") + changelogLink;
+        };
         const note = release.note?.trim();
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("warning", "Update Available"))}\n${updateInstruction}`, 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => `${theme.bold(theme.fg("warning", "Update Available"))}\n${updateInstruction()}`, 1, 0));
         if (note) {
             this.chatContainer.addChild(new Spacer(1));
             this.chatContainer.addChild(new Markdown(note, 1, 0, this.getMarkdownThemeWithSettings(), {
@@ -3648,17 +3716,17 @@ export class InteractiveMode {
             }));
             this.chatContainer.addChild(new Spacer(1));
         }
-        this.chatContainer.addChild(new Text(changelogLine, 1, 0));
+        this.chatContainer.addChild(new ThemedText(changelogLine, 1, 0));
         this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
         this.ui.requestRender();
     }
     showPackageUpdateNotification(packages) {
-        const action = theme.fg("accent", `${APP_NAME} update --extensions`);
-        const updateInstruction = theme.fg("muted", "Package updates are available. Run ") + action;
+        const updateInstruction = () => theme.fg("muted", "Package updates are available. Run ") +
+            theme.fg("accent", `${APP_NAME} update --extensions`);
         const packageLines = packages.map((pkg) => `- ${pkg}`).join("\n");
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("warning", "Package Updates Available"))}\n${updateInstruction}\n${theme.fg("muted", "Packages:")}\n${packageLines}`, 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => `${theme.bold(theme.fg("warning", "Package Updates Available"))}\n${updateInstruction()}\n${theme.fg("muted", "Packages:")}\n${packageLines}`, 1, 0));
         this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
         this.ui.requestRender();
     }
@@ -3895,7 +3963,7 @@ export class InteractiveMode {
                 thinkingLevel: this.settingsManager.getDefaultThinkingLevel() ?? DEFAULT_THINKING_LEVEL,
                 availableThinkingLevels: [...THINKING_LEVEL_OPTIONS],
                 modelThinkingLevels: this.settingsManager.getAllModelThinkingLevels(),
-                currentTheme: this.themeController.getThemeSelection() || "dark",
+                currentTheme: this.themeController.getThemeSelection() || SYSTEM_THEME_NAME,
                 terminalTheme: this.themeController.getTerminalTheme(),
                 availableThemes: getAvailableThemes(),
                 hideThinkingBlock: this.hideThinkingBlock,
@@ -3917,6 +3985,7 @@ export class InteractiveMode {
                 fullscreenExitOutput: this.settingsManager.getFullscreenExitOutput(),
                 fullscreenScrollbar: this.settingsManager.getFullscreenScrollbar(),
                 fullscreenCopyOnSelect: this.settingsManager.getFullscreenCopyOnSelect(),
+                fullscreenWheelScrollLines: this.settingsManager.getFullscreenWheelScrollLines(),
                 warnings: this.settingsManager.getWarnings(),
             }, {
                 onAutoCompactChange: (enabled) => {
@@ -3991,7 +4060,7 @@ export class InteractiveMode {
                 },
                 onThemeChange: (themeSetting) => {
                     this.settingsManager.setTheme(themeSetting);
-                    void this.themeController.setThemeSetting(themeSetting);
+                    this.themeController.setThemeSetting(themeSetting);
                 },
                 onThemePreview: (themeName) => this.themeController.preview(themeName),
                 onHideThinkingBlockChange: (hidden) => {
@@ -4014,8 +4083,8 @@ export class InteractiveMode {
                 onEnableInstallTelemetryChange: (enabled) => {
                     this.settingsManager.setEnableInstallTelemetry(enabled);
                 },
-                onQuietStartupChange: (enabled) => {
-                    this.settingsManager.setQuietStartup(enabled);
+                onQuietStartupChange: (quiet) => {
+                    this.settingsManager.setQuietStartup(quiet);
                 },
                 onDefaultProjectTrustChange: (defaultProjectTrust) => {
                     this.settingsManager.setDefaultProjectTrust(defaultProjectTrust);
@@ -4096,6 +4165,11 @@ export class InteractiveMode {
                     if (this.renderer instanceof TuiAltScreen)
                         this.renderer.setCopyOnSelect(enabled);
                 },
+                onFullscreenWheelScrollLinesChange: (lines) => {
+                    this.settingsManager.setFullscreenWheelScrollLines(lines);
+                    if (this.renderer instanceof TuiAltScreen)
+                        this.renderer.setWheelScrollLines(lines);
+                },
                 onWarningsChange: (warnings) => {
                     this.settingsManager.setWarnings(warnings);
                 },
@@ -4486,6 +4560,20 @@ export class InteractiveMode {
                 }
                 // Ask about summarization
                 done(); // Close selector first
+                // Results are saved on their launch branch, so leaving it stops its running tasks.
+                const stopped = this.session.tasksStoppedByTreeNavigation(entryId);
+                if (stopped.length > 0) {
+                    const shown = stopped
+                        .slice(0, 5)
+                        .map((task) => `  ${cleanTaskText(firstCommandLine(task.command ?? task.title))}`);
+                    if (stopped.length > shown.length)
+                        shown.push(`  …and ${stopped.length - shown.length} more`);
+                    const confirmed = await this.showExtensionConfirm(`Stop ${stopped.length} running task${stopped.length === 1 ? "" : "s"}?`, `They were started on the branch you are leaving and will be cancelled:\n${shown.join("\n")}`);
+                    if (!confirmed) {
+                        this.showTreeSelector(entryId);
+                        return;
+                    }
+                }
                 // Loop until user makes a complete choice or cancels to tree
                 let wantsSummary = false;
                 let customInstructions;
@@ -4662,6 +4750,7 @@ export class InteractiveMode {
                     source: authStatus.label ?? authStatus.source,
                 }
                 : undefined;
+            const subscription = provider.auth.oauth?.isSubscription === true;
             if ((!authType || authType === "oauth") && provider.auth.oauth) {
                 options.push({
                     id: provider.id,
@@ -4669,6 +4758,7 @@ export class InteractiveMode {
                     authType: "oauth",
                     method: provider.auth.oauth,
                     status,
+                    subscription,
                 });
             }
             if ((!authType || authType === "api_key") && provider.auth.apiKey) {
@@ -4678,6 +4768,7 @@ export class InteractiveMode {
                     authType: "api_key",
                     method: provider.auth.apiKey,
                     status,
+                    subscription,
                 });
             }
         }
@@ -4685,12 +4776,16 @@ export class InteractiveMode {
     }
     async getLogoutProviderOptions() {
         return (await this.session.modelRuntime.listCredentials({ signal: AbortSignal.timeout(15_000) }))
-            .map(({ providerId, type }) => ({
-            id: providerId,
-            name: this.session.modelRuntime.getProvider(providerId)?.name ?? providerId,
-            authType: type,
-            status: { type, source: "stored credential" },
-        }))
+            .map(({ providerId, type }) => {
+            const provider = this.session.modelRuntime.getProvider(providerId);
+            return {
+                id: providerId,
+                name: provider?.name ?? providerId,
+                authType: type,
+                status: { type, source: "stored credential" },
+                subscription: provider?.auth.oauth?.isSubscription === true,
+            };
+        })
             .sort((a, b) => a.name.localeCompare(b.name));
     }
     findLoginProviderOptions(providerRef) {
@@ -4720,18 +4815,25 @@ export class InteractiveMode {
         }
         this.showLoginProviderSelector(undefined, providerRef);
     }
-    async startProviderLogin(providerOption) {
+    /** `onBack` reopens the selector the login was started from when the user cancels it. */
+    async startProviderLogin(providerOption, onBack) {
         if (providerOption.authType === "oauth") {
-            await this.showLoginDialog(providerOption.id, providerOption.name);
+            await this.showLoginDialog(providerOption.id, providerOption.name, onBack);
         }
         else if (providerOption.method?.login) {
-            await this.showApiKeyLoginDialog(providerOption.id, providerOption.name);
+            await this.showApiKeyLoginDialog(providerOption.id, providerOption.name, onBack);
         }
         else {
-            this.showAmbientAuthDialog(providerOption);
+            this.showAmbientAuthDialog(providerOption, onBack);
         }
     }
     showLoginAuthTypeSelector(providerOptions) {
+        // The top-level selector offers Radius directly, as its last option.
+        const radiusOption = providerOptions
+            ? undefined
+            : this.getLoginProviderOptions("oauth").find((provider) => provider.id === RADIUS_PROVIDER_ID);
+        const radiusText = radiusOption ? `Sign in with ${radiusOption.name}` : undefined;
+        const radiusLabel = radiusOption ? `${radiusText}${formatAuthSelectorProviderStatus(radiusOption)}` : undefined;
         const oauthProvider = providerOptions?.find((provider) => provider.authType === "oauth");
         const oauthLoginLabel = oauthProvider?.method && "loginLabel" in oauthProvider.method ? oauthProvider.method.loginLabel : undefined;
         const subscriptionLabel = oauthLoginLabel ?? "Sign in with an account";
@@ -4746,6 +4848,8 @@ export class InteractiveMode {
         if (availableAuthTypes.has("api_key")) {
             options.push(apiKeyLabel);
         }
+        if (radiusLabel)
+            options.push(radiusLabel);
         if (options.length === 0) {
             this.showStatus("No login methods available.");
             return;
@@ -4761,29 +4865,37 @@ export class InteractiveMode {
             ? `Select authentication method for ${providerOptions[0].name}:`
             : "Select authentication method:";
         this.showSelector((done) => {
-            const selector = new ExtensionSelectorComponent(title, options, (option) => {
+            const onSelect = (option) => {
                 done();
+                if (radiusOption && option === radiusLabel) {
+                    void this.startProviderLogin(radiusOption, () => this.showLoginAuthTypeSelector());
+                    return;
+                }
                 const authType = option === subscriptionLabel ? "oauth" : "api_key";
                 if (providerOptions) {
                     const providerOption = providerOptions.find((provider) => provider.authType === authType);
                     if (providerOption) {
-                        void this.startProviderLogin(providerOption);
+                        void this.startProviderLogin(providerOption, () => this.showLoginAuthTypeSelector(providerOptions));
                     }
                     return;
                 }
                 this.showLoginProviderSelector(authType);
-            }, () => {
+            };
+            const onCancel = () => {
                 done();
                 this.ui.requestRender();
-            });
-            return { component: selector, focus: selector };
+            };
+            const selector = radiusLabel && radiusText
+                ? createLoginMenuSelector(this.ui, title, options, { label: radiusLabel, text: radiusText }, onSelect, onCancel)
+                : new ExtensionSelectorComponent(title, options, onSelect, onCancel);
+            return { component: selector, focus: selector, dispose: () => selector.dispose() };
         });
     }
     showLoginProviderSelector(authType, initialSearchInput) {
         const providerOptions = this.getLoginProviderOptions(authType);
         if (providerOptions.length === 0) {
             const message = authType === "oauth"
-                ? "No subscription providers available."
+                ? "No account providers available."
                 : authType === "api_key"
                     ? "No API key providers available."
                     : "No login providers available.";
@@ -4797,7 +4909,7 @@ export class InteractiveMode {
                 if (!providerOption) {
                     return;
                 }
-                await this.startProviderLogin(providerOption);
+                await this.startProviderLogin(providerOption, () => this.showLoginProviderSelector(authType, initialSearchInput));
             }, () => {
                 done();
                 if (authType) {
@@ -4951,21 +5063,24 @@ export class InteractiveMode {
         })
             .finally(() => clearTimeout(timeout));
     }
-    showAmbientAuthDialog(providerOption) {
+    showAmbientAuthDialog(providerOption, onBack) {
         const restoreEditor = () => {
             this.editorContainer.clear();
             this.editorContainer.addChild(this.editor);
             this.ui.setFocus(this.editor);
             this.ui.requestRender();
         };
-        const dialog = new LoginDialogComponent(this.ui, providerOption.id, () => restoreEditor(), providerOption.name, `${providerOption.name} setup`);
+        const dialog = new LoginDialogComponent(this.ui, providerOption.id, () => {
+            restoreEditor();
+            onBack?.();
+        }, providerOption.name, `${providerOption.name} setup`);
         dialog.showInfo(`${providerOption.method?.name ?? "Authentication"} is configured outside ${APP_NAME}.`, [], true);
         this.editorContainer.clear();
         this.editorContainer.addChild(dialog);
         this.ui.setFocus(dialog);
         this.ui.requestRender();
     }
-    async showApiKeyLoginDialog(providerId, providerName) {
+    async showApiKeyLoginDialog(providerId, providerName, onBack) {
         const previousModel = this.session.model;
         const dialog = new LoginDialogComponent(this.ui, providerId, (_success, _message) => {
             // Completion handled below
@@ -4998,12 +5113,15 @@ export class InteractiveMode {
             if (error instanceof CredentialSynchronizationError) {
                 this.showError(`Saved API key for ${providerName}, but local model state could not be synchronized: ${errorMsg}`);
             }
-            else if (errorMsg !== "Login cancelled") {
+            else if (errorMsg === "Login cancelled") {
+                onBack?.();
+            }
+            else {
                 this.showError(`Failed to save API key for ${providerName}: ${errorMsg}`);
             }
         }
     }
-    showAuthSelect(dialog, prompt) {
+    showAuthSelect(dialog, prompt, providerId) {
         return new Promise((resolve, reject) => {
             const restoreDialog = () => {
                 this.editorContainer.clear();
@@ -5022,17 +5140,17 @@ export class InteractiveMode {
             }, () => {
                 restoreDialog();
                 reject(new Error("Login cancelled"));
-            });
+            }, { description: providerId === RADIUS_PROVIDER_ID ? RADIUS_LOGIN_INTRO : undefined });
             this.editorContainer.clear();
             this.editorContainer.addChild(selector);
             this.ui.setFocus(selector);
             this.ui.requestRender();
         });
     }
-    async showAuthPrompt(dialog, prompt) {
+    async showAuthPrompt(dialog, prompt, providerId) {
         let response;
         if (prompt.type === "select") {
-            response = this.showAuthSelect(dialog, prompt);
+            response = this.showAuthSelect(dialog, prompt, providerId);
         }
         else if (prompt.type === "manual_code") {
             response = dialog.showManualInput(prompt.message);
@@ -5076,11 +5194,11 @@ export class InteractiveMode {
     async loginProvider(dialog, providerId, method) {
         await this.session.modelRuntime.login(providerId, method, {
             signal: dialog.signal,
-            prompt: (prompt) => this.showAuthPrompt(dialog, prompt),
+            prompt: (prompt) => this.showAuthPrompt(dialog, prompt, providerId),
             notify: (event) => this.notifyAuthDialog(dialog, event),
-        });
+        }, { getDeviceId: () => this.settingsManager.getOrCreateDeviceId() });
     }
-    async showLoginDialog(providerId, providerName) {
+    async showLoginDialog(providerId, providerName, onBack) {
         const previousModel = this.session.model;
         const dialog = new LoginDialogComponent(this.ui, providerId, (_success, _message) => { }, providerName);
         this.editorContainer.clear();
@@ -5097,6 +5215,8 @@ export class InteractiveMode {
             await this.loginProvider(dialog, providerId, "oauth");
             restoreEditor();
             await this.completeProviderAuthentication(providerId, providerName, "oauth", previousModel);
+            if (providerId === RADIUS_PROVIDER_ID)
+                this.offerRadiusMcpServer(providerId, providerName);
         }
         catch (error) {
             restoreEditor();
@@ -5104,11 +5224,58 @@ export class InteractiveMode {
             if (error instanceof CredentialSynchronizationError) {
                 this.showError(`Logged in to ${providerName}, but local model state could not be synchronized: ${errorMsg}`);
             }
-            else if (errorMsg !== "Login cancelled") {
+            else if (errorMsg === "Login cancelled") {
+                onBack?.();
+            }
+            else {
                 this.showError(`Failed to login to ${providerName}: ${errorMsg}`);
             }
         }
     }
+    /**
+     * Offer to point the Radius MCP server in the global mcp.json at the Radius login, adding the server
+     * when missing. Nothing is asked when a global server already uses this login.
+     */
+    offerRadiusMcpServer(providerId, providerName) {
+        const mcpPath = path.join(getAgentDir(), "mcp.json");
+        const normalizeUrl = (url) => url.replace(/\/+$/u, "");
+        const { servers } = loadMcpConfig({
+            agentDir: getAgentDir(),
+            cwd: this.sessionManager.getCwd(),
+            projectTrusted: false,
+        });
+        const existing = servers.find((server) => "url" in server.config && normalizeUrl(server.config.url) === normalizeUrl(RADIUS_MCP_URL));
+        if (existing && "url" in existing.config && existing.config.auth?.provider === providerId)
+            return;
+        let name = existing?.name ?? "radius";
+        if (!existing && servers.some((server) => server.name === name))
+            name = "radius-mcp";
+        const config = existing && "url" in existing.config
+            ? { ...existing.config, auth: { provider: providerId } }
+            : { url: RADIUS_MCP_URL, auth: { provider: providerId } };
+        // `auth` replaces the MCP OAuth sign-in.
+        delete config.oauth;
+        this.showSelector((done) => {
+            const selector = new ExtensionSelectorComponent(`Configure ${providerName} MCP in ${mcpPath}?`, ["Yes", "No"], (option) => {
+                done();
+                if (option !== "Yes")
+                    return;
+                try {
+                    addMcpServerConfig(mcpPath, name, config);
+                }
+                catch (error) {
+                    this.showError(`Could not update ${mcpPath}: ${error instanceof Error ? error.message : String(error)}`);
+                    return;
+                }
+                // The MCP extension reads mcp.json when the session starts.
+                void this.handleReloadCommand();
+            }, () => {
+                done();
+                this.ui.requestRender();
+            });
+            return { component: selector, focus: selector };
+        });
+    }
     // =========================================================================
     // Command handlers
     // =========================================================================
@@ -5126,7 +5293,7 @@ export class InteractiveMode {
         const borderColor = (s) => theme.fg("border", s);
         reloadBox.addChild(new DynamicBorder(borderColor));
         reloadBox.addChild(new Spacer(1));
-        reloadBox.addChild(new Text(theme.fg("muted", "Reloading keybindings, extensions, skills, prompts, themes, and context files..."), 1, 0));
+        reloadBox.addChild(new ThemedText(() => theme.fg("muted", "Reloading keybindings, extensions, skills, prompts, themes, and context files..."), 1, 0));
         reloadBox.addChild(new Spacer(1));
         reloadBox.addChild(new DynamicBorder(borderColor));
         const previousEditor = this.editor;
@@ -5153,7 +5320,9 @@ export class InteractiveMode {
             chatRestoredBeforeSessionStart = true;
         };
         try {
+            this.tasksUI?.dispose();
             await this.session.reload({ beforeSessionStart: restoreChatBeforeSessionStart });
+            this.tasksUI = bindTasksUI({ tasks: this.session.tasks, ui: this.createExtensionUIContext() });
             restoreChatBeforeSessionStart();
             this.keybindings.reload();
             const activeHeader = this.customHeader ?? this.builtInHeader;
@@ -5162,7 +5331,7 @@ export class InteractiveMode {
             }
             setRegisteredThemes(this.session.resourceLoader.getThemes().themes);
             this.applyRuntimeSettings();
-            await this.themeController.applyFromSettings();
+            this.themeController.applyFromSettings();
             this.setupAutocompleteProvider();
             const runner = this.session.extensionRunner;
             this.setupExtensionShortcuts(runner);
@@ -5326,7 +5495,7 @@ export class InteractiveMode {
             const currentName = this.sessionManager.getSessionName();
             if (currentName) {
                 this.chatContainer.addChild(new Spacer(1));
-                this.chatContainer.addChild(new Text(theme.fg("dim", `Session name: ${currentName}`), 1, 0));
+                this.chatContainer.addChild(new ThemedText(() => theme.fg("dim", `Session name: ${currentName}`), 1, 0));
             }
             else {
                 this.showWarning("Usage: /name <name>");
@@ -5340,7 +5509,8 @@ export class InteractiveMode {
             this.showWarning(`Session name was normalized from ${JSON.stringify(name)} to ${JSON.stringify(sessionName)}`);
         }
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(theme.fg("dim", `Session name set: ${sessionName ?? name}`), 1, 0));
+        const displayName = sessionName ?? name;
+        this.chatContainer.addChild(new ThemedText(() => theme.fg("dim", `Session name set: ${displayName}`), 1, 0));
         this.ui.requestRender();
     }
     handleSessionCommand() {
@@ -5352,61 +5522,69 @@ export class InteractiveMode {
         // resolves to a concrete responseModel). Usage without model attribution is
         // grouped separately so the breakdown reconciles with the session total.
         const usageBreakdown = getUsageCostBreakdown(entries);
-        let info = `${theme.bold("Session Info")}\n\n`;
-        if (sessionName) {
-            info += `${theme.fg("dim", "Name:")} ${sessionName}\n`;
-        }
-        info += `${theme.fg("dim", "File:")} ${stats.sessionFile ?? "In-memory"}\n`;
-        info += `${theme.fg("dim", "ID:")} ${stats.sessionId}\n\n`;
-        info += `${theme.bold("Messages")}\n`;
-        info += `${theme.fg("dim", "Total:")} ${stats.totalMessages}\n`;
-        info += `${theme.fg("dim", "User:")} ${stats.userMessages}\n`;
-        info += `${theme.fg("dim", "Assistant:")} ${stats.assistantMessages}\n`;
-        info += `${theme.fg("dim", "Tools:")} ${stats.toolCalls} calls, ${stats.toolResults} results\n\n`;
-        info += `${theme.bold("Tokens")}\n`;
-        // "Input" is the full prompt volume. With cache activity, split it into
-        // cached (served from cache) vs uncached (everything else) - the only
-        // provider-independent split. Cache writes, where reported, are a detail
-        // of the uncached portion.
-        const { input, cacheRead, cacheWrite } = stats.tokens;
-        const promptTokens = input + cacheRead + cacheWrite;
-        info += `${theme.fg("dim", "Input:")} ${promptTokens.toLocaleString()}\n`;
-        if (promptTokens > 0 && (cacheRead > 0 || cacheWrite > 0)) {
-            const hitRate = theme.fg("dim", `(${((cacheRead / promptTokens) * 100).toFixed(1)}%)`);
-            info += `  ${theme.fg("dim", "Cached:")} ${cacheRead.toLocaleString()} ${hitRate}\n`;
-            const written = cacheWrite > 0 ? ` ${theme.fg("dim", `(${cacheWrite.toLocaleString()} written to cache)`)}` : "";
-            info += `  ${theme.fg("dim", "Uncached:")} ${(input + cacheWrite).toLocaleString()}${written}\n`;
-        }
-        info += `${theme.fg("dim", "Output:")} ${stats.tokens.output.toLocaleString()}\n`;
-        info += `${theme.fg("dim", "Total:")} ${stats.tokens.total.toLocaleString()}\n`;
+        // Snapshot the stats; the text is built on demand so it follows theme changes.
         const cacheWarmingStatus = this.session.cacheWarmingStatus;
-        info += `\n${theme.bold("Cache Warming")}\n`;
-        info += `${theme.fg("dim", "Mode:")} ${this.settingsManager.getCacheWarmingMode()}\n`;
-        info += `${theme.fg("dim", "Status:")} ${cacheWarmingStatus ? formatCacheWarmingStatus(cacheWarmingStatus) : "Inactive (cache warming unavailable)"}\n`;
-        const decision = cacheWarmingStatus?.decision;
-        if (decision?.economicsAvailable) {
-            info += `${theme.fg("dim", "Cache miss penalty:")} $${decision.missCost.toFixed(3)}\n`;
-            info += `${theme.fg("dim", "Refresh cost:")} $${decision.warmCost.toFixed(3)}\n`;
-        }
-        if (stats.cost > 0 || cacheWaste.missedTokens > 0) {
-            info += `\n${theme.bold("Cost")}\n`;
-            info += `${theme.fg("dim", "Total:")} $${stats.cost.toFixed(3)}`;
-            if (usageBreakdown.length > 1) {
-                for (const entry of usageBreakdown) {
-                    info += `\n  ${theme.fg("dim", `${entry.key}:`)} $${entry.cost.toFixed(3)} ${theme.fg("dim", `(${formatTokens(entry.tokens)} tokens)`)}`;
+        const cacheWarmingMode = this.settingsManager.getCacheWarmingMode();
+        const model = this.session.model;
+        const selectedModelKey = `${model?.provider}/${model?.id}`;
+        const renderInfo = () => {
+            let info = `${theme.bold("Session Info")}\n\n`;
+            if (sessionName) {
+                info += `${theme.fg("dim", "Name:")} ${sessionName}\n`;
+            }
+            info += `${theme.fg("dim", "File:")} ${stats.sessionFile ?? "In-memory"}\n`;
+            info += `${theme.fg("dim", "ID:")} ${stats.sessionId}\n\n`;
+            info += `${theme.bold("Messages")}\n`;
+            info += `${theme.fg("dim", "Total:")} ${stats.totalMessages}\n`;
+            info += `${theme.fg("dim", "User:")} ${stats.userMessages}\n`;
+            info += `${theme.fg("dim", "Assistant:")} ${stats.assistantMessages}\n`;
+            info += `${theme.fg("dim", "Tools:")} ${stats.toolCalls} calls, ${stats.toolResults} results\n\n`;
+            info += `${theme.bold("Tokens")}\n`;
+            // "Input" is the full prompt volume. With cache activity, split it into
+            // cached (served from cache) vs uncached (everything else) - the only
+            // provider-independent split. Cache writes, where reported, are a detail
+            // of the uncached portion.
+            const { input, cacheRead, cacheWrite } = stats.tokens;
+            const promptTokens = input + cacheRead + cacheWrite;
+            info += `${theme.fg("dim", "Input:")} ${promptTokens.toLocaleString()}\n`;
+            if (promptTokens > 0 && (cacheRead > 0 || cacheWrite > 0)) {
+                const hitRate = theme.fg("dim", `(${((cacheRead / promptTokens) * 100).toFixed(1)}%)`);
+                info += `  ${theme.fg("dim", "Cached:")} ${cacheRead.toLocaleString()} ${hitRate}\n`;
+                const written = cacheWrite > 0 ? ` ${theme.fg("dim", `(${cacheWrite.toLocaleString()} written to cache)`)}` : "";
+                info += `  ${theme.fg("dim", "Uncached:")} ${(input + cacheWrite).toLocaleString()}${written}\n`;
+            }
+            info += `${theme.fg("dim", "Output:")} ${stats.tokens.output.toLocaleString()}\n`;
+            info += `${theme.fg("dim", "Total:")} ${stats.tokens.total.toLocaleString()}\n`;
+            info += `\n${theme.bold("Cache Warming")}\n`;
+            info += `${theme.fg("dim", "Mode:")} ${cacheWarmingMode}\n`;
+            info += `${theme.fg("dim", "Status:")} ${cacheWarmingStatus ? formatCacheWarmingStatus(cacheWarmingStatus) : "Inactive (cache warming unavailable)"}\n`;
+            const decision = cacheWarmingStatus?.decision;
+            if (decision?.economicsAvailable) {
+                info += `${theme.fg("dim", "Cache miss penalty:")} $${decision.missCost.toFixed(3)}\n`;
+                info += `${theme.fg("dim", "Refresh cost:")} $${decision.warmCost.toFixed(3)}\n`;
+            }
+            if (stats.cost > 0 || cacheWaste.missedTokens > 0) {
+                info += `\n${theme.bold("Cost")}\n`;
+                info += `${theme.fg("dim", "Total:")} $${stats.cost.toFixed(3)}`;
+                // A single entry repeats the total, unless it names a model other than the selected one.
+                if (usageBreakdown.length > 1 || usageBreakdown[0]?.key !== selectedModelKey) {
+                    for (const entry of usageBreakdown) {
+                        info += `\n  ${theme.fg("dim", `${entry.key}:`)} $${entry.cost.toFixed(3)} ${theme.fg("dim", `(${formatTokens(entry.tokens)} tokens)`)}`;
+                    }
+                }
+                if (cacheWaste.missedTokens > 0) {
+                    const missLabel = cacheWaste.missCount === 1 ? "1 miss" : `${cacheWaste.missCount} misses`;
+                    const detail = `${cacheWaste.missedTokens.toLocaleString()} tokens, ${missLabel}`;
+                    info +=
+                        cacheWaste.missedCost >= 0.0001
+                            ? `\n${theme.fg("dim", "Cache Re-billed:")} $${cacheWaste.missedCost.toFixed(3)} ${theme.fg("dim", `(${detail})`)}`
+                            : `\n${theme.fg("dim", "Cache Re-billed:")} ${detail}`;
                 }
             }
-            if (cacheWaste.missedTokens > 0) {
-                const missLabel = cacheWaste.missCount === 1 ? "1 miss" : `${cacheWaste.missCount} misses`;
-                const detail = `${cacheWaste.missedTokens.toLocaleString()} tokens, ${missLabel}`;
-                info +=
-                    cacheWaste.missedCost >= 0.0001
-                        ? `\n${theme.fg("dim", "Cache Re-billed:")} $${cacheWaste.missedCost.toFixed(3)} ${theme.fg("dim", `(${detail})`)}`
-                        : `\n${theme.fg("dim", "Cache Re-billed:")} ${detail}`;
-            }
-        }
+            return info;
+        };
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(info, 1, 0));
+        this.chatContainer.addChild(new ThemedText(renderInfo, 1, 0));
         this.ui.requestRender();
     }
     handleChangelogCommand() {
@@ -5420,7 +5598,7 @@ export class InteractiveMode {
             : "No changelog entries found.";
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new DynamicBorder());
-        this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "What's New")), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.bold(theme.fg("accent", "What's New")), 1, 0));
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new Markdown(changelogMarkdown, 1, 1, this.getMarkdownThemeWithSettings()));
         this.chatContainer.addChild(new DynamicBorder());
@@ -5521,7 +5699,7 @@ export class InteractiveMode {
 | \`${copyMessage}\` | Copy selection or last assistant message |
 | \`${followUp}\` | Queue follow-up message |
 | \`${dequeue}\` | Restore queued messages |
-| \`${pasteImage}\` | Paste image or text from clipboard |
+| \`${pasteImage}\` | Paste files on macOS, images, or text from clipboard |
 | \`/\` | Slash commands |
 | \`!\` | Run bash command |
 | \`!!\` | Run bash command (excluded from context) |
@@ -5543,7 +5721,7 @@ export class InteractiveMode {
         }
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new DynamicBorder());
-        this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "Keyboard Shortcuts")), 1, 0));
+        this.chatContainer.addChild(new ThemedText(() => theme.bold(theme.fg("accent", "Keyboard Shortcuts")), 1, 0));
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new Markdown(hotkeys.trim(), 1, 1, this.getMarkdownThemeWithSettings()));
         this.chatContainer.addChild(new DynamicBorder());
@@ -5557,7 +5735,7 @@ export class InteractiveMode {
                 return;
             }
             this.chatContainer.addChild(new Spacer(1));
-            this.chatContainer.addChild(new Text(`${theme.fg("accent", "✓ New session started")}`, 1, 1));
+            this.chatContainer.addChild(new ThemedText(() => theme.fg("accent", "✓ New session started"), 1, 1));
             this.ui.requestRender();
         }
         catch (error) {
@@ -5588,7 +5766,7 @@ export class InteractiveMode {
         fs.mkdirSync(path.dirname(debugLogPath), { recursive: true });
         fs.writeFileSync(debugLogPath, debugData);
         this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(`${theme.fg("accent", "✓ Debug log written")}\n${theme.fg("muted", debugLogPath)}`, 1, 1));
+        this.chatContainer.addChild(new ThemedText(() => `${theme.fg("accent", "✓ Debug log written")}\n${theme.fg("muted", debugLogPath)}`, 1, 1));
         this.ui.requestRender();
     }
     handleArminSaysHi() {