chore: auto-commit before merge (loop primary)

src/components/constellation/CareerConstellation.tsx

@@ -42,6 +42,7 @@ const CareerConstellation: React.FC<CareerConstellationProps> = ({
   const highlightedNodeIdRef = useRef<string | null>(highlightedNodeId ?? null)
   const [dimensions, setDimensions] = useState({ width: 800, height: MIN_HEIGHT, scaleFactor: 1 })
   const [focusedNodeId, setFocusedNodeId] = useState<string | null>(null)
+  const [chartInView, setChartInView] = useState(true)
 
   callbacksRef.current = { onRoleClick, onSkillClick, onNodeHover }
 
@@ -49,6 +50,18 @@ const CareerConstellation: React.FC<CareerConstellationProps> = ({
     highlightedNodeIdRef.current = highlightedNodeId ?? null
   }, [highlightedNodeId])
 
+  // Track chart visibility for play/pause button
+  useEffect(() => {
+    const container = containerRef.current
+    if (!container) return
+    const observer = new IntersectionObserver(
+      ([entry]) => setChartInView(entry.isIntersecting),
+      { threshold: 0.1 },
+    )
+    observer.observe(container)
+    return () => observer.disconnect()
+  }, [])
+
   useEffect(() => {
     const container = containerRef.current
     if (!container) return
@@ -235,6 +248,7 @@ const CareerConstellation: React.FC<CareerConstellationProps> = ({
           isPlaying={animation.isPlaying}
           onToggle={animation.togglePlayPause}
           isMobile={isMobile}
+          visible={chartInView}
         />
       )}