fix(web): subagent cards name the provider account

apps/mobile/src/features/threads/SubagentRow.tsx

@@ -1,4 +1,5 @@
 import { scopeProjectRef, scopeThreadRef } from "@t3tools/client-runtime/environment";
+import { resolveProviderInstanceDisplayName } from "@t3tools/client-runtime/state/provider-instance-display";
 import { resolveSubagentMetadata } from "@t3tools/client-runtime/state/subagent-display";
 import type { EnvironmentId, OrchestrationV2Subagent } from "@t3tools/contracts";
 import type { ReactNode } from "react";
@@ -125,7 +126,7 @@ function SubagentMetadata(props: {
         size={12}
       />
       <Text className="min-w-0 shrink text-xs text-foreground-muted" numberOfLines={1}>
-        {provider?.displayName ? `${provider.displayName} · ` : ""}
+        {provider ? `${resolveProviderInstanceDisplayName(provider)} · ` : ""}
         {modelLabel}
       </Text>
       {workspace.map(({ label, value }) => (

apps/web/src/components/ChatView.tsx

@@ -315,6 +315,7 @@ import {
   applyProviderInstanceSettings,
   deriveProviderInstanceEntries,
   NO_PROVIDER_MODEL_SELECTION,
+  shouldShowInstanceBadge,
   sortProviderInstanceEntries,
 } from "../providerInstances";
 import {
@@ -11089,6 +11090,13 @@ export default function ChatView(props: ChatViewProps) {
                           {showProviderSubagentBar ? (
                             <ProviderSubagentBar
                               provider={selectedProviderEntry ?? null}
+                              showInstanceBadge={
+                                selectedProviderEntry !== undefined &&
+                                shouldShowInstanceBadge(
+                                  selectedProviderEntry,
+                                  providerInstanceEntries,
+                                )
+                              }
                               modelLabel={providerSubagentModelLabel}
                               effortLabel={providerSubagentEffortLabel}
                               status={providerSubagentStatus}

apps/web/src/components/chat/ProviderSubagentBar.tsx

@@ -18,6 +18,8 @@ import { ProviderInstanceIcon } from "./ProviderInstanceIcon";
 export function ProviderSubagentBar(props: {
   /** The provider running the subagent; no icon while its catalog loads. */
   readonly provider: ProviderInstanceEntry | null;
+  /** Several accounts on this provider: badge the glyph, as the composer does. */
+  readonly showInstanceBadge: boolean;
   readonly modelLabel: string;
   /** Reasoning effort as the composer names it, when the subagent has one. */
   readonly effortLabel: string | null;
@@ -60,8 +62,10 @@ export function ProviderSubagentBar(props: {
             accentColor={props.provider.accentColor}
             acpRegistryAgentId={props.provider.acpRegistryAgentId}
             acpRegistryIconUrl={props.provider.acpRegistryIconUrl}
+            showBadge={props.showInstanceBadge}
             className="size-4 shrink-0"
             iconClassName="size-4"
+            badgeClassName="right-[-0.125rem] bottom-[-0.125rem] h-3 min-w-3 px-0.5 text-5xs"
           />
         ) : null}
         <span className="min-w-0 truncate font-medium text-foreground">{props.modelLabel}</span>

apps/web/src/components/chat/SubagentTooltipContent.tsx

@@ -23,12 +23,15 @@ import { ThreadHoverCard } from "../ThreadHoverCard";
 import { MiddleTruncate } from "../ui/middle-truncate";
 import { ProviderInstanceIcon } from "./ProviderInstanceIcon";
 import { cn } from "~/lib/utils";
+import { deriveProviderInstanceEntries, shouldShowInstanceBadge } from "../../providerInstances";
 
 /** Geometry and preview limits stay identical in lineage and timeline tooltips. */
 export function SubagentTooltipContent(props: {
   title: string;
   model: string | null;
   provider?: ServerProvider | undefined;
+  /** The environment's instances; with several accounts on one provider, the card names this one. */
+  providers?: ReadonlyArray<ServerProvider> | undefined;
   driver?: ProviderDriverKind | undefined;
   elapsed?: ReactNode;
   parentThread?: Pick<OrchestrationV2ThreadShell, "projectId" | "worktreePath"> | undefined;
@@ -42,6 +45,9 @@ export function SubagentTooltipContent(props: {
   const { modelLabel, workspace: metadata } = resolveSubagentMetadata(props);
   const preview = subagentDetailPreview(props);
   const driver = props.provider?.driver ?? props.driver;
+  const entries = deriveProviderInstanceEntries(props.providers ?? []);
+  const entry = entries.find((candidate) => candidate.instanceId === props.provider?.instanceId);
+  const showInstanceBadge = entry !== undefined && shouldShowInstanceBadge(entry, entries);
   const working = ["running", "in_progress", "pending", "waiting"].includes(props.status);
   const failed = ["failed", "error"].includes(props.status);
   const StatusIcon = working
@@ -57,14 +63,21 @@ export function SubagentTooltipContent(props: {
         {driver ? (
           <ProviderInstanceIcon
             driverKind={driver}
-            displayName={props.provider?.displayName ?? driver}
+            displayName={entry?.displayName ?? props.provider?.displayName ?? driver}
+            accentColor={entry?.accentColor}
             acpRegistryIconUrl={props.provider?.iconUrl}
+            // Same treatment as the sidebar card: accent dot, account in the label.
+            showBadge={showInstanceBadge && entry?.accentColor !== undefined}
+            badgeContent="none"
+            badgeClassName="h-2 min-w-2 px-0"
             iconClassName="size-3 shrink-0 grayscale opacity-60"
           />
         ) : (
           <BotIcon className="size-3 shrink-0" />
         )}
-        <span className="min-w-0 truncate text-foreground/75">{modelLabel}</span>
+        <span className="min-w-0 truncate text-foreground/75">
+          {showInstanceBadge ? `${modelLabel} · ${entry.displayName}` : modelLabel}
+        </span>
       </div>
       <div className="flex min-w-0 items-center justify-between gap-4">
         <span

apps/web/src/components/chat/ThreadRelationshipsControl.tsx

@@ -384,6 +384,7 @@ export function ThreadRelationshipsPanel(props: {
                   title={threadTitle}
                   model={agent.model}
                   provider={provider}
+                  providers={providers}
                   driver={providerDriver}
                   elapsed={<AgentElapsed agent={agent} />}
                   status={agent.status}

apps/web/src/components/chat/V2LifecycleRow.tsx

@@ -217,6 +217,7 @@ export function V2LifecycleRow(props: {
         provider={props.providerStatuses.find(
           (provider) => provider.instanceId === item.providerInstanceId,
         )}
+        providers={props.providerStatuses}
         title={formatSubagentDisplayTitle(item.title ?? "Subagent")}
         result={item.result}
         progress={item.progress}
@@ -374,6 +375,7 @@ export function SubagentNotificationLink(props: {
       provider={props.providerStatuses.find(
         (provider) => provider.instanceId === agent.providerInstanceId,
       )}
+      providers={props.providerStatuses}
       title={formatSubagentDisplayTitle(agent.title ?? "Subagent")}
       result={agent.result}
       progress={agent.progress}
@@ -395,6 +397,7 @@ function SubagentTimelineLink(props: {
   readonly subagentId: NodeId;
   readonly driver: ProviderDriverKind;
   readonly provider: ServerProvider | undefined;
+  readonly providers: ReadonlyArray<ServerProvider>;
   readonly title: string;
   readonly result: string | null;
   readonly progress: string | undefined;
@@ -538,6 +541,7 @@ function SubagentTimelineTooltip(
       title={formatSubagentDisplayTitle(child?.title ?? props.title)}
       model={props.model}
       provider={props.provider}
+      providers={props.providers}
       driver={props.driver}
       elapsed={props.elapsed}
       status={props.status}