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/app/globals.css

@@ -437,11 +437,12 @@
 
   .allocation-block {
     @apply absolute rounded-md text-xs font-medium px-2 py-1 cursor-pointer select-none;
-    @apply transition-all duration-150 ease-in-out;
+    transition: transform 0.1s ease-out, box-shadow 0.1s ease-out, opacity 0.15s ease-in-out;
   }
 
   .allocation-block:hover {
-    @apply ring-2 ring-white ring-offset-1;
+    @apply ring-2 ring-white ring-offset-1 shadow-md;
+    transform: scale(1.02);
   }
 
   .allocation-block.dragging {
@@ -510,3 +511,48 @@
 :is(.dark) .hover-lift:hover {
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
 }
+
+/* ─── Smooth scroll + reduced-motion accessibility ────────────────────────── */
+html {
+  scroll-behavior: smooth;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  html {
+    scroll-behavior: auto;
+  }
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+
+/* ─── Table row hover accent border ──────────────────────────────────────── */
+.table-row-hover {
+  border-left: 2px solid transparent;
+  transition: border-color 0.15s ease-out, background-color 0.15s ease-out, transform 0.15s ease-out, box-shadow 0.15s ease-out;
+}
+.table-row-hover:hover {
+  border-left-color: rgb(var(--accent-400));
+}
+
+/* ─── Animated underline for action links ─────────────────────────────────── */
+.link-hover-underline {
+  position: relative;
+}
+.link-hover-underline::after {
+  content: '';
+  position: absolute;
+  bottom: -1px;
+  left: 0;
+  width: 0;
+  height: 1px;
+  background: currentColor;
+  transition: width 0.2s ease-out;
+}
+.link-hover-underline:hover::after {
+  width: 100%;
+}