diff --git a/packages/ui/src/components/layout/Header.tsx b/packages/ui/src/components/layout/Header.tsx
index a4ceb5ae..71a8827b 100644
--- a/packages/ui/src/components/layout/Header.tsx
+++ b/packages/ui/src/components/layout/Header.tsx
@@ -5,7 +5,7 @@ import {
   TooltipTrigger,
 } from '@/components/ui/tooltip';
 
-import { RiChat4Line, RiCodeLine, RiCommandLine, RiFolder6Line, RiGitBranchLine, RiLayoutLeftLine, RiPlayListAddLine, RiQuestionLine, RiSettings3Line, RiTerminalBoxLine, type RemixiconComponentType } from '@remixicon/react';
+import { RiArrowLeftSLine, RiChat4Line, RiCodeLine, RiCommandLine, RiFolder6Line, RiGitBranchLine, RiLayoutLeftLine, RiPlayListAddLine, RiQuestionLine, RiSettings3Line, RiTerminalBoxLine, type RemixiconComponentType } from '@remixicon/react';
 import { useUIStore, type MainTab } from '@/stores/useUIStore';
 import { useUpdateStore } from '@/stores/useUpdateStore';
 import { useConfigStore } from '@/stores/useConfigStore';
@@ -24,71 +24,12 @@ interface TabConfig {
   showDot?: boolean;
 }
 
-export const FixedSessionsButton: React.FC = () => {
-  const setSessionSwitcherOpen = useUIStore((state) => state.setSessionSwitcherOpen);
-  const toggleSidebar = useUIStore((state) => state.toggleSidebar);
-  const { isMobile } = useDeviceInfo();
-
-  const [isDesktopApp, setIsDesktopApp] = React.useState<boolean>(() => {
-    if (typeof window === 'undefined') {
-      return false;
-    }
-    return typeof (window as typeof window & { opencodeDesktop?: unknown }).opencodeDesktop !== 'undefined';
-  });
-
-  const isMacPlatform = React.useMemo(() => {
-    if (typeof navigator === 'undefined') {
-      return false;
-    }
-    return /Macintosh|Mac OS X/.test(navigator.userAgent || '');
-  }, []);
-
-  React.useEffect(() => {
-    if (typeof window === 'undefined') {
-      return;
-    }
-    const detected = typeof (window as typeof window & { opencodeDesktop?: unknown }).opencodeDesktop !== 'undefined';
-    setIsDesktopApp(detected);
-  }, []);
-
-  const handleOpenSessionSwitcher = React.useCallback(() => {
-    if (isMobile) {
-      setSessionSwitcherOpen(true);
-    } else {
-      toggleSidebar();
-    }
-  }, [isMobile, setSessionSwitcherOpen, toggleSidebar]);
-
-  const headerIconButtonClass = 'app-region-no-drag inline-flex h-9 w-9 items-center justify-center rounded-md gap-2 p-2 typography-ui-label font-medium text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:pointer-events-none disabled:opacity-50 hover:text-foreground hover:bg-secondary/50 transition-colors';
-
-  if (isMobile || !isDesktopApp || !isMacPlatform) {
-    return null;
-  }
-
-  return (
-     <div
-       className="fixed top-[0.375rem] left-[5.25rem] z-[9999]"
-       style={{ pointerEvents: 'auto', ['--padding-scale' as string]: '1' } as React.CSSProperties}
-     >
-       <button
-         type="button"
-         onClick={handleOpenSessionSwitcher}
-         aria-label="Open sessions"
-         className={headerIconButtonClass}
-       >
-         <RiLayoutLeftLine className="h-5 w-5" />
-       </button>
-     </div>
-  );
-};
-
 export const Header: React.FC = () => {
   const setSessionSwitcherOpen = useUIStore((state) => state.setSessionSwitcherOpen);
   const toggleSidebar = useUIStore((state) => state.toggleSidebar);
   const setSettingsDialogOpen = useUIStore((state) => state.setSettingsDialogOpen);
   const toggleCommandPalette = useUIStore((state) => state.toggleCommandPalette);
   const toggleHelpDialog = useUIStore((state) => state.toggleHelpDialog);
-  const isSidebarOpen = useUIStore((state) => state.isSidebarOpen);
   const activeMainTab = useUIStore((state) => state.activeMainTab);
   const setActiveMainTab = useUIStore((state) => state.setActiveMainTab);
 
@@ -171,10 +112,11 @@ export const Header: React.FC = () => {
 
   const desktopPaddingClass = React.useMemo(() => {
     if (isDesktopApp && isMacPlatform) {
-      return isSidebarOpen ? 'pl-2' : 'pl-[8.0rem]';
+      // Always reserve space for Mac traffic lights since header is always on top
+      return 'pl-[5.75rem]';
     }
     return 'pl-3';
-  }, [isDesktopApp, isMacPlatform, isSidebarOpen]);
+  }, [isDesktopApp, isMacPlatform]);
 
   const updateHeaderHeight = React.useCallback(() => {
     if (typeof document === 'undefined') {
@@ -344,18 +286,14 @@ export const Header: React.FC = () => {
       role="tablist"
       aria-label="Main navigation"
     >
-      {!(isDesktopApp && isMacPlatform) && (
-        <>
-          <button
-            type="button"
-            onClick={handleOpenSessionSwitcher}
-            aria-label="Open sessions"
-            className={`${headerIconButtonClass} mr-2`}
-          >
-            <RiLayoutLeftLine className="h-5 w-5" />
-          </button>
-        </>
-      )}
+      <button
+        type="button"
+        onClick={handleOpenSessionSwitcher}
+        aria-label="Open sessions"
+        className={`${headerIconButtonClass} mr-2`}
+      >
+        <RiLayoutLeftLine className="h-5 w-5" />
+      </button>
 
       <div className="flex items-center gap-1 p-1 bg-background/50 rounded-lg">
         {tabs.map((tab) => renderTab(tab))}
@@ -404,14 +342,25 @@ export const Header: React.FC = () => {
   const renderMobile = () => (
     <div className="app-region-drag relative flex items-center justify-between gap-2 px-3 py-2 select-none">
       <div className="flex items-center gap-2">
-        <button
-          onClick={handleOpenSessionSwitcher}
-          className="app-region-no-drag h-9 w-9 p-2 text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-md active:bg-secondary"
-          aria-label="Open sessions"
-        >
-          <RiPlayListAddLine className="h-5 w-5" />
-        </button>
-        {contextUsage && contextUsage.totalTokens > 0 && activeMainTab === 'chat' && (
+        {/* Show back button when sessions sidebar is open, otherwise show sessions toggle */}
+        {isSessionSwitcherOpen ? (
+          <button
+            onClick={() => setSessionSwitcherOpen(false)}
+            className="app-region-no-drag h-9 w-9 p-2 text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-md active:bg-secondary"
+            aria-label="Back"
+          >
+            <RiArrowLeftSLine className="h-5 w-5" />
+          </button>
+        ) : (
+          <button
+            onClick={handleOpenSessionSwitcher}
+            className="app-region-no-drag h-9 w-9 p-2 text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-md active:bg-secondary"
+            aria-label="Open sessions"
+          >
+            <RiPlayListAddLine className="h-5 w-5" />
+          </button>
+        )}
+        {!isSessionSwitcherOpen && contextUsage && contextUsage.totalTokens > 0 && activeMainTab === 'chat' && (
           <ContextUsageDisplay
             totalTokens={contextUsage.totalTokens}
             percentage={contextUsage.percentage}
@@ -421,81 +370,85 @@ export const Header: React.FC = () => {
             isMobile={true}
           />
         )}
+        {isSessionSwitcherOpen && (
+          <span className="typography-ui-label font-semibold text-foreground">Sessions</span>
+        )}
       </div>
 
-      <div className="app-region-no-drag flex items-center gap-1">
+      {/* Hide tabs and right-side buttons when sessions sidebar is open */}
+      {!isSessionSwitcherOpen && (
+        <div className="app-region-no-drag flex items-center gap-1">
+          <div className="flex items-center gap-0.5" role="tablist" aria-label="Main navigation">
+            {tabs.map((tab) => {
+              const isActive = activeMainTab === tab.id;
+              const Icon = tab.icon;
+              return (
+                <Tooltip key={tab.id} delayDuration={500}>
+                  <TooltipTrigger asChild>
+                    <button
+                      type="button"
+                      onClick={() => {
+                        if (isMobile) {
+                          blurActiveElement();
+                        }
+                        setActiveMainTab(tab.id);
+                      }}
+                      aria-label={tab.label}
+                      aria-selected={isActive}
+                      role="tab"
+                      className={cn(
+                        headerIconButtonClass,
+                        'relative',
+                        isActive && 'text-foreground bg-secondary'
+                      )}
+                    >
+                      <Icon className="h-5 w-5" />
+                      {tab.badge !== undefined && tab.badge > 0 && (
+                        <span className="absolute -top-1 -right-1 text-[10px] font-semibold text-primary">
+                          {tab.badge}
+                        </span>
+                      )}
+                      {tab.showDot && (
+                        <span
+                          className="absolute top-1.5 right-1.5 h-2 w-2 rounded-full bg-primary"
+                          aria-label="Changes available"
+                        />
+                      )}
+                    </button>
+                  </TooltipTrigger>
+                  <TooltipContent>
+                    <p>{tab.label}</p>
+                  </TooltipContent>
+                </Tooltip>
+              );
+            })}
+          </div>
 
-        <div className="flex items-center gap-0.5" role="tablist" aria-label="Main navigation">
+          <McpDropdown headerIconButtonClass={headerIconButtonClass} />
 
-          {tabs.map((tab) => {
-            const isActive = activeMainTab === tab.id;
-            const Icon = tab.icon;
-            return (
-              <Tooltip key={tab.id} delayDuration={500}>
-                <TooltipTrigger asChild>
-                  <button
-                    type="button"
-                    onClick={() => {
-                      if (isMobile) {
-                        blurActiveElement();
-                      }
-                      setActiveMainTab(tab.id);
-                    }}
-                    aria-label={tab.label}
-                    aria-selected={isActive}
-                    role="tab"
-                    className={cn(
-                      headerIconButtonClass,
-                      'relative',
-                      isActive && 'text-foreground bg-secondary'
-                    )}
-                  >
-                    <Icon className="h-5 w-5" />
-                    {tab.badge !== undefined && tab.badge > 0 && (
-                      <span className="absolute -top-1 -right-1 text-[10px] font-semibold text-primary">
-                        {tab.badge}
-                      </span>
-                    )}
-                    {tab.showDot && (
-                      <span
-                        className="absolute top-1.5 right-1.5 h-2 w-2 rounded-full bg-primary"
-                        aria-label="Changes available"
-                      />
-                    )}
-                  </button>
-                </TooltipTrigger>
-                <TooltipContent>
-                  <p>{tab.label}</p>
-                </TooltipContent>
-              </Tooltip>
-            );
-          })}
+          <Tooltip delayDuration={500}>
+            <TooltipTrigger asChild>
+              <button
+                type="button"
+                onClick={handleOpenSettings}
+                aria-label="Open settings"
+                className={cn(headerIconButtonClass, 'relative')}
+              >
+                <RiSettings3Line className="h-5 w-5" />
+                {updateAvailable && (
+                  <span
+                    className="absolute top-1.5 right-1.5 h-2 w-2 rounded-full bg-primary"
+                    aria-label="Update available"
+                  />
+                )}
+              </button>
+            </TooltipTrigger>
+            <TooltipContent>
+              <p>{updateAvailable ? 'Settings (Update available)' : 'Settings'}</p>
+            </TooltipContent>
+          </Tooltip>
         </div>
-
-        <McpDropdown headerIconButtonClass={headerIconButtonClass} />
-
-        <Tooltip delayDuration={500}>
-          <TooltipTrigger asChild>
-            <button
-              type="button"
-              onClick={handleOpenSettings}
-              aria-label="Open settings"
-              className={cn(headerIconButtonClass, 'relative')}
-            >
-              <RiSettings3Line className="h-5 w-5" />
-              {updateAvailable && (
-                <span
-                  className="absolute top-1.5 right-1.5 h-2 w-2 rounded-full bg-primary"
-                  aria-label="Update available"
-                />
-              )}
-            </button>
-          </TooltipTrigger>
-          <TooltipContent>
-            <p>{updateAvailable ? 'Settings (Update available)' : 'Settings'}</p>
-          </TooltipContent>
-        </Tooltip>
-      </div>
+      )}
     </div>
   );
 
diff --git a/packages/ui/src/components/layout/MainLayout.tsx b/packages/ui/src/components/layout/MainLayout.tsx
index adf750dc..e8f83392 100644
--- a/packages/ui/src/components/layout/MainLayout.tsx
+++ b/packages/ui/src/components/layout/MainLayout.tsx
@@ -1,12 +1,11 @@
 import React from 'react';
-import { Header, FixedSessionsButton } from './Header';
+import { Header } from './Header';
 import { Sidebar } from './Sidebar';
 import { ErrorBoundary } from '../ui/ErrorBoundary';
 import { CommandPalette } from '../ui/CommandPalette';
 import { HelpDialog } from '../ui/HelpDialog';
 import { SessionSidebar } from '@/components/session/SessionSidebar';
 import { SessionDialogs } from '@/components/session/SessionDialogs';
-import { MobileOverlayPanel } from '@/components/ui/MobileOverlayPanel';
 import { DiffWorkerProvider } from '@/contexts/DiffWorkerProvider';
 import { MultiRunLauncher } from '@/components/multirun';
 
@@ -24,7 +23,6 @@ export const MainLayout: React.FC = () => {
         activeMainTab,
         setIsMobile,
         isSessionSwitcherOpen,
-        setSessionSwitcherOpen,
         isSettingsDialogOpen,
         setSettingsDialogOpen,
         isMultiRunLauncherOpen,
@@ -331,35 +329,34 @@ export const MainLayout: React.FC = () => {
 
                 {isMobile ? (
                 <>
-                    {/* Mobile: Header + content + overlays */}
+                    {/* Mobile: Header + content with drill-down pattern */}
                     {!(isSettingsDialogOpen || isMultiRunLauncherOpen) && <Header />}
                     <div
                         className={cn(
-                            'flex flex-1 overflow-hidden bg-background',
+                            'flex flex-1 overflow-hidden',
                             (isSettingsDialogOpen || isMultiRunLauncherOpen) && 'hidden'
                         )}
                         style={{ paddingTop: 'var(--oc-header-height, 56px)' }}
                     >
-                        <main className="flex-1 overflow-hidden bg-background relative">
-                            <div className={cn('absolute inset-0', !isChatActive && 'invisible')}>
-                                <ErrorBoundary><ChatView /></ErrorBoundary>
+                        {/* Mobile drill-down: show sessions sidebar OR main content */}
+                        {isSessionSwitcherOpen ? (
+                            <div className="flex-1 overflow-hidden bg-sidebar">
+                                <ErrorBoundary><SessionSidebar mobileVariant /></ErrorBoundary>
                             </div>
-                            {secondaryView && (
-                                <div className="absolute inset-0">
-                                    <ErrorBoundary>{secondaryView}</ErrorBoundary>
+                        ) : (
+                            <main className="flex-1 overflow-hidden bg-background relative">
+                                <div className={cn('absolute inset-0', !isChatActive && 'invisible')}>
+                                    <ErrorBoundary><ChatView /></ErrorBoundary>
                                 </div>
-                            )}
-                        </main>
+                                {secondaryView && (
+                                    <div className="absolute inset-0">
+                                        <ErrorBoundary>{secondaryView}</ErrorBoundary>
+                                    </div>
+                                )}
+                            </main>
+                        )}
                     </div>
 
-                    <MobileOverlayPanel
-                        open={isSessionSwitcherOpen}
-                        onClose={() => setSessionSwitcherOpen(false)}
-                        title="Sessions"
-                    >
-                        <SessionSidebar mobileVariant />
-                    </MobileOverlayPanel>
-
                     {/* Mobile multi-run launcher: full screen */}
                     {isMultiRunLauncherOpen && (
                         <div className="absolute inset-0 z-10 bg-background header-safe-area">
@@ -382,18 +379,15 @@ export const MainLayout: React.FC = () => {
                 </>
             ) : (
                 <>
-                    {!isSettingsActive && (
-                        <Sidebar isOpen={isSidebarOpen} isMobile={isMobile}>
-                            <SessionSidebar />
-                        </Sidebar>
-                    )}
-
-                    {/* Main content area */}
+                    {/* Desktop: Header always on top, then Sidebar + Content below */}
                     <div className="flex flex-1 flex-col overflow-hidden relative">
-                        {/* Normal view: Header + content */}
+                        {/* Normal view: Header above Sidebar + content (like SettingsView) */}
                         <div className={cn('absolute inset-0 flex flex-col', (isSettingsActive || isMultiRunLauncherOpen) && 'invisible')}>
                             <Header />
-                            <div className="flex flex-1 overflow-hidden bg-background">
+                            <div className="flex flex-1 overflow-hidden">
+                                <Sidebar isOpen={isSidebarOpen} isMobile={isMobile}>
+                                    <SessionSidebar />
+                                </Sidebar>
                                 <main className="flex-1 overflow-hidden bg-background relative">
                                     <div className={cn('absolute inset-0', !isChatActive && 'invisible')}>
                                         <ErrorBoundary><ChatView /></ErrorBoundary>
@@ -430,8 +424,6 @@ export const MainLayout: React.FC = () => {
                 </>
             )}
 
-            {/* Hide fixed sessions button when settings is open */}
-            {!isSettingsActive && <FixedSessionsButton />}
         </div>
     </DiffWorkerProvider>
     );
diff --git a/packages/ui/src/components/layout/Sidebar.tsx b/packages/ui/src/components/layout/Sidebar.tsx
index 96846f67..9ebf7c9a 100644
--- a/packages/ui/src/components/layout/Sidebar.tsx
+++ b/packages/ui/src/components/layout/Sidebar.tsx
@@ -11,7 +11,6 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
 export const SIDEBAR_CONTENT_WIDTH = 264;
 const SIDEBAR_MIN_WIDTH = 200;
 const SIDEBAR_MAX_WIDTH = 500;
-const MAC_TITLEBAR_SAFE_AREA = 40;
 const CHECK_FOR_UPDATES_EVENT = 'openchamber:check-for-updates';
 
 interface SidebarProps {
@@ -40,12 +39,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, isMobile, children })
         return typeof (window as typeof window & { opencodeDesktop?: unknown }).opencodeDesktop !== 'undefined';
     });
 
-    const isMacPlatform = React.useMemo(() => {
-        if (typeof navigator === 'undefined') {
-            return false;
-        }
-        return /Macintosh|Mac OS X/.test(navigator.userAgent || '');
-    }, []);
+
 
     React.useEffect(() => {
         if (typeof window === 'undefined') {
@@ -127,23 +121,6 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, isMobile, children })
         }
     }, [isMobile, isResizing]);
 
-    const handleTitlebarDragStart = React.useCallback(async (e: React.MouseEvent) => {
-
-        if (e.button !== 0) {
-            return;
-        }
-
-        if (isDesktopApp) {
-            try {
-                const { getCurrentWindow } = await import('@tauri-apps/api/window');
-                const window = getCurrentWindow();
-                await window.startDragging();
-            } catch (error) {
-                console.error('Failed to start window dragging from sidebar:', error);
-            }
-        }
-    }, [isDesktopApp]);
-
     if (isMobile) {
 
         return null;
@@ -153,7 +130,6 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, isMobile, children })
         SIDEBAR_MAX_WIDTH,
         Math.max(SIDEBAR_MIN_WIDTH, sidebarWidth || SIDEBAR_CONTENT_WIDTH)
     ) : 0;
-    const shouldRenderTitlebarSpacer = isDesktopApp && isMacPlatform;
 
     const handlePointerDown = (event: React.PointerEvent) => {
         if (!isOpen) {
@@ -203,14 +179,6 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, isMobile, children })
                 style={{ width: `${appliedWidth}px`, overflowX: 'hidden' }}
                 aria-hidden={!isOpen}
             >
-                {shouldRenderTitlebarSpacer && (
-                    <div
-                        className="flex-shrink-0 select-none"
-                        style={{ height: `${MAC_TITLEBAR_SAFE_AREA}px` }}
-                        onMouseDown={handleTitlebarDragStart}
-                        aria-hidden
-                    />
-                )}
                 <div className="flex-1 overflow-hidden">
                     <ErrorBoundary>{children}</ErrorBoundary>
                 </div>