@optifye/dashboard-core 6.11.11 → 6.11.13

package/dist/index.mjs

@@ -10,8 +10,8 @@ import { EventEmitter } from 'events';
 import { createClient, REALTIME_SUBSCRIBE_STATES } from '@supabase/supabase-js';
 import Hls, { Events, ErrorTypes } from 'hls.js';
 import useSWR from 'swr';
+import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, Map as Map$1, Video, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, ArrowLeft, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, XCircle, HelpCircle, Activity, Wrench, UserX, Package, RefreshCw, Palette, CheckCircle2, TrendingDown, FolderOpen, Folder, Tag, Sliders, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Copy, Settings, LifeBuoy, EyeOff, Zap, Flame, Crown, Medal } from 'lucide-react';
 import { memo, noop, warning, invariant, progress, secondsToMilliseconds, millisecondsToSeconds } from 'motion-utils';
-import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, Map as Map$1, Video, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, ArrowLeft, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, Wrench, XCircle, Package, UserX, Zap, HelpCircle, Tag, Palette, CheckCircle2, RefreshCw, TrendingDown, FolderOpen, Folder, Sliders, Activity, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Copy, Settings, LifeBuoy, EyeOff, Flame, Crown, Medal } from 'lucide-react';
 import { BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, ReferenceLine, Tooltip, Legend, Bar, LabelList, ResponsiveContainer, LineChart as LineChart$1, Line, PieChart, Pie, Cell, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
 import { Slot } from '@radix-ui/react-slot';
 import * as SelectPrimitive from '@radix-ui/react-select';
@@ -3417,6 +3417,25 @@ function isValidFactoryViewConfiguration(entityConfig) {
   return lineIds.length > 0;
 }
 
+// src/lib/constants/videoGridMetricMode.ts
+var VALID_VIDEO_GRID_METRIC_MODES = /* @__PURE__ */ new Set([
+  "efficiency",
+  "recent_flow",
+  "recent_flow_wip_gated"
+]);
+var normalizeVideoGridMetricMode = (value, assemblyEnabled = false) => {
+  const normalized = typeof value === "string" ? value.trim().toLowerCase() : "";
+  if (VALID_VIDEO_GRID_METRIC_MODES.has(normalized)) {
+    return normalized;
+  }
+  return assemblyEnabled ? "recent_flow_wip_gated" : "efficiency";
+};
+var isRecentFlowVideoGridMetricMode = (value, assemblyEnabled = false) => {
+  const normalized = normalizeVideoGridMetricMode(value, assemblyEnabled);
+  return normalized === "recent_flow" || normalized === "recent_flow_wip_gated";
+};
+var isWipGatedVideoGridMetricMode = (value, assemblyEnabled = false) => normalizeVideoGridMetricMode(value, assemblyEnabled) === "recent_flow_wip_gated";
+
 // src/lib/services/lineMetricsSelection.ts
 var toTimestamp = (value) => {
   if (typeof value !== "string") return 0;
@@ -3878,7 +3897,7 @@ var dashboardService = {
         company_name: data.company_name || "Company X",
         date: data.date,
         shift_id: data.shift_id,
-        action_name: data.action_name || "",
+        action_name: data.action_display_name || data.action_name || "",
         shift_start: data.shift_start || (data.shift_id === (shiftConfig.dayShift?.id ?? 0) ? shiftConfig.dayShift?.startTime : shiftConfig.nightShift?.startTime) || "00:00",
         shift_end: data.shift_end || (data.shift_id === (shiftConfig.dayShift?.id ?? 0) ? shiftConfig.dayShift?.endTime : shiftConfig.nightShift?.endTime) || "00:00",
         shift_type: data.shift_type || (data.shift_id === (shiftConfig.dayShift?.id ?? 0) ? "Day" : "Night"),
@@ -3947,7 +3966,9 @@ var dashboardService = {
           company_id,
           companies!lines_company_id_fkey(company_name:name),
           enable,
-          monitoring_mode
+          monitoring_mode,
+          assembly,
+          video_grid_metric_mode
         `).eq("enable", true);
       if (companyId) {
         query = query.eq("company_id", companyId);
@@ -3967,7 +3988,12 @@ var dashboardService = {
         company_name: line.companies?.company_name ?? "N/A",
         enable: line.enable ?? true,
         // Default to true if not specified
-        monitoring_mode: line.monitoring_mode ?? "output"
+        monitoring_mode: line.monitoring_mode ?? "output",
+        assembly: line.assembly ?? false,
+        video_grid_metric_mode: normalizeVideoGridMetricMode(
+          line.video_grid_metric_mode,
+          line.assembly ?? false
+        )
       }));
       return transformedLines;
     } catch (err) {
@@ -4004,7 +4030,7 @@ var dashboardService = {
         }
         const lineIdsToQuery = configuredLineIds;
         const [line1Result, metricsResult2] = await Promise.all([
-          supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", defaultLineId).single(),
+          supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", defaultLineId).single(),
           supabase.from(lineMetricsTable).select("*").in("line_id", lineIdsToQuery).eq("shift_id", queryShiftId).eq("date", queryDate)
         ]);
         if (line1Result.error) throw line1Result.error;
@@ -4083,7 +4109,7 @@ var dashboardService = {
         throw new Error("Company ID must be configured for detailed line requests.");
       }
       const [lineResult, metricsResult] = await Promise.all([
-        supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", lineIdToQuery).single(),
+        supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", lineIdToQuery).single(),
         supabase.from(lineMetricsTable).select("*").eq("line_id", lineIdToQuery).eq("shift_id", queryShiftId).eq("date", queryDate)
       ]);
       if (lineResult.error) throw lineResult.error;
@@ -4899,25 +4925,25 @@ var workspaceService = {
     if (!configuredFactoryId) {
       throw new Error("Factory ID (entityConfig.factoryId) must be configured to update line thresholds.");
     }
-    let outputWorkspaces = workspaces.filter((ws) => ws.action_type === "packaging");
+    let outputWorkspaces = workspaces.filter((ws) => ws.action_type === "output");
     if (outputWorkspaces.length === 0) {
-      const packagingKeywords = ["packaging", "package", "packing", "pack"];
-      const possiblePackagingWorkspaces = workspaces.filter((ws) => {
+      const outputKeywords = ["output", "packaging", "package", "packing", "pack"];
+      const possibleOutputWorkspaces = workspaces.filter((ws) => {
         if (ws.workspace_id && typeof ws.workspace_id === "string") {
           const wsIdLower = ws.workspace_id.toLowerCase();
-          return packagingKeywords.some((keyword) => wsIdLower.includes(keyword));
+          return outputKeywords.some((keyword) => wsIdLower.includes(keyword));
         }
         return false;
       });
-      if (possiblePackagingWorkspaces.length > 0) {
-        outputWorkspaces = possiblePackagingWorkspaces;
+      if (possibleOutputWorkspaces.length > 0) {
+        outputWorkspaces = possibleOutputWorkspaces;
       } else {
-        console.warn("[WorkspaceService] Unable to determine packaging workspaces for threshold calculation. Using all workspaces.");
+        console.warn("[WorkspaceService] Unable to determine output-family workspaces for threshold calculation. Using all workspaces.");
         outputWorkspaces = workspaces;
       }
     }
     if (outputWorkspaces.length === 0 && workspaces.length > 0) {
-      console.warn('[WorkspaceService] No workspaces with action_type "packaging" found for line threshold calculation. Thresholds might be zero.');
+      console.warn('[WorkspaceService] No workspaces with action_type "output" found for line threshold calculation. Thresholds might be zero.');
     }
     const totalDayOutput = outputWorkspaces.reduce((sum, ws) => sum + (ws.action_total_day_output || 0), 0);
     const totalPPH = outputWorkspaces.reduce((sum, ws) => sum + (ws.action_pph_threshold || 0), 0);
@@ -8437,7 +8463,11 @@ var LinesService = class {
         createdAt: line.created_at,
         factoryId: line.factory_id,
         monitoringMode: line.monitoring_mode ?? "output",
-        assembly: line.assembly ?? false
+        assembly: line.assembly ?? false,
+        videoGridMetricMode: normalizeVideoGridMetricMode(
+          line.video_grid_metric_mode,
+          line.assembly ?? false
+        )
       }));
     } catch (error) {
       console.error("Error fetching lines:", error);
@@ -8481,7 +8511,11 @@ var LinesService = class {
         createdAt: line.created_at,
         factoryId: line.factory_id,
         monitoringMode: line.monitoring_mode ?? "output",
-        assembly: line.assembly ?? false
+        assembly: line.assembly ?? false,
+        videoGridMetricMode: normalizeVideoGridMetricMode(
+          line.video_grid_metric_mode,
+          line.assembly ?? false
+        )
       }));
     } catch (error) {
       console.error("Error fetching all lines:", error);
@@ -8533,7 +8567,12 @@ var LinesService = class {
         isActive: data.enable,
         createdAt: data.created_at,
         factoryId: data.factory_id,
-        monitoringMode: data.monitoring_mode ?? "output"
+        monitoringMode: data.monitoring_mode ?? "output",
+        assembly: data.assembly ?? false,
+        videoGridMetricMode: normalizeVideoGridMetricMode(
+          data.video_grid_metric_mode,
+          data.assembly ?? false
+        )
       };
     } catch (error) {
       console.error("Error fetching line:", error);
@@ -9674,78 +9713,6 @@ var createStorageService = (supabase) => ({
   }
 });
 
-// src/lib/constants/idleTimeColors.ts
-var IDLE_TIME_REASON_COLORS = {
-  "Operator Absent": {
-    hex: "#dc2626",
-    // red-600 - Critical/Urgent
-    text: "text-red-600",
-    bg: "bg-red-50",
-    border: "border-red-200"
-  },
-  "No Material": {
-    hex: "#f59e0b",
-    // amber-500 - Warning/Supply Chain
-    text: "text-amber-600",
-    bg: "bg-amber-50",
-    border: "border-amber-200"
-  },
-  "Machine Downtime": {
-    hex: "#3b82f6",
-    // blue-500 - Scheduled/Technical
-    text: "text-blue-600",
-    bg: "bg-blue-50",
-    border: "border-blue-200"
-  },
-  "Operator Idle": {
-    hex: "#8b5cf6",
-    // violet-500 - Low Priority/Behavioral
-    text: "text-violet-600",
-    bg: "bg-violet-50",
-    border: "border-violet-200"
-  }
-};
-var FALLBACK_HEX_COLORS = [
-  "#dc2626",
-  // red-600
-  "#ea580c",
-  // orange-600
-  "#ca8a04",
-  // yellow-600
-  "#16a34a",
-  // green-600
-  "#0891b2",
-  // cyan-600
-  "#2563eb",
-  // blue-600
-  "#7c3aed",
-  // violet-600
-  "#c026d3"
-  // fuchsia-600
-];
-var DEFAULT_CONFIG3 = {
-  hex: "#9ca3af",
-  text: "text-gray-500",
-  bg: "bg-gray-50",
-  border: "border-gray-200"
-};
-function getIdleTimeReasonColor(reason, index = 0) {
-  const normalizedReason = reason.includes("_") ? reason.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ") : reason;
-  if (IDLE_TIME_REASON_COLORS[normalizedReason]) {
-    return IDLE_TIME_REASON_COLORS[normalizedReason];
-  }
-  const lowerReason = normalizedReason.toLowerCase();
-  const foundKey = Object.keys(IDLE_TIME_REASON_COLORS).find((k) => k.toLowerCase() === lowerReason);
-  if (foundKey) {
-    return IDLE_TIME_REASON_COLORS[foundKey];
-  }
-  const fallbackHex = FALLBACK_HEX_COLORS[index % FALLBACK_HEX_COLORS.length];
-  return {
-    ...DEFAULT_CONFIG3,
-    hex: fallbackHex
-  };
-}
-
 // src/lib/services/idleTimeReasonService.ts
 async function fetchIdleTimeReasons(params) {
   const { workspaceId, lineId, date, shiftId, startDate, endDate, token } = params;
@@ -9803,7 +9770,12 @@ async function fetchIdleTimeReasons(params) {
 }
 function transformToChartData(data) {
   return data.reasons.map((reason) => ({
-    name: formatReasonLabel(reason.reason),
+    name: reason.display_name || formatReasonLabel(reason.reason_key || reason.reason),
+    reasonKey: reason.reason_key || reason.reason,
+    displayName: reason.display_name || formatReasonLabel(reason.reason_key || reason.reason),
+    paletteToken: reason.palette_token,
+    iconToken: reason.icon_token,
+    isKnown: reason.is_known,
     value: reason.percentage,
     totalDurationSeconds: reason.total_duration_seconds,
     efficiencyLossPercentage: reason.efficiency_loss_percentage ?? null
@@ -9812,9 +9784,6 @@ function transformToChartData(data) {
 function formatReasonLabel(reason) {
   return reason.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
 }
-function getReasonColor(reason, index = 0) {
-  return getIdleTimeReasonColor(reason, index).hex;
-}
 
 // src/lib/services/sessionTracker.ts
 function generateSessionId() {
@@ -11537,6 +11506,52 @@ var workspaceMetricsStore = {
   }
 };
 
+// src/lib/constants/actions.ts
+var ACTION_NAMES = {
+  /** Assembly operations */
+  ASSEMBLY: "Assembly",
+  /** Packaging operations */
+  PACKAGING: "Packaging",
+  /** Output operations (user-facing label for the legacy packaging family) */
+  OUTPUT: "Output",
+  /** Inspection operations */
+  INSPECTION: "Inspection",
+  /** Testing operations */
+  TESTING: "Testing",
+  /** Quality control operations */
+  QUALITY_CONTROL: "Quality Control"
+};
+var ACTION_FAMILIES = {
+  ASSEMBLY: "assembly",
+  OUTPUT: "output",
+  OTHER: "other"
+};
+var normalizeActionFamily = (params) => {
+  const explicitValue = (params.actionFamily ?? params.actionType ?? "").trim().toLowerCase();
+  if (explicitValue === ACTION_FAMILIES.ASSEMBLY) return ACTION_FAMILIES.ASSEMBLY;
+  if (explicitValue === ACTION_FAMILIES.OUTPUT || explicitValue === "packaging") {
+    return ACTION_FAMILIES.OUTPUT;
+  }
+  if (explicitValue === ACTION_FAMILIES.OTHER) return ACTION_FAMILIES.OTHER;
+  const normalizedName = (params.actionName ?? "").trim().toLowerCase();
+  if (!normalizedName) return null;
+  if (normalizedName === "output" || normalizedName.includes("packag")) {
+    return ACTION_FAMILIES.OUTPUT;
+  }
+  if (normalizedName.includes("assembly")) {
+    return ACTION_FAMILIES.ASSEMBLY;
+  }
+  return ACTION_FAMILIES.OTHER;
+};
+var getActionDisplayName = (params) => {
+  const explicitDisplayName = (params.displayName ?? "").trim();
+  if (explicitDisplayName) return explicitDisplayName;
+  const family = normalizeActionFamily(params);
+  if (family === ACTION_FAMILIES.OUTPUT) return ACTION_NAMES.OUTPUT;
+  if (family === ACTION_FAMILIES.ASSEMBLY) return ACTION_NAMES.ASSEMBLY;
+  return (params.actionName ?? "").trim();
+};
+
 // src/lib/utils/workspaceMetricsTransform.ts
 var coerceNumber = (value, fallback = 0) => {
   const num = typeof value === "number" ? value : Number(value);
@@ -11726,10 +11741,17 @@ var toWorkspaceDetailedMetrics = ({
   const targetOutput = coerceNumber(data.target_output ?? data.total_day_output, 0);
   const idealOutput = coerceNumber(data.ideal_output ?? data.ideal_output_until_now, 0);
   const outputDifference = totalActions - idealOutput;
+  const hourlyCycleTimes = Array.isArray(data.hourly_cycle_times) ? data.hourly_cycle_times.map((value) => coerceNumber(value, 0)) : [];
   const totalWorkspacesValue = coerceNumber(
     data.total_workspaces ?? lineMetricsById?.[data.line_id || ""]?.total_workspaces ?? workspaceConfig.totalWorkspaces,
     0
   );
+  const actionFamily = normalizeActionFamily({
+    actionFamily: data.action_family,
+    actionType: data.action_type,
+    actionName: data.action_name
+  });
+  const actionType = actionFamily === "assembly" || actionFamily === "output" ? actionFamily : null;
   return {
     workspace_id: data.workspace_id,
     workspace_name: data.workspace_name,
@@ -11740,8 +11762,20 @@ var toWorkspaceDetailedMetrics = ({
     company_name: data.company_name || "",
     date: data.date,
     shift_id: shiftId,
-    action_name: data.action_name || "",
-    action_type: data.action_type === "assembly" || data.action_type === "packaging" ? data.action_type : null,
+    action_name: getActionDisplayName({
+      displayName: data.action_display_name,
+      actionFamily: data.action_family,
+      actionType: data.action_type,
+      actionName: data.action_name
+    }),
+    action_type: actionType,
+    action_family: actionFamily,
+    action_display_name: getActionDisplayName({
+      displayName: data.action_display_name,
+      actionFamily: data.action_family,
+      actionType: data.action_type,
+      actionName: data.action_name
+    }),
     shift_start: shiftStart,
     shift_end: shiftEnd,
     shift_type: shiftType,
@@ -11754,6 +11788,7 @@ var toWorkspaceDetailedMetrics = ({
     avg_efficiency: coerceNumber(data.efficiency ?? data.avg_efficiency, 0),
     total_actions: totalActions,
     hourly_action_counts: hourlyActionCounts,
+    hourly_cycle_times: hourlyCycleTimes,
     workspace_rank: coerceNumber(data.workspace_rank, 0),
     total_workspaces: totalWorkspacesValue,
     ideal_output_until_now: idealOutput,
@@ -13292,6 +13327,12 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
       const transformedWorkspaceData = allWorkspaceMetrics.map((item) => {
         const idleTimeValue = typeof item.idle_time === "number" ? item.idle_time : Number(item.idle_time);
         const idleTimeSeconds = Number.isFinite(idleTimeValue) ? idleTimeValue : void 0;
+        const actionFamily = normalizeActionFamily({
+          actionFamily: item.action_family,
+          actionType: item.action_type,
+          actionName: item.action_name
+        });
+        const actionType = actionFamily === "assembly" || actionFamily === "output" ? actionFamily : null;
         return {
           company_id: item.company_id || companyId,
           line_id: item.line_id,
@@ -13311,7 +13352,18 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
           monitoring_mode: item.monitoring_mode ?? void 0,
           idle_time: idleTimeSeconds,
           assembly_enabled: item.assembly_enabled ?? false,
-          action_type: item.action_type === "assembly" || item.action_type === "packaging" ? item.action_type : null,
+          video_grid_metric_mode: normalizeVideoGridMetricMode(
+            item.video_grid_metric_mode,
+            item.assembly_enabled ?? false
+          ),
+          action_type: actionType,
+          action_family: actionFamily,
+          action_display_name: getActionDisplayName({
+            displayName: item.action_display_name,
+            actionFamily: item.action_family,
+            actionType: item.action_type,
+            actionName: item.action_name
+          }),
           recent_flow_mode: item.recent_flow_mode ?? void 0,
           recent_flow_percent: item.recent_flow_percent ?? null,
           recent_flow_actual_rate_pph: item.recent_flow_actual_rate_pph ?? null,
@@ -19231,8 +19283,115 @@ function useIdleTimeReasons({
     refetch: fetchData
   };
 }
+var DEFAULT_PALETTE_TOKEN = "slate";
+var DEFAULT_ICON_TOKEN = "help-circle";
+var PALETTE_CONFIG = {
+  red: {
+    hex: "#dc2626",
+    textClass: "text-red-600",
+    bgClass: "bg-red-50",
+    borderClass: "border-red-200"
+  },
+  amber: {
+    hex: "#f59e0b",
+    textClass: "text-amber-600",
+    bgClass: "bg-amber-50",
+    borderClass: "border-amber-200"
+  },
+  blue: {
+    hex: "#3b82f6",
+    textClass: "text-blue-600",
+    bgClass: "bg-blue-50",
+    borderClass: "border-blue-200"
+  },
+  violet: {
+    hex: "#8b5cf6",
+    textClass: "text-violet-600",
+    bgClass: "bg-violet-50",
+    borderClass: "border-violet-200"
+  },
+  emerald: {
+    hex: "#10b981",
+    textClass: "text-emerald-600",
+    bgClass: "bg-emerald-50",
+    borderClass: "border-emerald-200"
+  },
+  cyan: {
+    hex: "#0891b2",
+    textClass: "text-cyan-600",
+    bgClass: "bg-cyan-50",
+    borderClass: "border-cyan-200"
+  },
+  slate: {
+    hex: "#64748b",
+    textClass: "text-slate-600",
+    bgClass: "bg-slate-50",
+    borderClass: "border-slate-200"
+  }
+};
+var ICON_CONFIG = {
+  "alert-triangle": AlertTriangle,
+  "refresh-cw": RefreshCw,
+  package: Package,
+  clock: Clock,
+  "user-x": UserX,
+  wrench: Wrench,
+  activity: Activity,
+  "help-circle": HelpCircle
+};
+var humanizeIdleReasonLabel = (value) => {
+  const text = String(value || "").trim();
+  if (!text) {
+    return "Unknown";
+  }
+  return text.replace(/_/g, " ").split(/\s+/).filter(Boolean).map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
+};
+var normalizePaletteToken = (value) => {
+  const token = String(value || "").trim().toLowerCase();
+  if (token in PALETTE_CONFIG) {
+    return token;
+  }
+  return DEFAULT_PALETTE_TOKEN;
+};
+var normalizeIconToken = (value) => {
+  const token = String(value || "").trim().toLowerCase();
+  if (token in ICON_CONFIG) {
+    return token;
+  }
+  return DEFAULT_ICON_TOKEN;
+};
+var getIdleReasonPresentation = (metadata) => {
+  const label = typeof metadata?.label === "string" && metadata.label.trim() ? metadata.label.trim() : null;
+  const displayName = typeof metadata?.displayName === "string" && metadata.displayName.trim() ? metadata.displayName.trim() : humanizeIdleReasonLabel(label);
+  const paletteToken = normalizePaletteToken(metadata?.paletteToken);
+  const iconToken = normalizeIconToken(metadata?.iconToken);
+  return {
+    label,
+    displayName,
+    paletteToken,
+    iconToken,
+    isKnown: Boolean(metadata?.isKnown),
+    Icon: ICON_CONFIG[iconToken],
+    ...PALETTE_CONFIG[paletteToken]
+  };
+};
+var getIdleReasonHexColor = (metadata) => getIdleReasonPresentation(metadata).hex;
 
 // src/lib/services/clipClassificationService.ts
+var normalizeClassification = (value) => {
+  const rawLabel = typeof value?.label === "string" ? value.label.trim() : "";
+  const label = rawLabel || void 0;
+  const parsedConfidence = typeof value?.confidence === "number" ? value.confidence : typeof value?.confidence === "string" ? Number(value.confidence) : void 0;
+  return {
+    status: value?.status === "classified" ? "classified" : "processing",
+    label,
+    displayName: typeof value?.display_name === "string" ? value.display_name : label ? humanizeIdleReasonLabel(label) : void 0,
+    paletteToken: typeof value?.palette_token === "string" ? value.palette_token : void 0,
+    iconToken: typeof value?.icon_token === "string" ? value.icon_token : void 0,
+    isKnown: typeof value?.is_known === "boolean" ? value.is_known : void 0,
+    confidence: parsedConfidence !== void 0 && Number.isFinite(parsedConfidence) ? parsedConfidence : void 0
+  };
+};
 function parseCleanLabel(rawLabel) {
   if (!rawLabel) return null;
   const patterns = [
@@ -19286,7 +19445,13 @@ async function fetchClassifications(clipIds, token) {
             );
           }
           const data = await response.json();
-          return data.classifications || {};
+          const rawClassifications = data.classifications || {};
+          return Object.fromEntries(
+            Object.entries(rawClassifications).map(([clipId, classification]) => [
+              clipId,
+              normalizeClassification(classification)
+            ])
+          );
         } catch (error) {
           console.error("Error fetching chunk:", error);
           return Object.fromEntries(
@@ -19327,21 +19492,30 @@ function useClassificationRealtimeUpdates({
       },
       (payload) => {
         console.log("[useClassificationRealtimeUpdates] New classification:", payload);
-        try {
-          const { clip_id, clip_label, confidence_score } = payload.new;
-          const parsedLabel = parseCleanLabel(clip_label);
-          if (parsedLabel) {
-            onClassificationUpdate(clip_id, {
-              status: "classified",
-              label: parsedLabel,
-              confidence: confidence_score || 0
-            });
-          } else {
-            console.warn("[useClassificationRealtimeUpdates] Failed to parse label:", clip_label);
+        void (async () => {
+          try {
+            const { clip_id, clip_label, confidence_score } = payload.new;
+            const token = await getAccessTokenOrRedirect(supabase, { redirectReason: "session_expired" });
+            const fetched = await fetchClassifications([clip_id], token);
+            const classification = fetched[clip_id];
+            if (classification) {
+              onClassificationUpdate(clip_id, classification);
+              return;
+            }
+            const parsedLabel = parseCleanLabel(clip_label);
+            if (parsedLabel) {
+              onClassificationUpdate(clip_id, {
+                status: "classified",
+                label: parsedLabel,
+                confidence: confidence_score || 0
+              });
+            } else {
+              console.warn("[useClassificationRealtimeUpdates] Failed to parse label:", clip_label);
+            }
+          } catch (error) {
+            console.error("[useClassificationRealtimeUpdates] Error processing update:", error);
           }
-        } catch (error) {
-          console.error("[useClassificationRealtimeUpdates] Error processing update:", error);
-        }
+        })();
       }
     ).subscribe((status) => {
       console.log(`[useClassificationRealtimeUpdates] Subscription status:`, status);
@@ -32373,90 +32547,99 @@ var CycleTimeOverTimeChart = ({
   data,
   idealCycleTime,
   shiftStart,
-  className = ""
+  shiftEnd,
+  xAxisMode = "recent",
+  datasetKey,
+  className = "",
+  showIdleTime = false,
+  idleTimeData = []
 }) => {
   const MAX_DATA_POINTS = 40;
   const containerRef = React141__default.useRef(null);
   const [containerReady, setContainerReady] = React141__default.useState(false);
-  const getHourFromTimeString = (timeStr) => {
-    const [hours, minutes] = timeStr.split(":");
-    return parseInt(hours);
+  const parseTimeToMinutes3 = (value) => {
+    const [hours, minutes] = value.split(":").map(Number);
+    if (!Number.isFinite(hours) || !Number.isFinite(minutes)) return 0;
+    return hours * 60 + minutes;
   };
-  getHourFromTimeString(shiftStart);
-  const getDisplayData = (rawData) => {
-    return rawData.slice(Math.max(0, rawData.length - MAX_DATA_POINTS));
+  const formatHourLabel = (slotIndex) => {
+    const baseMinutes = parseTimeToMinutes3(shiftStart);
+    const absoluteMinutes = baseMinutes + slotIndex * 60;
+    const hour24 = Math.floor(absoluteMinutes % (24 * 60) / 60);
+    const ampm = hour24 >= 12 ? "PM" : "AM";
+    const hour12 = hour24 % 12 || 12;
+    return `${hour12}${ampm}`;
+  };
+  const formatHourRangeLabel = (slotIndex) => {
+    const startLabel = formatHourLabel(slotIndex);
+    const endLabel = shiftEnd && slotIndex === DURATION - 1 ? formatHourLabel(slotIndex + 1) : formatHourLabel(slotIndex + 1);
+    return `${startLabel} - ${endLabel}`;
   };
+  const getDisplayData = React141__default.useCallback((rawData) => {
+    if (xAxisMode === "hourly") return rawData;
+    return rawData.slice(Math.max(0, rawData.length - MAX_DATA_POINTS));
+  }, [xAxisMode]);
   const displayData = getDisplayData(data);
   const DURATION = displayData.length;
-  const [animatedData, setAnimatedData] = React141__default.useState(Array(DURATION).fill(0));
-  const prevDataRef = React141__default.useRef(Array(DURATION).fill(0));
-  const animationFrameRef = React141__default.useRef(null);
-  const animateToNewData = React141__default.useCallback((targetData) => {
-    const startData = [...prevDataRef.current];
-    const startTime = performance.now();
-    const duration = 1200;
-    const animate = (currentTime) => {
-      const elapsed = currentTime - startTime;
-      const progress7 = Math.min(elapsed / duration, 1);
-      const easeOutQuint = (t) => 1 - Math.pow(1 - t, 5);
-      const easedProgress = easeOutQuint(progress7);
-      const newData = startData.map((start, index) => {
-        const target = targetData[index] || 0;
-        const change = target - start;
-        const scaleFactor = Math.min(1, 50 / Math.abs(change || 1));
-        const adjustedEasing = progress7 * (scaleFactor + (1 - scaleFactor) * easedProgress);
-        return start + change * adjustedEasing;
-      });
-      setAnimatedData(newData);
-      prevDataRef.current = newData;
-      if (progress7 < 1) {
-        animationFrameRef.current = requestAnimationFrame(animate);
-      } else {
-        setAnimatedData(targetData);
-        prevDataRef.current = targetData;
-      }
-    };
-    if (animationFrameRef.current) {
-      cancelAnimationFrame(animationFrameRef.current);
-    }
-    animationFrameRef.current = requestAnimationFrame(animate);
-  }, []);
+  const effectiveDatasetKey = datasetKey || `cycle-time:${xAxisMode}`;
+  const [animatedDatasetKey, setAnimatedDatasetKey] = React141__default.useState(null);
+  const shouldAnimate = animatedDatasetKey !== effectiveDatasetKey;
+  const handleAnimationEnd = React141__default.useCallback(() => {
+    setAnimatedDatasetKey((currentValue) => currentValue === effectiveDatasetKey ? currentValue : effectiveDatasetKey);
+  }, [effectiveDatasetKey]);
+  const finalData = displayData;
   React141__default.useEffect(() => {
-    if (JSON.stringify(data) !== JSON.stringify(prevDataRef.current)) {
-      const processedData = getDisplayData(data);
-      animateToNewData(processedData);
+    const containerNode = containerRef.current;
+    if (!containerNode) {
+      setContainerReady(true);
+      return void 0;
     }
-    return () => {
-      if (animationFrameRef.current) {
-        cancelAnimationFrame(animationFrameRef.current);
-      }
-    };
-  }, [data, animateToNewData]);
-  React141__default.useEffect(() => {
+    let frameId = null;
+    let resizeObserver = null;
     const checkContainerDimensions = () => {
-      if (containerRef.current) {
-        const rect = containerRef.current.getBoundingClientRect();
-        if (rect.width > 0 && rect.height > 0) {
-          setContainerReady(true);
-        }
+      const rect = containerNode.getBoundingClientRect();
+      const isReady = rect.width > 0 && rect.height > 0;
+      if (isReady) {
+        setContainerReady(true);
       }
+      return isReady;
     };
-    checkContainerDimensions();
-    const resizeObserver = new ResizeObserver(checkContainerDimensions);
-    if (containerRef.current) {
-      resizeObserver.observe(containerRef.current);
+    if (checkContainerDimensions()) {
+      return void 0;
     }
-    const fallbackTimeout = setTimeout(() => {
+    frameId = window.requestAnimationFrame(() => {
+      checkContainerDimensions();
+    });
+    if (typeof ResizeObserver !== "undefined") {
+      resizeObserver = new ResizeObserver(() => {
+        if (checkContainerDimensions() && resizeObserver) {
+          resizeObserver.disconnect();
+          resizeObserver = null;
+        }
+      });
+      resizeObserver.observe(containerNode);
+    } else {
       setContainerReady(true);
-    }, 100);
+    }
     return () => {
-      resizeObserver.disconnect();
-      clearTimeout(fallbackTimeout);
+      if (frameId !== null) {
+        window.cancelAnimationFrame(frameId);
+      }
+      resizeObserver?.disconnect();
     };
   }, []);
+  const labelInterval = React141__default.useMemo(() => {
+    if (xAxisMode === "hourly") {
+      return Math.max(1, Math.ceil(DURATION / 8));
+    }
+    return 5;
+  }, [xAxisMode, DURATION]);
   const formatTimeLabel = (dataIndex) => {
     if (DURATION === 0) return "";
-    if (dataIndex % 5 !== 0 && dataIndex !== DURATION - 1) return "";
+    if (dataIndex % labelInterval !== 0 && dataIndex !== DURATION - 1) return "";
+    if (xAxisMode === "hourly") {
+      return formatHourLabel(dataIndex);
+    }
     const timeAgo = (DURATION - 1 - dataIndex) * 90;
     const minutes = Math.floor(timeAgo / 60);
     const seconds = timeAgo % 60;
@@ -32470,6 +32653,9 @@ var CycleTimeOverTimeChart = ({
   };
   const formatTooltipTime = (dataIndex) => {
     if (DURATION === 0) return "";
+    if (xAxisMode === "hourly") {
+      return formatHourRangeLabel(dataIndex);
+    }
     const timeAgo = (DURATION - 1 - dataIndex) * 90;
     const minutes = Math.floor(timeAgo / 60);
     const seconds = timeAgo % 60;
@@ -32483,39 +32669,40 @@ var CycleTimeOverTimeChart = ({
       return `${minutes} minutes ${seconds} seconds ago`;
     }
   };
-  const chartData = Array.from({ length: DURATION }, (_, i) => {
+  const chartData = React141__default.useMemo(() => Array.from({ length: DURATION }, (_, i) => {
     return {
       timeIndex: i,
       label: formatTimeLabel(i),
       tooltip: formatTooltipTime(i),
-      cycleTime: animatedData[i] || 0,
-      color: (animatedData[i] || 0) <= idealCycleTime ? "#00AB45" : "#E34329"
+      cycleTime: finalData[i] || 0,
+      idleMinutes: showIdleTime && idleTimeData && idleTimeData[i] || 0,
+      color: (finalData[i] || 0) <= idealCycleTime ? "#00AB45" : "#E34329"
     };
-  });
-  const renderLegend = () => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center text-sm text-gray-600 absolute -bottom-1 left-0 right-0 bg-white py-1", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border border-gray-100 rounded-full px-3 py-1", children: [
-    /* @__PURE__ */ jsx("div", { className: "w-8 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t-2 border-[#E34329] border-dashed" }) }),
-    /* @__PURE__ */ jsxs("span", { children: [
-      "Standard: ",
-      idealCycleTime.toFixed(1),
-      " seconds"
-    ] })
-  ] }) });
+  }), [DURATION, finalData, showIdleTime, idleTimeData, idealCycleTime]);
+  const renderLegend = () => {
+    if (!showIdleTime) return null;
+    return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start text-[10px] font-bold text-gray-500 mb-6 tracking-[0.05em] gap-5", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-[#f59e0b]" }),
+      /* @__PURE__ */ jsx("span", { children: "Idle Time (min)" })
+    ] }) });
+  };
   return /* @__PURE__ */ jsxs(
     "div",
     {
       ref: containerRef,
-      className: `w-full h-full min-w-0 relative pb-8 ${className}`,
+      className: `w-full h-full min-w-0 flex flex-col relative pb-2 ${className}`,
       style: { minHeight: "200px", minWidth: 0 },
       children: [
-        containerReady ? /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs(
+        renderLegend(),
+        /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0 w-full", children: containerReady ? /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs(
           LineChart$1,
           {
             data: chartData,
             margin: {
-              top: 25,
+              top: 5,
               right: 30,
               bottom: 25,
-              left: 35
+              left: 10
             },
             children: [
               /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3", vertical: false }),
@@ -32525,17 +32712,18 @@ var CycleTimeOverTimeChart = ({
                   dataKey: "label",
                   tick: { fontSize: 11 },
                   interval: 0,
-                  angle: -30,
-                  textAnchor: "end",
-                  tickMargin: 15,
-                  height: 60
+                  angle: xAxisMode === "hourly" ? 0 : -30,
+                  textAnchor: xAxisMode === "hourly" ? "middle" : "end",
+                  tickMargin: xAxisMode === "hourly" ? 8 : 15,
+                  height: xAxisMode === "hourly" ? 40 : 60
                 }
               ),
               /* @__PURE__ */ jsx(
                 YAxis,
                 {
                   tickMargin: 8,
-                  width: 35,
+                  width: 45,
+                  yAxisId: "cycle",
                   domain: ["auto", "auto"],
                   ticks: [0, idealCycleTime, ...Array.from({ length: 4 }, (_, i) => (i + 1) * Math.ceil(idealCycleTime / 2))].sort((a, b) => a - b),
                   tickFormatter: (value) => String(value),
@@ -32559,6 +32747,20 @@ var CycleTimeOverTimeChart = ({
                   }
                 }
               ),
+              showIdleTime && /* @__PURE__ */ jsx(
+                YAxis,
+                {
+                  yAxisId: "idle",
+                  orientation: "right",
+                  tickMargin: 8,
+                  width: 35,
+                  domain: [0, 60],
+                  tickFormatter: (value) => `${value}m`,
+                  tick: { fontSize: 11, fill: "#f59e0b" },
+                  axisLine: false,
+                  tickLine: false
+                }
+              ),
               /* @__PURE__ */ jsx(
                 Tooltip,
                 {
@@ -32586,8 +32788,11 @@ var CycleTimeOverTimeChart = ({
                     }
                     return label;
                   },
-                  formatter: (value) => {
+                  formatter: (value, name) => {
                     const numValue = typeof value === "number" ? value : Number(value);
+                    if (name === "idleMinutes") {
+                      return [`${numValue.toFixed(0)} minutes`, "Idle Time"];
+                    }
                     return [`${numValue.toFixed(1)} seconds`, "Cycle Time"];
                   },
                   animationDuration: 200
@@ -32597,6 +32802,7 @@ var CycleTimeOverTimeChart = ({
                 ReferenceLine,
                 {
                   y: idealCycleTime,
+                  yAxisId: "cycle",
                   stroke: "#E34329",
                   strokeDasharray: "3 3",
                   strokeWidth: 2,
@@ -32613,6 +32819,7 @@ var CycleTimeOverTimeChart = ({
                 Line,
                 {
                   type: "monotone",
+                  yAxisId: "cycle",
                   dataKey: "cycleTime",
                   stroke: "#3B82F6",
                   strokeWidth: 2,
@@ -32662,15 +32869,35 @@ var CycleTimeOverTimeChart = ({
                       }
                     );
                   },
+                  isAnimationActive: shouldAnimate,
                   animationBegin: 0,
-                  animationDuration: 1500,
+                  animationDuration: 1200,
+                  animationEasing: "ease-out",
+                  onAnimationEnd: handleAnimationEnd
+                },
+                `${effectiveDatasetKey}:cycle`
+              ),
+              showIdleTime && /* @__PURE__ */ jsx(
+                Line,
+                {
+                  type: "monotone",
+                  yAxisId: "idle",
+                  dataKey: "idleMinutes",
+                  stroke: "#f59e0b",
+                  strokeWidth: 2,
+                  strokeDasharray: "4 4",
+                  dot: { r: 4, fill: "#f59e0b", stroke: "#fff", strokeWidth: 1 },
+                  activeDot: { r: 6, fill: "#f59e0b", stroke: "#fff", strokeWidth: 2 },
+                  isAnimationActive: shouldAnimate,
+                  animationBegin: 0,
+                  animationDuration: 1200,
                   animationEasing: "ease-out"
-                }
+                },
+                `${effectiveDatasetKey}:idle`
               )
             ]
           }
-        ) }) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center bg-gray-50 rounded-lg", children: /* @__PURE__ */ jsx("div", { className: "text-gray-500 text-sm", children: "Loading chart..." }) }),
-        renderLegend()
+        ) }) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center bg-gray-50 rounded-lg", children: /* @__PURE__ */ jsx("div", { className: "text-gray-500 text-sm", children: "Loading chart..." }) }) })
       ]
     }
   );
@@ -32862,7 +33089,7 @@ var HourlyOutputChartComponent = ({
     if (!classification.label) {
       return "Reason unavailable";
     }
-    return classification.label.replace(/_/g, " ");
+    return classification.displayName || classification.label.replace(/_/g, " ");
   }, [idleClipRanges, idleTimeClipClassifications]);
   const { shiftDuration, shiftEndTime, hasPartialLastHour } = React141__default.useMemo(() => {
     console.log("[HourlyOutputChart] Calculating shift duration with:", {
@@ -33520,23 +33747,82 @@ var HourlyOutputChart = React141__default.memo(HourlyOutputChartComponent, (prev
 HourlyOutputChart.displayName = "HourlyOutputChart";
 
 // src/components/dashboard/grid/videoGridMetricUtils.ts
-var VIDEO_GRID_LEGEND_LABEL = "7-min Flow";
+var VIDEO_GRID_LEGEND_LABEL = "Flow";
 var MAP_GRID_LEGEND_LABEL = "Efficiency";
 var MIXED_VIDEO_GRID_LEGEND_LABEL = "Flow / Efficiency";
 var isFiniteNumber2 = (value) => typeof value === "number" && Number.isFinite(value);
-var isAssemblyFlowEnabled = (workspace) => workspace.assembly_enabled === true;
-var hasAssemblyRecentFlow = (workspace) => isAssemblyFlowEnabled(workspace) && isFiniteNumber2(workspace.recent_flow_percent);
+var isVideoGridRecentFlowEnabled = (workspace) => isRecentFlowVideoGridMetricMode(
+  workspace.video_grid_metric_mode,
+  workspace.assembly_enabled === true
+);
+var isVideoGridWipGated = (workspace) => isWipGatedVideoGridMetricMode(
+  workspace.video_grid_metric_mode,
+  workspace.assembly_enabled === true
+);
+var hasVideoGridRecentFlow = (workspace) => isVideoGridRecentFlowEnabled(workspace) && isFiniteNumber2(workspace.recent_flow_percent);
+var isVideoGridRecentFlowUnavailable = (workspace) => isVideoGridRecentFlowEnabled(workspace) && !hasVideoGridRecentFlow(workspace);
 var getVideoGridMetricValue = (workspace) => {
   const recentFlowPercent = workspace.recent_flow_percent;
-  if (hasAssemblyRecentFlow(workspace) && isFiniteNumber2(recentFlowPercent)) {
+  if (hasVideoGridRecentFlow(workspace) && isFiniteNumber2(recentFlowPercent)) {
     return recentFlowPercent;
   }
+  if (isVideoGridRecentFlowUnavailable(workspace)) {
+    return null;
+  }
   return workspace.efficiency;
 };
 var hasIncomingWipMapping = (workspace) => Boolean(workspace.incoming_wip_buffer_name);
+var getVideoGridBaseColorState = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND) => {
+  const metricValue = getVideoGridMetricValue(workspace);
+  if (!isFiniteNumber2(metricValue)) {
+    return "neutral";
+  }
+  return getEfficiencyColor(metricValue, legend);
+};
+var isLowWipGreenOverride = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND) => {
+  if (!hasVideoGridRecentFlow(workspace) || !isVideoGridWipGated(workspace)) {
+    return false;
+  }
+  if (getVideoGridBaseColorState(workspace, legend) !== "red") {
+    return false;
+  }
+  if (!hasIncomingWipMapping(workspace)) {
+    return false;
+  }
+  return isFiniteNumber2(workspace.incoming_wip_current) && workspace.incoming_wip_current <= 1;
+};
+var toMinuteBucket = (minuteBucket) => Number.isFinite(minuteBucket) ? Math.floor(minuteBucket) : Math.floor(Date.now() / 6e4);
+var getEffectiveFlowMinuteBucket = (workspace) => {
+  const effectiveAt = workspace.recent_flow_effective_end_at;
+  if (!effectiveAt) {
+    return void 0;
+  }
+  const timestamp = Date.parse(effectiveAt);
+  if (!Number.isFinite(timestamp)) {
+    return void 0;
+  }
+  return Math.floor(timestamp / 6e4);
+};
+var hashWorkspaceKey = (workspace) => {
+  const workspaceKey = workspace.workspace_uuid || workspace.workspace_name || "unknown";
+  let hash = 0;
+  for (let index = 0; index < workspaceKey.length; index += 1) {
+    hash = (hash * 31 + workspaceKey.charCodeAt(index)) % 2147483647;
+  }
+  return hash;
+};
+var getSyntheticLowWipDisplayValue = (workspace, minuteBucket) => {
+  const bucket = getEffectiveFlowMinuteBucket(workspace) ?? toMinuteBucket(minuteBucket);
+  const offset = (hashWorkspaceKey(workspace) % 11 + bucket % 11 + 11) % 11;
+  return 100 + offset;
+};
+var getVideoGridDisplayValue = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND, minuteBucket) => isLowWipGreenOverride(workspace, legend) ? getSyntheticLowWipDisplayValue(workspace, minuteBucket) : getVideoGridMetricValue(workspace);
 var getVideoGridColorState = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND) => {
-  const baseColor = getEfficiencyColor(getVideoGridMetricValue(workspace), legend);
-  if (!hasAssemblyRecentFlow(workspace)) {
+  const baseColor = getVideoGridBaseColorState(workspace, legend);
+  if (!hasVideoGridRecentFlow(workspace)) {
+    return baseColor;
+  }
+  if (!isVideoGridWipGated(workspace)) {
     return baseColor;
   }
   if (baseColor !== "red") {
@@ -33548,7 +33834,7 @@ var getVideoGridColorState = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND) =>
   if (!isFiniteNumber2(workspace.incoming_wip_current)) {
     return "neutral";
   }
-  if (workspace.incoming_wip_current <= 1) {
+  if (isLowWipGreenOverride(workspace, legend)) {
     return "green";
   }
   return baseColor;
@@ -33558,11 +33844,11 @@ var getVideoGridLegendLabel = (workspaces) => {
   if (visibleWorkspaces.length === 0) {
     return MAP_GRID_LEGEND_LABEL;
   }
-  const assemblyEnabledCount = visibleWorkspaces.filter(isAssemblyFlowEnabled).length;
-  if (assemblyEnabledCount === 0) {
+  const recentFlowEnabledCount = visibleWorkspaces.filter(isVideoGridRecentFlowEnabled).length;
+  if (recentFlowEnabledCount === 0) {
     return MAP_GRID_LEGEND_LABEL;
   }
-  if (assemblyEnabledCount === visibleWorkspaces.length) {
+  if (recentFlowEnabledCount === visibleWorkspaces.length) {
     return VIDEO_GRID_LEGEND_LABEL;
   }
   return MIXED_VIDEO_GRID_LEGEND_LABEL;
@@ -33589,6 +33875,7 @@ var VideoCard = React141__default.memo(({
   useRAF = true,
   className = "",
   compact = false,
+  displayMinuteBucket,
   displayName,
   lastSeenLabel,
   onMouseEnter,
@@ -33609,8 +33896,13 @@ var VideoCard = React141__default.memo(({
   const lastSeenText = lastSeenLabel || "Unknown";
   const workspaceDisplayName = displayName || getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
   const videoGridMetricValue = getVideoGridMetricValue(workspace);
+  const videoGridDisplayValue = getVideoGridDisplayValue(workspace, effectiveLegend, displayMinuteBucket);
   const videoGridColorState = getVideoGridColorState(workspace, effectiveLegend);
-  const badgeTitle = hasAssemblyRecentFlow(workspace) ? `Flow ${Math.round(videoGridMetricValue)}%` : `Efficiency ${Math.round(videoGridMetricValue)}%`;
+  const isRecentFlowCard = isVideoGridRecentFlowEnabled(workspace);
+  const hasDisplayMetric = typeof videoGridDisplayValue === "number" && Number.isFinite(videoGridDisplayValue);
+  const hasBarMetric = typeof videoGridMetricValue === "number" && Number.isFinite(videoGridMetricValue);
+  const badgeTitle = hasVideoGridRecentFlow(workspace) ? `Flow ${Math.round(videoGridDisplayValue ?? 0)}%` : isRecentFlowCard ? "Flow unavailable" : `Efficiency ${Math.round(videoGridDisplayValue ?? 0)}%`;
+  const badgeLabel = hasDisplayMetric ? `${Math.round(videoGridDisplayValue)}%` : "X";
   const efficiencyOverlayClass = videoGridColorState === "green" ? "bg-[#00D654]/25" : videoGridColorState === "yellow" ? "bg-[#FFD700]/30" : videoGridColorState === "red" ? "bg-[#FF2D0A]/30" : "bg-transparent";
   const efficiencyBarClass = videoGridColorState === "green" ? "bg-[#00AB45]" : videoGridColorState === "yellow" ? "bg-[#FFB020]" : videoGridColorState === "red" ? "bg-[#E34329]" : "bg-gray-500/70";
   const efficiencyStatus = videoGridColorState === "green" ? "High" : videoGridColorState === "yellow" ? "Medium" : videoGridColorState === "red" ? "Low" : "Neutral";
@@ -33689,19 +33981,18 @@ var VideoCard = React141__default.memo(({
           /* @__PURE__ */ jsx("div", { className: `absolute ${compact ? "top-1 right-1" : "top-2 right-2"} z-30`, children: /* @__PURE__ */ jsx(
             "div",
             {
+              "data-testid": "video-card-metric-badge",
               className: `bg-black/70 backdrop-blur-sm rounded ${compact ? "px-1.5 py-1" : "px-2 py-1"} text-white border border-white/10`,
               title: badgeTitle,
-              children: /* @__PURE__ */ jsxs("span", { className: `${compact ? "text-[10px]" : "text-xs"} font-semibold`, children: [
-                Math.round(videoGridMetricValue),
-                "%"
-              ] })
+              children: /* @__PURE__ */ jsx("span", { className: `${compact ? "text-[10px]" : "text-xs"} font-semibold`, children: badgeLabel })
             }
           ) }),
           /* @__PURE__ */ jsx("div", { className: `absolute bottom-0 left-0 right-0 ${compact ? "h-0.5" : "h-1"} bg-black/50 z-30`, children: /* @__PURE__ */ jsx(
             "div",
             {
+              "data-testid": "video-card-metric-bar",
               className: `h-full ${efficiencyBarClass} transition-all duration-500`,
-              style: { width: `${Math.min(100, videoGridMetricValue)}%` }
+              style: { width: `${hasBarMetric ? Math.min(100, Math.max(0, videoGridMetricValue)) : videoGridColorState === "neutral" ? 100 : 0}%` }
             }
           ) })
         ] }),
@@ -33732,7 +34023,7 @@ var VideoCard = React141__default.memo(({
     }
   );
 }, (prevProps, nextProps) => {
-  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
+  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.video_grid_metric_mode !== nextProps.workspace.video_grid_metric_mode || prevProps.workspace.recent_flow_mode !== nextProps.workspace.recent_flow_mode || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.recent_flow_effective_end_at !== nextProps.workspace.recent_flow_effective_end_at || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
     return false;
   }
   if (prevProps.workspace.workspace_uuid !== nextProps.workspace.workspace_uuid || prevProps.workspace.workspace_name !== nextProps.workspace.workspace_name || prevProps.workspace.line_id !== nextProps.workspace.line_id) {
@@ -33750,6 +34041,9 @@ var VideoCard = React141__default.memo(({
   if (prevProps.compact !== nextProps.compact) {
     return false;
   }
+  if (prevProps.displayMinuteBucket !== nextProps.displayMinuteBucket) {
+    return false;
+  }
   if (prevProps.hlsUrl !== nextProps.hlsUrl || prevProps.shouldPlay !== nextProps.shouldPlay) {
     return false;
   }
@@ -34033,6 +34327,7 @@ var VideoGridView = React141__default.memo(({
       stream_source: isR2Stream ? "r2" : "media_config"
     });
   }, []);
+  const displayMinuteBucket = Math.floor(Date.now() / 6e4);
   return /* @__PURE__ */ jsx("div", { className: `relative overflow-hidden h-full w-full ${className}`, children: /* @__PURE__ */ jsx("div", { ref: containerRef, className: "h-full w-full p-3 sm:p-2", children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -34122,6 +34417,7 @@ var VideoGridView = React141__default.memo(({
                 ),
                 lastSeenLabel: card.lastSeenLabel,
                 useRAF: effectiveUseRAF,
+                displayMinuteBucket,
                 compact: !selectedLine,
                 onMouseEnter: onWorkspaceHover ? () => onWorkspaceHover(card.workspaceId) : void 0,
                 onMouseLeave: onWorkspaceHoverEnd ? () => onWorkspaceHoverEnd(card.workspaceId) : void 0
@@ -39251,45 +39547,56 @@ var FileManagerFilters = ({
   });
   const [loadingPercentile, setLoadingPercentile] = useState(false);
   const resolvedTargetCycleTime = targetCycleTime && targetCycleTime > 0 ? targetCycleTime : null;
-  const getRootCauseConfig = (reason) => {
-    const colorConfig = getIdleTimeReasonColor(reason);
-    let Icon2 = HelpCircle;
-    if (reason.includes("Machine Breakdown")) Icon2 = AlertTriangle;
-    else if (reason.includes("Material")) Icon2 = Package;
-    else if (reason.includes("Worker") || reason.includes("Absent")) Icon2 = UserX;
-    else if (reason.includes("Quality")) Icon2 = XCircle;
-    else if (reason.includes("Power")) Icon2 = Zap;
-    else if (reason.includes("Maintenance") || reason.includes("Tool")) Icon2 = Wrench;
-    else if (reason.includes("Present") || reason.includes("Idle")) Icon2 = Clock;
+  const getIdleTimeClassification = useCallback((clipId) => {
+    const classification = mergedClipClassifications[clipId];
+    return classification || null;
+  }, [mergedClipClassifications]);
+  const getRootCauseConfig = useCallback((classification) => {
+    if (!classification || classification.status === "processing") {
+      return null;
+    }
+    const presentation = getIdleReasonPresentation({
+      label: classification.label,
+      displayName: classification.displayName,
+      paletteToken: classification.paletteToken,
+      iconToken: classification.iconToken,
+      isKnown: classification.isKnown
+    });
     return {
-      color: colorConfig.text,
-      bgColor: colorConfig.bg,
-      borderColor: colorConfig.border,
-      Icon: Icon2,
-      iconColor: colorConfig.text
+      color: presentation.textClass,
+      bgColor: presentation.bgClass,
+      borderColor: presentation.borderClass,
+      Icon: presentation.Icon,
+      iconColor: presentation.textClass,
+      displayName: presentation.displayName
     };
-  };
-  const normalizeIdleReasonLabel = useCallback((label) => {
-    return label.replace(/_/g, " ").trim();
   }, []);
-  const getIdleTimeRootCause = useCallback((clipId) => {
-    const classification = mergedClipClassifications[clipId];
-    if (!classification) return "processing";
-    if (classification.status === "processing") return "processing";
-    return classification.label || "processing";
-  }, [mergedClipClassifications]);
   const idleReasonOptions = useMemo(() => {
     const idleClips = clipMetadata["idle_time"] || [];
-    const uniqueReasons = /* @__PURE__ */ new Set();
+    const uniqueReasons = /* @__PURE__ */ new Map();
     idleClips.forEach((clip) => {
       const clipId = clip.clipId || clip.id;
       if (!clipId) return;
-      const reason = getIdleTimeRootCause(clipId);
-      if (!reason || reason === "processing") return;
-      uniqueReasons.add(normalizeIdleReasonLabel(reason));
+      const classification = getIdleTimeClassification(clipId);
+      if (!classification || classification.status === "processing" || !classification.label) {
+        return;
+      }
+      if (!uniqueReasons.has(classification.label)) {
+        uniqueReasons.set(classification.label, {
+          label: classification.label,
+          displayName: classification.displayName || classification.label.replace(/_/g, " "),
+          paletteToken: classification.paletteToken,
+          iconToken: classification.iconToken,
+          isKnown: classification.isKnown
+        });
+      }
     });
-    return Array.from(uniqueReasons).sort((a, b) => a.localeCompare(b));
-  }, [clipMetadata, getIdleTimeRootCause, normalizeIdleReasonLabel]);
+    return Array.from(uniqueReasons.values()).sort((a, b) => a.displayName.localeCompare(b.displayName));
+  }, [clipMetadata, getIdleTimeClassification]);
+  const selectedIdleReasonOption = useMemo(
+    () => idleReasonOptions.find((reason) => reason.label === idleLabelFilter) || null,
+    [idleReasonOptions, idleLabelFilter]
+  );
   const getClipBadge = useCallback((node) => {
     if (node.categoryId === "idle_time" || node.categoryId === "low_value") {
       return { text: "Idle", className: "bg-red-100 text-red-700" };
@@ -39361,6 +39668,10 @@ var FileManagerFilters = ({
         seededClassifications[clip.clipId] = {
           status: clip.classification_status,
           label: clip.classification_label || void 0,
+          displayName: clip.classification_display_name || void 0,
+          paletteToken: clip.classification_palette_token || void 0,
+          iconToken: clip.classification_icon_token || void 0,
+          isKnown: clip.classification_is_known ?? void 0,
           confidence: clip.classification_confidence ?? void 0
         };
       }
@@ -39744,7 +40055,7 @@ var FileManagerFilters = ({
     return slot ? slot.label : value;
   }, [timeSlots]);
   const isClipInTimeRange = useCallback((clipTimestamp) => {
-    if (!isTimeFilterActive || !startTime || !endTime) {
+    if (!startTime || !endTime) {
       return true;
     }
     try {
@@ -39770,9 +40081,8 @@ var FileManagerFilters = ({
       let filteredClips = categoryClips.filter((clip) => isClipInTimeRange(clip.clip_timestamp));
       if (category.id === "idle_time" && idleLabelFilter) {
         filteredClips = filteredClips.filter((clip) => {
-          const rootCause = getIdleTimeRootCause(clip.clipId || clip.id);
-          const normalizedRootCause = rootCause.replace(/_/g, " ");
-          return normalizedRootCause === idleLabelFilter;
+          const classification = getIdleTimeClassification(clip.clipId || clip.id);
+          return classification?.label === idleLabelFilter;
         });
       }
       const displayCount = isTimeFilterActive || category.id === "idle_time" && idleLabelFilter ? filteredClips.length : categoryCount;
@@ -39802,8 +40112,9 @@ var FileManagerFilters = ({
             clipPosition: index + 1,
             // Store 1-based position
             cycleTimeSeconds: cycleTime,
-            duration: clip.duration
+            duration: clip.duration,
             // Store duration for custom badge rendering
+            cycleItemCount: clip.cycle_item_count ?? null
           };
         });
         regularCategoryNodes.push({
@@ -40059,14 +40370,14 @@ var FileManagerFilters = ({
             /* @__PURE__ */ jsx("div", { className: `flex-shrink-0 mr-3 ${node.type === "category" || node.type === "percentile-category" ? "p-2 rounded-lg shadow-sm group-hover:scale-110 transition-transform duration-200" : "p-0.5"} ${colorClasses && (node.type === "category" || node.type === "percentile-category") ? `${colorClasses.bg} border border-white/60` : ""}`, children: node.type === "video" && (node.categoryId === "idle_time" || node.categoryId === "low_value") ? (
               // Show root cause icon for idle time clips
               (() => {
-                const rootCause = getIdleTimeRootCause(node.clipId || node.id);
-                if (rootCause === "processing") {
+                const classification = getIdleTimeClassification(node.clipId || node.id);
+                if (!classification || classification.status === "processing") {
                   return /* @__PURE__ */ jsx(Clock, { className: "h-3.5 w-3.5 text-purple-500", strokeWidth: 2.5 });
                 }
                 if (!idleTimeVlmEnabled && node.categoryId === "idle_time") {
                   return /* @__PURE__ */ jsx(Clock, { className: "h-3.5 w-3.5 text-purple-500", strokeWidth: 2.5 });
                 }
-                const config = getRootCauseConfig(rootCause.replace(/_/g, " "));
+                const config = getRootCauseConfig(classification);
                 if (config) {
                   const IconComponent = config.Icon;
                   return /* @__PURE__ */ jsx(IconComponent, { className: `h-3.5 w-3.5 ${config.iconColor}`, strokeWidth: 2.5 });
@@ -40088,10 +40399,10 @@ var FileManagerFilters = ({
                       return /* @__PURE__ */ jsx("div", { className: `inline-flex items-center px-2 py-0.5 rounded-md border text-[10px] font-bold ${isLong ? "bg-purple-50 text-purple-700 border-purple-200" : "bg-gray-50 text-gray-600 border-gray-200"}`, children: isLong ? "Long" : "Short" });
                     }
                     const clipId = node.clipId || node.id;
-                    const rootCause = getIdleTimeRootCause(clipId);
-                    const isProcessing = rootCause === "processing";
-                    const displayLabel = isProcessing ? "Analyzing..." : rootCause.replace(/_/g, " ");
-                    const config = isProcessing ? null : getRootCauseConfig(displayLabel);
+                    const classification = getIdleTimeClassification(clipId);
+                    const isProcessing = !classification || classification.status === "processing";
+                    const config = isProcessing ? null : getRootCauseConfig(classification);
+                    const displayLabel = config?.displayName || "Analyzing...";
                     const bgClass = config ? config.bgColor : "bg-slate-50";
                     const textClass = config ? config.color : "text-slate-700";
                     const borderClass = config ? config.borderColor : "border-slate-200";
@@ -40101,7 +40412,13 @@ var FileManagerFilters = ({
                   // Show badge for other clips
                   (() => {
                     const badge = getClipBadge(node);
-                    return /* @__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 });
+                    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 }),
+                      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
+                      ] }) : null
+                    ] });
                   })()
                 ) })
               ] }),
@@ -40189,7 +40506,7 @@ var FileManagerFilters = ({
         idleLabelFilter && activeFilter === "idle_time" && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 text-xs text-purple-600 bg-purple-50/60 px-3 py-1.5 rounded-lg border border-purple-100", children: [
           /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
             "Reason: ",
-            idleLabelFilter.replace(/_/g, " ")
+            selectedIdleReasonOption?.displayName || idleLabelFilter.replace(/_/g, " ")
           ] }),
           /* @__PURE__ */ jsx(
             "button",
@@ -40238,21 +40555,31 @@ var FileManagerFilters = ({
               /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }),
               "Loading idle reasons..."
             ] }) : idleReasonOptions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "px-3 py-4 text-sm text-slate-500", children: "No classified idle reasons found yet." }) : idleReasonOptions.map((reason) => {
-              const config = getRootCauseConfig(reason);
+              const config = getRootCauseConfig({
+                status: "classified",
+                label: reason.label,
+                displayName: reason.displayName,
+                paletteToken: reason.paletteToken,
+                iconToken: reason.iconToken,
+                isKnown: reason.isKnown
+              });
+              if (!config) {
+                return null;
+              }
               return /* @__PURE__ */ jsxs(
                 "button",
                 {
                   onClick: () => {
-                    setIdleLabelFilter(reason);
+                    setIdleLabelFilter(reason.label);
                     setShowIdleLabelFilterModal(false);
                   },
-                  className: `w-full px-3 py-2 text-left text-sm rounded-lg transition-colors flex items-center gap-2 mb-1 ${idleLabelFilter === reason ? "bg-purple-50 text-purple-700 font-medium" : "text-slate-700 hover:bg-slate-50"}`,
+                  className: `w-full px-3 py-2 text-left text-sm rounded-lg transition-colors flex items-center gap-2 mb-1 ${idleLabelFilter === reason.label ? "bg-purple-50 text-purple-700 font-medium" : "text-slate-700 hover:bg-slate-50"}`,
                   children: [
                     /* @__PURE__ */ jsx(config.Icon, { className: `h-3.5 w-3.5 ${config.iconColor}` }),
-                    reason
+                    reason.displayName
                   ]
                 },
-                reason
+                reason.label
               );
             }) })
           ]
@@ -40367,33 +40694,14 @@ var FileManagerFilters = ({
                   slot.value
                 )) })
               ] })
-            ] }) }),
-            /* @__PURE__ */ jsx("div", { className: "px-4 py-3 border-t border-slate-200 bg-white rounded-b-xl", children: /* @__PURE__ */ jsx(
-              "button",
-              {
-                onClick: () => {
-                  if (startTime && endTime) {
-                    setIsTimeFilterActive(true);
-                  }
-                  setShowTimeFilterModal(false);
-                  setStartSearchTerm("");
-                  setEndSearchTerm("");
-                },
-                disabled: !startTime || !endTime,
-                className: `
-                  w-full px-4 py-2 text-sm font-semibold rounded-lg transition-all
-                  ${startTime && endTime ? "bg-blue-600 text-white hover:bg-blue-700 active:scale-[0.98]" : "bg-slate-200 text-slate-400 cursor-not-allowed"}
-                `,
-                children: "Apply"
-              }
-            ) })
+            ] }) })
           ]
         }
       )
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "px-4 py-3 flex-1 min-h-0 overflow-y-auto scrollbar-thin", children: [
       /* @__PURE__ */ jsx("div", { className: "space-y-2", children: filterTree.map((node) => renderNode(node)) }),
-      filterTree.length === 0 && isTimeFilterActive && (startTime || endTime) && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
+      filterTree.length === 0 && (startTime || endTime) && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
         /* @__PURE__ */ jsx("div", { className: "text-slate-300 mb-4", children: /* @__PURE__ */ jsx(Clock, { className: "h-12 w-12 mx-auto" }) }),
         /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-slate-700 mb-2", children: "No clips found" }),
         /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500 mb-4", children: "No clips match the selected time range" }),
@@ -40403,18 +40711,19 @@ var FileManagerFilters = ({
             onClick: () => {
               setStartTime("");
               setEndTime("");
+              setIsTimeFilterActive(false);
             },
             className: "inline-flex items-center px-4 py-2 bg-blue-50 text-blue-600 text-sm font-medium rounded-lg hover:bg-blue-100 transition-colors duration-200",
             children: "Clear time filter"
           }
         )
       ] }),
-      filterTree.length === 0 && !isTimeFilterActive && categories.length === 0 && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
+      filterTree.length === 0 && !startTime && !endTime && categories.length === 0 && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
         /* @__PURE__ */ jsx("div", { className: "text-slate-300 mb-4", children: /* @__PURE__ */ jsx(HelpCircle, { className: "h-12 w-12 mx-auto" }) }),
         /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-slate-700 mb-2", children: "No clip types available" }),
         /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500", children: "Loading clip categories..." })
       ] }),
-      filterTree.length === 0 && !isTimeFilterActive && categories.length > 0 && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
+      filterTree.length === 0 && !startTime && !endTime && categories.length > 0 && /* @__PURE__ */ jsxs("div", { className: "text-center py-12", children: [
         /* @__PURE__ */ jsx("div", { className: "text-slate-300 mb-4", children: /* @__PURE__ */ jsx(Play, { className: "h-12 w-12 mx-auto" }) }),
         /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-slate-700 mb-2", children: "No clips available" }),
         /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500", children: "No clips found for the selected time period" })
@@ -40818,6 +41127,34 @@ function useClipsRealtimeUpdates({
     hasNewClips: newClipsNotification !== null && newClipsNotification.count > 0
   };
 }
+var parseFiniteNumber2 = (value) => {
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return value;
+  }
+  if (typeof value === "string") {
+    const parsed = Number(value);
+    if (Number.isFinite(parsed)) {
+      return parsed;
+    }
+  }
+  return null;
+};
+var getMultiCycleItemCount = (clip) => {
+  if (!clip || clip.categoryId !== "cycle_completion") {
+    return null;
+  }
+  const cycleItemCount = parseFiniteNumber2(clip.cycle_item_count);
+  return cycleItemCount !== null && cycleItemCount > 1 ? cycleItemCount : null;
+};
+var OVERLAY_ICON_COLOR_BY_PALETTE = {
+  red: "text-red-300",
+  amber: "text-amber-300",
+  blue: "text-blue-300",
+  violet: "text-violet-300",
+  emerald: "text-emerald-300",
+  cyan: "text-cyan-300",
+  slate: "text-slate-200"
+};
 var BottlenecksContent = ({
   workspaceId,
   workspaceName,
@@ -41558,6 +41895,10 @@ var BottlenecksContent = ({
             classificationUpdates[clipId] = {
               status,
               label: clip.classification_label || void 0,
+              displayName: clip.classification_display_name || void 0,
+              paletteToken: clip.classification_palette_token || void 0,
+              iconToken: clip.classification_icon_token || void 0,
+              isKnown: clip.classification_is_known ?? void 0,
               confidence: clip.classification_confidence ?? void 0
             };
           });
@@ -42342,79 +42683,13 @@ var BottlenecksContent = ({
       return () => window.removeEventListener("keydown", handleEscape);
     }
   }, [isFullscreen, exitFullscreen]);
-  const ROOT_CAUSE_CONFIG = {
-    "Machine Breakdown": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: AlertTriangle,
-      iconColor: "text-red-500",
-      // Standard red for high visibility on dark
-      dotColor: "bg-red-600"
-    },
-    "Other": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: HelpCircle,
-      iconColor: "text-gray-400",
-      dotColor: "bg-gray-500"
-    },
-    "Power Outage": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: Zap,
-      iconColor: "text-red-400",
-      // Lighter red
-      dotColor: "bg-red-500"
-    },
-    "Worker Absent": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: UserX,
-      iconColor: "text-red-400",
-      // Lighter red
-      dotColor: "bg-red-500"
-    },
-    "Material Shortage": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: Package,
-      iconColor: "text-red-300",
-      // Even lighter red
-      dotColor: "bg-red-400"
-    },
-    "Quality Issue": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: XCircle,
-      iconColor: "text-red-300",
-      // Even lighter red
-      dotColor: "bg-red-400"
-    },
-    "Scheduled Maintenance": {
-      color: "text-white",
-      bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-transparent",
-      Icon: Wrench,
-      iconColor: "text-red-200",
-      // Very light red
-      dotColor: "bg-red-300"
-    }
-  };
-  const getIdleTimeRootCause = useCallback((video) => {
+  const getIdleTimeClassification = useCallback((video) => {
     if (video.type !== "idle_time") return null;
     const videoId = video.id || video.clipId;
-    if (!videoId) return "processing";
+    if (!videoId) return null;
     const classification = clipClassifications[videoId];
-    console.log(`[getIdleTimeRootCause] Looking up ${videoId}: `, classification);
-    if (!classification) return "processing";
-    if (classification.status === "processing") return "processing";
-    return classification.label || "processing";
+    console.log(`[getIdleTimeClassification] Looking up ${videoId}: `, classification);
+    return classification || null;
   }, [clipClassifications]);
   const getIdleTimeConfidence = useCallback((video) => {
     if (video.type !== "idle_time") return null;
@@ -42425,36 +42700,35 @@ var BottlenecksContent = ({
     if (classification.status === "processing") return null;
     return classification.confidence ?? null;
   }, [clipClassifications]);
-  const formatDisplayLabel = useCallback((label) => {
-    return label.replace(/_/g, " ");
-  }, []);
-  const getRootCauseConfig = useCallback((rootCause) => {
-    if (!rootCause) return null;
-    if (rootCause === "processing") {
+  const getRootCauseConfig = useCallback((classification) => {
+    if (!classification || classification.status === "processing") {
       return {
         color: "text-white",
         bgColor: "bg-black/60 backdrop-blur-sm",
-        borderColor: "border-gray-500/30",
+        borderColor: "border-white/10",
         Icon: Clock,
-        iconColor: "text-purple-500",
-        dotColor: "bg-gray-400",
+        iconColor: "text-purple-300",
+        dotColor: "bg-purple-400",
         displayName: "Analyzing..."
       };
     }
-    const hardcodedConfig = ROOT_CAUSE_CONFIG[rootCause];
-    if (hardcodedConfig) {
-      return hardcodedConfig;
-    }
+    const presentation = getIdleReasonPresentation({
+      label: classification.label,
+      displayName: classification.displayName,
+      paletteToken: classification.paletteToken,
+      iconToken: classification.iconToken,
+      isKnown: classification.isKnown
+    });
     return {
       color: "text-white",
       bgColor: "bg-black/60 backdrop-blur-sm",
-      borderColor: "border-purple-500/30",
-      Icon: Tag,
-      iconColor: "text-purple-400",
-      dotColor: "bg-purple-400",
-      displayName: formatDisplayLabel(rootCause)
+      borderColor: "border-white/10",
+      Icon: presentation.Icon,
+      iconColor: OVERLAY_ICON_COLOR_BY_PALETTE[presentation.paletteToken] || OVERLAY_ICON_COLOR_BY_PALETTE.slate,
+      dotColor: presentation.bgClass,
+      displayName: presentation.displayName
     };
-  }, [formatDisplayLabel]);
+  }, []);
   const getClipTypeLabel = useCallback((video) => {
     if (!video) return "";
     const currentFilter = activeFilterRef.current;
@@ -42619,15 +42893,15 @@ var BottlenecksContent = ({
         (currentVideo.type === "cycle_completion" || currentVideo.type === "bottleneck" && currentVideo.description.toLowerCase().includes("cycle time")) && currentVideo.cycle_time_seconds || currentVideo.type === "idle_time" || currentVideo.type === "low_value" ? currentVideo.type === "idle_time" ? (
           // Show full colored badge for idle time
           (() => {
-            const rootCause = getIdleTimeRootCause(currentVideo);
+            const classification = getIdleTimeClassification(currentVideo);
             const confidence = getIdleTimeConfidence(currentVideo);
-            const config = getRootCauseConfig(rootCause);
+            const config = getRootCauseConfig(classification);
             if (!config) return null;
             const IconComponent = config.Icon;
             return /* @__PURE__ */ jsxs(Fragment, { children: [
-              idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-3 left-3 z-10", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-md border ${config.bgColor} ${config.borderColor} shadow-lg`, children: [
-                /* @__PURE__ */ jsx(IconComponent, { className: `h-3.5 w-3.5 ${config.iconColor}`, strokeWidth: 2.5 }),
-                /* @__PURE__ */ jsx("span", { className: `font-medium text-xs ${config.color}`, children: config.displayName || (rootCause ? formatDisplayLabel(rootCause) : "Analyzing...") })
+              idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-3 left-3 z-10", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex max-w-[18rem] items-center gap-1.5 rounded-md border px-2.5 py-1.5 shadow-lg ${config.bgColor} ${config.borderColor}`, children: [
+                /* @__PURE__ */ jsx(IconComponent, { className: `h-3.5 w-3.5 flex-shrink-0 ${config.iconColor}`, strokeWidth: 2.5 }),
+                /* @__PURE__ */ jsx("span", { className: `truncate font-medium text-xs ${config.color}`, children: config.displayName || "Analyzing..." })
               ] }) }),
               idleTimeVlmEnabled && confidence !== null && (() => {
                 const confidencePercent = confidence * 100;
@@ -42662,9 +42936,9 @@ var BottlenecksContent = ({
           currentVideo.type === "idle_time" ? (
             // Show full colored badge for idle time
             (() => {
-              const rootCause = getIdleTimeRootCause(currentVideo);
+              const classification = getIdleTimeClassification(currentVideo);
               const confidence = getIdleTimeConfidence(currentVideo);
-              const config = getRootCauseConfig(rootCause);
+              const config = getRootCauseConfig(classification);
               if (!config) return null;
               const IconComponent = config.Icon;
               return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -42673,9 +42947,9 @@ var BottlenecksContent = ({
                   (confidence * 100).toFixed(0),
                   "%"
                 ] }) }) }),
-                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-3 right-3 z-10", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-md border ${config.bgColor} ${config.borderColor} shadow-lg`, children: [
-                  /* @__PURE__ */ jsx(IconComponent, { className: `h-3.5 w-3.5 ${config.iconColor}`, strokeWidth: 2.5 }),
-                  /* @__PURE__ */ jsx("span", { className: `font-medium text-xs ${config.color}`, children: rootCause })
+                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-3 right-3 z-10", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex max-w-[18rem] items-center gap-1.5 rounded-md border px-2.5 py-1.5 shadow-lg ${config.bgColor} ${config.borderColor}`, children: [
+                  /* @__PURE__ */ jsx(IconComponent, { className: `h-3.5 w-3.5 flex-shrink-0 ${config.iconColor}`, strokeWidth: 2.5 }),
+                  /* @__PURE__ */ jsx("span", { className: `truncate font-medium text-xs ${config.color}`, children: config.displayName || "Analyzing..." })
                 ] }) })
               ] });
             })()
@@ -42715,6 +42989,7 @@ var BottlenecksContent = ({
             /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: "No clips found" })
           ] }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: triageClips.map((clip, index) => {
             const isIdleTime = clip.categoryId === "idle_time";
+            const cycleItemCount = getMultiCycleItemCount(clip);
             const timeString = isIdleTime && clip.idle_start_time && clip.idle_end_time ? formatIdleTimeRange(clip.idle_start_time, clip.idle_end_time, timezone) : new Date(clip.clip_timestamp).toLocaleTimeString("en-US", {
               hour12: true,
               hour: "numeric",
@@ -42767,15 +43042,15 @@ var BottlenecksContent = ({
                   // Idle time clips - show root cause label below time
                   (() => {
                     const clipId = clip.id || clip.clipId;
-                    const rootCause = getIdleTimeRootCause({
+                    const classification = getIdleTimeClassification({
                       id: clipId,
                       type: "idle_time",
                       creation_timestamp: clip.clip_timestamp
                     });
-                    console.log(`[BottlenecksContent] Sidebar clip ${clipId}: rootCause=${rootCause}, classification=`, clipClassifications[clipId]);
-                    const config = getRootCauseConfig(rootCause);
+                    console.log(`[BottlenecksContent] Sidebar clip ${clipId}: classification=`, clipClassifications[clipId]);
+                    const config = getRootCauseConfig(classification);
                     if (!config) {
-                      console.log(`[BottlenecksContent] No config found for rootCause: ${rootCause}`);
+                      console.log(`[BottlenecksContent] No config found for classification on clip: ${clipId}`);
                       return null;
                     }
                     const IconComponent = config.Icon;
@@ -42790,7 +43065,7 @@ var BottlenecksContent = ({
                         ] }) })
                       ] }),
                       /* @__PURE__ */ jsx("div", { className: "pl-6", children: idleTimeVlmEnabled ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center px-2 py-0.5 rounded-md border text-xs font-medium bg-gray-50 text-gray-700 border-gray-200", children: (() => {
-                        const displayText = config.displayName || (rootCause ? formatDisplayLabel(rootCause) : "Analyzing...");
+                        const displayText = config.displayName || "Analyzing...";
                         console.log(`[BottlenecksContent] Displaying label: "${displayText}" for clip ${clipId}`);
                         return displayText;
                       })() }) : (() => {
@@ -42810,7 +43085,13 @@ var BottlenecksContent = ({
                       clip.duration ? `${clip.duration.toFixed(1)}s` : "N/A",
                       ")"
                     ] }) }),
-                    /* @__PURE__ */ jsx("span", { className: `px-2 py-1 text-xs font-semibold rounded ${badgeColor}`, children: badgeText })
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                      cycleItemCount ? /* @__PURE__ */ jsxs("span", { className: "px-2 py-1 text-xs font-semibold rounded border border-blue-200 bg-blue-100 text-blue-700", children: [
+                        "x",
+                        cycleItemCount
+                      ] }) : null,
+                      /* @__PURE__ */ jsx("span", { className: `px-2 py-1 text-xs font-semibold rounded ${badgeColor}`, children: badgeText })
+                    ] })
                   ] })
                 )
               },
@@ -42903,15 +43184,15 @@ var BottlenecksContent = ({
           (currentVideo.type === "cycle_completion" || currentVideo.type === "bottleneck" && currentVideo.description.toLowerCase().includes("cycle time")) && currentVideo.cycle_time_seconds || currentVideo.type === "idle_time" || currentVideo.type === "low_value" ? currentVideo.type === "idle_time" ? (
             // Show full colored badge for idle time
             (() => {
-              const rootCause = getIdleTimeRootCause(currentVideo);
+              const classification = getIdleTimeClassification(currentVideo);
               const confidence = getIdleTimeConfidence(currentVideo);
-              const config = getRootCauseConfig(rootCause);
+              const config = getRootCauseConfig(classification);
               if (!config) return null;
               const IconComponent = config.Icon;
               return /* @__PURE__ */ jsxs(Fragment, { children: [
-                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-4 left-4 z-50", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex items-center gap-2 px-3 py-2 rounded-md border ${config.bgColor} ${config.borderColor} shadow-lg`, children: [
-                  /* @__PURE__ */ jsx(IconComponent, { className: `h-4 w-4 ${config.iconColor}`, strokeWidth: 2.5 }),
-                  /* @__PURE__ */ jsx("span", { className: `font-medium text-sm ${config.color}`, children: rootCause })
+                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-4 left-4 z-50", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex max-w-[20rem] items-center gap-2 rounded-md border px-3 py-2 shadow-lg ${config.bgColor} ${config.borderColor}`, children: [
+                  /* @__PURE__ */ jsx(IconComponent, { className: `h-4 w-4 flex-shrink-0 ${config.iconColor}`, strokeWidth: 2.5 }),
+                  /* @__PURE__ */ jsx("span", { className: `truncate font-medium text-sm ${config.color}`, children: config.displayName || "Analyzing..." })
                 ] }) }),
                 idleTimeVlmEnabled && confidence !== null && /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-50", children: /* @__PURE__ */ jsx("div", { className: "inline-flex items-center gap-1.5 px-3 py-2 rounded-lg bg-black/70 backdrop-blur-sm shadow-lg border border-white/10", children: /* @__PURE__ */ jsxs("span", { className: "font-medium text-sm text-white", children: [
                   "AI Confidence: ",
@@ -42933,9 +43214,9 @@ var BottlenecksContent = ({
           ] }) }) : currentVideo.type === "idle_time" ? (
             // Show full colored badge for idle time
             (() => {
-              const rootCause = getIdleTimeRootCause(currentVideo);
+              const classification = getIdleTimeClassification(currentVideo);
               const confidence = getIdleTimeConfidence(currentVideo);
-              const config = getRootCauseConfig(rootCause);
+              const config = getRootCauseConfig(classification);
               if (!config) return null;
               const IconComponent = config.Icon;
               return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -42944,9 +43225,9 @@ var BottlenecksContent = ({
                   (confidence * 100).toFixed(0),
                   "%"
                 ] }) }) }),
-                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-20 z-50", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex items-center gap-2 px-3 py-2 rounded-md border ${config.bgColor} ${config.borderColor} shadow-lg`, children: [
-                  /* @__PURE__ */ jsx(IconComponent, { className: `h-4 w-4 ${config.iconColor}`, strokeWidth: 2.5 }),
-                  /* @__PURE__ */ jsx("span", { className: `font-medium text-sm ${config.color}`, children: rootCause })
+                idleTimeVlmEnabled && /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-20 z-50", children: /* @__PURE__ */ jsxs("div", { className: `inline-flex max-w-[20rem] items-center gap-2 rounded-md border px-3 py-2 shadow-lg ${config.bgColor} ${config.borderColor}`, children: [
+                  /* @__PURE__ */ jsx(IconComponent, { className: `h-4 w-4 flex-shrink-0 ${config.iconColor}`, strokeWidth: 2.5 }),
+                  /* @__PURE__ */ jsx("span", { className: `truncate font-medium text-sm ${config.color}`, children: config.displayName || "Analyzing..." })
                 ] }) })
               ] });
             })()
@@ -44895,16 +45176,6 @@ var LineHistoryCalendar = ({
   ] });
 };
 var LineHistoryCalendar_default = LineHistoryCalendar;
-var STATIC_COLORS = {
-  "Operator Absent": "#dc2626",
-  // red-600 - Critical/Urgent
-  "No Material": "#f59e0b",
-  // amber-500 - Warning/Supply Chain
-  "Machine Downtime": "#3b82f6",
-  // blue-500 - Scheduled/Technical
-  "Operator Idle": "#8b5cf6"
-  // violet-500 - Low Priority/Behavioral
-};
 var PRODUCTIVE_COLOR = "#00AB45";
 var IDLE_COLOR = "#e5e7eb";
 var formatDuration = (seconds) => {
@@ -44927,19 +45198,21 @@ var formatDuration = (seconds) => {
   }
   return parts.join(" ");
 };
-var getColorForEntry = (name, index) => {
-  const normalized = name.trim().toLowerCase();
+var getColorForEntry = (entry) => {
+  const normalized = entry.name.trim().toLowerCase();
   if (normalized === "productive" || normalized === "productive time") {
     return PRODUCTIVE_COLOR;
   }
   if (normalized === "idle" || normalized === "idle time") {
     return IDLE_COLOR;
   }
-  if (STATIC_COLORS[name]) {
-    return STATIC_COLORS[name];
-  }
-  const snakeCaseName = name.replace(/ /g, "_");
-  return getReasonColor(snakeCaseName, index);
+  return getIdleReasonHexColor({
+    label: entry.reasonKey || entry.name,
+    displayName: entry.displayName || entry.name,
+    paletteToken: entry.paletteToken,
+    iconToken: entry.iconToken,
+    isKnown: entry.isKnown
+  });
 };
 var CustomTooltip = ({ active, payload, hideTotalDuration }) => {
   if (active && payload && payload.length) {
@@ -44953,8 +45226,8 @@ var CustomTooltip = ({ active, payload, hideTotalDuration }) => {
     const hasContributors = contributors.length > 0;
     return /* @__PURE__ */ jsxs("div", { className: "bg-white p-3 border border-gray-100 shadow-lg rounded-lg text-xs z-50 min-w-[280px]", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-2 mb-2 border-b border-slate-100", children: [
-        /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: payload[0].payload.fill || getColorForEntry(payload[0].name, 0) } }),
-        /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800 text-[13px]", children: payload[0].name.replace(/_/g, " ") })
+        /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: payload[0].payload.fill || getColorForEntry(payload[0].payload) } }),
+        /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800 text-[13px]", children: datum?.displayName || payload[0].name.replace(/_/g, " ") })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 pb-1", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-4", children: [
@@ -45015,7 +45288,8 @@ var IdleTimeReasonChartComponent = ({
   isLoading = false,
   error = null,
   hideTotalDuration = false,
-  updateAnimation = "replay"
+  updateAnimation = "replay",
+  variant = "pie"
 }) => {
   const [activeData, setActiveData] = React141__default.useState([]);
   React141__default.useEffect(() => {
@@ -45060,6 +45334,73 @@ var IdleTimeReasonChartComponent = ({
   if (!data || data.length === 0) {
     return /* @__PURE__ */ jsx(EmptyState, { message: "No Idle Time reasons available" });
   }
+  if (variant === "bar") {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "w-full h-full flex items-center overflow-visible focus:outline-none",
+        tabIndex: -1,
+        onFocus: (e) => e.currentTarget.blur(),
+        children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs(
+          BarChart$1,
+          {
+            data: activeData,
+            layout: "vertical",
+            margin: { top: 5, right: 30, left: 10, bottom: 5 },
+            barCategoryGap: 8,
+            barGap: 2,
+            children: [
+              /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3", horizontal: false, vertical: true }),
+              /* @__PURE__ */ jsx(
+                XAxis,
+                {
+                  type: "number",
+                  hide: false,
+                  domain: [0, 100],
+                  ticks: [0, 20, 40, 60, 80, 100],
+                  tickFormatter: (val) => `${val}%`,
+                  tick: { fontSize: 10, fill: "#6b7280" },
+                  axisLine: { stroke: "#e5e7eb" },
+                  tickLine: false
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                YAxis,
+                {
+                  type: "category",
+                  dataKey: "name",
+                  tick: { fontSize: 11, fill: "#4b5563" },
+                  tickFormatter: (val) => typeof val === "string" ? val.replace(/_/g, " ") : val,
+                  width: 90,
+                  axisLine: false,
+                  tickLine: false
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Tooltip,
+                {
+                  cursor: { fill: "rgba(0,0,0,0.04)" },
+                  content: /* @__PURE__ */ jsx(CustomTooltip, { hideTotalDuration })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Bar,
+                {
+                  dataKey: "value",
+                  radius: [0, 4, 4, 0],
+                  animationDuration: 1500,
+                  animationEasing: "ease-out",
+                  isAnimationActive: true,
+                  barSize: 20,
+                  children: activeData.map((entry, index) => /* @__PURE__ */ jsx(Cell, { fill: getColorForEntry(entry) }, `cell-${index}`))
+                }
+              )
+            ]
+          }
+        ) })
+      }
+    );
+  }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx("style", { children: `
         .recharts-wrapper:focus,
@@ -45121,7 +45462,7 @@ var IdleTimeReasonChartComponent = ({
                     children: activeData.map((entry, index) => /* @__PURE__ */ jsx(
                       Cell,
                       {
-                        fill: getColorForEntry(entry.name, index),
+                        fill: getColorForEntry(entry),
                         strokeWidth: 0
                       },
                       `cell-${index}`
@@ -45138,10 +45479,10 @@ var IdleTimeReasonChartComponent = ({
               "span",
               {
                 className: "inline-block w-2.5 h-2.5 rounded-full mr-1.5 mt-0.5 flex-shrink-0",
-                style: { backgroundColor: getColorForEntry(entry.name, index) }
+                style: { backgroundColor: getColorForEntry(entry) }
               }
             ),
-            /* @__PURE__ */ jsx("span", { className: "text-gray-600 leading-tight text-[11px] sm:text-xs break-words", children: entry.name.replace(/_/g, " ") })
+            /* @__PURE__ */ jsx("span", { className: "text-gray-600 leading-tight text-[11px] sm:text-xs break-words", children: entry.displayName || entry.name.replace(/_/g, " ") })
           ] }, `item-${index}`)) }) })
         ]
       }
@@ -45266,7 +45607,6 @@ var LineMonthlyHistory = ({
   const { isIdleTimeVlmEnabled } = useIdleTimeVlmConfig();
   const idleTimeVlmEnabled = isIdleTimeVlmEnabled(lineId);
   const isUptimeMode = monitoringMode === "uptime";
-  const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
   const chartKey = useMemo(() => `${lineId}-${month}-${year}-${selectedShiftId}-${rangeStart}-${rangeEnd}`, [lineId, month, year, selectedShiftId, rangeStart, rangeEnd]);
   const monthBounds = useMemo(() => getMonthKeyBounds(year, month), [year, month]);
   const normalizedRange = useMemo(() => {
@@ -45314,20 +45654,20 @@ var LineMonthlyHistory = ({
     { efficiency: 0, underperforming: 0, totalWorkspaces: 0, count: 0 }
   );
   const avgEfficiency = averages.count > 0 ? averages.efficiency / averages.count : 0;
-  const { underperformingDays, totalDays } = (analysisMonthlyData || []).reduce(
+  const outputAverages = (analysisMonthlyData || []).reduce(
     (acc, day) => {
       const shiftData = getShiftData2(day, selectedShiftId);
       if (!shiftData || !hasRealData(shiftData)) {
         return acc;
       }
-      const status = getEfficiencyColor(shiftData.avg_efficiency || 0, effectiveLegend);
       return {
-        totalDays: acc.totalDays + 1,
-        underperformingDays: acc.underperformingDays + (status === "red" ? 1 : 0)
+        output: acc.output + (shiftData.output || 0),
+        count: acc.count + 1
       };
     },
-    { underperformingDays: 0, totalDays: 0 }
+    { output: 0, count: 0 }
   );
+  const avgOutput = outputAverages.count > 0 ? outputAverages.output / outputAverages.count : 0;
   const uptimeSummary = useMemo(() => {
     if (!isUptimeMode) return null;
     const validDays = (analysisMonthlyData || []).map((day) => getShiftData2(day, selectedShiftId)).filter((shiftData) => shiftData && hasRealData(shiftData)).map((shiftData) => ({ shiftData, totals: getUptimeTotals(shiftData) }));
@@ -45360,6 +45700,10 @@ var LineMonthlyHistory = ({
   const efficiencyImproved = efficiencyDelta >= 0;
   const EfficiencyTrendIcon = efficiencyImproved ? ArrowUp : ArrowDown;
   const efficiencyTrendText = `${Math.abs(efficiencyDelta).toFixed(1)}%`;
+  const outputDelta = trendSummary?.avg_daily_output?.delta_pp ?? 0;
+  const outputImproved = outputDelta >= 0;
+  const OutputTrendIcon = outputImproved ? ArrowUp : ArrowDown;
+  const outputTrendText = `${Math.abs(outputDelta).toFixed(1)}%`;
   const utilizationDelta = efficiencyDelta;
   const utilizationImproved = utilizationDelta >= 0;
   const UtilizationTrendIcon = utilizationImproved ? ArrowUp : ArrowDown;
@@ -45644,12 +45988,17 @@ var LineMonthlyHistory = ({
             ] })
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
-            /* @__PURE__ */ jsx("h3", { className: "text-sm font-bold text-gray-700 mb-2", children: "No. of underperforming days" }),
-            /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 flex-nowrap", children: /* @__PURE__ */ jsxs("div", { className: "text-xl font-bold text-gray-900", children: [
-              underperformingDays,
-              "/",
-              totalDays
-            ] }) })
+            /* @__PURE__ */ jsx("h3", { className: "text-sm font-bold text-gray-700 mb-2", children: "Avg. Output" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-nowrap", children: [
+              /* @__PURE__ */ jsx("div", { className: "text-xl font-bold text-gray-900", children: Math.round(avgOutput).toLocaleString() }),
+              /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${outputImproved ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"} px-1.5 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
+                /* @__PURE__ */ jsx(OutputTrendIcon, { className: "w-3 h-3" }),
+                /* @__PURE__ */ jsxs("span", { children: [
+                  outputTrendText,
+                  " vs last month"
+                ] })
+              ] })
+            ] })
           ] })
         ] }),
         isUptimeMode ? /* @__PURE__ */ jsxs("div", { className: `grid grid-cols-1 ${idleTimeVlmEnabled ? "sm:grid-cols-2" : "sm:grid-cols-1"} gap-2 sm:gap-3 lg:gap-4`, children: [
@@ -46168,11 +46517,6 @@ var LineMonthlyPdfGenerator = ({
           doc.text("Working Days:", 25, kpiStartY + kpiSpacing * 2);
           doc.setFont("helvetica", "bold");
           doc.text(`${outputMetrics.totalDays} days`, 120, kpiStartY + kpiSpacing * 2);
-          createKPIBox(kpiStartY + kpiSpacing * 3);
-          doc.setFont("helvetica", "normal");
-          doc.text("Underperforming Days:", 25, kpiStartY + kpiSpacing * 3);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${outputMetrics.underperformingDays} of ${outputMetrics.totalDays}`, 120, kpiStartY + kpiSpacing * 3);
         }
       } else {
         doc.setFontSize(12);
@@ -47750,7 +48094,8 @@ var WorkspaceMonthlyHistory = ({
   availableShifts,
   monthlyDataLoading = false,
   className = "",
-  trendSummary
+  trendSummary,
+  isAssemblyWorkspace = false
 }) => {
   const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
   const isUptimeMode = monitoringMode === "uptime";
@@ -47989,12 +48334,8 @@ var WorkspaceMonthlyHistory = ({
   }, [analysisMonthlyData, selectedShiftId, isUptimeMode, shiftWorkSeconds]);
   const efficiencyDelta = trendSummary?.avg_efficiency?.delta_pp ?? 0;
   const efficiencyImproved = efficiencyDelta >= 0;
-  const outputDeltaRaw = trendSummary?.avg_daily_output?.delta_pp ?? 0;
   const cycleDeltaRaw = trendSummary?.avg_cycle_time?.delta_seconds ?? 0;
-  const outputPrev = trendSummary?.avg_daily_output?.previous ?? 0;
   const cyclePrev = trendSummary?.avg_cycle_time?.previous ?? 0;
-  const outputDelta = outputPrev ? outputDeltaRaw / outputPrev * 100 : 0;
-  const outputImproved = outputDelta >= 0;
   const cycleDelta = cyclePrev ? cycleDeltaRaw / cyclePrev * 100 : 0;
   const cycleWorsened = cycleDelta > 0;
   const utilizationDelta = efficiencyDelta;
@@ -48074,7 +48415,7 @@ var WorkspaceMonthlyHistory = ({
       shift.id
     )) }) }),
     /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
-      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-4 sm:p-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-4 sm:p-6 flex flex-col", children: [
         /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 gap-2", children: WEEKDAYS3.map((day, idx) => /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-gray-500 dark:text-gray-400 text-center", children: day }, day)) }),
         /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 gap-2 mt-6", children: calendarData.calendar.map((day, index) => {
           const dayNumber = index >= calendarData.startOffset ? index - calendarData.startOffset + 1 : null;
@@ -48162,8 +48503,32 @@ var WorkspaceMonthlyHistory = ({
           ) }, index);
         }) })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 h-full", children: [
+        isAssemblyWorkspace && !isUptimeMode ? /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-600 mb-1", children: "Avg Idle Time" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-nowrap", children: [
+              /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold text-gray-900", children: formatIdleTime(metrics2?.avgIdleTime ?? 0) }),
+              /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${idleImproved ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"} px-2 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
+                idleImproved ? /* @__PURE__ */ jsx(ArrowDown, { className: "w-3 h-3" }) : /* @__PURE__ */ jsx(ArrowUp, { className: "w-3 h-3" }),
+                /* @__PURE__ */ jsx("span", { children: idleTrendText })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-600 mb-1", children: "Avg Cycle Time" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-nowrap", children: [
+              /* @__PURE__ */ jsxs("div", { className: "text-2xl font-bold text-gray-900", children: [
+                metrics2?.avgCycleTime ?? 0,
+                "s"
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${cycleWorsened ? "bg-red-50 text-red-600" : "bg-emerald-50 text-emerald-600"} px-2 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
+                cycleWorsened ? /* @__PURE__ */ jsx(ArrowUp, { className: "w-3 h-3" }) : /* @__PURE__ */ jsx(ArrowDown, { className: "w-3 h-3" }),
+                /* @__PURE__ */ jsx("span", { children: `${Math.abs(cycleDelta).toFixed(1)}% vs last month` })
+              ] })
+            ] })
+          ] })
+        ] }) : /* @__PURE__ */ jsxs("div", { className: `grid grid-cols-1 gap-4 ${isUptimeMode ? "md:grid-cols-3" : "md:grid-cols-2"}`, children: [
           /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
             /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-600 mb-1", children: isUptimeMode ? "Avg Utilization" : "Avg Efficiency" }),
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-nowrap", children: [
@@ -48177,16 +48542,13 @@ var WorkspaceMonthlyHistory = ({
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-600 mb-1", children: isUptimeMode ? "Avg Idle Time" : "Avg Daily Output" }),
+          isUptimeMode && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col justify-between", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-600 mb-1", children: "Avg Idle Time" }),
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-nowrap", children: [
-              /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold text-gray-900", children: isUptimeMode ? formatIdleTime(metrics2?.avgIdleTime ?? 0) : metrics2?.avgDailyOutput?.toLocaleString?.() ?? 0 }),
-              isUptimeMode ? /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${idleImproved ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"} px-2 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
+              /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold text-gray-900", children: formatIdleTime(metrics2?.avgIdleTime ?? 0) }),
+              /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${idleImproved ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"} px-2 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
                 idleImproved ? /* @__PURE__ */ jsx(ArrowDown, { className: "w-3 h-3" }) : /* @__PURE__ */ jsx(ArrowUp, { className: "w-3 h-3" }),
                 /* @__PURE__ */ jsx("span", { children: idleTrendText })
-              ] }) : /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-1 ${outputImproved ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"} px-2 py-0.5 rounded-full text-[10px] font-medium whitespace-nowrap flex-shrink-0`, children: [
-                outputImproved ? /* @__PURE__ */ jsx(ArrowUp, { className: "w-3 h-3" }) : /* @__PURE__ */ jsx(ArrowDown, { className: "w-3 h-3" }),
-                /* @__PURE__ */ jsx("span", { children: `${Math.abs(outputDelta).toFixed(1)}% vs last month` })
               ] })
             ] })
           ] }),
@@ -48208,9 +48570,9 @@ var WorkspaceMonthlyHistory = ({
           ] })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: `grid grid-cols-1 ${idleTimeVlmEnabled ? "sm:grid-cols-2" : "sm:grid-cols-1"} gap-4`, children: [
-          /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex flex-col", children: [
             /* @__PURE__ */ jsx("h3", { className: "text-lg font-bold text-gray-700 mb-3 text-left", children: isUptimeMode ? "Utilization" : "Time Utilization" }),
-            pieChartData.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "w-full h-[160px] flex items-center overflow-hidden", children: [
+            pieChartData.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "w-full flex items-center overflow-hidden h-[160px]", children: [
               /* @__PURE__ */ jsx("div", { className: "flex-1 h-full min-w-0 relative flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "relative w-full aspect-square max-h-full", style: { maxWidth: "min(100%, 280px)", containerType: "inline-size" }, children: [
                 /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsx(PieChart, { children: /* @__PURE__ */ jsx(
                   Pie,
@@ -48283,7 +48645,7 @@ var WorkspaceMonthlyHistory = ({
               ] }) })
             ] }) : /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-[160px]", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-400", children: "No data available" }) })
           ] }),
-          idleTimeVlmEnabled && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 h-full", children: [
+          idleTimeVlmEnabled && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 h-full flex flex-col", children: [
             /* @__PURE__ */ jsx("h3", { className: "text-lg font-bold text-gray-700 mb-3 text-left", children: "Idle Time Breakdown" }),
             /* @__PURE__ */ jsx("div", { className: "h-[160px]", children: /* @__PURE__ */ jsx(
               IdleTimeReasonChart,
@@ -48295,7 +48657,7 @@ var WorkspaceMonthlyHistory = ({
             ) })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex-1", children: [
+        (!isAssemblyWorkspace || isUptimeMode) && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-100 p-4 flex-1", children: [
           /* @__PURE__ */ jsx("h3", { className: "text-lg font-bold text-gray-700 mb-3 text-left", children: isUptimeMode ? "Daily Utilization" : "Daily Output" }),
           /* @__PURE__ */ jsx("div", { style: { height: "220px" }, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs(
             BarChart$1,
@@ -48493,7 +48855,7 @@ var WorkspaceWhatsAppShareButton = ({
     }
   );
 };
-var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiencyLegend }) => {
+var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiencyLegend, hourlyCycleTimes }) => {
   const [isGenerating, setIsGenerating] = useState(false);
   const entityConfig = useEntityConfig();
   const effectiveLegend = efficiencyLegend || DEFAULT_EFFICIENCY_LEGEND;
@@ -48501,6 +48863,7 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
     setIsGenerating(true);
     try {
       const isUptimeMode = workspace.monitoring_mode === "uptime";
+      const isAssemblyCycleMode = !isUptimeMode && workspace.line_assembly_enabled === true && workspace.action_type === "assembly";
       const shiftMinutes = getShiftDurationMinutes(workspace.shift_start, workspace.shift_end);
       const shiftSeconds = shiftMinutes ? shiftMinutes * 60 : 0;
       const idleSeconds = Math.max(workspace.idle_time || 0, 0);
@@ -48561,9 +48924,38 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
         minute: "2-digit",
         hour12: true
       });
+      const shiftEndTime = (/* @__PURE__ */ new Date(`2000-01-01 ${workspace.shift_end}`)).toLocaleTimeString("en-IN", {
+        hour: "2-digit",
+        minute: "2-digit",
+        hour12: true
+      });
+      const parseTimeToMinutes3 = (timeValue) => {
+        const [hourPart, minutePart] = timeValue.split(":").map(Number);
+        const hour = Number.isFinite(hourPart) ? hourPart : 0;
+        const minute = Number.isFinite(minutePart) ? minutePart : 0;
+        return hour * 60 + minute;
+      };
+      const toShiftUtcMs = (dateKey, timeValue) => {
+        const [yearPart, monthPart, dayPart] = dateKey.split("-").map(Number);
+        const year = Number.isFinite(yearPart) ? yearPart : 1970;
+        const month = Number.isFinite(monthPart) ? monthPart : 1;
+        const day = Number.isFinite(dayPart) ? dayPart : 1;
+        const [hourPart, minutePart] = timeValue.split(":").map(Number);
+        const hour = Number.isFinite(hourPart) ? hourPart : 0;
+        const minute = Number.isFinite(minutePart) ? minutePart : 0;
+        const IST_OFFSET_MINUTES = 330;
+        return Date.UTC(year, month - 1, day, hour, minute) - IST_OFFSET_MINUTES * 60 * 1e3;
+      };
+      const shiftStartMinutes = parseTimeToMinutes3(workspace.shift_start);
+      const shiftEndMinutes = parseTimeToMinutes3(workspace.shift_end);
+      const wrapsMidnight = shiftEndMinutes <= shiftStartMinutes;
+      const shiftStartUtcMs = toShiftUtcMs(workspace.date, workspace.shift_start);
+      const shiftEndUtcMs = toShiftUtcMs(workspace.date, workspace.shift_end) + (wrapsMidnight ? 24 * 60 * 60 * 1e3 : 0);
+      const isShiftInProgress = Date.now() >= shiftStartUtcMs && Date.now() < shiftEndUtcMs;
+      const reportPeriodEndTime = isShiftInProgress ? currentTime : shiftEndTime;
       doc.setFontSize(12);
       doc.setTextColor(80, 80, 80);
-      doc.text(`Report Period: ${shiftStartTime} - ${currentTime}`, 20, 79);
+      doc.text(`Report Period: ${shiftStartTime} - ${reportPeriodEndTime}`, 20, 79);
       doc.setTextColor(0, 0, 0);
       doc.setDrawColor(180, 180, 180);
       doc.setLineWidth(0.8);
@@ -48577,10 +48969,8 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
       };
       const perfOverviewStartY = 93;
       const hasIdleTimeReason = idleTimeReasons && idleTimeReasons.length > 0;
-      let perfOverviewHeight = hasIdleTimeReason ? 80 : 70;
-      if (isUptimeMode) {
-        perfOverviewHeight = hasIdleTimeReason ? 70 : 60;
-      }
+      const perfOverviewRows = isUptimeMode ? 3 : isAssemblyCycleMode ? 2 : 4;
+      const perfOverviewHeight = 30 + perfOverviewRows * 10 + (hasIdleTimeReason ? 10 : 0);
       doc.setFillColor(245, 245, 245);
       doc.roundedRect(15, perfOverviewStartY, 180, perfOverviewHeight, 3, 3, "F");
       doc.setFontSize(18);
@@ -48608,6 +48998,19 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
         doc.text("Stoppages:", 25, kpiStartY + kpiSpacing * 2);
         doc.setFont("helvetica", "bold");
         doc.text(`${workspace.total_actions}`, 120, kpiStartY + kpiSpacing * 2);
+      } else if (isAssemblyCycleMode) {
+        createKPIBox(kpiStartY);
+        doc.setFontSize(11);
+        doc.setFont("helvetica", "normal");
+        doc.text("Average Cycle Time:", 25, kpiStartY);
+        doc.setFont("helvetica", "bold");
+        doc.text(`${(workspace.avg_cycle_time || 0).toFixed(1)}s`, 120, kpiStartY);
+        createKPIBox(kpiStartY + kpiSpacing);
+        doc.setFont("helvetica", "normal");
+        doc.text("Total Idle Time:", 25, kpiStartY + kpiSpacing);
+        doc.setFont("helvetica", "bold");
+        const idleTimeFormatted = formatIdleTime(workspace.idle_time);
+        doc.text(idleTimeFormatted, 120, kpiStartY + kpiSpacing);
       } else {
         createKPIBox(kpiStartY);
         doc.setFontSize(11);
@@ -48644,17 +49047,11 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
         const reasonText = `${reasonName} (${topReason.value.toFixed(1)}%)`;
         doc.text(reasonText, 120, reasonY);
       }
-      let separatorBeforeHourlyY = hasIdleTimeReason ? 183 : 173;
-      if (isUptimeMode) {
-        separatorBeforeHourlyY -= 10;
-      }
+      const separatorBeforeHourlyY = perfOverviewStartY + perfOverviewHeight + 10;
       doc.setDrawColor(180, 180, 180);
       doc.setLineWidth(0.8);
       doc.line(20, separatorBeforeHourlyY, 190, separatorBeforeHourlyY);
-      let hourlyPerfStartY = hasIdleTimeReason ? 188 : 178;
-      if (isUptimeMode) {
-        hourlyPerfStartY -= 10;
-      }
+      const hourlyPerfStartY = separatorBeforeHourlyY + 5;
       const uptimeSeries = isUptimeMode ? buildUptimeSeries({
         idleTimeHourly: workspace.idle_time_hourly,
         shiftStart: workspace.shift_start,
@@ -48672,8 +49069,9 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
         const uptimePercent = total > 0 ? Math.round(activeMinutes / total * 100) : 0;
         return { activeMinutes, idleMinutes, uptimePercent };
       }) : [];
-      const hourlyData = isUptimeMode ? hourlyUptime : workspace.hourly_action_counts || [];
+      const hourlyData = isUptimeMode ? hourlyUptime : isAssemblyCycleMode ? hourlyCycleTimes && hourlyCycleTimes.length > 0 ? hourlyCycleTimes : workspace.hourly_action_counts || [] : workspace.hourly_action_counts || [];
       const hourlyTarget = workspace.pph_threshold;
+      const cycleTarget = workspace.ideal_cycle_time || 0;
       const pageHeight = doc.internal.pageSize.height;
       const maxContentY = pageHeight - 15;
       const baseTableStartY = hourlyPerfStartY + 31;
@@ -48698,12 +49096,16 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
       doc.setFont("helvetica", "bold");
       doc.setTextColor(40, 40, 40);
       const hourlyTitleY = hourlyPerfStartY + 10;
-      doc.text(isUptimeMode ? "Hourly Utilization" : "Hourly Performance", 20, hourlyTitleY);
+      doc.text(
+        isUptimeMode ? "Hourly Utilization" : isAssemblyCycleMode ? "Hourly Cycle Time" : "Hourly Performance",
+        20,
+        hourlyTitleY
+      );
       doc.setTextColor(0, 0, 0);
       const headerY = titleFontSize === 16 ? hourlyPerfStartY + 18 : hourlyPerfStartY + 20;
       const gridTopY = headerY - 5;
       const headerBottomY = gridTopY + 8;
-      const colBoundaries = isUptimeMode ? [20, 105, 190] : [20, 70, 100, 130, 155, 190];
+      const colBoundaries = isUptimeMode ? [20, 105, 190] : isAssemblyCycleMode ? [20, 85, 125, 165, 190] : [20, 70, 100, 130, 155, 190];
       const totalRows = hourlyData.length;
       const gridBottomY = headerBottomY + totalRows * rowHeight;
       const tableHeight = gridBottomY - gridTopY;
@@ -48724,6 +49126,10 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
       doc.text("Time Range", 25, headerTextY);
       if (isUptimeMode) {
         doc.text("Utilization", 147, headerTextY);
+      } else if (isAssemblyCycleMode) {
+        doc.text("Standard", 90, headerTextY);
+        doc.text("Average", 130, headerTextY);
+        doc.text("Status", 170, headerTextY);
       } else {
         doc.text("Output", 75, headerTextY);
         doc.text("Target", 105, headerTextY);
@@ -48772,6 +49178,25 @@ var WorkspacePdfGenerator = ({ workspace, className, idleTimeReasons, efficiency
         if (isUptimeMode) {
           const utilizationStr = dataCollected ? `${uptimePercent}%` : "TBD";
           doc.text(utilizationStr, 147, yPos);
+        } else if (isAssemblyCycleMode) {
+          const actualCycleTime = Number(outputValue) || 0;
+          const standardCycleStr = `${cycleTarget.toFixed(1)}s`;
+          const actualCycleStr = dataCollected ? `${actualCycleTime.toFixed(1)}s` : "TBD";
+          doc.text(standardCycleStr, 90, yPos);
+          doc.text(actualCycleStr, 130, yPos);
+          if (!dataCollected) {
+            doc.setTextColor(100, 100, 100);
+            doc.text("-", 170, yPos);
+          } else if (actualCycleTime > 0 && actualCycleTime <= cycleTarget) {
+            doc.setTextColor(0, 171, 69);
+            doc.setFont("ZapfDingbats", "normal");
+            doc.text("4", 170, yPos);
+            doc.setFont("helvetica", "normal");
+          } else {
+            doc.setTextColor(227, 67, 41);
+            doc.text("\xD7", 170, yPos);
+          }
+          doc.setTextColor(0, 0, 0);
         } else {
           doc.text(outputStr, 75, yPos);
           doc.text(targetStr, 105, yPos);
@@ -48843,7 +49268,8 @@ var WorkspaceMonthlyPdfGenerator = ({
   shiftConfig,
   efficiencyLegend,
   className,
-  compact = false
+  compact = false,
+  isAssemblyWorkspace = false
 }) => {
   const [isGenerating, setIsGenerating] = useState(false);
   const effectiveLegend = efficiencyLegend || DEFAULT_EFFICIENCY_LEGEND;
@@ -48966,6 +49392,7 @@ var WorkspaceMonthlyPdfGenerator = ({
         avgOutput: filteredShifts.reduce((sum, shift) => sum + shift.output, 0) / filteredShifts.length,
         avgCycleTime: filteredShifts.reduce((sum, shift) => sum + shift.cycleTime, 0) / filteredShifts.length,
         avgPph: filteredShifts.reduce((sum, shift) => sum + shift.pph, 0) / filteredShifts.length,
+        avgIdleTime: filteredShifts.reduce((sum, shift) => sum + shift.idleTime, 0) / filteredShifts.length,
         totalDays: filteredShifts.length,
         underperformingDays: filteredShifts.filter((shift) => shift.efficiency < effectiveLegend.green_min).length
       } : null;
@@ -48977,7 +49404,8 @@ var WorkspaceMonthlyPdfGenerator = ({
         doc.roundedRect(22, y - 7, 165, 12, 2, 2, "S");
       };
       doc.setFillColor(245, 245, 245);
-      doc.roundedRect(15, 95, 180, 70, 3, 3, "F");
+      const isAssemblyWorkspaceAndNotUptime = !isUptimeMode && isAssemblyWorkspace;
+      doc.roundedRect(15, 95, 180, isAssemblyWorkspaceAndNotUptime ? 40 : 70, 3, 3, "F");
       doc.setFontSize(18);
       doc.setFont("helvetica", "bold");
       doc.setTextColor(40, 40, 40);
@@ -49016,32 +49444,41 @@ var WorkspaceMonthlyPdfGenerator = ({
           doc.text(`${uptimeMetrics.underperformingDays} of ${uptimeMetrics.totalDays}`, 120, kpiStartY + kpiSpacing * 4);
         } else {
           const outputMetrics = monthlyMetrics;
-          createKPIBox(kpiStartY);
-          doc.setFontSize(11);
-          doc.setFont("helvetica", "normal");
-          doc.text("Average Efficiency:", 25, kpiStartY);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${outputMetrics.avgEfficiency.toFixed(1)}% (Target: ${Math.round(effectiveLegend.green_min)}%)`, 120, kpiStartY);
-          createKPIBox(kpiStartY + kpiSpacing);
-          doc.setFont("helvetica", "normal");
-          doc.text("Average Output:", 25, kpiStartY + kpiSpacing);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${Math.round(outputMetrics.avgOutput)} pieces`, 120, kpiStartY + kpiSpacing);
-          createKPIBox(kpiStartY + kpiSpacing * 2);
-          doc.setFont("helvetica", "normal");
-          doc.text("Average PPH:", 25, kpiStartY + kpiSpacing * 2);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${outputMetrics.avgPph.toFixed(1)} per hour`, 120, kpiStartY + kpiSpacing * 2);
-          createKPIBox(kpiStartY + kpiSpacing * 3);
-          doc.setFont("helvetica", "normal");
-          doc.text("Working Days:", 25, kpiStartY + kpiSpacing * 3);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${outputMetrics.totalDays} days`, 120, kpiStartY + kpiSpacing * 3);
-          createKPIBox(kpiStartY + kpiSpacing * 4);
-          doc.setFont("helvetica", "normal");
-          doc.text("Underperforming Days:", 25, kpiStartY + kpiSpacing * 4);
-          doc.setFont("helvetica", "bold");
-          doc.text(`${outputMetrics.underperformingDays} of ${outputMetrics.totalDays}`, 120, kpiStartY + kpiSpacing * 4);
+          if (!isAssemblyWorkspace) {
+            createKPIBox(kpiStartY);
+            doc.setFontSize(11);
+            doc.setFont("helvetica", "normal");
+            doc.text("Average Efficiency:", 25, kpiStartY);
+            doc.setFont("helvetica", "bold");
+            doc.text(`${outputMetrics.avgEfficiency.toFixed(1)}% (Target: ${Math.round(effectiveLegend.green_min)}%)`, 120, kpiStartY);
+            createKPIBox(kpiStartY + kpiSpacing);
+            doc.setFont("helvetica", "normal");
+            doc.text("Average PPH:", 25, kpiStartY + kpiSpacing);
+            doc.setFont("helvetica", "bold");
+            doc.text(`${outputMetrics.avgPph.toFixed(1)} per hour`, 120, kpiStartY + kpiSpacing);
+            createKPIBox(kpiStartY + kpiSpacing * 2);
+            doc.setFont("helvetica", "normal");
+            doc.text("Working Days:", 25, kpiStartY + kpiSpacing * 2);
+            doc.setFont("helvetica", "bold");
+            doc.text(`${outputMetrics.totalDays} days`, 120, kpiStartY + kpiSpacing * 2);
+            createKPIBox(kpiStartY + kpiSpacing * 3);
+            doc.setFont("helvetica", "normal");
+            doc.text("Underperforming Days:", 25, kpiStartY + kpiSpacing * 3);
+            doc.setFont("helvetica", "bold");
+            doc.text(`${outputMetrics.underperformingDays} of ${outputMetrics.totalDays}`, 120, kpiStartY + kpiSpacing * 3);
+          } else {
+            createKPIBox(kpiStartY);
+            doc.setFontSize(11);
+            doc.setFont("helvetica", "normal");
+            doc.text("Average Cycle Time:", 25, kpiStartY);
+            doc.setFont("helvetica", "bold");
+            doc.text(`${Math.round(outputMetrics.avgCycleTime)}s`, 120, kpiStartY);
+            createKPIBox(kpiStartY + kpiSpacing);
+            doc.setFont("helvetica", "normal");
+            doc.text("Average Idle Time:", 25, kpiStartY + kpiSpacing);
+            doc.setFont("helvetica", "bold");
+            doc.text(formatIdleTime(outputMetrics.avgIdleTime ?? 0), 120, kpiStartY + kpiSpacing);
+          }
         }
       } else {
         doc.setFontSize(12);
@@ -49052,29 +49489,33 @@ var WorkspaceMonthlyPdfGenerator = ({
       }
       doc.setDrawColor(180, 180, 180);
       doc.setLineWidth(0.8);
-      doc.line(20, 180, 190, 180);
+      const separatorY = isAssemblyWorkspaceAndNotUptime ? 150 : 180;
+      doc.line(20, separatorY, 190, separatorY);
       doc.setFillColor(245, 245, 245);
-      doc.roundedRect(15, 185, 180, 85, 3, 3, "F");
+      const dailySectionY = isAssemblyWorkspaceAndNotUptime ? 155 : 185;
+      doc.roundedRect(15, dailySectionY, 180, 85, 3, 3, "F");
       doc.setFontSize(18);
       doc.setFont("helvetica", "bold");
       doc.setTextColor(40, 40, 40);
-      doc.text(isUptimeMode ? "Daily Utilization Summary" : "Daily Performance Summary", 20, 195);
+      doc.text(isUptimeMode ? "Daily Utilization Summary" : "Daily Performance Summary", 20, dailySectionY + 10);
       doc.setTextColor(0, 0, 0);
       if (validDays.length > 0) {
         doc.setFontSize(10);
         doc.setFont("helvetica", "bold");
         doc.setFillColor(240, 240, 240);
-        doc.roundedRect(20, 200, 170, 7, 1, 1, "F");
-        doc.text("Date", 25, 205);
-        doc.text(isUptimeMode ? "Productive" : "Actual", 60, 205);
-        doc.text(isUptimeMode ? "Idle" : "Standard", 95, 205);
-        doc.text(isUptimeMode ? "Utilization" : "Efficiency", 135, 205);
-        doc.text("Status", 170, 205);
+        const tableHeaderY = dailySectionY + 15;
+        doc.roundedRect(20, tableHeaderY, 170, 7, 1, 1, "F");
+        const textY = tableHeaderY + 5;
+        doc.text("Date", 25, textY);
+        doc.text(isUptimeMode ? "Productive" : isAssemblyWorkspace ? "Cycle Time" : "Actual", 60, textY);
+        doc.text(isUptimeMode ? "Idle" : isAssemblyWorkspace ? "Target CT" : "Standard", 95, textY);
+        doc.text(isUptimeMode ? "Utilization" : "Efficiency", 135, textY);
+        doc.text("Status", 170, textY);
         doc.setLineWidth(0.2);
         doc.setDrawColor(220, 220, 220);
-        doc.line(20, 208, 190, 208);
+        doc.line(20, textY + 3, 190, textY + 3);
         doc.setFont("helvetica", "normal");
-        let yPos = 215;
+        let yPos = textY + 10;
         const recentDays = validDays.slice(-10).reverse();
         recentDays.forEach((dayData, index) => {
           if (yPos > 260) return;
@@ -49108,8 +49549,13 @@ var WorkspaceMonthlyPdfGenerator = ({
             }
             doc.setTextColor(0, 0, 0);
           } else {
-            doc.text(`${shift.output}`, 60, yPos);
-            doc.text(`${shift.targetOutput}`, 95, yPos);
+            if (isAssemblyWorkspace) {
+              doc.text(`${shift.cycleTime.toFixed(1)}`, 60, yPos);
+              doc.text(`${shift.pphThreshold > 0 ? (3600 / shift.pphThreshold).toFixed(1) : "-"}`, 95, yPos);
+            } else {
+              doc.text(`${shift.output}`, 60, yPos);
+              doc.text(`${shift.targetOutput}`, 95, yPos);
+            }
             doc.text(`${shift.efficiency.toFixed(1)}%`, 135, yPos);
             if (shift.efficiency >= effectiveLegend.green_min) {
               doc.setTextColor(0, 171, 69);
@@ -49124,12 +49570,12 @@ var WorkspaceMonthlyPdfGenerator = ({
         });
         doc.setLineWidth(0.2);
         doc.setDrawColor(220, 220, 220);
-        doc.roundedRect(20, 200, 170, yPos - 200 - 3, 1, 1, "S");
+        doc.roundedRect(20, tableHeaderY, 170, yPos - tableHeaderY - 3, 1, 1, "S");
       } else {
         doc.setFontSize(12);
         doc.setFont("helvetica", "normal");
         doc.setTextColor(100, 100, 100);
-        doc.text("No daily data available for this month", 25, 215);
+        doc.text("No daily data available for this month", 25, dailySectionY + 30);
         doc.setTextColor(0, 0, 0);
       }
       doc.setFontSize(9);
@@ -49162,46 +49608,64 @@ var WorkspaceCycleTimeMetricCards = ({
   workspace,
   className,
   legend,
-  layout: layout2 = "grid"
+  layout: layout2 = "grid",
+  isAssemblyWorkspace = false,
+  idleTimeData
 }) => {
   const effectiveLegend = legend || DEFAULT_EFFICIENCY_LEGEND;
   const efficiencyValue = workspace.avg_efficiency || 0;
   const efficiencyTarget = effectiveLegend.green_min;
   const efficiencyColor = getEfficiencyHexColor(efficiencyValue, effectiveLegend);
-  const hideEfficiencyCard = shouldHideWorkspaceEfficiencyCard(workspace);
-  const containerClassName = layout2 === "stack" ? `space-y-4 ${className || ""}` : `grid grid-cols-1 sm:grid-cols-2 ${hideEfficiencyCard ? "lg:grid-cols-2" : "lg:grid-cols-3"} gap-3 min-h-0 ${className || ""}`;
+  const hideEfficiencyCard = isAssemblyWorkspace || shouldHideWorkspaceEfficiencyCard(workspace);
+  const totalCards = 2 + (hideEfficiencyCard ? 0 : 1) + (idleTimeData ? 1 : 0);
+  let gridColsClass = "lg:grid-cols-3";
+  if (totalCards === 4) gridColsClass = "lg:grid-cols-4";
+  else if (totalCards === 2) gridColsClass = "lg:grid-cols-2";
+  const containerClassName = layout2 === "stack" ? `space-y-4 ${className || ""}` : `grid grid-cols-1 gap-4 sm:gap-3 sm:grid-cols-2 ${gridColsClass} w-full h-full min-h-0 ${className || ""}`;
   return /* @__PURE__ */ jsxs("div", { className: containerClassName, children: [
-    !hideEfficiencyCard && /* @__PURE__ */ jsxs(Card2, { children: [
-      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-2 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-lg text-center", children: "Efficiency" }) }),
-      /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
-        /* @__PURE__ */ jsxs("p", { className: "text-5xl font-bold", style: { color: efficiencyColor }, children: [
+    !hideEfficiencyCard && /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
+      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-1 pt-5 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-[15px] font-bold text-center text-gray-900 tracking-wide", children: "Efficiency" }) }),
+      /* @__PURE__ */ jsxs(CardContent2, { className: "flex-1 flex flex-col items-center justify-center pb-6", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-5xl font-bold tracking-tight", style: { color: efficiencyColor }, children: [
           efficiencyValue.toFixed(1),
           "%"
         ] }),
-        /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-500 mt-2", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-gray-500 mt-1 font-medium tracking-wide", children: [
           "Target: ",
           Math.round(efficiencyTarget),
           "%"
         ] })
-      ] }) })
+      ] })
     ] }),
-    /* @__PURE__ */ jsxs(Card2, { children: [
-      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-2 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-lg text-center", children: "Cycle Time (s)" }) }),
-      /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
-        /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold ${workspace.avg_cycle_time > (workspace.ideal_cycle_time || 0) ? "text-red-500" : "text-green-500"}`, children: workspace.avg_cycle_time.toFixed(1) }),
-        /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-500 mt-2", children: [
+    /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
+      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-1 pt-5 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-[15px] font-bold text-center text-gray-900 tracking-wide", children: "Cycle Time (s)" }) }),
+      /* @__PURE__ */ jsxs(CardContent2, { className: "flex-1 flex flex-col items-center justify-center pb-6", children: [
+        /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold tracking-tight ${workspace.avg_cycle_time > (workspace.ideal_cycle_time || 0) ? "text-red-500" : "text-[#34C759]"}`, children: workspace.avg_cycle_time.toFixed(1) }),
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-gray-500 mt-1 font-medium tracking-wide", children: [
           "Standard: ",
           workspace.ideal_cycle_time?.toFixed(1) || 0,
           "s"
         ] })
-      ] }) })
+      ] })
     ] }),
-    /* @__PURE__ */ jsxs(Card2, { children: [
-      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-2 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-lg text-center", children: "Idle Time" }) }),
-      /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
-        /* @__PURE__ */ jsx("p", { className: `text-4xl font-bold ${!workspace.idle_time || workspace.idle_time <= 0 ? "text-green-500" : workspace.idle_time <= 300 ? "text-yellow-500" : "text-red-500"}`, children: formatIdleTime(workspace.idle_time) }),
-        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-2", children: "Total idle time" })
-      ] }) })
+    /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
+      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-1 pt-5 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-[15px] font-bold text-center text-gray-900 tracking-wide", children: "Idle Time" }) }),
+      /* @__PURE__ */ jsxs(CardContent2, { className: "flex-1 flex flex-col items-center justify-center pb-6", children: [
+        /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold tracking-tight ${!workspace.idle_time || workspace.idle_time <= 0 ? "text-[#34C759]" : workspace.idle_time <= 300 ? "text-yellow-500" : "text-red-500"}`, children: formatIdleTime(workspace.idle_time) }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-1 font-medium tracking-wide", children: "Total idle time" })
+      ] })
+    ] }),
+    idleTimeData && /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
+      /* @__PURE__ */ jsx(CardHeader2, { className: "pb-1 pt-5 flex-none", children: /* @__PURE__ */ jsx(CardTitle2, { className: "text-[15px] font-bold text-center text-gray-900 tracking-wide", children: "Idle Time Breakdown" }) }),
+      /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 p-2 flex items-center justify-center h-full sm:h-auto min-h-[120px] sm:min-h-[100px]", children: /* @__PURE__ */ jsx(
+        IdleTimeReasonChart,
+        {
+          data: idleTimeData.chartData,
+          isLoading: idleTimeData.isLoading,
+          error: idleTimeData.error,
+          variant: "bar"
+        }
+      ) })
     ] })
   ] });
 };
@@ -49339,13 +49803,13 @@ var getWorkspaceStyles = (position, isPlaceholder = false) => {
           ${isPlaceholder ? "cursor-default" : ""}`;
 };
 var formatPercentRange = (min, max) => {
-  const format8 = (value) => Number.isInteger(value) ? `${value}` : value.toFixed(1);
+  const format9 = (value) => Number.isInteger(value) ? `${value}` : value.toFixed(1);
   if (min >= 100 || max >= 100) {
-    return `${format8(min)}+%`;
+    return `${format9(min)}+%`;
   }
-  return `${format8(min)}-${format8(max)}%`;
+  return `${format9(min)}-${format9(max)}%`;
 };
-var Legend6 = ({
+var Legend5 = ({
   useBottleneckLabel = false,
   legend,
   metricLabel = "Efficiency"
@@ -49531,7 +49995,7 @@ var WorkspaceGrid = React141__default.memo(({
   return /* @__PURE__ */ jsxs("div", { className: `relative w-full h-full overflow-hidden ${className}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "absolute top-0 left-2 sm:left-4 right-2 sm:right-8 z-20", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center justify-between py-1 sm:py-1.5 gap-2", children: [
-        /* @__PURE__ */ jsx("div", { className: "hidden sm:block", children: /* @__PURE__ */ jsx(Legend6, { legend, useBottleneckLabel: hasFlowBuffers, metricLabel: legendMetricLabel }) }),
+        /* @__PURE__ */ jsx("div", { className: "hidden sm:block", children: /* @__PURE__ */ jsx(Legend5, { legend, useBottleneckLabel: hasFlowBuffers, metricLabel: legendMetricLabel }) }),
         mapViewEnabled && /* @__PURE__ */ jsx(
           "button",
           {
@@ -49548,7 +50012,7 @@ var WorkspaceGrid = React141__default.memo(({
           }
         )
       ] }),
-      /* @__PURE__ */ jsx("div", { className: "sm:hidden mt-1 mr-32", children: /* @__PURE__ */ jsx(Legend6, { legend, useBottleneckLabel: hasFlowBuffers, metricLabel: legendMetricLabel }) })
+      /* @__PURE__ */ jsx("div", { className: "sm:hidden mt-1 mr-32", children: /* @__PURE__ */ jsx(Legend5, { legend, useBottleneckLabel: hasFlowBuffers, metricLabel: legendMetricLabel }) })
     ] }),
     /* @__PURE__ */ jsx("div", { className: "absolute top-14 sm:top-16 left-0 right-0 bottom-0", children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: viewMode === "video" ? /* @__PURE__ */ jsx(
       motion.div,
@@ -50059,7 +50523,7 @@ var KPISection = memo$1(({
               value: showSkeleton ? "" : kpis.efficiency.value,
               change: effChange,
               trend: effTrend,
-              trendLabel: "today",
+              trendLabel: "vs yesterday",
               trendMode: "pill",
               suffix: "%",
               showZeroChange: true,
@@ -52295,7 +52759,7 @@ var SideNavBar = memo$1(({
             setIsAlertsOpen(willOpen);
             setIsSettingsOpen(false);
             if (willOpen) {
-              trackCoreEvent("Alerts Page Clicked", { source: "side_nav" });
+              trackCoreEvent("Alerts page clicked", { source: "side_nav" });
               void refreshAlertsSummary();
             }
           },
@@ -52450,7 +52914,7 @@ var SideNavBar = memo$1(({
             {
               onClick: () => {
                 setIsAlertsOpen(true);
-                trackCoreEvent("Alerts Page Clicked", { source: "side_nav_mobile" });
+                trackCoreEvent("Alerts page clicked", { source: "side_nav_mobile" });
                 void refreshAlertsSummary();
                 onMobileMenuClose?.();
               },
@@ -59660,7 +60124,8 @@ var MonthlyRangeFilter = ({
   onMonthNavigate,
   className,
   variant = "default",
-  showLabel = true
+  showLabel = true,
+  singleDateOnly = false
 }) => {
   const todayKey = useMemo(
     () => formatInTimeZone(/* @__PURE__ */ new Date(), timezone || "UTC", "yyyy-MM-dd"),
@@ -59748,6 +60213,12 @@ var MonthlyRangeFilter = ({
     }
     setActivePreset("Custom");
     setPendingChangeMeta({ source: "custom" });
+    if (singleDateOnly) {
+      setRangeStart(day);
+      setRangeEnd(day);
+      setSelecting(false);
+      return;
+    }
     if (!selecting || !rangeStart) {
       setRangeStart(day);
       setRangeEnd(null);
@@ -59782,6 +60253,13 @@ var MonthlyRangeFilter = ({
   };
   const handleApply = () => {
     if (rangeStart) {
+      if (singleDateOnly) {
+        const selected = startOfDay(rangeStart) > startOfDay(today) ? startOfDay(today) : startOfDay(rangeStart);
+        const dateKey = format(selected, "yyyy-MM-dd");
+        onChange({ startKey: dateKey, endKey: dateKey }, pendingChangeMeta || { source: "custom" });
+        setIsOpen(false);
+        return;
+      }
       const boundedStart = startOfDay(rangeStart) > startOfDay(today) ? startOfDay(today) : startOfDay(rangeStart);
       const candidateEnd = rangeEnd || rangeStart;
       const boundedEnd = startOfDay(candidateEnd) > startOfDay(today) ? startOfDay(today) : startOfDay(candidateEnd);
@@ -59876,7 +60354,7 @@ var MonthlyRangeFilter = ({
       "overflow-hidden bg-white animate-in fade-in zoom-in-95 duration-200 flex",
       isInline ? "relative mt-2 w-full rounded-xl border border-gray-200" : "absolute right-0 z-50 mt-2 w-[520px] rounded-xl border border-gray-100 shadow-2xl"
     ), children: [
-      /* @__PURE__ */ jsxs("div", { className: "w-40 bg-[#F8FAFF] border-r border-gray-100 p-4 flex flex-col justify-between", children: [
+      !singleDateOnly && /* @__PURE__ */ jsxs("div", { className: "w-40 bg-gray-50 border-r border-gray-100 p-4 flex flex-col justify-between", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
           presets.map((preset) => /* @__PURE__ */ jsx(
             "button",
@@ -59885,7 +60363,7 @@ var MonthlyRangeFilter = ({
               onClick: () => handlePresetClick(preset),
               className: clsx(
                 "w-full text-left px-3 py-2 text-sm rounded-lg transition-all duration-200",
-                activePreset === preset.label ? "bg-[#EEF2FF] text-[#4F46E5] font-semibold" : "text-gray-600 hover:bg-gray-100/80"
+                activePreset === preset.label ? "bg-blue-50 text-blue-600 font-semibold" : "text-gray-600 hover:bg-gray-100/80"
               ),
               children: preset.label
             },
@@ -59898,7 +60376,7 @@ var MonthlyRangeFilter = ({
               onClick: () => setActivePreset("Custom"),
               className: clsx(
                 "w-full text-left px-3 py-2 text-sm rounded-lg transition-all duration-200",
-                activePreset === "Custom" ? "bg-[#EEF2FF] text-[#4F46E5] font-semibold" : "text-gray-600 hover:bg-gray-100/80"
+                activePreset === "Custom" ? "bg-blue-50 text-blue-600 font-semibold" : "text-gray-600 hover:bg-gray-100/80"
               ),
               children: "Custom"
             }
@@ -59920,7 +60398,7 @@ var MonthlyRangeFilter = ({
               type: "button",
               onClick: handleApply,
               disabled: !rangeStart,
-              className: "w-full py-2.5 bg-[#4F46E5] text-white text-sm font-semibold rounded-lg hover:bg-[#4338CA] transition-all disabled:opacity-50 disabled:cursor-not-allowed",
+              className: "w-full py-2.5 bg-blue-600 text-white text-sm font-semibold rounded-lg hover:bg-blue-700 transition-all disabled:opacity-50 disabled:cursor-not-allowed",
               children: "Apply"
             }
           )
@@ -59970,9 +60448,9 @@ var MonthlyRangeFilter = ({
           const dayNum = day.getDate();
           const isFutureDay = startOfDay(day) > startOfDay(today);
           return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-            inRange && !isStart && !isEnd && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 -inset-x-0.5 bg-[#EEF2FF] z-0" }),
-            inRange && isStart && !isSingleDaySelection && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 left-1/2 bg-[#EEF2FF] z-0" }),
-            inRange && isEnd && !isSingleDaySelection && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 left-0 right-1/2 bg-[#EEF2FF] z-0" }),
+            inRange && !isStart && !isEnd && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 -inset-x-0.5 bg-blue-50 z-0" }),
+            inRange && isStart && !isSingleDaySelection && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 left-1/2 bg-blue-50 z-0" }),
+            inRange && isEnd && !isSingleDaySelection && /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 left-0 right-1/2 bg-blue-50 z-0" }),
             /* @__PURE__ */ jsx(
               "button",
               {
@@ -59981,19 +60459,47 @@ var MonthlyRangeFilter = ({
                 disabled: isFutureDay,
                 className: clsx(
                   "h-10 w-full flex items-center justify-center text-sm font-semibold transition-all duration-150 relative z-10",
-                  isFutureDay && "text-gray-200 cursor-not-allowed",
+                  // Future day NOT in range
+                  isFutureDay && !inRange && "text-gray-300 cursor-not-allowed",
                   // Not in range
-                  !isFutureDay && !inRange && "text-gray-700 hover:bg-gray-50 rounded-lg",
+                  !isFutureDay && !inRange && "text-gray-700 hover:bg-gray-100 rounded-lg",
                   // Middle of range
-                  inRange && !isStart && !isEnd && "text-[#4F46E5]",
+                  inRange && !isStart && !isEnd && clsx(
+                    "text-blue-600",
+                    isFutureDay && "cursor-not-allowed opacity-60"
+                  ),
                   // Start/End of range or Single selection
-                  (isStart || isEnd) && "bg-[#4F46E5] text-white rounded-lg shadow-sm"
+                  (isStart || isEnd) && clsx(
+                    "bg-blue-600 text-white rounded-lg shadow-sm",
+                    isFutureDay && "cursor-not-allowed opacity-80"
+                  )
                 ),
                 children: dayNum
               }
             )
           ] }, day.toISOString());
-        }) })
+        }) }),
+        singleDateOnly && /* @__PURE__ */ jsxs("div", { className: "mt-4 flex items-center justify-end gap-2 border-t border-gray-100 pt-3", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: handleReset,
+              className: "px-3 py-1.5 text-sm font-medium text-gray-500 hover:text-gray-700 transition-colors",
+              children: "Reset"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: handleApply,
+              disabled: !rangeStart,
+              className: "px-4 py-1.5 bg-blue-600 text-white text-sm font-semibold rounded-lg hover:bg-blue-700 transition-all disabled:opacity-50 disabled:cursor-not-allowed",
+              children: "Apply"
+            }
+          )
+        ] })
       ] })
     ] })
   ] });
@@ -61770,7 +62276,36 @@ var getMonthDateInfo = (timezone) => {
   const monthEndDate = fromZonedTime(`${monthEndKey}T23:59:59`, timezone);
   return { startDate, endDate, monthEndDate };
 };
-var LeaderboardCountdown = ({ targetDate, format: format8, finishedLabel = "Finished", placeholder = "--", onFinished }) => {
+var createKpisOverviewUrl = ({
+  tab,
+  date,
+  shift
+}) => {
+  const params = new URLSearchParams();
+  if (tab) {
+    params.set("tab", tab);
+  }
+  if (date) {
+    params.set("date", date);
+  }
+  if (typeof shift === "number" && Number.isFinite(shift)) {
+    params.set("shift", shift.toString());
+  }
+  const queryString = params.toString();
+  return queryString ? `/kpis?${queryString}` : "/kpis";
+};
+var getZonedDateAtMidday = (dateKey, timezone) => fromZonedTime(`${dateKey}T12:00:00`, timezone);
+var formatDateKey = (dateKey, timezone, options) => {
+  try {
+    return new Intl.DateTimeFormat("en-US", {
+      ...options,
+      timeZone: timezone
+    }).format(getZonedDateAtMidday(dateKey, timezone));
+  } catch {
+    return dateKey;
+  }
+};
+var LeaderboardCountdown = ({ targetDate, format: format9, finishedLabel = "Finished", placeholder = "--", onFinished }) => {
   const [time2, setTime] = useState("");
   const hasFinishedRef = useRef(false);
   useEffect(() => {
@@ -61792,7 +62327,7 @@ var LeaderboardCountdown = ({ targetDate, format: format8, finishedLabel = "Fini
         }
         return;
       }
-      if (format8 === "days") {
+      if (format9 === "days") {
         const days = Math.floor(diff / (1e3 * 60 * 60 * 24));
         const hours = Math.floor(diff % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60));
         setTime(`${days} days ${hours} hours`);
@@ -61807,7 +62342,7 @@ var LeaderboardCountdown = ({ targetDate, format: format8, finishedLabel = "Fini
     tick();
     const interval = setInterval(tick, 1e3);
     return () => clearInterval(interval);
-  }, [targetDate, format8, finishedLabel, placeholder, onFinished]);
+  }, [targetDate, format9, finishedLabel, placeholder, onFinished]);
   return /* @__PURE__ */ jsx(Fragment, { children: time2 });
 };
 var LinesLeaderboard = ({
@@ -61825,7 +62360,9 @@ var LinesLeaderboard = ({
   shiftEndDate,
   monthEndDate,
   viewType,
-  setViewType
+  setViewType,
+  timezone: _timezone,
+  isHistoricalDaily
 }) => {
   const formatEfficiency = (value) => typeof value === "number" && Number.isFinite(value) ? `${value.toFixed(1)}%` : "--";
   const assignedLineIdSet = React141__default.useMemo(
@@ -61918,10 +62455,10 @@ var LinesLeaderboard = ({
     }
   }, [timeRange, leaderboardData, isLoadingToday, isLoadingMonthly]);
   const topThree = leaderboardData.slice(0, 3);
-  leaderboardData.slice(3);
   const countdownTarget = timeRange === "monthly" ? monthEndDate : shiftEndDate;
   const countdownFormat = timeRange === "monthly" ? "days" : "clock";
   const countdownFinishedLabel = timeRange === "monthly" ? "Finished" : "Shift Ended";
+  const showCountdown = timeRange === "monthly" || !isHistoricalDaily;
   const handleCountdownFinished = React141__default.useCallback(() => {
     trackCoreEvent("Leaderboard Countdown Finished", {
       countdown_type: timeRange === "monthly" ? "month_end" : "shift_end",
@@ -61995,7 +62532,7 @@ var LinesLeaderboard = ({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "md:absolute md:right-0 md:top-1/2 md:-translate-y-1/2 flex items-center gap-3", children: /* @__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("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" }),
@@ -62116,7 +62653,7 @@ var LinesLeaderboard = ({
                 /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-900", children: item.supervisorName })
               ] }) }),
               /* @__PURE__ */ jsx("td", { className: "px-4 py-3 whitespace-nowrap text-sm text-gray-500", children: item.line.line_name }),
-              /* @__PURE__ */ jsx("td", { className: "px-4 py-3 whitespace-nowrap text-right", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col items-end", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-bold text-gray-900", children: formatEfficiency(item.efficiency) }) }) })
+              /* @__PURE__ */ jsx("td", { className: "px-4 py-3 whitespace-nowrap text-right", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col items-end", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-gray-900", children: formatEfficiency(item.efficiency) }) }) })
             ]
           },
           item.id
@@ -62290,6 +62827,9 @@ var KPIsOverviewView = ({
   const [activeTab, setActiveTab] = useState("today");
   const [timeRange, setTimeRange] = useState("today");
   const [viewType, setViewType] = useState("operator");
+  const [selectedLeaderboardDate, setSelectedLeaderboardDate] = useState("");
+  const [selectedLeaderboardShiftId, setSelectedLeaderboardShiftId] = useState(0);
+  const [hasHydratedLeaderboardRouteState, setHasHydratedLeaderboardRouteState] = useState(false);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
   const [topPerformer, setTopPerformer] = useState({
@@ -62311,13 +62851,6 @@ var KPIsOverviewView = ({
   const [monthlyError, setMonthlyError] = useState(null);
   const dailyRequestKeyRef = useRef(null);
   const monthlyRequestKeyRef = useRef(null);
-  useEffect(() => {
-    if (!router.isReady) return;
-    const tab = router.query.tab;
-    if (tab === "leaderboard") {
-      setActiveTab("leaderboard");
-    }
-  }, [router.isReady, router.query.tab]);
   const supabase = useSupabase();
   const { user } = useAuth();
   const dashboardConfig = useDashboardConfig();
@@ -62403,7 +62936,77 @@ var KPIsOverviewView = ({
     () => getShiftEndDate(currentShiftDetails, configuredTimezone),
     [currentShiftDetails, configuredTimezone]
   );
-  const shiftName = (currentShiftDetails.shiftName || "Day").replace(/ Shift$/i, "");
+  React141__default.useMemo(() => {
+    if (shiftConfig?.shifts && shiftConfig.shifts.length > 0) {
+      return shiftConfig.shifts.map((shift) => ({
+        id: shift.shiftId,
+        label: shift.shiftName || `Shift ${shift.shiftId}`,
+        startTime: shift.startTime,
+        endTime: shift.endTime
+      }));
+    }
+    return [
+      { id: 0, label: "Day Shift", startTime: "06:00", endTime: "18:00" },
+      { id: 1, label: "Night Shift", startTime: "18:00", endTime: "06:00" }
+    ];
+  }, [shiftConfig]);
+  const effectiveLeaderboardDate = selectedLeaderboardDate || currentShiftDate;
+  const effectiveLeaderboardShiftId = Number.isFinite(selectedLeaderboardShiftId) ? selectedLeaderboardShiftId : currentShiftId;
+  const isHistoricalLeaderboardDaily = activeTab === "leaderboard" && timeRange === "today" && (effectiveLeaderboardDate !== currentShiftDate || effectiveLeaderboardShiftId !== currentShiftId);
+  useEffect(() => {
+    if (!router.isReady) return;
+    const tabQuery = router.query.tab;
+    const dateQuery = router.query.date;
+    const shiftQuery = router.query.shift;
+    const parsedShiftQuery = typeof shiftQuery === "string" ? Number.parseInt(shiftQuery, 10) : Number.NaN;
+    const hasHistoricalQuery = tabQuery === "leaderboard" && typeof dateQuery === "string" && Number.isFinite(parsedShiftQuery);
+    setActiveTab(tabQuery === "leaderboard" ? "leaderboard" : "today");
+    if (hasHistoricalQuery) {
+      setSelectedLeaderboardDate(dateQuery);
+      setSelectedLeaderboardShiftId(parsedShiftQuery);
+      setTimeRange("today");
+    } else {
+      setSelectedLeaderboardDate(currentShiftDate);
+      setSelectedLeaderboardShiftId(currentShiftId);
+    }
+    setHasHydratedLeaderboardRouteState(true);
+  }, [
+    router.isReady,
+    router.query.tab,
+    router.query.date,
+    router.query.shift,
+    currentShiftDate,
+    currentShiftId
+  ]);
+  useEffect(() => {
+    if (!router.isReady || !hasHydratedLeaderboardRouteState) return;
+    const expectedTab = activeTab === "leaderboard" ? "leaderboard" : void 0;
+    const expectedDate = activeTab === "leaderboard" && timeRange === "today" && isHistoricalLeaderboardDaily ? effectiveLeaderboardDate : void 0;
+    const expectedShift = expectedDate !== void 0 ? effectiveLeaderboardShiftId.toString() : void 0;
+    const currentTab = typeof router.query.tab === "string" ? router.query.tab : void 0;
+    const currentDateQuery = typeof router.query.date === "string" ? router.query.date : void 0;
+    const currentShiftQuery = typeof router.query.shift === "string" ? router.query.shift : void 0;
+    if (currentTab === expectedTab && currentDateQuery === expectedDate && currentShiftQuery === expectedShift) {
+      return;
+    }
+    void router.replace(
+      createKpisOverviewUrl({
+        tab: expectedTab === "leaderboard" ? "leaderboard" : void 0,
+        date: expectedDate,
+        shift: expectedShift !== void 0 ? Number.parseInt(expectedShift, 10) : void 0
+      }),
+      void 0,
+      { shallow: true }
+    );
+  }, [
+    router,
+    activeTab,
+    timeRange,
+    effectiveLeaderboardDate,
+    effectiveLeaderboardShiftId,
+    hasHydratedLeaderboardRouteState,
+    isHistoricalLeaderboardDaily
+  ]);
   const factoryViewId = entityConfig.factoryViewId || "factory";
   const {
     lineMetrics,
@@ -62578,10 +63181,10 @@ var KPIsOverviewView = ({
   }, [supabase, resolvedCompanyId, leaderboardLinesForView, monthStartDate, monthEndDateKey, viewType]);
   const fetchDailyLeaderboard = useCallback(async () => {
     if (!supabase || !resolvedCompanyId || leaderboardLinesForView.length === 0) return;
-    if (!currentShiftDate) return;
+    if (!effectiveLeaderboardDate) return;
     const targetLineIds = leaderboardLinesForView.map((line) => line.id);
     const lineIdsKey = targetLineIds.slice().sort().join(",");
-    const requestKey = `${resolvedCompanyId}|${currentShiftDate}|${currentShiftId}|${lineIdsKey}`;
+    const requestKey = `${resolvedCompanyId}|${effectiveLeaderboardDate}|${effectiveLeaderboardShiftId}|${lineIdsKey}`;
     if (dailyRequestKeyRef.current === requestKey) return;
     dailyRequestKeyRef.current = requestKey;
     setDailyLoading(true);
@@ -62589,8 +63192,8 @@ var KPIsOverviewView = ({
     try {
       const entries = await lineLeaderboardService.getDailyLineLeaderboard(supabase, {
         companyId: resolvedCompanyId,
-        date: currentShiftDate,
-        shiftId: currentShiftId,
+        date: effectiveLeaderboardDate,
+        shiftId: effectiveLeaderboardShiftId,
         lineIds: targetLineIds,
         lineMode: viewType === "machine" ? "uptime" : "output"
       });
@@ -62608,7 +63211,14 @@ var KPIsOverviewView = ({
     } finally {
       setDailyLoading(false);
     }
-  }, [supabase, resolvedCompanyId, leaderboardLinesForView, currentShiftDate, currentShiftId, viewType]);
+  }, [
+    supabase,
+    resolvedCompanyId,
+    leaderboardLinesForView,
+    effectiveLeaderboardDate,
+    effectiveLeaderboardShiftId,
+    viewType
+  ]);
   useEffect(() => {
     if (activeTab !== "leaderboard") return;
     fetchMonthlyLeaderboard();
@@ -62697,6 +63307,12 @@ var KPIsOverviewView = ({
       trackProps.status = isEfficiencyOnTrack(kpis.efficiency?.value) ? "On Track" : "Behind";
     }
     trackCoreEvent("Line Card Clicked", trackProps);
+    if (activeTab === "leaderboard" && timeRange === "today" && isHistoricalLeaderboardDaily) {
+      navigation.navigate(
+        `/kpis/${line.id}?date=${encodeURIComponent(effectiveLeaderboardDate)}&shift=${effectiveLeaderboardShiftId}`
+      );
+      return;
+    }
     navigation.navigate(`/kpis/${line.id}`);
   };
   const handleBackClick = useCallback(() => {
@@ -62722,21 +63338,24 @@ var KPIsOverviewView = ({
     });
     setActiveTab(newTab);
   }, [activeTab, leaderboardLines.length, lines.length]);
-  const formatLocalDate2 = (date) => {
-    const options = {
+  const formatLocalDate2 = useCallback((dateKey) => {
+    return formatDateKey(dateKey, configuredTimezone, {
       year: "numeric",
       month: "long",
       day: "numeric"
-    };
-    return date.toLocaleDateString("en-US", options);
-  };
+    });
+  }, [configuredTimezone]);
   const getMonthRange = () => {
-    const now4 = /* @__PURE__ */ new Date();
-    const startOfMonth2 = new Date(now4.getFullYear(), now4.getMonth(), 1);
-    const endOfMonth2 = new Date(now4.getFullYear(), now4.getMonth() + 1, 0);
-    const startLabel = startOfMonth2.toLocaleDateString("en-US", { month: "short", day: "numeric" });
-    const endLabel = endOfMonth2.toLocaleDateString("en-US", { month: "short", day: "numeric" });
-    return `${startLabel} - ${endLabel}, ${now4.getFullYear()}`;
+    const zonedNow = toZonedTime(/* @__PURE__ */ new Date(), configuredTimezone);
+    const startOfMonthKey = buildDateKey(zonedNow.getFullYear(), zonedNow.getMonth(), 1);
+    const endOfMonthKey = buildDateKey(
+      zonedNow.getFullYear(),
+      zonedNow.getMonth(),
+      new Date(zonedNow.getFullYear(), zonedNow.getMonth() + 1, 0).getDate()
+    );
+    const startLabel = formatDateKey(startOfMonthKey, configuredTimezone, { month: "short", day: "numeric" });
+    const endLabel = formatDateKey(endOfMonthKey, configuredTimezone, { month: "short", day: "numeric" });
+    return `${startLabel} - ${endLabel}, ${zonedNow.getFullYear()}`;
   };
   const isMonthlyMode = activeTab === "leaderboard" && timeRange === "monthly";
   const isLeaderboardLoading = timeRange === "today" ? dailyLoading : monthlyLoading;
@@ -62745,8 +63364,13 @@ var KPIsOverviewView = ({
   const showTopPerformerImage = Boolean(topPerformer.imageUrl) && !topPerformerImageError;
   typeof topPerformer.efficiency === "number" && Number.isFinite(topPerformer.efficiency);
   topPerformerLoading ? "--" : typeof topPerformer.efficiency === "number" && Number.isFinite(topPerformer.efficiency) ? `${topPerformer.efficiency.toFixed(1)}%` : "--";
+  const showHistoricalLeaderboardHeader = activeTab === "leaderboard" && timeRange === "today" && isHistoricalLeaderboardDaily;
+  const headerDateKey = activeTab === "leaderboard" && timeRange === "today" ? effectiveLeaderboardDate : monthEndDateKey;
+  const headerShiftId = showHistoricalLeaderboardHeader ? effectiveLeaderboardShiftId : currentShiftDetails.shiftId;
+  const headerShiftName = getShiftNameById(headerShiftId, configuredTimezone, shiftConfig).replace(/ Shift$/i, "");
+  const headerDateLabel = isMonthlyMode ? getMonthRange() : formatLocalDate2(headerDateKey);
   const getShiftIcon = (shiftId) => {
-    const shiftNameLower = shiftName.toLowerCase();
+    const shiftNameLower = getShiftNameById(shiftId, configuredTimezone, shiftConfig).toLowerCase();
     if (shiftNameLower.includes("day") || shiftNameLower.includes("morning") || shiftId === 0) {
       return /* @__PURE__ */ jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" }) });
     }
@@ -62849,18 +63473,26 @@ var KPIsOverviewView = ({
           ),
           /* @__PURE__ */ jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold text-gray-900", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
-            /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-emerald-500 animate-pulse ring-2 ring-emerald-500/20" })
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `h-2 w-2 rounded-full ring-2 ${showHistoricalLeaderboardHeader ? "bg-amber-500 ring-amber-500/20" : "bg-emerald-500 animate-pulse ring-emerald-500/20"}`
+              }
+            )
           ] }) }),
           /* @__PURE__ */ jsx("div", { className: "w-12" })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-center gap-2", children: [
-          /* @__PURE__ */ jsx("div", { className: `inline-flex items-center bg-gray-100 rounded-full ${isMonthlyMode ? "px-4 py-1.5 ring-1 ring-gray-200 shadow-sm" : "px-2.5 py-1"}`, children: /* @__PURE__ */ jsx("span", { className: `font-medium text-gray-700 ${isMonthlyMode ? "text-sm" : "text-xs"}`, children: isMonthlyMode ? getMonthRange() : formatLocalDate2(/* @__PURE__ */ new Date()) }) }),
+          /* @__PURE__ */ jsx("div", { className: `inline-flex items-center bg-gray-100 rounded-full ${isMonthlyMode ? "px-4 py-1.5 ring-1 ring-gray-200 shadow-sm" : "px-2.5 py-1"}`, children: /* @__PURE__ */ jsx("span", { className: `font-medium text-gray-700 ${isMonthlyMode ? "text-sm" : "text-xs"}`, children: headerDateLabel }) }),
           !isMonthlyMode && /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-gray-100 rounded-full", children: [
-              /* @__PURE__ */ jsx("div", { className: "text-gray-700 scale-90", children: getShiftIcon(currentShiftDetails.shiftId) }),
-              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: shiftName })
+              /* @__PURE__ */ jsx("div", { className: "text-gray-700 scale-90", children: getShiftIcon(headerShiftId) }),
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: headerShiftName })
             ] }),
-            /* @__PURE__ */ jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-green-100 rounded-full", children: /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-green-700", children: /* @__PURE__ */ jsx(ISTTimer_default, {}) }) })
+            showHistoricalLeaderboardHeader ? /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-amber-50 text-amber-700 rounded-full", children: [
+              /* @__PURE__ */ jsx(Clock, { className: "w-3 h-3" }),
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium", children: "Historical" })
+            ] }) : /* @__PURE__ */ jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-green-100 rounded-full", children: /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-green-700", children: /* @__PURE__ */ jsx(ISTTimer_default, {}) }) })
           ] })
         ] }),
         activeTab !== "leaderboard" && /* @__PURE__ */ jsx("div", { className: "mt-4 bg-white shadow-md hover:shadow-lg transition-all duration-300 ease-out hover:scale-[1.01] relative rounded-2xl border border-amber-100 pl-2 pr-4 py-1.5 flex items-center justify-between group", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 min-w-0", children: [
@@ -62961,7 +63593,12 @@ var KPIsOverviewView = ({
           ) }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
             /* @__PURE__ */ jsx("h1", { className: "text-2xl md:text-3xl lg:text-4xl font-semibold text-gray-900 tracking-tight", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
-            /* @__PURE__ */ jsx("div", { className: "h-2.5 w-2.5 rounded-full bg-emerald-500 animate-pulse ring-4 ring-emerald-500/10 flex-shrink-0" })
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `h-2.5 w-2.5 rounded-full ring-4 flex-shrink-0 ${showHistoricalLeaderboardHeader ? "bg-amber-500 ring-amber-500/10" : "bg-emerald-500 animate-pulse ring-emerald-500/10"}`
+              }
+            )
           ] }),
           !topPerformerLoading && activeTab !== "leaderboard" && /* @__PURE__ */ jsx("div", { className: "absolute right-0 top-1/2 -translate-y-1/2 z-10", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-2xl border border-amber-200 shadow-md pl-1.5 pr-4 py-1.5 flex items-center gap-4 transition-all hover:shadow-lg hover:border-amber-300 group", children: [
             /* @__PURE__ */ jsxs("div", { className: "relative", children: [
@@ -63031,7 +63668,7 @@ var KPIsOverviewView = ({
           ] }) })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "bg-blue-50/50 px-4 py-2 rounded-xl border border-blue-100/50 backdrop-blur-sm", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-6", children: [
-          !isMonthlyMode && /* @__PURE__ */ jsxs(Fragment, { children: [
+          !isMonthlyMode && !showHistoricalLeaderboardHeader && /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-blue-700", children: [
               /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 opacity-70", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
               /* @__PURE__ */ jsx("span", { className: "text-base font-semibold tabular-nums", children: /* @__PURE__ */ jsx(ISTTimer_default, {}) })
@@ -63040,16 +63677,23 @@ var KPIsOverviewView = ({
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-blue-600", children: [
             /* @__PURE__ */ jsx("svg", { className: `w-4 h-4 opacity-70 ${isMonthlyMode ? "scale-110" : ""}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
-            /* @__PURE__ */ jsx("span", { className: `${isMonthlyMode ? "text-base font-medium" : "text-sm font-medium"}`, children: isMonthlyMode ? getMonthRange() : formatLocalDate2(/* @__PURE__ */ new Date()) })
+            /* @__PURE__ */ jsx("span", { className: `${isMonthlyMode ? "text-base font-medium" : "text-sm font-medium"}`, children: headerDateLabel })
           ] }),
           !isMonthlyMode && /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx("div", { className: "w-px h-4 bg-blue-200" }),
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-blue-600", children: [
-              /* @__PURE__ */ jsx("div", { className: "opacity-70", children: getShiftIcon(currentShiftDetails.shiftId) }),
+              /* @__PURE__ */ jsx("div", { className: "opacity-70", children: getShiftIcon(headerShiftId) }),
               /* @__PURE__ */ jsxs("span", { className: "text-sm font-semibold uppercase tracking-wider", children: [
-                shiftName,
+                headerShiftName,
                 " Shift"
               ] })
+            ] }),
+            showHistoricalLeaderboardHeader && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("div", { className: "w-px h-4 bg-blue-200" }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-2.5 py-1 bg-amber-50 text-amber-700 rounded-full border border-amber-200", children: [
+                /* @__PURE__ */ jsx(Clock, { className: "w-3.5 h-3.5" }),
+                /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold uppercase tracking-wider", children: "Historical" })
+              ] })
             ] })
           ] })
         ] }) }),
@@ -63072,19 +63716,52 @@ var KPIsOverviewView = ({
               }
             )
           ] }),
-          (activeTab === "leaderboard" || activeTab === "today") && showViewTypeDropdown && /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs(
-            "select",
-            {
-              value: viewType,
-              onChange: (e) => setViewType(e.target.value),
-              className: "appearance-none pl-3 pr-8 py-1.5 text-sm font-medium bg-white border border-gray-200 hover:border-gray-300 rounded-lg text-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-all cursor-pointer shadow-sm",
-              style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.5rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
-              children: [
-                /* @__PURE__ */ jsx("option", { value: "operator", children: "Workforce" }),
-                /* @__PURE__ */ jsx("option", { value: "machine", children: "Machine" })
-              ]
-            }
-          ) })
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            activeTab === "leaderboard" && timeRange === "today" && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                MonthlyRangeFilter_default,
+                {
+                  month: parseDateKeyToDate(effectiveLeaderboardDate).getMonth(),
+                  year: parseDateKeyToDate(effectiveLeaderboardDate).getFullYear(),
+                  timezone: configuredTimezone,
+                  value: {
+                    startKey: effectiveLeaderboardDate,
+                    endKey: effectiveLeaderboardDate
+                  },
+                  onChange: (range) => {
+                    setSelectedLeaderboardDate(range.startKey);
+                  },
+                  showLabel: false,
+                  singleDateOnly: true
+                }
+              ),
+              isHistoricalLeaderboardDaily && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    setSelectedLeaderboardDate(currentShiftDate);
+                    setSelectedLeaderboardShiftId(currentShiftId);
+                  },
+                  className: "text-xs font-medium text-blue-600 hover:text-blue-700 whitespace-nowrap",
+                  children: "Return to Live"
+                }
+              )
+            ] }),
+            (activeTab === "leaderboard" || activeTab === "today") && showViewTypeDropdown && /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs(
+              "select",
+              {
+                value: viewType,
+                onChange: (e) => setViewType(e.target.value),
+                className: "appearance-none pl-3 pr-8 py-1.5 text-sm font-medium bg-white border border-gray-200 hover:border-gray-300 rounded-lg text-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-all cursor-pointer shadow-sm",
+                style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.5rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "operator", children: "Workforce" }),
+                  /* @__PURE__ */ jsx("option", { value: "machine", children: "Machine" })
+                ]
+              }
+            ) })
+          ] })
         ] })
       ] })
     ] }) }),
@@ -63129,7 +63806,9 @@ var KPIsOverviewView = ({
           shiftEndDate,
           monthEndDate,
           viewType,
-          setViewType
+          setViewType,
+          timezone: configuredTimezone,
+          isHistoricalDaily: isHistoricalLeaderboardDaily
         }
       ) })
     ) })
@@ -64671,51 +65350,41 @@ var ClipsCostView = () => {
         /* @__PURE__ */ jsx("div", { className: "min-w-[120px]" })
       ] }) })
     ] }) }),
-    /* @__PURE__ */ jsx("main", { className: "flex-1 p-4 sm:p-6 lg:p-8 max-w-7xl mx-auto w-full", children: error ? /* @__PURE__ */ jsxs("div", { className: "p-4 bg-red-50 border border-red-200 rounded-lg flex items-start gap-3 text-red-700 animate-in fade-in slide-in-from-top-2 max-w-2xl mx-auto", children: [
+    /* @__PURE__ */ jsx("main", { className: "flex-1 p-4 sm:p-6 lg:p-8 max-w-5xl mx-auto w-full", children: error ? /* @__PURE__ */ jsxs("div", { className: "p-4 bg-red-50 border border-red-200 rounded-lg flex items-start gap-3 text-red-700 animate-in fade-in slide-in-from-top-2 max-w-2xl mx-auto", children: [
       /* @__PURE__ */ jsx(AlertCircle, { className: "h-5 w-5 flex-shrink-0 mt-0.5" }),
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("h3", { className: "font-medium", children: "Error loading usage data" }),
         /* @__PURE__ */ jsx("p", { className: "text-sm mt-1 text-red-600", children: error })
       ] })
-    ] }) : /* @__PURE__ */ jsxs("div", { className: "max-w-xl mt-8 animate-in fade-in slide-in-from-bottom-4 duration-500", children: [
-      /* @__PURE__ */ jsx(Card2, { className: "overflow-hidden shadow-sm border-gray-200 bg-white", children: /* @__PURE__ */ jsx(CardContent2, { className: "p-8", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center text-center", children: [
-        /* @__PURE__ */ jsx("div", { className: "p-3 bg-blue-50 rounded-full mb-4", children: /* @__PURE__ */ jsx(Film, { className: "h-8 w-8 text-blue-600" }) }),
-        /* @__PURE__ */ jsx("h2", { className: "text-sm font-medium text-gray-500 uppercase tracking-wider mb-2", children: "Clips Analyzed" }),
-        /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mb-3", children: formatMonthLabel(data?.monthStart) }),
-        /* @__PURE__ */ jsx("div", { className: "text-5xl font-bold text-gray-900 mb-2 tabular-nums tracking-tight", children: formatNumber(data?.monthlyClassifications || 0) })
-      ] }) }) }),
-      /* @__PURE__ */ jsx(Card2, { className: "mt-4 overflow-hidden shadow-sm border-gray-200 bg-white", children: /* @__PURE__ */ jsxs(CardContent2, { className: "p-6", children: [
-        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-gray-900 mb-3 uppercase tracking-wider", children: "Previous Months" }),
-        (data?.historicalMonthlyClassifications?.length || 0) === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: "No historical month usage yet." }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: data?.historicalMonthlyClassifications.map((item) => /* @__PURE__ */ jsxs(
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "mt-8 grid grid-cols-1 lg:grid-cols-3 gap-6 animate-in fade-in slide-in-from-bottom-4 duration-500", children: [
+      /* @__PURE__ */ jsx("div", { className: "lg:col-span-2", children: /* @__PURE__ */ jsx(Card2, { className: "overflow-hidden shadow-sm border-gray-200 bg-white h-full flex flex-col justify-center", children: /* @__PURE__ */ jsx(CardContent2, { className: "p-10 lg:p-14", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center text-center", children: [
+        /* @__PURE__ */ jsx("div", { className: "p-4 bg-blue-50/50 rounded-2xl mb-6 ring-1 ring-blue-100/50", children: /* @__PURE__ */ jsx(Film, { className: "h-10 w-10 text-blue-600", strokeWidth: 1.5 }) }),
+        /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-600 uppercase tracking-widest mb-3", children: "Current Month Usage" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-400 mb-6", children: formatMonthLabel(data?.monthStart) }),
+        /* @__PURE__ */ jsx("div", { className: "flex items-baseline gap-2 mb-2", children: /* @__PURE__ */ jsx("div", { className: "text-7xl font-bold text-gray-900 tabular-nums tracking-tighter", children: formatNumber(data?.monthlyClassifications || 0) }) }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 mt-4", children: "Clips analyzed and processed by our AI pipeline" })
+      ] }) }) }) }),
+      /* @__PURE__ */ jsx("div", { className: "lg:col-span-1", children: /* @__PURE__ */ jsx(Card2, { className: "overflow-hidden shadow-sm border-gray-200 bg-white h-full", children: /* @__PURE__ */ jsxs(CardContent2, { className: "p-6 lg:p-8 flex flex-col h-full", children: [
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-gray-900 mb-6 uppercase tracking-widest", children: "Previous Months" }),
+        (data?.historicalMonthlyClassifications?.length || 0) === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col items-center justify-center text-center py-8", children: [
+          /* @__PURE__ */ jsx("div", { className: "p-3 bg-gray-50 rounded-full mb-3", children: /* @__PURE__ */ jsx(Film, { className: "h-6 w-6 text-gray-400", strokeWidth: 1.5 }) }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: "No historical month usage yet." })
+        ] }) : /* @__PURE__ */ jsx("div", { className: "space-y-3 flex-1 overflow-y-auto pr-2", children: data?.historicalMonthlyClassifications.map((item) => /* @__PURE__ */ jsxs(
           "div",
           {
-            className: "flex items-center justify-between rounded-md border border-gray-100 bg-gray-50 px-3 py-2",
+            className: "group flex items-center justify-between rounded-xl border border-gray-100 bg-gray-50/50 hover:bg-white hover:border-gray-200 hover:shadow-sm px-4 py-3.5 transition-all duration-200",
             children: [
-              /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-700", children: formatMonthLabel(item.monthStart) }),
-              /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-gray-900 tabular-nums", children: formatNumber(item.classifications) })
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-600 group-hover:text-gray-900 transition-colors", children: formatMonthLabel(item.monthStart) }),
+              /* @__PURE__ */ jsx("span", { className: "text-base font-semibold text-gray-900 tabular-nums", children: formatNumber(item.classifications) })
             ]
           },
           item.monthStart
         )) })
-      ] }) })
+      ] }) }) })
     ] }) })
   ] });
 };
 var ClipsCostView_default = ClipsCostView;
-
-// src/lib/constants/actions.ts
-var ACTION_NAMES = {
-  /** Assembly operations */
-  ASSEMBLY: "Assembly",
-  /** Packaging operations */
-  PACKAGING: "Packaging",
-  /** Inspection operations */
-  INSPECTION: "Inspection",
-  /** Testing operations */
-  TESTING: "Testing",
-  /** Quality control operations */
-  QUALITY_CONTROL: "Quality Control"
-};
 var calculateShiftHours = (startTime, endTime, breaks = []) => {
   if (!startTime || !endTime) return 8;
   const [startHour, startMinute] = startTime.split(":").map(Number);
@@ -65297,9 +65966,9 @@ var ShiftsView = ({
         const actionIds = Array.from(
           new Set(currentThresholds.map((threshold) => threshold.action_id).filter(Boolean))
         );
-        const actionNameById = /* @__PURE__ */ new Map();
+        const actionMetadataById = /* @__PURE__ */ new Map();
         if (actionIds.length > 0) {
-          const { data: actionRows, error: actionsError } = await supabase.from("actions").select("id, action_name").in("id", actionIds);
+          const { data: actionRows, error: actionsError } = await supabase.from("actions").select("id, action_name, action_family").in("id", actionIds);
           if (actionsError) {
             console.warn(
               `[ShiftsView] Failed to resolve action names for line ${lineId}, shift ${shift.shiftId}: ${actionsError.message}`
@@ -65307,7 +65976,13 @@ var ShiftsView = ({
           } else {
             (actionRows || []).forEach((actionRow) => {
               if (actionRow.id && actionRow.action_name) {
-                actionNameById.set(actionRow.id, actionRow.action_name);
+                actionMetadataById.set(actionRow.id, {
+                  action_name: actionRow.action_name,
+                  action_family: normalizeActionFamily({
+                    actionFamily: actionRow.action_family,
+                    actionName: actionRow.action_name
+                  })
+                });
               }
             });
           }
@@ -65328,7 +66003,7 @@ var ShiftsView = ({
             nextDayOutput = dayOutputToKeep;
             nextPPH = newShiftHours > 0 ? Math.round(dayOutputToKeep / newShiftHours) : 0;
           }
-          const resolvedActionName = (typeof threshold.action_name === "string" && threshold.action_name.trim().length > 0 ? threshold.action_name : actionNameById.get(threshold.action_id)) || ACTION_NAMES.ASSEMBLY;
+          const resolvedActionName = (typeof threshold.action_name === "string" && threshold.action_name.trim().length > 0 ? threshold.action_name : actionMetadataById.get(threshold.action_id)?.action_name) || ACTION_NAMES.ASSEMBLY;
           return {
             line_id: threshold.line_id || lineId,
             shift_id: shift.shiftId,
@@ -65349,18 +66024,20 @@ var ShiftsView = ({
             `Failed to update action thresholds for line ${lineId}, shift ${shift.shiftId}: ${thresholdsUpsertError.message}`
           );
         }
-        const packagingActionIds = new Set(
-          Array.from(actionNameById.entries()).filter(([, actionName]) => actionName.toLowerCase() === ACTION_NAMES.PACKAGING.toLowerCase()).map(([actionId]) => actionId)
+        const outputActionIds = new Set(
+          Array.from(actionMetadataById.entries()).filter(([, action]) => action.action_family === ACTION_FAMILIES.OUTPUT).map(([actionId]) => actionId)
         );
-        const packagingThresholds = recalculatedThresholds.filter((threshold) => {
-          if (packagingActionIds.has(threshold.action_id)) return true;
-          return typeof threshold.action_name === "string" && threshold.action_name.toLowerCase() === ACTION_NAMES.PACKAGING.toLowerCase();
+        const outputThresholds = recalculatedThresholds.filter((threshold) => {
+          if (outputActionIds.has(threshold.action_id)) return true;
+          return normalizeActionFamily({
+            actionName: threshold.action_name
+          }) === ACTION_FAMILIES.OUTPUT;
         });
-        const thresholdDayOutput = packagingThresholds.reduce(
+        const thresholdDayOutput = outputThresholds.reduce(
           (sum, threshold) => sum + (Number(threshold.total_day_output) || 0),
           0
         );
-        const thresholdPPH = packagingThresholds.reduce(
+        const thresholdPPH = outputThresholds.reduce(
           (sum, threshold) => sum + (Number(threshold.pph_threshold) || 0),
           0
         );
@@ -66571,7 +67248,7 @@ var TargetsViewUI = ({
                             "aria-label": `Action type for ${formattedName}`,
                             children: [
                               /* @__PURE__ */ jsx("option", { value: "assembly", className: "py-2", children: "Assembly" }),
-                              /* @__PURE__ */ jsx("option", { value: "packaging", className: "py-2", children: "Packaging" })
+                              /* @__PURE__ */ jsx("option", { value: "output", className: "py-2", children: ACTION_NAMES.OUTPUT })
                             ]
                           }
                         ) }),
@@ -66642,7 +67319,7 @@ var TargetsViewUI = ({
                               "aria-label": `Action type for ${formattedName}`,
                               children: [
                                 /* @__PURE__ */ jsx("option", { value: "assembly", children: "Assembly" }),
-                                /* @__PURE__ */ jsx("option", { value: "packaging", children: "Packaging" })
+                                /* @__PURE__ */ jsx("option", { value: "output", children: ACTION_NAMES.OUTPUT })
                               ]
                             }
                           )
@@ -66847,14 +67524,20 @@ var TargetsView = ({
           throw new Error("Failed to fetch bulk targets data");
         }
         const { data } = bulkResponse;
-        const assemblyAction = Object.values(data.actions).find((a) => a.action_name === ACTION_NAMES.ASSEMBLY);
-        const packagingAction = Object.values(data.actions).find((a) => a.action_name === ACTION_NAMES.PACKAGING);
-        if (!assemblyAction || !packagingAction) {
+        const assemblyAction = data.actions[ACTION_FAMILIES.ASSEMBLY] || Object.values(data.actions).find((a) => normalizeActionFamily({
+          actionFamily: a.action_family,
+          actionName: a.action_name
+        }) === ACTION_FAMILIES.ASSEMBLY);
+        const outputAction = data.actions[ACTION_FAMILIES.OUTPUT] || Object.values(data.actions).find((a) => normalizeActionFamily({
+          actionFamily: a.action_family,
+          actionName: a.action_name
+        }) === ACTION_FAMILIES.OUTPUT);
+        if (!assemblyAction || !outputAction) {
           throw new Error("Could not find required actions in bulk response");
         }
         const actionIdsData = {
           assembly: assemblyAction.id,
-          packaging: packagingAction.id
+          output: outputAction.id
         };
         setActionIds(actionIdsData);
         const newAllShiftsData = {};
@@ -66899,12 +67582,16 @@ var TargetsView = ({
               let actionType = "assembly";
               let actionId = actionIdsData.assembly;
               const effectiveActionId = threshold?.action_id ?? ws.action_id;
-              if (effectiveActionId === packagingAction.id || !effectiveActionId && ws.action_type === "packaging") {
-                actionType = "packaging";
-                actionId = packagingAction.id;
-              } else if (effectiveActionId === assemblyAction.id || !effectiveActionId && ws.action_type === "assembly") {
+              const effectiveActionFamily = normalizeActionFamily({
+                actionFamily: threshold?.action_family,
+                actionType: ws.action_type
+              });
+              if (effectiveActionFamily === ACTION_FAMILIES.OUTPUT || effectiveActionId === outputAction.id || !effectiveActionId && ws.action_type === "output") {
+                actionType = "output";
+                actionId = effectiveActionId || outputAction.id;
+              } else if (effectiveActionFamily === ACTION_FAMILIES.ASSEMBLY || effectiveActionId === assemblyAction.id || !effectiveActionId && ws.action_type === "assembly") {
                 actionType = "assembly";
-                actionId = assemblyAction.id;
+                actionId = effectiveActionId || assemblyAction.id;
               }
               return {
                 id: ws.id,
@@ -67176,7 +67863,9 @@ var TargetsView = ({
         // Round to whole number
         ideal_cycle_time: Number(ws.targetCycleTime) || 0,
         total_day_output: Number(ws.targetDayOutput) || 0,
-        action_name: ws.actionType === "assembly" ? ACTION_NAMES.ASSEMBLY : ACTION_NAMES.PACKAGING,
+        action_name: ws.actionType === "assembly" ? ACTION_NAMES.ASSEMBLY : ACTION_NAMES.OUTPUT,
+        action_family: ws.actionType,
+        display_name: ws.actionType === "assembly" ? ACTION_NAMES.ASSEMBLY : ACTION_NAMES.OUTPUT,
         updated_by: currentEffectiveUserId,
         // Use the potentially hardcoded ID
         ...skuEnabled && lineDataToSave.selectedSKU ? { sku_id: lineDataToSave.selectedSKU.id } : {}
@@ -67184,7 +67873,7 @@ var TargetsView = ({
       console.log(`[handleSaveLine] workspaceThresholdUpdates for ${lineId}:`, workspaceThresholdUpdates);
       await workspaceService.updateActionThresholds(workspaceThresholdUpdates);
       console.log(`[handleSaveLine] Successfully updated action thresholds for ${lineId}`);
-      const packagingWorkspaces = lineDataToSave.workspaces.filter((ws) => ws.actionType === "packaging");
+      const outputWorkspaces = lineDataToSave.workspaces.filter((ws) => ws.actionType === "output");
       let resolvedLineThresholdSkuId = lineDataToSave.selectedSKU?.id || null;
       if (!resolvedLineThresholdSkuId) {
         const { data: dummySkuRows, error: dummySkuError } = await supabase.from("skus").select("id").eq("line_id", lineId).eq("sku_definition", "dummy_definition").eq("is_active", true).limit(1);
@@ -67202,8 +67891,8 @@ var TargetsView = ({
         date: currentDate,
         shift_id: selectedShift,
         product_code: lineDataToSave.productId,
-        threshold_day_output: packagingWorkspaces.reduce((acc, ws) => acc + (Number(ws.targetDayOutput) || 0), 0),
-        threshold_pph: packagingWorkspaces.reduce((acc, ws) => acc + (ws.targetPPH ? Math.round(Number(ws.targetPPH)) : 0), 0),
+        threshold_day_output: outputWorkspaces.reduce((acc, ws) => acc + (Number(ws.targetDayOutput) || 0), 0),
+        threshold_pph: outputWorkspaces.reduce((acc, ws) => acc + (ws.targetPPH ? Math.round(Number(ws.targetPPH)) : 0), 0),
         // Round each PPH value
         sku_id: resolvedLineThresholdSkuId
       };
@@ -67731,6 +68420,7 @@ var WorkspaceDetailView = ({
       avg_efficiency: Number(cachedOverviewMetrics.efficiency || 0),
       total_actions: totalActions,
       hourly_action_counts: [],
+      hourly_cycle_times: [],
       workspace_rank: 0,
       total_workspaces: 0,
       ideal_output_until_now: idealOutput,
@@ -67741,6 +68431,22 @@ var WorkspaceDetailView = ({
   }, [cachedOverviewMetrics, shiftConfig?.shifts]);
   const workspace = (isHistoricView ? historicMetrics : liveMetrics) || cachedDetailedMetrics || overviewFallback;
   const detailedWorkspaceMetrics = (isHistoricView ? historicMetrics : liveMetrics) || cachedDetailedMetrics;
+  const cycleTimeChartData = useMemo(
+    () => Array.isArray(workspace?.hourly_cycle_times) ? workspace.hourly_cycle_times.map((value) => {
+      const numericValue = Number(value);
+      return Number.isFinite(numericValue) ? numericValue : 0;
+    }) : [],
+    [workspace?.hourly_cycle_times]
+  );
+  const cycleTimeDatasetKey = useMemo(
+    () => [
+      workspace?.workspace_id || workspaceId || "workspace",
+      date || workspace?.date || "live",
+      parsedShiftId ?? workspace?.shift_id ?? "current",
+      "hourly"
+    ].join(":"),
+    [workspace?.workspace_id, workspaceId, date, workspace?.date, parsedShiftId, workspace?.shift_id]
+  );
   const hasWorkspaceSnapshot = Boolean(workspace);
   const loading = ((isHistoricView ? historicLoading : liveLoading) || isShiftConfigLoading) && !hasWorkspaceSnapshot;
   const error = isHistoricView ? historicError : liveError;
@@ -67982,10 +68688,47 @@ var WorkspaceDetailView = ({
     return filterDataByDateKeyRange(monthlyData, range);
   }, [monthlyData, range]);
   const formattedWorkspaceName = displayName || formatWorkspaceName3(workspace?.workspace_name || "", effectiveLineId);
-  const shouldShowCycleTimeChart = !isUptimeMode && (showCycleTimeChart ?? formattedWorkspaceName.startsWith("FINAL ASSY"));
+  const workspaceActionType = workspace && "action_type" in workspace ? workspace.action_type : void 0;
+  const workspaceAssemblyEnabled = workspace && "line_assembly_enabled" in workspace ? workspace.line_assembly_enabled === true : false;
+  const isAssemblyWorkspace = workspaceActionType === "assembly" || workspaceAssemblyEnabled;
+  const shouldShowCycleTimeChart = !isUptimeMode && (showCycleTimeChart ?? isAssemblyWorkspace);
   const showIdleBreakdownChart = !shouldShowCycleTimeChart && idleTimeVlmEnabled;
   const idleClipDate = date || workspace?.date || calculatedOperationalDate || getOperationalDate(timezone);
   const idleClipShiftId = parsedShiftId ?? workspace?.shift_id;
+  const hourlyIdleMinutes = useMemo(() => {
+    if (!shouldShowCycleTimeChart || !workspace?.idle_time_hourly || !workspace?.shift_start) return [];
+    const parseTimeToMinutes3 = (time2) => {
+      const [h, m] = time2.split(":").map(Number);
+      if (!Number.isFinite(h) || !Number.isFinite(m)) return 0;
+      return h * 60 + m;
+    };
+    const startTotal = parseTimeToMinutes3(workspace.shift_start);
+    const endTotalRaw = workspace.shift_end ? parseTimeToMinutes3(workspace.shift_end) : startTotal + 11 * 60;
+    const endTotal = endTotalRaw <= startTotal ? endTotalRaw + 24 * 60 : endTotalRaw;
+    const shiftDuration = Math.max(60, endTotal - startTotal);
+    const totalHourSlots = Math.max(1, Math.ceil(shiftDuration / 60));
+    const idleTimeHourlyObj = workspace.idle_time_hourly || {};
+    const result = Array(totalHourSlots).fill(0);
+    for (let i = 0; i < totalHourSlots; i++) {
+      const startSlotMins = startTotal + i * 60;
+      let endSlotMins = startSlotMins + 60;
+      if (endSlotMins > endTotal) endSlotMins = endTotal;
+      let idleCount = 0;
+      for (let m = startSlotMins; m < endSlotMins; m++) {
+        const hourKey = Math.floor(m / 60) % 24;
+        const minuteKey = m % 60;
+        const hourData = idleTimeHourlyObj[hourKey.toString()] || [];
+        if (Array.isArray(hourData)) {
+          const val = hourData[minuteKey];
+          if (val === 1 || val === "1") {
+            idleCount++;
+          }
+        }
+      }
+      result[i] = idleCount;
+    }
+    return result;
+  }, [shouldShowCycleTimeChart, workspace?.idle_time_hourly, workspace?.shift_start, workspace?.shift_end]);
   const shiftDurationMinutes = useMemo(
     () => getShiftDurationMinutes(workspace?.shift_start, workspace?.shift_end),
     [workspace?.shift_start, workspace?.shift_end]
@@ -68058,7 +68801,7 @@ var WorkspaceDetailView = ({
     }
   }, [returnUrl]);
   const handleBackNavigation = () => {
-    if (date || shift) {
+    if (isHistoricView) {
       setActiveTab("monthly_history");
       if (onNavigate) {
         const params = new URLSearchParams();
@@ -68222,7 +68965,7 @@ var WorkspaceDetailView = ({
               BackButtonMinimal,
               {
                 onClick: handleBackNavigation,
-                text: previousView === "line_monthly_history" ? "Back to Line History" : returnUrl && returnUrl.includes("monthly_history") ? "Back to Line History" : returnUrl && returnUrl.includes("/kpis/") ? "Back to KPIs" : returnUrl && returnUrl.includes("/leaderboard/") ? "Back to Leaderboard" : (date || shift) && activeTab !== "monthly_history" ? "Back to Monthly History" : "Back",
+                text: previousView === "line_monthly_history" ? "Back to Line History" : returnUrl && returnUrl.includes("monthly_history") ? "Back to Line History" : returnUrl && returnUrl.includes("/kpis/") ? "Back to KPIs" : returnUrl && returnUrl.includes("/leaderboard/") ? "Back to Leaderboard" : isHistoricView && activeTab !== "monthly_history" ? "Back to Monthly History" : "Back",
                 size: "default",
                 "aria-label": "Navigate back to previous page"
               }
@@ -68399,7 +69142,8 @@ var WorkspaceDetailView = ({
                 {
                   workspace,
                   idleTimeReasons: idleTimeChartData,
-                  efficiencyLegend
+                  efficiencyLegend,
+                  hourlyCycleTimes: cycleTimeChartData
                 }
               ) }),
               activeTab === "monthly_history" && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -68480,7 +69224,7 @@ var WorkspaceDetailView = ({
                   animate: "animate",
                   children: [
                     /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-4", children: [
-                      /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-700", children: isUptimeMode ? "Machine Utilization" : shouldShowCycleTimeChart ? "Cycle Time (last 60 minutes)" : "Hourly Output" }),
+                      /* @__PURE__ */ jsx("h3", { className: "text-lg font-bold text-gray-700", children: isUptimeMode ? "Machine Utilization" : shouldShowCycleTimeChart ? "Cycle time trend" : "Hourly Output" }),
                       !isUptimeMode && /* @__PURE__ */ jsx(
                         "button",
                         {
@@ -68513,9 +69257,14 @@ var WorkspaceDetailView = ({
                         ) : shouldShowCycleTimeChart ? /* @__PURE__ */ jsx(
                           CycleTimeOverTimeChart,
                           {
-                            data: workspace.hourly_action_counts || [],
+                            data: cycleTimeChartData,
                             idealCycleTime: workspace.ideal_cycle_time || 0,
-                            shiftStart: workspace.shift_start || ""
+                            shiftStart: workspace.shift_start || "",
+                            shiftEnd: workspace.shift_end || "",
+                            xAxisMode: "hourly",
+                            datasetKey: cycleTimeDatasetKey,
+                            showIdleTime: showChartIdleTime,
+                            idleTimeData: hourlyIdleMinutes
                           }
                         ) : /* @__PURE__ */ jsx(
                           HourlyOutputChart2,
@@ -68562,7 +69311,8 @@ var WorkspaceDetailView = ({
                 {
                   workspace,
                   legend: efficiencyLegend,
-                  layout: "stack"
+                  layout: "stack",
+                  idleTimeData: idleTimeVlmEnabled ? idleTimeData : void 0
                 }
               ) : /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(WorkspaceMetricCards, { workspace, legend: efficiencyLegend, className: "flex-1" }) })
             ] }),
@@ -68607,7 +69357,7 @@ var WorkspaceDetailView = ({
                         animate: "animate",
                         children: [
                           /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 mb-4 flex-none", children: [
-                            /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-700", children: isUptimeMode ? "Machine Utilization" : shouldShowCycleTimeChart ? "Cycle Time (last 60 minutes)" : "Hourly Output" }),
+                            /* @__PURE__ */ jsx("h3", { className: "text-lg font-bold text-gray-700", children: isUptimeMode ? "Machine Utilization" : shouldShowCycleTimeChart ? "Cycle time trend" : "Hourly Output" }),
                             !isUptimeMode && /* @__PURE__ */ jsx(
                               "button",
                               {
@@ -68636,9 +69386,14 @@ var WorkspaceDetailView = ({
                           ) : shouldShowCycleTimeChart ? /* @__PURE__ */ jsx(
                             CycleTimeOverTimeChart,
                             {
-                              data: workspace.hourly_action_counts || [],
+                              data: cycleTimeChartData,
                               idealCycleTime: workspace.ideal_cycle_time || 0,
-                              shiftStart: workspace.shift_start || ""
+                              shiftStart: workspace.shift_start || "",
+                              shiftEnd: workspace.shift_end || "",
+                              xAxisMode: "hourly",
+                              datasetKey: cycleTimeDatasetKey,
+                              showIdleTime: showChartIdleTime,
+                              idleTimeData: hourlyIdleMinutes
                             }
                           ) : /* @__PURE__ */ jsx(
                             HourlyOutputChart2,
@@ -68690,7 +69445,8 @@ var WorkspaceDetailView = ({
                   workspace,
                   legend: efficiencyLegend,
                   layout: "grid",
-                  className: desktopBottomSectionClass
+                  className: desktopBottomSectionClass,
+                  idleTimeData: idleTimeVlmEnabled ? idleTimeData : void 0
                 }
               ) : /* @__PURE__ */ jsx("div", { className: clsx("flex min-h-0", desktopBottomSectionClass), children: /* @__PURE__ */ jsx(WorkspaceMetricCards, { workspace, legend: efficiencyLegend, className: "flex-1" }) })
             ] })
@@ -68720,6 +69476,7 @@ var WorkspaceDetailView = ({
                 availableShifts: shiftConfig?.shifts?.map((s) => ({ id: s.shiftId, name: s.shiftName })),
                 legend: efficiencyLegend,
                 trendSummary: workspaceMonthlyTrend,
+                isAssemblyWorkspace,
                 onDateSelect: (selectedDate, shiftId) => {
                   if (onDateSelect) {
                     onDateSelect(selectedDate, shiftId);
@@ -74807,6 +75564,11 @@ var normalizeTrend = (value) => ({
 });
 var normalizeIdleBreakdown = (value) => (value || []).map((item) => ({
   reason: item?.reason?.trim() || "Unknown",
+  reason_key: item?.reason_key?.trim() || item?.reason?.trim() || "unknown",
+  display_name: item?.display_name?.trim() || void 0,
+  palette_token: item?.palette_token?.trim() || void 0,
+  icon_token: item?.icon_token?.trim() || void 0,
+  is_known: typeof item?.is_known === "boolean" ? item.is_known : null,
   percentage: normalizeNumber(item?.percentage),
   total_duration_seconds: normalizeNumber(item?.total_duration_seconds),
   efficiency_loss_percentage: normalizeNumber(item?.efficiency_loss_percentage),
@@ -75858,7 +76620,12 @@ var IdleBreakdownCard = React141__default.memo(({
   const showInitialSkeleton = idle.loading && idle.lastUpdated === null;
   const idleBreakdown = React141__default.useMemo(() => {
     return idle.data.map((item) => ({
-      name: item.reason?.trim() || "Unknown",
+      name: item.display_name?.trim() || item.reason?.trim() || "Unknown",
+      reasonKey: item.reason_key?.trim() || item.reason?.trim() || "unknown",
+      displayName: item.display_name?.trim() || item.reason?.trim() || "Unknown",
+      paletteToken: item.palette_token?.trim(),
+      iconToken: item.icon_token?.trim(),
+      isKnown: item.is_known ?? void 0,
       value: toNumber3(item.percentage) || 0,
       totalDurationSeconds: toNumber3(item.total_duration_seconds),
       efficiencyLossPercentage: toNumber3(item.efficiency_loss_percentage),
@@ -77150,4 +77917,4 @@ var streamProxyConfig = {
   }
 };
 
-export { ACTION_NAMES, AIAgentView_default as AIAgentView, AcceptInvite, AcceptInviteView_default as AcceptInviteView, AdvancedFilterDialog, AdvancedFilterPanel, AudioService, AuthCallback, AuthCallbackView_default as AuthCallbackView, AuthProvider, AuthService, AuthenticatedBottleneckClipsView, AuthenticatedFactoryView, AuthenticatedHelpView, AuthenticatedHomeView, AuthenticatedShiftsView, AuthenticatedTargetsView, AuthenticatedTicketsView, AuthenticatedWorkspaceHealthView, AvatarUpload, AxelNotificationPopup, AxelOrb, BackButton, BackButtonMinimal, BarChart, BaseHistoryCalendar, BottleneckClipsModal, BottleneckClipsView_default as BottleneckClipsView, BottlenecksContent, BreakNotificationPopup, CachePrefetchStatus, Card2 as Card, CardContent2 as CardContent, CardDescription2 as CardDescription, CardFooter2 as CardFooter, CardHeader2 as CardHeader, CardTitle2 as CardTitle, ChangeRoleDialog, ClipFilterProvider, ClipsCostView_default as ClipsCostView, CompactWorkspaceHealthCard, ConfirmRemoveUserDialog, CongratulationsOverlay, CroppedHlsVideoPlayer, CroppedVideoPlayer, CycleTimeChart, CycleTimeOverTimeChart, DEFAULT_ANALYTICS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CONFIG, DEFAULT_DATABASE_CONFIG, DEFAULT_DATE_TIME_CONFIG, DEFAULT_ENDPOINTS_CONFIG, DEFAULT_ENTITY_CONFIG, DEFAULT_HOME_VIEW_CONFIG, DEFAULT_MAP_VIEW_CONFIG, DEFAULT_SHIFT_CONFIG, DEFAULT_SHIFT_DATA, DEFAULT_THEME_CONFIG, DEFAULT_VIDEO_CONFIG, DEFAULT_WORKSPACE_CONFIG, DEFAULT_WORKSPACE_POSITIONS, DashboardHeader, DashboardLayout, DashboardOverridesProvider, DashboardProvider, DateDisplay_default as DateDisplay, DateTimeDisplay, DebugAuth, DebugAuthView_default as DebugAuthView, DetailedHealthStatus, DiagnosisVideoModal, EFFICIENCY_ON_TRACK_THRESHOLD, EmptyStateMessage, EncouragementOverlay, FactoryAssignmentDropdown, FactoryView_default as FactoryView, FileManagerFilters, FilterDialogTrigger, FirstTimeLoginDebug, FirstTimeLoginHandler, FittingTitle, GaugeChart, GridComponentsPlaceholder, HamburgerButton, Header, HealthDateShiftSelector, HealthStatusGrid, HealthStatusIndicator, HelpView_default as HelpView, HlsVideoPlayer, HomeView_default as HomeView, HourlyOutputChart2 as HourlyOutputChart, HourlyUptimeChart, ISTTimer_default as ISTTimer, IdleTimeVlmConfigProvider, ImprovementCenterView_default as ImprovementCenterView, InlineEditableText, InteractiveOnboardingTour, InvitationService, InvitationsTable, InviteUserDialog, KPICard, KPIDetailView_default as KPIDetailView, KPIGrid, KPIHeader, KPISection, KPIsOverviewView_default as KPIsOverviewView, LINE_1_UUID, LINE_2_UUID, LargeOutputProgressChart, LeaderboardDetailView_default as LeaderboardDetailView, Legend6 as Legend, LineAssignmentDropdown, LineChart, LineHistoryCalendar, LineMonthlyHistory, LineMonthlyPdfGenerator, LinePdfExportButton, LinePdfGenerator, LineWhatsAppShareButton, LinesService, LiveTimer, LoadingInline, LoadingOverlay_default as LoadingOverlay, LoadingPage_default as LoadingPage, LoadingSkeleton, LoadingState, LoginPage, LoginView_default as LoginView, Logo, MainLayout, MapGridView, MetricCard_default as MetricCard, MinimalOnboardingPopup, MobileMenuProvider, NewClipsNotification, NoWorkspaceData, OnboardingDemo, OnboardingTour, OptifyeAgentClient, OptifyeLogoLoader_default as OptifyeLogoLoader, OutputProgressChart, PageHeader, PieChart4 as PieChart, PlantHeadView_default as PlantHeadView, PlayPauseIndicator, PrefetchConfigurationError, PrefetchError, PrefetchEvents, PrefetchStatus, PrefetchTimeoutError, ProfileView_default as ProfileView, RegistryProvider, RoleBadge, S3ClipsSupabaseService as S3ClipsService, S3Service, SKUManagementView, SOPComplianceChart, SSEChatClient, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SessionTracker, SessionTrackingContext, SessionTrackingProvider, SettingsPopup, ShiftDisplay_default as ShiftDisplay, ShiftsView_default as ShiftsView, SideNavBar, SignupWithInvitation, SilentErrorBoundary, SimpleOnboardingPopup, SingleVideoStream_default as SingleVideoStream, Skeleton, SubscriptionManager, SubscriptionManagerProvider, SupabaseProvider, SupervisorDropdown_default as SupervisorDropdown, SupervisorManagementView_default as SupervisorManagementView, SupervisorService, TargetWorkspaceGrid, TargetsView_default as TargetsView, TeamManagementView_default as TeamManagementView, ThreadSidebar, TicketHistory_default as TicketHistory, TicketHistoryService, TicketsView_default as TicketsView, TimeDisplay_default as TimeDisplay, TimePickerDropdown, Timer_default as Timer, TimezoneProvider, TimezoneService, UptimeDonutChart, UptimeLineChart, UptimeMetricCards, UserAvatar, UserManagementService, UserManagementTable, UserService, UserUsageDetailModal, UserUsageStats, VideoCard, VideoGridView, VideoPlayer, VideoPreloader, WORKSPACE_POSITIONS, WhatsAppShareButton, WorkspaceCard, WorkspaceCycleTimeMetricCards, WorkspaceDetailView_default as WorkspaceDetailView, WorkspaceDisplayNameExample, WorkspaceGrid, WorkspaceGridItem, WorkspaceHealthCard, WorkspaceHealthView_default as WorkspaceHealthView, WorkspaceHistoryCalendar, WorkspaceMetricCards, WorkspaceMetricCardsImpl, WorkspaceMonthlyDataFetcher, WorkspaceMonthlyHistory, WorkspaceMonthlyPdfGenerator, WorkspacePdfExportButton, WorkspacePdfGenerator, WorkspaceWhatsAppShareButton, actionService, aggregateKPIsFromLineMetricsRows, alertsService, apiUtils, areAllLinesOnSameShift, authCoreService, authOTPService, authRateLimitService, awardsService, buildDateKey, buildKPIsFromLineMetricsRow, buildShiftGroupsKey, canRoleAccessDashboardPath, canRoleAccessTeamManagement, canRoleAssignFactories, canRoleAssignLines, canRoleChangeRole, canRoleInviteRole, canRoleManageCompany, canRoleManageTargets, canRoleManageUsers, canRoleRemoveUser, canRoleViewClipsCost, canRoleViewUsageStats, captureSentryException, captureSentryMessage, checkRateLimit2 as checkRateLimit, clearAllRateLimits2 as clearAllRateLimits, clearRateLimit2 as clearRateLimit, clearS3VideoCache, clearS3VideoFromCache, clearSentryContext, clearWorkspaceDisplayNamesCache, cn, createDefaultKPIs, createInvitationService, createLinesService, createSessionTracker, createStorageService, createStreamProxyHandler, createSupabaseClient, createSupervisorService, createThrottledReload, createUserManagementService, createUserService, dashboardService, deleteThread, fetchIdleTimeReasons, filterDataByDateKeyRange, forceRefreshWorkspaceDisplayNames, formatAwardMonth, formatDateInZone, formatDateKeyForDisplay, formatDateTimeInZone, formatDuration2 as formatDuration, formatISTDate, formatIdleTime, formatRangeLabel, formatReasonLabel, formatRelativeTime, formatTimeInZone, fromUrlFriendlyName, getAllLineDisplayNames, getAllThreadMessages, getAllWorkspaceDisplayNamesAsync, getAllWorkspaceDisplayNamesSnapshot, getAnonClient, getAssignableRoles, getAssignmentColumnLabel, getAvailableShiftIds, getAwardBadgeType, getAwardDescription, getAwardTitle, getBrowserName, getCameraNumber, getCompanyMetricsTableName, getConfigurableShortWorkspaceDisplayName, getConfigurableWorkspaceDisplayName, getConfiguredLineIds, getCoreSessionRecordingProperties, getCoreSessionReplayUrl, getCurrentShift, getCurrentShiftForLine, getCurrentTimeInZone, getCurrentWeekFullRange, getCurrentWeekToDateRange, getDashboardHeaderTimeInZone, getDateKeyFromDate, getDaysDifferenceInZone, getDefaultCameraStreamUrl, getDefaultLineId, getDefaultTabForWorkspace, getInitials, getLineDisplayName, getManufacturingInsights, getMetricsTablePrefix, getMonthKeyBounds, getMonthWeekRanges, getNextUpdateInterval, getOperationalDate, getReasonColor, getRoleAssignmentKind, getRoleDescription, getRoleLabel, getRoleMetadata, getRoleNavPaths, getS3SignedUrl, getS3VideoSrc, getShiftData, getShiftNameById, getShiftWorkDurationSeconds, getShortShiftName, getShortWorkspaceDisplayName, getShortWorkspaceDisplayNameAsync, getStoredWorkspaceMappings, getSubscriptionManager, getThreadMessages, getUniformShiftGroup, getUserThreads, getUserThreadsPaginated, getVisibleRolesForCurrentUser, getWorkspaceDisplayName, getWorkspaceDisplayNameAsync, getWorkspaceDisplayNamesMap, getWorkspaceFromUrl, getWorkspaceNavigationParams, groupLinesByShift, hasAnyShiftData, identifyCoreUser, initializeCoreMixpanel, isEfficiencyOnTrack, isFactoryScopedRole, isFullMonthRange, isLegacyConfiguration, isPrefetchError, isSafari, isSupervisorRole, isTransitionPeriod, isUrlPermanentlyFailed, isValidFactoryViewConfiguration, isValidLineInfoPayload, isValidPrefetchParams, isValidPrefetchStatus, isValidWorkspaceDetailedMetricsPayload, isValidWorkspaceMetricsPayload, isWorkspaceDisplayNamesLoaded, isWorkspaceDisplayNamesLoading, lineLeaderboardService, linesService, mergeWithDefaultConfig, migrateLegacyConfiguration, normalizeDateKeyRange, normalizeRoleLevel, optifyeAgentClient, parseDateKeyToDate, parseS3Uri, preInitializeWorkspaceDisplayNames, preloadS3Video, preloadS3VideoUrl, preloadS3VideosUrl, preloadVideoUrl, preloadVideosUrl, qualityService, realtimeService, refreshWorkspaceDisplayNames, resetCoreMixpanel, resetFailedUrl, resetSubscriptionManager, s3VideoPreloader, setSentryUserContext, setSentryWorkspaceContext, shuffleArray, simulateApiDelay, skuService, startCoreSessionRecording, stopCoreSessionRecording, storeWorkspaceMapping, streamProxyConfig, subscribeWorkspaceDisplayNames, throttledReloadDashboard, toUrlFriendlyName, trackCoreEvent, trackCorePageView, transformToChartData, updateThreadTitle, upsertWorkspaceDisplayNameInCache, useAccessControl, useActiveBreaks, useActiveLineId, useAllWorkspaceMetrics, useAnalyticsConfig, useAppTimezone, useAudioService, useAuth, useAuthConfig, useAxelNotifications, useCanSaveTargets, useClipFilter, useClipTypes, useClipTypesWithCounts, useClipsInit, useCompanyClipsCost, useCompanyUsersUsage, useComponentOverride, useCustomConfig, useDashboardConfig, useDashboardMetrics, useDatabaseConfig, useDateFormatter, useDateTimeConfig, useDynamicShiftConfig, useEndpointsConfig, useEntityConfig, useFactoryOverviewMetrics, useFeatureFlags, useFormatNumber, useHasLineAccess, useHideMobileHeader, useHistoricWorkspaceMetrics, useHlsStream, useHlsStreamWithCropping, useHookOverride, useHourEndTimer, useHourlyTargetAchievements, useHourlyTargetMisses, useIdleTimeClipClassifications, useIdleTimeReasons, useIdleTimeVlmConfig, useKpiTrends, useLeaderboardMetrics, useLineDetailedMetrics, useLineKPIs, useLineMetrics, useLineShiftConfig, useLineSupervisor, useLineWorkspaceMetrics, useLines, useMessages, useMetrics, useMobileMenu, useMonthlyTrend, useMultiLineShiftConfigs, useNavigation, useOperationalShiftKey, useOptionalSupabase, useOverrides, usePageOverride, usePrefetchClipCounts, useRealtimeLineMetrics, useRegistry, useSKUs, useSessionKeepAlive, useSessionTracking, useSessionTrackingContext, useShiftConfig, useShiftGroups, useShifts, useSubscriptionManager, useSubscriptionManagerSafe, useSupabase, useSupabaseClient, useSupervisorsByLineIds, useTargets, useTeamManagementPermissions, useTheme, useThemeConfig, useThreads, useTicketHistory, useTimezoneContext, useUserLineAccess, useUserUsage, useVideoConfig, useWorkspaceConfig, useWorkspaceDetailedMetrics, useWorkspaceDisplayName, useWorkspaceDisplayNames, useWorkspaceDisplayNamesMap, useWorkspaceHealthById, useWorkspaceHealthLastSeen, useWorkspaceHealthStatus, useWorkspaceMetrics, useWorkspaceNavigation, useWorkspaceOperators, useWorkspaceUptimeTimeline, useWorkspaceVideoStreams, userService, videoPrefetchManager, videoPreloader, weeklyTopPerformerService, whatsappService, withAccessControl, withAuth, withRegistry, withTimezone, workspaceHealthService, workspaceService };
+export { ACTION_FAMILIES, ACTION_NAMES, AIAgentView_default as AIAgentView, AcceptInvite, AcceptInviteView_default as AcceptInviteView, AdvancedFilterDialog, AdvancedFilterPanel, AudioService, AuthCallback, AuthCallbackView_default as AuthCallbackView, AuthProvider, AuthService, AuthenticatedBottleneckClipsView, AuthenticatedFactoryView, AuthenticatedHelpView, AuthenticatedHomeView, AuthenticatedShiftsView, AuthenticatedTargetsView, AuthenticatedTicketsView, AuthenticatedWorkspaceHealthView, AvatarUpload, AxelNotificationPopup, AxelOrb, BackButton, BackButtonMinimal, BarChart, BaseHistoryCalendar, BottleneckClipsModal, BottleneckClipsView_default as BottleneckClipsView, BottlenecksContent, BreakNotificationPopup, CachePrefetchStatus, Card2 as Card, CardContent2 as CardContent, CardDescription2 as CardDescription, CardFooter2 as CardFooter, CardHeader2 as CardHeader, CardTitle2 as CardTitle, ChangeRoleDialog, ClipFilterProvider, ClipsCostView_default as ClipsCostView, CompactWorkspaceHealthCard, ConfirmRemoveUserDialog, CongratulationsOverlay, CroppedHlsVideoPlayer, CroppedVideoPlayer, CycleTimeChart, CycleTimeOverTimeChart, DEFAULT_ANALYTICS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CONFIG, DEFAULT_DATABASE_CONFIG, DEFAULT_DATE_TIME_CONFIG, DEFAULT_ENDPOINTS_CONFIG, DEFAULT_ENTITY_CONFIG, DEFAULT_HOME_VIEW_CONFIG, DEFAULT_MAP_VIEW_CONFIG, DEFAULT_SHIFT_CONFIG, DEFAULT_SHIFT_DATA, DEFAULT_THEME_CONFIG, DEFAULT_VIDEO_CONFIG, DEFAULT_WORKSPACE_CONFIG, DEFAULT_WORKSPACE_POSITIONS, DashboardHeader, DashboardLayout, DashboardOverridesProvider, DashboardProvider, DateDisplay_default as DateDisplay, DateTimeDisplay, DebugAuth, DebugAuthView_default as DebugAuthView, DetailedHealthStatus, DiagnosisVideoModal, EFFICIENCY_ON_TRACK_THRESHOLD, EmptyStateMessage, EncouragementOverlay, FactoryAssignmentDropdown, FactoryView_default as FactoryView, FileManagerFilters, FilterDialogTrigger, FirstTimeLoginDebug, FirstTimeLoginHandler, FittingTitle, GaugeChart, GridComponentsPlaceholder, HamburgerButton, Header, HealthDateShiftSelector, HealthStatusGrid, HealthStatusIndicator, HelpView_default as HelpView, HlsVideoPlayer, HomeView_default as HomeView, HourlyOutputChart2 as HourlyOutputChart, HourlyUptimeChart, ISTTimer_default as ISTTimer, IdleTimeVlmConfigProvider, ImprovementCenterView_default as ImprovementCenterView, InlineEditableText, InteractiveOnboardingTour, InvitationService, InvitationsTable, InviteUserDialog, KPICard, KPIDetailView_default as KPIDetailView, KPIGrid, KPIHeader, KPISection, KPIsOverviewView_default as KPIsOverviewView, LINE_1_UUID, LINE_2_UUID, LargeOutputProgressChart, LeaderboardDetailView_default as LeaderboardDetailView, Legend5 as Legend, LineAssignmentDropdown, LineChart, LineHistoryCalendar, LineMonthlyHistory, LineMonthlyPdfGenerator, LinePdfExportButton, LinePdfGenerator, LineWhatsAppShareButton, LinesService, LiveTimer, LoadingInline, LoadingOverlay_default as LoadingOverlay, LoadingPage_default as LoadingPage, LoadingSkeleton, LoadingState, LoginPage, LoginView_default as LoginView, Logo, MainLayout, MapGridView, MetricCard_default as MetricCard, MinimalOnboardingPopup, MobileMenuProvider, NewClipsNotification, NoWorkspaceData, OnboardingDemo, OnboardingTour, OptifyeAgentClient, OptifyeLogoLoader_default as OptifyeLogoLoader, OutputProgressChart, PageHeader, PieChart4 as PieChart, PlantHeadView_default as PlantHeadView, PlayPauseIndicator, PrefetchConfigurationError, PrefetchError, PrefetchEvents, PrefetchStatus, PrefetchTimeoutError, ProfileView_default as ProfileView, RegistryProvider, RoleBadge, S3ClipsSupabaseService as S3ClipsService, S3Service, SKUManagementView, SOPComplianceChart, SSEChatClient, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SessionTracker, SessionTrackingContext, SessionTrackingProvider, SettingsPopup, ShiftDisplay_default as ShiftDisplay, ShiftsView_default as ShiftsView, SideNavBar, SignupWithInvitation, SilentErrorBoundary, SimpleOnboardingPopup, SingleVideoStream_default as SingleVideoStream, Skeleton, SubscriptionManager, SubscriptionManagerProvider, SupabaseProvider, SupervisorDropdown_default as SupervisorDropdown, SupervisorManagementView_default as SupervisorManagementView, SupervisorService, TargetWorkspaceGrid, TargetsView_default as TargetsView, TeamManagementView_default as TeamManagementView, ThreadSidebar, TicketHistory_default as TicketHistory, TicketHistoryService, TicketsView_default as TicketsView, TimeDisplay_default as TimeDisplay, TimePickerDropdown, Timer_default as Timer, TimezoneProvider, TimezoneService, UptimeDonutChart, UptimeLineChart, UptimeMetricCards, UserAvatar, UserManagementService, UserManagementTable, UserService, UserUsageDetailModal, UserUsageStats, VideoCard, VideoGridView, VideoPlayer, VideoPreloader, WORKSPACE_POSITIONS, WhatsAppShareButton, WorkspaceCard, WorkspaceCycleTimeMetricCards, WorkspaceDetailView_default as WorkspaceDetailView, WorkspaceDisplayNameExample, WorkspaceGrid, WorkspaceGridItem, WorkspaceHealthCard, WorkspaceHealthView_default as WorkspaceHealthView, WorkspaceHistoryCalendar, WorkspaceMetricCards, WorkspaceMetricCardsImpl, WorkspaceMonthlyDataFetcher, WorkspaceMonthlyHistory, WorkspaceMonthlyPdfGenerator, WorkspacePdfExportButton, WorkspacePdfGenerator, WorkspaceWhatsAppShareButton, actionService, aggregateKPIsFromLineMetricsRows, alertsService, apiUtils, areAllLinesOnSameShift, authCoreService, authOTPService, authRateLimitService, awardsService, buildDateKey, buildKPIsFromLineMetricsRow, buildShiftGroupsKey, canRoleAccessDashboardPath, canRoleAccessTeamManagement, canRoleAssignFactories, canRoleAssignLines, canRoleChangeRole, canRoleInviteRole, canRoleManageCompany, canRoleManageTargets, canRoleManageUsers, canRoleRemoveUser, canRoleViewClipsCost, canRoleViewUsageStats, captureSentryException, captureSentryMessage, checkRateLimit2 as checkRateLimit, clearAllRateLimits2 as clearAllRateLimits, clearRateLimit2 as clearRateLimit, clearS3VideoCache, clearS3VideoFromCache, clearSentryContext, clearWorkspaceDisplayNamesCache, cn, createDefaultKPIs, createInvitationService, createLinesService, createSessionTracker, createStorageService, createStreamProxyHandler, createSupabaseClient, createSupervisorService, createThrottledReload, createUserManagementService, createUserService, dashboardService, deleteThread, fetchIdleTimeReasons, filterDataByDateKeyRange, forceRefreshWorkspaceDisplayNames, formatAwardMonth, formatDateInZone, formatDateKeyForDisplay, formatDateTimeInZone, formatDuration2 as formatDuration, formatISTDate, formatIdleTime, formatRangeLabel, formatReasonLabel, formatRelativeTime, formatTimeInZone, fromUrlFriendlyName, getActionDisplayName, getAllLineDisplayNames, getAllThreadMessages, getAllWorkspaceDisplayNamesAsync, getAllWorkspaceDisplayNamesSnapshot, getAnonClient, getAssignableRoles, getAssignmentColumnLabel, getAvailableShiftIds, getAwardBadgeType, getAwardDescription, getAwardTitle, getBrowserName, getCameraNumber, getCompanyMetricsTableName, getConfigurableShortWorkspaceDisplayName, getConfigurableWorkspaceDisplayName, getConfiguredLineIds, getCoreSessionRecordingProperties, getCoreSessionReplayUrl, getCurrentShift, getCurrentShiftForLine, getCurrentTimeInZone, getCurrentWeekFullRange, getCurrentWeekToDateRange, getDashboardHeaderTimeInZone, getDateKeyFromDate, getDaysDifferenceInZone, getDefaultCameraStreamUrl, getDefaultLineId, getDefaultTabForWorkspace, getInitials, getLineDisplayName, getManufacturingInsights, getMetricsTablePrefix, getMonthKeyBounds, getMonthWeekRanges, getNextUpdateInterval, getOperationalDate, getRoleAssignmentKind, getRoleDescription, getRoleLabel, getRoleMetadata, getRoleNavPaths, getS3SignedUrl, getS3VideoSrc, getShiftData, getShiftNameById, getShiftWorkDurationSeconds, getShortShiftName, getShortWorkspaceDisplayName, getShortWorkspaceDisplayNameAsync, getStoredWorkspaceMappings, getSubscriptionManager, getThreadMessages, getUniformShiftGroup, getUserThreads, getUserThreadsPaginated, getVisibleRolesForCurrentUser, getWorkspaceDisplayName, getWorkspaceDisplayNameAsync, getWorkspaceDisplayNamesMap, getWorkspaceFromUrl, getWorkspaceNavigationParams, groupLinesByShift, hasAnyShiftData, identifyCoreUser, initializeCoreMixpanel, isEfficiencyOnTrack, isFactoryScopedRole, isFullMonthRange, isLegacyConfiguration, isPrefetchError, isRecentFlowVideoGridMetricMode, isSafari, isSupervisorRole, isTransitionPeriod, isUrlPermanentlyFailed, isValidFactoryViewConfiguration, isValidLineInfoPayload, isValidPrefetchParams, isValidPrefetchStatus, isValidWorkspaceDetailedMetricsPayload, isValidWorkspaceMetricsPayload, isWipGatedVideoGridMetricMode, isWorkspaceDisplayNamesLoaded, isWorkspaceDisplayNamesLoading, lineLeaderboardService, linesService, mergeWithDefaultConfig, migrateLegacyConfiguration, normalizeActionFamily, normalizeDateKeyRange, normalizeRoleLevel, normalizeVideoGridMetricMode, optifyeAgentClient, parseDateKeyToDate, parseS3Uri, preInitializeWorkspaceDisplayNames, preloadS3Video, preloadS3VideoUrl, preloadS3VideosUrl, preloadVideoUrl, preloadVideosUrl, qualityService, realtimeService, refreshWorkspaceDisplayNames, resetCoreMixpanel, resetFailedUrl, resetSubscriptionManager, s3VideoPreloader, setSentryUserContext, setSentryWorkspaceContext, shuffleArray, simulateApiDelay, skuService, startCoreSessionRecording, stopCoreSessionRecording, storeWorkspaceMapping, streamProxyConfig, subscribeWorkspaceDisplayNames, throttledReloadDashboard, toUrlFriendlyName, trackCoreEvent, trackCorePageView, transformToChartData, updateThreadTitle, upsertWorkspaceDisplayNameInCache, useAccessControl, useActiveBreaks, useActiveLineId, useAllWorkspaceMetrics, useAnalyticsConfig, useAppTimezone, useAudioService, useAuth, useAuthConfig, useAxelNotifications, useCanSaveTargets, useClipFilter, useClipTypes, useClipTypesWithCounts, useClipsInit, useCompanyClipsCost, useCompanyUsersUsage, useComponentOverride, useCustomConfig, useDashboardConfig, useDashboardMetrics, useDatabaseConfig, useDateFormatter, useDateTimeConfig, useDynamicShiftConfig, useEndpointsConfig, useEntityConfig, useFactoryOverviewMetrics, useFeatureFlags, useFormatNumber, useHasLineAccess, useHideMobileHeader, useHistoricWorkspaceMetrics, useHlsStream, useHlsStreamWithCropping, useHookOverride, useHourEndTimer, useHourlyTargetAchievements, useHourlyTargetMisses, useIdleTimeClipClassifications, useIdleTimeReasons, useIdleTimeVlmConfig, useKpiTrends, useLeaderboardMetrics, useLineDetailedMetrics, useLineKPIs, useLineMetrics, useLineShiftConfig, useLineSupervisor, useLineWorkspaceMetrics, useLines, useMessages, useMetrics, useMobileMenu, useMonthlyTrend, useMultiLineShiftConfigs, useNavigation, useOperationalShiftKey, useOptionalSupabase, useOverrides, usePageOverride, usePrefetchClipCounts, useRealtimeLineMetrics, useRegistry, useSKUs, useSessionKeepAlive, useSessionTracking, useSessionTrackingContext, useShiftConfig, useShiftGroups, useShifts, useSubscriptionManager, useSubscriptionManagerSafe, useSupabase, useSupabaseClient, useSupervisorsByLineIds, useTargets, useTeamManagementPermissions, useTheme, useThemeConfig, useThreads, useTicketHistory, useTimezoneContext, useUserLineAccess, useUserUsage, useVideoConfig, useWorkspaceConfig, useWorkspaceDetailedMetrics, useWorkspaceDisplayName, useWorkspaceDisplayNames, useWorkspaceDisplayNamesMap, useWorkspaceHealthById, useWorkspaceHealthLastSeen, useWorkspaceHealthStatus, useWorkspaceMetrics, useWorkspaceNavigation, useWorkspaceOperators, useWorkspaceUptimeTimeline, useWorkspaceVideoStreams, userService, videoPrefetchManager, videoPreloader, weeklyTopPerformerService, whatsappService, withAccessControl, withAuth, withRegistry, withTimezone, workspaceHealthService, workspaceService };