diff --git a/shopfloor-dashboard/index.html b/shopfloor-dashboard/index.html
index e5eb38f..a4a0f59 100644
--- a/shopfloor-dashboard/index.html
+++ b/shopfloor-dashboard/index.html
@@ -867,18 +867,26 @@
                 // Store for carousel
                 upcomingEvents = sortedUpcoming;
 
+                // Preserve current index if it's still valid, otherwise reset
+                if (currentUpcomingIndex >= sortedUpcoming.length) {
+                    console.log(`Carousel: Index ${currentUpcomingIndex} out of range, resetting to 0`);
+                    currentUpcomingIndex = 0;
+                } else {
+                    console.log(`Carousel: Preserving index ${currentUpcomingIndex} across refresh`);
+                }
+
                 html += '<div class="events-section">';
                 html += '<div class="section-title upcoming">UPCOMING (Next 72 Hours)</div>';
                 html += '<div class="upcoming-carousel-container">';
                 html += '<div class="upcoming-carousel-wrapper" id="upcomingCarousel">';
 
-                // Render all upcoming events (only first will be visible)
+                // Render all upcoming events (preserve current active index)
                 sortedUpcoming.forEach((event, index) => {
                     const borderColor = getColorFromType(event.typecolor);
                     const ticketBadge = event.ticketnumber
                         ? `<a href="${getServiceNowUrl(event.ticketnumber)}" target="_blank" class="event-ticket">${escapeHtml(event.ticketnumber)}</a>`
                         : '';
-                    const activeClass = index === 0 ? 'active' : 'enter-down';
+                    const activeClass = index === currentUpcomingIndex ? 'active' : 'enter-down';
                     html += `
                         <div class="event-card upcoming carousel-item ${activeClass}" data-index="${index}" style="border-left-color: ${borderColor};">
                             <div>${ticketBadge}</div>
@@ -896,9 +904,6 @@
                 html += '</div>'; // Close carousel wrapper
                 html += '</div>'; // Close carousel container
                 html += '</div>'; // Close section
-
-                // Reset carousel index
-                currentUpcomingIndex = 0;
             }
 
             // No events message