@steerable/agent-shell-web 0.6.27 → 0.6.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@steerable/agent-shell-web",
-  "version": "0.6.27",
+  "version": "0.6.29",
   "type": "module",
   "description": "Steerable framework — product-neutral renderer SPA source for @steerable/agent-shell (React + Vite). Consumed by product web entry points via the `@/` alias (anchored at this package's src/) and the createProductViteConfig factory. Published as a source package (src/), plus the compiled vite.base config factory (vite.base.js + .d.ts) for Node-side config loading.",
   "license": "Apache-2.0",
@@ -46,8 +46,8 @@
     "react-router-dom": "^6.30.0",
     "rehype-raw": "^7.0.0",
     "remark-gfm": "^4.0.1",
-    "@steerable/agent-protocol": "0.6.27",
-    "@steerable/agent-ui": "0.6.27"
+    "@steerable/agent-ui": "0.6.29",
+    "@steerable/agent-protocol": "0.6.29"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.3.0",
@@ -60,7 +60,7 @@
     "typescript": "^5.8.3",
     "vite": "^5.4.21",
     "vitest": "^3.2.4",
-    "@steerable/pack-sdk": "0.6.27"
+    "@steerable/pack-sdk": "0.6.29"
   },
   "scripts": {
     "gen": "echo agent-shell-web",

package/src/components/AgentSidebar.tsx

@@ -477,7 +477,7 @@ export function AgentSidebar({
             navigate(`/agent/${chat.id}`);
           }}
           className={[
-            'flex h-8 w-full min-w-0 items-center gap-1.5 rounded-full px-3 text-sm transition-colors duration-200',
+            'flex h-7 w-full min-w-0 items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors duration-200',
             isCurrent
               ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
               : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -620,8 +620,8 @@ export function AgentSidebar({
   return (
     <div className="flex h-full w-full flex-col border-r border-agent-border/60 bg-agent-muted/70 backdrop-blur-md">
       {/* ───── Brand + actions ───── */}
-      <div className="flex h-12 flex-shrink-0 items-center justify-between px-3">
-        <BrandLockup />
+      <div className="flex h-9 flex-shrink-0 items-center justify-between px-2.5">
+        <BrandLockup onClick={() => handleOpenNewChat()} />
         <div className="flex items-center gap-1">
           <button
             type="button"
@@ -638,12 +638,12 @@ export function AgentSidebar({
       {/* ───── 会话 ───── */}
       <div className="flex min-h-0 flex-1 flex-col overflow-hidden">
         {/* 新对话 + 智能体 / Skill / MCP 设置入口 — 横版行按钮，各自打开独立设置页 */}
-        <div className="flex-shrink-0 space-y-0.5 px-3 pb-0.5">
+        <div className="flex-shrink-0 space-y-0.5 px-2.5 pb-0.5">
           <button
             type="button"
             onClick={() => handleOpenNewChat()}
             className={[
-              'flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
               onNewChatHome
                 ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
                 : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -651,14 +651,14 @@ export function AgentSidebar({
             title="新建对话"
             data-testid="sidebar-new-chat"
           >
-            <LuPlus className="h-4 w-4" />
+            <LuPlus className="h-3.5 w-3.5" />
             <span>新对话</span>
           </button>
           <button
             type="button"
             onClick={() => navigate('/settings?section=agents')}
             className={[
-              'flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
               onSettingsPage && settingsSection === 'agents'
                 ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
                 : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -666,14 +666,14 @@ export function AgentSidebar({
             title="智能体管理"
             data-testid="sidebar-agent-settings"
           >
-            <LuBot className="h-4 w-4" />
+            <LuBot className="h-3.5 w-3.5" />
             <span>智能体管理</span>
           </button>
           <button
             type="button"
             onClick={() => navigate('/settings?section=skills')}
             className={[
-              'flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
               onSettingsPage && settingsSection === 'skills'
                 ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
                 : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -681,14 +681,14 @@ export function AgentSidebar({
             title="Skill 设置"
             data-testid="sidebar-skill-settings"
           >
-            <LuBlocks className="h-4 w-4" />
+            <LuBlocks className="h-3.5 w-3.5" />
             <span>Skill 设置</span>
           </button>
           <button
             type="button"
             onClick={() => navigate('/settings?section=mcp')}
             className={[
-              'flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
               onSettingsPage && settingsSection === 'mcp'
                 ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
                 : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -696,15 +696,15 @@ export function AgentSidebar({
             title="MCP 设置"
             data-testid="sidebar-mcp-settings"
           >
-            <LuPlug className="h-4 w-4" />
+            <LuPlug className="h-3.5 w-3.5" />
             <span>MCP 设置</span>
           </button>
         </div>
-        <div className="flex flex-shrink-0 items-center justify-between py-1.5 pl-4 pr-3">
+        <div className="flex flex-shrink-0 items-center justify-between py-1 pl-2.5 pr-2.5">
           <button
             type="button"
             onClick={() => setChatsExpanded((v) => !v)}
-            className="flex items-center text-xs font-semibold tracking-wider text-agent-muted-foreground transition-colors hover:text-agent-foreground"
+            className="flex h-6 items-center rounded-full px-2.5 text-xs font-semibold tracking-wider text-agent-muted-foreground transition-colors hover:bg-agent-foreground/5 hover:text-agent-foreground"
           >
             <span className="mr-1">
               {chatsExpanded ? (
@@ -739,7 +739,7 @@ export function AgentSidebar({
         {chatsExpanded && (
           <div
             ref={chatScrollRef}
-            className="flex-1 overflow-y-auto px-2 pb-1"
+            className="flex-1 overflow-y-auto px-2.5 pb-1"
           >
             {isChatLoading && chats.length === 0 && projects.length === 0 ? (
               <div className="flex items-center justify-center py-4 text-xs text-agent-muted-foreground">
@@ -747,7 +747,7 @@ export function AgentSidebar({
                 加载中...
               </div>
             ) : chatGroups.length === 0 && projectGroups.length === 0 ? (
-              <div className="flex flex-col items-center gap-1.5 py-6 text-xs text-agent-muted-foreground">
+              <div className="flex flex-col items-center gap-1.5 py-4 text-xs text-agent-muted-foreground">
                 <LuMessageSquare className="h-4 w-4 text-agent-muted-foreground/60" />
                 暂无会话
               </div>
@@ -759,7 +759,7 @@ export function AgentSidebar({
                     <div className="group/proj relative">
                       {renamingProjectId === project.id ? (
                         <form
-                          className="flex items-center px-3 pb-1 pt-2"
+                          className="flex items-center px-2.5 pb-1 pt-1.5"
                           onSubmit={(event) => {
                             event.preventDefault();
                             void handleRenameProject(project.id);
@@ -781,7 +781,7 @@ export function AgentSidebar({
                           <button
                             type="button"
                             onClick={() => toggleProjectCollapsed(project.id)}
-                            className="flex w-full min-w-0 items-center px-3 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wider text-agent-muted-foreground/80 transition-colors hover:text-agent-foreground"
+                            className="flex w-full min-w-0 items-center px-2.5 pb-0.5 pt-1.5 text-[10px] font-medium uppercase tracking-wider text-agent-muted-foreground/80 transition-colors hover:text-agent-foreground"
                             title={`${project.name}\n${project.folderPath}`}
                           >
                             <span className="mr-1">
@@ -856,7 +856,7 @@ export function AgentSidebar({
                     {!collapsedProjectIds.has(project.id) && (
                       <div className="space-y-0.5">
                         {items.length === 0 ? (
-                          <div className="px-3 py-1 text-[11px] text-agent-muted-foreground/60">
+                          <div className="px-2.5 py-0.5 text-[11px] text-agent-muted-foreground/60">
                             暂无会话 — hover 项目名点 + 新建
                           </div>
                         ) : (
@@ -869,7 +869,7 @@ export function AgentSidebar({
                 {/* 无项目对话排在项目分组之后：保持原有日期分组 */}
                 {chatGroups.map((group) => (
                   <div key={group.label} className="mb-1">
-                    <div className="px-3 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wider text-agent-muted-foreground/80">
+                    <div className="px-2.5 pb-0.5 pt-1.5 text-[10px] font-medium uppercase tracking-wider text-agent-muted-foreground/80">
                       {group.label}
                     </div>
                     <div className="space-y-0.5">
@@ -899,7 +899,7 @@ export function AgentSidebar({
 
       {(error || projectError) && (
         <div
-          className="flex-shrink-0 border-t border-agent-destructive/40 bg-agent-destructive/10 px-3 py-2 text-[11px] text-agent-destructive"
+          className="flex-shrink-0 border-t border-agent-destructive/40 bg-agent-destructive/10 px-2.5 py-1.5 text-[11px] text-agent-destructive"
           role="alert"
         >
           {error ?? projectError}
@@ -907,13 +907,13 @@ export function AgentSidebar({
       )}
 
       {/* ───── Footer: 右侧面板切换（终端 | 包槽位）+ 设置 ───── */}
-      <div className="flex-shrink-0 border-t border-agent-border/40 px-3 py-2">
+      <div className="flex-shrink-0 border-t border-agent-border/40 px-2.5 py-1.5">
         {chatSlots.length === 0 ? (
           <button
             type="button"
             onClick={() => onToggleRightPanel('terminal')}
             className={[
-              'flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
               rightPanel === 'terminal'
                 ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
                 : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-foreground',
@@ -921,7 +921,7 @@ export function AgentSidebar({
             title={`${rightPanel === 'terminal' ? '关闭' : '打开'}终端面板 (${isMac ? '⌘T' : 'Ctrl+T'})`}
             data-testid="sidebar-terminal"
           >
-            <LuTerminal className="h-4 w-4" />
+            <LuTerminal className="h-3.5 w-3.5" />
             <span>终端</span>
             <span className="ml-auto text-[10px] text-agent-muted-foreground/70">
               {isMac ? '⌘T' : 'Ctrl+T'}
@@ -931,7 +931,7 @@ export function AgentSidebar({
           <div
             role="group"
             aria-label="右侧面板切换"
-            className="flex h-8 w-full items-center gap-0.5 rounded-full bg-agent-foreground/5 p-0.5"
+            className="flex h-7 w-full items-center gap-0.5 rounded-full bg-agent-foreground/5 p-0.5"
           >
             <button
               type="button"
@@ -972,7 +972,7 @@ export function AgentSidebar({
           type="button"
           onClick={() => navigate('/settings')}
           className={[
-            'mt-0.5 flex h-8 w-full items-center gap-2 rounded-full px-3 text-sm transition-colors',
+            'mt-0.5 flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
             onGeneralSettings
               ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
               : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
@@ -980,7 +980,7 @@ export function AgentSidebar({
           title="设置"
           data-testid="sidebar-llm-settings"
         >
-          <LuSettings className="h-4 w-4" />
+          <LuSettings className="h-3.5 w-3.5" />
           <span>设置</span>
         </button>
       </div>

package/src/components/BrandLockup.tsx

@@ -1,24 +1,40 @@
 import { BRAND_NAME, BRAND_TITLE, getBrandLogoUrl } from '@/brand';
 
+export interface BrandLockupProps {
+  className?: string;
+  onClick?: () => void;
+}
+
 /**
  * 侧栏品牌锁头。配了 brand.title 就 logo + 标题；没配标题则只显示 logo，
  * 并按原图宽高比缩放（一体字标不要压成方图）。
+ * 自带 px-2.5 内边距，与侧边栏下方各功能行、会话行的图标在一条垂直参考线上（left: 20px）精准对齐。
  */
-export function BrandLockup() {
+export function BrandLockup({ className, onClick }: BrandLockupProps = {}) {
   const title = BRAND_TITLE.trim();
   return (
-    <div className="flex min-w-0 items-center gap-2">
+    <div
+      onClick={onClick}
+      className={[
+        'flex min-w-0 items-center gap-2 px-2.5',
+        onClick ? 'cursor-pointer select-none transition-opacity hover:opacity-85' : '',
+        className,
+      ]
+        .filter(Boolean)
+        .join(' ')}
+    >
       <img
         src={getBrandLogoUrl()}
         alt={title || BRAND_NAME}
-        className="h-6 w-auto max-w-[10rem] flex-shrink-0 select-none object-contain object-left"
+        className={`${title ? 'h-5' : 'h-6'} w-auto max-w-[10rem] flex-shrink-0 select-none object-contain object-left`}
         draggable={false}
       />
       {title ? (
-        <span className="truncate text-sm font-semibold tracking-tight text-agent-foreground">
+        <span className="truncate text-xs font-semibold tracking-tight text-agent-foreground leading-none">
           {title}
         </span>
       ) : null}
     </div>
   );
 }
+

package/src/components/ChatHeader.tsx

@@ -127,7 +127,7 @@ export function ChatHeader({
             data-branch-menu
           >
             {!branches || branchCount === 0 ? (
-              <div className="px-3 py-2 text-xs text-agent-muted-foreground">
+              <div className="px-2.5 py-1.5 text-xs text-agent-muted-foreground">
                 暂无分支 — 重新生成回复后，旧版本会保留在这里。
               </div>
             ) : (
@@ -159,7 +159,7 @@ export function ChatHeader({
                       setBranchMenuOpen(false);
                       setTreeModalOpen(true);
                     }}
-                    className="flex w-full items-center gap-2 rounded px-3 py-1.5 text-left text-xs text-agent-muted-foreground transition-colors hover:bg-agent-foreground/5 hover:text-agent-foreground"
+                    className="flex w-full items-center gap-2 rounded px-2.5 py-1 text-left text-xs text-agent-muted-foreground transition-colors hover:bg-agent-foreground/5 hover:text-agent-foreground"
                     data-action="branch-tree"
                   >
                     <LuListTree className="h-3 w-3 shrink-0" />
@@ -174,19 +174,14 @@ export function ChatHeader({
       : null;
 
   return (
-    <header className="flex w-full min-w-0 items-center gap-3 bg-agent-canvas px-3 py-2">
+    <header className="flex w-full min-w-0 items-center gap-2 bg-agent-canvas px-2.5 py-1.5">
       <div className="flex min-w-0 flex-1 flex-wrap items-center gap-x-2 gap-y-0.5">
         <span
-          className="break-words text-sm font-medium text-agent-foreground"
+          className="break-words text-xs font-medium text-agent-foreground"
           title={chat?.title}
         >
           {chat?.title ?? '未选择对话'}
         </span>
-        {chat && (
-          <span className="hidden shrink-0 font-mono text-[10px] text-agent-muted-foreground/70 md:inline">
-            {shortenId(chat.id)}
-          </span>
-        )}
       </div>
       {chat && onBranchSwitched && (
         <div className="shrink-0">
@@ -367,11 +362,6 @@ function taskButtonTitle(
     : `${base} · 点击处理 worktree`;
 }
 
-function shortenId(id: string): string {
-  if (id.length <= 12) return id;
-  return `${id.slice(0, 6)}…${id.slice(-4)}`;
-}
-
 /** Pin the branch menu to the trigger, clamped inside the chat panel so
  *  `overflow-hidden` ancestors cannot clip the left side of a `w-72` sheet. */
 function placeBranchMenu(button: HTMLElement): { top: number; left: number; width: number } {
@@ -403,7 +393,7 @@ function BranchRow({
       onClick={onSelect}
       aria-current={active ? 'true' : undefined}
       aria-disabled={disabled || active || undefined}
-      className={`flex w-full items-center gap-2 rounded px-3 py-1.5 text-left text-xs transition-colors ${
+      className={`flex w-full items-center gap-2 rounded px-2.5 py-1 text-left text-xs transition-colors ${
         active
           ? 'cursor-default bg-agent-foreground/5 font-medium text-agent-foreground'
           : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground'

package/src/components/LocalLlmSettingsModal.tsx

@@ -42,8 +42,8 @@ export function LocalLlmSettingsModal({ open, onClose, onSaved }: LocalLlmSettin
       <div
         className="flex h-[560px] max-h-[90vh] w-[540px] max-w-[92vw] flex-col overflow-hidden rounded-agent-lg border border-agent-border bg-agent-canvas shadow-2xl animate-fade-in"
       >
-        <div className="flex h-12 flex-shrink-0 items-center justify-between border-b border-agent-border px-5">
-          <h2 className="text-sm font-semibold text-agent-foreground">本地模型设置</h2>
+        <div className="flex h-9 flex-shrink-0 items-center justify-between border-b border-agent-border px-3">
+          <h2 className="text-xs font-semibold text-agent-foreground">本地模型设置</h2>
           <button
             type="button"
             onClick={onClose}
@@ -53,14 +53,14 @@ export function LocalLlmSettingsModal({ open, onClose, onSaved }: LocalLlmSettin
             <LuX className="h-4 w-4" />
           </button>
         </div>
-        <div className="flex-1 overflow-y-auto p-5">
+        <div className="flex-1 overflow-y-auto p-3">
           <LlmSettingsPanel onSaved={onSaved} />
         </div>
-        <div className="flex h-12 flex-shrink-0 items-center justify-end border-t border-agent-border px-5 bg-agent-muted/10">
+        <div className="flex h-9 flex-shrink-0 items-center justify-end border-t border-agent-border px-3 bg-agent-muted/10">
           <button
             type="button"
             onClick={onClose}
-            className="h-8 rounded-full px-4 text-xs font-medium text-agent-muted-foreground transition-colors hover:bg-agent-muted hover:text-agent-foreground"
+            className="h-7 rounded-full px-3 text-xs font-medium text-agent-muted-foreground transition-colors hover:bg-agent-muted hover:text-agent-foreground"
           >
             关闭
           </button>

package/src/components/TerminalPanel.tsx

@@ -40,7 +40,7 @@ export function TerminalPanel({
   }
   if (!hasElectron) {
     return (
-      <div className="flex h-full w-full items-center justify-center bg-black p-6 text-center font-mono text-sm text-white">
+      <div className="flex h-full w-full items-center justify-center bg-black p-4 text-center font-mono text-xs text-white">
         <div>
           <p className="mb-2">⚠️ 此面板需要桌面客户端或 BS server 连接。</p>
           <p className="text-white/60">

package/src/components/chat/ApprovalModal.tsx

@@ -106,17 +106,17 @@ export function ApprovalPromptMenu({
 
   return (
     <div
-      className="overflow-hidden rounded-agent-lg border border-agent-border bg-agent-canvas text-sm text-agent-foreground shadow-xl"
+      className="overflow-hidden rounded-agent-lg border border-agent-border bg-agent-canvas text-xs text-agent-foreground shadow-xl"
       data-testid="approval-composer"
     >
-        <div className="flex items-center gap-2 border-b border-agent-border px-4 py-3">
+        <div className="flex items-center gap-2 border-b border-agent-border px-3 py-2">
           {destructive ? (
             <LuTriangleAlert className="h-4 w-4 shrink-0 text-agent-destructive" />
           ) : (
             <LuShieldAlert className="h-4 w-4 shrink-0 text-amber-500" />
           )}
           <div className="min-w-0 flex-1">
-            <div className="text-sm font-medium text-agent-foreground">
+            <div className="text-xs font-medium text-agent-foreground">
               {isEgress ? (
                 <>
                   Agent 请求访问外网
@@ -143,7 +143,7 @@ export function ApprovalPromptMenu({
           </div>
         </div>
 
-        <div className="max-h-48 overflow-auto px-4 py-3">
+        <div className="max-h-48 overflow-auto px-3 py-2">
           <pre className="whitespace-pre-wrap break-all rounded-agent-md bg-agent-muted/50 px-3 py-2 font-mono text-xs text-agent-foreground">
             {summarizeArguments(current.arguments)}
           </pre>
@@ -169,7 +169,7 @@ export function ApprovalPromptMenu({
           )}
         </div>
 
-        <div className="space-y-2 border-t border-agent-border px-4 py-3">
+        <div className="space-y-2 border-t border-agent-border px-3 py-2">
           <DecisionRow
             buttons={
               isEgress

package/src/components/chat/AskUserQuestionMenu.tsx

@@ -120,7 +120,7 @@ function Footer({
   children?: React.ReactNode;
 }) {
   return (
-    <div className="mt-4 flex items-center justify-between gap-3 border-t border-agent-border px-4 py-3">
+    <div className="mt-3 flex items-center justify-between gap-2 border-t border-agent-border px-3 py-2">
       <div className="flex min-w-0 items-center gap-2">
         {canGoBack && onBack && (
           <button
@@ -279,7 +279,7 @@ function SelectQuestionStep({
         role={question.multiSelect ? 'checkbox' : 'radio'}
         aria-checked={active}
         className={[
-          'flex w-full items-center gap-2 rounded-agent-md border px-3 py-2 text-left text-sm transition',
+          'flex w-full items-center gap-2 rounded-agent-md border px-3 py-2 text-left text-xs transition',
           active
             ? 'border-agent-foreground bg-agent-muted text-agent-foreground'
             : 'border-agent-border bg-agent-canvas text-agent-foreground hover:bg-agent-muted',
@@ -335,7 +335,7 @@ function SelectQuestionStep({
         role={question.multiSelect ? 'checkbox' : 'radio'}
         aria-checked={active}
         className={[
-          'flex w-full items-center gap-2 rounded-agent-md border border-dashed px-3 py-2 text-left text-sm transition',
+          'flex w-full items-center gap-2 rounded-agent-md border border-dashed px-3 py-2 text-left text-xs transition',
           active
             ? 'border-agent-foreground bg-agent-muted text-agent-foreground'
             : 'border-agent-border bg-agent-canvas text-agent-muted-foreground hover:bg-agent-muted hover:text-agent-foreground',
@@ -359,13 +359,13 @@ function SelectQuestionStep({
 
   return (
     <div>
-      <div className="space-y-2 px-4 py-3">
+      <div className="space-y-2 px-3 py-2">
         {question.header && (
           <p className="text-[11px] font-medium uppercase tracking-wide text-agent-muted-foreground">
             {question.header}
           </p>
         )}
-        <p className="text-sm font-medium text-agent-foreground">{question.text}</p>
+        <p className="text-xs font-medium text-agent-foreground">{question.text}</p>
         {question.detail && (
           <p className="whitespace-pre-line text-xs text-agent-muted-foreground">
             {question.detail}
@@ -396,7 +396,7 @@ function SelectQuestionStep({
               }
             }}
             placeholder={question.placeholder || '输入你的补充...'}
-            className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-sm text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
+            className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-xs text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
           />
         )}
 
@@ -414,7 +414,7 @@ function SelectQuestionStep({
                 }
               }}
               placeholder={question.placeholder || '输入你的回答...'}
-              className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-sm text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
+              className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-xs text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
             />
             <button
               type="button"
@@ -488,13 +488,13 @@ function TextQuestionStep({
 
   return (
     <div>
-      <div className="space-y-2 px-4 py-3">
+      <div className="space-y-2 px-3 py-2">
         {question.header && (
           <p className="text-[11px] font-medium uppercase tracking-wide text-agent-muted-foreground">
             {question.header}
           </p>
         )}
-        <p className="text-sm font-medium text-agent-foreground">{question.text}</p>
+        <p className="text-xs font-medium text-agent-foreground">{question.text}</p>
         {question.detail && (
           <p className="whitespace-pre-line text-xs text-agent-muted-foreground">
             {question.detail}
@@ -512,7 +512,7 @@ function TextQuestionStep({
             }
           }}
           placeholder={question.placeholder || '输入你的回答...'}
-          className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-sm text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
+          className="w-full rounded-agent-md border border-agent-border bg-agent-canvas px-3 py-2 text-xs text-agent-foreground outline-none placeholder:text-agent-muted-foreground focus:border-agent-foreground focus:ring-1 focus:ring-agent-foreground"
         />
       </div>
 
@@ -577,10 +577,10 @@ export function AskUserQuestionMenu({
   if (!current) return null;
 
   return (
-    <div className="overflow-hidden rounded-agent-lg border border-agent-border bg-agent-canvas text-sm text-agent-foreground shadow-xl">
-      <div className="flex items-start justify-between gap-3 border-b border-agent-border px-4 py-3">
+    <div className="overflow-hidden rounded-agent-lg border border-agent-border bg-agent-canvas text-xs text-agent-foreground shadow-xl">
+      <div className="flex items-start justify-between gap-2 border-b border-agent-border px-3 py-2">
         <div className="min-w-0 flex-1">
-          <p className="text-sm font-medium text-agent-foreground">
+          <p className="text-xs font-medium text-agent-foreground">
             {intro || '需要你的输入'}
           </p>
           <p className="mt-0.5 text-[11px] text-agent-muted-foreground">