diff --git a/apps/desktop/src/routes/app/main/_layout.index.tsx b/apps/desktop/src/routes/app/main/_layout.index.tsx
index 00ef2b4840..8044b4c62a 100644
--- a/apps/desktop/src/routes/app/main/_layout.index.tsx
+++ b/apps/desktop/src/routes/app/main/_layout.index.tsx
@@ -72,7 +72,7 @@ function Component() {
 
   return (
     <div
-      className="flex h-full gap-1 overflow-hidden p-1"
+      className="flex h-full gap-1 overflow-hidden bg-stone-50 p-1"
       data-testid="main-app-shell"
     >
       {leftsidebar.expanded && !isOnboarding && <LeftSidebar />}
diff --git a/apps/desktop/src/session/components/outer-header/listen.tsx b/apps/desktop/src/session/components/outer-header/listen.tsx
index 754fe48f22..b64c2b4770 100644
--- a/apps/desktop/src/session/components/outer-header/listen.tsx
+++ b/apps/desktop/src/session/components/outer-header/listen.tsx
@@ -1,4 +1,3 @@
-import { useHover } from "@uidotdev/usehooks";
 import { MicOff } from "lucide-react";
 import { useCallback } from "react";
 
@@ -12,7 +11,6 @@ import { cn } from "@hypr/utils";
 
 import {
   ActionableTooltipContent,
-  RecordingIcon,
   useHasTranscript,
   useListenButtonState,
 } from "~/session/components/shared";
@@ -25,7 +23,7 @@ export function ListenButton({ sessionId }: { sessionId: string }) {
   const hasTranscript = useHasTranscript(sessionId);
 
   if (!shouldRender) {
-    return <InMeetingIndicator sessionId={sessionId} />;
+    return <DancingSticksIndicator sessionId={sessionId} />;
   }
 
   if (hasTranscript) {
@@ -57,7 +55,6 @@ function StartButton({ sessionId }: { sessionId: string }) {
         "disabled:pointer-events-none disabled:opacity-50",
       ])}
     >
-      <RecordingIcon />
       <span className="whitespace-nowrap text-neutral-900 hover:text-neutral-800">
         Resume listening
       </span>
@@ -95,83 +92,28 @@ function StartButton({ sessionId }: { sessionId: string }) {
   );
 }
 
-function InMeetingIndicator({ sessionId }: { sessionId: string }) {
-  const [ref, hovered] = useHover();
-
-  const { mode, stop, amplitude, muted } = useListener((state) => ({
+function DancingSticksIndicator({ sessionId }: { sessionId: string }) {
+  const { mode, amplitude, muted } = useListener((state) => ({
     mode: state.getSessionMode(sessionId),
-    stop: state.stop,
     amplitude: state.live.amplitude,
     muted: state.live.muted,
   }));
 
-  const active = mode === "active" || mode === "finalizing";
-  const finalizing = mode === "finalizing";
+  const active = mode === "active";
 
   if (!active) {
     return null;
   }
 
   return (
-    <Tooltip>
-      <TooltipTrigger asChild>
-        <button
-          ref={ref as React.Ref<HTMLButtonElement>}
-          type="button"
-          onClick={finalizing ? undefined : stop}
-          disabled={finalizing}
-          className={cn([
-            "inline-flex items-center justify-center rounded-md text-sm font-medium",
-            finalizing
-              ? ["text-neutral-500", "bg-neutral-100", "cursor-wait"]
-              : [
-                  "text-red-500 hover:text-red-600",
-                  "bg-red-50 hover:bg-red-100",
-                ],
-            "h-7 w-20",
-            "disabled:pointer-events-none disabled:opacity-50",
-          ])}
-          aria-label={finalizing ? "Finalizing" : "Stop listening"}
-        >
-          {finalizing ? (
-            <div className="flex items-center gap-1.5">
-              <span className="animate-pulse">...</span>
-            </div>
-          ) : (
-            <>
-              <div
-                className={cn([
-                  "flex items-center gap-1.5",
-                  hovered ? "hidden" : "flex",
-                ])}
-              >
-                {muted && <MicOff size={14} />}
-                <DancingSticks
-                  amplitude={Math.min(
-                    (amplitude.mic + amplitude.speaker) / 2000,
-                    1,
-                  )}
-                  color="#ef4444"
-                  height={18}
-                  width={60}
-                />
-              </div>
-              <div
-                className={cn([
-                  "flex items-center gap-1.5",
-                  hovered ? "flex" : "hidden",
-                ])}
-              >
-                <span className="size-2 rounded-none bg-red-500" />
-                <span className="text-xs">Stop</span>
-              </div>
-            </>
-          )}
-        </button>
-      </TooltipTrigger>
-      <TooltipContent side="bottom">
-        {finalizing ? "Finalizing..." : "Stop listening"}
-      </TooltipContent>
-    </Tooltip>
+    <div className="flex items-center gap-1.5 px-2">
+      {muted && <MicOff size={14} className="text-red-500" />}
+      <DancingSticks
+        amplitude={Math.min((amplitude.mic + amplitude.speaker) / 2000, 1)}
+        color="#ef4444"
+        height={18}
+        width={60}
+      />
+    </div>
   );
 }
diff --git a/apps/desktop/src/session/components/shared.tsx b/apps/desktop/src/session/components/shared.tsx
index 5e9f1305ed..cfff13b0cc 100644
--- a/apps/desktop/src/session/components/shared.tsx
+++ b/apps/desktop/src/session/components/shared.tsx
@@ -59,7 +59,7 @@ export function useCurrentNoteTab(
 }
 
 export function RecordingIcon() {
-  return <div className="size-2 rounded-full bg-red-500" />;
+  return <div className="size-3 rounded-full bg-red-500" />;
 }
 
 export function useListenButtonState(sessionId: string) {
diff --git a/apps/desktop/src/shared/main/header-listen-button.tsx b/apps/desktop/src/shared/main/header-listen-button.tsx
new file mode 100644
index 0000000000..8612b9b325
--- /dev/null
+++ b/apps/desktop/src/shared/main/header-listen-button.tsx
@@ -0,0 +1,213 @@
+import { ChevronDownIcon } from "lucide-react";
+import { AnimatePresence, motion } from "motion/react";
+import { useCallback, useEffect, useState } from "react";
+
+import { Button } from "@hypr/ui/components/ui/button";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@hypr/ui/components/ui/popover";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@hypr/ui/components/ui/tooltip";
+import { cn } from "@hypr/utils";
+
+import { useNewNote, useNewNoteAndListen } from "./useNewNote";
+
+import { useTabs } from "~/store/zustand/tabs";
+import { useListener } from "~/stt/contexts";
+
+const LABEL_WIDTH_ESTIMATE_PX = 90;
+
+export function HeaderListenButton({
+  contentOverflowPx,
+}: {
+  contentOverflowPx: number;
+}) {
+  const liveSessionId = useListener((state) => state.live.sessionId);
+  const liveStatus = useListener((state) => state.live.status);
+  const stop = useListener((state) => state.stop);
+
+  const isActive = liveStatus === "active";
+  const isFinalizing = liveStatus === "finalizing";
+
+  const select = useTabs((state) => state.select);
+  const tabs = useTabs((state) => state.tabs);
+
+  const handleStop = useCallback(() => {
+    stop();
+    if (liveSessionId) {
+      const tab = tabs.find(
+        (t) => t.type === "sessions" && t.id === liveSessionId,
+      );
+      if (tab) {
+        select(tab);
+      }
+    }
+  }, [stop, liveSessionId, tabs, select]);
+
+  if (isActive || isFinalizing) {
+    return (
+      <StopButton
+        compact={contentOverflowPx > 0}
+        finalizing={isFinalizing}
+        onStop={handleStop}
+      />
+    );
+  }
+
+  return <DefaultButton contentOverflowPx={contentOverflowPx} />;
+}
+
+function StopButton({
+  compact,
+  finalizing,
+  onStop,
+}: {
+  compact: boolean;
+  finalizing: boolean;
+  onStop: () => void;
+}) {
+  return (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <button
+          onClick={finalizing ? undefined : onStop}
+          disabled={finalizing}
+          className={cn([
+            "flex h-7 items-center gap-1.5 rounded-full",
+            compact ? "px-3" : "pl-3 pr-4",
+            finalizing
+              ? "cursor-wait bg-neutral-100 text-neutral-500"
+              : "cursor-pointer bg-red-500 text-white transition-colors hover:bg-red-600",
+            "disabled:pointer-events-none disabled:opacity-50",
+          ])}
+        >
+          {finalizing
+            ? <span className="animate-pulse text-sm">...</span>
+            : (
+              <>
+                <div className="size-2.5 shrink-0 rounded-sm bg-white" />
+                <AnimatePresence initial={false}>
+                  {!compact && (
+                    <motion.span
+                      initial={{ width: 0, opacity: 0 }}
+                      animate={{ width: "auto", opacity: 1 }}
+                      exit={{ width: 0, opacity: 0 }}
+                      transition={{ duration: 0.15 }}
+                      className="overflow-hidden text-xs font-medium whitespace-nowrap"
+                    >
+                      Stop
+                    </motion.span>
+                  )}
+                </AnimatePresence>
+              </>
+            )}
+        </button>
+      </TooltipTrigger>
+      <TooltipContent side="bottom">
+        {finalizing ? "Finalizing..." : "Stop listening"}
+      </TooltipContent>
+    </Tooltip>
+  );
+}
+
+function DefaultButton({ contentOverflowPx }: { contentOverflowPx: number }) {
+  const [dropdownOpen, setDropdownOpen] = useState(false);
+  const [showLabel, setShowLabel] = useState(true);
+
+  useEffect(() => {
+    if (showLabel) {
+      if (contentOverflowPx > 0) {
+        setShowLabel(false);
+      }
+    } else {
+      if (contentOverflowPx + LABEL_WIDTH_ESTIMATE_PX <= 0) {
+        setShowLabel(true);
+      }
+    }
+  }, [contentOverflowPx, showLabel]);
+
+  const handleNewRecording = useNewNoteAndListen();
+
+  return (
+    <div className="flex items-center">
+      <button
+        onClick={handleNewRecording}
+        className={cn([
+          "flex h-7 cursor-pointer items-center gap-1.5 rounded-l-full pr-1.5 pl-3",
+          "bg-neutral-800 text-white",
+          "transition-colors hover:bg-neutral-700",
+        ])}
+      >
+        <div className="size-2.5 rounded-full bg-red-500" />
+        <AnimatePresence initial={false}>
+          {showLabel && (
+            <motion.span
+              initial={{ width: 0, opacity: 0 }}
+              animate={{ width: "auto", opacity: 1 }}
+              exit={{ width: 0, opacity: 0 }}
+              transition={{ duration: 0.15 }}
+              className="overflow-hidden text-xs font-medium whitespace-nowrap"
+            >
+              New meeting
+            </motion.span>
+          )}
+        </AnimatePresence>
+      </button>
+      <Popover open={dropdownOpen} onOpenChange={setDropdownOpen}>
+        <PopoverTrigger asChild>
+          <button
+            className={cn([
+              "flex h-7 cursor-pointer items-center rounded-r-full pr-2 pl-1",
+              "bg-neutral-800 text-white",
+              "transition-colors hover:bg-neutral-700",
+              "border-l border-neutral-600",
+            ])}
+          >
+            <ChevronDownIcon size={14} />
+          </button>
+        </PopoverTrigger>
+        <PopoverContent
+          side="bottom"
+          align="end"
+          sideOffset={4}
+          className="w-44 rounded-xl p-1.5"
+        >
+          <UploadOptions onDone={() => setDropdownOpen(false)} />
+        </PopoverContent>
+      </Popover>
+    </div>
+  );
+}
+
+function UploadOptions({ onDone }: { onDone: () => void }) {
+  const handleNewNote = useNewNote({ behavior: "new" });
+
+  const handleOption = useCallback(() => {
+    onDone();
+    handleNewNote();
+  }, [onDone, handleNewNote]);
+
+  return (
+    <div className="flex flex-col gap-1">
+      <Button
+        variant="ghost"
+        className="h-9 justify-center px-3 whitespace-nowrap"
+        onClick={handleOption}
+      >
+        <span className="text-sm">Upload audio</span>
+      </Button>
+      <Button
+        variant="ghost"
+        className="h-9 justify-center px-3 whitespace-nowrap"
+        onClick={handleOption}
+      >
+        <span className="text-sm">Upload transcript</span>
+      </Button>
+    </div>
+  );
+}
diff --git a/apps/desktop/src/shared/main/index.tsx b/apps/desktop/src/shared/main/index.tsx
index bc6cc366b1..38044a2eb9 100644
--- a/apps/desktop/src/shared/main/index.tsx
+++ b/apps/desktop/src/shared/main/index.tsx
@@ -7,7 +7,7 @@ import {
   PlusIcon,
 } from "lucide-react";
 import { Reorder } from "motion/react";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
 import { useResizeObserver } from "usehooks-ts";
 import { useShallow } from "zustand/shallow";
@@ -23,6 +23,7 @@ import {
 import { cn } from "@hypr/utils";
 
 import { TabContentEmpty, TabItemEmpty } from "./empty";
+import { HeaderListenButton } from "./header-listen-button";
 import { useNewNote, useNewNoteAndListen } from "./useNewNote";
 
 import { TabContentAI, TabItemAI } from "~/ai";
@@ -40,11 +41,9 @@ import { TabContentOnboarding, TabItemOnboarding } from "~/onboarding";
 import { TabContentPlugin, TabItemPlugin } from "~/plugins";
 import { loadPlugins } from "~/plugins/loader";
 import { TabContentSearch, TabItemSearch } from "~/search/advanced";
-import { Search } from "~/search/components/search";
 import { TabContentNote, TabItemNote } from "~/session";
 import { useCaretPosition } from "~/session/components/caret-position-context";
 import { TabContentSettings, TabItemSettings } from "~/settings";
-import { useNativeContextMenu } from "~/shared/hooks/useNativeContextMenu";
 import { NotificationBadge } from "~/shared/ui/notification-badge";
 import { TrafficLights } from "~/shared/ui/traffic-lights";
 import { TabContentChangelog, TabItemChangelog } from "~/sidebar/changelog";
@@ -118,46 +117,11 @@ function Header({ tabs }: { tabs: Tab[] }) {
     })),
   );
 
-  const liveSessionId = useListener((state) => state.live.sessionId);
-  const liveStatus = useListener((state) => state.live.status);
-  const isListening = liveStatus === "active" || liveStatus === "finalizing";
-
-  const listeningTab = useMemo(
-    () =>
-      isListening && liveSessionId
-        ? tabs.find((t) => t.type === "sessions" && t.id === liveSessionId)
-        : null,
-    [isListening, liveSessionId, tabs],
-  );
-  const regularTabs = useMemo(
-    () =>
-      listeningTab
-        ? tabs.filter((t) => !(t.type === "sessions" && t.id === liveSessionId))
-        : tabs,
-    [listeningTab, tabs, liveSessionId],
-  );
-
   const tabsScrollContainerRef = useRef<HTMLDivElement>(null);
   const handleNewEmptyTab = useNewEmptyTab();
-  const handleNewNote = useNewNote({ behavior: "new" });
-  const handleNewNoteAndListen = useNewNoteAndListen();
-  const showNewTabMenu = useNativeContextMenu([
-    { id: "empty-tab", text: "Open Empty Tab", action: handleNewEmptyTab },
-    { id: "new-note", text: "Create New Note", action: handleNewNote },
-    {
-      id: "new-note-listen",
-      text: "Create and Start Listening",
-      action: handleNewNoteAndListen,
-    },
-  ]);
-  const [isSearchManuallyExpanded, setIsSearchManuallyExpanded] =
-    useState(false);
-  const scrollState = useScrollState(
-    tabsScrollContainerRef,
-    regularTabs.length,
-  );
+  const scrollState = useScrollState(tabsScrollContainerRef, tabs.length);
 
-  const setTabRef = useScrollActiveTabIntoView(regularTabs);
+  const setTabRef = useScrollActiveTabIntoView(tabs);
   useTabsShortcuts();
 
   return (
@@ -212,53 +176,27 @@ function Header({ tabs }: { tabs: Tab[] }) {
         </div>
       )}
 
-      {listeningTab && (
-        <div className="mr-1 flex h-full shrink-0 items-center">
-          <TabItem
-            tab={listeningTab}
-            handleClose={close}
-            handleSelect={select}
-            handleCloseOthersCallback={closeOthers}
-            handleCloseAll={closeAll}
-            handlePin={pin}
-            handleUnpin={unpin}
-            tabIndex={1}
-            pendingCloseConfirmationTab={pendingCloseConfirmationTab}
-            setPendingCloseConfirmationTab={setPendingCloseConfirmationTab}
-          />
-        </div>
-      )}
-
-      <div className="relative h-full min-w-0">
+      <div className="relative h-full min-w-0 flex-1">
         <div
           ref={tabsScrollContainerRef}
           data-tauri-drag-region
           className={cn([
             "[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
-            "h-full w-full overflow-x-auto overflow-y-hidden",
+            "flex h-full w-full overflow-x-auto overflow-y-hidden",
           ])}
         >
           <Reorder.Group
             key={leftsidebar.expanded ? "expanded" : "collapsed"}
             as="div"
             axis="x"
-            values={regularTabs}
+            values={tabs}
             onReorder={reorder}
             className="flex h-full w-max gap-1"
           >
-            {regularTabs.map((tab, index) => {
-              const isLastTab = index === regularTabs.length - 1;
-              const shortcutIndex = listeningTab
-                ? index < 7
-                  ? index + 2
-                  : isLastTab
-                    ? 9
-                    : undefined
-                : index < 8
-                  ? index + 1
-                  : isLastTab
-                    ? 9
-                    : undefined;
+            {tabs.map((tab, index) => {
+              const isLastTab = index === tabs.length - 1;
+              const shortcutIndex =
+                index < 8 ? index + 1 : isLastTab ? 9 : undefined;
 
               return (
                 <Reorder.Item
@@ -288,41 +226,40 @@ function Header({ tabs }: { tabs: Tab[] }) {
               );
             })}
           </Reorder.Group>
+
+          <div className="inline-flex h-full items-center px-1">
+            <Button
+              onClick={isOnboarding ? undefined : handleNewEmptyTab}
+              disabled={isOnboarding}
+              variant="ghost"
+              size="icon"
+              className={cn([
+                "text-neutral-600",
+                isOnboarding && "cursor-not-allowed opacity-40",
+              ])}
+            >
+              <PlusIcon size={16} />
+            </Button>
+          </div>
         </div>
         {!scrollState.atStart && (
-          <div className="pointer-events-none absolute top-0 left-0 z-20 h-full w-8 bg-linear-to-r from-white to-transparent" />
+          <div className="pointer-events-none absolute top-0 left-0 z-20 h-full w-8 bg-linear-to-r from-stone-50 to-transparent" />
         )}
         {!scrollState.atEnd && (
-          <div className="pointer-events-none absolute top-0 right-0 z-20 h-full w-8 bg-linear-to-l from-white to-transparent" />
+          <div className="pointer-events-none absolute top-0 right-0 z-20 h-full w-8 bg-linear-to-l from-stone-50 to-transparent" />
         )}
       </div>
 
       <div
         data-tauri-drag-region
-        className="flex h-full flex-1 items-center justify-between"
+        className="flex h-full items-center gap-1 pl-1"
       >
-        {!isSearchManuallyExpanded && (
-          <Button
-            onClick={isOnboarding ? undefined : handleNewEmptyTab}
-            onContextMenu={isOnboarding ? undefined : showNewTabMenu}
-            disabled={isOnboarding}
-            variant="ghost"
-            size="icon"
-            className={cn([
-              "text-neutral-600",
-              isOnboarding && "cursor-not-allowed opacity-40",
-            ])}
-          >
-            <PlusIcon size={16} />
-          </Button>
+        <Update />
+        {!isOnboarding && (
+          <HeaderListenButton
+            contentOverflowPx={scrollState.contentOverflowPx}
+          />
         )}
-
-        <div className="ml-auto flex h-full items-center gap-1">
-          <Update />
-          {!isOnboarding && (
-            <Search onManualExpandChange={setIsSearchManuallyExpanded} />
-          )}
-        </div>
       </div>
     </div>
   );
@@ -681,7 +618,7 @@ export function StandardTabWrapper({
 }) {
   return (
     <div className="flex h-full flex-col">
-      <div className="relative flex flex-1 flex-col overflow-hidden rounded-xl border border-neutral-200">
+      <div className="relative flex flex-1 flex-col overflow-hidden rounded-xl border border-neutral-200 bg-white">
         {children}
         {floatingButton}
         <StandardTabChatButton showTimeline={showTimeline} />
@@ -714,6 +651,7 @@ function useScrollState(
   const [scrollState, setScrollState] = useState({
     atStart: true,
     atEnd: true,
+    contentOverflowPx: 0,
   });
 
   const updateScrollState = useCallback(() => {
@@ -722,12 +660,21 @@ function useScrollState(
 
     const { scrollLeft, scrollWidth, clientWidth } = container;
     const hasOverflow = scrollWidth > clientWidth + 1;
+    const contentWidth = Array.from(container.children).reduce(
+      (sum, child) => sum + child.getBoundingClientRect().width,
+      0,
+    );
     const newState = {
       atStart: !hasOverflow || scrollLeft <= 1,
       atEnd: !hasOverflow || scrollLeft + clientWidth >= scrollWidth - 1,
+      contentOverflowPx: Math.round(contentWidth - clientWidth),
     };
     setScrollState((prev) => {
-      if (prev.atStart === newState.atStart && prev.atEnd === newState.atEnd) {
+      if (
+        prev.atStart === newState.atStart &&
+        prev.atEnd === newState.atEnd &&
+        prev.contentOverflowPx === newState.contentOverflowPx
+      ) {
         return prev;
       }
       return newState;
diff --git a/apps/desktop/src/shared/tabs.tsx b/apps/desktop/src/shared/tabs.tsx
index ec8805c8fe..b80017c37d 100644
--- a/apps/desktop/src/shared/tabs.tsx
+++ b/apps/desktop/src/shared/tabs.tsx
@@ -37,8 +37,18 @@ const accentColors: Record<
   }
 > = {
   neutral: {
-    selected: ["bg-neutral-50", "text-black", "border-stone-400"],
-    unselected: ["bg-neutral-50", "text-neutral-500", "border-transparent"],
+    selected: [
+      "bg-neutral-50",
+      "text-black",
+      "border-stone-400",
+      "hover:bg-stone-100",
+    ],
+    unselected: [
+      "bg-neutral-50",
+      "text-neutral-500",
+      "border-transparent",
+      "hover:bg-stone-100",
+    ],
     hover: {
       selected: "text-neutral-700 hover:text-neutral-900",
       unselected: "text-neutral-500 hover:text-neutral-700",
diff --git a/apps/desktop/src/sidebar/index.tsx b/apps/desktop/src/sidebar/index.tsx
index cc3fa8f36b..6665408b80 100644
--- a/apps/desktop/src/sidebar/index.tsx
+++ b/apps/desktop/src/sidebar/index.tsx
@@ -1,7 +1,13 @@
 import { useQuery } from "@tanstack/react-query";
 import { platform } from "@tauri-apps/plugin-os";
-import { AxeIcon, PanelLeftCloseIcon } from "lucide-react";
-import { lazy, Suspense, useState } from "react";
+import {
+  AxeIcon,
+  Loader2Icon,
+  PanelLeftCloseIcon,
+  SearchIcon,
+  XIcon,
+} from "lucide-react";
+import { lazy, Suspense, useMemo, useRef, useState } from "react";
 
 import { Button } from "@hypr/ui/components/ui/button";
 import { Kbd } from "@hypr/ui/components/ui/kbd";
@@ -20,6 +26,7 @@ import { useShell } from "~/contexts/shell";
 import { SearchResults } from "~/search/components/sidebar";
 import { useSearch } from "~/search/contexts/ui";
 import { TrafficLights } from "~/shared/ui/traffic-lights";
+import { useTabs } from "~/store/zustand/tabs";
 import { commands } from "~/types/tauri.gen";
 
 const DevtoolView = lazy(() =>
@@ -48,7 +55,6 @@ export function LeftSidebar() {
           "h-9 w-full py-1",
           isLinux ? "justify-between pl-3" : "justify-end pl-20",
           "shrink-0",
-          "rounded-xl bg-neutral-50",
         ])}
       >
         {isLinux && <TrafficLights />}
@@ -80,6 +86,8 @@ export function LeftSidebar() {
         </div>
       </header>
 
+      <SidebarSearchInput />
+
       <div className="flex flex-1 flex-col gap-1 overflow-hidden">
         <div className="relative min-h-0 flex-1 overflow-hidden">
           {leftsidebar.showDevtool ? (
@@ -102,3 +110,126 @@ export function LeftSidebar() {
     </div>
   );
 }
+
+function SidebarSearchInput() {
+  const {
+    query,
+    setQuery,
+    isSearching,
+    isIndexing,
+    inputRef,
+    results,
+    selectedIndex,
+    setSelectedIndex,
+  } = useSearch();
+  const openNew = useTabs((state) => state.openNew);
+  const inputLocalRef = useRef<HTMLInputElement>(null);
+
+  const flatResults = useMemo(() => {
+    if (!results) return [];
+    return results.groups.flatMap((g) => g.results);
+  }, [results]);
+
+  const showLoading = isSearching || isIndexing;
+
+  const ref = inputRef ?? inputLocalRef;
+
+  return (
+    <div className="shrink-0 px-2">
+      <div
+        className={cn([
+          "flex items-center gap-2",
+          "h-8 rounded-lg px-2",
+          "border border-neutral-200 bg-neutral-200/50",
+        ])}
+      >
+        {showLoading ? (
+          <Loader2Icon className="size-4 shrink-0 animate-spin text-neutral-400" />
+        ) : (
+          <SearchIcon className="size-4 shrink-0 text-neutral-400" />
+        )}
+        <input
+          ref={ref}
+          type="text"
+          placeholder="Search anything..."
+          value={query}
+          onChange={(e) => setQuery(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === "Escape") {
+              if (query.trim()) {
+                setQuery("");
+                setSelectedIndex(-1);
+              } else {
+                e.currentTarget.blur();
+              }
+            }
+            if (e.key === "Enter" && (e.metaKey || e.ctrlKey) && query.trim()) {
+              e.preventDefault();
+              openNew({
+                type: "search",
+                state: {
+                  selectedTypes: null,
+                  initialQuery: query.trim(),
+                },
+              });
+              setQuery("");
+              e.currentTarget.blur();
+            }
+            if (e.key === "ArrowDown" && flatResults.length > 0) {
+              e.preventDefault();
+              setSelectedIndex(
+                Math.min(selectedIndex + 1, flatResults.length - 1),
+              );
+            }
+            if (e.key === "ArrowUp" && flatResults.length > 0) {
+              e.preventDefault();
+              setSelectedIndex(Math.max(selectedIndex - 1, -1));
+            }
+            if (
+              e.key === "Enter" &&
+              !e.metaKey &&
+              !e.ctrlKey &&
+              selectedIndex >= 0 &&
+              selectedIndex < flatResults.length
+            ) {
+              e.preventDefault();
+              const item = flatResults[selectedIndex];
+              if (item.type === "session") {
+                openNew({ type: "sessions", id: item.id });
+              } else if (item.type === "human") {
+                openNew({
+                  type: "contacts",
+                  state: {
+                    selected: { type: "person", id: item.id },
+                  },
+                });
+              } else if (item.type === "organization") {
+                openNew({
+                  type: "contacts",
+                  state: {
+                    selected: { type: "organization", id: item.id },
+                  },
+                });
+              }
+              e.currentTarget.blur();
+            }
+          }}
+          className={cn([
+            "min-w-0 flex-1 bg-transparent text-sm",
+            "placeholder:text-neutral-400",
+            "focus:outline-hidden",
+          ])}
+        />
+        {query && (
+          <button
+            onClick={() => setQuery("")}
+            className="shrink-0 text-neutral-400 hover:text-neutral-600"
+          >
+            <XIcon className="size-3.5" />
+          </button>
+        )}
+        {!query && <Kbd className="shrink-0 text-[10px]">⌘ K</Kbd>}
+      </div>
+    </div>
+  );
+}
diff --git a/apps/desktop/src/sidebar/profile/index.tsx b/apps/desktop/src/sidebar/profile/index.tsx
index e5b6647864..6f0eeba9de 100644
--- a/apps/desktop/src/sidebar/profile/index.tsx
+++ b/apps/desktop/src/sidebar/profile/index.tsx
@@ -212,7 +212,7 @@ export function ProfileSection({ onExpandChange }: ProfileSectionProps = {}) {
             transition={{ duration: 0.2, ease: "easeInOut" }}
             className="absolute right-0 bottom-full left-0 mb-1"
           >
-            <div className="overflow-hidden rounded-xl border bg-neutral-50 shadow-xs">
+            <div className="overflow-hidden rounded-xl border bg-white shadow-xs">
               <div className="py-1">
                 <AnimatePresence mode="wait">
                   {currentView === "main" ? (
@@ -269,7 +269,7 @@ export function ProfileSection({ onExpandChange }: ProfileSectionProps = {}) {
         )}
       </AnimatePresence>
 
-      <div className="overflow-hidden rounded-xl bg-neutral-50">
+      <div className="overflow-hidden">
         <ProfileButton
           isExpanded={isExpanded}
           onClick={() => setIsExpanded(!isExpanded)}
@@ -316,8 +316,8 @@ function ProfileButton({
         "px-4 py-2",
         "text-left",
         "transition-all duration-300",
-        "hover:bg-neutral-100",
-        isExpanded && "border-t border-neutral-100 bg-neutral-50",
+        "rounded-lg hover:bg-neutral-200/50",
+        isExpanded && "border-neutral-300 bg-neutral-200/50",
       ])}
       onClick={onClick}
     >
diff --git a/apps/desktop/src/sidebar/timeline/index.tsx b/apps/desktop/src/sidebar/timeline/index.tsx
index 81d0619420..2dfdefc0be 100644
--- a/apps/desktop/src/sidebar/timeline/index.tsx
+++ b/apps/desktop/src/sidebar/timeline/index.tsx
@@ -210,10 +210,7 @@ export function TimelineView() {
       <div
         ref={containerRef}
         onContextMenu={showContextMenu}
-        className={cn([
-          "scrollbar-hide flex h-full flex-col overflow-y-auto",
-          "rounded-xl bg-neutral-50",
-        ])}
+        className={cn(["scrollbar-hide flex h-full flex-col overflow-y-auto"])}
       >
         {buckets.map((bucket, index) => {
           const isToday = bucket.label === "Today";
@@ -225,12 +222,7 @@ export function TimelineView() {
               {shouldRenderIndicatorBefore && (
                 <CurrentTimeIndicator ref={setCurrentTimeIndicatorRef} />
               )}
-              <div
-                className={cn([
-                  "sticky top-0 z-10",
-                  "bg-neutral-50 py-1 pr-1 pl-3",
-                ])}
-              >
+              <div className={cn(["sticky top-0 z-10", "py-1 pr-1 pl-3"])}>
                 <div className="text-base font-bold text-neutral-900">
                   {bucket.label}
                 </div>
diff --git a/apps/desktop/src/sidebar/timeline/item.tsx b/apps/desktop/src/sidebar/timeline/item.tsx
index c1d783e04c..f951857d05 100644
--- a/apps/desktop/src/sidebar/timeline/item.tsx
+++ b/apps/desktop/src/sidebar/timeline/item.tsx
@@ -113,7 +113,7 @@ function ItemBase({
         "w-full cursor-pointer rounded-lg px-3 py-2 text-left",
         multiSelected && "bg-neutral-200",
         !multiSelected && selected && "bg-neutral-200",
-        !multiSelected && !selected && "hover:bg-neutral-100",
+        !multiSelected && !selected && "hover:bg-neutral-200/50",
         ignored && "opacity-40",
       ])}
     >
diff --git a/apps/desktop/src/store/zustand/tabs/basic.ts b/apps/desktop/src/store/zustand/tabs/basic.ts
index 73720f42fe..1a0deaf7e5 100644
--- a/apps/desktop/src/store/zustand/tabs/basic.ts
+++ b/apps/desktop/src/store/zustand/tabs/basic.ts
@@ -22,7 +22,7 @@ export type BasicState = {
 
 export type BasicActions = {
   openCurrent: (tab: TabInput) => void;
-  openNew: (tab: TabInput) => void;
+  openNew: (tab: TabInput, options?: { position?: "start" | "end" }) => void;
   select: (tab: Tab) => void;
   selectNext: () => void;
   selectPrev: () => void;
@@ -72,9 +72,9 @@ export const createBasicSlice = <
       view: tab.type,
     });
   },
-  openNew: (tab) => {
+  openNew: (tab, options) => {
     const { tabs, history, addRecentlyOpened } = get();
-    set(openTab(tabs, tab, history, true));
+    set(openTab(tabs, tab, history, true, options?.position));
 
     if (tab.type === "sessions") {
       addRecentlyOpened(tab.id);
@@ -271,6 +271,7 @@ const openTab = <T extends BasicState & NavigationState>(
   newTab: TabInput,
   history: Map<string, TabHistory>,
   forceNewTab: boolean,
+  position?: "start" | "end",
 ): Partial<T> => {
   const tabWithDefaults: Tab = {
     ...getDefaultState(newTab),
@@ -317,7 +318,17 @@ const openTab = <T extends BasicState & NavigationState>(
   } else {
     activeTab = { ...tabWithDefaults, active: true, slotId: id() };
     const deactivated = deactivateAll(tabs);
-    nextTabs = [...deactivated, activeTab];
+
+    if (position === "start") {
+      const pinnedCount = deactivated.filter((t) => t.pinned).length;
+      nextTabs = [
+        ...deactivated.slice(0, pinnedCount),
+        activeTab,
+        ...deactivated.slice(pinnedCount),
+      ];
+    } else {
+      nextTabs = [...deactivated, activeTab];
+    }
 
     return updateWithHistory(nextTabs, activeTab, history);
   }
diff --git a/plugins/tray/src/menu_items/tray_start.rs b/plugins/tray/src/menu_items/tray_start.rs
index a5a0348de5..ec481704a3 100644
--- a/plugins/tray/src/menu_items/tray_start.rs
+++ b/plugins/tray/src/menu_items/tray_start.rs
@@ -11,7 +11,7 @@ impl MenuItemHandler for TrayStart {
     const ID: &'static str = "hypr_tray_start";
 
     fn build(app: &AppHandle<tauri::Wry>) -> Result<MenuItemKind<tauri::Wry>> {
-        let item = MenuItem::with_id(app, Self::ID, "Start a new recording", true, None::<&str>)?;
+        let item = MenuItem::with_id(app, Self::ID, "Start a new meeting", true, None::<&str>)?;
         Ok(MenuItemKind::MenuItem(item))
     }
 
@@ -42,7 +42,7 @@ impl TrayStart {
         MenuItem::with_id(
             app,
             Self::ID,
-            "Start a new recording",
+            "Start a new meeting",
             !disabled,
             None::<&str>,
         )