fix: react-doctor → 64/100 (Bugs 122, Perf 286, A11y 613, Maint 436)

- CartContext: lazy initializers replace mount-only useEffect
  hydration; remove 8 no-initialize-state warnings
- Toast/AdminSearchInput: React 19 useContext/use + drop
  forwardRef (3 no-react19-deprecated-apis)
- ProductFormModal: lazy initializers + useSyncExternalStore
  for mount; parent adds key=editingProduct.id
- InstallPrompt: useReducer for prompt state (no-cascading-set-state)
- QRScanModal: ref-based latest-callback pattern replaces
  useEffectEvent deps mistake
- OnboardingFlow: functional setState (rerender-functional-setstate)
- UsersPage/StopsCalendar/FeaturesAndStats: lazy initializers
  (rerender-lazy-state-init)
- FAQClientPage: server-side brand settings fetch via getBrandSettingsPublic
  in layout; remove supabase import
- LandingPageWrapper: href='#' → href='#top' (anchor-is-valid)
- TuxedoVideoHero: replace animate-bounce with ease-out-expo
  (no-inline-bounce-easing)
- ProductTableClient: useCallback for handleDeleted
  (jsx-no-new-function-as-prop)
- excel-parser: pre-compile delimiter regexes (js-hoist-regexp)
- water-log/settings: Promise.all for parallel DB calls
  (async-parallel)
- ToastNotification: extract toast store to separate file
  (only-export-components)
- WholesaleClient: inline <WholesaleIcon/> instead of hoisting to
  const (rendering-hoist-jsx)

src/components/admin/HarvestReach/MatchingCustomersPanel.tsx

@@ -1,7 +1,7 @@
 "use client";
 /* eslint-disable react-hooks/set-state-in-effect */
 
-import { useState, useEffect, useRef } from "react";
+import { useState, useEffect, useEffectEvent, useRef } from "react";
 import { type SegmentRuleV2, type PreviewResult } from "@/actions/harvest-reach/segments";
 import { AdminSearchInput, AdminButton } from "@/components/admin/design-system";
 
@@ -65,6 +65,13 @@ function MatchingCustomersBody({ brandId, rules, onCountChange }: Props) {
   const [customerCount, setCustomerCount] = useState<number | undefined>(undefined);
   const timerRef = useRef<ReturnType<typeof setTimeout>>(undefined);
 
+  // useEffectEvent so we always call the latest onCountChange without
+  // re-running the debounce every time the parent re-renders. The
+  // effect event takes the count as a parameter so we can pass the
+  // freshly-computed value through.
+  const onCountChangeEffect = useEffectEvent((count: number) => {
+    onCountChange?.(count);
+  });
   useEffect(() => {
     // `rules.filters.length === 0` is intentionally a no-op here: when
     // the outer panel remounts this body via `key={syncKey}` (which
@@ -81,10 +88,10 @@ function MatchingCustomersBody({ brandId, rules, onCountChange }: Props) {
       setLoading(false);
       const count = result?.count ?? 0;
       setCustomerCount(count);
-      onCountChange?.(count);
+      onCountChangeEffect(count);
     }, DEBOUNCE_MS);
     return () => clearTimeout(timerRef.current);
-  }, [brandId, rules, onCountChange]);
+  }, [brandId, rules]);
 
   const PAGE_SIZE = 50;
   const filtered = preview?.sample_customers ?? [];