diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 5e3dd55..cc83382 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -10,6 +10,7 @@ import TitleBar from "./TitleBar";
 const MIN_SIDEBAR_WIDTH = 180;
 const MAX_SIDEBAR_WIDTH = 400;
 const DEFAULT_SIDEBAR_WIDTH = 260;
+const COLLAPSE_THRESHOLD = 120;
 
 interface Props {
   sidebar: ReactNode;
@@ -51,11 +52,17 @@ export default function Layout({ sidebar, editor }: Props) {
 
     const handleMouseMove = (e: MouseEvent) => {
       const delta = e.clientX - startX.current;
-      const newWidth = Math.min(
-        MAX_SIDEBAR_WIDTH,
-        Math.max(MIN_SIDEBAR_WIDTH, startWidth.current + delta),
+      const rawWidth = startWidth.current + delta;
+      if (rawWidth < COLLAPSE_THRESHOLD) {
+        setSidebarOpen(false);
+        setIsResizing(false);
+        document.body.style.cursor = "";
+        document.body.style.userSelect = "";
+        return;
+      }
+      setSidebarWidth(
+        Math.min(MAX_SIDEBAR_WIDTH, Math.max(MIN_SIDEBAR_WIDTH, rawWidth)),
       );
-      setSidebarWidth(newWidth);
     };
 
     const handleMouseUp = () => {