glow für neue Zeit

data/index.css

@@ -674,6 +674,88 @@ body {
   box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
 }
 
+.leaderboard-entry.latest {
+  border: 2px solid #00ff88;
+  animation: latest-pulse 1.6s ease-in-out infinite;
+  position: relative;
+  z-index: 1;
+}
+
+.leaderboard-entry.latest .name {
+  color: #ffffff;
+  font-weight: 800;
+  text-shadow: 0 0 8px rgba(0, 255, 136, 0.7);
+}
+
+.leaderboard-entry.latest .time {
+  color: #ffffff;
+  animation: latest-time-flash 1.6s ease-in-out infinite;
+}
+
+.latest-badge {
+  display: inline-block;
+  background: #00ff88;
+  color: #0d1733;
+  font-weight: 900;
+  font-size: clamp(0.6rem, 1vw, 0.85rem);
+  letter-spacing: 1px;
+  padding: 3px 8px;
+  border-radius: 5px;
+  flex-shrink: 0;
+  text-transform: uppercase;
+  animation: latest-badge-pulse 1.6s ease-in-out infinite;
+}
+
+@keyframes latest-pulse {
+  0%,
+  100% {
+    background: linear-gradient(
+      135deg,
+      rgba(0, 255, 136, 0.28) 0%,
+      rgba(0, 200, 110, 0.18) 100%
+    );
+    box-shadow: 0 0 8px rgba(0, 255, 136, 0.35),
+      inset 0 0 6px rgba(0, 255, 136, 0.18);
+    border-color: #00ff88;
+  }
+  50% {
+    background: linear-gradient(
+      135deg,
+      rgba(0, 255, 136, 0.5) 0%,
+      rgba(0, 230, 120, 0.32) 100%
+    );
+    box-shadow: 0 0 16px rgba(0, 255, 136, 0.6),
+      0 0 32px rgba(0, 255, 136, 0.3),
+      inset 0 0 10px rgba(255, 255, 255, 0.25);
+    border-color: #ffffff;
+  }
+}
+
+@keyframes latest-badge-pulse {
+  0%,
+  100% {
+    background: #00ff88;
+    color: #0d1733;
+    box-shadow: 0 0 5px rgba(0, 255, 136, 0.5);
+  }
+  50% {
+    background: #ffffff;
+    color: #006a3a;
+    box-shadow: 0 0 10px rgba(255, 255, 255, 0.7),
+      0 0 16px rgba(0, 255, 136, 0.55);
+  }
+}
+
+@keyframes latest-time-flash {
+  0%,
+  100% {
+    text-shadow: 0 0 6px rgba(0, 255, 136, 0.55);
+  }
+  50% {
+    text-shadow: 0 0 8px #ffffff, 0 0 14px rgba(0, 255, 136, 0.7);
+  }
+}
+
 .leaderboard-entry .rank {
   color: #ffd700;
   font-weight: bold;

data/index.html

@@ -168,23 +168,12 @@
               document.getElementById(indicatorId).classList.remove("active");
             }
           }
-          // Start-/Stopp-Event → Status kann jetzt wechseln (ready↔running).
-          // Bei Stop-Events den Display-Wert lokal einfrieren, damit der
-          // Timer nicht bis zum nächsten Sync weiterzählt und dann sichtbar
-          // zurückspringt. Anschließend sofort syncen, damit der Scheduler
-          // zwischen schneller (50 ms) und langsamer (500 ms) Taktung wechselt.
-          if (data.active === true) {
-            const now = Date.now();
-            if (data.button === "stop1" && status1 === "running") {
-              timer1 += (now - lastSync) / 1000;
-              status1 = "finished";
-            } else if (data.button === "stop2" && status2 === "running") {
-              timer2 += (now - lastSync) / 1000;
-              status2 = "finished";
-            }
-            kickDisplayScheduler();
-            syncFromBackend();
-          }
+          // Hinweis: Heartbeats und echte Tastendrücke kommen im WebSocket
+          // identisch als {button, mac, active: true} an. Eine optimistische
+          // Status-Übernahme (z. B. running→finished bei stop1) führte daher
+          // zu kurzem „Geschafft!"-Aufblitzen während des Laufs, sobald der
+          // Stop-Button einen periodischen Heartbeat sendete. Der Status
+          // kommt jetzt ausschließlich über syncFromBackend (1 s-Polling).
         }
 
         try {
@@ -495,9 +484,17 @@
         return `${hh}:${mm}:${ss}`;
       }
 
-      function createEntryElement(entry) {
+      function createEntryElement(entry, isLatest) {
         const div = document.createElement("div");
         div.className = "leaderboard-entry";
+        if (isLatest) div.classList.add("latest");
+
+        if (isLatest) {
+          const badge = document.createElement("span");
+          badge.className = "latest-badge";
+          badge.textContent = "NEU";
+          div.appendChild(badge);
+        }
 
         const nameSpan = document.createElement("span");
         nameSpan.className = "name";
@@ -527,7 +524,9 @@
           container.appendChild(empty);
           return;
         }
-        entries.forEach((e) => container.appendChild(createEntryElement(e)));
+        entries.forEach((e, i) =>
+          container.appendChild(createEntryElement(e, i === 0))
+        );
       }
 
       function updateLeaderboardDisplay() {

src/databasebackend.h

@@ -425,8 +425,12 @@ void setupBackendRoutes(AsyncWebServer &server) {
   // Erweiterte Leaderboard API (für Leaderboard-Seite - 10 Einträge)
   server.on(
       "/api/leaderboard-full", HTTP_GET, [](AsyncWebServerRequest *request) {
-        // Sortiere nach Zeit (beste zuerst)
-        std::sort(localTimes.begin(), localTimes.end(),
+        // Sortiere eine Kopie nach Zeit (beste zuerst). Niemals die globale
+        // localTimes-Liste sortieren - sonst geht die chronologische
+        // Reihenfolge verloren, die /api/leaderboard für "letzte Zeiten"
+        // braucht (und die per saveBestTimes auch persistiert wird).
+        std::vector<LocalTime> sortedTimes(localTimes);
+        std::sort(sortedTimes.begin(), sortedTimes.end(),
                   [](const LocalTime &a, const LocalTime &b) {
                     return a.timeMs < b.timeMs;
                   });
@@ -436,7 +440,7 @@ void setupBackendRoutes(AsyncWebServer &server) {
 
         // Nimm die besten 10
         int count = 0;
-        for (const auto &time : localTimes) {
+        for (const auto &time : sortedTimes) {
           if (count >= 10)
             break;