diff --git a/design/macos-border.pen b/design/macos-border.pen
new file mode 100644
index 00000000..d80ece9a
--- /dev/null
+++ b/design/macos-border.pen
@@ -0,0 +1,858 @@
+{
+  "version": "2.8",
+  "children": [
+    {
+      "type": "frame",
+      "id": "mb001",
+      "x": 0,
+      "y": 0,
+      "name": "macOS Border — Before (no border)",
+      "theme": {
+        "Mode": "Light"
+      },
+      "clip": true,
+      "width": 400,
+      "height": 200,
+      "fill": "$--background",
+      "layout": "vertical",
+      "children": [
+        {
+          "type": "frame",
+          "id": "mb002",
+          "name": "macOS Title Bar (before)",
+          "width": "fill_container",
+          "height": 38,
+          "fill": "$--sidebar",
+          "gap": 12,
+          "padding": [
+            0,
+            12
+          ],
+          "alignItems": "center",
+          "children": [
+            {
+              "type": "frame",
+              "id": "mb003",
+              "name": "trafficLights",
+              "gap": 8,
+              "alignItems": "center",
+              "children": [
+                {
+                  "type": "ellipse",
+                  "id": "mb004",
+                  "fill": "#FF5F57",
+                  "width": 12,
+                  "height": 12
+                },
+                {
+                  "type": "ellipse",
+                  "id": "mb005",
+                  "fill": "#FEBC2E",
+                  "width": 12,
+                  "height": 12
+                },
+                {
+                  "type": "ellipse",
+                  "id": "mb006",
+                  "fill": "#28C840",
+                  "width": 12,
+                  "height": 12
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "mb007",
+          "name": "Sidebar Content (before)",
+          "width": "fill_container",
+          "height": "fill_container",
+          "fill": "$--sidebar",
+          "padding": [
+            8,
+            12
+          ],
+          "layout": "vertical",
+          "gap": 4,
+          "children": [
+            {
+              "type": "text",
+              "id": "mb008",
+              "value": "All Notes",
+              "fontSize": 14,
+              "fill": "$--foreground"
+            },
+            {
+              "type": "text",
+              "id": "mb009",
+              "value": "Favorites",
+              "fontSize": 14,
+              "fill": "$--foreground"
+            },
+            {
+              "type": "text",
+              "id": "mb010",
+              "value": "Archive",
+              "fontSize": 14,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "frame",
+      "id": "mb011",
+      "x": 440,
+      "y": 0,
+      "name": "macOS Border — After (with border)",
+      "theme": {
+        "Mode": "Light"
+      },
+      "clip": true,
+      "width": 400,
+      "height": 200,
+      "fill": "$--background",
+      "layout": "vertical",
+      "children": [
+        {
+          "type": "frame",
+          "id": "mb012",
+          "name": "macOS Title Bar (after)",
+          "width": "fill_container",
+          "height": 38,
+          "fill": "$--sidebar",
+          "stroke": {
+            "align": "inside",
+            "thickness": {
+              "bottom": 1
+            },
+            "fill": "$--border"
+          },
+          "gap": 12,
+          "padding": [
+            0,
+            12
+          ],
+          "alignItems": "center",
+          "children": [
+            {
+              "type": "frame",
+              "id": "mb013",
+              "name": "trafficLights",
+              "gap": 8,
+              "alignItems": "center",
+              "children": [
+                {
+                  "type": "ellipse",
+                  "id": "mb014",
+                  "fill": "#FF5F57",
+                  "width": 12,
+                  "height": 12
+                },
+                {
+                  "type": "ellipse",
+                  "id": "mb015",
+                  "fill": "#FEBC2E",
+                  "width": 12,
+                  "height": 12
+                },
+                {
+                  "type": "ellipse",
+                  "id": "mb016",
+                  "fill": "#28C840",
+                  "width": 12,
+                  "height": 12
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "mb017",
+          "name": "Sidebar Content (after)",
+          "width": "fill_container",
+          "height": "fill_container",
+          "fill": "$--sidebar",
+          "padding": [
+            8,
+            12
+          ],
+          "layout": "vertical",
+          "gap": 4,
+          "children": [
+            {
+              "type": "text",
+              "id": "mb018",
+              "value": "All Notes",
+              "fontSize": 14,
+              "fill": "$--foreground"
+            },
+            {
+              "type": "text",
+              "id": "mb019",
+              "value": "Favorites",
+              "fontSize": 14,
+              "fill": "$--foreground"
+            },
+            {
+              "type": "text",
+              "id": "mb020",
+              "value": "Archive",
+              "fontSize": 14,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        }
+      ]
+    }
+  ],
+  "themes": {
+    "Mode": [
+      "Dark"
+    ]
+  },
+  "variables": {
+    "--accent": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#EBEBEA"
+        },
+        {
+          "value": "#252545",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-blue": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#2383E2"
+        },
+        {
+          "value": "#4a9eff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#155DFF"
+        },
+        {
+          "value": "#155DFF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#ffffff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-green": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#0F7B6C"
+        },
+        {
+          "value": "#4caf50",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#00B38B"
+        },
+        {
+          "value": "#00B38B",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-orange": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#D9730D"
+        },
+        {
+          "value": "#ff9800",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-purple": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#9065B0"
+        },
+        {
+          "value": "#9c72ff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#A932FF"
+        },
+        {
+          "value": "#A932FF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-red": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E03E3E"
+        },
+        {
+          "value": "#f44336",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--background": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#0f0f1a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--black": {
+      "type": "color",
+      "value": "#000000"
+    },
+    "--border": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E9E9E7"
+        },
+        {
+          "value": "#2a2a4a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--card": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#16162a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--card-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#e0e0e0",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--destructive": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E03E3E"
+        },
+        {
+          "value": "#f44336",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--destructive-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#ffffff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--font-primary": {
+      "type": "string",
+      "value": [
+        {
+          "value": "Inter"
+        },
+        {
+          "value": "-apple-system, BlinkMacSystemFont, Inter, sans-serif"
+        },
+        {
+          "value": "Inter"
+        }
+      ]
+    },
+    "--font-system": {
+      "type": "string",
+      "value": "-apple-system, BlinkMacSystemFont, sans-serif"
+    },
+    "--foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#e0e0e0",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--input": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E9E9E7"
+        },
+        {
+          "value": "#2a2a4a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--muted": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#F0F0EF"
+        },
+        {
+          "value": "#1e1e3a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--muted-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#787774"
+        },
+        {
+          "value": "#888888",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--popover": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#1e1e3a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--popover-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#e0e0e0",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--primary": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#2383E2"
+        },
+        {
+          "value": "#4a9eff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#155DFF"
+        },
+        {
+          "value": "#155DFF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--primary-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#ffffff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--radius-lg": {
+      "type": "number",
+      "value": 8
+    },
+    "--radius-md": {
+      "type": "number",
+      "value": 6
+    },
+    "--radius-sm": {
+      "type": "number",
+      "value": 4
+    },
+    "--ring": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#2383E2"
+        },
+        {
+          "value": "#4a9eff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#155DFF"
+        },
+        {
+          "value": "#155DFF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--secondary": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#EBEBEA"
+        },
+        {
+          "value": "#2a2a4a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--secondary-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#e0e0e0",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#F7F6F3"
+        },
+        {
+          "value": "#1a1a2e",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-accent": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#EBEBEA"
+        },
+        {
+          "value": "#252545",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-accent-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#ffffff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-border": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E9E9E7"
+        },
+        {
+          "value": "#2a2a4a",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#37352F"
+        },
+        {
+          "value": "#e0e0e0",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-primary": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#2383E2"
+        },
+        {
+          "value": "#4a9eff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#155DFF"
+        },
+        {
+          "value": "#155DFF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-primary-foreground": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#FFFFFF"
+        },
+        {
+          "value": "#ffffff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--sidebar-ring": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#2383E2"
+        },
+        {
+          "value": "#4a9eff",
+          "theme": {
+            "Mode": "Dark"
+          }
+        },
+        {
+          "value": "#155DFF"
+        },
+        {
+          "value": "#155DFF",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--white": {
+      "type": "color",
+      "value": "#ffffff"
+    },
+    "--accent-yellow": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#F0B100"
+        },
+        {
+          "value": "#F0B100",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-blue-light": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#155DFF14"
+        },
+        {
+          "value": "#155DFF20",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-green-light": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#00B38B14"
+        },
+        {
+          "value": "#00B38B20",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-purple-light": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#A932FF14"
+        },
+        {
+          "value": "#A932FF20",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-red-light": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#E03E3E14"
+        },
+        {
+          "value": "#f4433620",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    },
+    "--accent-yellow-light": {
+      "type": "color",
+      "value": [
+        {
+          "value": "#F0B10014"
+        },
+        {
+          "value": "#F0B10020",
+          "theme": {
+            "Mode": "Dark"
+          }
+        }
+      ]
+    }
+  },
+  "fonts": [
+    {
+      "name": "GT Pressura Trial",
+      "url": "GT-Pressura-Regular-Trial.otf"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 82dd9958..0a79ddad 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -267,7 +267,8 @@ export const Sidebar = memo(function Sidebar({
   }
 
   return (
-    <aside className="flex h-full flex-col overflow-hidden border-r border-[var(--sidebar-border)] bg-sidebar text-sidebar-foreground" style={{ paddingTop: 38 } as React.CSSProperties}>
+    <aside className="flex h-full flex-col overflow-hidden border-r border-[var(--sidebar-border)] bg-sidebar text-sidebar-foreground">
+      <div className="shrink-0 border-b border-border" style={{ height: 38, WebkitAppRegion: 'drag' } as React.CSSProperties} data-tauri-drag-region />
       <nav className="flex-1 overflow-y-auto">
         {/* Top nav */}
         <div className="border-b border-border" style={{ padding: '4px 6px' }}>