diff --git a/src/components/SubtractionGame.tsx b/src/components/SubtractionGame.tsx
index 18783fa..4887d3e 100644
--- a/src/components/SubtractionGame.tsx
+++ b/src/components/SubtractionGame.tsx
@@ -212,14 +212,18 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
             <div className="bg-card rounded-lg p-8 shadow-lg">
               <div className="flex flex-wrap justify-center gap-3">
                 {circles.map((_, index) => (
-                  <div
-                    key={index}
-                    className={getCircleClass(index)}
-                    onClick={() => handleCircleClick(index)}
-                    onMouseEnter={() => (highlightedIndices.includes(index) && !removedCircles.has(index)) ? setHoveredIndex(index) : null}
-                    onMouseLeave={() => setHoveredIndex(null)}
-                    title={highlightedIndices.includes(index) ? 'Click to select' : 'Not selectable'}
-                  />
+                  <div key={index} className="flex flex-col items-center">
+                    <div
+                      className={getCircleClass(index)}
+                      onClick={() => handleCircleClick(index)}
+                      onMouseEnter={() => (highlightedIndices.includes(index) && !removedCircles.has(index)) ? setHoveredIndex(index) : null}
+                      onMouseLeave={() => setHoveredIndex(null)}
+                      title={highlightedIndices.includes(index) ? 'Click to select' : 'Not selectable'}
+                    />
+                    <span className="text-xs text-black dark:text-white mt-1 font-medium">
+                      {index + 1}
+                    </span>
+                  </div>
                 ))}
               </div>