diff --git a/frontend/src/components/layout/Sidebar.tsx b/frontend/src/components/layout/Sidebar.tsx
index 1abf382d..8345b000 100644
--- a/frontend/src/components/layout/Sidebar.tsx
+++ b/frontend/src/components/layout/Sidebar.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import { useNavigate, useLocation } from 'react-router-dom'
 import { LayoutGrid, Box, PenLine, Clock, FileText, Bookmark, Users, Settings, PanelLeftClose, PanelLeftOpen } from 'lucide-react'
+import { cn } from '@/lib/utils'
 import { useUserPreferencesStore } from '@/store/userPreferencesStore'
 import { CategoryList } from '@/components/sidebar/CategoryList'
 import { TagCloud } from '@/components/sidebar/TagCloud'
@@ -115,13 +116,13 @@ export function Sidebar() {
       {sidebarCollapsed ? (
         <>
           {/* Collapsed: icon-only nav */}
-          <div className="px-2 py-3 space-y-1">
-            <NavItem href="/" icon={LayoutGrid} label="" collapsed />
-            <NavItem href="/trees" icon={Box} label="" matchPaths={['/trees', '/flows']} collapsed />
-            <NavItem href="/my-trees" icon={PenLine} label="" collapsed />
-            <NavItem href="/sessions" icon={Clock} label="" badge={activeSessionCount || undefined} collapsed />
-            <NavItem href="/shares" icon={FileText} label="" collapsed />
-            <NavItem href="/step-library" icon={Bookmark} label="" collapsed />
+          <div className="flex flex-col items-center px-1.5 py-3 space-y-1">
+            <NavItem href="/" icon={LayoutGrid} label="Dashboard" collapsed />
+            <NavItem href="/trees" icon={Box} label="All Flows" matchPaths={['/trees', '/flows']} collapsed />
+            <NavItem href="/my-trees" icon={PenLine} label="Flow Editor" collapsed />
+            <NavItem href="/sessions" icon={Clock} label="Sessions" badge={activeSessionCount || undefined} collapsed />
+            <NavItem href="/shares" icon={FileText} label="Exports" collapsed />
+            <NavItem href="/step-library" icon={Bookmark} label="Step Library" collapsed />
           </div>
         </>
       ) : (
@@ -171,7 +172,10 @@ export function Sidebar() {
       <div className="flex-1" />
 
       {/* Footer */}
-      <div className="border-t border-[hsl(var(--border-subtle))] px-3 py-2 space-y-0.5">
+      <div className={cn(
+        "border-t border-[hsl(var(--border-subtle))]",
+        sidebarCollapsed ? "px-1.5 py-2 flex flex-col items-center" : "px-3 py-2 space-y-0.5"
+      )}>
         {!sidebarCollapsed && (
           <>
             <NavItem href="/account" icon={Users} label="Team" />
@@ -180,10 +184,13 @@ export function Sidebar() {
         )}
         <button
           onClick={toggleSidebar}
-          className="flex w-full items-center gap-3 rounded-lg px-3 py-2 text-[0.8125rem] font-medium text-muted-foreground hover:bg-[hsl(var(--sidebar-hover))] hover:text-foreground transition-colors"
+          className={cn(
+            "flex w-full items-center rounded-lg text-[0.8125rem] font-medium text-muted-foreground hover:bg-[hsl(var(--sidebar-hover))] hover:text-foreground transition-colors",
+            sidebarCollapsed ? "justify-center p-2.5" : "gap-3 px-3 py-2"
+          )}
           title={sidebarCollapsed ? 'Expand sidebar' : 'Collapse sidebar'}
         >
-          {sidebarCollapsed ? <PanelLeftOpen size={18} /> : <PanelLeftClose size={18} />}
+          {sidebarCollapsed ? <PanelLeftOpen size={20} /> : <PanelLeftClose size={18} />}
           {!sidebarCollapsed && <span>Collapse</span>}
         </button>
       </div>