diff --git a/desktop/src/components/chat/AssistantMessage.tsx b/desktop/src/components/chat/AssistantMessage.tsx
index 4bb938aa..f75c9463 100644
--- a/desktop/src/components/chat/AssistantMessage.tsx
+++ b/desktop/src/components/chat/AssistantMessage.tsx
@@ -68,7 +68,7 @@ export const AssistantMessage = memo(function AssistantMessage({ content, isStre
       <div
         data-message-shell="assistant"
         data-layout={documentLayout ? 'document' : 'bubble'}
-        className={`group flex min-w-0 flex-col items-start gap-2 ${
+        className={`group flex min-w-0 flex-col items-start ${
           documentLayout
             ? 'w-full max-w-full'
             : 'max-w-[88%] sm:max-w-[80%] lg:max-w-[72%]'
diff --git a/desktop/src/components/chat/MessageActionBar.tsx b/desktop/src/components/chat/MessageActionBar.tsx
index a0d09102..13c649d1 100644
--- a/desktop/src/components/chat/MessageActionBar.tsx
+++ b/desktop/src/components/chat/MessageActionBar.tsx
@@ -41,7 +41,7 @@ export function MessageActionBar({
     <div
       data-message-actions
       data-align={align}
-      className={`invisible flex w-full opacity-0 transition-opacity duration-150 group-hover:visible group-hover:opacity-100 group-focus-within:visible group-focus-within:opacity-100 ${
+      className={`pointer-events-none mt-0 flex h-0 w-full overflow-hidden opacity-0 transition-[height,margin-top,opacity] duration-150 group-hover:pointer-events-auto group-hover:mt-2 group-hover:h-7 group-hover:opacity-100 group-focus-within:pointer-events-auto group-focus-within:mt-2 group-focus-within:h-7 group-focus-within:opacity-100 ${
         align === 'end' ? 'justify-end' : 'justify-start'
       }`}
     >
diff --git a/desktop/src/components/chat/MessageList.test.tsx b/desktop/src/components/chat/MessageList.test.tsx
index 0b796c15..fa2f865a 100644
--- a/desktop/src/components/chat/MessageList.test.tsx
+++ b/desktop/src/components/chat/MessageList.test.tsx
@@ -2743,8 +2743,9 @@ describe('MessageList nested tool calls', () => {
     expect(assistantShell?.className).not.toContain('ml-10')
     expect(userActions?.getAttribute('data-align')).toBe('end')
     expect(assistantActions?.getAttribute('data-align')).toBe('start')
-    expect(userActions?.className).toContain('invisible')
-    expect(userActions?.className).toContain('group-hover:visible')
+    expect(userActions?.className).toContain('h-0')
+    expect(userActions?.className).toContain('group-hover:h-7')
+    expect(userActions?.className).not.toContain('invisible')
     expect(within(userActions as HTMLElement).getByText('5m ago')).toBeTruthy()
     expect(within(assistantActions as HTMLElement).getByText('2h ago')).toBeTruthy()
   })
diff --git a/desktop/src/components/chat/UserMessage.tsx b/desktop/src/components/chat/UserMessage.tsx
index 6aa0576d..0076bd29 100644
--- a/desktop/src/components/chat/UserMessage.tsx
+++ b/desktop/src/components/chat/UserMessage.tsx
@@ -17,24 +17,26 @@ export const UserMessage = memo(function UserMessage({ content, attachments, bra
     <div className="mb-5 flex justify-end">
       <div
         data-message-shell="user"
-        className="group flex min-w-0 max-w-[82%] flex-col items-end gap-2 sm:max-w-[78%] lg:max-w-[72%]"
+        className="group flex min-w-0 max-w-[82%] flex-col items-end sm:max-w-[78%] lg:max-w-[72%]"
       >
-        {attachments && attachments.length > 0 && (
-          <AttachmentGallery attachments={attachments} variant="message" />
-        )}
+        <div className="flex max-w-full flex-col items-end gap-2">
+          {attachments && attachments.length > 0 && (
+            <AttachmentGallery attachments={attachments} variant="message" />
+          )}
 
-        {hasText && (
-          <div
-            className="min-w-0 max-w-full bg-[var(--color-surface-user-msg)] px-4 py-3 text-sm leading-relaxed text-[var(--color-text-primary)] whitespace-pre-wrap break-words"
-            style={{
-              borderRadius: '18px 4px 18px 18px',
-              overflowWrap: 'anywhere',
-              wordBreak: 'break-word',
-            }}
-          >
-            {content}
-          </div>
-        )}
+          {hasText && (
+            <div
+              className="min-w-0 max-w-full bg-[var(--color-surface-user-msg)] px-4 py-3 text-sm leading-relaxed text-[var(--color-text-primary)] whitespace-pre-wrap break-words"
+              style={{
+                borderRadius: '18px 4px 18px 18px',
+                overflowWrap: 'anywhere',
+                wordBreak: 'break-word',
+              }}
+            >
+              {content}
+            </div>
+          )}
+        </div>
 
         {hasText && (
           <MessageActionBar