diff --git a/src/traffic/PanelHeader.tsx b/src/traffic/PanelHeader.tsx
index 30c5166d..ebb3ea8c 100644
--- a/src/traffic/PanelHeader.tsx
+++ b/src/traffic/PanelHeader.tsx
@@ -5,6 +5,7 @@ import { commonText } from "@/i18n/common.i18n";
 import { cn } from "@/lib/utils";
 import { Button } from "@/ui/button";
 import { Skeleton } from "@/ui/skeleton";
+import { Tip } from "@/ui/tip";
 
 /**
  * 右侧浮层（请求详情、会话详情）顶上那一块：标题一行，下面一行要点，可选的一排
@@ -17,7 +18,7 @@ import { Skeleton } from "@/ui/skeleton";
  * right-3` 的方块，和这一行的基线对不上；放进来之后它跟着标题走。
  *
  * 标题截断、关闭钮 `shrink-0`：标题一长，浏览器会去挤按钮，按钮挤无可挤就把
- * 「关闭」折成两行。
+ * 「关闭」折成两行。截断了的标题（请求详情的标题是模型名）悬停看全。
  *
  * `tabs`：一排 `variant="line"` 的标签，贴着底边那条线 —— 和页头的标签同一个
  * 做法（`PageHeader`），选中的那条下划线压在分隔线上。
@@ -47,7 +48,13 @@ export function PanelHeader({
       className={cn("shrink-0 border-b border-border px-4 pt-3", tabs ? "pb-0" : "pb-3", className)}
     >
       <div className="flex min-h-7 items-center gap-2">
-        <h2 className="min-w-0 truncate tw-title text-foreground">{title}</h2>
+        {typeof title === "string" ? (
+          <Tip clip text={title}>
+            <h2 className="min-w-0 truncate tw-title text-foreground">{title}</h2>
+          </Tip>
+        ) : (
+          <h2 className="min-w-0 truncate tw-title text-foreground">{title}</h2>
+        )}
         {meta && <span className="shrink-0 tw-num tw-label whitespace-nowrap text-muted-foreground">{meta}</span>}
         <span className="flex-1" />
         <Button
diff --git a/src/traffic/RequestTable.tsx b/src/traffic/RequestTable.tsx
index 681c730d..b6e24ace 100644
--- a/src/traffic/RequestTable.tsx
+++ b/src/traffic/RequestTable.tsx
@@ -39,7 +39,18 @@ import { sessionsText } from "./Sessions.i18n";
 import { RowActions, TableMenus, type MenuTarget } from "./TableMenus";
 import { trafficText } from "./Traffic.i18n";
 import { useViaConfig } from "./useModelVia";
-import { indexAt, itemsOf, offsetsOf, textWidth, widest, type Col, type Item, type Widths } from "./virtual";
+import {
+  capped,
+  indexAt,
+  itemsOf,
+  NAME_PX,
+  offsetsOf,
+  textWidth,
+  widest,
+  type Col,
+  type Item,
+  type Widths,
+} from "./virtual";
 
 type Text = (typeof trafficText)["zh"];
 
@@ -296,7 +307,8 @@ function Th({
  * 哪几格最宽是按字数估的（`useSizers`），每列取前三名，估差一点也落在里面；画的是和
  * 行里一样的那一格（同一个组件），量出来的宽度就是真的。组头的字是中粗，请求行是常规；
  * 组里的请求行第一格往里缩了 22px（`pl-7`），这里照样缩。上游那一格会折行，量它最窄
- * 能收到多窄时也要能折。
+ * 能收到多窄时也要能折。名字类的几格自己封了顶（`NAME_PX`），垫在这里也一样：一个
+ * 长名字撑开的最多是上限那么宽。
  */
 function Sizer({
   col,
@@ -375,14 +387,19 @@ function useSizers(items: Item[], t: Text, ts: (typeof sessionsText)["zh"], toda
   }, [items, cache, t, ts, today, via]);
 }
 
-/** 请求行各列大约多宽：和 `requestCell` 写的是同样的字；图标、徽标的边距按一两个字宽算 */
+/**
+ * 请求行各列大约多宽：和 `requestCell` 写的是同样的字；图标、徽标的边距按一两个字宽算。
+ * 名字按画出来的宽度封顶（`capped`，上限见 `NAME_PX`）
+ */
 function requestWidths(r: RequestRow, t: Text, today: number, via: ViaConfig | null): Widths {
   const sent = notSent(r);
   const mark = rowMark(r, via);
+  const phrase = r.local || sent;
   const text = sent ? notSentText(sent) : r.local || r.provider ? upstreamText(r) : "—";
-  const name = textWidth(text) + 3;
-  // 本地应答、没有发往上游的那一句可以在词间折行（见 `UpstreamCell`）：最窄是最长的那个词
-  const nameMin = r.local || sent ? Math.max(...text.split(/\s+/).map(textWidth)) + 3 : name;
+  // 上游的名字和标志一起封顶；本地应答、没有发往上游的那一句是说明，不截断
+  const name = (phrase ? textWidth(text) : capped(textWidth(text), NAME_PX.upstream, 22)) + 3;
+  // 那一句可以在词间折行（见 `UpstreamCell`）：最窄是最长的那个词
+  const nameMin = phrase ? Math.max(...text.split(/\s+/).map(textWidth)) + 3 : name;
   const badges = [
     ...(mark ? [textWidth(t.pinned) + 1] : []),
     ...(r.secrets && r.secrets.items.length > 0
@@ -398,8 +415,9 @@ function requestWidths(r: RequestRow, t: Text, today: number, via: ViaConfig | n
   return {
     status: 2 + textWidth(statusText(r, t)),
     time: textWidth(when(r.atMs, today)),
-    client: Math.min(textWidth(r.client), 24) + (r.peer ? 2 : 0),
-    model: Math.min(textWidth(r.model ?? "—"), 32),
+    // 来源的记号在同一个限宽的块里（见 `KeyCell`）
+    client: capped(textWidth(r.client), NAME_PX.client, r.peer ? 18 : 0) + (r.peer ? 3 : 0),
+    model: capped(textWidth(r.model ?? "—"), NAME_PX.model),
     upstream: badges.reduce((a, b) => a + b + 1, name),
     upstreamMin: Math.max(nameMin, ...badges),
     // 在跑的：首 token 加上一个时钟（「0:42」）
@@ -837,12 +855,22 @@ function requestItems(
     // 没有发往任何上游的那几行上游是空的，没有可筛的
     ...(r.provider
       ? ([
-          { kind: "item", label: t.onlyUpstream(r.provider), onSelect: () => onFilter((f) => ({ ...f, provider: r.provider })) },
+          {
+            kind: "item",
+            label: t.onlyUpstream(r.provider),
+            name: r.provider,
+            onSelect: () => onFilter((f) => ({ ...f, provider: r.provider })),
+          },
         ] as const)
       : []),
     ...(showClient
       ? ([
-          { kind: "item", label: t.onlyClient(r.client), onSelect: () => onFilter((f) => ({ ...f, client: r.client })) },
+          {
+            kind: "item",
+            label: t.onlyClient(r.client),
+            name: r.client,
+            onSelect: () => onFilter((f) => ({ ...f, client: r.client })),
+          },
         ] as const)
       : []),
     { kind: "sep" },
@@ -887,9 +915,11 @@ function requestCell(col: Col, r: RequestRow, c: { hints: boolean; via: ViaConfi
     case "model":
       return (
         // 截断要套在里面一层：`max-width` 加在 td 上会被表格自己的列宽算法吃掉，长名字照样把这一列撑开
-        <div className="max-w-[13rem] truncate" title={r.model}>
-          {r.model ?? "—"}
-        </div>
+        <Tip clip text={r.model}>
+          <div className="truncate" style={{ maxWidth: NAME_PX.model }}>
+            {r.model ?? "—"}
+          </div>
+        </Tip>
       );
     case "upstream":
       return <UpstreamCell r={r} via={c.via} />;
@@ -1129,8 +1159,14 @@ function UpstreamCell({ r, via }: { r: RequestRow; via: ViaConfig | null }) {
   const mark = rowMark(r, via);
   return (
     <div className="flex flex-wrap items-center gap-x-1.5 gap-y-0.5">
-      {/* 本地应答的那一句（英文两个词）可以在词间折行：它不是一个名字，别让它定这一列的最小宽度 */}
-      <span className={cn("flex items-center gap-1.5", !r.local && !sent && "whitespace-nowrap")}>
+      {/*
+        本地应答的那一句（英文两个词）可以在词间折行：它不是一个名字，别让它定这一列的最小宽度。
+        上游的名字不折行，**连同标志封顶**（`NAME_PX`）：再长的截断，悬停看全
+      */}
+      <span
+        className={cn("flex items-center gap-1.5", !r.local && !sent && "whitespace-nowrap")}
+        style={r.local || sent ? undefined : { maxWidth: NAME_PX.upstream }}
+      >
         {/* 被规则拒绝、选中的上游一个都接不了的请求没有发往任何上游：上游是空的，
             这一格说是哪一种，图形和路由图上的拒绝一致。和本地应答一样是一句话、不是
             名字，可以在词间折行 */}
@@ -1146,7 +1182,15 @@ function UpstreamCell({ r, via }: { r: RequestRow; via: ViaConfig | null }) {
             ) : (
               <UpstreamLogo name={r.provider} className="opacity-70" />
             )}
-            {r.local || r.provider ? <span>{upstreamText(r)}</span> : <span className="text-muted-foreground">—</span>}
+            {r.local ? (
+              <span>{upstreamText(r)}</span>
+            ) : r.provider ? (
+              <Tip clip text={r.provider}>
+                <span className="min-w-0 truncate">{r.provider}</span>
+              </Tip>
+            ) : (
+              <span className="text-muted-foreground">—</span>
+            )}
           </>
         )}
       </span>
diff --git a/src/traffic/SessionPanel.tsx b/src/traffic/SessionPanel.tsx
index d8711d17..55f52123 100644
--- a/src/traffic/SessionPanel.tsx
+++ b/src/traffic/SessionPanel.tsx
@@ -162,14 +162,23 @@ export function SessionPanel({
           </TabsList>
         }
       >
+        {/* 名字太长时截断（这一行宽不过浮层），悬停看全 */}
         {providers.length > 0 && (
           <span className="inline-flex min-w-0 items-center gap-1.5">
             <UpstreamLogo name={providers[0] ?? ""} className="opacity-70" />
-            <span className="truncate">{providers.join(" · ")}</span>
+            <Tip clip text={providers.join(" · ")}>
+              <span className="truncate">{providers.join(" · ")}</span>
+            </Tip>
           </span>
         )}
-        {client && <span className="min-w-0 truncate">{client}</span>}
-        <span className="min-w-0 truncate">{n.models.join(t.modelSep)}</span>
+        {client && (
+          <Tip clip text={client}>
+            <span className="min-w-0 truncate">{client}</span>
+          </Tip>
+        )}
+        <Tip clip text={n.models.join(t.modelSep)}>
+          <span className="min-w-0 truncate">{n.models.join(t.modelSep)}</span>
+        </Tip>
       </PanelHeader>
       <div className="relative min-h-0 flex-1">
         <TabsContent value="summary" forceMount className={PANE}>
@@ -391,7 +400,9 @@ function Waterfall({ steps, onOpen }: { steps: Step[]; onOpen: (id: number) => v
               onClick={() => onOpen(x.id)}
             >
               <span className="w-6 shrink-0 text-right tw-label text-muted-foreground">{i + 1}</span>
-              <span className="w-32 shrink-0 truncate text-left text-muted-foreground">{x.model}</span>
+              <Tip clip text={x.model}>
+                <span className="w-32 shrink-0 truncate text-left text-muted-foreground">{x.model}</span>
+              </Tip>
               <Meter value={x.cost ?? 0} max={max} color="var(--chart-2)" className="min-w-8 flex-1" />
               {/* 两格的宽度按最长的那个词定：英文的「In progress」「Canceled」，Windows 上字大 1px 也放得下 */}
               <span className="w-24 shrink-0 text-right">
diff --git a/src/traffic/SessionRow.tsx b/src/traffic/SessionRow.tsx
index cd9ba042..146297f6 100644
--- a/src/traffic/SessionRow.tsx
+++ b/src/traffic/SessionRow.tsx
@@ -18,7 +18,7 @@ import { sessionsText } from "./Sessions.i18n";
 import { compact as short, span as dur, whenMinute as when } from "@/format";
 import { RowActions } from "./TableMenus";
 import { tallyOf, type Cursor, type Group, type Tally } from "./grouping";
-import { textWidth, type Col, type Widths } from "./virtual";
+import { capped, NAME_PX, textWidth, type Col, type Widths } from "./virtual";
 
 type Text = (typeof sessionsText)["zh"];
 
@@ -212,10 +212,11 @@ function sessionCell(col: Col, f: Facts, { t, open, selected, hints, onToggle }:
         />
       );
     case "model":
-      return <Names items={n.models} sep={t.modelSep} />;
+      return <Names items={n.models} sep={t.modelSep} max={NAME_PX.model} />;
+    // 标志和名字一起封顶，和请求行的上游那一格一样
     case "upstream":
       return (
-        <span className="flex items-center gap-1.5">
+        <span className="flex items-center gap-1.5" style={{ maxWidth: NAME_PX.upstream }}>
           {providers[0] !== undefined && !first?.local && <UpstreamLogo name={providers[0]} className="opacity-70" />}
           <Names items={providers} sep=" · " />
         </span>
@@ -244,17 +245,18 @@ export function SessionSizerCell({ col, g, hints }: { col: Col; g: Group; hints:
 
 /**
  * 组头各列大约多宽，挑表头里垫哪几格用（见 `widest`）。和 `sessionCell` 写的是同样的字；
- * 图标、展开钮按两三个字宽算。
+ * 图标、展开钮按两三个字宽算。名字和请求行一样按画出来的宽度封顶（`NAME_PX`）。
  */
 export function sessionWidths(g: Group, t: Text): Widths {
   const { s, first, n, providers } = sessionFacts(g);
-  const names = (xs: string[]) => (xs[0] === undefined ? 0 : Math.min(textWidth(xs[0]), 32) + (xs.length > 1 ? 2 : 0));
-  const upstream = names(providers) + 3;
+  // 第一个名字，有其余的再加上留给它们的一个省略号（`Names`）
+  const names = (xs: string[]) => (xs[0] === undefined ? 0 : textWidth(xs[0]) + (xs.length > 1 ? 2 : 0));
+  const upstream = capped(names(providers), NAME_PX.upstream, 22) + 3;
   return {
     status: 3 + textWidth(t.turnCount(n.turns)) + (n.failed > 0 ? 2 + String(n.failed).length : 0),
     time: textWidth(when(n.started)) + (n.running > 0 ? 2 : 0),
-    client: Math.min(textWidth(s?.client ?? first?.client ?? ""), 24) + (first?.peer ? 2 : 0),
-    model: names(n.models),
+    client: capped(textWidth(s?.client ?? first?.client ?? ""), NAME_PX.client, first?.peer ? 18 : 0) + (first?.peer ? 3 : 0),
+    model: capped(names(n.models), NAME_PX.model),
     upstream,
     upstreamMin: upstream,
     latency: textWidth(dur(n.ended - n.started)),
@@ -267,10 +269,12 @@ export function sessionWidths(g: Group, t: Text): Widths {
  * 组头里的一串名字（模型、上游）。**决定列宽的只有第一项。**
  *
  * 一次任务用过三个模型、走过四个上游很常见，连起来写有两三百像素 ——
- * 让它撑列宽，费用就被挤出视野。所以第一项完整显示（和请求行的模型
- * 一样最多 13rem）；分隔符和其余的那段宽度记作 0（`w-0 flex-1`），这一列
- * 有多宽就显示多少，最少留出一个省略号：窄的时候是「claude-sonnet-5…」，
- * 宽的时候整串都在。悬停看全。
+ * 让它撑列宽，费用就被挤出视野。所以第一项完整显示；分隔符和其余的那段
+ * 宽度记作 0（`w-0 flex-1`），这一列有多宽就显示多少，最少留出一个省略号：
+ * 窄的时候是「claude-sonnet-5…」，宽的时候整串都在。截断了的悬停看全。
+ *
+ * **整块和请求行同一个上限**（`max`，或者外面那一块的，见 `NAME_PX`）：第一项
+ * 本身就超长时，它让出最后那个省略号的位置，组头不比请求行宽。
  *
  * **分隔符跟着后面那段，不跟着第一项。**跟着第一项的话，第一个模型正好是
  * 全表最长的那个时，组头比请求行宽出一个分隔符，归组之后整张表被撑出视野。
@@ -278,13 +282,13 @@ export function sessionWidths(g: Group, t: Text): Widths {
  * `whitespace-pre` 是为了留住「 · 」两边的空格 —— 两段各是一个块，
  * 行尾和行首的空格会被吞掉。
  */
-function Names({ items, sep }: { items: string[]; sep: string }) {
+function Names({ items, sep, max }: { items: string[]; sep: string; max?: number }) {
   const [first, ...rest] = items;
   if (first === undefined) return null;
   return (
-    <Tip lazy text={items.join(sep)}>
-      <div className="flex min-w-0 flex-1">
-        <span className="max-w-[13rem] shrink-0 overflow-hidden text-ellipsis whitespace-pre">{first}</span>
+    <Tip clip text={items.join(sep)}>
+      <div className="flex min-w-0 flex-1" style={max === undefined ? undefined : { maxWidth: max }}>
+        <span className="min-w-0 overflow-hidden text-ellipsis whitespace-pre">{first}</span>
         {rest.length > 0 && (
           <span className="w-0 min-w-3 flex-1 overflow-hidden text-ellipsis whitespace-pre">
             {sep + rest.join(sep)}
diff --git a/src/traffic/cells.tsx b/src/traffic/cells.tsx
index 5f5695e6..a6c8bf93 100644
--- a/src/traffic/cells.tsx
+++ b/src/traffic/cells.tsx
@@ -10,6 +10,7 @@ import { ClientLogo } from "@/ui/logos";
 import { Tip } from "@/ui/tip";
 import { coreNow, onTick, stopwatch } from "./clock";
 import { trafficText } from "./Traffic.i18n";
+import { NAME_PX } from "./virtual";
 
 /**
  * 请求行和组头共用的几样：行的底色、压暗的格子、密钥那一格、悬停里的几行字、复制、
@@ -40,6 +41,9 @@ export const MENU_REVEAL =
  *
  * `hints`：表里有哪一行带着推测出的应用。有的话没有应用的行也留出标志的位置，
  * 名字才对得齐。
+ *
+ * **整块封顶**（`NAME_PX`）：名字再长也只截断名字，标志和来源记号留着；悬停第一行就是
+ * 完整的名字（连同打码的值）。
  */
 export function KeyCell({
   client,
@@ -62,7 +66,7 @@ export function KeyCell({
   ];
   return (
     <Tip lazy text={<Lines lines={tip} />}>
-      <span className="flex max-w-40 items-center gap-1.5">
+      <span className="flex items-center gap-1.5" style={{ maxWidth: NAME_PX.client }}>
         {hints &&
           (hint ? (
             <ClientLogo id={hint} name={appLabel(hint)} className="opacity-70" />
diff --git a/src/traffic/drawer/RequestDrawer.tsx b/src/traffic/drawer/RequestDrawer.tsx
index 6fa7d74c..9869a7d4 100644
--- a/src/traffic/drawer/RequestDrawer.tsx
+++ b/src/traffic/drawer/RequestDrawer.tsx
@@ -11,7 +11,8 @@ import { Skeleton } from "@/ui/skeleton";
 import { ErrorState } from "@/ui/states";
 import { StatusLabel, type StatusTone } from "@/ui/status-dot";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/ui/tabs";
-import { KeyLabel } from "@/KeyLabel";
+import { Tip } from "@/ui/tip";
+import { KeyLabel, keyText } from "@/KeyLabel";
 import { notSentText, probeLabel } from "@/labels";
 import { notSent } from "@/requestRouting";
 import type { CoreEvent, HistoryRow, RequestDetail } from "@/types";
@@ -188,13 +189,18 @@ function Detail({ id, onClose }: { id: number; onClose: () => void }) {
           (r.local || r.provider) && (
             <span className="inline-flex min-w-0 items-center gap-1.5">
               {!r.local && <UpstreamLogo name={r.provider} className="opacity-70" />}
-              <span className="truncate">{r.local ? t.answeredLocally : r.provider}</span>
+              {/* 名字太长时截断（这一行宽不过浮层），悬停看全 */}
+              <Tip clip text={r.local ? t.answeredLocally : r.provider}>
+                <span className="truncate">{r.local ? t.answeredLocally : r.provider}</span>
+              </Tip>
             </span>
           )
         )}
-        <span className="min-w-0 truncate">
-          <KeyLabel name={r.client} masked={r.key_masked} />
-        </span>
+        <Tip clip text={keyText(r.client, r.key_masked)}>
+          <span className="min-w-0 truncate">
+            <KeyLabel name={r.client} masked={r.key_masked} />
+          </span>
+        </Tip>
       </PanelHeader>
 
       <div className="min-h-0 flex-1 overflow-y-auto px-4 pt-4 pb-6 tw-body">
diff --git a/src/traffic/virtual.test.ts b/src/traffic/virtual.test.ts
index b8a5fd41..627de2a7 100644
--- a/src/traffic/virtual.test.ts
+++ b/src/traffic/virtual.test.ts
@@ -1,7 +1,7 @@
 import { describe, expect, it } from "vitest";
 import type { RequestRow } from "@/types";
 import { lines, type Group } from "./grouping";
-import { indexAt, itemsOf, offsetsOf, textWidth, widest } from "./virtual";
+import { capped, indexAt, itemsOf, NAME_PX, offsetsOf, textWidth, widest } from "./virtual";
 
 const row = (id: number, atMs: number, session?: string): RequestRow => ({
   id,
@@ -83,3 +83,35 @@ describe("最宽的几项", () => {
     expect(textWidth("3 轮")).toBe(4);
   });
 });
+
+describe("名字封顶", () => {
+  it("没到上限的照字数算，超过的按上限算：上限是像素，一格约 6.5px，宁可估宽", () => {
+    expect(capped(textWidth("claude-sonnet-5"), NAME_PX.model)).toBe(15);
+    expect(capped(400, NAME_PX.model)).toBe(32);
+    expect(capped(textWidth("公司内部的 Claude 中转（北京机房备用线路二号）"), NAME_PX.upstream, 22)).toBe(22);
+    // 旁边的标志、记号占掉的那截从上限里扣
+    expect(capped(400, 160, 18)).toBe(22);
+    expect(capped(400, 160)).toBe(25);
+  });
+
+  it("常见的名字不截断：估宽在上限以内", () => {
+    for (const m of ["claude-sonnet-4-5-20250929", "qwen3-coder-480b-a35b-instruct", "gpt-5.1-codex-max"])
+      expect(capped(textWidth(m), NAME_PX.model)).toBe(textWidth(m));
+    for (const u of ["bedrock-us-east-1", "azure-openai-eastus2", "阿里云百炼"])
+      expect(capped(textWidth(u), NAME_PX.upstream, 22)).toBe(textWidth(u));
+  });
+
+  it("挑表头里垫哪几格时，一个短名字带着一排徽标胜过三个超长的名字", () => {
+    // 上游那一格 = 名字（封顶）+ 徽标。三个超长名字、没有徽标；一个短名字带两枚徽标
+    const rows = [
+      { name: "x".repeat(60), badges: 0 },
+      { name: "y".repeat(80), badges: 0 },
+      { name: "z".repeat(70), badges: 0 },
+      { name: "openrouter", badges: 2 },
+    ];
+    const w = (i: number) => capped(textWidth(rows[i]!.name), NAME_PX.upstream, 22) + rows[i]!.badges * 10;
+    expect(widest(rows.length, 3, w)[0]).toBe(3);
+    // 不封顶的话它根本挑不进去
+    expect(widest(rows.length, 3, (i) => textWidth(rows[i]!.name) + rows[i]!.badges * 10)).not.toContain(3);
+  });
+});
diff --git a/src/traffic/virtual.ts b/src/traffic/virtual.ts
index 8bd818a0..67565728 100644
--- a/src/traffic/virtual.ts
+++ b/src/traffic/virtual.ts
@@ -99,3 +99,33 @@ export function textWidth(s: string): number {
   for (const ch of s) n += ch.codePointAt(0)! >= 0x2e80 ? 2 : 1;
   return n;
 }
+
+/**
+ * 写名字的三列一格最多多宽（像素，不含格子的内边距）。**再长的截断，悬停看全**：名字是
+ * 用户起的、上游给的，一个长名字不能把整张表撑宽 —— 默认窗口下常见的名字刚好放满，多出
+ * 来的每一像素都把最右边的费用往视野外推。
+ *
+ * 按 13px 正文量过常见的名字定的：
+ * - 模型 208（13rem）：日常的模型名都在 190 以内（`claude-sonnet-4-5-20250929` 186），带
+ *   厂商前缀、日期的长名（`deepseek-ai/DeepSeek-V3.1-Terminus` 231、Bedrock 的推理配置
+ *   300 上下）截断。
+ * - 上游 160（10rem）：标志 16 + 间距 6 + 名字 138。常见的上游名在 100 以内，带区域、
+ *   用途的（`bedrock-us-east-1` 113、`azure-openai-eastus2` 134）也放得下。
+ * - 密钥 160（10rem）：应用的标志、名字、来源记号一共。密钥名通常在 100 以内。
+ */
+export const NAME_PX = { model: 208, upstream: 160, client: 160 } as const;
+
+/** `textWidth` 的一格大约多宽：13px 的正文里一个中文字是两格 */
+const UNIT_PX = 6.5;
+
+/**
+ * 限宽的那一块里的字大约占几个字宽（`textWidth` 估的 `n`）：超过上限的按上限算 —— 画出来
+ * 就是那么宽。`beside` 是同一块里字旁边还有多宽（标志、间距），像素。
+ *
+ * **只用来挑表头里垫哪几格**（见 `widest`）：不封顶的话，挑出来的会是三个超长的名字，
+ * 画出来都只有上限那么宽，而真正最宽的那一格（一个短名字带着一排徽标）没垫进去，滚到
+ * 它时列宽跳一下。上限宁可估宽一点：比上限还长的那些画出来一样宽，挑哪个都一样。
+ */
+export function capped(n: number, maxPx: number, beside = 0): number {
+  return Math.min(n, Math.ceil((maxPx - beside) / UNIT_PX));
+}
diff --git a/src/ui/row-menu.test.ts b/src/ui/row-menu.test.ts
new file mode 100644
index 00000000..596805ae
--- /dev/null
+++ b/src/ui/row-menu.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, it } from "vitest";
+import { nameIn } from "./row-menu";
+
+describe("菜单条目里的名字", () => {
+  it("拆成名字前、名字、名字后：只截断名字，动词留着", () => {
+    expect(nameIn("仅显示上游 公司内部的 Claude 中转", "公司内部的 Claude 中转")).toEqual(["仅显示上游 ", "公司内部的 Claude 中转", ""]);
+    expect(nameIn("Show only key ci-pipeline", "ci-pipeline")).toEqual(["Show only key ", "ci-pipeline", ""]);
+    expect(nameIn("Requests of ci (last 24 h)", "ci")).toEqual(["Requests of ", "ci", " (last 24 h)"]);
+  });
+
+  it("没给名字、字里找不到它：不拆，原样写整句", () => {
+    expect(nameIn("复制 ID")).toBe(null);
+    expect(nameIn("复制 ID", "")).toBe(null);
+    expect(nameIn("仅显示上游 relay", "openrouter")).toBe(null);
+  });
+});
diff --git a/src/ui/row-menu.tsx b/src/ui/row-menu.tsx
index af16c53f..79c7122a 100644
--- a/src/ui/row-menu.tsx
+++ b/src/ui/row-menu.tsx
@@ -25,6 +25,7 @@ import {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
 } from "@/ui/dropdown-menu";
+import { Tip } from "@/ui/tip";
 
 /** 子菜单里的一项：单选的那种，当前选中的打勾 */
 export interface MenuChoice {
@@ -33,10 +34,15 @@ export interface MenuChoice {
   onSelect: () => void;
 }
 
-/** 一份菜单：条目、子菜单或分隔线。**右键和行尾按钮共用同一份** */
+/**
+ * 一份菜单：条目、子菜单或分隔线。**右键和行尾按钮共用同一份**
+ *
+ * `name`：条目里带着的那个名字（「仅显示上游 X」的 X，`label` 里原样有它）。名字是用户
+ * 起的，可以很长：只截断名字，前后的字留着，菜单不被撑宽；截断了悬停看全。
+ */
 export type MenuItems = (
   | { kind: "sep" }
-  | { kind: "item"; label: string; onSelect: () => void; danger?: boolean; disabled?: boolean }
+  | { kind: "item"; label: string; name?: string; onSelect: () => void; danger?: boolean; disabled?: boolean }
   | { kind: "sub"; label: string; choices: MenuChoice[] }
 )[];
 
@@ -113,7 +119,7 @@ export function RowContextMenuContent({ items }: { items: MenuItems }) {
               disabled={it.disabled}
               variant={it.danger ? "destructive" : "default"}
             >
-              {it.label}
+              <MenuLabel label={it.label} name={it.name} />
             </ContextMenuItem>
           ),
         )}
@@ -151,7 +157,7 @@ export function RowDropdownMenuContent({
               disabled={it.disabled}
               variant={it.danger ? "destructive" : "default"}
             >
-              {it.label}
+              <MenuLabel label={it.label} name={it.name} />
             </DropdownMenuItem>
           ),
         )}
@@ -159,3 +165,34 @@ export function RowDropdownMenuContent({
     </DropdownMenuContent>
   );
 }
+
+/** 条目里的名字最宽多宽：常见的上游、密钥名都在 150 以内，再长的截断 */
+const NAME_MAX_PX = 192;
+
+/**
+ * 一个条目的字。带着名字的，名字单独封顶（`NAME_MAX_PX`）、截断了悬停看全；前后的字
+ * 不截，「仅显示上游」一直看得见。整句还在格子里（读屏、按首字母跳都按整句）。
+ */
+function MenuLabel({ label, name }: { label: string; name?: string }) {
+  const parts = nameIn(label, name);
+  if (!parts) return <>{label}</>;
+  const [before, n, after] = parts;
+  return (
+    <span className="flex min-w-0">
+      <span className="shrink-0 whitespace-pre">{before}</span>
+      <Tip clip text={n}>
+        <span className="min-w-0 truncate" style={{ maxWidth: NAME_MAX_PX }}>
+          {n}
+        </span>
+      </Tip>
+      <span className="shrink-0 whitespace-pre">{after}</span>
+    </span>
+  );
+}
+
+/** 条目的字拆成名字前、名字、名字后。没给名字、字里找不到它：不拆 */
+export function nameIn(label: string, name?: string): [string, string, string] | null {
+  const at = name ? label.indexOf(name) : -1;
+  if (!name || at < 0) return null;
+  return [label.slice(0, at), name, label.slice(at + name.length)];
+}
diff --git a/src/ui/tip.test.ts b/src/ui/tip.test.ts
new file mode 100644
index 00000000..8520449d
--- /dev/null
+++ b/src/ui/tip.test.ts
@@ -0,0 +1,25 @@
+import { describe, expect, it } from "vitest";
+import { clipped } from "./tip";
+
+/** 量得出宽度的一块：`scrollWidth` 是字要多宽，`clientWidth` 是给了多宽 */
+const box = (scrollWidth: number, clientWidth: number, children: Element[] = []): Element =>
+  ({ scrollWidth, clientWidth, querySelectorAll: () => children }) as unknown as Element;
+
+describe("截没截断", () => {
+  it("这一块放不下自己的字", () => {
+    expect(clipped(box(320, 208))).toBe(true);
+    expect(clipped(box(186, 208))).toBe(false);
+    expect(clipped(box(208, 208))).toBe(false);
+  });
+
+  it("这一块放得下，里面有一段被截了（组头那一串名字：第一项截断，或者其余那段）", () => {
+    expect(clipped(box(208, 208, [box(300, 196), box(12, 12)]))).toBe(true);
+    expect(clipped(box(208, 208, [box(80, 80), box(140, 12)]))).toBe(true);
+    expect(clipped(box(208, 208, [box(80, 80), box(60, 128)]))).toBe(false);
+  });
+
+  it("行内元素、还没挂上的量不出宽度，记作放得下", () => {
+    expect(clipped(box(0, 0))).toBe(false);
+    expect(clipped(null)).toBe(false);
+  });
+});
diff --git a/src/ui/tip.tsx b/src/ui/tip.tsx
index e339235c..dc076792 100644
--- a/src/ui/tip.tsx
+++ b/src/ui/tip.tsx
@@ -1,4 +1,4 @@
-import { useState, type ReactNode } from "react";
+import { useRef, useState, type PointerEvent, type ReactNode } from "react";
 import { Slot } from "radix-ui";
 import {
   Tooltip,
@@ -24,31 +24,55 @@ import {
  * 的地方用**（流量表每一格里的字）：每个 Tooltip 自带一套状态、定位和事件，一行五
  * 六个、几十行一起挂，切页和滚动都要多花一截。挂上的那一下子元素会重新挂一次，
  * 所以只给不能交互的子元素用 —— 按钮在按下的半途被换掉，这一下点击就丢了。
+ *
+ * `clip`：**只在字被截断时才出来**，给截断的名字用（`truncate` 的那一块，或者它里面的
+ * 哪一段）。没截断时气泡里的字和格子里一模一样，鼠标扫过一列就是一路白弹。截没截断在
+ * 悬停的那一下量（`clipped`），窗口变宽、变窄都跟着；含 `lazy`。长名字里常常没有可以
+ * 折行的地方，气泡里在任意处折。
  */
 export function Tip({
   text,
   children,
   side = "top",
   lazy = false,
+  clip = false,
 }: {
   text: ReactNode;
   children: ReactNode;
   side?: "top" | "right" | "bottom" | "left";
   lazy?: boolean;
+  clip?: boolean;
 }) {
-  const [armed, setArmed] = useState(!lazy);
+  const [armed, setArmed] = useState(!lazy && !clip);
+  const [open, setOpen] = useState(false);
+  // 触发的那一块（`asChild`，不一定是按钮）：量它截没截断
+  const trigger = useRef<Element | null>(null);
   // 挂上之后要再动一下鼠标才开始计时（Tooltip 按 pointermove 起算），移进来时鼠标本来就在动
-  if (!armed) return <Slot.Root onPointerEnter={() => setArmed(true)}>{children}</Slot.Root>;
+  if (!armed) {
+    const arm = (e: PointerEvent) => {
+      if (!clip || clipped(e.currentTarget)) setArmed(true);
+    };
+    return <Slot.Root onPointerEnter={arm}>{children}</Slot.Root>;
+  }
   return (
-    <Tooltip>
-      <TooltipTrigger asChild>{children}</TooltipTrigger>
-      <TooltipContent side={side} collisionPadding={8}>
+    <Tooltip {...(clip && { open, onOpenChange: (o: boolean) => setOpen(o && clipped(trigger.current)) })}>
+      <TooltipTrigger asChild ref={(el) => void (trigger.current = el)}>
+        {children}
+      </TooltipTrigger>
+      <TooltipContent side={side} collisionPadding={8} className={clip ? "wrap-anywhere" : undefined}>
         {text}
       </TooltipContent>
     </Tooltip>
   );
 }
 
+/** 这一块、或者它里面的哪一块放不下自己的字（`truncate` 截掉了一截）。行内元素量不出宽度，记作放得下 */
+export function clipped(el: Element | null): boolean {
+  if (!el) return false;
+  const cut = (x: Element) => x.scrollWidth > x.clientWidth;
+  return cut(el) || Array.from(el.querySelectorAll("*")).some(cut);
+}
+
 /**
  * 挂在应用根上。
  *