diff --git a/app/components/navigation/AreaTabs.vue b/app/components/navigation/AreaTabs.vue
index 954deda..8293d70 100644
--- a/app/components/navigation/AreaTabs.vue
+++ b/app/components/navigation/AreaTabs.vue
@@ -146,14 +146,17 @@ watch(visibleAreas, (newAreas, oldAreas) => {
     newlyAddedAreaIds.value = addedIds
 
     // Trigger confetti for each new tab with staggered delay (wave effect)
-    addedIds.forEach((areaId, index) => {
-      setTimeout(() => {
-        const element = tabRefs.value[areaId]
-        if (element) {
-          triggerConfetti(element)
-        }
-      }, 300 + (index * 150)) // Stagger: 300ms, 450ms, 600ms, ...
-    })
+    // Only on desktop (md breakpoint and up) - too distracting on mobile
+    if (window.matchMedia('(min-width: 768px)').matches) {
+      addedIds.forEach((areaId, index) => {
+        setTimeout(() => {
+          const element = tabRefs.value[areaId]
+          if (element) {
+            triggerConfetti(element)
+          }
+        }, 300 + (index * 150)) // Stagger: 300ms, 450ms, 600ms, ...
+      })
+    }
 
     // Clear all highlights after animation completes
     // Animation timeline: glow 2x + pulse 2x + opacity fade = 2.0s