diff --git a/apps/web/src/components/calendar/event/draggable-event.tsx b/apps/web/src/components/calendar/event/draggable-event.tsx
index 1614b1aa..dfd9c4a4 100644
--- a/apps/web/src/components/calendar/event/draggable-event.tsx
+++ b/apps/web/src/components/calendar/event/draggable-event.tsx
@@ -89,16 +89,27 @@ export function DraggableEvent({
   const updateAction = usePartialUpdateAction();
   const { setCursor, resetCursor } = useGlobalCursor();
 
+  const elementRef = React.useRef<HTMLDivElement>(null);
   const onDragStart = (e: PointerEvent, info: PanInfo) => {
+    if (!containerRef.current || !elementRef.current) {
+      return;
+    }
+
+    const eventRect = elementRef.current.getBoundingClientRect();
+    if (
+      info.point.x < eventRect.left ||
+      info.point.x > eventRect.right ||
+      info.point.y < eventRect.top ||
+      info.point.y > eventRect.bottom
+    ) {
+      return;
+    }
+
     // Prevent possible text/image dragging flash on some browsers
     e.preventDefault();
 
     addDraggedEventId(item.event.id);
 
-    if (!containerRef.current) {
-      return;
-    }
-
     const rect = containerRef.current.getBoundingClientRect();
 
     dragStartRelative.current = {
@@ -198,6 +209,11 @@ export function DraggableEvent({
   );
 
   const onDragEnd = (_e: PointerEvent, info: PanInfo) => {
+    // If drag never started (out of bounds), don't do anything
+    if (dragStartRelative.current === null) {
+      return;
+    }
+
     removeDraggedEventId(item.event.id);
     // Do not reset transform immediately to avoid flashback to original
     // position. We'll reset when the event data updates optimistically.
@@ -211,7 +227,7 @@ export function DraggableEvent({
     // Calculate vertical movement relative to the container so that auto-scroll is taken into account.
     let deltaY = info.offset.y;
 
-    if (containerRef.current && dragStartRelative.current !== null) {
+    if (containerRef.current) {
       const rect = containerRef.current.getBoundingClientRect();
       const relativeCurrentY = info.point.y - rect.top;
       deltaY = relativeCurrentY - dragStartRelative.current.y;
@@ -397,6 +413,7 @@ export function DraggableEvent({
       <motion.div
         className="size-full touch-none"
         style={{ transform, height, top, zIndex }}
+        ref={elementRef}
       >
         <EventContextMenu event={item.event}>
           <ContextMenuTrigger>
@@ -431,6 +448,7 @@ export function DraggableEvent({
     <motion.div
       className="size-full touch-none"
       style={{ transform, height, zIndex }}
+      ref={elementRef}
     >
       <EventContextMenu event={item.event}>
         <ContextMenuTrigger>