madness continues

static/css/site.css

@@ -10,6 +10,7 @@
   margin-right: 6px;
   font-weight: bold;
   text-align: center;
+  will-change: transform;
   }
 
   .ball-container {
@@ -45,16 +46,50 @@
   }
 
   .ball.bonus {
-    background-color: #d8b4fe; /* Light purple */
+    background-color: #d8b4fe;
   }
   
   .ball.matched {
-    background-color: #4ade80; /* Green */
+    background-color: #4ade80 !important;
     animation: pulse 1s ease-in-out infinite;
+    color: white !important;
+    border: 2px solid red !important;
   }
   
+  .ball.game-thunderball {
+    background-color: #1e3a8a; /* Dark blue */
+    color: white;
+    border: 2px solid white;
+    border-radius: 12px; /* Remove side rounding */
+  }
+  
+  /* Lotto main balls – Orange */
+  .ball.game-lotto {
+    background-color: #f97316; /* Bright orange */
+    color: white;
+    border: none;
+    border-radius: 12px;
+  }
+  
+  /* Optional: Euromillions, Set For Life – define as needed */
+  .ball.game-euromillions {
+    background-color: #2563eb; /* Royal blue */
+    color: white;
+    border-radius: 50%;
+  }
+  
+  .ball.game-setforlife {
+    background-color: #6b7280; /* Slate gray */
+    color: white;
+    border-radius: 50%;
+  }
   @keyframes pulse {
     0% { transform: scale(1); }
-    50% { transform: scale(1.1); }
+    50% { transform: scale(1.15); }
     100% { transform: scale(1); }
+  }
+
+  .pulse {
+    animation: pulse 0.8s ease-in-out infinite;
+    transform-origin: center;
   }