Golden frame on best server card — brass border, glow, lifted

script.js

@@ -514,6 +514,15 @@ var si = 0,
                     var best = valid[0];
                     var bestServer = SERVERS.filter(function(s) { return s.host === best.host; })[0];
                     if (bestServer && heroImages[best.host]) {
+                      /* Highlight the matching server card */
+                      var cards = document.querySelectorAll('.server-card');
+                      for (var i = 0; i < SERVERS.length && i < cards.length; i++) {
+                        if (SERVERS[i].host === best.host) {
+                          cards[i].classList.add('server-best');
+                          break;
+                        }
+                      }
+                      /* Preload and animate hero */
                       var img = new Image();
                       img.onload = function() { animateHero(bestServer.city, heroImages[best.host]); };
                       img.src = heroImages[best.host];

style.css

@@ -234,6 +234,7 @@ img { max-width: 100%; height: auto; vertical-align: middle; }
   padding: 1rem 0.75rem;
   text-align: center;
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
+  position: relative;
 }
 .server-card:hover {
   background: rgba(255,255,255,0.06);
@@ -252,6 +253,15 @@ img { max-width: 100%; height: auto; vertical-align: middle; }
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
+.server-card.server-best {
+  background: rgba(201,162,39,0.1);
+  border-color: var(--brass);
+  box-shadow: 0 0 25px rgba(201,162,39,0.15), inset 0 0 25px rgba(201,162,39,0.04);
+  transform: translateY(-3px);
+}
+.server-card.server-best .server-city {
+  color: var(--brass-bright);
+}
 
 @media (max-width: 992px) {
   .server-grid {