From ee4f62434e150238bdca9e50c7a5e51163ce8c03 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sat, 19 Jul 2025 14:39:24 +0000
Subject: [PATCH] Change interactive sum color

Make the sum's color red when it exceeds the target sum.
---
 src/components/BinaryNumberGame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/BinaryNumberGame.tsx b/src/components/BinaryNumberGame.tsx
index d5ff958..3156d7b 100644
--- a/src/components/BinaryNumberGame.tsx
+++ b/src/components/BinaryNumberGame.tsx
@@ -133,7 +133,7 @@ const BinaryNumberGame: React.FC<BinaryNumberGameProps> = ({ showSocialShare = t
         <Card className="bg-secondary">
           <CardContent className="p-6 text-center">
             <h3 className="text-lg font-semibold text-muted-foreground mb-2">Current Sum</h3>
-            <div className="text-4xl font-bold text-foreground">{currentSum}</div>
+            <div className={`text-4xl font-bold ${currentSum > targetNumber ? "text-red-600" : "text-foreground"}`}>{currentSum}</div>
           </CardContent>
         </Card>
         <Card className="bg-primary/10 border-primary/20">