fix: merge bg analysis drill-change detection into enqueue effect

React runs useEffects in declaration order. The separate cancellation
effect was firing AFTER the enqueue effect, clearing the queue that
was just populated. Merged both into a single effect so drill-change
reset and node enqueuing happen atomically.

Also handle drill-cleared case (cancel background when no active drill).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: ashtonanderson

src/hooks/useOpeningDrillController/useOpeningDrillController.ts

@@ -947,9 +947,28 @@ export const useOpeningDrillController = (
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
-  // Enqueue new drill positions for background analysis
+  // Enqueue new drill positions for background analysis.
+  // Also handles drill-change detection (must be in the same effect to avoid
+  // the cancellation effect clearing the queue after the enqueue effect fills it).
+  const bgDrillIdRef = useRef<string | null>(null)
   useEffect(() => {
-    if (!currentDrillGame || isAnalyzingDrill) return
+    if (!currentDrillGame || isAnalyzingDrill) {
+      // No active drill or post-drill analysis is running — cancel background
+      if (bgDrillIdRef.current !== null) {
+        bgCancelledRef.current = true
+        bgQueueRef.current = []
+        bgDrillIdRef.current = null
+      }
+      return
+    }
+
+    // If drill changed, reset background state for the new drill
+    if (currentDrillGame.id !== bgDrillIdRef.current) {
+      bgCancelledRef.current = true
+      bgQueueRef.current = []
+      bgDrillIdRef.current = currentDrillGame.id
+      bgCancelledRef.current = false
+    }
 
     const mainLine = gameTree.getMainLine()
     const openingEndNode = currentDrillGame.openingEndNode
@@ -984,20 +1003,6 @@ export const useOpeningDrillController = (
     treeController.currentNode,
   ])
 
-  // Cancel background analysis when a new drill starts
-  const bgDrillIdRef = useRef<string | null>(null)
-  useEffect(() => {
-    const drillId = currentDrillGame?.id ?? null
-    if (drillId !== bgDrillIdRef.current) {
-      bgCancelledRef.current = true
-      bgQueueRef.current = []
-      bgDrillIdRef.current = drillId
-      if (drillId) {
-        bgCancelledRef.current = false
-      }
-    }
-  }, [currentDrillGame?.id])
-
   // Helper: stop background loop and wait for it to fully exit
   const stopBackgroundAnalysis = useCallback(async () => {
     bgCancelledRef.current = true