@optifye/dashboard-core 6.12.44 → 6.12.46

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import { format, addDays, subMonths, endOfMonth, startOfMonth, endOfDay, eachDayOfInterval, getDay, isSameDay, isWithinInterval, startOfDay, parseISO, subDays, differenceInMinutes, addMinutes, addMonths, isValid, formatDistanceToNow, isToday, isFuture, isBefore } from 'date-fns';
 import { formatInTimeZone, fromZonedTime, toZonedTime } from 'date-fns-tz';
-import * as React147 from 'react';
-import React147__default, { createContext, useRef, useId, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
+import * as React148 from 'react';
+import React148__default, { createContext, useRef, useId, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useRouter } from 'next/router';
 import { toast } from 'sonner';
@@ -2091,14 +2091,14 @@ var useIdleTimeVlmConfig = () => {
   }
   return context;
 };
-var DashboardConfigContext = React147.createContext(void 0);
+var DashboardConfigContext = React148.createContext(void 0);
 var DashboardProvider = ({ config: userProvidedConfig, children }) => {
-  const fullConfig = React147.useMemo(() => mergeWithDefaultConfig(userProvidedConfig), [userProvidedConfig]);
+  const fullConfig = React148.useMemo(() => mergeWithDefaultConfig(userProvidedConfig), [userProvidedConfig]);
   _setDashboardConfigInstance(fullConfig);
-  React147.useEffect(() => {
+  React148.useEffect(() => {
     _setDashboardConfigInstance(fullConfig);
   }, [fullConfig]);
-  React147.useEffect(() => {
+  React148.useEffect(() => {
     if (!fullConfig.theme) return;
     const styleId = "dashboard-core-theme-vars";
     let styleEl = document.getElementById(styleId);
@@ -2124,7 +2124,7 @@ var DashboardProvider = ({ config: userProvidedConfig, children }) => {
   return /* @__PURE__ */ jsx(DashboardConfigContext.Provider, { value: fullConfig, children: /* @__PURE__ */ jsx(IdleTimeVlmConfigProvider, { children }) });
 };
 var useDashboardConfig = () => {
-  const ctx = React147.useContext(DashboardConfigContext);
+  const ctx = React148.useContext(DashboardConfigContext);
   if (!ctx) throw new Error("useDashboardConfig must be used within a DashboardProvider");
   return ctx;
 };
@@ -9290,6 +9290,7 @@ var CLIP_COUNTS_CACHE_TTL = 30 * 1e3;
 var CLIP_BY_ID_CACHE_TTL = 2 * 60 * 1e3;
 var CLIP_BY_ID_CACHE_MAX = 200;
 var CLIPS_INIT_CACHE_TTL = 30 * 1e3;
+var RECENT_FLOW_RED_STREAK_CLIP_TYPE = "recent_flow_red_streak";
 var parseFiniteNumber = (value) => {
   if (typeof value === "number" && Number.isFinite(value)) {
     return value;
@@ -9885,6 +9886,7 @@ var S3ClipsSupabaseService = class {
       case "long_cycle_time":
       case "worst_cycle_time":
       case "sop_deviations":
+      case RECENT_FLOW_RED_STREAK_CLIP_TYPE:
         return "high";
       case "idle_time":
         return "medium";
@@ -9905,7 +9907,8 @@ var S3ClipsSupabaseService = class {
       "best_cycle_time": "Best Cycle Time Performance",
       "worst_cycle_time": "Worst Cycle Time Performance",
       "sop_deviations": "SOP Deviations",
-      "cycle_completion": "Cycle Completion"
+      "cycle_completion": "Cycle Completion",
+      [RECENT_FLOW_RED_STREAK_CLIP_TYPE]: "Moments with low efficiency"
     };
     return clipType ? descriptions[clipType] || "Analysis Clip" : "Analysis Clip";
   }
@@ -12827,7 +12830,7 @@ var useMobileMenu = () => {
 };
 var useHideMobileHeader = (shouldHide = true) => {
   const context = useMobileMenu();
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (context && shouldHide) {
       context.setHideMobileHeader(true);
       return () => {
@@ -25910,7 +25913,7 @@ var MotionConfigContext = createContext({
 });
 
 // ../../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs
-var PopChildMeasure = class extends React147.Component {
+var PopChildMeasure = class extends React148.Component {
   getSnapshotBeforeUpdate(prevProps) {
     const element = this.props.childRef.current;
     if (element && prevProps.isPresent && !this.props.isPresent) {
@@ -25965,7 +25968,7 @@ function PopChild({ children, isPresent }) {
       document.head.removeChild(style);
     };
   }, [isPresent]);
-  return jsx(PopChildMeasure, { isPresent, childRef: ref, sizeRef: size, children: React147.cloneElement(children, { ref }) });
+  return jsx(PopChildMeasure, { isPresent, childRef: ref, sizeRef: size, children: React148.cloneElement(children, { ref }) });
 }
 
 // ../../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs
@@ -26002,7 +26005,7 @@ var PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, pre
   useMemo(() => {
     presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
   }, [isPresent]);
-  React147.useEffect(() => {
+  React148.useEffect(() => {
     !isPresent && !presenceChildren.size && onExitComplete && onExitComplete();
   }, [isPresent]);
   if (mode === "popLayout") {
@@ -33787,7 +33790,7 @@ var withAuth = (WrappedComponent2, options) => {
     requireAuth: true,
     ...options
   };
-  const WithAuthComponent = React147.memo(function WithAuthComponent2(props) {
+  const WithAuthComponent = React148.memo(function WithAuthComponent2(props) {
     const {
       session,
       user,
@@ -33798,9 +33801,9 @@ var withAuth = (WrappedComponent2, options) => {
       retrySessionHydration
     } = useAuth();
     const router = useRouter();
-    const [localLoading, setLocalLoading] = React147.useState(loading);
-    const [loadingTimeoutReached, setLoadingTimeoutReached] = React147.useState(false);
-    React147.useEffect(() => {
+    const [localLoading, setLocalLoading] = React148.useState(loading);
+    const [loadingTimeoutReached, setLoadingTimeoutReached] = React148.useState(false);
+    React148.useEffect(() => {
       if (process.env.NODE_ENV === "development" && process.env.DEBUG_AUTH === "true") {
         console.log("withAuth state:", {
           loading,
@@ -33812,7 +33815,7 @@ var withAuth = (WrappedComponent2, options) => {
         });
       }
     }, [authStatus, error, loading, session, user]);
-    const handleLoadingTimeout = React147.useCallback(() => {
+    const handleLoadingTimeout = React148.useCallback(() => {
       console.warn("[withAuth] Loading timeout reached");
       setLoadingTimeoutReached(true);
       if (hasStoredSupabaseSession()) {
@@ -33824,13 +33827,13 @@ var withAuth = (WrappedComponent2, options) => {
         router.replace(defaultOptions.redirectTo);
       }
     }, [retrySessionHydration, router]);
-    React147.useEffect(() => {
+    React148.useEffect(() => {
       if (!loading && authStatus !== "recovering" && defaultOptions.requireAuth && !session && !error) {
         console.log("[withAuth] No session found, redirecting to login");
         router.replace(defaultOptions.redirectTo);
       }
     }, [authStatus, defaultOptions.requireAuth, error, loading, router, session]);
-    React147.useEffect(() => {
+    React148.useEffect(() => {
       setLocalLoading(loading);
     }, [loading]);
     if (loading || localLoading) {
@@ -34829,11 +34832,11 @@ var BarChartComponent = ({
   aspect = 2,
   ...restOfChartProps
 }) => {
-  const containerRef = React147__default.useRef(null);
-  const [containerReady, setContainerReady] = React147__default.useState(false);
+  const containerRef = React148__default.useRef(null);
+  const [containerReady, setContainerReady] = React148__default.useState(false);
   const themeConfig = useThemeConfig();
   const { formatNumber } = useFormatNumber();
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -34947,7 +34950,7 @@ var BarChartComponent = ({
   }
   return /* @__PURE__ */ jsx("div", { className: clsx("w-full", className), children: chartContent });
 };
-var BarChart = React147__default.memo(BarChartComponent, (prevProps, nextProps) => {
+var BarChart = React148__default.memo(BarChartComponent, (prevProps, nextProps) => {
   if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || JSON.stringify(prevProps.referenceLines || []) !== JSON.stringify(nextProps.referenceLines || []) || prevProps.layout !== nextProps.layout || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect) {
     return false;
   }
@@ -34998,10 +35001,10 @@ var LineChartComponent = ({
   fillContainer = false,
   ...restOfChartProps
 }) => {
-  const containerRef = React147__default.useRef(null);
-  const [dimensions, setDimensions] = React147__default.useState({ width: 0, height: 0 });
-  const [hasValidData, setHasValidData] = React147__default.useState(false);
-  React147__default.useEffect(() => {
+  const containerRef = React148__default.useRef(null);
+  const [dimensions, setDimensions] = React148__default.useState({ width: 0, height: 0 });
+  const [hasValidData, setHasValidData] = React148__default.useState(false);
+  React148__default.useEffect(() => {
     const currentHasValidData = data && lines && lines.length > 0 && data.some(
       (item) => lines.some((line) => {
         const val = item[line.dataKey];
@@ -35012,7 +35015,7 @@ var LineChartComponent = ({
       setHasValidData(true);
     }
   }, [data, lines, hasValidData]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver((entries) => {
       const entry = entries[0];
@@ -35137,7 +35140,7 @@ var LineChartComponent = ({
   }
   return /* @__PURE__ */ jsx("div", { className: clsx("w-full", className), children: renderChartContent(restOfChartProps.width, restOfChartProps.height) });
 };
-var LineChart = React147__default.memo(LineChartComponent, (prevProps, nextProps) => {
+var LineChart = React148__default.memo(LineChartComponent, (prevProps, nextProps) => {
   if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect || JSON.stringify(prevProps.yAxisDomain) !== JSON.stringify(nextProps.yAxisDomain)) {
     return false;
   }
@@ -35304,7 +35307,7 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
   );
 };
 var PerSkuView = ({ rows, className = "", selectedSkuId, liveSkuId, onSelectSku }) => {
-  const ordered = React147__default.useMemo(
+  const ordered = React148__default.useMemo(
     () => [...rows].sort((a, b) => {
       const am = (b.active_minutes ?? 0) - (a.active_minutes ?? 0);
       if (am !== 0) return am;
@@ -35312,9 +35315,9 @@ var PerSkuView = ({ rows, className = "", selectedSkuId, liveSkuId, onSelectSku
     }),
     [rows]
   );
-  const scrollContainerRef = React147__default.useRef(null);
-  const [showScrollIndicatorBottom, setShowScrollIndicatorBottom] = React147__default.useState(ordered.length > 4);
-  const [showScrollIndicatorTop, setShowScrollIndicatorTop] = React147__default.useState(false);
+  const scrollContainerRef = React148__default.useRef(null);
+  const [showScrollIndicatorBottom, setShowScrollIndicatorBottom] = React148__default.useState(ordered.length > 4);
+  const [showScrollIndicatorTop, setShowScrollIndicatorTop] = React148__default.useState(false);
   const handleScroll = (e) => {
     const target = e.currentTarget;
     if (target.scrollHeight - target.scrollTop <= target.clientHeight + 10) {
@@ -35338,7 +35341,7 @@ var PerSkuView = ({ rows, className = "", selectedSkuId, liveSkuId, onSelectSku
       scrollContainerRef.current.scrollBy({ top: -80, behavior: "smooth" });
     }
   };
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (scrollContainerRef.current) {
       const target = scrollContainerRef.current;
       setShowScrollIndicatorBottom(target.scrollHeight > target.clientHeight && target.scrollHeight - target.scrollTop > target.clientHeight + 10);
@@ -35411,7 +35414,7 @@ var OutputProgressChartComponent = ({
   liveSkuId,
   onSelectSku
 }) => {
-  const realSkuRows = React147__default.useMemo(
+  const realSkuRows = React148__default.useMemo(
     () => filterRealSkuBreakdown(skuBreakdown),
     [skuBreakdown]
   );
@@ -35436,7 +35439,7 @@ var OutputProgressChartComponent = ({
     }
   );
 };
-var OutputProgressChart = React147__default.memo(OutputProgressChartComponent);
+var OutputProgressChart = React148__default.memo(OutputProgressChartComponent);
 OutputProgressChart.displayName = "OutputProgressChart";
 var LargeOutputProgressChart = ({
   currentOutput,
@@ -35576,7 +35579,7 @@ var CycleTimeChartComponent = ({
     }
   ) }) });
 };
-var CycleTimeChart = React147__default.memo(CycleTimeChartComponent, (prevProps, nextProps) => {
+var CycleTimeChart = React148__default.memo(CycleTimeChartComponent, (prevProps, nextProps) => {
   if (prevProps.className !== nextProps.className) {
     return false;
   }
@@ -35816,16 +35819,16 @@ var CycleTimeOverTimeChart = ({
   onHourClick
 }) => {
   const MAX_DATA_POINTS = 40;
-  const containerRef = React147__default.useRef(null);
-  const [dimensions, setDimensions] = React147__default.useState({ width: 0, height: 0 });
-  const [hasValidData, setHasValidData] = React147__default.useState(false);
-  React147__default.useEffect(() => {
+  const containerRef = React148__default.useRef(null);
+  const [dimensions, setDimensions] = React148__default.useState({ width: 0, height: 0 });
+  const [hasValidData, setHasValidData] = React148__default.useState(false);
+  React148__default.useEffect(() => {
     const currentHasValidData = data && data.some((val) => val !== null && val > 0);
     if (currentHasValidData && !hasValidData) {
       setHasValidData(true);
     }
   }, [data, hasValidData]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver((entries) => {
       const entry = entries[0];
@@ -35863,7 +35866,7 @@ var CycleTimeOverTimeChart = ({
     const endLabel = shiftEnd && slotIndex === DURATION - 1 ? formatHourLabel(slotIndex + 1) : formatHourLabel(slotIndex + 1);
     return `${startLabel} - ${endLabel}`;
   };
-  const getDisplayData = React147__default.useCallback((rawData) => {
+  const getDisplayData = React148__default.useCallback((rawData) => {
     if (xAxisMode === "hourly") return rawData;
     return rawData.slice(Math.max(0, rawData.length - MAX_DATA_POINTS));
   }, [xAxisMode]);
@@ -35871,7 +35874,7 @@ var CycleTimeOverTimeChart = ({
   const DURATION = displayData.length;
   const effectiveDatasetKey = datasetKey || `cycle-time:${xAxisMode}`;
   const finalData = displayData;
-  const labelInterval = React147__default.useMemo(() => {
+  const labelInterval = React148__default.useMemo(() => {
     if (xAxisMode === "hourly") {
       return Math.max(1, Math.ceil(DURATION / 8));
     }
@@ -35912,8 +35915,8 @@ var CycleTimeOverTimeChart = ({
       return `${minutes} minutes ${seconds} seconds ago`;
     }
   };
-  const getNumericValue = React147__default.useCallback((value) => typeof value === "number" && Number.isFinite(value) ? value : null, []);
-  const buildHourClickPayload = React147__default.useCallback((dataPoint) => {
+  const getNumericValue = React148__default.useCallback((value) => typeof value === "number" && Number.isFinite(value) ? value : null, []);
+  const buildHourClickPayload = React148__default.useCallback((dataPoint) => {
     if (!onHourClick || xAxisMode !== "hourly") {
       return null;
     }
@@ -35932,7 +35935,7 @@ var CycleTimeOverTimeChart = ({
       status: cycleTime !== null && cycleTime <= idealCycleTime ? "within_standard" : "above_standard"
     };
   }, [DURATION, getNumericValue, idealCycleTime, onHourClick, shiftEnd, shiftStart, xAxisMode]);
-  const renderChartTooltip = React147__default.useCallback((tooltipProps) => {
+  const renderChartTooltip = React148__default.useCallback((tooltipProps) => {
     const { active, payload } = tooltipProps;
     if (!active || !Array.isArray(payload) || payload.length === 0) {
       return null;
@@ -35996,7 +35999,7 @@ var CycleTimeOverTimeChart = ({
       ] })
     ] });
   }, [getNumericValue, onHourClick, shiftStart, showIdleTime, xAxisMode]);
-  const renderCycleDot = React147__default.useCallback((props) => {
+  const renderCycleDot = React148__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const cycleTime = getNumericValue(payload?.cycleTime);
     if (cycleTime === null) {
@@ -36036,7 +36039,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [buildHourClickPayload, getNumericValue, idealCycleTime, onHourClick, selectedHourIndex]);
-  const renderCycleActiveDot = React147__default.useCallback((props) => {
+  const renderCycleActiveDot = React148__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const cycleTime = getNumericValue(payload?.cycleTime);
     if (cycleTime === null) {
@@ -36065,7 +36068,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [buildHourClickPayload, getNumericValue, idealCycleTime, onHourClick, selectedHourIndex]);
-  const renderIdleDot = React147__default.useCallback((props) => {
+  const renderIdleDot = React148__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const idleMinutes = getNumericValue(payload?.idleMinutes);
     if (idleMinutes === null) {
@@ -36087,7 +36090,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [getNumericValue, showIdleTime]);
-  const renderIdleActiveDot = React147__default.useCallback((props) => {
+  const renderIdleActiveDot = React148__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const idleMinutes = getNumericValue(payload?.idleMinutes);
     if (idleMinutes === null || !showIdleTime) {
@@ -36105,7 +36108,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [getNumericValue, showIdleTime]);
-  const chartData = React147__default.useMemo(() => Array.from({ length: DURATION }, (_, i) => {
+  const chartData = React148__default.useMemo(() => Array.from({ length: DURATION }, (_, i) => {
     const cycleTime = getNumericValue(finalData[i]);
     const useIdleSlots = idleTimeSlots.length > 0;
     const idleSlot = useIdleSlots ? idleTimeSlots[i] ?? null : null;
@@ -36302,7 +36305,7 @@ var CycleTimeOverTimeChart = ({
     }
   );
 };
-var Card = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Card = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -36314,7 +36317,7 @@ var Card = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ));
 Card.displayName = "Card";
-var CardHeader = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardHeader = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -36323,7 +36326,7 @@ var CardHeader = React147.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -36335,7 +36338,7 @@ var CardTitle = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardDescription = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "p",
   {
     ref,
@@ -36344,9 +36347,9 @@ var CardDescription = React147.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+var CardContent = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
 CardContent.displayName = "CardContent";
-var CardFooter = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -36422,7 +36425,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React147.forwardRef(
+var Button = React148.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return /* @__PURE__ */ jsx(
@@ -37180,14 +37183,14 @@ var HourlyOutputChartComponent = ({
   onAiSummaryClick,
   className = ""
 }) => {
-  const containerRef = React147__default.useRef(null);
-  const [containerReady, setContainerReady] = React147__default.useState(false);
-  const [containerWidth, setContainerWidth] = React147__default.useState(0);
-  const [hoveredSkuRailLabel, setHoveredSkuRailLabel] = React147__default.useState(null);
-  const [isTooltipHovered, setIsTooltipHovered] = React147__default.useState(false);
-  const lastTooltipDataRef = React147__default.useRef(null);
-  const tooltipHoverTimeoutRef = React147__default.useRef(null);
-  const idleSlots = React147__default.useMemo(
+  const containerRef = React148__default.useRef(null);
+  const [containerReady, setContainerReady] = React148__default.useState(false);
+  const [containerWidth, setContainerWidth] = React148__default.useState(0);
+  const [hoveredSkuRailLabel, setHoveredSkuRailLabel] = React148__default.useState(null);
+  const [isTooltipHovered, setIsTooltipHovered] = React148__default.useState(false);
+  const lastTooltipDataRef = React148__default.useRef(null);
+  const tooltipHoverTimeoutRef = React148__default.useRef(null);
+  const idleSlots = React148__default.useMemo(
     () => buildHourlyIdleSlots({
       idleTimeHourly,
       shiftStart,
@@ -37196,12 +37199,12 @@ var HourlyOutputChartComponent = ({
     [idleTimeHourly, shiftStart, shiftEnd]
   );
   const SHIFT_DURATION = idleSlots.length;
-  const [animatedData, setAnimatedData] = React147__default.useState(
+  const [animatedData, setAnimatedData] = React148__default.useState(
     () => Array(SHIFT_DURATION).fill(0)
   );
-  const prevDataRef = React147__default.useRef(Array(SHIFT_DURATION).fill(0));
-  const animationFrameRef = React147__default.useRef(null);
-  React147__default.useEffect(() => {
+  const prevDataRef = React148__default.useRef(Array(SHIFT_DURATION).fill(0));
+  const animationFrameRef = React148__default.useRef(null);
+  React148__default.useEffect(() => {
     setAnimatedData((prev) => {
       if (prev.length !== SHIFT_DURATION) {
         return Array(SHIFT_DURATION).fill(0);
@@ -37210,14 +37213,14 @@ var HourlyOutputChartComponent = ({
     });
     prevDataRef.current = Array(SHIFT_DURATION).fill(0);
   }, [SHIFT_DURATION]);
-  const [idleBarState, setIdleBarState] = React147__default.useState({
+  const [idleBarState, setIdleBarState] = React148__default.useState({
     visible: showIdleTime,
     key: 0,
     shouldAnimate: false
   });
-  const prevShowIdleTimeRef = React147__default.useRef(showIdleTime);
-  const stateUpdateTimeoutRef = React147__default.useRef(null);
-  React147__default.useEffect(() => {
+  const prevShowIdleTimeRef = React148__default.useRef(showIdleTime);
+  const stateUpdateTimeoutRef = React148__default.useRef(null);
+  React148__default.useEffect(() => {
     if (stateUpdateTimeoutRef.current) {
       clearTimeout(stateUpdateTimeoutRef.current);
     }
@@ -37242,7 +37245,7 @@ var HourlyOutputChartComponent = ({
       }
     };
   }, [showIdleTime]);
-  const animateToNewData = React147__default.useCallback((targetData) => {
+  const animateToNewData = React148__default.useCallback((targetData) => {
     const startData = [...prevDataRef.current];
     const startTime = performance.now();
     const duration = 1200;
@@ -37272,7 +37275,7 @@ var HourlyOutputChartComponent = ({
     }
     animationFrameRef.current = requestAnimationFrame(animate);
   }, []);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (JSON.stringify(data) !== JSON.stringify(prevDataRef.current)) {
       const shiftData = data.slice(0, SHIFT_DURATION);
       animateToNewData(shiftData);
@@ -37283,14 +37286,14 @@ var HourlyOutputChartComponent = ({
       }
     };
   }, [data, animateToNewData]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     return () => {
       if (tooltipHoverTimeoutRef.current) {
         clearTimeout(tooltipHoverTimeoutRef.current);
       }
     };
   }, []);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -37316,7 +37319,7 @@ var HourlyOutputChartComponent = ({
       clearTimeout(fallbackTimeout);
     };
   }, []);
-  const xAxisConfig = React147__default.useMemo(() => {
+  const xAxisConfig = React148__default.useMemo(() => {
     if (containerWidth >= 960) {
       return {
         interval: 0,
@@ -37337,13 +37340,13 @@ var HourlyOutputChartComponent = ({
     }
     return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
   }, [containerWidth]);
-  const shiftWindow = React147__default.useMemo(() => resolveShiftWindow2({
+  const shiftWindow = React148__default.useMemo(() => resolveShiftWindow2({
     shiftStart,
     slotCount: SHIFT_DURATION,
     shiftDate,
     timezone
   }), [shiftStart, shiftEnd, SHIFT_DURATION, shiftDate, timezone]);
-  const fallbackTimelineEndOffset = React147__default.useMemo(
+  const fallbackTimelineEndOffset = React148__default.useMemo(
     () => resolveTimelineEndOffset({
       shiftStart,
       shiftEnd,
@@ -37353,7 +37356,7 @@ var HourlyOutputChartComponent = ({
     }),
     [shiftStart, shiftEnd, SHIFT_DURATION, shiftDate, timezone]
   );
-  const observedTimelineEndOffset = React147__default.useMemo(() => {
+  const observedTimelineEndOffset = React148__default.useMemo(() => {
     let lastObservedMinute = -1;
     idleSlots.forEach((slot) => {
       slot.idleArray.forEach((value, minuteIndex) => {
@@ -37369,7 +37372,7 @@ var HourlyOutputChartComponent = ({
     return Math.min((lastObservedMinute + 1) / 60, SHIFT_DURATION);
   }, [idleSlots, SHIFT_DURATION]);
   const timelineEndOffset = observedTimelineEndOffset ?? fallbackTimelineEndOffset;
-  const targetLineEndOffset = React147__default.useMemo(() => {
+  const targetLineEndOffset = React148__default.useMemo(() => {
     if (timelineEndOffset >= SHIFT_DURATION) {
       return SHIFT_DURATION;
     }
@@ -37378,7 +37381,7 @@ var HourlyOutputChartComponent = ({
     }
     return Math.min(Math.floor(timelineEndOffset) + 1, SHIFT_DURATION);
   }, [timelineEndOffset, SHIFT_DURATION]);
-  const skuTimelineSegments = React147__default.useMemo(() => {
+  const skuTimelineSegments = React148__default.useMemo(() => {
     if (!skuSegments || skuSegments.length === 0 || !shiftWindow || timelineEndOffset <= 0) {
       return [];
     }
@@ -37412,18 +37415,18 @@ var HourlyOutputChartComponent = ({
       };
     }).filter((segment) => segment.end > segment.start);
   }, [skuSegments, shiftWindow, timelineEndOffset, pphThreshold]);
-  const targetTimelineSegments = React147__default.useMemo(() => {
+  const targetTimelineSegments = React148__default.useMemo(() => {
     if (skuTimelineSegments.length === 0) return [];
     return skuTimelineSegments.map((segment, index) => ({
       ...segment,
       end: index === skuTimelineSegments.length - 1 ? Math.max(segment.start, targetLineEndOffset) : segment.end
     })).filter((segment) => segment.end > segment.start);
   }, [skuTimelineSegments, targetLineEndOffset]);
-  const hasExplicitHourlyTargetOutputProp = React147__default.useMemo(
+  const hasExplicitHourlyTargetOutputProp = React148__default.useMemo(
     () => hourlyTargetOutput !== void 0,
     [hourlyTargetOutput]
   );
-  const fallbackHourlyTargetOutput = React147__default.useMemo(() => {
+  const fallbackHourlyTargetOutput = React148__default.useMemo(() => {
     if (hasExplicitHourlyTargetOutputProp) return void 0;
     if (skuTimelineSegments.length > 0) return void 0;
     const plan = buildHourlyTargetPlan({
@@ -37443,19 +37446,19 @@ var HourlyOutputChartComponent = ({
     shiftBreaks,
     pphThreshold
   ]);
-  const effectiveHourlyTargetOutput = React147__default.useMemo(
+  const effectiveHourlyTargetOutput = React148__default.useMemo(
     () => hasExplicitHourlyTargetOutputProp ? hourlyTargetOutput : fallbackHourlyTargetOutput,
     [hasExplicitHourlyTargetOutputProp, hourlyTargetOutput, fallbackHourlyTargetOutput]
   );
-  const hasHourlyTargetOutputProp = React147__default.useMemo(
+  const hasHourlyTargetOutputProp = React148__default.useMemo(
     () => effectiveHourlyTargetOutput !== void 0,
     [effectiveHourlyTargetOutput]
   );
-  const hasExplicitHourlyTargets = React147__default.useMemo(
+  const hasExplicitHourlyTargets = React148__default.useMemo(
     () => Array.isArray(effectiveHourlyTargetOutput) && effectiveHourlyTargetOutput.some((value) => value !== null && value !== void 0),
     [effectiveHourlyTargetOutput]
   );
-  const hourlyTargetSegments = React147__default.useMemo(() => {
+  const hourlyTargetSegments = React148__default.useMemo(() => {
     if (!hasExplicitHourlyTargets) return [];
     const segments = [];
     let runStart = null;
@@ -37487,7 +37490,7 @@ var HourlyOutputChartComponent = ({
     flush(SHIFT_DURATION);
     return segments.filter((segment) => segment.end > segment.start);
   }, [SHIFT_DURATION, hasExplicitHourlyTargets, effectiveHourlyTargetOutput]);
-  const activeSkuHourIndices = React147__default.useMemo(() => {
+  const activeSkuHourIndices = React148__default.useMemo(() => {
     const indices = /* @__PURE__ */ new Set();
     const targets = Array(SHIFT_DURATION).fill(pphThreshold);
     if (!skuSegments || !shiftWindow) return { indices, targets, hasTimeline: false };
@@ -37520,7 +37523,7 @@ var HourlyOutputChartComponent = ({
     }
     return { indices, targets, hasTimeline: true };
   }, [skuSegments, activeSkuId, shiftWindow, SHIFT_DURATION, pphThreshold]);
-  const chartData = React147__default.useMemo(() => {
+  const chartData = React148__default.useMemo(() => {
     const { indices, targets, hasTimeline } = activeSkuHourIndices;
     return Array.from({ length: SHIFT_DURATION }, (_, i) => {
       const idleSlot = idleSlots[i];
@@ -37549,7 +37552,7 @@ var HourlyOutputChartComponent = ({
       };
     });
   }, [animatedData, data, pphThreshold, idleSlots, SHIFT_DURATION, activeSkuHourIndices, activeSkuId, effectiveHourlyTargetOutput, hasHourlyTargetOutputProp, selectedHourIndex]);
-  const renderSkuTimelineRail = React147__default.useCallback((props) => {
+  const renderSkuTimelineRail = React148__default.useCallback((props) => {
     if (!skuTimelineSegments.length || SHIFT_DURATION <= 0) return null;
     const offset = props?.offset;
     if (!offset) return null;
@@ -37698,7 +37701,7 @@ var HourlyOutputChartComponent = ({
       })
     ] });
   }, [skuTimelineSegments, SHIFT_DURATION, activeSkuId]);
-  const IdleBar = React147__default.useMemo(() => {
+  const IdleBar = React148__default.useMemo(() => {
     if (!idleBarState.visible) return null;
     return /* @__PURE__ */ jsx(
       Bar,
@@ -37792,7 +37795,7 @@ var HourlyOutputChartComponent = ({
     }
     return filteredTicks;
   };
-  const renderTargetLine = React147__default.useCallback((props) => {
+  const renderTargetLine = React148__default.useCallback((props) => {
     const { offset, yAxisMap } = props;
     if (!offset || !yAxisMap || SHIFT_DURATION <= 0 || targetLineEndOffset <= 0) return null;
     const { left, width } = offset;
@@ -38293,7 +38296,7 @@ var HourlyOutputChartComponent = ({
     }
   );
 };
-var HourlyOutputChart = React147__default.memo(
+var HourlyOutputChart = React148__default.memo(
   HourlyOutputChartComponent,
   (prevProps, nextProps) => {
     if (prevProps.pphThreshold !== nextProps.pphThreshold || prevProps.shiftStart !== nextProps.shiftStart || prevProps.shiftEnd !== nextProps.shiftEnd || prevProps.shiftDate !== nextProps.shiftDate || prevProps.timezone !== nextProps.timezone || prevProps.showIdleTime !== nextProps.showIdleTime || prevProps.activeSkuId !== nextProps.activeSkuId || prevProps.selectedHourIndex !== nextProps.selectedHourIndex || prevProps.onHourClick !== nextProps.onHourClick || prevProps.className !== nextProps.className) {
@@ -38747,7 +38750,7 @@ function getTrendArrowAndColor(trend) {
     return { arrow: "\u2192", color: "text-gray-400" };
   }
 }
-var VideoCard = React147__default.memo(({
+var VideoCard = React148__default.memo(({
   workspace,
   hlsUrl,
   shouldPlay,
@@ -39017,7 +39020,7 @@ var hasRecentHealthSignal = (lastHeartbeat) => {
   if (!Number.isFinite(heartbeatMs)) return false;
   return Date.now() - heartbeatMs <= RECENT_HEALTH_SIGNAL_MS;
 };
-var VideoGridView = React147__default.memo(({
+var VideoGridView = React148__default.memo(({
   workspaces,
   blueComparisonWorkspaces,
   selectedLine,
@@ -39456,7 +39459,7 @@ var VideoGridView = React147__default.memo(({
   ) });
 });
 VideoGridView.displayName = "VideoGridView";
-var MapGridView = React147__default.memo(({
+var MapGridView = React148__default.memo(({
   workspaces,
   className = "",
   displayNames = {},
@@ -39677,13 +39680,13 @@ var WorkspaceMetricCardsImpl = ({
   liveSkuId
 }) => {
   const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
-  const activeSku = React147__default.useMemo(() => {
+  const activeSku = React148__default.useMemo(() => {
     if (skuAware && activeSkuId && skuBreakdown) {
       return skuBreakdown.find((s) => s.sku_id === activeSkuId);
     }
     return null;
   }, [skuAware, activeSkuId, skuBreakdown]);
-  const displaySku = React147__default.useMemo(() => {
+  const displaySku = React148__default.useMemo(() => {
     if (activeSku) return activeSku;
     if (skuAware && !activeSkuId && liveSkuId && skuBreakdown) {
       return skuBreakdown.find((s) => s.sku_id === liveSkuId) ?? null;
@@ -40337,7 +40340,7 @@ var UptimeLineChartComponent = ({ points, className = "" }) => {
     )
   ] }) }) });
 };
-var UptimeLineChart = React147__default.memo(UptimeLineChartComponent);
+var UptimeLineChart = React148__default.memo(UptimeLineChartComponent);
 var getTimeFromTimeString = (timeStr) => {
   if (!timeStr) {
     return { hour: 0, minute: 0, decimalHour: 0 };
@@ -40361,10 +40364,10 @@ var HourlyUptimeChartComponent = ({
   shiftBreaks,
   className = ""
 }) => {
-  const containerRef = React147__default.useRef(null);
-  const [containerReady, setContainerReady] = React147__default.useState(false);
-  const [containerWidth, setContainerWidth] = React147__default.useState(0);
-  const uptimeSeries = React147__default.useMemo(() => buildUptimeSeries({
+  const containerRef = React148__default.useRef(null);
+  const [containerReady, setContainerReady] = React148__default.useState(false);
+  const [containerWidth, setContainerWidth] = React148__default.useState(0);
+  const uptimeSeries = React148__default.useMemo(() => buildUptimeSeries({
     idleTimeHourly,
     shiftStart,
     shiftEnd,
@@ -40374,11 +40377,11 @@ var HourlyUptimeChartComponent = ({
     shiftBreaks
   }), [idleTimeHourly, shiftStart, shiftEnd, shiftDate, timezone, elapsedMinutes, shiftBreaks]);
   const hasAggregateData = Boolean(hourlyAggregates && hourlyAggregates.length > 0);
-  const shiftStartTime = React147__default.useMemo(
+  const shiftStartTime = React148__default.useMemo(
     () => getTimeFromTimeString(shiftStart),
     [shiftStart]
   );
-  const { shiftDuration, shiftEndTime } = React147__default.useMemo(() => {
+  const { shiftDuration, shiftEndTime } = React148__default.useMemo(() => {
     if (!shiftEnd) {
       const fallbackHours = uptimeSeries.shiftMinutes > 0 ? Math.ceil(uptimeSeries.shiftMinutes / 60) : 0;
       return { shiftDuration: fallbackHours, shiftEndTime: null };
@@ -40392,7 +40395,7 @@ var HourlyUptimeChartComponent = ({
     const hourCount = hasPartial ? Math.ceil(duration) : Math.round(duration);
     return { shiftDuration: hourCount, shiftEndTime: endTime };
   }, [shiftEnd, shiftStartTime.decimalHour, uptimeSeries.shiftMinutes]);
-  const formatHour = React147__default.useCallback((hourIndex) => {
+  const formatHour = React148__default.useCallback((hourIndex) => {
     const isLastHour = hourIndex === shiftDuration - 1;
     const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
     const startHour = Math.floor(startDecimalHour) % 24;
@@ -40417,7 +40420,7 @@ var HourlyUptimeChartComponent = ({
     };
     return `${formatTime5(startHour, startMinute)}-${formatTime5(endHour, endMinute)}`;
   }, [shiftDuration, shiftStartTime.decimalHour, shiftEndTime]);
-  const formatTimeRange2 = React147__default.useCallback((hourIndex) => {
+  const formatTimeRange2 = React148__default.useCallback((hourIndex) => {
     const isLastHour = hourIndex === shiftDuration - 1;
     const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
     const startHour = Math.floor(startDecimalHour) % 24;
@@ -40439,7 +40442,7 @@ var HourlyUptimeChartComponent = ({
     };
     return `${formatTime5(startHour, startMinute)} - ${formatTime5(endHour, endMinute)}`;
   }, [shiftDuration, shiftStartTime.decimalHour, shiftEndTime]);
-  const chartData = React147__default.useMemo(() => {
+  const chartData = React148__default.useMemo(() => {
     if (shiftDuration <= 0) return [];
     if (hasAggregateData) {
       return hourlyAggregates.map((entry, hourIndex) => ({
@@ -40481,7 +40484,7 @@ var HourlyUptimeChartComponent = ({
   }, [hasAggregateData, hourlyAggregates, uptimeSeries.points, uptimeSeries.elapsedMinutes, uptimeSeries.shiftMinutes, shiftDuration, formatHour, formatTimeRange2]);
   const maxYValue = 100;
   const yAxisTicks = [0, 25, 50, 75, 100];
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -40507,7 +40510,7 @@ var HourlyUptimeChartComponent = ({
       clearTimeout(fallbackTimeout);
     };
   }, []);
-  const xAxisConfig = React147__default.useMemo(() => {
+  const xAxisConfig = React148__default.useMemo(() => {
     if (containerWidth >= 960) {
       return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
     }
@@ -40516,7 +40519,7 @@ var HourlyUptimeChartComponent = ({
     }
     return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
   }, [containerWidth]);
-  const formatXAxisTick = React147__default.useCallback((raw) => {
+  const formatXAxisTick = React148__default.useCallback((raw) => {
     const label = typeof raw === "string" ? raw : String(raw);
     if (xAxisConfig.labelMode === "full") return label;
     const parts = label.split("-");
@@ -40722,7 +40725,7 @@ var HourlyUptimeChartComponent = ({
     }
   );
 };
-var HourlyUptimeChart = React147__default.memo(HourlyUptimeChartComponent);
+var HourlyUptimeChart = React148__default.memo(HourlyUptimeChartComponent);
 var DEFAULT_COLORS2 = ["#00AB45", "#ef4444"];
 var UptimeDonutChartComponent = ({
   data,
@@ -40792,7 +40795,7 @@ var UptimeDonutChartComponent = ({
     ] }) })
   ] }) });
 };
-var UptimeDonutChart = React147__default.memo(UptimeDonutChartComponent);
+var UptimeDonutChart = React148__default.memo(UptimeDonutChartComponent);
 UptimeDonutChart.displayName = "UptimeDonutChart";
 var TrendIcon = ({ trend }) => {
   if (trend === "up") {
@@ -40913,7 +40916,7 @@ var EmptyStateMessage = ({
   iconClassName
 }) => {
   let IconContent = null;
-  if (React147__default.isValidElement(iconType)) {
+  if (React148__default.isValidElement(iconType)) {
     IconContent = iconType;
   } else if (typeof iconType === "string") {
     const MappedIcon = IconMap[iconType];
@@ -41421,6 +41424,7 @@ var CYCLE_RANGE_CATEGORY_IDS = /* @__PURE__ */ new Set([
   "fast-cycles",
   "slow-cycles"
 ]);
+var EXPLICIT_INTERVAL_CATEGORY_IDS = /* @__PURE__ */ new Set(["recent_flow_red_streak"]);
 var roundToNearestMinute = (date) => {
   const rounded = new Date(date.getTime());
   const seconds = rounded.getSeconds();
@@ -41476,6 +41480,22 @@ var buildPrefetchedExplorerMetadata = (activeFilter, metadataCategoryId, categor
   };
 };
 var shouldDeferClipPlayerRender = (cropLoading, workspaceCrop) => cropLoading && workspaceCrop === null;
+var getCategoryMetadataLoadPlanForFilterChange = ({
+  activeFilter,
+  currentClipId,
+  categoryTotal
+}) => {
+  if (!activeFilter || activeFilter === "all") {
+    return { shouldLoad: false, autoLoadFirstVideo: false };
+  }
+  if (activeFilter === "recent_flow_red_streak" && categoryTotal > 0) {
+    return { shouldLoad: true, autoLoadFirstVideo: true };
+  }
+  return {
+    shouldLoad: Boolean(currentClipId),
+    autoLoadFirstVideo: false
+  };
+};
 var getSecondsBetweenTimestamps = (startTime, endTime) => {
   const startDate = parseTimestamp(startTime);
   const endDate = parseTimestamp(endTime);
@@ -41488,8 +41508,24 @@ var formatClipExplorerTimeLabel = ({
   timezone,
   durationSeconds,
   idleStartTime,
-  idleEndTime
+  idleEndTime,
+  clipStartTime,
+  clipEndTime
 }) => {
+  if (EXPLICIT_INTERVAL_CATEGORY_IDS.has(categoryId)) {
+    const endTimestamp = clipEndTime || clipTimestamp;
+    if (clipStartTime && endTimestamp) {
+      return formatTimestampRange(clipStartTime, endTimestamp, timezone);
+    }
+    if (typeof durationSeconds === "number" && Number.isFinite(durationSeconds) && durationSeconds > 0) {
+      const endDate = parseTimestamp(endTimestamp);
+      if (endDate) {
+        const startDate = new Date(endDate.getTime() - durationSeconds * 1e3);
+        return formatTimestampRange(startDate.toISOString(), endTimestamp, timezone);
+      }
+    }
+    return formatClipExplorerSingleTime(endTimestamp, timezone);
+  }
   if (IDLE_RANGE_CATEGORY_IDS.has(categoryId)) {
     const idleDurationSeconds = getSecondsBetweenTimestamps(idleStartTime, idleEndTime);
     const idleEndTimestamp = idleEndTime || clipTimestamp;
@@ -41516,6 +41552,106 @@ var formatClipExplorerTimeLabel = ({
   return singleTime;
 };
 var formatIdleTimeRange = (startTime, endTime, timezone) => formatTimestampRange(startTime, endTime, timezone);
+
+// src/lib/utils/redFlowDisplay.ts
+var getRedFlowDriverLabel = (driver) => {
+  switch (driver) {
+    case "idle":
+      return "Idle";
+    case "micro_stoppage":
+      return "Gaps";
+    case "slow_cycle":
+      return "Slow Cycles";
+    case "low_output":
+      return "Low Output";
+    default:
+      return "";
+  }
+};
+var getRedFlowDriversFromEvidence = (evidence) => {
+  const drivers = /* @__PURE__ */ new Set();
+  (evidence || []).forEach((item) => {
+    const normalized = item.toLowerCase();
+    if (normalized.includes("idle")) {
+      drivers.add("idle");
+    }
+    if (normalized.includes("micro") || normalized.includes("gap")) {
+      drivers.add("micro_stoppage");
+    }
+    if (normalized.includes("slow") || normalized.includes("cycle time") || normalized.includes("shift avg")) {
+      drivers.add("slow_cycle");
+    }
+    if (normalized.includes("output")) {
+      drivers.add("low_output");
+    }
+  });
+  return Array.from(drivers);
+};
+var getRedFlowDisplayDriverKeys = (summary) => {
+  if (!summary || summary.confidence !== "medium" && summary.confidence !== "high") {
+    return [];
+  }
+  if (summary.primary_driver === "unknown") {
+    return [];
+  }
+  if (summary.primary_driver === "mixed") {
+    const evidenceDrivers = getRedFlowDriversFromEvidence(summary.evidence).filter((driver) => Boolean(getRedFlowDriverLabel(driver)));
+    return evidenceDrivers.length >= 2 ? evidenceDrivers.slice(0, 3) : [];
+  }
+  return getRedFlowDriverLabel(summary.primary_driver) ? [summary.primary_driver] : [];
+};
+var formatRedFlowCompactNumber = (value) => Number.isInteger(value) ? String(value) : value.toFixed(1).replace(/\.0$/, "");
+var formatRedFlowOutputCount = (value) => Number.isFinite(value) ? String(Math.round(value)) : "";
+var getRedFlowBinOutputUnits = (bin) => {
+  if (typeof bin.actual_output_units === "number" && Number.isFinite(bin.actual_output_units)) {
+    return bin.actual_output_units;
+  }
+  if (typeof bin.actual_ppm === "number" && Number.isFinite(bin.actual_ppm)) {
+    const durationSeconds = typeof bin.duration_seconds === "number" && Number.isFinite(bin.duration_seconds) && bin.duration_seconds > 0 ? bin.duration_seconds : 60;
+    return bin.actual_ppm * durationSeconds / 60;
+  }
+  return null;
+};
+var summarizeRedFlowOutput = (timeline, summary) => {
+  const actualFromSummary = summary?.totals.actual_output_units;
+  const expectedFromSummary = summary?.totals.baseline_output_units;
+  if (typeof actualFromSummary === "number" && Number.isFinite(actualFromSummary) && typeof expectedFromSummary === "number" && Number.isFinite(expectedFromSummary)) {
+    return { actual: actualFromSummary, expected: expectedFromSummary };
+  }
+  let actual = 0;
+  let expected = 0;
+  let hasActual = false;
+  let hasExpected = false;
+  (timeline?.minute_bins || []).forEach((bin) => {
+    const output = getRedFlowBinOutputUnits(bin);
+    if (output !== null) {
+      actual += output;
+      hasActual = true;
+    }
+    if (typeof bin.target_ppm === "number" && Number.isFinite(bin.target_ppm)) {
+      const durationSeconds = typeof bin.duration_seconds === "number" && Number.isFinite(bin.duration_seconds) && bin.duration_seconds > 0 ? bin.duration_seconds : 60;
+      expected += bin.target_ppm * durationSeconds / 60;
+      hasExpected = true;
+    }
+  });
+  return hasActual && hasExpected ? { actual, expected } : null;
+};
+var getRedFlowOutputShortfallUnits = (timeline) => {
+  let actual = 0;
+  let expected = 0;
+  let hasComparableBin = false;
+  (timeline?.minute_bins || []).forEach((bin) => {
+    const output = getRedFlowBinOutputUnits(bin);
+    const durationSeconds = typeof bin.duration_seconds === "number" && Number.isFinite(bin.duration_seconds) && bin.duration_seconds > 0 ? bin.duration_seconds : null;
+    if (output === null || durationSeconds === null || typeof bin.target_ppm !== "number" || !Number.isFinite(bin.target_ppm)) {
+      return;
+    }
+    actual += output;
+    expected += bin.target_ppm * durationSeconds / 60;
+    hasComparableBin = true;
+  });
+  return hasComparableBin ? expected - actual : null;
+};
 var formatTime2 = (seconds) => {
   if (!seconds || isNaN(seconds)) return "0:00";
   const h = Math.floor(seconds / 3600);
@@ -41526,6 +41662,33 @@ var formatTime2 = (seconds) => {
   }
   return `${m}:${s.toString().padStart(2, "0")}`;
 };
+var formatTimelineClockTime = (isoTime, timezone) => {
+  if (!isoTime) return "";
+  const date = new Date(isoTime);
+  if (Number.isNaN(date.getTime())) return "";
+  return date.toLocaleTimeString("en-US", {
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true,
+    timeZone: timezone
+  });
+};
+var formatCompactNumber = formatRedFlowCompactNumber;
+var formatTooltipSeconds = (value) => `${Math.round(value)}s`;
+var formatEfficiencyPercent = (value) => {
+  if (typeof value !== "number" || !Number.isFinite(value)) {
+    return "No output data";
+  }
+  return `${Math.round(value)}% efficient`;
+};
+var getBinOutputUnits = getRedFlowBinOutputUnits;
+var formatOutputLabel = (bin) => {
+  const actualOutput = getBinOutputUnits(bin);
+  if (actualOutput === null) {
+    return "";
+  }
+  return `Output ${formatCompactNumber(actualOutput)}`;
+};
 var VideoControls = ({
   isPlaying,
   currentTime,
@@ -41544,15 +41707,20 @@ var VideoControls = ({
   onShare,
   isShareLoading = false,
   isShareCopied = false,
+  timelineAnnotations,
+  timelineExplanation,
+  timelineTimezone,
   className = ""
 }) => {
   const [isDragging2, setIsDragging] = useState(false);
   const [dragTime, setDragTime] = useState(0);
   const [isHoveringProgressBar, setIsHoveringProgressBar] = useState(false);
+  const [hoveredTimelineBin, setHoveredTimelineBin] = useState(null);
   const [showSpeedMenu, setShowSpeedMenu] = useState(false);
   const speedMenuRef = useRef(null);
   const progressTrackRef = useRef(null);
   const activePointerIdRef = useRef(null);
+  const markerPointerJumpHandledRef = useRef(false);
   const progressColor = "#4b5563";
   const controlsVisible = showControls || controlsPinned;
   const isDraggingRef = useRef(false);
@@ -41576,6 +41744,43 @@ var VideoControls = ({
     isDraggingRef.current = false;
     onSeekEnd?.();
   };
+  const handleTimelineJump = useCallback((time2) => {
+    const nextTime = Math.min(Math.max(time2, 0), duration || time2);
+    const wasDragging = isDraggingRef.current;
+    activePointerIdRef.current = null;
+    setIsDragging(false);
+    isDraggingRef.current = false;
+    setDragTime(nextTime);
+    if (!wasDragging) {
+      onSeekStart?.();
+    }
+    onSeek(nextTime);
+    onSeekEnd?.();
+  }, [duration, onSeek, onSeekEnd, onSeekStart]);
+  const handleTimelineMarkerPointerDown = useCallback((e, time2) => {
+    e.preventDefault();
+    e.stopPropagation();
+    markerPointerJumpHandledRef.current = true;
+    handleTimelineJump(time2);
+  }, [handleTimelineJump]);
+  const handleTimelineMarkerMouseDown = useCallback((e, time2) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (markerPointerJumpHandledRef.current) {
+      return;
+    }
+    markerPointerJumpHandledRef.current = true;
+    handleTimelineJump(time2);
+  }, [handleTimelineJump]);
+  const handleTimelineMarkerClick = useCallback((e, time2) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (markerPointerJumpHandledRef.current) {
+      markerPointerJumpHandledRef.current = false;
+      return;
+    }
+    handleTimelineJump(time2);
+  }, [handleTimelineJump]);
   const updateTimeFromClientX = useCallback((clientX) => {
     if (!progressTrackRef.current) return;
     const rect = progressTrackRef.current.getBoundingClientRect();
@@ -41636,6 +41841,127 @@ var VideoControls = ({
   const displayTime = isDragging2 ? dragTime : currentTime;
   const progressPercent = getPercentage(displayTime, duration);
   const bufferedPercent = getPercentage(buffered, duration);
+  const timelineBins = useMemo(() => {
+    if (!timelineAnnotations?.minute_bins?.length || duration <= 0) {
+      return [];
+    }
+    return timelineAnnotations.minute_bins.map((bin) => {
+      const offset = typeof bin.offset_seconds === "number" && Number.isFinite(bin.offset_seconds) ? Math.max(0, bin.offset_seconds) : 0;
+      const binDuration = typeof bin.duration_seconds === "number" && Number.isFinite(bin.duration_seconds) && bin.duration_seconds > 0 ? bin.duration_seconds : 60;
+      if (offset >= duration) {
+        return null;
+      }
+      const clampedDuration = Math.min(binDuration, Math.max(0, duration - offset));
+      if (clampedDuration <= 0) {
+        return null;
+      }
+      const clockLabel = formatTimelineClockTime(bin.start_time, timelineTimezone);
+      const minuteExplanation = timelineExplanation?.minute_explanations?.find((explanation) => explanation.offset_seconds === offset || Boolean(explanation.start_time) && explanation.start_time === bin.start_time);
+      const explanationLabel = minuteExplanation && minuteExplanation.confidence !== "low" ? minuteExplanation.primary_driver === "idle" ? "High Idle Detected" : minuteExplanation.primary_driver === "micro_stoppage" ? `Gap: ${Math.round(minuteExplanation.micro_stoppage_lost_seconds)}s lost` : minuteExplanation.primary_driver === "slow_cycle" ? typeof minuteExplanation.actual_cycle_time_seconds === "number" && Number.isFinite(minuteExplanation.actual_cycle_time_seconds) && typeof minuteExplanation.median_cycle_time_seconds === "number" && Number.isFinite(minuteExplanation.median_cycle_time_seconds) ? `Avg Cycle Time: ${formatTooltipSeconds(minuteExplanation.actual_cycle_time_seconds)} vs Shift Avg: ${formatTooltipSeconds(minuteExplanation.median_cycle_time_seconds)}` : `Slow cycle: ${Math.round(minuteExplanation.slow_cycle_lost_seconds)}s lost` : minuteExplanation.primary_driver === "low_output" ? "Low Output" : void 0 : void 0;
+      return {
+        ...bin,
+        offset_seconds: offset,
+        duration_seconds: clampedDuration,
+        leftPercent: getPercentage(offset, duration),
+        widthPercent: Math.max(getPercentage(clampedDuration, duration), 0.4),
+        clockLabel,
+        efficiencyLabel: formatEfficiencyPercent(bin.efficiency_percent),
+        outputLabel: formatOutputLabel({ ...bin, duration_seconds: clampedDuration }),
+        explanationLabel
+      };
+    }).filter((bin) => Boolean(bin));
+  }, [duration, timelineAnnotations, timelineExplanation, timelineTimezone]);
+  const hasTimelineAnnotations = timelineBins.length > 0;
+  const worstMinuteMarkers = useMemo(() => {
+    const efficiencySource = timelineBins.filter((bin) => typeof bin.efficiency_percent === "number" && Number.isFinite(bin.efficiency_percent)).slice().sort((a, b) => a.efficiency_percent - b.efficiency_percent || a.offset_seconds - b.offset_seconds).slice(0, 3).map((bin, index) => ({
+      start_time: bin.start_time,
+      offset_seconds: bin.offset_seconds,
+      duration_seconds: bin.duration_seconds,
+      avg_flow_percent: bin.avg_flow_percent,
+      rank: index + 1
+    }));
+    const source = efficiencySource.length ? efficiencySource : timelineAnnotations?.worst_minutes?.length ? timelineAnnotations.worst_minutes : timelineBins.filter((bin) => typeof bin.avg_flow_percent === "number" && Number.isFinite(bin.avg_flow_percent)).sort((a, b) => a.avg_flow_percent - b.avg_flow_percent).slice(0, 3);
+    return source.filter((marker) => typeof marker.offset_seconds === "number" && Number.isFinite(marker.offset_seconds)).slice(0, 3).map((marker, index) => {
+      const offset = Math.max(0, Math.min(duration, marker.offset_seconds));
+      const matchingBin = timelineBins.find((bin) => bin.offset_seconds === marker.offset_seconds || Boolean(marker.start_time) && bin.start_time === marker.start_time);
+      const markerDuration = "duration_seconds" in marker ? Number(marker.duration_seconds || 0) : 0;
+      const width = markerDuration > 0 ? markerDuration : Number(matchingBin?.duration_seconds || 0);
+      const centerOffset = Math.min(duration, offset + Math.max(0, width) / 2);
+      return {
+        ...marker,
+        rank: "rank" in marker ? marker.rank : index + 1,
+        leftPercent: getPercentage(centerOffset, duration)
+      };
+    });
+  }, [duration, timelineAnnotations, timelineBins]);
+  const transitionMarkers = useMemo(() => {
+    if (timelineBins.length < 2 || duration <= 0) {
+      return [];
+    }
+    const orderedBins = timelineBins.slice().sort((left, right) => left.offset_seconds - right.offset_seconds);
+    return orderedBins.slice(1).map((bin, index) => {
+      const previousBin = orderedBins[index];
+      const fromOutputUnits = getBinOutputUnits(previousBin);
+      const toOutputUnits = getBinOutputUnits(bin);
+      const hasOutputValues = fromOutputUnits !== null && toOutputUnits !== null && fromOutputUnits > 0;
+      const fromEfficiency = previousBin.efficiency_percent;
+      const toEfficiency = bin.efficiency_percent;
+      const hasEfficiencyValues = typeof fromEfficiency === "number" && typeof toEfficiency === "number" && Number.isFinite(fromEfficiency) && Number.isFinite(toEfficiency) && fromEfficiency > 0;
+      if (!hasOutputValues && !hasEfficiencyValues) {
+        return null;
+      }
+      const fromValue = hasOutputValues ? fromOutputUnits : fromEfficiency;
+      const toValue2 = hasOutputValues ? toOutputUnits : toEfficiency;
+      const relativeDrop = (fromValue - toValue2) / fromValue;
+      if (relativeDrop <= 0.5) {
+        return null;
+      }
+      const transitionOffset = Math.min(Math.max(bin.offset_seconds, 0), duration);
+      return {
+        offsetSeconds: transitionOffset,
+        leftPercent: getPercentage(transitionOffset, duration),
+        fromValue,
+        toValue: toValue2,
+        relativeDrop,
+        fromOutputUnits,
+        toOutputUnits,
+        source: hasOutputValues ? "output" : "efficiency",
+        absoluteDrop: fromValue - toValue2
+      };
+    }).filter((marker) => Boolean(marker)).sort((left, right) => {
+      const relativeDiff = right.relativeDrop - left.relativeDrop;
+      if (relativeDiff !== 0) {
+        return relativeDiff;
+      }
+      const outputDiff = right.absoluteDrop - left.absoluteDrop;
+      if (outputDiff !== 0) {
+        return outputDiff;
+      }
+      return left.offsetSeconds - right.offsetSeconds;
+    }).slice(0, 3).map((marker, index) => ({
+      ...marker,
+      rank: index + 1
+    }));
+  }, [duration, timelineBins]);
+  worstMinuteMarkers[0] || null;
+  const updateHoveredTimelineBin = useCallback((clientX) => {
+    if (!hasTimelineAnnotations || !progressTrackRef.current || duration <= 0) {
+      setHoveredTimelineBin(null);
+      return;
+    }
+    const rect = progressTrackRef.current.getBoundingClientRect();
+    if (!rect.width) {
+      setHoveredTimelineBin(null);
+      return;
+    }
+    const pct = Math.min(Math.max((clientX - rect.left) / rect.width, 0), 1);
+    const hoverTime = pct * duration;
+    const nextBin = timelineBins.find((bin) => hoverTime >= bin.offset_seconds && hoverTime <= bin.offset_seconds + bin.duration_seconds) || null;
+    setHoveredTimelineBin(nextBin);
+  }, [duration, hasTimelineAnnotations, timelineBins]);
+  const handleProgressMouseMove = useCallback((e) => {
+    updateHoveredTimelineBin(e.clientX);
+  }, [updateHoveredTimelineBin]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -41647,12 +41973,16 @@ var VideoControls = ({
           "div",
           {
             ref: progressTrackRef,
-            className: "relative h-1 mb-4 group cursor-pointer",
+            className: "relative z-10 h-1 mb-4 group cursor-pointer",
             onMouseEnter: () => setIsHoveringProgressBar(true),
-            onMouseLeave: () => setIsHoveringProgressBar(false),
+            onMouseMove: handleProgressMouseMove,
+            onMouseLeave: () => {
+              setIsHoveringProgressBar(false);
+              setHoveredTimelineBin(null);
+            },
             onPointerDown: handlePointerDown,
             children: [
-              /* @__PURE__ */ jsx("div", { className: "absolute -top-4 -bottom-4 left-0 right-0 z-20" }),
+              /* @__PURE__ */ jsx("div", { className: "absolute -top-4 bottom-0 left-0 right-0 z-20" }),
               /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 bottom-0 bg-white/20 rounded-full overflow-hidden z-0", children: /* @__PURE__ */ jsx(
                 "div",
                 {
@@ -41686,17 +42016,47 @@ var VideoControls = ({
                   onInput: handleSeekChange,
                   onMouseDown: handleSeekStart,
                   onMouseUp: handleSeekEnd,
+                  onMouseMove: handleProgressMouseMove,
                   onTouchStart: handleSeekStart,
                   onTouchEnd: handleSeekEnd,
                   onPointerDown: handlePointerDown,
-                  className: "absolute left-0 right-0 top-[-12px] bottom-[-12px] w-full h-auto opacity-0 cursor-pointer z-30 margin-0 padding-0"
+                  className: "absolute left-0 right-0 top-[-12px] bottom-0 w-full h-auto opacity-0 cursor-pointer z-30 margin-0 padding-0"
+                }
+              ),
+              hasTimelineAnnotations && transitionMarkers.map((marker) => /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": marker.source === "output" ? `Output drop marker ${marker.rank}: output ${formatCompactNumber(marker.fromValue)} to ${formatCompactNumber(marker.toValue)} (${Math.round(marker.relativeDrop * 100)}% drop)` : `Output drop marker ${marker.rank}: efficiency ${Math.round(marker.fromValue)}% to ${Math.round(marker.toValue)}% (${Math.round(marker.relativeDrop * 100)}% drop)`,
+                  title: marker.source === "output" ? `Output drop: ${formatCompactNumber(marker.fromValue)} to ${formatCompactNumber(marker.toValue)}` : `Output drop: ${Math.round(marker.fromValue)}% to ${Math.round(marker.toValue)}%`,
+                  onPointerDownCapture: (e) => handleTimelineMarkerPointerDown(e, marker.offsetSeconds),
+                  onMouseDownCapture: (e) => handleTimelineMarkerMouseDown(e, marker.offsetSeconds),
+                  onClickCapture: (e) => handleTimelineMarkerClick(e, marker.offsetSeconds),
+                  className: "absolute top-1/2 -translate-y-1/2 z-[70] flex h-5 w-5 cursor-pointer items-center justify-center rounded-full border border-white bg-sky-500 p-0 text-center text-[9px] font-bold leading-none text-white shadow hover:bg-sky-400 focus:outline-none focus:ring-2 focus:ring-sky-200",
+                  style: { left: `calc(${marker.leftPercent}% - 10px)`, zIndex: 70, pointerEvents: "auto" },
+                  children: marker.rank
+                },
+                `${marker.rank}-${marker.offsetSeconds}`
+              )),
+              hasTimelineAnnotations && hoveredTimelineBin && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: "absolute bottom-full z-50 mb-2 -translate-x-1/2 rounded bg-slate-900 px-2 py-1 text-[11px] font-semibold text-white shadow-lg",
+                  style: { left: `${hoveredTimelineBin.leftPercent + hoveredTimelineBin.widthPercent / 2}%` },
+                  children: [
+                    hoveredTimelineBin.clockLabel || formatTime2(hoveredTimelineBin.offset_seconds),
+                    " | ",
+                    hoveredTimelineBin.efficiencyLabel,
+                    hoveredTimelineBin.outputLabel ? ` | ${hoveredTimelineBin.outputLabel}` : "",
+                    hoveredTimelineBin.explanationLabel ? ` | ${hoveredTimelineBin.explanationLabel}` : ""
+                  ]
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-white", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "relative z-40 flex items-center justify-between text-white", children: [
+          /* @__PURE__ */ jsxs("div", { className: "relative z-50 flex items-center gap-4", children: [
             /* @__PURE__ */ jsx(
               "button",
               {
@@ -41977,7 +42337,10 @@ var HlsVideoPlayer = forwardRef(({
   onClick,
   onShare,
   isShareLoading,
-  isShareCopied
+  isShareCopied,
+  timelineAnnotations,
+  timelineExplanation,
+  timelineTimezone
 }, ref) => {
   const supabase = useSupabase();
   const videoContainerRef = useRef(null);
@@ -42639,6 +43002,7 @@ var HlsVideoPlayer = forwardRef(({
   const handleSeek = useCallback((time2) => {
     if (videoRef.current) {
       videoRef.current.currentTime = time2;
+      setCurrentTime(time2);
     }
   }, []);
   const handleSeekStart = useCallback(() => {
@@ -42745,7 +43109,10 @@ var HlsVideoPlayer = forwardRef(({
                   onToggleFullscreen: handleToggleFullscreen,
                   onShare,
                   isShareLoading,
-                  isShareCopied
+                  isShareCopied,
+                  timelineAnnotations,
+                  timelineExplanation,
+                  timelineTimezone
                 }
               )
             ]
@@ -43066,6 +43433,7 @@ var CroppedHlsVideoPlayer = forwardRef(({
   const handleSeek = useCallback((time2) => {
     if (hiddenVideoRef.current) {
       hiddenVideoRef.current.currentTime(time2);
+      setCurrentTime(time2);
       setTimeout(() => renderFrameToCanvas(), 50);
       userSeekingRef.current = true;
     }
@@ -43211,7 +43579,10 @@ var CroppedHlsVideoPlayer = forwardRef(({
             onToggleFullscreen: handleToggleFullscreen,
             onShare: videoProps.onShare,
             isShareLoading: videoProps.isShareLoading,
-            isShareCopied: videoProps.isShareCopied
+            isShareCopied: videoProps.isShareCopied,
+            timelineAnnotations: videoProps.timelineAnnotations,
+            timelineExplanation: videoProps.timelineExplanation,
+            timelineTimezone: videoProps.timelineTimezone
           }
         )
       ]
@@ -43220,6 +43591,100 @@ var CroppedHlsVideoPlayer = forwardRef(({
 });
 CroppedHlsVideoPlayer.displayName = "CroppedHlsVideoPlayer";
 var CroppedVideoPlayer = CroppedHlsVideoPlayer;
+var formatSeconds = (value) => {
+  const seconds = Math.max(0, Math.round(value));
+  if (seconds < 60) {
+    return `${seconds}s`;
+  }
+  const minutes = Math.floor(seconds / 60);
+  const remainingSeconds = seconds % 60;
+  return remainingSeconds > 0 ? `${minutes}m ${remainingSeconds}s` : `${minutes}m`;
+};
+var buildLostChip = (explanation) => {
+  const totals = explanation.summary.totals;
+  const explicitTotalLostSeconds = Number(totals.total_lost_seconds);
+  const lostSeconds = Number.isFinite(explicitTotalLostSeconds) ? explicitTotalLostSeconds : Math.max(
+    Number(totals.idle_overlap_seconds) || 0,
+    Number(totals.micro_stoppage_lost_seconds) || 0,
+    Number(totals.slow_cycle_lost_seconds) || 0
+  );
+  if (lostSeconds > 0) {
+    return `${formatSeconds(lostSeconds)} lost`;
+  }
+  if (Number(totals.idle_overlap_percent) > 0) {
+    return `${Math.round(totals.idle_overlap_percent)}% idle`;
+  }
+  return null;
+};
+var RedFlowDiagnosticOverlay = ({
+  timeline,
+  explanation,
+  aiSummary,
+  aiSummaryLoading = false,
+  aiSummaryError = null,
+  className = ""
+}) => {
+  const summary = explanation?.summary || null;
+  const driverKeys = useMemo(() => getRedFlowDisplayDriverKeys(summary), [summary]);
+  const outputSummary = useMemo(() => summarizeRedFlowOutput(timeline, summary), [summary, timeline]);
+  const hasOutputIssue = Boolean(
+    outputSummary && Number.isFinite(outputSummary.expected) && Number.isFinite(outputSummary.actual) && outputSummary.expected > outputSummary.actual
+  );
+  if (driverKeys.length === 0 && !hasOutputIssue) {
+    return null;
+  }
+  const driverLabel = driverKeys.length > 0 ? driverKeys.map(getRedFlowDriverLabel).filter(Boolean).join(" + ") : "Low Output";
+  if (!driverLabel) {
+    return null;
+  }
+  const shouldShowLostChip = driverKeys.some((driver) => driver !== "low_output");
+  const chips = explanation && shouldShowLostChip ? [buildLostChip(explanation)].filter((chip) => Boolean(chip)) : [];
+  const shouldShowHeadline = Boolean(summary && driverKeys.length > 0 && summary.primary_driver !== "unknown");
+  const aiSummaryBullets = Array.isArray(aiSummary?.bullets) ? aiSummary.bullets.map((bullet) => String(bullet || "").trim()).filter(Boolean).slice(0, 3) : [];
+  const shouldShowAiSummary = !aiSummaryError && aiSummaryBullets.length === 3;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `pointer-events-none absolute z-20 w-[240px] max-w-[calc(100%-2rem)] rounded-xl border border-white/10 bg-black/60 p-5 text-white shadow-xl backdrop-blur-md ${className}`,
+      children: [
+        outputSummary ? /* @__PURE__ */ jsxs("div", { className: "mb-5 space-y-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-white/50", children: "Output:" }),
+            /* @__PURE__ */ jsxs("span", { className: "text-sm font-bold text-white", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-red-400", children: formatRedFlowOutputCount(outputSummary.actual) }),
+              /* @__PURE__ */ jsx("span", { className: "px-1 text-white/30", children: "/" }),
+              formatRedFlowOutputCount(outputSummary.expected)
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-white/50", children: "Reason:" }),
+            /* @__PURE__ */ jsx("span", { className: "rounded bg-red-500/10 px-2 py-1 text-[10px] font-semibold tracking-wide text-red-400 ring-1 ring-inset ring-red-500/20", children: "Low output" })
+          ] })
+        ] }) : /* @__PURE__ */ jsx("div", { className: "mb-4 flex items-center gap-2", children: /* @__PURE__ */ jsx("span", { className: "rounded bg-red-500/10 px-2 py-1 text-[10px] font-semibold tracking-wide text-red-400 ring-1 ring-inset ring-red-500/20", children: driverLabel }) }),
+        (shouldShowAiSummary || aiSummaryLoading || chips.length > 0 || shouldShowHeadline) && /* @__PURE__ */ jsx("div", { className: "mb-4 h-px w-full bg-white/10" }),
+        !shouldShowAiSummary && !aiSummaryLoading && shouldShowHeadline && summary?.headline ? /* @__PURE__ */ jsx("div", { className: "mb-3 text-[13px] font-medium leading-relaxed text-white/90", children: summary.headline }) : null,
+        !shouldShowAiSummary && !aiSummaryLoading && chips.length > 0 ? /* @__PURE__ */ jsx("div", { className: "mb-3 flex flex-wrap gap-2", children: chips.slice(0, 3).map((chip) => /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "rounded border border-white/10 bg-white/5 px-2 py-0.5 text-[11px] font-medium text-white/70",
+            children: chip
+          },
+          chip
+        )) }) : null,
+        shouldShowAiSummary ? /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-3 text-[10px] font-bold uppercase tracking-[0.15em] text-white/40", children: "AI summary" }),
+          /* @__PURE__ */ jsx("ol", { className: "space-y-3 text-[12px] leading-relaxed text-white/80", children: aiSummaryBullets.map((bullet, index) => /* @__PURE__ */ jsxs("li", { className: "flex gap-2", children: [
+            /* @__PURE__ */ jsxs("span", { className: "font-semibold text-white/40", children: [
+              index + 1,
+              "."
+            ] }),
+            /* @__PURE__ */ jsx("span", { children: bullet })
+          ] }, `${index}-${bullet}`)) })
+        ] }) : aiSummaryLoading ? /* @__PURE__ */ jsx("div", { className: "mt-1 text-[13px] font-medium text-white/60", children: "Generating summary..." }) : null
+      ]
+    }
+  );
+};
 function useWorkspaceCrop(workspaceId) {
   const supabase = useSupabase();
   const [crop, setCrop] = useState(null);
@@ -43269,7 +43734,7 @@ function Skeleton({ className, ...props }) {
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React147.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectTrigger = React148.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -43285,7 +43750,7 @@ var SelectTrigger = React147.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollUpButton = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -43295,7 +43760,7 @@ var SelectScrollUpButton = React147.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollDownButton = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -43305,7 +43770,7 @@ var SelectScrollDownButton = React147.forwardRef(({ className, ...props }, ref)
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React147.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
+var SelectContent = React148.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
   SelectPrimitive.Content,
   {
     ref,
@@ -43333,7 +43798,7 @@ var SelectContent = React147.forwardRef(({ className, children, position = "popp
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectLabel = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Label,
   {
     ref,
@@ -43342,7 +43807,7 @@ var SelectLabel = React147.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React147.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectItem = React148.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Item,
   {
     ref,
@@ -43358,7 +43823,7 @@ var SelectItem = React147.forwardRef(({ className, children, ...props }, ref) =>
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React147.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectSeparator = React148.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Separator,
   {
     ref,
@@ -43984,7 +44449,7 @@ var TimePickerDropdown = ({
     )
   ] });
 };
-var SilentErrorBoundary = class extends React147__default.Component {
+var SilentErrorBoundary = class extends React148__default.Component {
   constructor(props) {
     super(props);
     this.handleClearAndReload = () => {
@@ -44729,6 +45194,9 @@ var AvatarUpload = ({
   ] });
 };
 var CLIP_METADATA_PAGE_SIZE = 50;
+var RECENT_FLOW_RED_STREAK_CLIP_TYPE2 = "recent_flow_red_streak";
+var RECENT_FLOW_RED_STREAK_DISPLAY_LABEL = "Low moments";
+var RECENT_FLOW_RED_STREAK_DISPLAY_SUBTITLE = "Moments of low efficiency";
 var parseCycleTime = (value) => {
   if (typeof value === "number" && Number.isFinite(value)) {
     return value;
@@ -44757,10 +45225,37 @@ var formatDurationLabel = (seconds) => {
   }
   return `${Math.round(roundedSeconds / 60)} min`;
 };
+var sortRedFlowMetadata = (clips) => {
+  return clips.slice().sort((left, right) => {
+    const getOutputShortfall = (clip) => {
+      const directShortfall = parseCycleTime(clip.red_flow_output_shortfall_units);
+      if (directShortfall !== null) {
+        return directShortfall;
+      }
+      return getRedFlowOutputShortfallUnits(clip.red_flow_timeline);
+    };
+    const leftScore = getOutputShortfall(left);
+    const rightScore = getOutputShortfall(right);
+    const leftNull = leftScore === null;
+    const rightNull = rightScore === null;
+    if (leftNull !== rightNull) {
+      return leftNull ? 1 : -1;
+    }
+    if (leftScore !== null && rightScore !== null && leftScore !== rightScore) {
+      return rightScore - leftScore;
+    }
+    const leftTime = new Date(left.clip_timestamp).getTime();
+    const rightTime = new Date(right.clip_timestamp).getTime();
+    return (Number.isFinite(rightTime) ? rightTime : 0) - (Number.isFinite(leftTime) ? leftTime : 0);
+  });
+};
 var getSeverityIcon = (severity, categoryId, cycleTimeSeconds, targetCycleTime, clipId) => {
   if (categoryId === "idle_time" || categoryId === "low_value" || categoryId === "longest-idles") {
     return null;
   }
+  if (categoryId === RECENT_FLOW_RED_STREAK_CLIP_TYPE2) {
+    return /* @__PURE__ */ jsx(AlertTriangle, { className: "h-3 w-3 text-red-500" });
+  }
   if (categoryId === "cycle_completion" && targetCycleTime && targetCycleTime > 0 && cycleTimeSeconds !== null && cycleTimeSeconds !== void 0) {
     if (cycleTimeSeconds <= targetCycleTime) {
       return /* @__PURE__ */ jsx(CheckCircle, { className: "h-3 w-3 text-green-500" });
@@ -44832,6 +45327,7 @@ var FileManagerFilters = ({
   idleTimeVlmEnabled = false,
   showPercentileCycleFilters = true,
   prefetchedClipMetadata,
+  externallyManagedLoadingCategories,
   activeCategoryLoading,
   idleClipSort = "latest",
   onIdleClipSortChange,
@@ -44916,11 +45412,11 @@ var FileManagerFilters = ({
     if (prefetchedClipMetadata && Array.isArray(prefetchedClipMetadata[categoryId]) && prefetchedClipMetadata[categoryId].length > 0) {
       return true;
     }
-    if (activeCategoryLoading !== void 0 && categoryId === activeFilter) {
+    if (externallyManagedLoadingCategories?.[categoryId]) {
       return true;
     }
     return false;
-  }, [prefetchedClipMetadata, activeCategoryLoading, activeFilter]);
+  }, [prefetchedClipMetadata, externallyManagedLoadingCategories]);
   useEffect(() => {
     if (!prefetchedClipMetadata) {
       return;
@@ -45041,6 +45537,9 @@ var FileManagerFilters = ({
     [idleReasonOptions, idleLabelFilter]
   );
   const getClipBadge = useCallback((node) => {
+    if (node.categoryId === RECENT_FLOW_RED_STREAK_CLIP_TYPE2) {
+      return null;
+    }
     if (node.categoryId === "idle_time" || node.categoryId === "low_value") {
       return { text: "Idle", className: "bg-red-100 text-red-700" };
     }
@@ -45059,6 +45558,23 @@ var FileManagerFilters = ({
     }
     return { text: "Fast", className: "bg-green-100 text-green-700" };
   }, [resolvedTargetCycleTime]);
+  const getRedFlowDriverBadges = useCallback((node) => {
+    if (node.categoryId !== RECENT_FLOW_RED_STREAK_CLIP_TYPE2) {
+      return [];
+    }
+    const summary = node.redFlowExplanationSummary || null;
+    const drivers = getRedFlowDisplayDriverKeys(summary);
+    if (drivers.length === 0) {
+      return [{
+        text: "Low Output",
+        className: "bg-slate-50 text-slate-600 border border-slate-200"
+      }];
+    }
+    return drivers.slice(0, 3).map((driver) => ({
+      text: getRedFlowDriverLabel(driver),
+      className: "bg-rose-50 text-rose-700 border border-rose-200"
+    }));
+  }, []);
   const getAuthToken4 = useCallback(async () => {
     try {
       return await getAccessTokenOrRedirect(supabase, { redirectReason: "session_expired" });
@@ -45067,7 +45583,7 @@ var FileManagerFilters = ({
       return null;
     }
   }, [supabase]);
-  const getMetadataLoadingKey = useCallback((categoryId, page) => `${categoryId}-${page}-${categoryId === "idle_time" ? idleClipSort : "latest"}`, [idleClipSort]);
+  const getMetadataLoadingKey = useCallback((categoryId, page) => `${categoryId}-${page}-${categoryId === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? "red_flow_output_shortfall_desc" : categoryId === "idle_time" ? idleClipSort : "latest"}`, [idleClipSort]);
   const fetchClipMetadataPage = useCallback(async (categoryId, page = 1) => {
     if (!workspaceId || !date || shift === void 0) {
       throw new Error("Missing required params for clip metadata fetch");
@@ -45088,7 +45604,7 @@ var FileManagerFilters = ({
         knownTotal: typeof counts?.[categoryId] === "number" ? counts[categoryId] : null,
         snapshotDateTime,
         snapshotClipId,
-        sort: categoryId === "idle_time" ? idleClipSort : "latest"
+        sort: categoryId === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? "red_flow_output_shortfall_desc" : categoryId === "idle_time" ? idleClipSort : "latest"
       }),
       redirectReason: "session_expired"
     });
@@ -45459,7 +45975,7 @@ var FileManagerFilters = ({
         fetchClipMetadata(activeFilter, 1);
       }
     }
-  }, [activeFilter, isCategoryExternallyManaged]);
+  }, [activeFilter]);
   useEffect(() => {
     const handleEscape = (e) => {
       if (e.key === "Escape") {
@@ -45542,6 +46058,9 @@ var FileManagerFilters = ({
       const categoryCount = counts?.[category.id] || 0;
       const categoryClips = clipMetadata[category.id] || [];
       let filteredClips = categoryClips.filter((clip) => isClipInTimeRange(clip.clip_timestamp));
+      if (category.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2) {
+        filteredClips = sortRedFlowMetadata(filteredClips);
+      }
       if (category.id === "idle_time" && idleLabelFilter) {
         filteredClips = filteredClips.filter((clip) => {
           const classification = getIdleTimeClassification(clip.clipId || clip.id);
@@ -45556,15 +46075,18 @@ var FileManagerFilters = ({
           const cycleTime = extractCycleTimeSeconds(clip);
           const idleDuration = category.id === "idle_time" ? clip.idle_duration_seconds ?? clip.duration : null;
           const idleDurationLabel = formatDurationLabel(idleDuration);
+          const redFlowDurationLabel = category.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? formatDurationLabel(clip.duration) : null;
           const baseTimeLabel = formatClipExplorerTimeLabel({
             categoryId: category.id,
             clipTimestamp: clip.clip_timestamp,
             timezone,
             durationSeconds: idleDuration ?? clip.duration,
             idleStartTime: clip.idle_start_time,
-            idleEndTime: clip.idle_end_time
+            idleEndTime: clip.idle_end_time,
+            clipStartTime: clip.clip_start_time,
+            clipEndTime: clip.clip_end_time
           });
-          const displayLabel = `${baseTimeLabel}${idleDurationLabel && category.id === "idle_time" ? ` - (${idleDurationLabel})` : ""}${clip.duration && category.id !== "idle_time" && category.id !== "low_value" ? ` - (${clip.duration.toFixed(1)}s)` : ""}`;
+          const displayLabel = `${baseTimeLabel}${idleDurationLabel && category.id === "idle_time" ? ` - (${idleDurationLabel})` : ""}${redFlowDurationLabel ? ` - (${redFlowDurationLabel})` : ""}${clip.duration && category.id !== "idle_time" && category.id !== "low_value" && category.id !== RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? ` - (${clip.duration.toFixed(1)}s)` : ""}`;
           return {
             id: clip.id,
             label: displayLabel,
@@ -45580,14 +46102,18 @@ var FileManagerFilters = ({
             cycleTimeSeconds: cycleTime,
             duration: idleDuration ?? clip.duration,
             // Store duration for custom badge rendering
-            cycleItemCount: clip.cycle_item_count ?? null
+            cycleItemCount: clip.cycle_item_count ?? null,
+            redFlowSeverityScore: clip.red_flow_severity_score ?? null,
+            redFlowExplanationSummary: clip.red_flow_explanation_summary ?? clip.red_flow_explanation?.summary ?? null
           };
         });
+        const categoryLabel = category.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? RECENT_FLOW_RED_STREAK_DISPLAY_LABEL : category.label;
+        const categorySubtitle = category.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? RECENT_FLOW_RED_STREAK_DISPLAY_SUBTITLE : category.subtitle || category.description;
         regularCategoryNodes.push({
           id: category.id,
-          label: category.label,
-          subtitle: category.subtitle || category.description,
-          description: category.description,
+          label: categoryLabel,
+          subtitle: categorySubtitle,
+          description: category.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2 ? RECENT_FLOW_RED_STREAK_DISPLAY_SUBTITLE : category.description,
           type: "category",
           count: displayCount,
           // Use filtered count when time filter is active
@@ -45699,7 +46225,7 @@ var FileManagerFilters = ({
         })
       } */
     ] : [];
-    const orderedIds = ["cycle_completion", "fast-cycles", "slow-cycles", "idle_time"];
+    const orderedIds = [RECENT_FLOW_RED_STREAK_CLIP_TYPE2, "cycle_completion", "fast-cycles", "slow-cycles", "idle_time"];
     orderedIds.forEach((orderedId) => {
       const percentileCategory = percentileCategories.find((cat) => cat.id === orderedId);
       const shouldIncludePercentile = percentileCategory ? typeof percentileCategory.count === "number" && percentileCategory.count > 0 : false;
@@ -45788,6 +46314,13 @@ var FileManagerFilters = ({
           shift,
           count: node.count || 0
         });
+      } else if (node.id === RECENT_FLOW_RED_STREAK_CLIP_TYPE2) {
+        trackCoreEvent("Low Moments Clicked", {
+          workspaceId,
+          date,
+          shift,
+          count: node.count || 0
+        });
       }
       if (node.id !== "idle_time" && idleLabelFilter) {
         setIdleLabelFilter(null);
@@ -45812,8 +46345,15 @@ var FileManagerFilters = ({
     const isCurrentVideo = currentVideoId === node.id;
     const isCountUnknown = node.type === "percentile-category" && node.count === null;
     const hasChildren = isCountUnknown || (node.count || 0) > 0;
-    const showExternalLoadingState = Boolean(
-      activeCategoryLoading && isExpanded && node.id === activeFilter && (node.type === "category" || node.type === "percentile-category")
+    const hasLoadedChildren = (clipMetadata[node.id]?.length || percentileClips[node.id]?.length || 0) > 0;
+    const loadedPage = categoryPages[node.id] || 0;
+    const pageOneLoadingKey = getMetadataLoadingKey(node.id, 1);
+    const nextMetadataPage = loadedPage + 1;
+    const nextLoadMorePage = (categoryPages[node.id] || 1) + 1;
+    const isPageOneLoading = loadingCategories.has(pageOneLoadingKey);
+    const isLoadMoreLoading = loadedPage > 0 && loadingCategories.has(getMetadataLoadingKey(node.id, nextMetadataPage));
+    const showInitialLoadingState = Boolean(
+      isExpanded && !hasLoadedChildren && (node.type === "category" || node.type === "percentile-category") && (isPageOneLoading || activeCategoryLoading && node.id === activeFilter)
     );
     const colorClasses = node.color ? getColorClasses(node.color) : null;
     return /* @__PURE__ */ jsxs("div", { className: "select-none animate-in", children: [
@@ -45855,9 +46395,9 @@ var FileManagerFilters = ({
             /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex items-center justify-between", children: [
               /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
                 /* @__PURE__ */ jsx("div", { className: `font-semibold tracking-tight ${node.type === "category" || node.type === "percentile-category" ? "text-slate-800 text-sm" : "text-slate-700 text-xs"} ${isCurrentVideo ? "text-blue-700 font-bold" : ""} group-hover:text-slate-900 transition-colors duration-200`, children: node.label }),
-                node.type === "category" && categories.find((c) => c.id === node.id)?.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 mt-0.5 font-normal", children: categories.find((c) => c.id === node.id)?.description }),
+                node.type === "category" && (node.subtitle || categories.find((c) => c.id === node.id)?.description) && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 mt-0.5 font-normal", children: node.subtitle || categories.find((c) => c.id === node.id)?.description }),
                 node.type === "percentile-category" && node.subtitle && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 mt-0.5 font-normal", children: node.subtitle }),
-                node.type === "video" && (node.severity || node.categoryId === "cycle_completion" || node.categoryId === "idle_time" || node.categoryId === "low_value") && /* @__PURE__ */ jsx("div", { className: "text-xs mt-0.5 font-medium", children: node.categoryId === "idle_time" ? (
+                node.type === "video" && (node.severity || node.categoryId === "cycle_completion" || node.categoryId === "idle_time" || node.categoryId === "low_value" || node.categoryId === RECENT_FLOW_RED_STREAK_CLIP_TYPE2) && /* @__PURE__ */ jsx("div", { className: "text-xs mt-0.5 font-medium", children: node.categoryId === "idle_time" ? (
                   // Show root cause label for idle time clips (text only, icon is on the left)
                   (() => {
                     if (!idleTimeVlmEnabled) {
@@ -45879,8 +46419,10 @@ var FileManagerFilters = ({
                   // Show badge for other clips
                   (() => {
                     const badge = getClipBadge(node);
+                    const redFlowDriverBadges = getRedFlowDriverBadges(node);
                     return /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1.5", children: [
-                      /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-1.5 py-0.5 rounded-md text-xs font-medium ${badge.className}`, children: badge.text }),
+                      badge ? /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-1.5 py-0.5 rounded-md text-xs font-medium ${badge.className}`, children: badge.text }) : null,
+                      redFlowDriverBadges.map((redFlowDriverBadge) => /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-1.5 py-0.5 rounded-md text-xs font-medium ${redFlowDriverBadge.className}`, children: redFlowDriverBadge.text }, redFlowDriverBadge.text)),
                       node.categoryId === "cycle_completion" && node.cycleItemCount && node.cycleItemCount > 1 ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center px-1.5 py-0.5 rounded-md text-xs font-semibold bg-blue-100 text-blue-700 border border-blue-200", children: [
                         "x",
                         node.cycleItemCount
@@ -45896,21 +46438,20 @@ var FileManagerFilters = ({
       ),
       hasChildren && isExpanded && (node.type === "category" || node.type === "percentile-category") && /* @__PURE__ */ jsx("div", { className: "mt-2 ml-3 animate-in border-l-2 border-slate-100 pl-3", children: /* @__PURE__ */ jsxs("div", { className: "max-h-64 overflow-y-auto space-y-1 scrollbar-thin scrollbar-track-slate-100 scrollbar-thumb-slate-300", children: [
         node.children.map((child) => renderNode(child, depth + 1)),
-        showExternalLoadingState && /* @__PURE__ */ jsx("div", { className: "py-2 px-3 text-center", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center text-sm text-slate-500", children: [
+        showInitialLoadingState && /* @__PURE__ */ jsx("div", { className: "py-2 px-3 text-center", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center text-sm text-slate-500", children: [
           /* @__PURE__ */ jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
           "Loading clips..."
         ] }) }),
-        loadingCategories.has(getMetadataLoadingKey(node.id, (categoryPages[node.id] || 0) + 1)) && /* @__PURE__ */ jsx("div", { className: "py-2 px-3 text-center", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center text-sm text-slate-500", children: [
+        isLoadMoreLoading && /* @__PURE__ */ jsx("div", { className: "py-2 px-3 text-center", children: /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center text-sm text-slate-500", children: [
           /* @__PURE__ */ jsx("div", { className: "animate-spin mr-2 h-4 w-4 border-2 border-slate-300 border-t-blue-500 rounded-full" }),
           "Loading more clips..."
         ] }) }),
-        categoryHasMore[node.id] && !loadingCategories.has(getMetadataLoadingKey(node.id, (categoryPages[node.id] || 0) + 1)) && /* @__PURE__ */ jsxs(
+        categoryHasMore[node.id] && !isLoadMoreLoading && /* @__PURE__ */ jsxs(
           "button",
           {
             onClick: (e) => {
               e.stopPropagation();
-              const nextPage = (categoryPages[node.id] || 1) + 1;
-              fetchClipMetadata(node.id, nextPage);
+              fetchClipMetadata(node.id, nextLoadMorePage);
             },
             className: "w-full py-2 px-3 text-sm text-blue-600 hover:bg-blue-50 rounded-lg transition-colors duration-200 text-center",
             children: [
@@ -46673,6 +47214,7 @@ var BottlenecksContent = ({
   triageMode = false,
   ticketId,
   prefetchedPercentileCounts,
+  lowMomentsPrefetch,
   initialTimeFilter
 }) => {
   console.log("\u{1F3AB} [BottlenecksContent] Rendered with ticketId:", ticketId || "NONE", "workspaceId:", workspaceId, "date:", date, "shift:", shift);
@@ -46765,6 +47307,10 @@ var BottlenecksContent = ({
   const [isShareLoading, setIsShareLoading] = useState(false);
   const [isShareCopied, setIsShareCopied] = useState(false);
   const shareCopiedTimeoutRef = useRef(null);
+  const [lowEfficiencyAiSummaryByClipId, setLowEfficiencyAiSummaryByClipId] = useState({});
+  const [lowEfficiencyAiSummaryLoadingByClipId, setLowEfficiencyAiSummaryLoadingByClipId] = useState({});
+  const [lowEfficiencyAiSummaryErrorByClipId, setLowEfficiencyAiSummaryErrorByClipId] = useState({});
+  const lowEfficiencyAiSummaryRequestStatusRef = useRef({});
   useEffect(() => {
     return () => {
       if (shareCopiedTimeoutRef.current) {
@@ -46773,6 +47319,7 @@ var BottlenecksContent = ({
     };
   }, []);
   const loadingTimeoutRef = useRef(null);
+  const metadataLoadingKeyRef = useRef(null);
   const [activeFilter, setActiveFilter] = useState(initialFilter);
   const previousFilterRef = useRef("");
   const [allVideos, setAllVideos] = useState([]);
@@ -46929,60 +47476,33 @@ var BottlenecksContent = ({
     if (initialFilter) {
       return;
     }
+    const redStreakType = "recent_flow_red_streak";
+    if (dynamicCounts[redStreakType] > 0) {
+      setInitialFilter(redStreakType);
+      setActiveFilter(redStreakType);
+      activeFilterRef.current = redStreakType;
+      return;
+    }
     if (defaultCategory) {
       setInitialFilter(defaultCategory);
       setActiveFilter(defaultCategory);
       activeFilterRef.current = defaultCategory;
       return;
     }
-    if (clipTypes.length > 0) {
-      let selectedType = null;
-      if (clipTypes.length === 1) {
-        selectedType = clipTypes[0];
-      } else {
-        const priorityOrder = ["cycle_completion", "fast-cycles", "slow-cycles", "idle_time"];
-        for (const priorityType of priorityOrder) {
-          const type = clipTypes.find((t) => t.type === priorityType && (dynamicCounts[t.type] || 0) > 0);
-          if (type) {
-            selectedType = type;
-            break;
-          }
-        }
-        if (!selectedType) {
-          selectedType = clipTypes.find((type) => (dynamicCounts[type.type] || 0) > 0);
-        }
-        if (!selectedType) {
-          selectedType = clipTypes[0];
-        }
-      }
-      if (selectedType) {
-        console.log(`[BottlenecksContent] Auto-selecting filter: ${selectedType.type} (count: ${dynamicCounts[selectedType.type] || 0})`);
-        setInitialFilter(selectedType.type);
-        setActiveFilter(selectedType.type);
-        activeFilterRef.current = selectedType.type;
-      }
-    }
   }, [clipTypes, dynamicCounts, defaultCategory, initialFilter]);
   const mergedCounts = useMemo(() => {
     return { ...dynamicCounts };
   }, [dynamicCounts]);
   useEffect(() => {
-    if (!firstClip || allVideos.length > 0 || !isMountedRef.current) {
+    if (allVideos.length > 0 || !isMountedRef.current) {
       return;
     }
-    if (activeFilterRef.current && firstClip.type !== activeFilterRef.current) {
+    if (!activeFilterRef.current) {
+      setHasInitialLoad(true);
+      setIsCategoryLoading(false);
       return;
     }
-    setCurrentClipId(firstClip.id || null);
-    setAllVideos([firstClip]);
-    setCurrentPosition(1);
-    currentPositionRef.current = 1;
-    const total = mergedCounts[firstClip.type] || 0;
-    currentTotalRef.current = total;
-    setCurrentTotal(total);
-    setHasInitialLoad(true);
-    setIsCategoryLoading(false);
-  }, [firstClip, allVideos.length, mergedCounts]);
+  }, [firstClips, allVideos.length, mergedCounts]);
   useEffect(() => {
     if (!firstClips || typeof document === "undefined") {
       return;
@@ -47018,25 +47538,6 @@ var BottlenecksContent = ({
   const loadFirstVideoForCategory = useCallback(async (category) => {
     if (!workspaceId || !s3ClipsService || !isMountedRef.current || !isEffectiveShiftReady) return;
     const targetCategory = category || activeFilterRef.current;
-    const initClip = targetCategory ? firstClips?.[targetCategory] : null;
-    if (initClip) {
-      setCurrentClipId(initClip.id || null);
-      setAllVideos((prev) => {
-        const exists = prev.some((v) => v.id === initClip.id);
-        if (!exists) {
-          return [...prev, initClip];
-        }
-        return prev;
-      });
-      setCurrentPosition(1);
-      currentPositionRef.current = 1;
-      const total = mergedCounts[targetCategory] || 0;
-      currentTotalRef.current = total;
-      setCurrentTotal(total);
-      setHasInitialLoad(true);
-      setIsCategoryLoading(false);
-      return;
-    }
     const operationKey = `loadFirstVideo:${targetCategory}:${effectiveDateString}:${effectiveShiftId}`;
     if (loadingCategoryRef.current === targetCategory || fetchInProgressRef.current.has(operationKey)) {
       console.log(`[BottlenecksContent] Load first video already in progress for ${targetCategory}`);
@@ -47052,12 +47553,25 @@ var BottlenecksContent = ({
       const shiftStr = effectiveShiftId;
       console.log(`[BottlenecksContent] Loading first video for category: ${targetCategory}`);
       try {
-        const firstVideo = await s3ClipsService.getFirstClipForCategory(
-          workspaceId,
-          operationalDate,
-          shiftStr,
-          targetCategory
-        );
+        let firstVideo = null;
+        const totalCategoryClips = mergedCounts[targetCategory] || 0;
+        if (totalCategoryClips > 0) {
+          firstVideo = await s3ClipsService.getClipByIndex(
+            workspaceId,
+            operationalDate,
+            shiftStr,
+            targetCategory,
+            0
+          );
+        }
+        if (!firstVideo) {
+          firstVideo = await s3ClipsService.getFirstClipForCategory(
+            workspaceId,
+            operationalDate,
+            shiftStr,
+            targetCategory
+          );
+        }
         if (firstVideo) {
           console.log(`[BottlenecksContent] Successfully loaded first video, ID: ${firstVideo.id}`);
           setCurrentClipId(firstVideo.id || null);
@@ -47068,8 +47582,8 @@ var BottlenecksContent = ({
             }
             return prev;
           });
-          setCurrentPosition(1);
-          currentPositionRef.current = 1;
+          setCurrentPosition(totalCategoryClips > 0 ? 1 : 0);
+          currentPositionRef.current = totalCategoryClips > 0 ? 1 : 0;
           const total = mergedCounts[targetCategory] || 0;
           currentTotalRef.current = total;
           setCurrentTotal(total);
@@ -47083,13 +47597,13 @@ var BottlenecksContent = ({
       }
       if (mergedCounts[targetCategory] > 0) {
         try {
+          const fallbackIndex = 0;
           const firstVideo = await s3ClipsService.getClipByIndex(
             workspaceId,
             operationalDate,
             shiftStr,
             targetCategory,
-            0
-            // First video (index 0)
+            fallbackIndex
           );
           if (firstVideo && isMountedRef.current) {
             console.log(`[BottlenecksContent] Successfully loaded first video via index`);
@@ -47192,11 +47706,12 @@ var BottlenecksContent = ({
             categoryId
           }));
         };
-        const [cycleClips, idleClips] = await Promise.all([
+        const [cycleClips, redFlowClips, idleClips] = await Promise.all([
           fetchCategoryMetadata("cycle_completion"),
+          fetchCategoryMetadata("recent_flow_red_streak"),
           fetchCategoryMetadata("idle_time")
         ]);
-        const allClips = [...cycleClips, ...idleClips].sort(
+        const allClips = [...cycleClips, ...redFlowClips, ...idleClips].sort(
           (a, b) => new Date(b.clip_timestamp).getTime() - new Date(a.clip_timestamp).getTime()
         );
         setTriageClips(allClips);
@@ -47245,6 +47760,9 @@ var BottlenecksContent = ({
   }, [idleTimeVlmEnabled, triageClips, triageMode, getAuthToken4]);
   useEffect(() => {
     if (s3ClipsService && (mergedCounts[activeFilter] || 0) > 0) {
+      if (activeFilter === "recent_flow_red_streak") {
+        return;
+      }
       if (firstClip && firstClip.type === activeFilter) {
         return;
       }
@@ -47265,10 +47783,10 @@ var BottlenecksContent = ({
     return ["fast-cycles", "slow-cycles", "longest-idles"].includes(categoryId);
   }, [isFastSlowClipFiltersEnabled]);
   const shouldUseMetadataNavigation = useCallback((categoryId) => {
-    return isPercentileCategory(categoryId) || categoryId === "idle_time" && idleClipSort === "idle_duration_desc";
+    return isPercentileCategory(categoryId) || categoryId === "recent_flow_red_streak" || categoryId === "idle_time" && idleClipSort === "idle_duration_desc";
   }, [idleClipSort, isPercentileCategory]);
   const getMetadataCacheKey = useCallback((categoryId) => {
-    const sortKey = categoryId === "idle_time" ? idleClipSort : "latest";
+    const sortKey = categoryId === "recent_flow_red_streak" ? "red_flow_output_shortfall_desc" : categoryId === "idle_time" ? idleClipSort : "latest";
     return `${categoryId}-${effectiveDateString}-${effectiveShiftId}-${snapshotDateTime ?? "nosnap"}-${snapshotClipId ?? "nosnap"}-${sortKey}`;
   }, [effectiveDateString, effectiveShiftId, snapshotDateTime, snapshotClipId, idleClipSort]);
   const setVisibleCategoryMetadata = useCallback((categoryId, clips) => {
@@ -47278,7 +47796,7 @@ var BottlenecksContent = ({
     categoryMetadataRef.current = clips;
     setCategoryMetadata(clips);
     setCategoryMetadataCategoryId(clips.length > 0 ? categoryId : null);
-    setCategoryMetadataSort(clips.length > 0 ? categoryId === "idle_time" ? idleClipSort : "latest" : null);
+    setCategoryMetadataSort(clips.length > 0 ? categoryId === "recent_flow_red_streak" ? "red_flow_output_shortfall_desc" : categoryId === "idle_time" ? idleClipSort : "latest" : null);
     return true;
   }, [idleClipSort]);
   const applyMetadataSnapshot = useCallback((categoryId, clips, total) => {
@@ -47296,6 +47814,22 @@ var BottlenecksContent = ({
       setCurrentTotal(total);
     }
   }, [getMetadataCacheKey, shouldUseMetadataNavigation, setVisibleCategoryMetadata]);
+  const applyPrefetchedFirstVideo = useCallback((video) => {
+    if (!video || !isMountedRef.current) {
+      return false;
+    }
+    if (currentClipIdRef.current === video.id) {
+      return true;
+    }
+    setCurrentClipId(video.id);
+    setAllVideos([video]);
+    setCurrentIndex(0);
+    setCurrentMetadataIndex(0);
+    currentMetadataIndexRef.current = 0;
+    setCurrentPosition(1);
+    currentPositionRef.current = 1;
+    return true;
+  }, []);
   const getClipTypesForPercentileCategory = useCallback((categoryId) => {
     switch (categoryId) {
       case "fast-cycles":
@@ -47315,7 +47849,7 @@ var BottlenecksContent = ({
     if (activeFilter !== "fast-cycles" && activeFilter !== "slow-cycles") {
       return;
     }
-    const fallbackFilter = ["cycle_completion", "idle_time"].find((type) => (dynamicCounts[type] || 0) > 0) || clipTypes.find((type) => (dynamicCounts[type.type] || 0) > 0)?.type || clipTypes[0]?.type;
+    const fallbackFilter = ["cycle_completion", "recent_flow_red_streak", "idle_time"].find((type) => (dynamicCounts[type] || 0) > 0) || clipTypes.find((type) => (dynamicCounts[type.type] || 0) > 0)?.type || clipTypes[0]?.type;
     if (!fallbackFilter || fallbackFilter === activeFilter) {
       return;
     }
@@ -47371,30 +47905,70 @@ var BottlenecksContent = ({
       setCategoryMetadataCategoryId(null);
       setCategoryMetadataSort(null);
       categoryMetadataRef.current = [];
+      if (activeFilterRef.current === categoryId) {
+        setIsCategoryLoading(false);
+      }
       return;
     }
     if (!isEffectiveShiftReady) {
       console.log("[BottlenecksContent] Skipping metadata load - shift/date not ready");
+      if (activeFilterRef.current === categoryId) {
+        setIsCategoryLoading(false);
+      }
       return;
     }
     const resolvedDate = effectiveDateString;
     const cacheKey = getMetadataCacheKey(categoryId);
-    const cachedMetadata = !forceRefresh ? metadataCache[cacheKey] : void 0;
+    const candidateLowMomentsPrefetch = lowMomentsPrefetch ?? null;
+    const lowMomentsPrefetchMatchesScope = Boolean(
+      candidateLowMomentsPrefetch?.key?.startsWith(`recent_flow_red_streak-${effectiveDateString}-${effectiveShiftId}-`)
+    );
+    const matchingLowMomentsPrefetch = !forceRefresh && categoryId === "recent_flow_red_streak" && candidateLowMomentsPrefetch && (candidateLowMomentsPrefetch.key === cacheKey || lowMomentsPrefetchMatchesScope) && !candidateLowMomentsPrefetch.loading && Array.isArray(candidateLowMomentsPrefetch.metadata) && candidateLowMomentsPrefetch.metadata.length > 0 ? candidateLowMomentsPrefetch : null;
+    const lowMomentsPrefetchInFlight = !forceRefresh && categoryId === "recent_flow_red_streak" && candidateLowMomentsPrefetch && (candidateLowMomentsPrefetch.key === cacheKey || lowMomentsPrefetchMatchesScope) && candidateLowMomentsPrefetch.loading;
+    if (lowMomentsPrefetchInFlight) {
+      if (autoLoadFirstVideo && candidateLowMomentsPrefetch?.firstVideo) {
+        applyPrefetchedFirstVideo(candidateLowMomentsPrefetch.firstVideo);
+      }
+      if (Array.isArray(candidateLowMomentsPrefetch?.metadata) && candidateLowMomentsPrefetch.metadata.length > 0) {
+        applyMetadataSnapshot(categoryId, candidateLowMomentsPrefetch.metadata, candidateLowMomentsPrefetch.total);
+      }
+      if (activeFilterRef.current === categoryId) {
+        setIsCategoryLoading(true);
+      }
+      return;
+    }
+    const cachedMetadata = matchingLowMomentsPrefetch?.metadata ?? (!forceRefresh ? metadataCache[cacheKey] : void 0);
+    const requestKey = cacheKey;
+    if (metadataLoadingKeyRef.current === requestKey) {
+      console.log(`[BottlenecksContent] Metadata load already in progress for ${categoryId}`);
+      return;
+    }
+    metadataLoadingKeyRef.current = requestKey;
     try {
       if (cachedMetadata) {
         console.log(`[BottlenecksContent] Using cached metadata for ${categoryId}`);
+        if (matchingLowMomentsPrefetch) {
+          setMetadataCache((prev) => prev[cacheKey] ? prev : {
+            ...prev,
+            [cacheKey]: matchingLowMomentsPrefetch.metadata
+          });
+        }
         setVisibleCategoryMetadata(categoryId, cachedMetadata);
         if (autoLoadFirstVideo && cachedMetadata.length > 0 && s3ClipsService) {
           const firstClipMeta = cachedMetadata[0];
+          const firstClipId = firstClipMeta.clipId || firstClipMeta.id;
+          const prefetchedFirstVideo = matchingLowMomentsPrefetch?.firstVideo ?? null;
           try {
-            const video = await s3ClipsService.getClipById(firstClipMeta.clipId);
-            if (video && isMountedRef.current) {
-              setCurrentClipId(firstClipMeta.clipId);
-              setAllVideos([video]);
-              setCurrentIndex(0);
-              setCurrentMetadataIndex(0);
-              currentMetadataIndexRef.current = 0;
-              console.log(`[BottlenecksContent] Auto-loaded first video from cache: ${video.id} (1/${cachedMetadata.length})`);
+            let loadedVideo = null;
+            if (prefetchedFirstVideo?.id === firstClipId) {
+              loadedVideo = prefetchedFirstVideo;
+              applyPrefetchedFirstVideo(prefetchedFirstVideo);
+            } else {
+              loadedVideo = await s3ClipsService.getClipById(firstClipId);
+              applyPrefetchedFirstVideo(loadedVideo);
+            }
+            if (loadedVideo && isMountedRef.current) {
+              console.log(`[BottlenecksContent] Auto-loaded first video from cache: ${loadedVideo.id} (1/${cachedMetadata.length})`);
             }
           } catch (error2) {
             console.error(`[BottlenecksContent] Error loading first video from cache:`, error2);
@@ -47441,7 +48015,7 @@ var BottlenecksContent = ({
             knownTotal: mergedCounts[categoryId] ?? null,
             snapshotDateTime,
             snapshotClipId,
-            sort: categoryId === "idle_time" ? idleClipSort : "latest"
+            sort: categoryId === "recent_flow_red_streak" ? "red_flow_output_shortfall_desc" : categoryId === "idle_time" ? idleClipSort : "latest"
           }),
           redirectReason: "session_expired"
         });
@@ -47502,10 +48076,11 @@ var BottlenecksContent = ({
         console.log(`[BottlenecksContent] Loaded metadata for ${categoryId}: ${metadataClips.length} clips`);
         if (autoLoadFirstVideo && metadataClips.length > 0 && s3ClipsService) {
           const firstClipMeta = metadataClips[0];
+          const firstClipId = firstClipMeta.clipId || firstClipMeta.id;
           try {
-            const video = await s3ClipsService.getClipById(firstClipMeta.clipId);
+            const video = await s3ClipsService.getClipById(firstClipId);
             if (video && isMountedRef.current) {
-              setCurrentClipId(firstClipMeta.clipId);
+              setCurrentClipId(firstClipId);
               setAllVideos([video]);
               setCurrentIndex(0);
               setCurrentMetadataIndex(0);
@@ -47527,9 +48102,43 @@ var BottlenecksContent = ({
     } catch (error2) {
       console.error(`[BottlenecksContent] Error loading category metadata:`, error2);
     } finally {
-      setIsCategoryLoading(false);
+      if (metadataLoadingKeyRef.current === requestKey) {
+        metadataLoadingKeyRef.current = null;
+      }
+      if (activeFilterRef.current === categoryId) {
+        setIsCategoryLoading(false);
+      }
     }
-  }, [workspaceId, effectiveDateString, effectiveShiftId, getMetadataCacheKey, isPercentileCategory, isFastSlowClipFiltersEnabled, metadataCache, s3ClipsService, clearLoadingState, isEffectiveShiftReady, snapshotDateTime, snapshotClipId, idleClipSort, supabase, setVisibleCategoryMetadata]);
+  }, [workspaceId, effectiveDateString, effectiveShiftId, getMetadataCacheKey, isPercentileCategory, isFastSlowClipFiltersEnabled, metadataCache, s3ClipsService, clearLoadingState, isEffectiveShiftReady, snapshotDateTime, snapshotClipId, idleClipSort, supabase, setVisibleCategoryMetadata, lowMomentsPrefetch, applyPrefetchedFirstVideo, applyMetadataSnapshot]);
+  useEffect(() => {
+    if (activeFilter !== "recent_flow_red_streak") {
+      return;
+    }
+    if (!lowMomentsPrefetch?.key?.startsWith(`recent_flow_red_streak-${effectiveDateString}-${effectiveShiftId}-`)) {
+      return;
+    }
+    if (lowMomentsPrefetch.firstVideo && !allVideos.some((video) => video.type === "recent_flow_red_streak")) {
+      applyPrefetchedFirstVideo(lowMomentsPrefetch.firstVideo);
+    }
+    if (lowMomentsPrefetch.metadata.length > 0) {
+      applyMetadataSnapshot("recent_flow_red_streak", lowMomentsPrefetch.metadata, lowMomentsPrefetch.total);
+      if (isMountedRef.current) {
+        setIsCategoryLoading(false);
+      }
+      return;
+    }
+    if (isMountedRef.current) {
+      setIsCategoryLoading(lowMomentsPrefetch.loading);
+    }
+  }, [
+    activeFilter,
+    lowMomentsPrefetch,
+    effectiveDateString,
+    effectiveShiftId,
+    allVideos,
+    applyPrefetchedFirstVideo,
+    applyMetadataSnapshot
+  ]);
   useEffect(() => {
     if (previousIdleClipSortRef.current === idleClipSort) {
       return;
@@ -47569,8 +48178,13 @@ var BottlenecksContent = ({
       currentTotalRef.current = total;
       setCurrentTotal(total);
       previousFilterRef.current = activeFilter;
-      if (activeFilter !== "all" && currentClipId) {
-        loadCategoryMetadata(activeFilter, false);
+      const metadataLoadPlan = getCategoryMetadataLoadPlanForFilterChange({
+        activeFilter,
+        currentClipId,
+        categoryTotal: total
+      });
+      if (metadataLoadPlan.shouldLoad) {
+        loadCategoryMetadata(activeFilter, metadataLoadPlan.autoLoadFirstVideo);
       }
       const filtered = allVideos.filter((video) => {
         if (activeFilter === "all") return true;
@@ -47593,11 +48207,11 @@ var BottlenecksContent = ({
     if (!currentClipId || activeFilter === "all") {
       return;
     }
-    if (categoryMetadataRef.current.length > 0 || isCategoryLoading) {
+    if (categoryMetadataRef.current.length > 0) {
       return;
     }
     loadCategoryMetadata(activeFilter, false);
-  }, [currentClipId, activeFilter, isCategoryLoading, loadCategoryMetadata]);
+  }, [currentClipId, activeFilter, loadCategoryMetadata]);
   const loadAndPlayClipById = useCallback(async (clipId, categoryId, position, metadataContext) => {
     if (!workspaceId || !s3ClipsService || !isMountedRef.current) return;
     console.log(`[BottlenecksContent] Loading clip by ID: ${clipId}, category=${categoryId}, position=${position}`);
@@ -48056,6 +48670,98 @@ var BottlenecksContent = ({
     }
     return filteredVideos[currentIndex];
   }, [filteredVideos, currentIndex]);
+  const currentLowEfficiencyClipId = currentVideo?.id || currentClipId || null;
+  const isCurrentLowEfficiencyClip = Boolean(
+    currentVideo?.type === "recent_flow_red_streak" || currentVideo?.red_flow_timeline
+  );
+  const currentLowEfficiencyAiSummary = currentLowEfficiencyClipId ? lowEfficiencyAiSummaryByClipId[currentLowEfficiencyClipId] || currentVideo?.low_efficiency_ai_summary || null : null;
+  const isCurrentLowEfficiencyAiSummaryLoading = Boolean(
+    currentLowEfficiencyClipId && lowEfficiencyAiSummaryLoadingByClipId[currentLowEfficiencyClipId]
+  );
+  const currentLowEfficiencyAiSummaryError = currentLowEfficiencyClipId ? lowEfficiencyAiSummaryErrorByClipId[currentLowEfficiencyClipId] || null : null;
+  useEffect(() => {
+    const clipId = currentLowEfficiencyClipId;
+    if (!clipId || !isCurrentLowEfficiencyClip || !workspaceId) {
+      return;
+    }
+    if (currentVideo?.low_efficiency_ai_summary || lowEfficiencyAiSummaryRequestStatusRef.current[clipId]) {
+      return;
+    }
+    let cancelled = false;
+    let timedOut = false;
+    const controller = new AbortController();
+    lowEfficiencyAiSummaryRequestStatusRef.current[clipId] = "loading";
+    const timeout = setTimeout(() => {
+      timedOut = true;
+      controller.abort();
+    }, 3e4);
+    setLowEfficiencyAiSummaryLoadingByClipId((prev) => ({ ...prev, [clipId]: true }));
+    setLowEfficiencyAiSummaryErrorByClipId((prev) => ({ ...prev, [clipId]: null }));
+    void (async () => {
+      try {
+        const response = await fetchWithSupabaseAuth(supabase, "/api/clips/supabase", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          signal: controller.signal,
+          body: JSON.stringify({
+            action: "ai-summary",
+            workspaceId,
+            clipId,
+            workspaceName
+          }),
+          redirectReason: "session_expired"
+        });
+        if (!response.ok) {
+          throw new Error(`AI summary API error: ${response.status}`);
+        }
+        const payload = await response.json();
+        const summary = payload?.summary;
+        if (!summary || !Array.isArray(summary.bullets) || summary.bullets.filter((bullet) => String(bullet || "").trim()).length < 3) {
+          throw new Error("AI summary response was empty");
+        }
+        if (!cancelled) {
+          lowEfficiencyAiSummaryRequestStatusRef.current[clipId] = "success";
+          setLowEfficiencyAiSummaryByClipId((prev) => ({ ...prev, [clipId]: summary }));
+        }
+      } catch (error2) {
+        if (cancelled) {
+          return;
+        }
+        lowEfficiencyAiSummaryRequestStatusRef.current[clipId] = "error";
+        const message = timedOut ? "AI summary timed out" : error2 instanceof Error ? error2.message : "AI summary unavailable";
+        console.warn("[BottlenecksContent] Failed to generate Low Efficiency AI summary:", error2);
+        setLowEfficiencyAiSummaryErrorByClipId((prev) => ({
+          ...prev,
+          [clipId]: message
+        }));
+      } finally {
+        clearTimeout(timeout);
+        if (isMountedRef.current) {
+          setLowEfficiencyAiSummaryLoadingByClipId((prev) => ({ ...prev, [clipId]: false }));
+        }
+      }
+    })();
+    return () => {
+      cancelled = true;
+      clearTimeout(timeout);
+      if (lowEfficiencyAiSummaryRequestStatusRef.current[clipId] === "loading") {
+        delete lowEfficiencyAiSummaryRequestStatusRef.current[clipId];
+      }
+      if (isMountedRef.current) {
+        setLowEfficiencyAiSummaryLoadingByClipId((prev) => ({ ...prev, [clipId]: false }));
+      }
+      controller.abort();
+    };
+  }, [
+    currentLowEfficiencyClipId,
+    currentVideo?.low_efficiency_ai_summary,
+    isCurrentLowEfficiencyClip,
+    supabase,
+    workspaceId,
+    workspaceName
+  ]);
   const handleShareClip = useCallback(async () => {
     if (!currentVideo?.id || isShareLoading) {
       if (!currentVideo?.id) {
@@ -48127,11 +48833,11 @@ var BottlenecksContent = ({
     }
     return currentPosition;
   }, [activeFilter, categoryMetadata.length, currentMetadataIndex, currentPosition, shouldUseMetadataNavigation]);
-  const prefetchedExplorerMetadata = useMemo(() => activeFilter === "idle_time" && categoryMetadataSort !== idleClipSort ? void 0 : buildPrefetchedExplorerMetadata(
+  const prefetchedExplorerMetadata = useMemo(() => activeFilter === "recent_flow_red_streak" && lowMomentsPrefetch?.key?.startsWith(`recent_flow_red_streak-${effectiveDateString}-${effectiveShiftId}-`) && !lowMomentsPrefetch.loading && lowMomentsPrefetch.metadata.length > 0 ? { recent_flow_red_streak: lowMomentsPrefetch.metadata } : activeFilter === "idle_time" && categoryMetadataSort !== idleClipSort ? void 0 : buildPrefetchedExplorerMetadata(
     activeFilter,
     categoryMetadataCategoryId,
     categoryMetadata
-  ), [activeFilter, categoryMetadata, categoryMetadataCategoryId, categoryMetadataSort, idleClipSort]);
+  ), [activeFilter, categoryMetadata, categoryMetadataCategoryId, categoryMetadataSort, idleClipSort, lowMomentsPrefetch, effectiveDateString, effectiveShiftId]);
   const classificationClipIds = useMemo(() => {
     if (!idleTimeVlmEnabled) {
       return [];
@@ -48523,6 +49229,8 @@ var BottlenecksContent = ({
         return "Cycle Completion";
       case "idle_time":
         return "Idle Time";
+      case "recent_flow_red_streak":
+        return "Low efficiency videos";
       case "running_cycle":
         return "Running Cycle";
       case "setup_state":
@@ -48602,12 +49310,26 @@ var BottlenecksContent = ({
                 onShare: handleShareClip,
                 isShareLoading,
                 isShareCopied,
+                timelineAnnotations: currentVideo.red_flow_timeline,
+                timelineExplanation: currentVideo.red_flow_explanation,
+                timelineTimezone: timezone,
                 options: videoPlayerOptions
               },
               `${currentVideo.id}-${playerInstanceNonce}-inline`
             )
           }
         ),
+        currentVideo.type === "recent_flow_red_streak" && !shouldDeferPlayerRenderForCrop ? /* @__PURE__ */ jsx(
+          RedFlowDiagnosticOverlay,
+          {
+            timeline: currentVideo.red_flow_timeline,
+            explanation: currentVideo.red_flow_explanation,
+            aiSummary: currentLowEfficiencyAiSummary,
+            aiSummaryLoading: isCurrentLowEfficiencyAiSummaryLoading,
+            aiSummaryError: currentLowEfficiencyAiSummaryError,
+            className: "right-4 top-4"
+          }
+        ) : null,
         showBlockingVideoLoader && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-30 flex items-center justify-center bg-black", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading video..." }) }),
         !shouldDeferPlayerRenderForCrop && !isTransitioning && isVideoBuffering && !isInitialLoading && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-30 flex items-center justify-center bg-black/60", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading video..." }) }),
         error && error.type === "retrying" && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-40 flex items-center justify-center bg-black/60", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
@@ -48707,10 +49429,10 @@ var BottlenecksContent = ({
                 ] }) })
               ] });
             })()
-          ) : /* @__PURE__ */ jsx("div", { className: "absolute top-3 right-3 z-10 bg-black/60 backdrop-blur-sm px-3 py-1.5 rounded-lg text-white shadow-lg text-xs", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+          ) : /* @__PURE__ */ jsx("div", { className: `absolute top-3 z-10 bg-black/60 backdrop-blur-sm px-3 py-1.5 rounded-lg text-white shadow-lg text-xs ${currentVideo.type === "recent_flow_red_streak" ? "left-3" : "right-3"}`, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
             /* @__PURE__ */ jsx("div", { className: `flex-shrink-0 h-2.5 w-2.5 rounded-full ${getSeverityColor(currentVideo.severity)} mr-2 animate-pulse` }),
             /* @__PURE__ */ jsx("span", { className: "font-medium mr-2", children: getClipTypeLabel(currentVideo) }),
-            /* @__PURE__ */ jsx("span", { className: "opacity-80 hidden sm:inline", children: currentVideo.description })
+            currentVideo.type !== "recent_flow_red_streak" && /* @__PURE__ */ jsx("span", { className: "opacity-80 hidden sm:inline", children: currentVideo.description })
           ] }) })
         )
       ] }) }) }) : (
@@ -48720,14 +49442,21 @@ var BottlenecksContent = ({
           /* @__PURE__ */ jsx("h3", { className: "text-xl font-medium text-gray-700 mb-2", children: "No Clips Found" }),
           /* @__PURE__ */ jsx("p", { className: "text-gray-500", children: "There were no video clips found for this workspace today." })
         ] }) }) : (
-          /* Priority 6: Show "no matching clips" only if we have data loaded and specifically no clips for this filter */
-          hasInitialLoad && (mergedCounts[activeFilter] || 0) === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-[220px] sm:min-h-[320px] lg:h-full", children: /* @__PURE__ */ jsxs("div", { className: "text-center p-8", children: [
+          /* Priority 5.5: Show "no folder selected" if activeFilter is empty */
+          hasInitialLoad && !activeFilter ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-[220px] sm:min-h-[320px] lg:h-full", children: /* @__PURE__ */ jsxs("div", { className: "text-center p-8", children: [
             /* @__PURE__ */ jsx("svg", { className: "w-16 h-16 text-gray-300 mx-auto mb-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" }) }),
-            /* @__PURE__ */ jsx("h3", { className: "text-xl font-medium text-gray-700 mb-2", children: "No Matching Clips" }),
-            /* @__PURE__ */ jsx("p", { className: "text-gray-500", children: "There are no clips matching the selected filter." })
+            /* @__PURE__ */ jsx("h3", { className: "text-xl font-medium text-gray-700 mb-2", children: "No Folder Selected" }),
+            /* @__PURE__ */ jsx("p", { className: "text-gray-500", children: "Please select a folder to view clips." })
           ] }) }) : (
-            /* Priority 7: Default loading state for any other case */
-            /* @__PURE__ */ jsx("div", { className: "p-4 lg:h-full", children: /* @__PURE__ */ jsx("div", { className: "relative lg:h-full", children: /* @__PURE__ */ jsx("div", { className: "relative w-full min-h-[220px] sm:min-h-[320px] lg:min-h-0 lg:h-full overflow-hidden rounded-md shadow-inner bg-gray-900 flex items-center justify-center", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading..." }) }) }) })
+            /* Priority 6: Show "no matching clips" only if we have data loaded and specifically no clips for this filter */
+            hasInitialLoad && (mergedCounts[activeFilter] || 0) === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-[220px] sm:min-h-[320px] lg:h-full", children: /* @__PURE__ */ jsxs("div", { className: "text-center p-8", children: [
+              /* @__PURE__ */ jsx("svg", { className: "w-16 h-16 text-gray-300 mx-auto mb-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" }) }),
+              /* @__PURE__ */ jsx("h3", { className: "text-xl font-medium text-gray-700 mb-2", children: "No Matching Clips" }),
+              /* @__PURE__ */ jsx("p", { className: "text-gray-500", children: "There are no clips matching the selected filter." })
+            ] }) }) : (
+              /* Priority 7: Default loading state for any other case */
+              /* @__PURE__ */ jsx("div", { className: "p-4 lg:h-full", children: /* @__PURE__ */ jsx("div", { className: "relative lg:h-full", children: /* @__PURE__ */ jsx("div", { className: "relative w-full min-h-[220px] sm:min-h-[320px] lg:min-h-0 lg:h-full overflow-hidden rounded-md shadow-inner bg-gray-900 flex items-center justify-center", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading..." }) }) }) })
+            )
           )
         )
       ) }) }),
@@ -48879,6 +49608,11 @@ var BottlenecksContent = ({
             idleTimeVlmEnabled,
             showPercentileCycleFilters: isFastSlowClipFiltersEnabled,
             prefetchedClipMetadata: prefetchedExplorerMetadata,
+            externallyManagedLoadingCategories: {
+              recent_flow_red_streak: Boolean(
+                activeFilter === "recent_flow_red_streak" && lowMomentsPrefetch?.key?.startsWith(`recent_flow_red_streak-${effectiveDateString}-${effectiveShiftId}-`) && lowMomentsPrefetch.loading
+              )
+            },
             activeCategoryLoading: isCategoryLoading,
             idleClipSort,
             onIdleClipSortChange: setIdleClipSort,
@@ -48994,10 +49728,10 @@ var BottlenecksContent = ({
                 ] }) })
               ] });
             })()
-          ) : /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-20 z-50 bg-black/60 backdrop-blur-sm px-4 py-2 rounded-lg text-white shadow-lg", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+          ) : /* @__PURE__ */ jsx("div", { className: `absolute top-4 z-50 bg-black/60 backdrop-blur-sm px-4 py-2 rounded-lg text-white shadow-lg ${currentVideo.type === "recent_flow_red_streak" ? "left-4" : "right-20"}`, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
             /* @__PURE__ */ jsx("div", { className: `flex-shrink-0 h-3 w-3 rounded-full ${getSeverityColor(currentVideo.severity)} mr-2 animate-pulse` }),
             /* @__PURE__ */ jsx("span", { className: "font-medium mr-2", children: getClipTypeLabel(currentVideo) }),
-            /* @__PURE__ */ jsx("span", { className: "opacity-80", children: currentVideo.description })
+            currentVideo.type !== "recent_flow_red_streak" && /* @__PURE__ */ jsx("span", { className: "opacity-80", children: currentVideo.description })
           ] }) }),
           /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center p-8", children: /* @__PURE__ */ jsxs("div", { className: "relative w-full h-full max-w-7xl group", children: [
             /* @__PURE__ */ jsx(
@@ -49033,12 +49767,26 @@ var BottlenecksContent = ({
                     onShare: handleShareClip,
                     isShareLoading,
                     isShareCopied,
+                    timelineAnnotations: currentVideo.red_flow_timeline,
+                    timelineExplanation: currentVideo.red_flow_explanation,
+                    timelineTimezone: timezone,
                     options: videoPlayerOptions
                   },
                   `${currentVideo.id}-${playerInstanceNonce}-fullscreen`
                 )
               }
             ),
+            currentVideo.type === "recent_flow_red_streak" && !shouldDeferPlayerRenderForCrop ? /* @__PURE__ */ jsx(
+              RedFlowDiagnosticOverlay,
+              {
+                timeline: currentVideo.red_flow_timeline,
+                explanation: currentVideo.red_flow_explanation,
+                aiSummary: currentLowEfficiencyAiSummary,
+                aiSummaryLoading: isCurrentLowEfficiencyAiSummaryLoading,
+                aiSummaryError: currentLowEfficiencyAiSummaryError,
+                className: "right-8 top-8"
+              }
+            ) : null,
             showBlockingVideoLoader && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-30 flex items-center justify-center bg-black", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading video..." }) }),
             !shouldDeferPlayerRenderForCrop && !isTransitioning && isVideoBuffering && !isInitialLoading && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-30 flex items-center justify-center bg-black/60", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "md", message: "Loading video..." }) }),
             /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 left-0 right-0 p-4 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 z-10", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-white", children: [
@@ -51061,8 +51809,8 @@ var IdleTimeReasonChartComponent = ({
   updateAnimation = "replay",
   variant = "pie"
 }) => {
-  const [activeData, setActiveData] = React147__default.useState([]);
-  React147__default.useEffect(() => {
+  const [activeData, setActiveData] = React148__default.useState([]);
+  React148__default.useEffect(() => {
     if (updateAnimation === "smooth") {
       setActiveData(data && data.length > 0 ? data : []);
       return;
@@ -51081,7 +51829,7 @@ var IdleTimeReasonChartComponent = ({
       setActiveData([]);
     }
   }, [data, updateAnimation]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!data || data.length === 0) return;
     data.forEach((entry, index) => {
       if (entry.name.toLowerCase().includes("other")) {
@@ -51089,7 +51837,7 @@ var IdleTimeReasonChartComponent = ({
       }
     });
   }, [data]);
-  const pieKey = React147__default.useMemo(() => {
+  const pieKey = React148__default.useMemo(() => {
     if (updateAnimation === "smooth") {
       return "smooth";
     }
@@ -51259,7 +52007,7 @@ var IdleTimeReasonChartComponent = ({
     )
   ] });
 };
-var IdleTimeReasonChart = React147__default.memo(IdleTimeReasonChartComponent);
+var IdleTimeReasonChart = React148__default.memo(IdleTimeReasonChartComponent);
 IdleTimeReasonChart.displayName = "IdleTimeReasonChart";
 var IdleTimeReasonChart_default = IdleTimeReasonChart;
 
@@ -53483,7 +54231,7 @@ var StatusIndicator = ({ status }) => {
     case "bottleneck":
       return /* @__PURE__ */ jsx(Zap, { className: "h-5 w-5 text-orange-400", "aria-label": "Bottleneck" });
     case "lowEfficiency":
-      return /* @__PURE__ */ jsx(AlertTriangle, { className: "h-5 w-5 text-red-400", "aria-label": "Low Efficiency" });
+      return /* @__PURE__ */ jsx(AlertTriangle, { className: "h-5 w-5 text-red-400", "aria-label": "Low moments" });
     case "inactive":
       return /* @__PURE__ */ jsx("div", { className: "h-3 w-3 bg-gray-400 rounded-full", title: "Inactive", "aria-label": "Inactive Workspace" });
     default:
@@ -55786,13 +56534,13 @@ var WorkspaceCycleTimeMetricCards = ({
   liveSkuId
 }) => {
   const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
-  const activeSku = React147__default.useMemo(() => {
+  const activeSku = React148__default.useMemo(() => {
     if (skuAware && activeSkuId && skuBreakdown) {
       return skuBreakdown.find((s) => s.sku_id === activeSkuId);
     }
     return null;
   }, [skuAware, activeSkuId, skuBreakdown]);
-  const displaySku = React147__default.useMemo(() => {
+  const displaySku = React148__default.useMemo(() => {
     if (activeSku) return activeSku;
     if (skuAware && !activeSkuId && liveSkuId && skuBreakdown) {
       return skuBreakdown.find((s) => s.sku_id === liveSkuId) ?? null;
@@ -56037,7 +56785,7 @@ var arePropsEqual = (prevProps, nextProps) => {
   return prevProps.data.efficiency === nextProps.data.efficiency && prevProps.data.trend_score === nextProps.data.trend_score && prevProps.data.workspace_id === nextProps.data.workspace_id && prevProps.data.workspace_name === nextProps.data.workspace_name && prevProps.isBottleneck === nextProps.isBottleneck && prevProps.isLowEfficiency === nextProps.isLowEfficiency && prevProps.isVeryLowEfficiency === nextProps.isVeryLowEfficiency && prevLegend.green_min === nextLegend.green_min && prevLegend.green_max === nextLegend.green_max && prevLegend.yellow_min === nextLegend.yellow_min && prevLegend.yellow_max === nextLegend.yellow_max && prevLegend.red_min === nextLegend.red_min && prevLegend.red_max === nextLegend.red_max && prevLegend.critical_threshold === nextLegend.critical_threshold && // Position doesn't need deep equality check as it's generally static
   prevProps.position.id === nextProps.position.id;
 };
-var WorkspaceGridItem = React147__default.memo(({
+var WorkspaceGridItem = React148__default.memo(({
   data,
   position,
   isBottleneck = false,
@@ -56132,7 +56880,7 @@ var WorkspaceGridItem = React147__default.memo(({
   );
 }, arePropsEqual);
 WorkspaceGridItem.displayName = "WorkspaceGridItem";
-var WorkspaceGrid = React147__default.memo(({
+var WorkspaceGrid = React148__default.memo(({
   workspaces,
   blueComparisonWorkspaces,
   isPdfMode = false,
@@ -56385,7 +57133,7 @@ var KPICard = ({
 }) => {
   useThemeConfig();
   const { formatNumber } = useFormatNumber();
-  const trendInfo = React147__default.useMemo(() => {
+  const trendInfo = React148__default.useMemo(() => {
     let trendValue = trend || "neutral";
     if (change !== void 0 && trend === void 0) {
       trendValue = change > 0 ? "up" : change < 0 ? "down" : "neutral";
@@ -56412,7 +57160,7 @@ var KPICard = ({
     const shouldShowTrend = !(change === 0 && trend === void 0);
     return { trendValue, Icon: Icon2, colorClass, bgClass, shouldShowTrend };
   }, [trend, change]);
-  const formattedValue = React147__default.useMemo(() => {
+  const formattedValue = React148__default.useMemo(() => {
     if (title === "Quality Compliance" && typeof value === "number") {
       return value.toFixed(1);
     }
@@ -56426,7 +57174,7 @@ var KPICard = ({
     }
     return value;
   }, [value, title]);
-  const formattedChange = React147__default.useMemo(() => {
+  const formattedChange = React148__default.useMemo(() => {
     if (change === void 0 || change === 0 && !showZeroChange) return null;
     const absChange = Math.abs(change);
     return formatNumber(absChange, { minimumFractionDigits: 0, maximumFractionDigits: 1 });
@@ -57933,7 +58681,7 @@ var Breadcrumbs = ({ items }) => {
       }
     }
   };
-  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "mb-1 flex items-center space-x-1 text-xs font-medium text-gray-500 dark:text-gray-400", children: items.map((item, index) => /* @__PURE__ */ jsxs(React147__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "mb-1 flex items-center space-x-1 text-xs font-medium text-gray-500 dark:text-gray-400", children: items.map((item, index) => /* @__PURE__ */ jsxs(React148__default.Fragment, { children: [
     index > 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 text-gray-400 dark:text-gray-500" }),
     /* @__PURE__ */ jsxs(
       "span",
@@ -59457,7 +60205,7 @@ var AwardBadge = ({
 }) => {
   const styles2 = getBadgeStyles(type);
   const Icon2 = CustomIcon || getDefaultIcon(type);
-  const randomDelay = React147__default.useMemo(() => Math.random() * 2, []);
+  const randomDelay = React148__default.useMemo(() => Math.random() * 2, []);
   const floatingAnimation = {
     animate: {
       y: [0, -10, 0],
@@ -67826,7 +68574,7 @@ function HomeView({
               animate: { opacity: 1, scale: 1 },
               transition: { duration: 0.3 },
               className: "h-full",
-              children: React147__default.createElement(WorkspaceGrid, {
+              children: React148__default.createElement(WorkspaceGrid, {
                 workspaces: workspaceMetricsWithBreakState,
                 blueComparisonWorkspaces: currentBlueComparisonWorkspaceMetrics || workspaceMetricsWithBreakState,
                 lineNames: mergedLineNames,
@@ -67859,7 +68607,7 @@ function HomeView({
               animate: { opacity: 1, scale: 1 },
               transition: { duration: 0.3 },
               className: "h-full",
-              children: React147__default.createElement(WorkspaceGrid, {
+              children: React148__default.createElement(WorkspaceGrid, {
                 workspaces: [],
                 // Show empty grid while loading
                 blueComparisonWorkspaces: [],
@@ -67906,7 +68654,7 @@ function HomeView({
             contentVariant: "plain"
           }
         ),
-        /* @__PURE__ */ jsx(AnimatePresence, { children: showAllGreenCelebration ? /* @__PURE__ */ jsxs(React147__default.Fragment, { children: [
+        /* @__PURE__ */ jsx(AnimatePresence, { children: showAllGreenCelebration ? /* @__PURE__ */ jsxs(React148__default.Fragment, { children: [
           /* @__PURE__ */ jsx(
             motion.div,
             {
@@ -67985,7 +68733,7 @@ function HomeView({
             "all-green-center-toast"
           )
         ] }, "all-green-celebration") : null }),
-        /* @__PURE__ */ jsx(AnimatePresence, { children: greenStreakMilestoneBanner ? /* @__PURE__ */ jsxs(React147__default.Fragment, { children: [
+        /* @__PURE__ */ jsx(AnimatePresence, { children: greenStreakMilestoneBanner ? /* @__PURE__ */ jsxs(React148__default.Fragment, { children: [
           /* @__PURE__ */ jsx(
             motion.div,
             {
@@ -68079,7 +68827,7 @@ function HomeView({
     }
   );
 }
-var AuthenticatedHomeView = withAuth(React147__default.memo(HomeView));
+var AuthenticatedHomeView = withAuth(React148__default.memo(HomeView));
 var HomeView_default = HomeView;
 function withWorkspaceDisplayNames(Component3, options = {}) {
   const {
@@ -71428,7 +72176,14 @@ var formatSupervisorFirstNames = (supervisors, fallbackSupervisorNames) => {
   return fallbackFirstNames.length > 0 ? Array.from(new Set(fallbackFirstNames)).join(", ") : "Unassigned";
 };
 var LeaderboardCountdown = ({ targetDate, format: format10, finishedLabel = "Finished", placeholder = "--", onFinished }) => {
-  const [time2, setTime] = useState("");
+  const [time2, setTime] = useState(() => {
+    if (!targetDate) return "";
+    return targetDate.getTime() <= Date.now() ? finishedLabel : "";
+  });
+  const [showEndsInPrefix, setShowEndsInPrefix] = useState(() => {
+    if (!targetDate) return true;
+    return targetDate.getTime() > Date.now();
+  });
   const hasFinishedRef = useRef(false);
   useEffect(() => {
     hasFinishedRef.current = false;
@@ -71436,12 +72191,14 @@ var LeaderboardCountdown = ({ targetDate, format: format10, finishedLabel = "Fin
   useEffect(() => {
     if (!targetDate) {
       setTime(placeholder);
+      setShowEndsInPrefix(true);
       return;
     }
     const tick = () => {
       const now4 = /* @__PURE__ */ new Date();
       const diff = targetDate.getTime() - now4.getTime();
       if (diff <= 0) {
+        setShowEndsInPrefix(false);
         setTime(finishedLabel);
         if (!hasFinishedRef.current && onFinished) {
           hasFinishedRef.current = true;
@@ -71449,6 +72206,7 @@ var LeaderboardCountdown = ({ targetDate, format: format10, finishedLabel = "Fin
         }
         return;
       }
+      setShowEndsInPrefix(true);
       if (format10 === "days") {
         const days = Math.floor(diff / (1e3 * 60 * 60 * 24));
         const hours = Math.floor(diff % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60));
@@ -71465,7 +72223,10 @@ var LeaderboardCountdown = ({ targetDate, format: format10, finishedLabel = "Fin
     const interval = setInterval(tick, 1e3);
     return () => clearInterval(interval);
   }, [targetDate, format10, finishedLabel, placeholder, onFinished]);
-  return /* @__PURE__ */ jsx(Fragment, { children: time2 });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    showEndsInPrefix && /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-gray-400 uppercase tracking-wider", children: "Ends in" }),
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-gray-900 tabular-nums tracking-tight font-mono", children: time2 })
+  ] });
 };
 var LinesLeaderboard = ({
   lines,
@@ -71488,18 +72249,18 @@ var LinesLeaderboard = ({
   isHistoricalDaily
 }) => {
   const formatEfficiency = (value) => typeof value === "number" && Number.isFinite(value) ? `${value.toFixed(1)}%` : "--";
-  const assignedLineIdSet = React147__default.useMemo(
+  const assignedLineIdSet = React148__default.useMemo(
     () => new Set(assignedLineIds || []),
     [assignedLineIds]
   );
-  const canClickLine = React147__default.useCallback(
+  const canClickLine = React148__default.useCallback(
     (lineId) => {
       if (!assignedLineIds) return true;
       return assignedLineIdSet.has(lineId);
     },
     [assignedLineIds, assignedLineIdSet]
   );
-  const handleTimeRangeChange = React147__default.useCallback((newRange) => {
+  const handleTimeRangeChange = React148__default.useCallback((newRange) => {
     if (newRange === timeRange) return;
     trackCoreEvent("Leaderboard Time Range Changed", {
       from_range: timeRange,
@@ -71510,11 +72271,11 @@ var LinesLeaderboard = ({
     });
     setTimeRange(newRange);
   }, [timeRange, lines.length, monthlyEfficiencyByLineId, setTimeRange]);
-  const canClickLeaderboardRow = React147__default.useCallback(
+  const canClickLeaderboardRow = React148__default.useCallback(
     (item) => item.rowType === "line" && !!item.line && canClickLine(item.line.id),
     [canClickLine]
   );
-  const handleLeaderboardLineClick = React147__default.useCallback((item, clickSource) => {
+  const handleLeaderboardLineClick = React148__default.useCallback((item, clickSource) => {
     if (!canClickLeaderboardRow(item) || !item.line) return;
     trackCoreEvent("Leaderboard Line Clicked", {
       line_id: item.line.id,
@@ -71528,8 +72289,8 @@ var LinesLeaderboard = ({
     });
     onLineClick(item.line);
   }, [canClickLeaderboardRow, onLineClick, timeRange]);
-  const viewLoadedTrackedRef = React147__default.useRef(null);
-  const leaderboardData = React147__default.useMemo(() => {
+  const viewLoadedTrackedRef = React148__default.useRef(null);
+  const leaderboardData = React148__default.useMemo(() => {
     const loading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
     const efficiencyMap = timeRange === "today" ? todayEfficiencyByLineId : monthlyEfficiencyByLineId;
     const fallbackEfficiencyMap = timeRange === "today" ? dailyFallbackEfficiencyByLineId : void 0;
@@ -71573,7 +72334,7 @@ var LinesLeaderboard = ({
     isLoadingToday,
     isLoadingMonthly
   ]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const isLoading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
     const trackingKey = `${timeRange}-${leaderboardData.length}`;
     if (leaderboardData.length > 0 && !isLoading && viewLoadedTrackedRef.current !== trackingKey) {
@@ -71597,9 +72358,9 @@ var LinesLeaderboard = ({
   const topThree = leaderboardData.slice(0, 3);
   const countdownTarget = timeRange === "monthly" ? monthEndDate : shiftEndDate;
   const countdownFormat = timeRange === "monthly" ? "days" : "clock";
-  const countdownFinishedLabel = timeRange === "monthly" ? "Finished" : "Shift Ended";
+  const countdownFinishedLabel = timeRange === "monthly" ? "Finished" : "Shift ended";
   const showCountdown = timeRange === "monthly" || !isHistoricalDaily;
-  const handleCountdownFinished = React147__default.useCallback(() => {
+  const handleCountdownFinished = React148__default.useCallback(() => {
     trackCoreEvent("Leaderboard Countdown Finished", {
       countdown_type: timeRange === "monthly" ? "month_end" : "shift_end",
       time_range: timeRange,
@@ -71626,7 +72387,7 @@ var LinesLeaderboard = ({
         return "bg-white border-gray-100";
     }
   };
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const style = document.createElement("style");
     style.innerHTML = `
       @keyframes float {
@@ -71674,19 +72435,16 @@ var LinesLeaderboard = ({
         ] }),
         /* @__PURE__ */ jsx("div", { className: "md:absolute md:right-0 md:top-1/2 md:-translate-y-1/2 flex flex-wrap items-center justify-center md:justify-end gap-2", children: showCountdown && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 px-4 py-2 bg-white rounded-full shadow-sm border border-gray-100", children: [
           /* @__PURE__ */ jsx(Clock, { className: "w-4 h-4 text-orange-500" }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-gray-400 uppercase tracking-wider", children: "Ends in" }),
-            /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-gray-900 tabular-nums tracking-tight font-mono", children: /* @__PURE__ */ jsx(
-              LeaderboardCountdown,
-              {
-                targetDate: countdownTarget,
-                format: countdownFormat,
-                finishedLabel: countdownFinishedLabel,
-                placeholder: timeRange === "monthly" ? "--" : "--:--:--",
-                onFinished: handleCountdownFinished
-              }
-            ) })
-          ] })
+          /* @__PURE__ */ jsx("div", { className: "flex items-baseline gap-2", children: /* @__PURE__ */ jsx(
+            LeaderboardCountdown,
+            {
+              targetDate: countdownTarget,
+              format: countdownFormat,
+              finishedLabel: countdownFinishedLabel,
+              placeholder: timeRange === "monthly" ? "--" : "--:--:--",
+              onFinished: handleCountdownFinished
+            }
+          ) })
         ] }) })
       ] }),
       /* @__PURE__ */ jsx("div", { className: "flex-1 hidden sm:flex justify-center items-end gap-2 md:gap-4 lg:gap-6 xl:gap-10 pb-4 pt-4 min-h-0", children: podiumOrder.map((item, index) => {
@@ -72128,36 +72886,36 @@ var KPIsOverviewView = ({
   const configuredTimezone = dbTimezone || dateTimeConfig.defaultTimezone || "UTC";
   const { startDate: monthStartDate, endDate: monthEndDateKey, monthEndDate } = getMonthDateInfo(configuredTimezone);
   const isSuperAdmin = user?.scope_mode === "SUPER_ADMIN" || !!user?.access_scope?.is_super_admin;
-  const scopedLineIds = React147__default.useMemo(
+  const scopedLineIds = React148__default.useMemo(
     () => Array.isArray(user?.access_scope?.line_ids) ? user.access_scope.line_ids.filter((lineId) => typeof lineId === "string" && lineId.length > 0) : [],
     [user?.access_scope?.line_ids]
   );
   const hasCanonicalScope = !!user?.scope_mode || !!user?.access_scope;
   const scopeRole = (user?.role_level || user?.role || "").toLowerCase();
   const isStrictLineScopedRole = scopeRole === "supervisor" || isFactoryScopedRole(scopeRole);
-  const resolvedAssignedLineIds = React147__default.useMemo(() => {
+  const resolvedAssignedLineIds = React148__default.useMemo(() => {
     if (isSuperAdmin) return [];
     if (scopedLineIds.length > 0) return scopedLineIds;
     if (lineIds && lineIds.length > 0) return lineIds;
     if (isStrictLineScopedRole && hasCanonicalScope) return [];
     return [];
   }, [isSuperAdmin, scopedLineIds, lineIds, isStrictLineScopedRole, hasCanonicalScope]);
-  const assignedLineIdSet = React147__default.useMemo(
+  const assignedLineIdSet = React148__default.useMemo(
     () => new Set(resolvedAssignedLineIds),
     [resolvedAssignedLineIds]
   );
-  const loadedLineIds = React147__default.useMemo(
+  const loadedLineIds = React148__default.useMemo(
     () => lines.map((line) => line.id).filter(Boolean),
     [lines]
   );
-  const metricsLineIds = React147__default.useMemo(() => {
+  const metricsLineIds = React148__default.useMemo(() => {
     if (isSuperAdmin) {
       return loadedLineIds.length > 0 ? loadedLineIds : lineIds ?? [];
     }
     return resolvedAssignedLineIds;
   }, [isSuperAdmin, loadedLineIds, lineIds, resolvedAssignedLineIds]);
   const assignedLineIdsForLeaderboard = isSuperAdmin ? void 0 : resolvedAssignedLineIds;
-  const leaderboardLinesForView = React147__default.useMemo(() => {
+  const leaderboardLinesForView = React148__default.useMemo(() => {
     const targetMode = viewType === "machine" ? "uptime" : "output";
     const metadataByLineId = new Map(lines.map((line) => [line.id, line]));
     return leaderboardLines.map((line) => {
@@ -72176,17 +72934,17 @@ var KPIsOverviewView = ({
       } : line;
     }).filter((line) => (line.monitoring_mode ?? "output") === targetMode);
   }, [leaderboardLines, lines, viewType]);
-  const linesForView = React147__default.useMemo(() => {
+  const linesForView = React148__default.useMemo(() => {
     const targetMode = viewType === "machine" ? "uptime" : "output";
     return lines.filter((line) => (line.monitoring_mode ?? "output") === targetMode);
   }, [lines, viewType]);
-  const relevantLinesForMode = React147__default.useMemo(() => {
+  const relevantLinesForMode = React148__default.useMemo(() => {
     if (activeTab === "leaderboard") {
       return leaderboardLines.length > 0 ? leaderboardLines : lines;
     }
     return lines;
   }, [activeTab, leaderboardLines, lines]);
-  const { hasUptime, hasOutput } = React147__default.useMemo(() => {
+  const { hasUptime, hasOutput } = React148__default.useMemo(() => {
     let uptime = false;
     let output = false;
     for (const line of relevantLinesForMode) {
@@ -72211,14 +72969,14 @@ var KPIsOverviewView = ({
   const currentShiftDetails = getCurrentShift(configuredTimezone, shiftConfig);
   const currentShiftDate = currentShiftDetails.date;
   const currentShiftId = currentShiftDetails.shiftId;
-  const activeFiltersCount = React147__default.useMemo(() => {
+  const activeFiltersCount = React148__default.useMemo(() => {
     let count = 0;
     if (leaderboardDailyScopeMode === "historical" && selectedLeaderboardShiftId !== currentShiftId) {
       count++;
     }
     return count;
   }, [leaderboardDailyScopeMode, selectedLeaderboardShiftId, currentShiftId]);
-  const clearFilters = React147__default.useCallback(() => {
+  const clearFilters = React148__default.useCallback(() => {
     setSelectedLeaderboardShiftId(currentShiftId);
     setSelectedLeaderboardDate(currentShiftDate);
     setLeaderboardDailyScopeMode("live");
@@ -72234,11 +72992,11 @@ var KPIsOverviewView = ({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  const shiftEndDate = React147__default.useMemo(
+  const shiftEndDate = React148__default.useMemo(
     () => getShiftEndDate(currentShiftDetails, configuredTimezone),
     [currentShiftDetails, configuredTimezone]
   );
-  const leaderboardShiftOptions = React147__default.useMemo(() => {
+  const leaderboardShiftOptions = React148__default.useMemo(() => {
     if (shiftConfig?.shifts && shiftConfig.shifts.length > 0) {
       return shiftConfig.shifts.map((shift) => ({
         id: shift.shiftId,
@@ -72255,34 +73013,34 @@ var KPIsOverviewView = ({
   const effectiveLeaderboardDate = selectedLeaderboardDate || currentShiftDate;
   const effectiveLeaderboardShiftId = Number.isFinite(selectedLeaderboardShiftId) ? selectedLeaderboardShiftId : currentShiftId;
   const isHistoricalLeaderboardDaily = activeTab === "leaderboard" && timeRange === "today" && leaderboardDailyScopeMode === "historical" && (effectiveLeaderboardDate !== currentShiftDate || effectiveLeaderboardShiftId !== currentShiftId);
-  const updateLeaderboardDate = React147__default.useCallback((dateKey) => {
+  const updateLeaderboardDate = React148__default.useCallback((dateKey) => {
     setSelectedLeaderboardDate(dateKey);
     setLeaderboardDailyScopeMode(
       dateKey === currentShiftDate && effectiveLeaderboardShiftId === currentShiftId ? "live" : "historical"
     );
   }, [currentShiftDate, currentShiftId, effectiveLeaderboardShiftId]);
-  const updateLeaderboardShiftId = React147__default.useCallback((shiftId) => {
+  const updateLeaderboardShiftId = React148__default.useCallback((shiftId) => {
     setSelectedLeaderboardShiftId(shiftId);
     setLeaderboardDailyScopeMode(
       effectiveLeaderboardDate === currentShiftDate && shiftId === currentShiftId ? "live" : "historical"
     );
   }, [currentShiftDate, currentShiftId, effectiveLeaderboardDate]);
-  const returnLeaderboardToLive = React147__default.useCallback(() => {
+  const returnLeaderboardToLive = React148__default.useCallback(() => {
     setSelectedLeaderboardDate(currentShiftDate);
     setSelectedLeaderboardShiftId(currentShiftId);
     setLeaderboardDailyScopeMode("live");
   }, [currentShiftDate, currentShiftId]);
   const selectedFactoryIdFromUrl = getSingleQueryValue(router.query[KPI_FACTORY_QUERY_PARAM]);
   const selectedFactoryAreaIdFromUrl = getSingleQueryValue(router.query[KPI_FACTORY_AREA_QUERY_PARAM]);
-  const kpiLineHierarchy = React147__default.useMemo(
+  const kpiLineHierarchy = React148__default.useMemo(
     () => buildKpiLineHierarchy(linesForView),
     [linesForView]
   );
-  const selectedFactoryNode = React147__default.useMemo(
+  const selectedFactoryNode = React148__default.useMemo(
     () => kpiLineHierarchy.showFactoryLevel && selectedFactoryIdFromUrl ? kpiLineHierarchy.factories.find((factory) => factory.id === selectedFactoryIdFromUrl) : void 0,
     [kpiLineHierarchy, selectedFactoryIdFromUrl]
   );
-  const selectedFactoryAreaNode = React147__default.useMemo(
+  const selectedFactoryAreaNode = React148__default.useMemo(
     () => selectedFactoryNode && selectedFactoryAreaIdFromUrl ? selectedFactoryNode.areas.find((area) => area.id === selectedFactoryAreaIdFromUrl) : void 0,
     [selectedFactoryNode, selectedFactoryAreaIdFromUrl]
   );
@@ -72371,15 +73129,15 @@ var KPIsOverviewView = ({
     lineId: factoryViewId,
     userAccessibleLineIds: metricsLineIds
   });
-  const defaultKPIs = React147__default.useMemo(() => createDefaultKPIs(), []);
-  const lineModeById = React147__default.useMemo(() => {
+  const defaultKPIs = React148__default.useMemo(() => createDefaultKPIs(), []);
+  const lineModeById = React148__default.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     linesForView.forEach((line) => {
       map.set(line.id, line.monitoring_mode ?? "output");
     });
     return map;
   }, [linesForView]);
-  const lineMetricRowsByLineId = React147__default.useMemo(() => {
+  const lineMetricRowsByLineId = React148__default.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     lineMetrics.forEach((row) => {
       if (!row?.line_id) return;
@@ -72391,7 +73149,7 @@ var KPIsOverviewView = ({
     });
     return map;
   }, [lineMetrics, lineModeById]);
-  const liveDailyFallbackEfficiencyByLineId = React147__default.useMemo(() => {
+  const liveDailyFallbackEfficiencyByLineId = React148__default.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     lineMetricRowsByLineId.forEach((row, lineId) => {
       const value = Number(row?.avg_efficiency);
@@ -72413,31 +73171,31 @@ var KPIsOverviewView = ({
     isHistoricalLeaderboardDaily,
     lineMetricRowsByLineId
   ]);
-  const dailyFallbackEfficiencyByLineId = React147__default.useMemo(() => {
+  const dailyFallbackEfficiencyByLineId = React148__default.useMemo(() => {
     const map = new Map(liveDailyFallbackEfficiencyByLineId);
     scopedDailyFallbackEfficiencyByLineId.forEach((value, lineId) => {
       map.set(lineId, value);
     });
     return map;
   }, [liveDailyFallbackEfficiencyByLineId, scopedDailyFallbackEfficiencyByLineId]);
-  const kpisByLineId = React147__default.useMemo(() => {
+  const kpisByLineId = React148__default.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     lineMetricRowsByLineId.forEach((row, lineId) => {
       map.set(lineId, buildKPIsFromLineMetricsRow(row));
     });
     return map;
   }, [lineMetricRowsByLineId]);
-  const getLineCardKpis = React147__default.useCallback((line) => {
+  const getLineCardKpis = React148__default.useCallback((line) => {
     if (metricsError) return null;
     return kpisByLineId.get(line.id) ?? (metricsLoading ? null : defaultKPIs);
   }, [defaultKPIs, kpisByLineId, metricsError, metricsLoading]);
-  const getAggregateCardKpis = React147__default.useCallback((cardLines) => {
+  const getAggregateCardKpis = React148__default.useCallback((cardLines) => {
     if (metricsError) return null;
     const rows = cardLines.map((line) => lineMetricRowsByLineId.get(line.id)).filter(Boolean);
     if (metricsLoading && rows.length === 0) return null;
     return aggregateKPIsFromLineMetricsRows(rows);
   }, [lineMetricRowsByLineId, metricsError, metricsLoading]);
-  const supervisorLineIds = React147__default.useMemo(
+  const supervisorLineIds = React148__default.useMemo(
     () => (leaderboardLines.length > 0 ? leaderboardLines : lines).map((l) => l.id),
     [leaderboardLines, lines]
   );
@@ -72689,7 +73447,7 @@ var KPIsOverviewView = ({
       { shallow: true }
     );
   }, [router]);
-  const lineDetailReturnTo = React147__default.useMemo(() => {
+  const lineDetailReturnTo = React148__default.useMemo(() => {
     if (activeTab !== "today" || !selectedFactoryNode) return void 0;
     return createKpisOverviewUrl({
       factoryId: selectedFactoryNode.id,
@@ -73489,7 +74247,7 @@ var LeaderboardDetailView = memo$1(({
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
   const [isMobile, setIsMobile] = useState(false);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const checkMobile = () => setIsMobile(window.innerWidth < 640);
     checkMobile();
     window.addEventListener("resize", checkMobile);
@@ -77539,7 +78297,7 @@ var ShiftsView = ({
     ] })
   ] });
 };
-var AuthenticatedShiftsView = withAuth(React147__default.memo(ShiftsView));
+var AuthenticatedShiftsView = withAuth(React148__default.memo(ShiftsView));
 var ShiftsView_default = ShiftsView;
 
 // src/views/TargetsView.utils.ts
@@ -79406,7 +80164,7 @@ var TargetsView = ({
 };
 var TargetsViewWithDisplayNames = withAllWorkspaceDisplayNames(TargetsView);
 var TargetsView_default = TargetsViewWithDisplayNames;
-var AuthenticatedTargetsView = withAuth(React147__default.memo(TargetsViewWithDisplayNames));
+var AuthenticatedTargetsView = withAuth(React148__default.memo(TargetsViewWithDisplayNames));
 function useTimezone(options = {}) {
   const dashboardConfig = useDashboardConfig();
   const workspaceConfig = useWorkspaceConfig();
@@ -79554,7 +80312,7 @@ var formatWholeNumber = (value) => {
   if (typeof value !== "number" || !Number.isFinite(value)) return null;
   return Math.round(value).toLocaleString();
 };
-var formatSeconds = (value) => {
+var formatSeconds2 = (value) => {
   if (typeof value !== "number" || !Number.isFinite(value)) return null;
   return `${value.toFixed(1)}s`;
 };
@@ -79571,13 +80329,13 @@ var WorkspaceHourSummaryPanel = ({
 }) => {
   const { data, isLoading, error, summarize, reset } = useWorkspaceHourSummary();
   const selectedKey = selectedHour ? `${selectedHour.source}:${selectedHour.hourIndex}:${date}:${shiftId}` : "none";
-  const autoSummaryKeyRef = React147__default.useRef(null);
-  React147__default.useEffect(() => {
+  const autoSummaryKeyRef = React148__default.useRef(null);
+  React148__default.useEffect(() => {
     reset();
     autoSummaryKeyRef.current = null;
   }, [reset, selectedKey]);
   const canSummarize = Boolean(workspaceId && companyId && date && shiftId !== null && shiftId !== void 0);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!selectedHour || !canSummarize || !companyId || !date || shiftId === null || shiftId === void 0) {
       return;
     }
@@ -79606,8 +80364,8 @@ var WorkspaceHourSummaryPanel = ({
   const formattedTimeRange = formatTimeRangeTo12Hour(verifiedTimeRange);
   const selectedMetric = selectedHour.source === "cycle" ? {
     label: "Cycle time",
-    actual: formatSeconds(selectedHour.cycleTime),
-    standard: formatSeconds(selectedHour.idealCycleTime)
+    actual: formatSeconds2(selectedHour.cycleTime),
+    standard: formatSeconds2(selectedHour.idealCycleTime)
   } : {
     label: "Hourly output",
     actual: formatWholeNumber(selectedHour.output),
@@ -79783,6 +80541,7 @@ var WorkspaceDetailView = ({
   const { legend: efficiencyLegend } = useEfficiencyLegend();
   const prewarmedClipsRef = useRef(/* @__PURE__ */ new Set());
   const prewarmInFlightRef = useRef(/* @__PURE__ */ new Set());
+  const [lowMomentsPrefetch, setLowMomentsPrefetch] = useState(null);
   const [aiSummaryHour, setAiSummaryHour] = useState(null);
   const buildHourlyOutputActionTrackingProps = useCallback((payload) => ({
     workspace_id: workspaceId,
@@ -80295,13 +81054,108 @@ var WorkspaceDetailView = ({
     }
     prewarmInFlightRef.current.add(cacheKey);
     const s3Service = videoPrefetchManager.getS3Service(dashboardConfig);
-    s3Service.getClipsInit(workspaceId, resolvedDate, resolvedShiftId, totalOutput).then(() => {
-      prewarmedClipsRef.current.add(cacheKey);
-    }).catch((error2) => {
-      console.warn("[WorkspaceDetailView] Clips init prewarm failed:", error2);
-    }).finally(() => {
-      prewarmInFlightRef.current.delete(cacheKey);
-    });
+    const controller = new AbortController();
+    let cancelled = false;
+    const prefetchLowMoments = async () => {
+      try {
+        const initData = await s3Service.getClipsInit(workspaceId, resolvedDate, resolvedShiftId, totalOutput);
+        const lowMomentsCount = Number(initData?.counts?.recent_flow_red_streak || 0);
+        const lowMomentsKey = [
+          "recent_flow_red_streak",
+          resolvedDate,
+          resolvedShiftId,
+          initData?.snapshotDateTime ?? "nosnap",
+          initData?.snapshotClipId ?? "nosnap",
+          "red_flow_output_shortfall_desc"
+        ].join("-");
+        if (cancelled) {
+          return;
+        }
+        const initFirstVideo = initData?.firstClips?.recent_flow_red_streak ?? null;
+        if (lowMomentsCount <= 0) {
+          setLowMomentsPrefetch((prev) => prev?.key === lowMomentsKey ? {
+            key: lowMomentsKey,
+            metadata: [],
+            firstVideo: null,
+            total: 0,
+            loading: false,
+            error: null
+          } : prev);
+          prewarmedClipsRef.current.add(cacheKey);
+          return;
+        }
+        setLowMomentsPrefetch((prev) => {
+          if (prev?.key === lowMomentsKey && !prev.loading && prev.metadata.length > 0) {
+            return prev;
+          }
+          return {
+            key: lowMomentsKey,
+            metadata: prev?.key === lowMomentsKey ? prev.metadata : [],
+            firstVideo: prev?.key === lowMomentsKey ? prev.firstVideo || initFirstVideo : initFirstVideo,
+            total: lowMomentsCount,
+            loading: true,
+            error: null
+          };
+        });
+        const metadataResponse = await fetchWithSupabaseAuth(supabase, "/api/clips/supabase", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify({
+            action: "clip-metadata",
+            workspaceId,
+            date: resolvedDate,
+            shift: resolvedShiftId,
+            category: "recent_flow_red_streak",
+            page: 1,
+            limit: 100,
+            knownTotal: lowMomentsCount,
+            snapshotDateTime: initData?.snapshotDateTime ?? null,
+            snapshotClipId: initData?.snapshotClipId ?? null,
+            sort: "red_flow_output_shortfall_desc"
+          }),
+          signal: controller.signal,
+          redirectReason: "session_expired"
+        });
+        if (!metadataResponse.ok) {
+          throw new Error(`Low moments metadata prefetch failed: ${metadataResponse.status}`);
+        }
+        const metadataData = await metadataResponse.json();
+        const metadata = Array.isArray(metadataData?.clips) ? metadataData.clips : [];
+        const firstClipId = metadata[0]?.clipId || metadata[0]?.id || null;
+        const firstVideo = initFirstVideo && (!firstClipId || initFirstVideo.id === firstClipId) ? initFirstVideo : firstClipId ? await s3Service.getClipById(firstClipId) : null;
+        if (cancelled) {
+          return;
+        }
+        setLowMomentsPrefetch({
+          key: lowMomentsKey,
+          metadata,
+          firstVideo,
+          total: typeof metadataData?.total === "number" ? metadataData.total : lowMomentsCount,
+          loading: false,
+          error: null
+        });
+        prewarmedClipsRef.current.add(cacheKey);
+      } catch (error2) {
+        if (error2.name === "AbortError") {
+          return;
+        }
+        console.warn("[WorkspaceDetailView] Clips init prewarm failed:", error2);
+        setLowMomentsPrefetch((prev) => prev ? {
+          ...prev,
+          loading: false,
+          error: error2 instanceof Error ? error2.message : "Low moments prefetch failed"
+        } : prev);
+      } finally {
+        prewarmInFlightRef.current.delete(cacheKey);
+      }
+    };
+    void prefetchLowMoments();
+    return () => {
+      cancelled = true;
+      controller.abort();
+    };
   }, [
     isClipsEnabled,
     dashboardConfig,
@@ -80311,7 +81165,8 @@ var WorkspaceDetailView = ({
     isShiftConfigLoading,
     shiftConfig,
     timezone,
-    workspace
+    workspace,
+    supabase
   ]);
   const { supervisorName, supervisors } = useLineSupervisor(workspace?.line_id || lineId);
   useEffect(() => {
@@ -81530,6 +82385,7 @@ var WorkspaceDetailView = ({
                 totalOutput: workspace?.total_actions,
                 workspaceMetrics: detailedWorkspaceMetrics || void 0,
                 prefetchedPercentileCounts: isFastSlowClipFiltersEnabled ? prefetchedPercentileCounts : null,
+                lowMomentsPrefetch,
                 initialTimeFilter: pendingClipHourFilter,
                 className: "h-[calc(100vh-10rem)]"
               }
@@ -83168,7 +84024,7 @@ function BottleneckClipsView({
     ) })
   ] }) });
 }
-var AuthenticatedBottleneckClipsView = withAuth(React147__default.memo(BottleneckClipsView));
+var AuthenticatedBottleneckClipsView = withAuth(React148__default.memo(BottleneckClipsView));
 var BottleneckClipsView_default = BottleneckClipsView;
 
 // src/lib/services/ticketService.ts
@@ -84011,7 +84867,7 @@ Please ensure:
     )
   ] });
 }
-var AuthenticatedTicketsView = withAuth(React147__default.memo(TicketsView));
+var AuthenticatedTicketsView = withAuth(React148__default.memo(TicketsView));
 var TicketsView_default = TicketsView;
 
 // src/lib/utils/improvementDisplay.ts
@@ -84982,7 +85838,7 @@ var ImprovementCenterView = () => {
       setSelectedMemberId("all");
     }
   }, [memberOptions, selectedMemberId]);
-  const getRecommendationDisplayMetadata = React147__default.useCallback((rec) => {
+  const getRecommendationDisplayMetadata = React148__default.useCallback((rec) => {
     const supervisors = rec.line_id ? supervisorsByLineId.get(rec.line_id) || [] : [];
     return getImprovementDisplayMetadata({
       location: rec.location,
@@ -85456,7 +86312,7 @@ var ThreadSidebar = ({
     ] }) })
   ] });
 };
-var ProfilePicture = React147__default.memo(({
+var ProfilePicture = React148__default.memo(({
   alt = "Axel",
   className = "",
   size = "md",
@@ -88016,7 +88872,7 @@ var OverviewImprovementsSkeleton = () => /* @__PURE__ */ jsx("div", { className:
   ] }),
   /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end flex-shrink-0 ml-4", children: /* @__PURE__ */ jsx(SectionPulse, { className: "h-6 w-20 rounded-full" }) })
 ] }, index)) });
-var OperationsOverviewHeader = React147__default.memo(({
+var OperationsOverviewHeader = React148__default.memo(({
   dateRange,
   displayDateRange,
   trendMode,
@@ -88037,65 +88893,65 @@ var OperationsOverviewHeader = React147__default.memo(({
   bumpRenderCounter();
   const subtitleRange = displayDateRange || dateRange;
   const showLiveShiftMeta = isLiveScope && trendMode !== "all";
-  const liveShiftLabel = React147__default.useMemo(
+  const liveShiftLabel = React148__default.useMemo(
     () => normalizeShiftLabel(liveShiftName, trendMode),
     [liveShiftName, trendMode]
   );
-  const liveShiftIcon = React147__default.useMemo(
+  const liveShiftIcon = React148__default.useMemo(
     () => getShiftIcon(liveShiftName, trendMode),
     [liveShiftName, trendMode]
   );
-  const [isFilterOpen, setIsFilterOpen] = React147__default.useState(false);
-  const [isLinesDropdownOpen, setIsLinesDropdownOpen] = React147__default.useState(false);
-  const filterRef = React147__default.useRef(null);
-  const filterButtonRef = React147__default.useRef(null);
-  const mobileFilterButtonRef = React147__default.useRef(null);
-  const linesDropdownRef = React147__default.useRef(null);
-  const mobileSubtitle = React147__default.useMemo(() => {
+  const [isFilterOpen, setIsFilterOpen] = React148__default.useState(false);
+  const [isLinesDropdownOpen, setIsLinesDropdownOpen] = React148__default.useState(false);
+  const filterRef = React148__default.useRef(null);
+  const filterButtonRef = React148__default.useRef(null);
+  const mobileFilterButtonRef = React148__default.useRef(null);
+  const linesDropdownRef = React148__default.useRef(null);
+  const mobileSubtitle = React148__default.useMemo(() => {
     if (subtitleRange.startKey === subtitleRange.endKey) {
       return format(parseDateKeyToDate(subtitleRange.startKey), "do MMM, yyyy");
     }
     return `${format(parseDateKeyToDate(subtitleRange.startKey), "do MMM")} - ${format(parseDateKeyToDate(subtitleRange.endKey), "do MMM, yyyy")}`;
   }, [subtitleRange.endKey, subtitleRange.startKey]);
-  const desktopSubtitle = React147__default.useMemo(() => {
+  const desktopSubtitle = React148__default.useMemo(() => {
     if (subtitleRange.startKey === subtitleRange.endKey) {
       return format(parseDateKeyToDate(subtitleRange.startKey), "do MMMM, yyyy");
     }
     return `${format(parseDateKeyToDate(subtitleRange.startKey), "do MMMM, yyyy")} - ${format(parseDateKeyToDate(subtitleRange.endKey), "do MMMM, yyyy")}`;
   }, [subtitleRange.endKey, subtitleRange.startKey]);
-  const availableLineIds = React147__default.useMemo(
+  const availableLineIds = React148__default.useMemo(
     () => lineOptions.map((line) => line.id),
     [lineOptions]
   );
-  const selectedLineIdSet = React147__default.useMemo(
+  const selectedLineIdSet = React148__default.useMemo(
     () => new Set(selectedLineIds),
     [selectedLineIds]
   );
-  const isAllLinesSelected = React147__default.useMemo(() => {
+  const isAllLinesSelected = React148__default.useMemo(() => {
     if (availableLineIds.length === 0) return true;
     return availableLineIds.every((lineId) => selectedLineIdSet.has(lineId));
   }, [availableLineIds, selectedLineIdSet]);
-  const activeFilterCount = React147__default.useMemo(() => {
+  const activeFilterCount = React148__default.useMemo(() => {
     let count = 0;
     if (trendMode !== "all") count += 1;
     if (selectedSupervisorId !== "all") count += 1;
     if (!isAllLinesSelected) count += 1;
     return count;
   }, [isAllLinesSelected, selectedSupervisorId, trendMode]);
-  const handleFilterToggle = React147__default.useCallback(() => {
+  const handleFilterToggle = React148__default.useCallback(() => {
     trackCoreEvent("Operations Overview Filter Toggled", {
       action: !isFilterOpen ? "open" : "close"
     });
     setIsFilterOpen((previous) => !previous);
   }, [isFilterOpen]);
-  const handleTrendModeChange = React147__default.useCallback((event) => {
+  const handleTrendModeChange = React148__default.useCallback((event) => {
     const nextMode = event.target.value;
     trackCoreEvent("Operations Overview Shift Filter Changed", {
       shift_mode: nextMode
     });
     onTrendModeChange(nextMode);
   }, [onTrendModeChange]);
-  const handleAllLinesToggle = React147__default.useCallback(() => {
+  const handleAllLinesToggle = React148__default.useCallback(() => {
     trackCoreEvent("Operations Overview Line Filter Changed", {
       selected_line_ids: availableLineIds,
       selected_line_count: availableLineIds.length,
@@ -88103,7 +88959,7 @@ var OperationsOverviewHeader = React147__default.memo(({
     });
     onSelectedLineIdsChange(availableLineIds);
   }, [availableLineIds, onSelectedLineIdsChange]);
-  const handleSupervisorChange = React147__default.useCallback((event) => {
+  const handleSupervisorChange = React148__default.useCallback((event) => {
     const supervisorId = event.target.value;
     const selectedSupervisor = supervisorOptions.find((option) => option.id === supervisorId);
     trackCoreEvent("Operations Overview Supervisor Filter Changed", {
@@ -88114,7 +88970,7 @@ var OperationsOverviewHeader = React147__default.memo(({
     });
     onSelectedSupervisorIdChange(supervisorId);
   }, [availableLineIds, onSelectedSupervisorIdChange, supervisorOptions]);
-  const handleLineToggle = React147__default.useCallback((lineId) => {
+  const handleLineToggle = React148__default.useCallback((lineId) => {
     const current = new Set(selectedLineIds);
     if (current.has(lineId)) {
       if (current.size <= 1) return;
@@ -88130,13 +88986,13 @@ var OperationsOverviewHeader = React147__default.memo(({
     });
     onSelectedLineIdsChange(next);
   }, [availableLineIds, onSelectedLineIdsChange, selectedLineIds]);
-  const handleClearAllFilters = React147__default.useCallback(() => {
+  const handleClearAllFilters = React148__default.useCallback(() => {
     onTrendModeChange("all");
     onSelectedSupervisorIdChange("all");
     onSelectedLineIdsChange(availableLineIds);
     setIsFilterOpen(false);
   }, [availableLineIds, onSelectedLineIdsChange, onSelectedSupervisorIdChange, onTrendModeChange]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const handleClickOutside = (event) => {
       const target = event.target;
       if (filterRef.current && !filterRef.current.contains(target) && filterButtonRef.current && !filterButtonRef.current.contains(target) && mobileFilterButtonRef.current && !mobileFilterButtonRef.current.contains(target)) {
@@ -88371,12 +89227,12 @@ var OperationsOverviewHeader = React147__default.memo(({
   ] }) });
 });
 OperationsOverviewHeader.displayName = "OperationsOverviewHeader";
-var OverviewSummaryCards = React147__default.memo(({ store }) => {
+var OverviewSummaryCards = React148__default.memo(({ store }) => {
   bumpRenderCounter();
   const scope = useOperationsOverviewScope(store);
   const snapshot = useOperationsOverviewSnapshot(store);
   const showSnapshotSkeleton = snapshot.loading && !snapshot.hasLoadedOnce;
-  const comparisonLabel = React147__default.useMemo(() => {
+  const comparisonLabel = React148__default.useMemo(() => {
     return formatComparisonWindow({
       currentDayCount: scope.current_range?.day_count ?? null,
       previousDayCount: scope.previous_range?.day_count ?? null,
@@ -88389,27 +89245,27 @@ var OverviewSummaryCards = React147__default.memo(({ store }) => {
     scope.previous_range?.day_count,
     scope.shift_mode
   ]);
-  const [isIdleContributorsOpen, setIsIdleContributorsOpen] = React147__default.useState(false);
-  const [isIdleContributorsPinned, setIsIdleContributorsPinned] = React147__default.useState(false);
-  const idleContributorsRef = React147__default.useRef(null);
-  const plantEfficiencyBadge = React147__default.useMemo(() => {
+  const [isIdleContributorsOpen, setIsIdleContributorsOpen] = React148__default.useState(false);
+  const [isIdleContributorsPinned, setIsIdleContributorsPinned] = React148__default.useState(false);
+  const idleContributorsRef = React148__default.useRef(null);
+  const plantEfficiencyBadge = React148__default.useMemo(() => {
     return buildDeltaBadge(snapshot.data.summary.plant_efficiency?.delta_pp, {
       positiveIsGood: true,
       formatter: (value) => `${value >= 0 ? "+" : ""}${roundOne(value)}%`,
       comparisonLabel
     });
   }, [comparisonLabel, snapshot.data.summary.plant_efficiency?.delta_pp]);
-  const idleBadge = React147__default.useMemo(() => {
+  const idleBadge = React148__default.useMemo(() => {
     return buildDeltaBadge(snapshot.data.summary.avg_idle_per_workstation?.delta_seconds, {
       positiveIsGood: false,
       formatter: (value) => formatSignedIdleDuration(value),
       comparisonLabel
     });
   }, [comparisonLabel, snapshot.data.summary.avg_idle_per_workstation?.delta_seconds]);
-  const canInspectIdleContributors = React147__default.useMemo(() => {
+  const canInspectIdleContributors = React148__default.useMemo(() => {
     return !showSnapshotSkeleton && snapshot.data.summary.avg_idle_per_workstation?.current_seconds !== null && snapshot.data.summary.avg_idle_per_workstation?.current_seconds !== void 0;
   }, [showSnapshotSkeleton, snapshot.data.summary.avg_idle_per_workstation?.current_seconds]);
-  const idleTopContributors = React147__default.useMemo(() => {
+  const idleTopContributors = React148__default.useMemo(() => {
     return (snapshot.data.summary.avg_idle_per_workstation?.top_contributors || []).map((item) => ({
       workspaceId: item.workspace_id || "",
       workspaceName: item.workspace_name?.trim() || item.workspace_id || "Unknown",
@@ -88417,14 +89273,14 @@ var OverviewSummaryCards = React147__default.memo(({ store }) => {
       avgIdleSeconds: toNumber4(item.avg_idle_seconds)
     })).slice(0, 5);
   }, [snapshot.data.summary.avg_idle_per_workstation?.top_contributors]);
-  const showIdleContributorLineNames = React147__default.useMemo(() => {
+  const showIdleContributorLineNames = React148__default.useMemo(() => {
     return (scope.line_count ?? 0) > 1;
   }, [scope.line_count]);
-  const closeIdleContributors = React147__default.useCallback(() => {
+  const closeIdleContributors = React148__default.useCallback(() => {
     setIsIdleContributorsOpen(false);
     setIsIdleContributorsPinned(false);
   }, []);
-  const handleIdleContributorsToggle = React147__default.useCallback(() => {
+  const handleIdleContributorsToggle = React148__default.useCallback(() => {
     if (!canInspectIdleContributors) return;
     setIsIdleContributorsPinned((previous) => {
       const next = !previous;
@@ -88432,7 +89288,7 @@ var OverviewSummaryCards = React147__default.memo(({ store }) => {
       return next;
     });
   }, [canInspectIdleContributors]);
-  const handleIdleContributorsKeyDown = React147__default.useCallback((event) => {
+  const handleIdleContributorsKeyDown = React148__default.useCallback((event) => {
     if (!canInspectIdleContributors) return;
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
@@ -88444,11 +89300,11 @@ var OverviewSummaryCards = React147__default.memo(({ store }) => {
       closeIdleContributors();
     }
   }, [canInspectIdleContributors, closeIdleContributors, handleIdleContributorsToggle]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     setIsIdleContributorsOpen(false);
     setIsIdleContributorsPinned(false);
   }, [scope.comparison_strategy, scope.current_range?.start_date, scope.current_range?.end_date, scope.line_count, scope.shift_mode]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!isIdleContributorsOpen) return void 0;
     const handleClickOutside = (event) => {
       if (!isIdleContributorsPinned) return;
@@ -88586,7 +89442,7 @@ var OverviewSummaryCards = React147__default.memo(({ store }) => {
   ] });
 });
 OverviewSummaryCards.displayName = "OverviewSummaryCards";
-var PoorestPerformersCard = React147__default.memo(({
+var PoorestPerformersCard = React148__default.memo(({
   store,
   supervisorsByLineId,
   onViewAll,
@@ -88595,9 +89451,9 @@ var PoorestPerformersCard = React147__default.memo(({
   bumpRenderCounter();
   const scope = useOperationsOverviewScope(store);
   const snapshot = useOperationsOverviewSnapshot(store);
-  const [poorestLineMode, setPoorestLineMode] = React147__default.useState("output");
+  const [poorestLineMode, setPoorestLineMode] = React148__default.useState("output");
   const availableLineModes = scope.available_line_modes;
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     const hasOutput = !!availableLineModes?.has_output;
     const hasUptime = !!availableLineModes?.has_uptime;
     if (hasOutput && !hasUptime && poorestLineMode !== "output") {
@@ -88606,7 +89462,7 @@ var PoorestPerformersCard = React147__default.memo(({
       setPoorestLineMode("uptime");
     }
   }, [availableLineModes?.has_output, availableLineModes?.has_uptime, poorestLineMode]);
-  const comparisonLabel = React147__default.useMemo(() => {
+  const comparisonLabel = React148__default.useMemo(() => {
     return formatComparisonWindow({
       currentDayCount: scope.current_range?.day_count ?? null,
       previousDayCount: scope.previous_range?.day_count ?? null,
@@ -88620,7 +89476,7 @@ var PoorestPerformersCard = React147__default.memo(({
     scope.shift_mode
   ]);
   const showSnapshotSkeleton = snapshot.loading && !snapshot.hasLoadedOnce;
-  const mergedPoorestLines = React147__default.useMemo(() => {
+  const mergedPoorestLines = React148__default.useMemo(() => {
     const rows = snapshot.data.poorest_lines?.[poorestLineMode] || [];
     const lineRows = [];
     const areaGroups = /* @__PURE__ */ new Map();
@@ -88700,7 +89556,7 @@ var PoorestPerformersCard = React147__default.memo(({
   }, [poorestLineMode, snapshot.data.poorest_lines, supervisorsByLineId]);
   const showPoorestModeToggle = !!availableLineModes?.has_output && !!availableLineModes?.has_uptime;
   const poorestMetricLabel = poorestLineMode === "uptime" ? "Uptime" : "Efficiency";
-  const handlePoorestLineModeChange = React147__default.useCallback((mode) => {
+  const handlePoorestLineModeChange = React148__default.useCallback((mode) => {
     trackCoreEvent("Operations Overview Poorest Line Mode Changed", { mode });
     setPoorestLineMode(mode);
   }, []);
@@ -88786,14 +89642,14 @@ var PoorestPerformersCard = React147__default.memo(({
   ] });
 });
 PoorestPerformersCard.displayName = "PoorestPerformersCard";
-var IdleBreakdownCard = React147__default.memo(({
+var IdleBreakdownCard = React148__default.memo(({
   store,
   scopedLineCount
 }) => {
   bumpRenderCounter();
   const idle = useOperationsOverviewIdle(store);
   const showInitialSkeleton = idle.loading && idle.lastUpdated === null;
-  const idleBreakdown = React147__default.useMemo(() => {
+  const idleBreakdown = React148__default.useMemo(() => {
     return idle.data.map((item) => ({
       name: item.display_name?.trim() || item.reason?.trim() || "Unknown",
       reasonKey: item.reason_key?.trim() || item.reason?.trim() || "unknown",
@@ -88812,7 +89668,7 @@ var IdleBreakdownCard = React147__default.memo(({
       }))
     })).filter((item) => item.value > 0);
   }, [idle.data]);
-  const showIdleModuleNotEnabledState = React147__default.useMemo(() => {
+  const showIdleModuleNotEnabledState = React148__default.useMemo(() => {
     const enabledLineCount = idle.scope.idle_time_vlm_enabled_line_count;
     return !showInitialSkeleton && scopedLineCount > 0 && typeof enabledLineCount === "number" && enabledLineCount === 0;
   }, [idle.scope.idle_time_vlm_enabled_line_count, scopedLineCount, showInitialSkeleton]);
@@ -88833,7 +89689,7 @@ var IdleBreakdownCard = React147__default.memo(({
   ] });
 });
 IdleBreakdownCard.displayName = "IdleBreakdownCard";
-var EfficiencyTrendCard = React147__default.memo(({
+var EfficiencyTrendCard = React148__default.memo(({
   store,
   dateRange,
   appTimezone,
@@ -88841,14 +89697,14 @@ var EfficiencyTrendCard = React147__default.memo(({
 }) => {
   bumpRenderCounter();
   const trend = useOperationsOverviewTrend(store);
-  const currentWeekRange = React147__default.useMemo(
+  const currentWeekRange = React148__default.useMemo(
     () => getCurrentWeekToDateRange(appTimezone),
     [appTimezone]
   );
   const isCurrentWeekToDateRange = dateRange.startKey === currentWeekRange.startKey && dateRange.endKey === currentWeekRange.endKey;
   const showInitialSkeleton = trend.loading && trend.lastUpdated === null;
   const isHourlyTrend = trend.data.granularity === "hour";
-  const trendData = React147__default.useMemo(() => {
+  const trendData = React148__default.useMemo(() => {
     if (isHourlyTrend) {
       return (trend.data.points || []).map((point, index) => ({
         name: (() => {
@@ -88920,13 +89776,13 @@ var EfficiencyTrendCard = React147__default.memo(({
       };
     });
   }, [currentWeekRange.startKey, hourlyLabelStartTime, isCurrentWeekToDateRange, isHourlyTrend, trend.data.points]);
-  const trendTooltipLabelFormatter = React147__default.useCallback((label, payload) => {
+  const trendTooltipLabelFormatter = React148__default.useCallback((label, payload) => {
     if (isHourlyTrend) return label;
     const dayOfWeek = payload?.[0]?.payload?.dayOfWeek;
     if (!dayOfWeek || typeof label !== "string") return label;
     return `${label} (${dayOfWeek})`;
   }, [isHourlyTrend]);
-  const trendXAxisTickFormatter = React147__default.useCallback((value, index) => {
+  const trendXAxisTickFormatter = React148__default.useCallback((value, index) => {
     if (!isHourlyTrend) {
       return typeof value === "string" ? value : String(value ?? "");
     }
@@ -88953,7 +89809,7 @@ var EfficiencyTrendCard = React147__default.memo(({
   ] });
 });
 EfficiencyTrendCard.displayName = "EfficiencyTrendCard";
-var TopImprovementsCard = React147__default.memo(({
+var TopImprovementsCard = React148__default.memo(({
   store,
   supervisorsByLineId,
   onViewAll,
@@ -88962,7 +89818,7 @@ var TopImprovementsCard = React147__default.memo(({
   bumpRenderCounter();
   const improvements = useOperationsOverviewImprovements(store);
   const showInitialSkeleton = improvements.loading && improvements.lastUpdated === null;
-  const displayImprovements = React147__default.useMemo(() => {
+  const displayImprovements = React148__default.useMemo(() => {
     return improvements.data.map((item) => {
       const supervisors = item.lineId ? supervisorsByLineId.get(item.lineId) || [] : [];
       return {
@@ -89090,33 +89946,33 @@ var useOperationsOverviewRefresh = ({
   isLiveScope,
   enabled = true
 }) => {
-  const lineIdsKey = React147__default.useMemo(() => lineIds.join(","), [lineIds]);
-  const scopeSignature = React147__default.useMemo(
+  const lineIdsKey = React148__default.useMemo(() => lineIds.join(","), [lineIds]);
+  const scopeSignature = React148__default.useMemo(
     () => [companyId || "", startKey, endKey, trendMode, comparisonStrategy || "", lineIdsKey].join("::"),
     [companyId, comparisonStrategy, endKey, lineIdsKey, startKey, trendMode]
   );
-  const controllersRef = React147__default.useRef({});
-  const requestIdsRef = React147__default.useRef({
+  const controllersRef = React148__default.useRef({});
+  const requestIdsRef = React148__default.useRef({
     snapshot: 0,
     trend: 0,
     idle: 0,
     improvements: 0
   });
-  const intervalRef = React147__default.useRef(null);
-  const isPageActiveRef = React147__default.useRef(true);
-  const lastResumeRefreshAtRef = React147__default.useRef(0);
-  const abortAll = React147__default.useCallback(() => {
+  const intervalRef = React148__default.useRef(null);
+  const isPageActiveRef = React148__default.useRef(true);
+  const lastResumeRefreshAtRef = React148__default.useRef(0);
+  const abortAll = React148__default.useCallback(() => {
     Object.values(controllersRef.current).forEach((controller) => {
       controller?.abort();
     });
     controllersRef.current = {};
   }, []);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     return () => {
       abortAll();
     };
   }, [abortAll]);
-  const getIsPageActive = React147__default.useCallback(() => {
+  const getIsPageActive = React148__default.useCallback(() => {
     if (typeof document === "undefined") {
       return true;
     }
@@ -89124,7 +89980,7 @@ var useOperationsOverviewRefresh = ({
     const hasFocus = typeof document.hasFocus === "function" ? document.hasFocus() : true;
     return isVisible && hasFocus;
   }, []);
-  const stopPolling = React147__default.useCallback((reason) => {
+  const stopPolling = React148__default.useCallback((reason) => {
     if (intervalRef.current === null) {
       return;
     }
@@ -89132,7 +89988,7 @@ var useOperationsOverviewRefresh = ({
     intervalRef.current = null;
     debugRefreshLog("poll stopped", { reason });
   }, []);
-  const runRefresh = React147__default.useCallback(
+  const runRefresh = React148__default.useCallback(
     async (section, begin, onSuccess, onError, request, reason) => {
       if (!enabled || !supabase || !companyId || lineIds.length === 0) return;
       const requestId = requestIdsRef.current[section] + 1;
@@ -89179,7 +90035,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, comparisonStrategy, enabled, endKey, lineIds, startKey, supabase, trendMode]
   );
-  const refreshSnapshot = React147__default.useCallback(
+  const refreshSnapshot = React148__default.useCallback(
     async (reason) => {
       await runRefresh(
         "snapshot",
@@ -89211,7 +90067,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, comparisonStrategy, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshTrend = React147__default.useCallback(
+  const refreshTrend = React148__default.useCallback(
     async (reason) => {
       await runRefresh(
         "trend",
@@ -89240,7 +90096,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshIdle = React147__default.useCallback(
+  const refreshIdle = React148__default.useCallback(
     async (reason) => {
       await runRefresh(
         "idle",
@@ -89269,7 +90125,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshImprovements = React147__default.useCallback(
+  const refreshImprovements = React148__default.useCallback(
     async (reason) => {
       await runRefresh(
         "improvements",
@@ -89299,7 +90155,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, lineIds, lineIdsKey, runRefresh, scopeSignature, store, supabase]
   );
-  const refreshAll = React147__default.useCallback(
+  const refreshAll = React148__default.useCallback(
     async (reason) => {
       await Promise.allSettled([
         refreshSnapshot(reason),
@@ -89310,7 +90166,7 @@ var useOperationsOverviewRefresh = ({
     },
     [refreshIdle, refreshImprovements, refreshSnapshot, refreshTrend]
   );
-  const startPolling = React147__default.useCallback((reason) => {
+  const startPolling = React148__default.useCallback((reason) => {
     if (!isLiveScope || !supabase || !companyId || lineIds.length === 0) {
       return;
     }
@@ -89331,7 +90187,7 @@ var useOperationsOverviewRefresh = ({
     }, LIVE_REFRESH_INTERVAL_MS);
     debugRefreshLog("poll started", { reason, intervalMs: LIVE_REFRESH_INTERVAL_MS });
   }, [companyId, isLiveScope, lineIds.length, refreshAll, stopPolling, supabase]);
-  const refreshFromResume = React147__default.useCallback((reason) => {
+  const refreshFromResume = React148__default.useCallback((reason) => {
     const now4 = Date.now();
     if (now4 - lastResumeRefreshAtRef.current < 1e3) {
       debugRefreshLog("resume refresh suppressed", { reason });
@@ -89346,7 +90202,7 @@ var useOperationsOverviewRefresh = ({
       }
     });
   }, [refreshAll, startPolling, stopPolling]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!enabled) {
       stopPolling("disabled");
       abortAll();
@@ -89361,7 +90217,7 @@ var useOperationsOverviewRefresh = ({
     }
     void refreshAll("scope_change");
   }, [abortAll, companyId, enabled, lineIds.length, refreshAll, scopeSignature, stopPolling, store, supabase]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (!enabled || !isLiveScope || !supabase || !companyId || lineIds.length === 0) {
       isPageActiveRef.current = false;
       stopPolling("live_scope_disabled");
@@ -89574,55 +90430,55 @@ var PlantHeadView = () => {
   const { accessibleLineIds } = useUserLineAccess();
   const mobileMenuContext = useMobileMenu();
   useHideMobileHeader(!!mobileMenuContext);
-  const storeRef = React147__default.useRef(createOperationsOverviewStore());
+  const storeRef = React148__default.useRef(createOperationsOverviewStore());
   const store = storeRef.current;
-  const fallbackOperationalDate = React147__default.useMemo(
+  const fallbackOperationalDate = React148__default.useMemo(
     () => getOperationalDate(appTimezone),
     [appTimezone]
   );
-  const [dateRange, setDateRange] = React147__default.useState(() => ({
+  const [dateRange, setDateRange] = React148__default.useState(() => ({
     startKey: fallbackOperationalDate,
     endKey: fallbackOperationalDate
   }));
-  const [usesThisWeekComparison, setUsesThisWeekComparison] = React147__default.useState(false);
-  const [trendMode, setTrendMode] = React147__default.useState("all");
-  const [selectedSupervisorId, setSelectedSupervisorId] = React147__default.useState("all");
-  const [selectedLineIds, setSelectedLineIds] = React147__default.useState([]);
-  const [isInitialScopeReady, setIsInitialScopeReady] = React147__default.useState(false);
-  const [shiftResolutionTick, setShiftResolutionTick] = React147__default.useState(0);
-  const hasAutoInitializedScopeRef = React147__default.useRef(false);
-  const hasUserAdjustedScopeRef = React147__default.useRef(false);
-  React147__default.useEffect(() => {
+  const [usesThisWeekComparison, setUsesThisWeekComparison] = React148__default.useState(false);
+  const [trendMode, setTrendMode] = React148__default.useState("all");
+  const [selectedSupervisorId, setSelectedSupervisorId] = React148__default.useState("all");
+  const [selectedLineIds, setSelectedLineIds] = React148__default.useState([]);
+  const [isInitialScopeReady, setIsInitialScopeReady] = React148__default.useState(false);
+  const [shiftResolutionTick, setShiftResolutionTick] = React148__default.useState(0);
+  const hasAutoInitializedScopeRef = React148__default.useRef(false);
+  const hasUserAdjustedScopeRef = React148__default.useRef(false);
+  React148__default.useEffect(() => {
     trackCorePageView("Operations Overview", {
       dashboard_surface: "operations_overview"
     });
   }, []);
-  const currentWeekRange = React147__default.useMemo(
+  const currentWeekRange = React148__default.useMemo(
     () => getCurrentWeekToDateRange(appTimezone),
     [appTimezone]
   );
-  const currentWeekDisplayRange = React147__default.useMemo(
+  const currentWeekDisplayRange = React148__default.useMemo(
     () => getCurrentWeekFullRange(appTimezone),
     [appTimezone]
   );
   const isCurrentWeekToDateRange = dateRange.startKey === currentWeekRange.startKey && dateRange.endKey === currentWeekRange.endKey;
-  const headerDateRange = React147__default.useMemo(() => {
+  const headerDateRange = React148__default.useMemo(() => {
     if (usesThisWeekComparison && isCurrentWeekToDateRange) {
       return currentWeekDisplayRange;
     }
     return dateRange;
   }, [currentWeekDisplayRange, dateRange, isCurrentWeekToDateRange, usesThisWeekComparison]);
-  const normalizedLineIds = React147__default.useMemo(
+  const normalizedLineIds = React148__default.useMemo(
     () => Array.from(new Set(
       (accessibleLineIds || []).filter(Boolean).filter((lineId) => lineId !== factoryViewId)
     )).sort(),
     [accessibleLineIds, factoryViewId]
   );
-  const lineIdsKey = React147__default.useMemo(
+  const lineIdsKey = React148__default.useMemo(
     () => normalizedLineIds.join(","),
     [normalizedLineIds]
   );
-  const lineOptions = React147__default.useMemo(
+  const lineOptions = React148__default.useMemo(
     () => normalizedLineIds.map((lineId) => ({
       id: lineId,
       name: getLineDisplayName(entityConfig, lineId)
@@ -89634,7 +90490,7 @@ var PlantHeadView = () => {
     companyId: entityConfig.companyId,
     useBackend: true
   });
-  const supervisorOptions = React147__default.useMemo(
+  const supervisorOptions = React148__default.useMemo(
     () => {
       const optionsById = /* @__PURE__ */ new Map();
       normalizedLineIds.forEach((lineId) => {
@@ -89660,7 +90516,7 @@ var PlantHeadView = () => {
     },
     [normalizedLineIds, supervisorsByLineId]
   );
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (selectedSupervisorId === "all") {
       setSelectedLineIds((previous) => {
         if (normalizedLineIds.length === 0) {
@@ -89686,7 +90542,7 @@ var PlantHeadView = () => {
     const scopedSupervisorLineIds = normalizedLineIds.filter((lineId) => supervisorLineIdSet.has(lineId));
     setSelectedLineIds((previous) => previous.length === scopedSupervisorLineIds.length && previous.every((lineId, index) => lineId === scopedSupervisorLineIds[index]) ? previous : scopedSupervisorLineIds);
   }, [lineIdsKey, normalizedLineIds, selectedSupervisorId, supervisorOptions]);
-  const scopedLineIds = React147__default.useMemo(
+  const scopedLineIds = React148__default.useMemo(
     () => selectedLineIds.length > 0 ? selectedLineIds : normalizedLineIds,
     [normalizedLineIds, selectedLineIds]
   );
@@ -89694,7 +90550,7 @@ var PlantHeadView = () => {
     shiftConfigMap,
     isLoading: isShiftConfigLoading
   } = useMultiLineShiftConfigs(scopedLineIds, staticShiftConfig);
-  const shiftFilterOptions = React147__default.useMemo(() => {
+  const shiftFilterOptions = React148__default.useMemo(() => {
     const optionsById = /* @__PURE__ */ new Map();
     scopedLineIds.forEach((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
@@ -89733,7 +90589,7 @@ var PlantHeadView = () => {
       ...dynamicOptions
     ];
   }, [appTimezone, scopedLineIds, shiftConfigMap, staticShiftConfig]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (scopedLineIds.length === 0 || isShiftConfigLoading) {
       return;
     }
@@ -89744,11 +90600,11 @@ var PlantHeadView = () => {
       clearInterval(intervalId);
     };
   }, [isShiftConfigLoading, scopedLineIds.length]);
-  const shiftResolutionNow = React147__default.useMemo(
+  const shiftResolutionNow = React148__default.useMemo(
     () => /* @__PURE__ */ new Date(),
     [shiftResolutionTick]
   );
-  const earliestDayShiftStartTime = React147__default.useMemo(() => {
+  const earliestDayShiftStartTime = React148__default.useMemo(() => {
     const candidateStarts = [];
     scopedLineIds.forEach((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
@@ -89784,11 +90640,11 @@ var PlantHeadView = () => {
     const minutes = earliestMinutes % 60;
     return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
   }, [appTimezone, scopedLineIds, shiftConfigMap, staticShiftConfig]);
-  const resolvedOperationalToday = React147__default.useMemo(
+  const resolvedOperationalToday = React148__default.useMemo(
     () => getOperationalDate(appTimezone, shiftResolutionNow, earliestDayShiftStartTime),
     [appTimezone, earliestDayShiftStartTime, shiftResolutionNow]
   );
-  const activeLineShiftStates = React147__default.useMemo(() => {
+  const activeLineShiftStates = React148__default.useMemo(() => {
     return scopedLineIds.flatMap((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
       const activeShift = getActiveShift(appTimezone, shiftConfig, shiftResolutionNow);
@@ -89818,7 +90674,7 @@ var PlantHeadView = () => {
     });
   }, [appTimezone, scopedLineIds, shiftConfigMap, shiftResolutionNow, staticShiftConfig]);
   const resolvedTrendMode = isInitialScopeReady ? trendMode : "all";
-  const hourlyWindowStartTime = React147__default.useMemo(() => {
+  const hourlyWindowStartTime = React148__default.useMemo(() => {
     if (scopedLineIds.length === 0) {
       return null;
     }
@@ -89875,12 +90731,12 @@ var PlantHeadView = () => {
     const minutes = earliestMinutes % 60;
     return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
   }, [appTimezone, resolvedTrendMode, scopedLineIds, shiftConfigMap, staticShiftConfig]);
-  const isShiftScopeResolved = React147__default.useMemo(
+  const isShiftScopeResolved = React148__default.useMemo(
     () => !isShiftConfigLoading,
     [isShiftConfigLoading]
   );
-  const initializedTimezoneRef = React147__default.useRef(appTimezone);
-  React147__default.useEffect(() => {
+  const initializedTimezoneRef = React148__default.useRef(appTimezone);
+  React148__default.useEffect(() => {
     if (initializedTimezoneRef.current === appTimezone) return;
     hasAutoInitializedScopeRef.current = false;
     hasUserAdjustedScopeRef.current = false;
@@ -89893,7 +90749,7 @@ var PlantHeadView = () => {
     setIsInitialScopeReady(false);
     initializedTimezoneRef.current = appTimezone;
   }, [appTimezone, fallbackOperationalDate]);
-  React147__default.useEffect(() => {
+  React148__default.useEffect(() => {
     if (hasAutoInitializedScopeRef.current || hasUserAdjustedScopeRef.current) {
       return;
     }
@@ -89918,7 +90774,7 @@ var PlantHeadView = () => {
     hasAutoInitializedScopeRef.current = true;
     setIsInitialScopeReady(true);
   }, [fallbackOperationalDate, isShiftScopeResolved, resolvedOperationalToday, scopedLineIds.length]);
-  const handleDateRangeChange = React147__default.useCallback((range, meta) => {
+  const handleDateRangeChange = React148__default.useCallback((range, meta) => {
     hasUserAdjustedScopeRef.current = true;
     setIsInitialScopeReady(true);
     trackCoreEvent("Operations Overview Date Range Changed", {
@@ -89936,12 +90792,12 @@ var PlantHeadView = () => {
       return previous;
     });
   }, []);
-  const handleTrendModeChange = React147__default.useCallback((mode) => {
+  const handleTrendModeChange = React148__default.useCallback((mode) => {
     hasUserAdjustedScopeRef.current = true;
     setIsInitialScopeReady(true);
     setTrendMode(mode);
   }, []);
-  const handleSelectedLineIdsChange = React147__default.useCallback((lineIds) => {
+  const handleSelectedLineIdsChange = React148__default.useCallback((lineIds) => {
     setSelectedSupervisorId("all");
     if (normalizedLineIds.length === 0) {
       setSelectedLineIds([]);
@@ -89952,10 +90808,10 @@ var PlantHeadView = () => {
     const next = normalizedLineIds.filter((lineId) => selectedSet.has(lineId));
     setSelectedLineIds(next.length > 0 ? next : normalizedLineIds);
   }, [normalizedLineIds]);
-  const handleSelectedSupervisorIdChange = React147__default.useCallback((supervisorId) => {
+  const handleSelectedSupervisorIdChange = React148__default.useCallback((supervisorId) => {
     setSelectedSupervisorId(supervisorId);
   }, []);
-  const buildLineMonthlyHistoryUrl = React147__default.useCallback((lineId) => {
+  const buildLineMonthlyHistoryUrl = React148__default.useCallback((lineId) => {
     const rangeStartDate = parseDateKeyToDate(dateRange.startKey);
     const params = new URLSearchParams();
     params.set("tab", "monthly_history");
@@ -89965,15 +90821,15 @@ var PlantHeadView = () => {
     params.set("rangeEnd", dateRange.endKey);
     return `/kpis/${lineId}?${params.toString()}`;
   }, [dateRange.endKey, dateRange.startKey]);
-  const handleViewAllPoorestPerformers = React147__default.useCallback(() => {
+  const handleViewAllPoorestPerformers = React148__default.useCallback(() => {
     trackCoreEvent("Operations Overview View All Clicked", { section: "poorest_performers" });
     navigate("/kpis?tab=leaderboard");
   }, [navigate]);
-  const handleViewAllImprovements = React147__default.useCallback(() => {
+  const handleViewAllImprovements = React148__default.useCallback(() => {
     trackCoreEvent("Operations Overview View All Clicked", { section: "improvements" });
     navigate("/improvement-center");
   }, [navigate]);
-  const handleOpenImprovement = React147__default.useCallback((item) => {
+  const handleOpenImprovement = React148__default.useCallback((item) => {
     trackCoreEvent("Operations Overview Improvement Clicked", {
       issue_id: item.issueId,
       issue_number: item.issueNumber,
@@ -89984,13 +90840,13 @@ var PlantHeadView = () => {
     });
     navigate(`/improvement-center?${params.toString()}`);
   }, [navigate]);
-  const comparisonStrategy = React147__default.useMemo(() => {
+  const comparisonStrategy = React148__default.useMemo(() => {
     if (usesThisWeekComparison && isCurrentWeekToDateRange) {
       return "previous_full_week";
     }
     return void 0;
   }, [isCurrentWeekToDateRange, usesThisWeekComparison]);
-  const effectiveDateRange = React147__default.useMemo(() => {
+  const effectiveDateRange = React148__default.useMemo(() => {
     if (isInitialScopeReady) {
       return dateRange;
     }
@@ -90000,11 +90856,11 @@ var PlantHeadView = () => {
       endKey: nextStartKey
     };
   }, [dateRange, fallbackOperationalDate, isInitialScopeReady, resolvedOperationalToday]);
-  const effectiveTrendMode = React147__default.useMemo(
+  const effectiveTrendMode = React148__default.useMemo(
     () => resolvedTrendMode,
     [resolvedTrendMode]
   );
-  const hasActiveSelectedShiftLine = React147__default.useMemo(
+  const hasActiveSelectedShiftLine = React148__default.useMemo(
     () => activeLineShiftStates.some((shift) => {
       if (shift.date !== resolvedOperationalToday) return false;
       if (effectiveTrendMode === "all") return true;
@@ -90016,7 +90872,7 @@ var PlantHeadView = () => {
     }),
     [activeLineShiftStates, effectiveTrendMode, resolvedOperationalToday]
   );
-  const activeLiveShiftName = React147__default.useMemo(
+  const activeLiveShiftName = React148__default.useMemo(
     () => {
       if (effectiveTrendMode === "all") return null;
       const matchingShift = activeLineShiftStates.find((shift) => {
@@ -90031,17 +90887,17 @@ var PlantHeadView = () => {
     },
     [activeLineShiftStates, effectiveTrendMode, resolvedOperationalToday]
   );
-  const hourlyLabelStartTime = React147__default.useMemo(() => {
+  const hourlyLabelStartTime = React148__default.useMemo(() => {
     if (scopedLineIds.length === 0) {
       return null;
     }
     return hourlyWindowStartTime;
   }, [hourlyWindowStartTime, scopedLineIds.length]);
-  const isSingleDayScope = React147__default.useMemo(
+  const isSingleDayScope = React148__default.useMemo(
     () => effectiveDateRange.startKey === effectiveDateRange.endKey,
     [effectiveDateRange.endKey, effectiveDateRange.startKey]
   );
-  const isLiveScope = React147__default.useMemo(
+  const isLiveScope = React148__default.useMemo(
     () => isSingleDayScope && effectiveDateRange.startKey === resolvedOperationalToday && hasActiveSelectedShiftLine,
     [
       effectiveDateRange.startKey,
@@ -90051,7 +90907,7 @@ var PlantHeadView = () => {
       resolvedOperationalToday
     ]
   );
-  const handleOpenLineDetails = React147__default.useCallback((line) => {
+  const handleOpenLineDetails = React148__default.useCallback((line) => {
     trackCoreEvent("Operations Overview Line Clicked", {
       line_id: line.rowType === "line" ? line.id : null,
       line_name: line.name,