diff --git a/client/src/components/Chat/Input/ChatForm.tsx b/client/src/components/Chat/Input/ChatForm.tsx
index 3e6acabdb3c..42c232efd2f 100644
--- a/client/src/components/Chat/Input/ChatForm.tsx
+++ b/client/src/components/Chat/Input/ChatForm.tsx
@@ -860,7 +860,10 @@ const ChatForm = memo(function ChatForm({
                    a warning rather than a quiet mode hint. The contrast modes take
                    it opaque, because that is the only way it clears the 3:1
                    non-text floor there. */
-                isTemporary && 'border-series-6/50 bg-series-6/10 high-contrast:border-series-6',
+                /** The tint layers over the opaque chat surface instead of replacing it, so the
+                 *  context rail tucked under the composer never shows through. */
+                isTemporary &&
+                  'border-series-6/50 from-series-6/10 to-series-6/10 high-contrast:border-series-6 bg-linear-to-b',
               )}
             >
               <TextareaHeader addedConvo={addedConvo} setAddedConvo={setAddedConvo} />
diff --git a/client/src/components/Chat/Input/CodeApprovalMenu.tsx b/client/src/components/Chat/Input/CodeApprovalMenu.tsx
index e28e8c3fd15..73f88bde4ef 100644
--- a/client/src/components/Chat/Input/CodeApprovalMenu.tsx
+++ b/client/src/components/Chat/Input/CodeApprovalMenu.tsx
@@ -7,9 +7,9 @@ import type { TConversation, CodeApprovalMode, CodeEnvironmentMode } from 'libre
 import type { LucideIcon } from 'lucide-react';
 import type { SetterOrUpdater } from 'recoil';
 import type { TranslationKeys } from '~/hooks';
+import { chipClasses, chipMenuClasses, chipMenuItemClasses, chipMenuHeadingClasses } from './chip';
 import { useCodeApprovalModePreference } from '~/hooks/Agents/codeApprovalPreference';
 import { useCodeApprovalMode, useLocalize } from '~/hooks';
-import { chipClasses } from './chip';
 import { cn } from '~/utils';
 
 /** The modes answer one question — what may happen to the workspace without the
@@ -100,7 +100,9 @@ export default function CodeApprovalMenu({
     <Ariakit.MenuProvider store={menuStore}>
       <TooltipAnchor
         description={localize('com_ui_code_approval_mode')}
-        disabled={isOpen}
+        /** `disabled` here would mark the open chip itself `aria-disabled`; only the hover
+         *  tooltip has to stand down while the menu covers it. */
+        showOnHover={!isOpen}
         render={
           <Ariakit.MenuButton
             disabled={disabled}
@@ -128,23 +130,9 @@ export default function CodeApprovalMenu({
           aria-hidden="true"
         />
       </TooltipAnchor>
-      <Ariakit.Menu
-        portal={true}
-        gutter={8}
-        unmountOnHide={true}
-        className={cn(
-          'z-50 flex max-w-[min(320px,calc(100vw-2rem))] min-w-[260px] flex-col rounded-2xl',
-          'border-border-menu bg-surface-menu max-h-[var(--popover-available-height)] overflow-y-auto border p-1 shadow-lg',
-          'origin-bottom opacity-0 transition-[opacity,transform] duration-200 ease-out',
-          'data-[enter]:scale-100 data-[enter]:opacity-100',
-          'scale-95 data-[leave]:scale-95 data-[leave]:opacity-0',
-        )}
-      >
+      <Ariakit.Menu portal={true} gutter={8} unmountOnHide={true} className={chipMenuClasses}>
         {/* Names the menu without adding an `h1` to the page outline. */}
-        <Ariakit.MenuHeading
-          render={<div />}
-          className="text-text-secondary px-2.5 pt-2 pb-1 text-xs font-semibold"
-        >
+        <Ariakit.MenuHeading render={<div />} className={chipMenuHeadingClasses}>
           {localize('com_ui_code_approval_mode')}
         </Ariakit.MenuHeading>
         {modes.map((mode) => {
@@ -158,12 +146,7 @@ export default function CodeApprovalMenu({
               checked={isSelected}
               hideOnClick={true}
               onChange={() => selectMode(mode)}
-              className={cn(
-                'group flex w-full cursor-pointer items-start gap-2.5 rounded-lg px-2.5 py-1.5',
-                'duration-theme-fast outline-hidden transition-colors',
-                'hover:bg-surface-hover data-[active-item]:bg-surface-hover',
-                isSelected && 'bg-surface-active-alt',
-              )}
+              className={cn(chipMenuItemClasses(isSelected), 'items-start')}
             >
               <Icon className="text-text-secondary mt-0.5 size-4 shrink-0" aria-hidden="true" />
               <div className="min-w-0 flex-1 text-left">
diff --git a/client/src/components/Chat/Input/CodeWorkspaceMenu.tsx b/client/src/components/Chat/Input/CodeWorkspaceMenu.tsx
index de06ca2008b..e29d79de30b 100644
--- a/client/src/components/Chat/Input/CodeWorkspaceMenu.tsx
+++ b/client/src/components/Chat/Input/CodeWorkspaceMenu.tsx
@@ -1,6 +1,6 @@
 import { Fragment, useId, useState } from 'react';
 import * as Ariakit from '@ariakit/react';
-import { CheckboxGlyph, TooltipAnchor, useToastContext } from '@librechat/client';
+import { TooltipAnchor, useToastContext } from '@librechat/client';
 import {
   isCodeWorkspaceCheckoutAvailable,
   isLinkedWorktreeRoutingAllowed,
@@ -15,8 +15,12 @@ import {
   Monitor,
   GitBranch,
   GitFork,
+  FolderGit2,
+  WandSparkles,
+  GitBranchPlus,
 } from 'lucide-react';
 import type { CodeWorkspaceSelection, TConversation } from 'librechat-data-provider';
+import type { LucideIcon } from 'lucide-react';
 import type { SetterOrUpdater } from 'recoil';
 import type {
   CodeWorkspaceEnvironmentResult,
@@ -30,13 +34,19 @@ import {
   useReconcileConversationCodeEnvironmentMutation,
   useCodeEnvironmentStatusQueries,
 } from '~/data-provider';
+import {
+  chipClasses,
+  infoChipClasses,
+  chipMenuClasses as menuClasses,
+  chipMenuItemClasses as menuItemClasses,
+  chipMenuHeadingClasses as headingClasses,
+} from './chip';
 import {
   cn,
   codeWorkspaceErrorKeys,
   getCodeWorkspaceErrorReason,
   getResponseStatus,
 } from '~/utils';
-import { chipClasses, infoChipClasses } from './chip';
 import { useLocalize } from '~/hooks';
 
 const stateLabels: Partial<Record<CodeWorkspaceResult['state'], TranslationKeys>> = {
@@ -49,22 +59,38 @@ const stateLabels: Partial<Record<CodeWorkspaceResult['state'], TranslationKeys>
   without_attached: 'com_ui_code_workspace_without_attached',
 };
 
-const headingClasses = 'px-2.5 pt-2 pb-1 text-xs font-semibold text-text-secondary';
-const menuClasses = cn(
-  'z-50 flex max-w-[min(360px,calc(100vw-2rem))] min-w-[260px] flex-col rounded-2xl',
-  'border-border-menu bg-surface-menu max-h-[var(--popover-available-height)] overflow-y-auto border p-1 shadow-lg',
-  'origin-bottom opacity-0 transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none',
-  'data-[enter]:scale-100 data-[enter]:opacity-100',
-  'scale-95 data-[leave]:scale-95 data-[leave]:opacity-0',
-);
+type CheckoutChoice = 'auto' | NonNullable<CodeWorkspaceSelection['checkout']>;
 
-const menuItemClasses = (selected = false) =>
-  cn(
-    'group flex w-full cursor-pointer items-start gap-2.5 rounded-lg px-2.5 py-1.5',
-    'outline-hidden transition-colors duration-theme-fast',
-    'hover:bg-surface-hover data-[active-item]:bg-surface-hover',
-    selected && 'bg-surface-active-alt',
-  );
+/** `auto` leaves the checkout to the worker's policy, so it is a choice the reader can return to. */
+const checkoutModes: {
+  value: CheckoutChoice;
+  icon: LucideIcon;
+  label: TranslationKeys;
+  info: TranslationKeys;
+  chip: TranslationKeys;
+}[] = [
+  {
+    value: 'auto',
+    icon: WandSparkles,
+    label: 'com_ui_code_checkout_automatic',
+    info: 'com_ui_code_checkout_automatic_info',
+    chip: 'com_ui_code_checkout_automatic_chip',
+  },
+  {
+    value: 'isolated',
+    icon: GitBranchPlus,
+    label: 'com_ui_code_checkout_isolated',
+    info: 'com_ui_code_checkout_isolated_info',
+    chip: 'com_ui_code_worktree',
+  },
+  {
+    value: 'source',
+    icon: FolderGit2,
+    label: 'com_ui_code_checkout_source',
+    info: 'com_ui_code_checkout_source_info',
+    chip: 'com_ui_code_checkout_source',
+  },
+];
 
 /** Conflicts refresh the decision; definitive rejections keep their specific explanation. */
 function transitionErrorKey(error: unknown): TranslationKeys {
@@ -143,6 +169,7 @@ function EnvironmentWorkspaces({
   onSelect,
   checkout,
   allowCheckoutSelection = false,
+  allowAutoCheckout = false,
 }: {
   environment: CodeWorkspaceEnvironmentResult['environment'];
   requiredBy?: CodeWorkspaceEnvironmentResult['requiredBy'];
@@ -150,32 +177,48 @@ function EnvironmentWorkspaces({
   emptyLabel: string;
   hideOnClick: boolean;
   isSelected: (workspaceId: string) => boolean;
-  onSelect: (selection: CodeWorkspaceSelection) => void;
+  onSelect: (selection: CodeWorkspaceSelection, inheritCheckout?: boolean) => void;
   checkout?: CodeWorkspaceSelection['checkout'];
   allowCheckoutSelection?: boolean;
+  /** Offers Auto, which clears an override back to the worker's policy. */
+  allowAutoCheckout?: boolean;
 }) {
   const localize = useLocalize();
+  const owners = requiredBy?.map(({ id, name }) => name || id).join(', ');
+  const currentCheckout: CheckoutChoice | undefined = allowAutoCheckout
+    ? (checkout ?? 'auto')
+    : checkout;
+  const names = workspaces.map(({ id, name }) => name ?? id);
+  const sharedNames = new Set(names.filter((name, index) => names.indexOf(name) !== index));
   return (
     <div data-code-environment-id={environment.id}>
-      <Ariakit.MenuHeading render={<div />} className={headingClasses}>
-        {environment.name ?? environment.id}
+      <Ariakit.MenuHeading
+        render={<div />}
+        className={cn(headingClasses, 'flex min-w-0 items-baseline gap-1.5')}
+      >
+        <span className="shrink-0">{environment.name ?? environment.id}</span>
+        {owners && (
+          <span className="text-text-tertiary min-w-0 truncate font-normal">
+            {localize('com_ui_code_workspace_used_by', { 0: owners })}
+          </span>
+        )}
       </Ariakit.MenuHeading>
-      {requiredBy != null && requiredBy.length > 0 && (
-        <p className="text-text-secondary px-2.5 pb-2 text-xs">
-          {localize('com_ui_code_workspace_used_by', {
-            0: requiredBy.map(({ id, name }) => name || id).join(', '),
-          })}
-        </p>
-      )}
       {workspaces.length === 0 && (
-        <div className="text-text-secondary px-2.5 py-2 text-sm">{emptyLabel}</div>
+        <div className="text-text-secondary px-2.5 py-1.5 text-sm">{emptyLabel}</div>
       )}
       {workspaces.map((descriptor) => {
         const selected = isSelected(descriptor.id);
+        /** A sibling with the same name keeps its id visible, so the two rows never read alike. */
+        const source = [
+          descriptor.environment?.repo,
+          descriptor.environment?.ref,
+          sharedNames.has(descriptor.name ?? descriptor.id) ? descriptor.id : undefined,
+        ]
+          .filter(Boolean)
+          .join(' · ');
         return (
           <Fragment key={descriptor.id}>
             <Ariakit.MenuItemRadio
-              key={descriptor.id}
               name={`codeWorkspace:${environment.id}`}
               value={descriptor.id}
               checked={selected}
@@ -185,93 +228,56 @@ function EnvironmentWorkspaces({
               }
               className={menuItemClasses(selected)}
             >
-              <Folder className="text-text-secondary mt-0.5 size-4 shrink-0" aria-hidden="true" />
-              <div className="min-w-0 flex-1 text-left">
-                <div className="text-text-primary truncate text-sm font-medium">
-                  {descriptor.name ?? descriptor.id}
-                </div>
-                {descriptor.name && (
-                  <p className="text-text-secondary truncate text-xs">{descriptor.id}</p>
-                )}
-                {descriptor.instructions !== undefined && (
-                  <p className="text-text-secondary truncate text-xs">
-                    {descriptor.instructions.length === 0
-                      ? localize('com_ui_repository_instructions_none')
-                      : descriptor.instructions
-                          .map(
-                            (file) =>
-                              `${file.path} · ${(file.bytes / 1024).toFixed(1)} KB${file.truncated ? ` · ${localize('com_ui_repository_instructions_truncated')}` : ''}`,
-                          )
-                          .join(', ')}
-                  </p>
-                )}
-                {(descriptor.environment?.repo || descriptor.environment?.ref) && (
-                  <p className="text-text-secondary truncate text-xs">
-                    {[descriptor.environment.repo, descriptor.environment.ref]
-                      .filter(Boolean)
-                      .join(' · ')}
-                  </p>
-                )}
-              </div>
+              <Folder className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
+              <span className="text-text-primary min-w-0 truncate text-sm font-medium">
+                {descriptor.name ?? descriptor.id}
+              </span>
+              <span className="text-text-tertiary min-w-0 flex-1 truncate text-xs">{source}</span>
               {selected && (
-                <Check className="text-text-primary mt-0.5 size-4 shrink-0" aria-hidden="true" />
+                <Check className="text-text-primary size-4 shrink-0" aria-hidden="true" />
               )}
             </Ariakit.MenuItemRadio>
             {selected &&
               allowCheckoutSelection &&
-              environment.configSchema?.workspaces?.allowCheckoutSelection === true && (
-                <>
-                  <Ariakit.MenuHeading render={<div />} className={headingClasses}>
-                    {localize('com_ui_code_checkout_mode')}
-                  </Ariakit.MenuHeading>
-                  {(['isolated', 'source'] as const)
-                    .filter(
-                      (mode) =>
-                        mode === 'source' ||
-                        descriptor.workspaceInstances?.includes('git_worktree'),
-                    )
-                    .map((mode) => (
-                      <Ariakit.MenuItemRadio
-                        key={mode}
-                        name={`codeCheckout:${environment.id}`}
-                        value={mode}
-                        checked={checkout === mode}
-                        hideOnClick={hideOnClick}
-                        className={menuItemClasses(checkout === mode)}
-                        onChange={() =>
-                          onSelect({
+              environment.configSchema?.workspaces?.allowCheckoutSelection === true &&
+              checkoutModes
+                .filter(
+                  ({ value }) =>
+                    value === 'source' ||
+                    (value === 'auto' && allowAutoCheckout) ||
+                    (value === 'isolated' &&
+                      descriptor.workspaceInstances?.includes('git_worktree')),
+                )
+                .map(({ value, icon: ModeIcon, label }) => (
+                  <Ariakit.MenuItemRadio
+                    key={value}
+                    name={`codeCheckout:${environment.id}`}
+                    value={value}
+                    checked={currentCheckout === value}
+                    hideOnClick={hideOnClick}
+                    className={cn(menuItemClasses(currentCheckout === value), 'pl-8')}
+                    onChange={() =>
+                      value === 'auto'
+                        ? onSelect(
+                            { environmentId: environment.id, workspaceId: descriptor.id },
+                            false,
+                          )
+                        : onSelect({
                             environmentId: environment.id,
                             workspaceId: descriptor.id,
-                            checkout: mode,
+                            checkout: value,
                           })
-                        }
-                      >
-                        <div className="min-w-0 flex-1 text-left">
-                          <div className="text-text-primary text-sm font-medium">
-                            {localize(
-                              mode === 'isolated'
-                                ? 'com_ui_code_checkout_isolated'
-                                : 'com_ui_code_checkout_source',
-                            )}
-                          </div>
-                          <p className="text-text-secondary text-xs">
-                            {localize(
-                              mode === 'isolated'
-                                ? 'com_ui_code_checkout_isolated_info'
-                                : 'com_ui_code_checkout_source_info',
-                            )}
-                          </p>
-                        </div>
-                        {checkout === mode && (
-                          <Check
-                            className="text-text-primary mt-0.5 size-4 shrink-0"
-                            aria-hidden="true"
-                          />
-                        )}
-                      </Ariakit.MenuItemRadio>
-                    ))}
-                </>
-              )}
+                    }
+                  >
+                    <ModeIcon className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
+                    <span className="text-text-primary min-w-0 flex-1 truncate text-sm">
+                      {localize(label)}
+                    </span>
+                    {currentCheckout === value && (
+                      <Check className="text-text-primary size-4 shrink-0" aria-hidden="true" />
+                    )}
+                  </Ariakit.MenuItemRadio>
+                ))}
           </Fragment>
         );
       })}
@@ -288,30 +294,34 @@ function GitContext({
   target: CodeWorkspaceEnvironmentResult;
   disabled: boolean;
   locked: boolean;
-  onSelect?: (selection: CodeWorkspaceSelection) => void;
+  onSelect?: (selection: CodeWorkspaceSelection, inheritCheckout?: boolean) => void;
 }) {
   const localize = useLocalize();
+  const checkoutStore = Ariakit.useMenuStore({ focusLoop: true, placement: 'top-start' });
+  const checkoutOpen = checkoutStore.useState('open');
   const descriptor = target.workspaces.find(({ id }) => id === target.selected?.workspaceId);
   if (descriptor == null) return null;
   const supportsWorktree = descriptor.workspaceInstances?.includes('git_worktree') === true;
   const checkout = target.selected?.checkout;
   const checkoutSelectionAllowed =
     target.environment.configSchema?.workspaces?.allowCheckoutSelection === true;
-  const checkoutEditable = !locked && supportsWorktree && checkoutSelectionAllowed;
+  /** The registered checkout needs no worker capability, so a workspace without worktrees still
+   *  lets the reader override Auto with it; only the isolated option depends on support. */
+  const checkoutEditable = !locked && checkoutSelectionAllowed;
   const usesIsolation = checkout !== 'source' && supportsWorktree;
   const showLinkedWorktrees =
     !usesIsolation &&
     descriptor.workspaceScopes?.includes('git_linked_worktree') &&
     isLinkedWorktreeRoutingAllowed(target.environment.configSchema?.workspaces?.linkedWorktrees) &&
     isCodeWorkspaceCheckoutAvailable({ checkout }, descriptor, checkoutSelectionAllowed);
-  const worktreeInfo =
-    checkout == null
-      ? localize('com_ui_code_checkout_automatic_info')
-      : localize(
-          checkout === 'isolated'
-            ? 'com_ui_code_checkout_isolated_info'
-            : 'com_ui_code_checkout_source_info',
-        );
+  const current = checkoutModes.find(({ value }) => value === (checkout ?? 'auto'));
+  const options = checkoutModes.filter(({ value }) => value !== 'isolated' || supportsWorktree);
+  const chooseCheckout = (choice: CheckoutChoice) => {
+    if (target.selected == null || !checkoutEditable || disabled) return;
+    const { checkout: _previous, ...selection } = target.selected;
+    onSelect?.(choice === 'auto' ? selection : { ...selection, checkout: choice }, false);
+  };
+  const CurrentIcon = current?.icon ?? WandSparkles;
   return (
     <>
       {descriptor.environment?.ref && (
@@ -329,36 +339,75 @@ function GitContext({
           </span>
         </TooltipAnchor>
       )}
-      {(supportsWorktree || checkout != null) && (
-        <TooltipAnchor
-          description={worktreeInfo}
-          render={
-            <button
-              type="button"
-              role="checkbox"
-              data-testid="code-worktree"
-              aria-label={localize('com_ui_code_worktree')}
-              aria-checked={checkout == null ? 'mixed' : checkout === 'isolated'}
-              disabled={disabled || !checkoutEditable}
-              className={cn(chipClasses, 'disabled:cursor-not-allowed disabled:opacity-50')}
-              onClick={() => {
-                if (target.selected == null || !checkoutEditable) return;
-                onSelect?.({
-                  ...target.selected,
-                  checkout: checkout === 'isolated' ? 'source' : 'isolated',
-                });
-              }}
-            />
-          }
-        >
-          <CheckboxGlyph checked={checkout === 'isolated'} />
-          <span>{localize('com_ui_code_worktree')}</span>
-          {checkout == null && (
-            <span className="text-text-secondary text-xs">
-              {localize('com_ui_code_checkout_automatic')}
-            </span>
-          )}
-        </TooltipAnchor>
+      {(supportsWorktree || checkout != null || checkoutEditable) && current != null && (
+        <Ariakit.MenuProvider store={checkoutStore}>
+          <TooltipAnchor
+            description={localize(current.info)}
+            showOnHover={!checkoutOpen}
+            render={
+              <Ariakit.MenuButton
+                data-testid="code-checkout"
+                disabled={disabled || !checkoutEditable}
+                accessibleWhenDisabled={true}
+                aria-label={`${localize('com_ui_code_checkout_mode')}: ${localize(current.label)}`}
+                className={cn(
+                  chipClasses,
+                  checkoutOpen && 'bg-surface-hover',
+                  'aria-disabled:cursor-not-allowed aria-disabled:opacity-50',
+                )}
+              />
+            }
+          >
+            <CurrentIcon className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
+            <span className="max-w-[12rem] min-w-0 truncate">{localize(current.chip)}</span>
+            {checkoutEditable && (
+              <ChevronDown
+                className={cn(
+                  'text-text-secondary size-3 shrink-0 transition-transform',
+                  checkoutOpen && 'rotate-180',
+                )}
+                aria-hidden="true"
+              />
+            )}
+          </TooltipAnchor>
+          <Ariakit.Menu portal={true} gutter={8} unmountOnHide={true} className={menuClasses}>
+            <Ariakit.MenuHeading render={<div />} className={headingClasses}>
+              {localize('com_ui_code_checkout_mode')}
+            </Ariakit.MenuHeading>
+            {options.map(({ value, icon: ModeIcon, label, info }) => {
+              const selected = value === current.value;
+              return (
+                <Ariakit.MenuItemRadio
+                  key={value}
+                  name="codeCheckout"
+                  value={value}
+                  checked={selected}
+                  disabled={disabled}
+                  hideOnClick={true}
+                  onChange={() => chooseCheckout(value)}
+                  className={cn(menuItemClasses(selected), 'items-start')}
+                >
+                  <ModeIcon
+                    className="text-text-secondary mt-0.5 size-4 shrink-0"
+                    aria-hidden="true"
+                  />
+                  <span className="min-w-0 flex-1 text-left">
+                    <span className="text-text-primary block text-sm font-medium">
+                      {localize(label)}
+                    </span>
+                    <span className="text-text-secondary block text-xs">{localize(info)}</span>
+                  </span>
+                  {selected && (
+                    <Check
+                      className="text-text-primary mt-0.5 size-4 shrink-0"
+                      aria-hidden="true"
+                    />
+                  )}
+                </Ariakit.MenuItemRadio>
+              );
+            })}
+          </Ariakit.Menu>
+        </Ariakit.MenuProvider>
       )}
       {showLinkedWorktrees && (
         <TooltipAnchor
@@ -466,12 +515,12 @@ export default function CodeWorkspaceMenu({
 
   const { transition } = workspace;
   const environmentIds = new Set(workspace.environments.map(({ environment }) => environment.id));
-  const selectWorkspace = (selection: CodeWorkspaceSelection) => {
+  const selectWorkspace = (selection: CodeWorkspaceSelection, inheritCheckout = true) => {
     if (disabled || workspace.locked) return;
     const previous = workspace.environments.find(
       ({ environment }) => environment.id === selection.environmentId,
     )?.selected;
-    if (selection.checkout == null && previous?.checkout != null) {
+    if (inheritCheckout && selection.checkout == null && previous?.checkout != null) {
       selection = { ...selection, checkout: previous.checkout };
     }
     workspace.rememberSelection(selection);
@@ -792,15 +841,12 @@ export default function CodeWorkspaceMenu({
                   menuStore.show();
                 }}
               >
-                <Monitor
-                  className="text-text-secondary mt-0.5 size-4 shrink-0"
-                  aria-hidden="true"
-                />
+                <Monitor className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
                 <span className="text-text-primary min-w-0 flex-1 truncate text-left text-sm">
                   {candidate.name ?? candidate.id}
                 </span>
                 {workspace.mode === 'attached' && environmentIds.has(candidate.id) && (
-                  <Check className="text-text-primary mt-0.5 size-4 shrink-0" aria-hidden="true" />
+                  <Check className="text-text-primary size-4 shrink-0" aria-hidden="true" />
                 )}
               </Ariakit.MenuItem>
             ))}
@@ -850,7 +896,13 @@ export default function CodeWorkspaceMenu({
           </TooltipAnchor>
           <WorkspaceRequirements id={requirementsId} requirements={requirements} />
         </div>
-        <Ariakit.Menu portal={true} gutter={8} unmountOnHide={true} className={menuClasses}>
+        <Ariakit.Menu
+          portal={true}
+          gutter={8}
+          unmountOnHide={true}
+          aria-label={localize('com_ui_code_workspace')}
+          className={menuClasses}
+        >
           {transition != null && transitionText != null ? (
             <>
               <Ariakit.MenuHeading render={<div />} className={headingClasses}>
@@ -898,10 +950,7 @@ export default function CodeWorkspaceMenu({
                   disabled={disabled || !moveReady || moveMutation.isLoading}
                   hideOnClick={true}
                   onClick={confirmMove}
-                  className={cn(
-                    menuItemClasses(),
-                    'items-center aria-disabled:cursor-not-allowed aria-disabled:opacity-50',
-                  )}
+                  className={menuItemClasses()}
                 >
                   <ConfirmIcon className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
                   <span className="text-text-primary min-w-0 flex-1 truncate text-left text-sm font-medium">
@@ -915,10 +964,7 @@ export default function CodeWorkspaceMenu({
                   disabled={disabled || moveMutation.isLoading}
                   hideOnClick={true}
                   onClick={confirmDetach}
-                  className={cn(
-                    menuItemClasses(),
-                    'aria-disabled:cursor-not-allowed aria-disabled:opacity-50',
-                  )}
+                  className={cn(menuItemClasses(), 'items-start')}
                 >
                   <FolderX
                     className="text-text-secondary mt-0.5 size-4 shrink-0"
@@ -937,9 +983,6 @@ export default function CodeWorkspaceMenu({
             </>
           ) : (
             <>
-              <Ariakit.MenuHeading render={<div />} className={headingClasses}>
-                {localize('com_ui_code_workspace')}
-              </Ariakit.MenuHeading>
               {workspace.supportsEnvironmentDecisions && (
                 <Ariakit.MenuItemRadio
                   name="codeEnvironmentMode"
@@ -949,23 +992,15 @@ export default function CodeWorkspaceMenu({
                   onChange={selectWithoutAttached}
                   className={menuItemClasses(workspace.mode === 'without_attached')}
                 >
-                  <FolderX
-                    className="text-text-secondary mt-0.5 size-4 shrink-0"
-                    aria-hidden="true"
-                  />
-                  <div className="min-w-0 flex-1 text-left">
-                    <div className="text-text-primary truncate text-sm font-medium">
-                      {localize('com_ui_code_workspace_without_attached')}
-                    </div>
-                    <p className="text-text-secondary text-xs">
-                      {localize('com_ui_code_workspace_without_attached_info')}
-                    </p>
-                  </div>
+                  <FolderX className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
+                  <span className="text-text-primary min-w-0 truncate text-sm font-medium">
+                    {localize('com_ui_code_workspace_without_attached')}
+                  </span>
+                  <span className="text-text-tertiary min-w-0 flex-1 truncate text-xs">
+                    {localize('com_ui_code_workspace_without_attached_info')}
+                  </span>
                   {workspace.mode === 'without_attached' && (
-                    <Check
-                      className="text-text-primary mt-0.5 size-4 shrink-0"
-                      aria-hidden="true"
-                    />
+                    <Check className="text-text-primary size-4 shrink-0" aria-hidden="true" />
                   )}
                 </Ariakit.MenuItemRadio>
               )}
@@ -984,7 +1019,10 @@ export default function CodeWorkspaceMenu({
                     }
                     onSelect={selectWorkspace}
                     checkout={selected?.checkout}
-                    allowCheckoutSelection={!workspace.locked}
+                    /** One environment gets the checkout chip in the rail; several share it here,
+                     *  one set of choices under each environment's selected workspace. */
+                    allowCheckoutSelection={!workspace.locked && workspace.environments.length > 1}
+                    allowAutoCheckout={true}
                   />
                 ))}
               {machine != null &&
@@ -1005,10 +1043,7 @@ export default function CodeWorkspaceMenu({
                     aria-busy={machineQuery?.isLoading}
                     onClick={() => void machineQuery?.refetch()}
                   >
-                    <RefreshCw
-                      className="text-text-secondary mt-0.5 size-4 shrink-0"
-                      aria-hidden="true"
-                    />
+                    <RefreshCw className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
                     <span role="status" className="text-text-secondary text-sm">
                       {localize(
                         machineQuery?.isLoading
@@ -1027,10 +1062,7 @@ export default function CodeWorkspaceMenu({
             hideOnClick={false}
             onClick={() => void refresh()}
             aria-busy={isRefreshing}
-            className={cn(
-              menuItemClasses(),
-              'items-center aria-disabled:cursor-not-allowed aria-disabled:opacity-50',
-            )}
+            className={menuItemClasses()}
           >
             <RefreshCw className="text-text-secondary size-4 shrink-0" aria-hidden="true" />
             <span className="text-text-primary text-sm font-medium">
diff --git a/client/src/components/Chat/Input/__tests__/CodeWorkspaceMenu.spec.tsx b/client/src/components/Chat/Input/__tests__/CodeWorkspaceMenu.spec.tsx
index 64855e17156..ce38826007d 100644
--- a/client/src/components/Chat/Input/__tests__/CodeWorkspaceMenu.spec.tsx
+++ b/client/src/components/Chat/Input/__tests__/CodeWorkspaceMenu.spec.tsx
@@ -2,8 +2,8 @@ import { AxiosError } from 'axios';
 import { Provider, createStore } from 'jotai';
 import userEvent from '@testing-library/user-event';
 import { dataService } from 'librechat-data-provider';
-import { render, screen, within, waitFor } from '@testing-library/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { render, screen, within, waitFor, fireEvent } from '@testing-library/react';
 import type { TConversation } from 'librechat-data-provider';
 import type { AxiosResponse } from 'axios';
 import type { CodeWorkspaceResult } from '~/hooks';
@@ -96,6 +96,9 @@ function renderMenu(ui: React.ReactElement) {
   };
 }
 
+const checkoutLabel = (checkout?: 'source' | 'isolated') =>
+  `com_ui_code_checkout_mode: com_ui_code_checkout_${checkout ?? 'automatic'}`;
+
 describe('CodeWorkspaceMenu', () => {
   test('separates machine, folder, and reported branch without committing defaults', async () => {
     const graph = workspace({ machineOptions: [environment] });
@@ -225,11 +228,15 @@ describe('CodeWorkspaceMenu', () => {
         'true',
       );
       expect(
-        screen.getByRole('menuitemradio', { name: /com_ui_code_checkout_source/ }),
-      ).toHaveAttribute('aria-checked', 'true');
+        screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout_source/ }),
+      ).not.toBeInTheDocument();
       expect(
         screen.queryByRole('menuitemradio', { name: /Runtime Project/ }),
       ).not.toBeInTheDocument();
+      expect(screen.getByTestId('code-checkout')).toHaveAttribute(
+        'aria-label',
+        checkoutLabel('source'),
+      );
       expect(setter).not.toHaveBeenCalled();
       expect(graph.rememberSelection).not.toHaveBeenCalled();
       expect(graph.environments[0].selected).toEqual(selected);
@@ -255,19 +262,55 @@ describe('CodeWorkspaceMenu', () => {
       graph.environments[0].selected = selected;
       const setter = jest.fn();
       renderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />);
-      const control = screen.getByRole('checkbox', { name: 'com_ui_code_worktree' });
-      expect(control).toHaveAttribute(
-        'aria-checked',
-        checkout == null ? 'mixed' : String(checkout === 'isolated'),
-      );
+      const control = screen.getByTestId('code-checkout');
+      expect(control).toHaveAttribute('aria-label', checkoutLabel(checkout));
+      expect(control).not.toHaveAttribute('aria-disabled', 'true');
       expect(setter).not.toHaveBeenCalled();
       await userEvent.click(control);
+      expect(
+        await screen.findByRole('menuitemradio', {
+          name: new RegExp(`com_ui_code_checkout_${checkout ?? 'automatic'}`),
+        }),
+      ).toHaveAttribute('aria-checked', 'true');
+      expect(setter).not.toHaveBeenCalled();
+      const next = checkout === 'isolated' ? 'source' : 'isolated';
+      await userEvent.click(
+        screen.getByRole('menuitemradio', { name: new RegExp(`com_ui_code_checkout_${next}`) }),
+      );
       expect(setter.mock.calls[0][0](conversation).codeWorkspaces).toEqual([
-        { ...selected, checkout: checkout === 'isolated' ? 'source' : 'isolated' },
+        { ...selected, checkout: next },
       ]);
     },
   );
 
+  test('removes the explicit checkout when choosing Auto from the chip menu', async () => {
+    const graph = workspace();
+    graph.environments[0].environment = {
+      ...environment,
+      configSchema: { workspaces: { allowCheckoutSelection: true } },
+    };
+    graph.environments[0].workspaces[0].workspaceInstances = ['git_worktree'];
+    graph.environments[0].selected = {
+      environmentId: environment.id,
+      workspaceId: 'project-a',
+      agentIds: ['lia'],
+      checkout: 'isolated',
+    };
+    const setter = jest.fn();
+    renderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />);
+    await userEvent.click(screen.getByTestId('code-checkout'));
+    await userEvent.click(
+      await screen.findByRole('menuitemradio', { name: /com_ui_code_checkout_automatic/ }),
+    );
+    const [selection] = setter.mock.calls[0][0](conversation).codeWorkspaces;
+    expect(selection).toEqual({
+      environmentId: environment.id,
+      workspaceId: 'project-a',
+      agentIds: ['lia'],
+    });
+    expect(selection).not.toHaveProperty('checkout');
+  });
+
   test('reports machine, branch, and worktree mode on a restored sealed chat', () => {
     const graph = workspace({ locked: true, transition: undefined });
     graph.environments[0].workspaces[0].environment = {
@@ -286,8 +329,11 @@ describe('CodeWorkspaceMenu', () => {
     );
     expect(screen.getByTestId('code-machine-status')).toHaveTextContent('Personal VM');
     expect(screen.getByTestId('code-branch')).toHaveTextContent('dev');
-    expect(screen.getByRole('checkbox')).toHaveAttribute('aria-checked', 'true');
-    expect(screen.getByRole('checkbox')).toBeDisabled();
+    expect(screen.getByTestId('code-checkout')).toHaveAttribute(
+      'aria-label',
+      checkoutLabel('isolated'),
+    );
+    expect(screen.getByTestId('code-checkout')).toHaveAttribute('aria-disabled', 'true');
   });
 
   test.each(['source', 'isolated'] as const)(
@@ -312,10 +358,11 @@ describe('CodeWorkspaceMenu', () => {
       rerenderMenu(
         <CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />,
       );
-      const control = screen.getByRole('checkbox', { name: 'com_ui_code_worktree' });
-      expect(control).toHaveAttribute('aria-checked', String(checkout === 'isolated'));
-      expect(control).toBeDisabled();
+      const control = screen.getByTestId('code-checkout');
+      expect(control).toHaveAttribute('aria-label', checkoutLabel(checkout));
+      expect(control).toHaveAttribute('aria-disabled', 'true');
       await userEvent.click(control);
+      expect(screen.queryByRole('menuitemradio')).not.toBeInTheDocument();
       expect(setter).not.toHaveBeenCalled();
       expect(graph.rememberSelection).not.toHaveBeenCalled();
       expect(graph.environments[0].selected).toEqual(selected);
@@ -343,10 +390,22 @@ describe('CodeWorkspaceMenu', () => {
       };
       const setter = jest.fn();
       renderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />);
-      const control = screen.getByRole('checkbox', { name: 'com_ui_code_worktree' });
-      expect(control).toHaveAttribute('aria-checked', 'true');
-      expect(control).toBeDisabled();
+      const control = screen.getByTestId('code-checkout');
+      expect(control).toHaveAttribute('aria-label', checkoutLabel('isolated'));
       await userEvent.click(control);
+      if (enabled) {
+        /** Overrides stay open so the draft can leave the unavailable isolated mode, but
+         *  isolated itself is never offered without worker support. */
+        expect(
+          screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout_isolated/ }),
+        ).toBeNull();
+        expect(
+          screen.getByRole('menuitemradio', { name: /com_ui_code_checkout_source/ }),
+        ).toBeInTheDocument();
+      } else {
+        expect(control).toHaveAttribute('aria-disabled', 'true');
+        expect(screen.queryByRole('menuitemradio')).not.toBeInTheDocument();
+      }
       expect(setter).not.toHaveBeenCalled();
       expect(graph.rememberSelection).not.toHaveBeenCalled();
     },
@@ -357,9 +416,10 @@ describe('CodeWorkspaceMenu', () => {
     graph.environments[0].workspaces[0].workspaceInstances = ['git_worktree'];
     const setter = jest.fn();
     renderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />);
-    expect(screen.getByRole('checkbox')).toBeDisabled();
-    expect(screen.getByRole('checkbox')).toHaveAttribute('aria-checked', 'mixed');
-    expect(screen.getByRole('checkbox')).toHaveTextContent('com_ui_code_checkout_automatic');
+    const chip = screen.getByTestId('code-checkout');
+    expect(chip).toHaveAttribute('aria-disabled', 'true');
+    expect(chip).toHaveAttribute('aria-label', checkoutLabel());
+    expect(chip).toHaveTextContent('com_ui_code_checkout_automatic_chip');
     expect(setter).not.toHaveBeenCalled();
   });
 
@@ -376,7 +436,7 @@ describe('CodeWorkspaceMenu', () => {
         <CodeWorkspaceMenu setConversation={jest.fn()} workspace={graph} disabled={false} />,
       );
       expect(screen.queryByText('com_ui_code_linked_worktrees') != null).toBe(enabled);
-      expect(screen.queryByRole('checkbox')).not.toBeInTheDocument();
+      expect(screen.queryByTestId('code-checkout')).not.toBeInTheDocument();
     },
   );
 
@@ -421,12 +481,9 @@ describe('CodeWorkspaceMenu', () => {
           <CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />,
         );
         expect(screen.queryByText('com_ui_code_linked_worktrees') != null).toBe(expected);
-        const control = screen.queryByRole('checkbox', { name: 'com_ui_code_worktree' });
-        if (capable || checkout != null) {
-          expect(control).toHaveAttribute(
-            'aria-checked',
-            checkout == null ? 'mixed' : String(checkout === 'isolated'),
-          );
+        const control = screen.queryByTestId('code-checkout');
+        if (capable || checkout != null || (allowed && !locked)) {
+          expect(control).toHaveAttribute('aria-label', checkoutLabel(checkout));
         } else {
           expect(control).toBeNull();
         }
@@ -437,6 +494,52 @@ describe('CodeWorkspaceMenu', () => {
     );
   });
 
+  test('ignores a checkout pick once the composer is disabled with the menu open', async () => {
+    const graph = workspace();
+    graph.environments[0].environment = {
+      ...environment,
+      configSchema: { workspaces: { allowCheckoutSelection: true } },
+    };
+    graph.environments[0].workspaces[0].workspaceInstances = ['git_worktree'];
+    const setter = jest.fn();
+    const { rerenderMenu } = renderMenu(
+      <CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={false} />,
+    );
+    await userEvent.click(screen.getByTestId('code-checkout'));
+    rerenderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={true} />);
+    const source = screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout_source/ });
+    if (source != null) fireEvent.click(source);
+    expect(setter).not.toHaveBeenCalled();
+    expect(graph.rememberSelection).not.toHaveBeenCalled();
+  });
+
+  test('tells same-named workspaces apart by id', async () => {
+    const graph = workspace();
+    graph.environments[0].workspaces = [
+      { id: 'repo-main', name: 'Repo' },
+      {
+        id: 'repo-fork',
+        name: 'Repo',
+        environment: { fingerprint: 'f', repo: 'org/repo', ref: 'main', actions: [] },
+      },
+      {
+        id: 'repo-copy',
+        name: 'Repo',
+        environment: { fingerprint: 'f', repo: 'org/repo', ref: 'main', actions: [] },
+      },
+      { id: 'solo', name: 'Solo' },
+    ];
+    renderMenu(
+      <CodeWorkspaceMenu setConversation={jest.fn()} workspace={graph} disabled={false} />,
+    );
+    await userEvent.click(screen.getByTestId('code-workspace'));
+    expect(screen.getByRole('menuitemradio', { name: /Repo.*repo-main/ })).toBeInTheDocument();
+    expect(screen.getByRole('menuitemradio', { name: /Repo.*repo-fork/ })).toBeInTheDocument();
+    expect(screen.getByRole('menuitemradio', { name: /Repo.*repo-copy/ })).toBeInTheDocument();
+    /** A unique name stays one compact line. */
+    expect(screen.getByRole('menuitemradio', { name: 'Solo' })).toBeInTheDocument();
+  });
+
   test('hides Git context when continuing without an attached workspace', () => {
     const graph = workspace({ mode: 'without_attached', state: 'without_attached' });
     graph.environments[0].workspaces[0].workspaceInstances = ['git_worktree'];
@@ -449,7 +552,7 @@ describe('CodeWorkspaceMenu', () => {
       <CodeWorkspaceMenu setConversation={jest.fn()} workspace={graph} disabled={false} />,
     );
     expect(screen.queryByTestId('code-branch')).not.toBeInTheDocument();
-    expect(screen.queryByRole('checkbox')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('code-checkout')).not.toBeInTheDocument();
   });
 
   test('disables the inline worktree choice during generation', async () => {
@@ -463,8 +566,9 @@ describe('CodeWorkspaceMenu', () => {
     renderMenu(<CodeWorkspaceMenu setConversation={setter} workspace={graph} disabled={true} />);
     expect(screen.getByTestId('code-machine')).toBeDisabled();
     expect(screen.getByTestId('code-workspace')).toHaveAttribute('aria-disabled', 'true');
-    expect(screen.getByRole('checkbox')).toBeDisabled();
-    await userEvent.click(screen.getByRole('checkbox'));
+    expect(screen.getByTestId('code-checkout')).toHaveAttribute('aria-disabled', 'true');
+    await userEvent.click(screen.getByTestId('code-checkout'));
+    expect(screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout/ })).toBeNull();
     expect(setter).not.toHaveBeenCalled();
   });
 
@@ -490,6 +594,51 @@ describe('CodeWorkspaceMenu', () => {
     },
   );
 
+  test('offers checkout per environment in the menu when a chat uses several machines', async () => {
+    const graph = workspace();
+    graph.environments = ['isolated', undefined].map((checkout, index) => ({
+      environment: {
+        ...environment,
+        id: `vm-${index}`,
+        name: `Machine ${index}`,
+        configSchema: { workspaces: { allowCheckoutSelection: true } },
+      },
+      state: 'ready' as const,
+      workspaces: [
+        {
+          id: 'repo',
+          name: `Repository ${index}`,
+          workspaceInstances: ['git_worktree'] as ['git_worktree'],
+        },
+      ],
+      selected: {
+        environmentId: `vm-${index}`,
+        workspaceId: 'repo',
+        ...(checkout ? { checkout: checkout as 'isolated' } : {}),
+      },
+    }));
+    const setConversation = jest.fn();
+    renderMenu(
+      <CodeWorkspaceMenu setConversation={setConversation} workspace={graph} disabled={false} />,
+    );
+    /** The rail chip only serves a single machine. */
+    expect(screen.queryByTestId('code-checkout')).not.toBeInTheDocument();
+    await userEvent.click(screen.getByTestId('code-workspace'));
+    const autoChoices = screen.getAllByRole('menuitemradio', {
+      name: /com_ui_code_checkout_automatic/,
+    });
+    expect(autoChoices).toHaveLength(2);
+    expect(autoChoices[0]).toHaveAttribute('aria-checked', 'false');
+    expect(autoChoices[1]).toHaveAttribute('aria-checked', 'true');
+    await userEvent.click(autoChoices[0]);
+    const next = setConversation.mock.calls[0][0](conversation);
+    const vm0 = next.codeWorkspaces.find(
+      ({ environmentId }: { environmentId: string }) => environmentId === 'vm-0',
+    );
+    expect(vm0).toMatchObject({ environmentId: 'vm-0', workspaceId: 'repo' });
+    expect(vm0).not.toHaveProperty('checkout');
+  });
+
   test('reports checkout modes for every environment on a restored sealed chat', () => {
     const graph = workspace({ locked: true, transition: undefined });
     graph.environments = ['source', 'isolated'].map((checkout, index) => ({
@@ -534,11 +683,15 @@ describe('CodeWorkspaceMenu', () => {
       renderMenu(
         <CodeWorkspaceMenu setConversation={setConversation} workspace={graph} disabled={false} />,
       );
-      await userEvent.click(screen.getByTestId('code-workspace'));
+      await userEvent.click(screen.getByTestId('code-checkout'));
+      const auto = await screen.findByRole('menuitemradio', {
+        name: /com_ui_code_checkout_automatic/,
+      });
       const isolated = screen.getByRole('menuitemradio', {
         name: /com_ui_code_checkout_isolated/,
       });
       const source = screen.getByRole('menuitemradio', { name: /com_ui_code_checkout_source/ });
+      expect(auto).toHaveAttribute('aria-checked', 'true');
       expect(isolated).toHaveAttribute('aria-checked', 'false');
       expect(source).toHaveAttribute('aria-checked', 'false');
       await userEvent.click(checkout === 'isolated' ? isolated : source);
@@ -569,9 +722,9 @@ describe('CodeWorkspaceMenu', () => {
       renderMenu(
         <CodeWorkspaceMenu setConversation={setConversation} workspace={graph} disabled={false} />,
       );
-      await userEvent.click(screen.getByTestId('code-workspace'));
+      await userEvent.click(screen.getByTestId('code-checkout'));
       await userEvent.click(
-        screen.getByRole('menuitemradio', {
+        await screen.findByRole('menuitemradio', {
           name: new RegExp(
             checkout === 'source' ? 'com_ui_code_checkout_source' : 'com_ui_code_checkout_isolated',
           ),
@@ -604,21 +757,26 @@ describe('CodeWorkspaceMenu', () => {
       <CodeWorkspaceMenu setConversation={setConversation} workspace={graph} disabled={false} />,
     );
     await userEvent.click(screen.getByTestId('code-workspace'));
-    if (!enabled) {
-      expect(screen.queryByText('com_ui_code_checkout_mode')).not.toBeInTheDocument();
-    } else {
+    expect(screen.queryByText('com_ui_code_checkout_mode')).not.toBeInTheDocument();
+    expect(screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout/ })).toBeNull();
+    await userEvent.keyboard('{Escape}');
+    if (!capable) {
+      /** Without worktrees the registered checkout is still a valid override of Auto. */
+      await userEvent.click(screen.getByTestId('code-checkout'));
       expect(
         screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout_isolated/ }),
-      ).not.toBeInTheDocument();
+      ).toBeNull();
       await userEvent.click(
         screen.getByRole('menuitemradio', { name: /com_ui_code_checkout_source/ }),
       );
-      expect(setConversation.mock.calls[0][0](conversation)).toMatchObject({
-        codeWorkspaces: [
-          { environmentId: environment.id, workspaceId: 'project-a', checkout: 'source' },
-        ],
-      });
+      expect(setConversation).toHaveBeenCalled();
+      return;
     }
+    const chip = screen.getByTestId('code-checkout');
+    expect(chip).toHaveAttribute('aria-disabled', 'true');
+    await userEvent.click(chip);
+    expect(screen.queryByRole('menuitemradio', { name: /com_ui_code_checkout/ })).toBeNull();
+    expect(setConversation).not.toHaveBeenCalled();
   });
 
   test.each([false, true])(
@@ -1079,19 +1237,6 @@ describe('CodeWorkspaceMenu', () => {
     expect(setConversation).not.toHaveBeenCalled();
   });
 
-  test('shows the instruction file and truncation reported by the worker', async () => {
-    const state = workspace();
-    state.environments[0].workspaces[0].instructions = [
-      { path: 'AGENTS.md', bytes: 32768, sha256: 'a'.repeat(64), truncated: true },
-    ];
-    renderMenu(
-      <CodeWorkspaceMenu setConversation={jest.fn()} workspace={state} disabled={false} />,
-    );
-    await userEvent.click(screen.getByTestId('code-workspace'));
-    expect(
-      await screen.findByText('AGENTS.md · 32.0 KB · com_ui_repository_instructions_truncated'),
-    ).toBeInTheDocument();
-  });
   test.each([
     ['example/app', 'example/app · dev'],
     [undefined, 'dev'],
diff --git a/client/src/components/Chat/Input/chip.ts b/client/src/components/Chat/Input/chip.ts
index b1a84ee3667..0ef8b83019d 100644
--- a/client/src/components/Chat/Input/chip.ts
+++ b/client/src/components/Chat/Input/chip.ts
@@ -13,3 +13,25 @@ export const infoChipClasses = cn(
   chipClasses,
   'border-transparent bg-surface-tertiary text-text-secondary hover:bg-surface-tertiary',
 );
+
+/** The popover the rail's chips open. Menus open above their chip, so they rise a few pixels
+ *  from its edge while fading and scaling in, and leave on the faster theme step. */
+export const chipMenuClasses = cn(
+  'z-50 flex max-w-[min(340px,calc(100vw-2rem))] min-w-[240px] flex-col rounded-2xl',
+  'border-border-menu bg-surface-menu max-h-[var(--popover-available-height)] overflow-y-auto border p-1 shadow-lg',
+  'origin-bottom-left translate-y-1 scale-95 opacity-0',
+  'transition duration-theme-normal ease-out motion-reduce:transition-none',
+  'data-[enter]:translate-y-0 data-[enter]:scale-100 data-[enter]:opacity-100',
+  'data-[leave]:duration-theme-fast data-[leave]:ease-in',
+);
+
+export const chipMenuHeadingClasses = 'px-2.5 pt-2 pb-1 text-xs font-semibold text-text-secondary';
+
+export const chipMenuItemClasses = (selected = false) =>
+  cn(
+    'group flex w-full cursor-pointer items-center gap-2.5 rounded-lg px-2.5 py-1.5',
+    'outline-hidden transition-colors duration-theme-fast',
+    'hover:bg-surface-hover data-[active-item]:bg-surface-hover',
+    'aria-disabled:cursor-not-allowed aria-disabled:opacity-50',
+    selected && 'bg-surface-active-alt',
+  );
diff --git a/client/src/components/Chat/Messages/Content/ActivityPhaseGroup.tsx b/client/src/components/Chat/Messages/Content/ActivityPhaseGroup.tsx
index b0a761bc8f1..0c904dd9def 100644
--- a/client/src/components/Chat/Messages/Content/ActivityPhaseGroup.tsx
+++ b/client/src/components/Chat/Messages/Content/ActivityPhaseGroup.tsx
@@ -752,7 +752,9 @@ export default function ActivityPhaseGroup({
    *  fading window under the header (#14546). The fold had swallowed that
    *  peek with the rows, leaving one throttled sentence on the header to
    *  stand for a paragraph of live reasoning. It takes the cursor's place:
-   *  moving text is its own sign the run is alive. */
+   *  moving text is its own sign the run is alive. Only a card that is still
+   *  just thinking shows it: once tool calls fold in with the thought, the
+   *  header names the mix and the cursor stands in for the reasoning (#16680). */
   const streamingThought = useMemo(() => {
     if (!isLive || isExpanded || liveParts == null) {
       return '';
@@ -761,6 +763,9 @@ export default function ActivityPhaseGroup({
     if (tail?.type !== ContentTypes.THINK) {
       return '';
     }
+    if (liveParts.some((part) => part?.type === ContentTypes.TOOL_CALL)) {
+      return '';
+    }
     return typeof tail.think === 'string' ? tail.think : (tail.think?.value ?? '');
   }, [isLive, isExpanded, liveParts]);
   const thoughtPeek =
diff --git a/client/src/components/Chat/Messages/Content/__tests__/ActivityPhaseGroup.test.tsx b/client/src/components/Chat/Messages/Content/__tests__/ActivityPhaseGroup.test.tsx
index 0605afe5eaf..7ed1c855513 100644
--- a/client/src/components/Chat/Messages/Content/__tests__/ActivityPhaseGroup.test.tsx
+++ b/client/src/components/Chat/Messages/Content/__tests__/ActivityPhaseGroup.test.tsx
@@ -892,4 +892,19 @@ describe('ActivityPhaseGroup streaming thought peek', () => {
     expect(screen.queryByTestId('streaming-thought-peek')).toBeNull();
     expect(screen.getByTestId('activity-phase-cursor')).toBeInTheDocument();
   });
+
+  test('hides the thought when it streams after tool calls in the same card', () => {
+    render(
+      <ActivityPhaseGroup
+        labelPart={makeLabelPart('')}
+        hasContent
+        liveParts={[call, thought]}
+        showCursor
+      >
+        <div data-testid="phase-content" />
+      </ActivityPhaseGroup>,
+    );
+    expect(screen.queryByTestId('streaming-thought-peek')).toBeNull();
+    expect(screen.getByTestId('activity-phase-cursor')).toBeInTheDocument();
+  });
 });
diff --git a/client/src/components/Conversations/ProjectsSection.tsx b/client/src/components/Conversations/ProjectsSection.tsx
index 1f8b397abaa..6d313addaf2 100644
--- a/client/src/components/Conversations/ProjectsSection.tsx
+++ b/client/src/components/Conversations/ProjectsSection.tsx
@@ -479,7 +479,7 @@ const ProjectsSection = ({ toggleNav, isAuthenticated }: ProjectsSectionProps) =
     }
 
     return (
-      <ul className="m-0 list-none p-0">
+      <ul className="m-0 flex list-none flex-col gap-1 p-0">
         {projects.map((project) => (
           <ProjectItem
             key={project._id}
diff --git a/client/src/components/SidePanel/Agents/Instructions.tsx b/client/src/components/SidePanel/Agents/Instructions.tsx
index cb1d84c82de..cc5e35231a1 100644
--- a/client/src/components/SidePanel/Agents/Instructions.tsx
+++ b/client/src/components/SidePanel/Agents/Instructions.tsx
@@ -1,4 +1,5 @@
-import { Button, Label } from '@librechat/client';
+import { useId, useMemo } from 'react';
+import { Label, Radio } from '@librechat/client';
 import { Controller, useWatch, useFormContext } from 'react-hook-form';
 import type { AgentForm } from '~/common';
 import InstructionsPromptFields, { fieldWrapperClass, LoadError } from './InstructionsPromptFields';
@@ -14,42 +15,38 @@ import { cn } from '~/utils';
  * resolves, rather than briefly reading the link as absent. */
 export type InstructionsPromptStatus = 'ready' | 'loading' | 'error';
 
-/** Two-way segmented toggle between the inline editor and a linked prompt group. */
+/** Two-way segmented toggle between the inline editor and a linked prompt group, matching the
+ *  skills mode control so the section headers read as one set. */
 function SourceToggle({ disabled = false }: { disabled?: boolean }) {
   const localize = useLocalize();
+  const labelId = useId();
   const { control } = useFormContext<AgentForm>();
+  const options = useMemo(
+    () => [
+      { value: 'inline', label: localize('com_agents_instructions_source_inline') },
+      { value: 'prompt', label: localize('com_agents_instructions_source_prompt') },
+    ],
+    [localize],
+  );
 
   return (
     <Controller
       name="instructionsSource"
       control={control}
       render={({ field }) => (
-        <div
-          role="group"
-          aria-label={localize('com_agents_instructions_source_toggle_aria')}
-          className="border-border-light bg-surface-primary inline-flex w-fit gap-1 rounded-lg border p-0.5"
-        >
-          <Button
-            type="button"
-            variant={field.value === 'inline' ? 'secondary' : 'ghost'}
-            size="sm"
-            aria-pressed={field.value === 'inline'}
+        <>
+          <span id={labelId} className="sr-only">
+            {localize('com_agents_instructions_source_toggle_aria')}
+          </span>
+          <Radio
+            options={options}
+            value={field.value}
+            onChange={field.onChange}
             disabled={disabled}
-            onClick={() => field.onChange('inline')}
-          >
-            {localize('com_agents_instructions_source_inline')}
-          </Button>
-          <Button
-            type="button"
-            variant={field.value === 'prompt' ? 'secondary' : 'ghost'}
             size="sm"
-            aria-pressed={field.value === 'prompt'}
-            disabled={disabled}
-            onClick={() => field.onChange('prompt')}
-          >
-            {localize('com_agents_instructions_source_prompt')}
-          </Button>
-        </div>
+            aria-labelledby={labelId}
+          />
+        </>
       )}
     />
   );
diff --git a/client/src/components/SidePanel/Agents/Tools/ItemDialog/ItemDialog.tsx b/client/src/components/SidePanel/Agents/Tools/ItemDialog/ItemDialog.tsx
index 4582f07babb..fbfeeec04b5 100644
--- a/client/src/components/SidePanel/Agents/Tools/ItemDialog/ItemDialog.tsx
+++ b/client/src/components/SidePanel/Agents/Tools/ItemDialog/ItemDialog.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 import { OGDialog, OGDialogContent } from '@librechat/client';
 import type { AgentItem } from '../items/types';
 import { AgentPickerPortalContext } from '../../Advanced/AgentList';
@@ -17,10 +17,25 @@ export default function ItemDialog({ item, agentId, onClose }: Props) {
   const isOrchestration =
     item?.kind === 'builtin' && (item.id === 'subagents' || item.id === 'handoffs');
   const isAction = item?.kind === 'action';
+  const contentRef = useRef<HTMLDivElement | null>(null);
+  const setContent = useCallback((node: HTMLDivElement | null) => {
+    contentRef.current = node;
+    setPortalElement(node);
+  }, []);
+
+  /** Without this, Radix focuses the first focusable element, which for orchestration items is
+   *  the info hover card trigger, so the card opens on focus as soon as the dialog does. */
+  const handleOpenAutoFocus = (event: Event) => {
+    event.preventDefault();
+    contentRef.current?.focus();
+  };
   return (
     <OGDialog open={item !== null} onOpenChange={(next) => !next && onClose()}>
       <OGDialogContent
-        ref={setPortalElement}
+        ref={setContent}
+        tabIndex={-1}
+        focusOutline="hidden"
+        onOpenAutoFocus={handleOpenAutoFocus}
         className={cn(
           'w-11/12 gap-0 rounded-2xl p-0 md:max-h-[85dvh]',
           isOrchestration ? 'overflow-visible' : 'overflow-hidden',
diff --git a/client/src/components/SidePanel/Agents/Tools/ItemDialog/__tests__/ItemDialog.spec.tsx b/client/src/components/SidePanel/Agents/Tools/ItemDialog/__tests__/ItemDialog.spec.tsx
index 114134f9d8e..26e1f069675 100644
--- a/client/src/components/SidePanel/Agents/Tools/ItemDialog/__tests__/ItemDialog.spec.tsx
+++ b/client/src/components/SidePanel/Agents/Tools/ItemDialog/__tests__/ItemDialog.spec.tsx
@@ -12,6 +12,8 @@ jest.mock('react-hook-form', () => ({
   useWatch: () => undefined,
 }));
 
+const mockOpenAutoFocus: { current?: (event: Event) => void } = {};
+
 jest.mock('@librechat/client', () => {
   const React = jest.requireActual('react');
   return {
@@ -41,8 +43,22 @@ jest.mock('@librechat/client', () => {
           )
         : null,
     OGDialogContent: React.forwardRef(
-      ({ children, ...rest }: { children: React.ReactNode }, ref: React.Ref<HTMLDivElement>) =>
-        React.createElement('div', { ...rest, ref }, children),
+      (
+        {
+          children,
+          onOpenAutoFocus,
+          focusOutline: _focusOutline,
+          ...rest
+        }: {
+          children: React.ReactNode;
+          onOpenAutoFocus?: (event: Event) => void;
+          focusOutline?: string;
+        },
+        ref: React.Ref<HTMLDivElement>,
+      ) => {
+        mockOpenAutoFocus.current = onOpenAutoFocus;
+        return React.createElement('div', { ...rest, ref }, children);
+      },
     ),
     OGDialogHeader: ({ children, ...rest }: { children: React.ReactNode }) =>
       React.createElement('div', rest, children),
@@ -68,6 +84,14 @@ const skill: AgentItem = {
 };
 
 describe('ItemDialog', () => {
+  test('focuses the dialog content on open instead of the first focusable element', () => {
+    render(<ItemDialog item={skill} agentId="a1" onClose={jest.fn()} />);
+    const event = new Event('focusScope.autoFocusOnMount', { cancelable: true });
+    mockOpenAutoFocus.current?.(event);
+    expect(event.defaultPrevented).toBe(true);
+    expect(document.activeElement).toBe(screen.getByTestId('item-dialog'));
+  });
+
   test('renders nothing when item is null', () => {
     render(<ItemDialog item={null} agentId="a1" onClose={jest.fn()} />);
     expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
diff --git a/client/src/components/SidePanel/Agents/Tools/SkillsSection.tsx b/client/src/components/SidePanel/Agents/Tools/SkillsSection.tsx
index cc8dc0d1eac..1a694066cbf 100644
--- a/client/src/components/SidePanel/Agents/Tools/SkillsSection.tsx
+++ b/client/src/components/SidePanel/Agents/Tools/SkillsSection.tsx
@@ -286,7 +286,7 @@ export default function SkillsSection({ items, onInfo, onRemove, onAdd }: Props)
             options={modeOptions}
             value={mode}
             onChange={handleModeChange}
-            buttonClassName="!h-7 !px-2.5 !text-xs"
+            size="sm"
             aria-labelledby="skills-mode-label"
           />
         </div>
diff --git a/client/src/components/SidePanel/Agents/Tools/ToolRow.tsx b/client/src/components/SidePanel/Agents/Tools/ToolRow.tsx
index 75ae6e367d4..cbcfa5a0a11 100644
--- a/client/src/components/SidePanel/Agents/Tools/ToolRow.tsx
+++ b/client/src/components/SidePanel/Agents/Tools/ToolRow.tsx
@@ -15,7 +15,6 @@ interface Props {
 }
 
 function getSuffix(item: AgentItem): string | null {
-  if (item.kind === 'mcp' && item.toolCount > 0) return `· ${item.toolCount}`;
   if (item.kind === 'action' && item.endpointCount > 0) return `· ${item.endpointCount}`;
   return null;
 }
diff --git a/client/src/components/SidePanel/Agents/__tests__/Instructions.spec.tsx b/client/src/components/SidePanel/Agents/__tests__/Instructions.spec.tsx
index 488ce9afbbb..0cae180830d 100644
--- a/client/src/components/SidePanel/Agents/__tests__/Instructions.spec.tsx
+++ b/client/src/components/SidePanel/Agents/__tests__/Instructions.spec.tsx
@@ -69,7 +69,7 @@ describe('Agent Instructions', () => {
   it('switching to Prompt mode hides the inline editor without unmounting it', () => {
     render(<InstructionsHarness />);
 
-    fireEvent.click(screen.getByRole('button', { name: 'com_agents_instructions_source_prompt' }));
+    fireEvent.click(screen.getByRole('radio', { name: 'com_agents_instructions_source_prompt' }));
 
     expect(screen.getByTestId('instructions-prompt-fields')).toBeInTheDocument();
     expect(screen.getByTestId('instructions-inline-panel')).toHaveClass('hidden');
@@ -102,10 +102,10 @@ describe('Agent Instructions', () => {
     expect(screen.getByTestId('restricted-instructions-prompt')).toBeInTheDocument();
     expect(screen.getByTestId('instructions-prompt-fields')).toBeInTheDocument();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_inline' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_inline' }),
     ).not.toBeDisabled();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_prompt' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_prompt' }),
     ).not.toBeDisabled();
   });
 
@@ -117,7 +117,7 @@ describe('Agent Instructions', () => {
       />,
     );
 
-    fireEvent.click(screen.getByRole('button', { name: 'com_agents_instructions_source_inline' }));
+    fireEvent.click(screen.getByRole('radio', { name: 'com_agents_instructions_source_inline' }));
 
     expect(screen.queryByTestId('instructions-prompt-fields')).not.toBeInTheDocument();
     expect(screen.queryByTestId('restricted-instructions-prompt')).not.toBeInTheDocument();
@@ -136,10 +136,10 @@ describe('Agent Instructions', () => {
       />,
     );
 
-    const promptButton = screen.getByRole('button', {
+    const promptButton = screen.getByRole('radio', {
       name: 'com_agents_instructions_source_prompt',
     });
-    const inlineButton = screen.getByRole('button', {
+    const inlineButton = screen.getByRole('radio', {
       name: 'com_agents_instructions_source_inline',
     });
 
@@ -168,10 +168,10 @@ describe('Agent Instructions', () => {
     expect(screen.queryByTestId('instructions-prompt-fields')).not.toBeInTheDocument();
     expect(screen.queryByTestId('instructions-inline-panel')).not.toBeInTheDocument();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_inline' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_inline' }),
     ).toBeDisabled();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_prompt' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_prompt' }),
     ).toBeDisabled();
   });
 
@@ -191,7 +191,7 @@ describe('Agent Instructions', () => {
     expect(screen.getByTestId('instructions-prompt-fields')).toBeInTheDocument();
     expect(screen.queryByText('com_ui_loading')).not.toBeInTheDocument();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_prompt' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_prompt' }),
     ).not.toBeDisabled();
   });
 
@@ -215,10 +215,10 @@ describe('Agent Instructions', () => {
       'com_agents_instructions_prompt_load_error',
     );
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_inline' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_inline' }),
     ).toBeDisabled();
     expect(
-      screen.getByRole('button', { name: 'com_agents_instructions_source_prompt' }),
+      screen.getByRole('radio', { name: 'com_agents_instructions_source_prompt' }),
     ).toBeDisabled();
 
     await user.click(screen.getByRole('button', { name: 'com_ui_retry' }));
@@ -231,7 +231,7 @@ describe('Agent Instructions', () => {
 
       expect(screen.getByTestId('instructions-heading')).toHaveTextContent('com_ui_instructions');
       expect(
-        screen.getByRole('group', { name: 'com_agents_instructions_source_toggle_aria' }),
+        screen.getByRole('radiogroup', { name: 'com_agents_instructions_source_toggle_aria' }),
       ).toBeInTheDocument();
     });
 
diff --git a/client/src/components/Variables/Editor.tsx b/client/src/components/Variables/Editor.tsx
index 7687925f8e2..2704aa8c10b 100644
--- a/client/src/components/Variables/Editor.tsx
+++ b/client/src/components/Variables/Editor.tsx
@@ -104,7 +104,8 @@ export default function VariableEditor({
         <Label className={labelClassName} htmlFor={id}>
           {label}
         </Label>
-        <div className="flex items-center gap-0.5">
+        {/* `ml-auto` keeps the actions right-aligned when the label is visually hidden. */}
+        <div className="ml-auto flex items-center gap-0.5">
           {showVariables && (
             <DropdownPopup
               portal={portal}
diff --git a/client/src/locales/en/translation.json b/client/src/locales/en/translation.json
index 170e595199e..1d776fdc72e 100644
--- a/client/src/locales/en/translation.json
+++ b/client/src/locales/en/translation.json
@@ -85,8 +85,6 @@
   "com_ui_repository_instructions_defer": "Prefer agent conventions",
   "com_ui_repository_instructions_off": "Off",
   "com_ui_repository_instructions_description": "Load AGENTS.md, or CLAUDE.md when absent, from the selected workspace when its owner enables discovery. Tool permissions remain unchanged.",
-  "com_ui_repository_instructions_none": "No repository instructions",
-  "com_ui_repository_instructions_truncated": "Truncated",
   "com_ui_code_workspace_default": "Default workspace for new chats",
   "com_ui_code_workspace_last_used": "Last used workspace",
   "com_ui_code_workspace_default_description": "New chats use this workspace. Without a default, reuse your last available choice for this agent and machine in this browser. Existing chats keep their workspace.",
@@ -109,7 +107,8 @@
   "com_ui_code_branch_info": "Branch reported by the registered workspace. Branch selection is not supported.",
   "com_ui_code_worktree": "Worktree",
   "com_ui_code_checkout_automatic": "Auto",
-  "com_ui_code_checkout_automatic_info": "Use the worker's automatic checkout policy. Choose a checkout mode before sending to override it.",
+  "com_ui_code_checkout_automatic_chip": "Auto checkout",
+  "com_ui_code_checkout_automatic_info": "The worker picks how to check out",
   "com_ui_code_linked_worktrees": "Linked worktrees",
   "com_ui_code_linked_worktrees_info": "Commands in .worktrees/<name> use that worktree's execution lane. This does not create a worktree.",
   "com_ui_code_workspace": "Code workspace",
@@ -126,7 +125,7 @@
   "com_ui_code_workspace_unavailable": "Workspace unavailable",
   "com_ui_code_workspace_unsupported": "Update worker for workspaces",
   "com_ui_code_workspace_without_attached": "No workspace",
-  "com_ui_code_workspace_without_attached_info": "You can chat and use available tools. Attach a workspace for files and commands.",
+  "com_ui_code_workspace_without_attached_info": "Chat without files or commands",
   "com_ui_code_workspace_locked_recovery": "Reconnect or restore this workspace, or start a new chat.",
   "com_ui_code_workspace_attach": "Attach workspace",
   "com_ui_code_workspace_attach_info": "This chat runs without a workspace. Attach one to work with files and commands. Earlier messages stay, and no files are copied.",
@@ -149,11 +148,11 @@
   "com_ui_code_workspace_move_error": "Couldn't update this chat's workspace. Try again.",
   "com_ui_code_workspaces_selected": "{{0}} code workspaces",
   "com_ui_code_approval_ask": "Ask before changes",
-  "com_ui_code_approval_ask_description": "Ask before editing files or running commands",
+  "com_ui_code_approval_ask_description": "Asks before edits and commands",
   "com_ui_code_approval_accept_edits": "Accept edits",
-  "com_ui_code_approval_accept_edits_description": "Allow file edits; continue asking before commands",
+  "com_ui_code_approval_accept_edits_description": "Edits files, asks before commands",
   "com_ui_code_approval_full_access": "Full access",
-  "com_ui_code_approval_full_access_description": "Allow file edits and commands on your machine without asking. Sandbox limits and required approvals still apply.",
+  "com_ui_code_approval_full_access_description": "Edits and runs commands; sandbox limits apply",
   "com_ui_review_action": "Review 1 action",
   "com_ui_review_actions": "Review {{0}} actions",
   "com_ui_review_run_command": "Run command",
@@ -3384,9 +3383,9 @@
   "com_ui_schedule_consent_scopes": "Scopes: {{scopes}}",
   "com_ui_code_checkout_mode": "Checkout mode",
   "com_ui_code_checkout_isolated": "Isolated worktree",
-  "com_ui_code_checkout_isolated_info": "Created on the first workspace operation from the worker's Git snapshot. Uncommitted changes are not copied.",
+  "com_ui_code_checkout_isolated_info": "Own Git worktree; uncommitted changes aren't copied",
   "com_ui_code_checkout_source": "Registered checkout",
-  "com_ui_code_checkout_source_info": "Use the machine's registered checkout directly. Other chats may share these files.",
+  "com_ui_code_checkout_source_info": "The machine's checkout, shared with other chats",
   "com_ui_tool_approval_mode": "Tool approval mode",
   "com_ui_tool_approval_bulk": "Approval mode for all listed tools",
   "com_ui_tool_approval_inherit": "Use inherited policy",
diff --git a/e2e/setup/fake-model.js b/e2e/setup/fake-model.js
index 96f14e7600f..151f29e8d6c 100644
--- a/e2e/setup/fake-model.js
+++ b/e2e/setup/fake-model.js
@@ -61,6 +61,7 @@ const STEER_SPLIT_REPLY_MARKER = 'E2E_STEER_SPLIT_REPLY:';
 const STEER_LATE_REPLY_MARKER = 'E2E_STEER_LATE_REPLY:';
 const ACTIVITY_REPLY_MARKER = 'E2E_ACTIVITY_REPLY:';
 const ACTIVITY_PHASE_REPLY_MARKER = 'E2E_ACTIVITY_PHASE_REPLY:';
+const TOOL_THEN_THINK_REPLY_MARKER = 'E2E_TOOL_THEN_THINK_REPLY:';
 const ACTIVITY_FAILED_REPLY_MARKER = 'E2E_ACTIVITY_FAILED_REPLY:';
 const ACTIVITY_PROSE_REPLY_MARKER = 'E2E_ACTIVITY_PROSE_REPLY:';
 const ASK_USER_QUESTION_MARKER = 'E2E_ASK_USER_QUESTION:';
@@ -1737,6 +1738,49 @@ function activityPhaseReplyResponses(label, toolNames) {
   };
 }
 
+/**
+ * One tool call, then a slowly streamed `<think>` of several sentences and the
+ * final text. The thought streams after a tool batch, which is the state the
+ * live thought peek must stay hidden in.
+ */
+function toolThenThinkReplyResponses(label, toolNames) {
+  const toolName = Array.from(toolNames).find((name) => name.startsWith(STEER_TOOL_NAME_PREFIX));
+  if (!toolName) {
+    return {
+      responses: [
+        `E2E tool then think reply unavailable: no ${STEER_TOOL_NAME_PREFIX} tool advertised.`,
+      ],
+    };
+  }
+  let invocation = 0;
+  return {
+    responses: [''],
+    sleep: 200,
+    resolveInvocation: async () => {
+      invocation += 1;
+      if (invocation === 1) {
+        return {
+          response: '',
+          toolCalls: [
+            {
+              id: `call_e2e_tool_then_think_${label}`,
+              name: toolName,
+              args: { fact: `tool then think ${label}` },
+              type: 'tool_call',
+            },
+          ],
+        };
+      }
+      return {
+        response:
+          '<think>First I read the tool result slowly. Then I weigh what it changes with care. ' +
+          'Next I compare it against the original request. Afterwards I check the edge cases once more. ' +
+          `Finally I decide how to answer it.</think>\n\nE2E tool then think reply done ${label}`,
+      };
+    },
+  };
+}
+
 /** Short prose remains visible while the real tool/label pipeline forms and
  * dissolves folds. The pause before calls lets the browser finish the initial
  * word fade and install its identity/animation observer before that transition. */
@@ -3489,6 +3533,11 @@ function resolveResponses({ graph, messages, text, toolNames }) {
     return activityPhaseReplyResponses(activityPhaseLabel, toolNames);
   }
 
+  const toolThenThinkLabel = getMarkerValue(text, TOOL_THEN_THINK_REPLY_MARKER);
+  if (toolThenThinkLabel) {
+    return toolThenThinkReplyResponses(toolThenThinkLabel, toolNames);
+  }
+
   const activityProseLabel = getMarkerValue(text, ACTIVITY_PROSE_REPLY_MARKER);
   if (activityProseLabel) {
     return activityProseReplyResponses(activityProseLabel, toolNames);
diff --git a/e2e/specs/mock/scenarios/agent-builder-header.spec.ts b/e2e/specs/mock/scenarios/agent-builder-header.spec.ts
new file mode 100644
index 00000000000..4f492d69443
--- /dev/null
+++ b/e2e/specs/mock/scenarios/agent-builder-header.spec.ts
@@ -0,0 +1,105 @@
+import { expect, test } from '@playwright/test';
+import type { Locator, Page } from '@playwright/test';
+import { installCodeMocks, openCodeChat, singleMachine } from './codeWorkspaceMocks';
+import { openAgentBuilder } from '../agents.helpers';
+
+const RIGHT_EDGE_TOLERANCE = 6;
+
+async function rightEdge(locator: Locator): Promise<number> {
+  const box = await locator.boundingBox();
+  expect(box).not.toBeNull();
+  return (box?.x ?? 0) + (box?.width ?? 0);
+}
+
+/** Open the item dialog (the settings of a native tool) from its card in the tool library. */
+async function openOrchestrationItem(page: Page, name: 'Handoffs' | 'Subagents'): Promise<Locator> {
+  const form = await openAgentBuilder(page, { navigate: false });
+  await form.getByRole('button', { name: 'Add tools' }).click();
+  const library = page.getByRole('dialog', { name: 'Tool Library' });
+  await expect(library).toBeVisible();
+  const card = library
+    .getByRole('listitem')
+    .filter({ has: page.getByRole('button', { name: new RegExp(`^${name}`) }) });
+  await card.hover();
+  await card.getByRole('button', { name: /^(Configure|Tool details)$/ }).click();
+  const dialog = page.getByRole('dialog').filter({ hasNotText: 'Tool Library' }).last();
+  await expect(dialog).toBeVisible();
+  return dialog;
+}
+
+test.describe('agent builder header', () => {
+  test('instructions source is a segmented radio @scenario:instructions-source-is-segmented-radio', async ({
+    page,
+  }) => {
+    const form = await openAgentBuilder(page);
+    const group = form.getByRole('radiogroup', { name: 'Instructions source' });
+    await expect(group).toBeVisible();
+    const inline = group.getByRole('radio', { name: 'Inline' });
+    const prompt = group.getByRole('radio', { name: 'Prompt' });
+    await expect(inline).toBeChecked();
+    await expect(prompt).not.toBeChecked();
+
+    /** The editor's actions share its header row with the hidden label and stay on the right. */
+    const editor = form.locator('#instructions');
+    await expect(editor).toBeVisible();
+    const editorRight = await rightEdge(editor);
+    const actions = form
+      .getByTestId('instructions-inline-panel')
+      .getByRole('button')
+      .filter({ hasNot: page.locator('textarea') });
+    const count = await actions.count();
+    expect(count).toBeGreaterThan(0);
+    const lastAction = actions.nth(count - 1);
+    expect(Math.abs((await rightEdge(lastAction)) - editorRight)).toBeLessThanOrEqual(
+      RIGHT_EDGE_TOLERANCE,
+    );
+    for (let index = 0; index < count; index += 1) {
+      const box = await actions.nth(index).boundingBox();
+      const editorBox = await editor.boundingBox();
+      expect((box?.x ?? 0) + (box?.width ?? 0) / 2).toBeGreaterThan(
+        (editorBox?.x ?? 0) + (editorBox?.width ?? 0) / 2,
+      );
+    }
+
+    await inline.focus();
+    await page.keyboard.press('ArrowRight');
+    await expect(prompt).toBeChecked();
+    await expect(inline).not.toBeChecked();
+    await page.keyboard.press('ArrowLeft');
+    await expect(inline).toBeChecked();
+    await prompt.click();
+    await expect(prompt).toBeChecked();
+    await inline.click();
+    await expect(inline).toBeChecked();
+  });
+
+  test('orchestration dialogs open without their info card @scenario:agent-item-dialog-opens-without-info-card', async ({
+    page,
+  }) => {
+    await page.goto('/c/new', { timeout: 15000 });
+    for (const name of ['Handoffs', 'Subagents'] as const) {
+      const dialog = await openOrchestrationItem(page, name);
+      await page.waitForTimeout(500);
+      await expect(page.getByText(/Configure agents that this agent can transfer/)).toHaveCount(0);
+      await expect(page.locator('[data-radix-popper-content-wrapper]')).toHaveCount(0);
+      await expect(dialog).toBeFocused();
+      await page.keyboard.press('Escape');
+      await expect(dialog).toHaveCount(0);
+      await page.keyboard.press('Escape').catch(() => undefined);
+    }
+  });
+
+  test('an MCP server row carries no tool count @scenario:mcp-tool-row-without-count', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()], mcp: true });
+    await openCodeChat(page);
+    const form = await openAgentBuilder(page, { navigate: false });
+    const row = form.getByText('context7', { exact: false }).first();
+    await expect(row).toBeVisible();
+    const container = form.getByRole('listitem').filter({ hasText: 'context7' }).first();
+    await expect(container).toBeVisible();
+    await expect(container).not.toContainText('· 2');
+    await expect(container).not.toContainText('·');
+  });
+});
diff --git a/e2e/specs/mock/scenarios/code-workspace-composer.spec.ts b/e2e/specs/mock/scenarios/code-workspace-composer.spec.ts
new file mode 100644
index 00000000000..e66e411f173
--- /dev/null
+++ b/e2e/specs/mock/scenarios/code-workspace-composer.spec.ts
@@ -0,0 +1,291 @@
+import { expect, test } from '@playwright/test';
+import type { Locator, Page } from '@playwright/test';
+import {
+  installCodeMocks,
+  openCodeChat,
+  secondMachine,
+  singleMachine,
+  workspace,
+} from './codeWorkspaceMocks';
+
+const APPROVAL = '[data-testid="code-approval-mode"]';
+const WORKSPACE = '[data-testid="code-workspace"]';
+const CHECKOUT = '[data-testid="code-checkout"]';
+
+const chip = (page: Page, selector: string) => page.locator(selector);
+const openMenu = (page: Page) => page.getByRole('menu');
+
+async function openChip(page: Page, selector: string): Promise<Locator> {
+  await chip(page, selector).click();
+  const menu = openMenu(page);
+  await expect(menu).toBeVisible();
+  return menu;
+}
+
+async function closeMenu(page: Page) {
+  await page.keyboard.press('Escape');
+  await expect(openMenu(page)).toHaveCount(0);
+}
+
+const parseSeconds = (value: string) => {
+  const first = value.split(',')[0].trim();
+  return first.endsWith('ms') ? parseFloat(first) / 1000 : parseFloat(first);
+};
+
+test.describe('composer code workspace chips', () => {
+  test('approval and workspace menus fade and scale in @scenario:code-chip-menus-animate-scale-and-fade', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()] });
+    await openCodeChat(page);
+    const reduced = await page.evaluate(
+      () => window.matchMedia('(prefers-reduced-motion: reduce)').matches,
+    );
+
+    for (const selector of [APPROVAL, WORKSPACE]) {
+      const menu = await openChip(page, selector);
+      /** Sample the settled state: the enter transition has ended. */
+      await expect
+        .poll(() => menu.evaluate((element) => getComputedStyle(element).opacity))
+        .toBe('1');
+      const style = await menu.evaluate((element) => {
+        const computed = getComputedStyle(element);
+        return {
+          property: computed.transitionProperty,
+          duration: computed.transitionDuration,
+          opacity: computed.opacity,
+          transform: computed.transform,
+          scale: computed.scale,
+        };
+      });
+      if (reduced) {
+        expect(style.duration.split(',').every((value) => parseSeconds(value) === 0)).toBe(true);
+      } else {
+        expect(style.property).toContain('opacity');
+        expect(style.property).toContain('scale');
+        expect(style.property).toContain('translate');
+        expect(parseSeconds(style.duration)).toBeGreaterThan(0);
+        expect(parseSeconds(style.duration)).toBeLessThanOrEqual(0.2);
+      }
+      expect(style.opacity).toBe('1');
+      expect(['none', '1', '1 1']).toContain(style.scale);
+      expect(['none', 'matrix(1, 0, 0, 1, 0, 0)']).toContain(style.transform);
+      await closeMenu(page);
+    }
+  });
+
+  test('workspace rows are one line each @scenario:workspace-menu-rows-are-single-line', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()] });
+    await openCodeChat(page);
+    const menu = await openChip(page, WORKSPACE);
+
+    for (const name of ['primary', 'librechat', 'agents', 'librechat-ai']) {
+      const row = menu.getByRole('menuitemradio', { name: new RegExp(`^${name}(\\s|$)`) });
+      await expect(row).toHaveCount(1);
+      const box = await row.boundingBox();
+      expect(box, `${name} row`).not.toBeNull();
+      expect(box?.height ?? Infinity, `${name} row height`).toBeLessThan(40);
+    }
+    await expect(
+      menu.getByRole('menuitemradio', { name: /librechat.*danny-avila\/LibreChat · dev/ }),
+    ).toBeVisible();
+    await expect(menu.getByText('AGENTS.md')).toHaveCount(0);
+    await expect(menu.getByText('CLAUDE.md')).toHaveCount(0);
+    await expect(menu.getByText('Checkout mode')).toHaveCount(0);
+  });
+
+  test('the checkout chip returns to Auto @scenario:checkout-chip-restores-auto', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()] });
+    await openCodeChat(page);
+    const checkout = chip(page, CHECKOUT);
+    await expect(checkout).toContainText('Auto checkout');
+
+    let menu = await openChip(page, CHECKOUT);
+    await menu.getByRole('menuitemradio', { name: /Isolated worktree/ }).click();
+    await expect(openMenu(page)).toHaveCount(0);
+    await expect(checkout).toContainText('Worktree');
+    await expect(checkout).not.toContainText('Auto checkout');
+
+    menu = await openChip(page, CHECKOUT);
+    await expect(menu.getByRole('menuitemradio', { name: /Isolated worktree/ })).toBeChecked();
+    await menu.getByRole('menuitemradio', { name: /^Auto/ }).click();
+    await expect(openMenu(page)).toHaveCount(0);
+    await expect(checkout).toContainText('Auto checkout');
+
+    /** The same flow without a pointer. */
+    await checkout.focus();
+    await page.keyboard.press('Enter');
+    menu = openMenu(page);
+    await expect(menu).toBeVisible();
+    const isolated = menu.getByRole('menuitemradio', { name: /Isolated worktree/ });
+    for (let step = 0; step < 4; step += 1) {
+      await page.keyboard.press('ArrowDown');
+      if ((await isolated.getAttribute('data-active-item')) != null) {
+        break;
+      }
+    }
+    await expect(isolated).toHaveAttribute('data-active-item', 'true');
+    await page.keyboard.press('Enter');
+    await expect(openMenu(page)).toHaveCount(0);
+    await expect(checkout).toContainText('Worktree');
+    await expect(checkout).toBeFocused();
+
+    await page.keyboard.press('ArrowDown');
+    await expect(openMenu(page)).toBeVisible();
+    await closeMenu(page);
+  });
+
+  test('a workspace without worktrees still offers the registered checkout @scenario:checkout-source-without-worktree-support', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, {
+      environments: [
+        singleMachine({
+          defaultWorkspaceId: 'plain',
+          workspaces: [workspace('plain', { repo: 'LibreChat-AI/plain', ref: 'main' })],
+        }),
+      ],
+    });
+    await openCodeChat(page);
+    const checkout = chip(page, CHECKOUT);
+    await expect(checkout).toBeVisible();
+    await expect(checkout).toBeEnabled();
+    await expect(checkout).not.toHaveAttribute('aria-disabled', 'true');
+    await expect(checkout).toContainText('Auto checkout');
+
+    const menu = await openChip(page, CHECKOUT);
+    await expect(menu.getByRole('menuitemradio')).toHaveCount(2);
+    await expect(menu.getByRole('menuitemradio', { name: /^Auto/ })).toBeVisible();
+    await expect(menu.getByRole('menuitemradio', { name: /Registered checkout/ })).toBeVisible();
+    await expect(menu.getByRole('menuitemradio', { name: /Isolated worktree/ })).toHaveCount(0);
+
+    await menu.getByRole('menuitemradio', { name: /Registered checkout/ }).click();
+    await expect(openMenu(page)).toHaveCount(0);
+    await expect(checkout).not.toContainText('Auto checkout');
+    await expect(checkout).toContainText(/Registered|Source/);
+  });
+
+  test('several machines choose their checkout in the workspace menu @scenario:multi-machine-checkout-in-workspace-menu', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine(), secondMachine()] });
+    await openCodeChat(page);
+    await expect(chip(page, WORKSPACE)).toBeVisible();
+    await expect(chip(page, CHECKOUT)).toHaveCount(0);
+
+    let menu = await openChip(page, WORKSPACE);
+    const zima = menu.locator('[data-code-environment-id="env-zimacube"]');
+    const studio = menu.locator('[data-code-environment-id="env-studio"]');
+    for (const environment of [zima, studio]) {
+      await expect(environment.getByRole('menuitemradio', { name: /^Auto/ })).toBeVisible();
+      await expect(
+        environment.getByRole('menuitemradio', { name: /Isolated worktree/ }),
+      ).toBeVisible();
+      await expect(
+        environment.getByRole('menuitemradio', { name: /Registered checkout/ }),
+      ).toBeVisible();
+    }
+    /** Auto is the starting choice; pick another, then return to Auto. */
+    await expect(zima.getByRole('menuitemradio', { name: /^Auto/ })).toBeChecked();
+    await zima.getByRole('menuitemradio', { name: /Registered checkout/ }).click();
+    await closeMenuIfOpen(page);
+
+    menu = await openChip(page, WORKSPACE);
+    const zimaReopened = menu.locator('[data-code-environment-id="env-zimacube"]');
+    await expect(
+      zimaReopened.getByRole('menuitemradio', { name: /Registered checkout/ }),
+    ).toBeChecked();
+    await zimaReopened.getByRole('menuitemradio', { name: /^Auto/ }).click();
+    await closeMenuIfOpen(page);
+
+    menu = await openChip(page, WORKSPACE);
+    await expect(
+      menu
+        .locator('[data-code-environment-id="env-zimacube"]')
+        .getByRole('menuitemradio', { name: /^Auto/ }),
+    ).toBeChecked();
+    await expect(
+      menu
+        .locator('[data-code-environment-id="env-studio"]')
+        .getByRole('menuitemradio', { name: /^Auto/ }),
+    ).toBeChecked();
+  });
+
+  test('an open chip menu does not read as disabled @scenario:open-chip-menu-not-disabled', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()] });
+    await openCodeChat(page);
+
+    for (const selector of [CHECKOUT, APPROVAL]) {
+      const button = chip(page, selector);
+      await openChip(page, selector);
+      await expect(button).toHaveAttribute('aria-expanded', 'true');
+      await expect(button).not.toHaveAttribute('aria-disabled', 'true');
+      await expect
+        .poll(() => button.evaluate((element) => getComputedStyle(element).opacity))
+        .toBe('1');
+      await closeMenu(page);
+    }
+  });
+
+  test('the temporary composer is opaque over the rail @scenario:temporary-composer-is-opaque', async ({
+    page,
+  }) => {
+    await installCodeMocks(page, { environments: [singleMachine()] });
+    await openCodeChat(page);
+    const width = page.viewportSize()?.width ?? 0;
+    if (width >= 768) {
+      await page.getByRole('button', { name: 'Temporary Chat' }).click();
+    } else {
+      await page
+        .getByRole('button', { name: /more|options|menu/i })
+        .first()
+        .click();
+      await page.getByText('Temporary Chat', { exact: true }).click();
+    }
+
+    const surface = page.locator('.rounded-t-theme-surface-lg').first();
+    await expect(surface).toBeVisible();
+    await expect(chip(page, WORKSPACE)).toBeVisible();
+    await expect
+      .poll(() =>
+        surface.evaluate((element) => {
+          const computed = getComputedStyle(element);
+          return { color: computed.backgroundColor, image: computed.backgroundImage };
+        }),
+      )
+      .toEqual({
+        color: expect.stringMatching(/^(rgb\(|oklab\(|oklch\(|color\()(?!.*\/)/),
+        image: expect.stringMatching(/gradient/),
+      });
+    const alpha = await surface.evaluate((element) => {
+      const canvas = document.createElement('canvas');
+      canvas.width = 1;
+      canvas.height = 1;
+      const context = canvas.getContext('2d');
+      if (!context) {
+        return -1;
+      }
+      context.clearRect(0, 0, 1, 1);
+      context.fillStyle = getComputedStyle(element).backgroundColor;
+      context.fillRect(0, 0, 1, 1);
+      return context.getImageData(0, 0, 1, 1).data[3];
+    });
+    expect(alpha).toBe(255);
+
+    /** The mode is persisted locally; leave the account as the suite found it. */
+    await page.evaluate(() => localStorage.setItem('isTemporary', 'false'));
+  });
+});
+
+async function closeMenuIfOpen(page: Page) {
+  if (await openMenu(page).count()) {
+    await page.keyboard.press('Escape');
+  }
+  await expect(openMenu(page)).toHaveCount(0);
+}
diff --git a/e2e/specs/mock/scenarios/codeWorkspaceMocks.ts b/e2e/specs/mock/scenarios/codeWorkspaceMocks.ts
new file mode 100644
index 00000000000..d3caace0a70
--- /dev/null
+++ b/e2e/specs/mock/scenarios/codeWorkspaceMocks.ts
@@ -0,0 +1,338 @@
+import { expect } from '@playwright/test';
+import type { Page, Route } from '@playwright/test';
+
+/**
+ * Route mocks that stand in for a paired code worker. The composer's code
+ * rail (approval mode, workspace, checkout) only renders for an agent that
+ * runs stateful code sessions against an attached environment, so these specs
+ * serve that agent, its environments and their workspaces from `page.route`.
+ */
+
+export type MockWorkspace = {
+  id: string;
+  name: string;
+  repo?: string;
+  ref?: string;
+  /** Advertises `git_worktree` in `workspaceInstances`. */
+  worktree?: boolean;
+  instructionFile?: string;
+};
+
+export type MockEnvironment = {
+  id: string;
+  name: string;
+  workspaces: MockWorkspace[];
+  /** The workspace the environment's agent selects by default. */
+  defaultWorkspaceId: string;
+  allowCheckoutSelection?: boolean;
+};
+
+export type CodeMockOptions = {
+  /** The first environment belongs to the agent Lia, a second one to her subagent. */
+  environments: MockEnvironment[];
+  /** Serve an MCP server with two tools and give Lia both. */
+  mcp?: boolean;
+};
+
+export const LIA_ID = 'agent_liaMockAgent0000001';
+const SUBAGENT_ID = 'agent_zedMockAgent0000002';
+const MCP_SERVER = 'context7';
+
+const sha = (char: string) => char.repeat(64).slice(0, 64);
+const permission = { allowed: ['ask', 'allow'], default: 'ask' };
+
+export function workspace(
+  id: string,
+  options: Partial<Omit<MockWorkspace, 'id' | 'name'>> = {},
+): MockWorkspace {
+  return { id, name: id, ...options };
+}
+
+/** One machine with four workspaces, one of them carrying instruction metadata. */
+export function singleMachine(overrides: Partial<MockEnvironment> = {}): MockEnvironment {
+  return {
+    id: 'env-zimacube',
+    name: 'ZimaCube',
+    defaultWorkspaceId: 'librechat',
+    allowCheckoutSelection: true,
+    workspaces: [
+      workspace('primary', { instructionFile: 'AGENTS.md' }),
+      workspace('librechat', {
+        worktree: true,
+        repo: 'danny-avila/LibreChat',
+        ref: 'dev',
+        instructionFile: 'AGENTS.md',
+      }),
+      workspace('agents', { worktree: true, repo: 'LibreChat-AI/agents', ref: 'main' }),
+      workspace('librechat-ai', { worktree: true, repo: 'LibreChat-AI/librechat.ai', ref: 'main' }),
+    ],
+    ...overrides,
+  };
+}
+
+export function secondMachine(): MockEnvironment {
+  return {
+    id: 'env-studio',
+    name: 'Studio',
+    defaultWorkspaceId: 'docs',
+    allowCheckoutSelection: true,
+    workspaces: [
+      workspace('docs', { worktree: true, repo: 'LibreChat-AI/docs', ref: 'main' }),
+      workspace('notes'),
+    ],
+  };
+}
+
+const configSchema = (environment: MockEnvironment) => ({
+  permissions: { fileWrite: permission, commandExecution: permission },
+  workspaces: { allowCheckoutSelection: environment.allowCheckoutSelection === true },
+});
+
+const publicEnvironment = (environment: MockEnvironment, index: number) => ({
+  id: environment.id,
+  name: environment.name,
+  type: 'attached',
+  default: index === 0,
+  configSchema: configSchema(environment),
+  settings: {},
+});
+
+const status = (environment: MockEnvironment) => ({
+  environmentId: environment.id,
+  status: 'ready',
+  statefulWorkspace: true,
+  sandboxProfile: 'nsjail',
+  runtimes: ['node', 'python'],
+  operations: [
+    'read_file',
+    'search_text',
+    'list_files',
+    'write_file',
+    'preview_edit',
+    'edit_file',
+    'execute_command',
+  ],
+  workspaces: environment.workspaces.map((entry) => ({
+    id: entry.id,
+    name: entry.name,
+    ...(entry.worktree ? { workspaceInstances: ['git_worktree'] } : {}),
+    ...(entry.repo
+      ? {
+          environment: {
+            fingerprint: sha(entry.id.charAt(0) || 'a'),
+            repo: entry.repo,
+            ref: entry.ref,
+            actions: [],
+          },
+        }
+      : {}),
+    instructions: entry.instructionFile
+      ? [{ path: entry.instructionFile, bytes: 15258, sha256: sha('a'), truncated: false }]
+      : [],
+  })),
+});
+
+const mcpTools = [
+  {
+    name: 'resolve-library-id',
+    pluginKey: `resolve-library-id_mcp_${MCP_SERVER}`,
+    description: 'Resolve a library id',
+  },
+  {
+    name: 'query-docs',
+    pluginKey: `query-docs_mcp_${MCP_SERVER}`,
+    description: 'Query library docs',
+  },
+];
+
+function agentRecord(
+  id: string,
+  name: string,
+  environment: MockEnvironment,
+  extra: Record<string, unknown>,
+) {
+  return {
+    id,
+    name,
+    description: 'Coding agent',
+    provider: 'openAI',
+    model: 'gpt-5',
+    instructions: `You are ${name}.`,
+    author: 'mock',
+    category: 'general',
+    tools: ['execute_code'],
+    tool_options: {},
+    model_parameters: {},
+    agent_ids: [],
+    edges: [],
+    stateful_code_sessions: true,
+    code_environment_id: environment.id,
+    code_workspace_id: environment.defaultWorkspaceId,
+    isCollaborative: false,
+    version: 1,
+    projectIds: [],
+    createdAt: '2026-10-01T00:00:00.000Z',
+    updatedAt: '2026-10-05T00:00:00.000Z',
+    _id: id
+      .replace(/[^a-f0-9]/g, 'a')
+      .padEnd(24, 'a')
+      .slice(0, 24),
+    permissions: 15,
+    support_contact: { name: '', email: '' },
+    ...extra,
+  };
+}
+
+const json = (route: Route, body: unknown) =>
+  route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(body) });
+
+type JsonRecord = Record<string, unknown>;
+
+async function fetchRecord(route: Route): Promise<JsonRecord> {
+  const response = await route.fetch();
+  return (await response.json()) as JsonRecord;
+}
+
+/** Install every mock a coding agent needs; call before the first navigation. */
+export async function installCodeMocks(page: Page, options: CodeMockOptions): Promise<void> {
+  const { environments, mcp = false } = options;
+  const [first, second] = environments;
+  const agents: JsonRecord[] = [
+    agentRecord(LIA_ID, 'Lia', first, {
+      tools: mcp
+        ? ['execute_code', ...mcpTools.map(({ pluginKey }) => pluginKey)]
+        : ['execute_code'],
+      agent_ids: second ? [SUBAGENT_ID] : [],
+    }),
+  ];
+  if (second) {
+    agents.push(agentRecord(SUBAGENT_ID, 'Zed', second, {}));
+  }
+  const byId = new Map(agents.map((agent) => [agent.id as string, agent]));
+
+  await page.route('**/api/config', async (route) => {
+    const body = await fetchRecord(route);
+    Object.assign(body, {
+      codeEnvironmentDecisionVersion: 1,
+      codeEnvironmentMoveVersion: 1,
+      codeEnvironmentTransitionVersion: 2,
+      codeWorkspaceRecoveryVersion: 1,
+      codeWorkspaceInheritanceVersion: 1,
+    });
+    await json(route, body);
+  });
+
+  await page.route('**/api/endpoints', async (route) => {
+    const body = await fetchRecord(route);
+    const current = (body.agents ?? {}) as JsonRecord;
+    const capabilities = new Set([
+      ...((current.capabilities as string[] | undefined) ?? []),
+      'execute_code',
+      'stateful_code_sessions',
+      'tools',
+    ]);
+    body.agents = {
+      ...current,
+      order: current.order ?? 0,
+      type: 'agents',
+      capabilities: [...capabilities],
+      statefulCodeSessions: {
+        allowedEnvironments: ['managed', 'attached'],
+        environments: environments.map(publicEnvironment),
+        approvalsEnabled: true,
+        approvalModes: ['ask', 'acceptEdits', 'fullAccess'],
+        allowEnvironmentSelection: false,
+      },
+    };
+    await json(route, body);
+  });
+
+  await page.route(/\/api\/agents(\?[^/]*)?$/, async (route) => {
+    if (route.request().method() !== 'GET') {
+      await route.continue();
+      return;
+    }
+    const body = await fetchRecord(route);
+    if (!route.request().url().includes('cursor=')) {
+      const existing = (body.data as JsonRecord[] | undefined) ?? [];
+      body.data = [...agents, ...existing.filter((entry) => !byId.has(entry.id as string))];
+    }
+    await json(route, body);
+  });
+
+  await page.route(
+    /\/api\/agents\/agent_(lia|zed)MockAgent\d+(\/[a-z]+)?(\?.*)?$/,
+    async (route) => {
+      const url = new URL(route.request().url());
+      const id = url.pathname.split('/')[3];
+      const agent = byId.get(id);
+      const isRead = route.request().method() === 'GET';
+      const suffix = url.pathname.split('/')[4];
+      if (!agent || !isRead || (suffix && !['expanded', 'versions'].includes(suffix))) {
+        await route.continue();
+        return;
+      }
+      await json(route, agent);
+    },
+  );
+
+  await page.route('**/api/code-environments', (route) =>
+    json(route, {
+      environments: environments.map((environment, index) => ({
+        resourceId: `res${index}`,
+        ...publicEnvironment(environment, index),
+        canEdit: true,
+        canDelete: true,
+      })),
+      controlPlanes: [],
+    }),
+  );
+  for (const environment of environments) {
+    await page.route(`**/api/code-environments/${environment.id}/status`, (route) =>
+      json(route, status(environment)),
+    );
+  }
+
+  if (!mcp) {
+    return;
+  }
+  await page.route('**/api/mcp/tools', async (route) => {
+    const body = await fetchRecord(route);
+    body.servers = {
+      ...((body.servers as JsonRecord | undefined) ?? {}),
+      [MCP_SERVER]: {
+        name: MCP_SERVER,
+        icon: '',
+        authenticated: true,
+        authConfig: [],
+        tools: mcpTools,
+      },
+    };
+    await json(route, body);
+  });
+  await page.route('**/api/mcp/servers', async (route) => {
+    const body = await fetchRecord(route);
+    const entry = {
+      serverName: MCP_SERVER,
+      _id: 'bbbbbbbbbbbbbbbbbbbbbbbb',
+      dbId: 'bbbbbbbbbbbbbbbbbbbbbbbb',
+      config: { type: 'streamable-http', url: 'https://mcp.context7.com/mcp', title: MCP_SERVER },
+      url: 'https://mcp.context7.com/mcp',
+      type: 'streamable-http',
+      title: MCP_SERVER,
+      name: MCP_SERVER,
+    };
+    if (Array.isArray(body)) {
+      body.push(entry);
+    } else {
+      ((body.servers as JsonRecord | undefined) ?? body)[MCP_SERVER] = entry;
+    }
+    await json(route, body);
+  });
+}
+
+/** Open a new chat with the mocked coding agent selected and the code rail rendered. */
+export async function openCodeChat(page: Page): Promise<void> {
+  await page.goto(`/c/new?endpoint=agents&agent_id=${LIA_ID}`, { timeout: 15000 });
+  await expect(page.getByTestId('composer-context-rail')).toBeVisible({ timeout: 30000 });
+}
diff --git a/e2e/specs/mock/scenarios/project-rows-spaced.spec.ts b/e2e/specs/mock/scenarios/project-rows-spaced.spec.ts
new file mode 100644
index 00000000000..eb2800fd346
--- /dev/null
+++ b/e2e/specs/mock/scenarios/project-rows-spaced.spec.ts
@@ -0,0 +1,80 @@
+import { expect, test } from '@playwright/test';
+import type { Page } from '@playwright/test';
+import { getAccessToken } from '../helpers';
+
+const ROW_GAP = 4;
+
+type ProjectApi = { _id: string; name: string };
+
+async function apiProject(
+  page: Page,
+  token: string,
+  method: 'POST' | 'DELETE',
+  target: { name: string } | { id: string },
+): Promise<ProjectApi | null> {
+  return page.evaluate(
+    async ({ token: bearer, method: verb, target: body }) => {
+      const url = 'id' in body ? `/api/projects/${encodeURIComponent(body.id)}` : '/api/projects';
+      const response = await fetch(url, {
+        method: verb,
+        headers: { Authorization: `Bearer ${bearer}`, 'Content-Type': 'application/json' },
+        body: 'id' in body ? undefined : JSON.stringify(body),
+      });
+      if (!response.ok) {
+        throw new Error(`${verb} ${url} returned ${response.status}`);
+      }
+      const text = await response.text();
+      return text ? (JSON.parse(text) as ProjectApi) : null;
+    },
+    { token, method, target },
+  );
+}
+
+test.describe('sidebar projects', () => {
+  test('consecutive project rows are separated by a small gap @scenario:project-rows-spaced', async ({
+    page,
+  }) => {
+    test.setTimeout(90000);
+    await page.goto('/c/new', { timeout: 15000 });
+    const token = await getAccessToken(page);
+    const stamp = `${Date.now()}-${Math.floor(Math.random() * 1e4)}`;
+    const names = [`E2E Spaced A ${stamp}`, `E2E Spaced B ${stamp}`];
+    const created: ProjectApi[] = [];
+    try {
+      for (const name of names) {
+        const project = await apiProject(page, token, 'POST', { name });
+        expect(project?._id).toBeTruthy();
+        created.push(project as ProjectApi);
+      }
+      await page.reload();
+
+      if ((page.viewportSize()?.width ?? 0) <= 768) {
+        await page.getByRole('button', { name: 'Open sidebar' }).click();
+      }
+      const toggle = page.getByRole('button', { name: 'Projects', exact: true });
+      await expect(toggle).toBeVisible();
+      if ((await toggle.getAttribute('aria-expanded')) !== 'true') {
+        await toggle.click();
+      }
+      await expect(toggle).toHaveAttribute('aria-expanded', 'true');
+
+      const first = page.locator(`li:has(button:has-text("${names[0]}"))`).last();
+      const second = page.locator(`li:has(button:has-text("${names[1]}"))`).last();
+      await expect(first).toBeVisible();
+      await expect(second).toBeVisible();
+
+      const boxes = await Promise.all([first.boundingBox(), second.boundingBox()]);
+      const [a, b] = boxes;
+      expect(a).not.toBeNull();
+      expect(b).not.toBeNull();
+      /** Newest first, so the second-created project sits above the first. */
+      const [upper, lower] = (a?.y ?? 0) < (b?.y ?? 0) ? [a, b] : [b, a];
+      const gap = (lower?.y ?? 0) - ((upper?.y ?? 0) + (upper?.height ?? 0));
+      expect(Math.abs(gap - ROW_GAP)).toBeLessThanOrEqual(1);
+    } finally {
+      for (const project of created) {
+        await apiProject(page, token, 'DELETE', { id: project._id }).catch(() => undefined);
+      }
+    }
+  });
+});
diff --git a/e2e/specs/mock/scenarios/thought-peek-tools.spec.ts b/e2e/specs/mock/scenarios/thought-peek-tools.spec.ts
new file mode 100644
index 00000000000..312ca6ce0ae
--- /dev/null
+++ b/e2e/specs/mock/scenarios/thought-peek-tools.spec.ts
@@ -0,0 +1,81 @@
+import { expect, test } from '@playwright/test';
+import type { Page } from '@playwright/test';
+import { NEW_CHAT_PATH, messagesView, selectMockEndpoint, sendMessage } from '../helpers';
+
+const ENDPOINT = { label: 'Mock Provider F', model: 'mock-model-f' };
+const MCP_SERVER_TITLE = 'E2E Memory';
+const uniqueLabel = () => `peek-${Date.now()}-${Math.floor(Math.random() * 1e4)}`;
+
+async function enableMemoryServer(page: Page) {
+  await page.getByRole('button', { name: 'Attach and tools' }).click();
+  const item = page
+    .getByRole('dialog', { name: 'Attach and tools' })
+    .getByRole('button', { name: new RegExp(`^${MCP_SERVER_TITLE}\\b`) });
+  await expect(item).toBeVisible();
+  await item.click();
+  await expect(item).toHaveAttribute('aria-pressed', 'true');
+  await page.keyboard.press('Escape');
+  await expect(page.getByRole('listitem', { name: MCP_SERVER_TITLE, exact: true })).toBeVisible();
+}
+
+/** Sample the peek until the final text lands; report whether it was ever visible. */
+async function peekSamples(page: Page, finalText: string) {
+  const peek = messagesView(page).getByTestId('streaming-thought-peek');
+  const final = messagesView(page).getByText(finalText);
+  const samples = { total: 0, visible: 0 };
+  for (let index = 0; index < 300; index += 1) {
+    if (await final.isVisible().catch(() => false)) {
+      break;
+    }
+    samples.total += 1;
+    if (await peek.isVisible().catch(() => false)) {
+      samples.visible += 1;
+    }
+    await page.waitForTimeout(100);
+  }
+  return samples;
+}
+
+test.describe('streaming thought peek', () => {
+  test('the peek shows only while pure reasoning streams @scenario:thought-peek-only-while-thinking', async ({
+    page,
+  }) => {
+    test.setTimeout(180000);
+
+    /** Pure reasoning: the peek sits under the collapsed card. */
+    const reasoning = uniqueLabel();
+    await page.goto(NEW_CHAT_PATH, { timeout: 10000 });
+    await selectMockEndpoint(page, ENDPOINT);
+    const first = await sendMessage(page, `E2E_SLOW_THINK_REPLY:${reasoning}`);
+    expect(first.ok()).toBeTruthy();
+    const pure = await peekSamples(page, `E2E slow think reply done ${reasoning}`);
+    expect(pure.visible, 'peek during pure reasoning').toBeGreaterThan(0);
+    await expect(
+      messagesView(page).getByText(`E2E slow think reply done ${reasoning}`),
+    ).toBeVisible({ timeout: 60000 });
+
+    /** A thought that streams after a tool call never shows the peek. */
+    const afterTool = uniqueLabel();
+    await page.goto(NEW_CHAT_PATH, { timeout: 10000 });
+    /** The endpoint choice persists across new chats on some viewports only. */
+    const trigger = page.getByRole('button', { name: 'Select a model' }).first();
+    await expect(trigger).toBeVisible();
+    if (!(await trigger.textContent())?.includes(ENDPOINT.model)) {
+      await selectMockEndpoint(page, ENDPOINT);
+    }
+    await enableMemoryServer(page);
+    const second = await sendMessage(page, `E2E_TOOL_THEN_THINK_REPLY:${afterTool}`);
+    expect(second.ok()).toBeTruthy();
+    const finalText = `E2E tool then think reply done ${afterTool}`;
+    const toolRun = await peekSamples(page, finalText);
+    expect(toolRun.total, 'sampled while streaming').toBeGreaterThan(5);
+    expect(toolRun.visible, 'peek after a tool call').toBe(0);
+    await expect(messagesView(page).getByText(finalText)).toBeVisible({ timeout: 60000 });
+    /** The run really was a tool call followed by a thought, not a bare reply. */
+    await expect(
+      messagesView(page)
+        .getByRole('button', { name: /Thoughts|Thinking|remember|Memory/i })
+        .first(),
+    ).toBeVisible();
+  });
+});
diff --git a/eslint-suppressions.json b/eslint-suppressions.json
index 306e6909c11..0c430ac9be4 100644
--- a/eslint-suppressions.json
+++ b/eslint-suppressions.json
@@ -170,16 +170,6 @@
       "count": 2
     }
   },
-  "client/src/components/Chat/Input/CodeApprovalMenu.tsx": {
-    "shadcn/no-arbitrary-values": {
-      "count": 1
-    }
-  },
-  "client/src/components/Chat/Input/CodeWorkspaceMenu.tsx": {
-    "shadcn/no-arbitrary-values": {
-      "count": 1
-    }
-  },
   "client/src/components/Chat/Input/ConversationStarters.tsx": {
     "shadcn/no-inline-styles": {
       "count": 2
@@ -1662,9 +1652,6 @@
   "client/src/components/SidePanel/Agents/Tools/SkillsSection.tsx": {
     "shadcn/no-arbitrary-values": {
       "count": 10
-    },
-    "shadcn/no-restyle": {
-      "count": 2
     }
   },
   "client/src/components/SidePanel/Agents/Tools/ToolCard.tsx": {
diff --git a/packages/client/src/components/Radio.tsx b/packages/client/src/components/Radio.tsx
index 4439eba0c09..97148c11372 100644
--- a/packages/client/src/components/Radio.tsx
+++ b/packages/client/src/components/Radio.tsx
@@ -25,9 +25,16 @@ interface RadioProps {
    *  dialog's width on a phone and the choices past the edge become unreachable.
    *  The moving indicator follows across rows; the single-row default is untouched. */
   wrap?: boolean;
+  /** `sm` fits a section header row beside its label. */
+  size?: 'default' | 'sm';
   'aria-labelledby'?: string;
 }
 
+const segmentSizeClasses = {
+  default: 'h-[2.125rem] px-4 text-sm',
+  sm: 'h-7 px-2.5 text-xs',
+} as const;
+
 const Radio: React.NamedExoticComponent<RadioProps> = memo(function Radio({
   options,
   value,
@@ -37,6 +44,7 @@ const Radio: React.NamedExoticComponent<RadioProps> = memo(function Radio({
   buttonClassName = '',
   fullWidth = false,
   wrap = false,
+  size = 'default',
   'aria-labelledby': ariaLabelledBy,
 }: RadioProps) {
   const localize = useLocalize();
@@ -189,7 +197,7 @@ const Radio: React.NamedExoticComponent<RadioProps> = memo(function Radio({
           onClick={() => handleChange(option.value)}
           onKeyDown={(event) => handleKeyDown(event, index)}
           disabled={disabled}
-          className={`focus-visible:ring-focus-control relative z-10 flex h-[2.125rem] items-center justify-center gap-2 rounded-md px-4 text-sm font-medium transition-colors duration-150 focus-visible:ring-2 focus-visible:outline-hidden ${
+          className={`focus-visible:ring-focus-control relative z-10 flex items-center justify-center gap-2 rounded-md font-medium ${segmentSizeClasses[size]} transition-colors duration-150 focus-visible:ring-2 focus-visible:outline-hidden ${
             currentValue === option.value ? 'text-text-primary' : 'text-text-secondary'
           } ${disabled ? 'cursor-not-allowed opacity-50' : ''} ${disabledInkClasses} ${fullWidth ? 'flex-1' : ''} ${buttonClassName}`}
         >