diff --git a/apps/web/src/components/ai-sidebar/AiSidebar.tsx b/apps/web/src/components/ai-sidebar/AiSidebar.tsx
index 655ca938..5252b12b 100644
--- a/apps/web/src/components/ai-sidebar/AiSidebar.tsx
+++ b/apps/web/src/components/ai-sidebar/AiSidebar.tsx
@@ -1563,9 +1563,12 @@ function AiSidebarSession({
               </Message>
               <Message from="assistant">
                 {turn.process?.trim() ? (
-                  <Reasoning isStreaming={turn.status === "running"}>
-                    <ReasoningTrigger getThinkingMessage={() => t("companion.process")} />
-                    <ReasoningContent>{turn.process}</ReasoningContent>
+                  <Reasoning isStreaming={turn.status === "running"} className="mb-2">
+                    <ReasoningTrigger
+                      className="-ml-1 min-h-7 w-fit gap-1.5 rounded-sm px-1 py-1 text-xs leading-4 text-slate-500 hover:text-slate-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-400 [&_svg]:size-3"
+                      getThinkingMessage={() => t("companion.process")}
+                    />
+                    <ReasoningContent className="mt-2 text-xs leading-5">{turn.process}</ReasoningContent>
                   </Reasoning>
                 ) : turn.status === "running" ? (
                   <p role="status" className="flex items-center gap-2 text-xs text-slate-500">
diff --git a/apps/web/src/components/ai-sidebar/AiSidebarLocalProcess.tsx b/apps/web/src/components/ai-sidebar/AiSidebarLocalProcess.tsx
index 856d0ac0..4398e2b5 100644
--- a/apps/web/src/components/ai-sidebar/AiSidebarLocalProcess.tsx
+++ b/apps/web/src/components/ai-sidebar/AiSidebarLocalProcess.tsx
@@ -35,7 +35,7 @@ export function AiSidebarLocalProcess({ reasoning, tools, running }: { reasoning
   return (
     <Reasoning isStreaming={running} defaultOpen={false} className="mb-2">
       <ReasoningTrigger
-        className="w-auto py-1 text-xs text-slate-500 hover:text-slate-800 [&_svg]:size-3.5"
+        className="-ml-1 min-h-7 w-fit gap-1.5 rounded-sm px-1 py-1 text-xs leading-4 text-slate-500 hover:text-slate-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-400 [&_svg]:size-3"
         getThinkingMessage={() => (
           <span className="flex items-center gap-1.5">
             {t("companion.process")}