Fix balance button readability - remove duplicate and use dark blue background

- Remove duplicate .balance-display definition
- Use dark blue background (#1a5a7a) with white text for better contrast
- Add border and shadow for better visibility

web/styles.css

@@ -1610,14 +1610,14 @@ body {
 
 /* Balance Display in Header */
 .balance-display {
-    background: #00d4ff;
+    background: #1a5a7a;
     padding: 8px 16px;
     border-radius: 20px;
-    color: #000000;
+    color: #ffffff;
     font-weight: 700;
     font-size: 0.9rem;
-    box-shadow: 0 2px 10px rgba(0, 212, 255, 0.3);
-    border: 2px solid #00b8e6;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+    border: 2px solid #2a7a9a;
 }
 
 /* Video Container */
@@ -2614,18 +2614,6 @@ body {
     font-size: 0.85rem;
 }
 
-/* Balance Display in Header */
-.balance-display {
-    background: #00d4ff;
-    padding: 6px 12px;
-    border-radius: 20px;
-    font-weight: 700;
-    font-size: 0.9rem;
-    color: #000;
-    border: 2px solid #00b8e6;
-    box-shadow: 0 2px 8px rgba(0, 212, 255, 0.4);
-}
-
 /* Dropdown Divider */
 .dropdown-divider {
     height: 1px;