From 7121ea40848ae405caa0c932587cc3be42d28e41 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 19 Feb 2026 15:53:25 +0800
Subject: [PATCH] Fix scanline animation race condition in AnalyzeStage (#51)

Renamed the keyframes in `AnalyzeStage.tsx` to `scanline-analyze` to prevent conflict with the global `scanline` animation.
Also removed unused `scanline` keyframes from `RefineStage.tsx` to avoid potential future conflicts.

Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com>
---
 src/ui/components/extractor/AnalyzeStage.tsx |  4 ++--
 src/ui/components/extractor/RefineStage.tsx  | 10 ----------
 2 files changed, 2 insertions(+), 12 deletions(-)

diff --git a/src/ui/components/extractor/AnalyzeStage.tsx b/src/ui/components/extractor/AnalyzeStage.tsx
index 4c8128f..1446868 100644
--- a/src/ui/components/extractor/AnalyzeStage.tsx
+++ b/src/ui/components/extractor/AnalyzeStage.tsx
@@ -17,7 +17,7 @@ export const AnalyzeStage: React.FC<AnalyzeStageProps> = ({ imageSrc, isAnalyzin
           {/* Scan Line Animation (only when analyzing) */}
           {isAnalyzing && (
             <div className="absolute inset-0 pointer-events-none z-20 overflow-hidden">
-              <div className="w-full h-[2px] bg-cyan-400 shadow-[0_0_20px_rgba(34,211,238,0.8)] animate-[scanline_2s_linear_infinite]"></div>
+              <div className="w-full h-[2px] bg-cyan-400 shadow-[0_0_20px_rgba(34,211,238,0.8)] animate-[scanline-analyze_2s_linear_infinite]"></div>
             </div>
           )}
 
@@ -32,7 +32,7 @@ export const AnalyzeStage: React.FC<AnalyzeStageProps> = ({ imageSrc, isAnalyzin
         </div>
       </div>
       <style>{`
-        @keyframes scanline {
+        @keyframes scanline-analyze {
           0% {
             transform: translateY(-100%);
           }
diff --git a/src/ui/components/extractor/RefineStage.tsx b/src/ui/components/extractor/RefineStage.tsx
index c3a66c3..d3ec538 100644
--- a/src/ui/components/extractor/RefineStage.tsx
+++ b/src/ui/components/extractor/RefineStage.tsx
@@ -153,16 +153,6 @@ export const RefineStage: React.FC<RefineStageProps> = ({
         </div>
       )}
 
-      <style>{`
-        @keyframes scanline {
-          0% {
-            transform: translateY(-100%);
-          }
-          100% {
-            transform: translateY(400px);
-          }
-        }
-      `}</style>
     </div>
   )
 }