Match.html overlay formatting done

mbetterclient/qt_player/templates/match.html

@@ -104,7 +104,8 @@
             background: rgba(0, 123, 255, 0.85);
             border-radius: 20px;
             padding: 30px;
-            max-width: 95%;
+            width: 66%;
+            max-width: 66%;
             max-height: 80%;
             overflow-y: auto;
             box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
@@ -114,6 +115,15 @@
             animation: fadeInScale 1s ease-out forwards;
         }
 
+        .match-title {
+            font-size: 48px;
+            font-weight: bold;
+            color: rgba(255, 255, 255, 0.9);
+            text-align: center;
+            margin-bottom: 20px;
+            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
+        }
+
         .match-header {
             display: flex;
             justify-content: space-between;
@@ -124,9 +134,11 @@
 
         .fighters-section {
             flex: 1;
-            text-align: left;
+            flex-basis: 50%;
+            text-align: center;
             display: flex;
             align-items: center;
+            justify-content: center;
         }
 
         .fighter-names {
@@ -158,10 +170,11 @@
 
         .venue-timer-section {
             flex: 1;
-            text-align: right;
+            flex-basis: 50%;
+            text-align: center;
             display: flex;
             flex-direction: column;
-            align-items: flex-end;
+            align-items: center;
             gap: 24px;
         }
 
@@ -174,7 +187,7 @@
         }
 
         .venue-display {
-            font-size: 144px;
+            font-size: 72px;
             font-weight: bold;
             color: rgba(255, 255, 255, 0.95);
             text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
@@ -235,6 +248,8 @@
             align-items: center;
             justify-content: center;
             min-height: 80px;
+            border: 2px solid rgba(255, 255, 255, 0.3);
+            border-radius: 8px;
         }
 
         .outcome-name {
@@ -324,15 +339,6 @@
             font-style: italic;
         }
 
-        .venue-display {
-            font-size: 24px;
-            color: rgba(255, 255, 255, 0.9);
-            text-align: center;
-            margin-bottom: 30px;
-            font-style: italic;
-            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
-        }
-        
         /* Animations */
         @keyframes fadeInScale {
             0% {
@@ -423,6 +429,9 @@
 
     <div class="overlay-container">
         <div class="fixtures-panel" id="fixturesPanel">
+            <!-- Title -->
+            <div class="match-title">Next Match:</div>
+
             <!-- Top section with fighters and venue/timer -->
             <div class="match-header">
                 <div class="fighters-section">