fix(webui): tighten interactive motion

webui/src/components/thread/AgentActivityCluster.tsx

@@ -307,7 +307,7 @@ export function AgentActivityCluster({
     }
     if (!wasStreaming || userToggledOuter) return undefined;
     setCompletionHoldOpen(true);
-    const timeout = window.setTimeout(() => setCompletionHoldOpen(false), 900);
+    const timeout = window.setTimeout(() => setCompletionHoldOpen(false), 300);
     return () => window.clearTimeout(timeout);
   }, [isTurnStreaming, userToggledOuter]);
 

webui/src/components/thread/ThreadComposer.tsx

@@ -2226,7 +2226,7 @@ export function ThreadComposer({
             role="alert"
             className={cn(
               "mx-3 mb-1 max-h-10 overflow-hidden rounded-md border border-destructive/40 bg-destructive/8 px-2.5 py-1",
-              "text-[11.5px] font-medium text-destructive transition-[max-height,margin,padding,opacity] duration-500 ease-out",
+              "text-[11.5px] font-medium text-destructive transition-[max-height,margin,padding,opacity] [transition-duration:220ms] ease-out motion-reduce:transition-none",
               voiceErrorFading && "mb-0 max-h-0 border-transparent py-0 opacity-0",
             )}
           >

webui/src/components/thread/ThreadShell.tsx

@@ -1455,7 +1455,7 @@ export function ThreadShell({
       {t("thread.loadingConversation")}
     </div>
   ) : (
-    <div className="flex w-full flex-col items-center text-center animate-in fade-in-0 slide-in-from-bottom-2 duration-500">
+    <div className="flex w-full flex-col items-center text-center animate-in fade-in-0 slide-in-from-bottom-2 [animation-duration:220ms] motion-reduce:animate-none">
       <HeroGreeting text={t(heroGreetingKey)} />
     </div>
   );

webui/src/components/thread/ThreadViewport.tsx

@@ -97,6 +97,11 @@ function isKeyboardEditableElement(element: Element | null): element is HTMLElem
   ].includes(element.type);
 }
 
+function isThreadDisclosureTarget(target: EventTarget | null): boolean {
+  return target instanceof Element
+    && target.closest("[data-thread-disclosure]") !== null;
+}
+
 type ThreadScrollDirection = "backward" | "forward";
 
 const KEYBOARD_SCROLL_DIRECTIONS: Readonly<
@@ -572,7 +577,12 @@ export const ThreadViewport = forwardRef<ThreadViewportHandle, ThreadViewportPro
       handleDirectionalInput(directionFromDelta(event.deltaY));
     };
     const handlePointerDown = (event: PointerEvent) => {
-      if (event.button === 0 && event.target === el) yieldCameraToUser();
+      if (
+        event.button === 0
+        && (event.target === el || isThreadDisclosureTarget(event.target))
+      ) {
+        yieldCameraToUser();
+      }
     };
     let lastTouchY: number | null = null;
     const handleTouchStart = (event: TouchEvent) => {
@@ -600,6 +610,13 @@ export const ThreadViewport = forwardRef<ThreadViewportHandle, ThreadViewportPro
       ) {
         return;
       }
+      if (
+        (event.key === "Enter" || event.key === " ")
+        && isThreadDisclosureTarget(event.target)
+      ) {
+        yieldCameraToUser();
+        return;
+      }
       handleDirectionalInput(keyboardScrollDirection(event));
     };
     el.addEventListener("scroll", handleScroll, { passive: true });

webui/src/components/thread/activity/ReasoningRow.tsx

@@ -41,7 +41,7 @@ function ReasoningMarker({ streaming }: { streaming: boolean }) {
   useEffect(() => {
     if (wasStreamingRef.current && !streaming) {
       setJustCompleted(true);
-      const timeout = window.setTimeout(() => setJustCompleted(false), 650);
+      const timeout = window.setTimeout(() => setJustCompleted(false), 300);
       wasStreamingRef.current = streaming;
       return () => window.clearTimeout(timeout);
     }

webui/src/components/thread/activity/ThinkingReasoningShell.tsx

@@ -35,6 +35,7 @@ export function ThinkingReasoningShell({
     >
       <button
         type="button"
+        data-thread-disclosure=""
         className="group inline-flex min-h-5 items-center self-start gap-1.5 bg-transparent p-0"
         onClick={onToggle}
         aria-expanded={expanded}
@@ -51,8 +52,8 @@ export function ThinkingReasoningShell({
         </span>
         <span
           className={cn(
-            "inline-flex shrink-0 transition-transform [transition-duration:600ms] ease-out",
-            "motion-reduce:[transition-duration:220ms]",
+            "inline-flex shrink-0 transition-transform [transition-duration:220ms] ease-out",
+            "motion-reduce:transition-none",
             expanded && "rotate-180",
           )}
         >
@@ -69,7 +70,7 @@ export function ThinkingReasoningShell({
 
       <div
         className={cn(
-          "grid transition-[grid-template-rows,opacity] [transition-duration:600ms] ease-out motion-reduce:[transition-duration:220ms]",
+          "grid transition-[grid-template-rows,opacity] [transition-duration:220ms] ease-out motion-reduce:transition-none",
           expanded
             ? "grid-rows-[1fr] opacity-100"
             : "pointer-events-none grid-rows-[0fr] opacity-0",