fix(header): tab title fade is resting-state only; clearer separators

The title fade no longer sits on controls: it lifts while the tab is
hovered or its controls/menu are open (hard clip instead) and is not
applied at all while the active tab renames. The active tab clips its
title instead of showing an ellipsis, matching inactive tabs. Tab
separators drop the extra transparency that made them nearly
invisible.

packages/ui/src/components/layout/Header.tsx

@@ -1855,7 +1855,7 @@ export const Header: React.FC = () => {
                   </button>
                 </form>
               ) : (
-                <span className="truncate text-[13px] font-medium leading-4 text-foreground max-w-full">
+                <span className="block overflow-hidden whitespace-nowrap text-[13px] font-medium leading-4 text-foreground max-w-full">
                   {isNewSessionDraftOpen ? t('sessions.switcher.draftTitle') : currentSessionTitle}
                 </span>
               )}

packages/ui/src/components/layout/SessionTabsStrip.tsx

@@ -219,8 +219,9 @@ const SessionTabItem: React.FC<{
                       onClose(tab.id);
                     }
                   }}
+                  data-controls-open={overlayVisible ? 'true' : 'false'}
                   className={cn(
-                    'group/session-tab relative flex h-7 w-full min-w-0 select-none items-center rounded-md px-2',
+                    'session-tab group/session-tab relative flex h-7 w-full min-w-0 select-none items-center rounded-md px-2',
                     isActive
                       ? 'bg-interactive-selection'
                       : cn(
@@ -235,7 +236,11 @@ const SessionTabItem: React.FC<{
                     overlayVisible && 'pr-10',
                   )}
                   >
-                    <div className="session-tab-title min-w-0 flex-1 overflow-hidden whitespace-nowrap">
+                    <div className={cn(
+                      'min-w-0 flex-1 overflow-hidden whitespace-nowrap',
+                      !suppressControls && 'session-tab-title',
+                    )}
+                    >
                       {isActive ? children : (
                         <span className="text-[13px] font-medium leading-4">{title}</span>
                       )}

packages/ui/src/index.css

@@ -1804,7 +1804,6 @@ html.desktop-runtime .markdown-content [data-openchamber-file-link="true"] {
   height: 12px;
   border-radius: 9999px;
   background: var(--border);
-  opacity: 0.6;
 }
 .session-tab-slot[data-active='true'] + .session-tab-slot::before,
 .session-tab-slot:not([data-active='true']):hover::before,
@@ -1826,8 +1825,16 @@ html.desktop-runtime .markdown-content [data-openchamber-file-link="true"] {
 
 /* Session tab titles: fade out instead of "..." — the ellipsis reads as
    clutter next to the tab's status dot and hover controls. Short titles
-   never reach the fade zone (the span spans the tab, not the text). */
+   never reach the fade zone (the span spans the tab, not the text). The
+   fade belongs to the resting state only: while the tab is hovered or its
+   controls are open, the title clips hard so the smear never sits next to
+   the menu/close/rename controls. */
 .session-tab-title {
   -webkit-mask-image: linear-gradient(to right, black calc(100% - 14px), transparent);
   mask-image: linear-gradient(to right, black calc(100% - 14px), transparent);
 }
+.session-tab:hover .session-tab-title,
+.session-tab[data-controls-open='true'] .session-tab-title {
+  -webkit-mask-image: none;
+  mask-image: none;
+}