feat: Sprint 3 — delight, polish, and responsive sidebar

Celebration micro-interactions:
- SuccessToast: auto-dismissing pill toast (success/info/warning variants)
- ConfettiBurst: pure CSS 20-particle confetti on project creation
- Project wizard: confetti + toast on successful creation
- Vacation approval/rejection: contextual toasts
- Allocation status change: success toast
- Button: active:scale-[0.97] press feedback on all variants

Collapsible sidebar + responsive:
- Desktop: toggle collapse (72px icons-only mode) with localStorage persistence
- NavTooltip: hover labels on collapsed icons
- Mobile: hamburger menu + slide-in overlay with backdrop
- Auto-close sidebar on mobile navigation
- Scroll-to-top on route change (smooth behavior)

Hover polish + accessibility:
- Table rows: animated left-border accent + hover-lift
- Stat cards + widgets: hover elevation + border glow
- Timeline blocks: scale(1.02) + shadow-md on hover
- Smooth scroll globally with prefers-reduced-motion fallback
- Filter chips: framer-motion scale+fade enter/exit
- Dropdowns: scaleY origin-top reveal animation
- Preferences modal: scale+fade entrance
- Link underline: animated ::after width expansion on hover

Co-Authored-By: claude-flow <ruv@ruv.net>

apps/web/src/components/notifications/NotificationBell.tsx

@@ -192,9 +192,12 @@ export function NotificationBell() {
 
       {/* Dropdown panel — rendered via portal to escape sidebar overflow */}
       {open && createPortal(
-        <div
+        <motion.div
           ref={dropdownRef}
-          className="fixed w-96 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-xl shadow-lg z-[9999] overflow-hidden"
+          initial={{ opacity: 0, scaleY: 0.95, scaleX: 0.98 }}
+          animate={{ opacity: 1, scaleY: 1, scaleX: 1 }}
+          transition={{ duration: 0.15, ease: "easeOut" }}
+          className="fixed w-96 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-xl shadow-lg z-[9999] overflow-hidden origin-top"
           style={{ top: dropdownPos.top, left: dropdownPos.left }}
         >
           {/* Header */}
@@ -383,7 +386,7 @@ export function NotificationBell() {
               View all &rarr;
             </Link>
           </div>
-        </div>,
+        </motion.div>,
         document.body,
       )}
     </div>