@titan-design/react-ui 0.10.0 → 0.11.0

package/dist/index.mjs

@@ -2,7 +2,7 @@ import { jsx as jsx$1, jsxs as jsxs$1, Fragment } from 'react/jsx-runtime';
 import { Pressable, ActivityIndicator, Text, View, TextInput, Platform, StyleSheet, Easing, Image, Modal as Modal$1, ScrollView, Animated } from 'react-native';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import React25, { forwardRef, useState, createContext, useContext, useMemo, useRef, useEffect, useCallback, useSyncExternalStore, Fragment as Fragment$1 } from 'react';
+import React25, { forwardRef, useState, createContext, useContext, useMemo, useRef, useEffect, useCallback, useId, useSyncExternalStore, Fragment as Fragment$1 } from 'react';
 
 var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
   get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
@@ -5373,7 +5373,7 @@ function ToastProvider({
     return id;
   }, [defaultDuration, maxToasts]);
   const removeToast = useCallback((id) => {
-    setToasts((prev) => prev.filter((t17) => t17.id !== id));
+    setToasts((prev) => prev.filter((t26) => t26.id !== id));
   }, []);
   const removeAllToasts = useCallback(() => {
     setToasts([]);
@@ -8661,257 +8661,412 @@ function WorkoutPill({
   }
   return pill;
 }
-var PULSE_HALF_MS = 950;
-var PULSE_MIN_OPACITY = 0.45;
-var SEGMENTED_BAR_GAP = 5;
-function usePulse2(active) {
-  const [value] = useState(() => new Animated.Value(0));
+
+// src/theme/bar-paper.ts
+function grainOpacityForColor(hex) {
+  const h = hex.replace("#", "");
+  const full = h.length === 3 ? h.split("").map((ch) => ch + ch).join("") : h;
+  const r = parseInt(full.slice(0, 2), 16);
+  const g = parseInt(full.slice(2, 4), 16);
+  const b = parseInt(full.slice(4, 6), 16);
+  if ([r, g, b].some(Number.isNaN)) return 0.14;
+  const lum = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+  return Math.min(0.24, Math.max(0.04, 0.02 + 0.31 * lum));
+}
+function barGrain(color) {
+  const op = grainOpacityForColor(color).toFixed(3);
+  return `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='${op}'/%3E%3C/svg%3E")`;
+}
+function barPaper(color, flip = false) {
+  return {
+    backgroundImage: barGrain(color),
+    boxShadow: flip ? "0 -6px 16px rgba(0,0,0,0.45)" : "inset 0 1.5px 0 rgba(255,255,255,0.22), 0 6px 16px rgba(0,0,0,0.45)"
+  };
+}
+var ANIMATION_EASING = Easing.bezier(0.22, 1, 0.36, 1);
+var PEAK_OVERSHOOT = 1.12;
+function getReducedMotionPreference() {
+  if (typeof window === "undefined" || typeof window.matchMedia !== "function") return false;
+  return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function usePrefersReducedMotion() {
+  const [reduced, setReduced] = useState(getReducedMotionPreference);
   useEffect(() => {
-    if (!active) return;
-    const loop = Animated.loop(
+    if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
+    const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
+    const handler = () => setReduced(mq.matches);
+    handler();
+    mq.addEventListener?.("change", handler);
+    return () => mq.removeEventListener?.("change", handler);
+  }, []);
+  return reduced;
+}
+function useLiveRepGrowth(active, liveRepIndex, liveVelocity, isNewPeak) {
+  const prefersReducedMotion = usePrefersReducedMotion();
+  const [liveGrowth] = useState(() => new Animated.Value(1));
+  useEffect(() => {
+    if (liveRepIndex == null || liveVelocity == null) return;
+    if (prefersReducedMotion) {
+      liveGrowth.setValue(1);
+      return;
+    }
+    liveGrowth.setValue(0);
+    if (isNewPeak) {
       Animated.sequence([
-        Animated.timing(value, {
-          toValue: 1,
-          duration: PULSE_HALF_MS,
-          easing: Easing.inOut(Easing.ease),
+        Animated.timing(liveGrowth, {
+          toValue: PEAK_OVERSHOOT,
+          duration: 220,
+          easing: Easing.out(Easing.quad),
           useNativeDriver: false
         }),
-        Animated.timing(value, {
-          toValue: 0,
-          duration: PULSE_HALF_MS,
-          easing: Easing.inOut(Easing.ease),
+        Animated.spring(liveGrowth, {
+          toValue: 1,
+          friction: 5,
+          tension: 140,
           useNativeDriver: false
         })
-      ])
-    );
-    loop.start();
-    return () => loop.stop();
-  }, [active, value]);
-  return value;
+      ]).start();
+    } else {
+      Animated.timing(liveGrowth, {
+        toValue: 1,
+        duration: 300,
+        easing: ANIMATION_EASING,
+        useNativeDriver: false
+      }).start();
+    }
+  }, [active, liveRepIndex, liveVelocity, isNewPeak, prefersReducedMotion, liveGrowth]);
+  return liveGrowth;
 }
-function SegmentedBar({
-  segments,
-  height = 8,
-  gap = SEGMENTED_BAR_GAP,
-  radius = 2,
-  marker = null,
-  segmentTestID,
-  style,
-  ...props
-}) {
-  const pulse = usePulse2(segments.some((s) => s.pulse));
-  return /* @__PURE__ */ jsxs(View, { style: [{ flexDirection: "row", height, gap, position: "relative" }, style], ...props, children: [
-    segments.map((seg, i) => {
-      const fillStyle = {
-        width: `${(seg.fill ?? 1) * 100}%`,
-        height: "100%",
-        backgroundColor: seg.color,
-        opacity: seg.opacity
-      };
-      const testID = segmentTestID?.(seg, i) ?? "segmented-bar-segment";
-      return /* @__PURE__ */ jsx(
+
+// src/components/custom/charts/SetBarChart.tsx
+function mixHex(a, b, t26) {
+  const parse = (h) => {
+    const s = h.replace("#", "");
+    return [parseInt(s.slice(0, 2), 16), parseInt(s.slice(2, 4), 16), parseInt(s.slice(4, 6), 16)];
+  };
+  const [ar, ag, ab] = parse(a);
+  const [br, bg, bb] = parse(b);
+  const ch = (x, y) => Math.round(x + (y - x) * t26).toString(16).padStart(2, "0");
+  return `#${ch(ar, br)}${ch(ag, bg)}${ch(ab, bb)}`;
+}
+var VARIABLE_FILL = primitiveRamps.cyan[900];
+var CONTINUE_OUTLINE = primitiveRamps.cyan[800];
+var FIXED_MAX_VALUE = 1.15;
+var PEAK_HEADROOM = 1.03;
+function scaleDenominator(scale, maxValue) {
+  return scale === "fixed" ? FIXED_MAX_VALUE : maxValue * PEAK_HEADROOM;
+}
+function valueLabelFontSize(height) {
+  return Math.round(Math.max(8, Math.min(12, height * 0.11)));
+}
+var SET_BAR_DEFAULT_HEIGHT = 220;
+var LABEL_ROW_HEIGHT = 16;
+var LABEL_GAP = 3;
+var GAP_RATIO = 0.08;
+var MIN_BAR_GAP = 2;
+var CHUNK_NOTCH_RATIO = 0.25;
+var CHUNK_NOTCH_MIN_PX = 10;
+var BAR_MAX_WIDTH = 120;
+var LABEL_MIN_BAR_WIDTH = 30;
+var DEFAULT_BAR_RADIUS = 5;
+var MIN_BAR_HEIGHT = 4;
+var FLAT_BAR_FRACTION = 0.5;
+var STUB_HEIGHT = 9;
+var REP_GAP = 2;
+function computeBarLayout(plotWidth, count, gapRatio = GAP_RATIO) {
+  const rawBarWidth = plotWidth > 0 && count > 0 ? plotWidth / (count + (count - 1) * gapRatio) : BAR_MAX_WIDTH;
+  const barWidth = Math.min(BAR_MAX_WIDTH, rawBarWidth);
+  const gap = plotWidth === 0 ? MIN_BAR_GAP : Math.max(MIN_BAR_GAP, gapRatio * barWidth);
+  return { barWidth, gap };
+}
+function isRep(slot) {
+  return slot.kind === "rep";
+}
+function repIndexByCell(cells) {
+  let count = 0;
+  return cells.map((slot) => isRep(slot) ? count++ : -1);
+}
+function SetBarChart({
+  slots,
+  colorFor,
+  height,
+  scale = "peak",
+  scaleMax,
+  orientation = "up",
+  liveRepIndex,
+  isNewPeak = false,
+  targetReps,
+  gapRatio = GAP_RATIO,
+  barRadius = DEFAULT_BAR_RADIUS,
+  cornerStyle = "top",
+  flat = false,
+  showValueLabels: showValueLabelsProp = false,
+  formatValue: formatValue3 = String,
+  todoVariant = "solid",
+  minColumns,
+  renderReference,
+  renderBarOverlay,
+  expandProgress,
+  hideBaseline = false,
+  testID,
+  testIDPrefix = "setbar",
+  accessibilityLabel: accessibilityLabel2,
+  label,
+  className,
+  viewProps = {}
+}) {
+  const targetPadded = Math.max(slots.length, targetReps ?? 0, minColumns ?? 0);
+  const cells = targetPadded > slots.length ? [
+    ...slots,
+    ...Array.from({ length: targetPadded - slots.length }, () => ({ kind: "todo" }))
+  ] : slots;
+  const repValues = cells.filter(isRep).map((s) => s.value ?? 0);
+  const best = repValues.length > 0 ? Math.max(...repValues) : 0;
+  const flip = orientation === "down";
+  const flipStyle = flip ? { transform: [{ scaleY: -1 }] } : null;
+  const placeholderColor = useOnSurfaceColor("tertiary");
+  const surface = useSurface();
+  const surfaceBg = surfaceBackground(surface.level, surface.mode);
+  const solidTodoColor = mixHex(surfaceBg, placeholderColor, 0.55);
+  const emptyColor = mixHex(surfaceBg, placeholderColor, 0.28);
+  const barCorners = cornerStyle === "all" ? { borderRadius: barRadius } : { borderTopLeftRadius: barRadius, borderTopRightRadius: barRadius };
+  const scaleDenom = scaleMax != null && scaleMax > 0 ? scaleMax * PEAK_HEADROOM : scaleDenominator(scale, best);
+  const showValueLabels = showValueLabelsProp && !flat;
+  const plotHeight = Math.max(0, height - (showValueLabels ? LABEL_ROW_HEIGHT + LABEL_GAP : 0));
+  const yOf = (value) => scaleDenom > 0 ? value / scaleDenom * plotHeight : 0;
+  const flatBarHeight = Math.max(MIN_BAR_HEIGHT, FLAT_BAR_FRACTION * plotHeight);
+  const compactBarHeight = Math.max(MIN_BAR_HEIGHT, plotHeight);
+  const valueBarHeight = (value) => scaleDenom > 0 ? Math.max(MIN_BAR_HEIGHT, Math.min(1, value / scaleDenom) * plotHeight) : MIN_BAR_HEIGHT;
+  const barHeight = (value) => flat ? compactBarHeight : valueBarHeight(value);
+  const liveValue = liveRepIndex != null && liveRepIndex < repValues.length ? repValues[liveRepIndex] : void 0;
+  const liveGrowth = useLiveRepGrowth(true, liveRepIndex, liveValue, isNewPeak);
+  const [plotW, setPlotW] = useState(0);
+  const onPlotLayout = (e) => setPlotW(e.nativeEvent.layout.width);
+  const totalCells = cells.length;
+  const { barWidth, gap } = computeBarLayout(plotW, totalCells, gapRatio);
+  const labelsCrowded = plotW > 0 && barWidth < LABEL_MIN_BAR_WIDTH;
+  const peakRepIndex = repValues.reduce((b, v, i) => v > repValues[b] ? i : b, 0);
+  const showBarLabel = (repIndex) => !labelsCrowded || repIndex === peakRepIndex || repIndex === liveRepIndex;
+  const geometry = { scaleDenom, plotHeight, yOf, best, flip };
+  const { style: externalStyle, ...restProps } = viewProps;
+  const a11y = accessibilityLabel2 != null ? { accessibilityRole: "image", accessibilityLabel: accessibilityLabel2 } : {};
+  const repIndices = repIndexByCell(cells);
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ height, flexDirection: "row" }, externalStyle],
+      testID,
+      ...a11y,
+      ...restProps,
+      children: [
+        label ? /* @__PURE__ */ jsx(
+          ChartSideRail,
+          {
+            sections: [{ label, testID: `${testIDPrefix}-side-label` }],
+            sectionExtent: height
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs(
+          View,
+          {
+            onLayout: onPlotLayout,
+            style: {
+              flex: 1,
+              flexDirection: "row",
+              alignItems: "flex-end",
+              gap,
+              position: "relative",
+              borderBottomWidth: hideBaseline ? 0 : 2,
+              borderBottomColor: placeholderColor,
+              ...flipStyle
+            },
+            children: [
+              renderReference?.(geometry),
+              cells.map((slot, i) => {
+                const isChunkBoundary = (slot.leadingGap ?? REP_GAP) > REP_GAP;
+                const extraGap = isChunkBoundary ? Math.max(CHUNK_NOTCH_MIN_PX, CHUNK_NOTCH_RATIO * barWidth) : 0;
+                const column = {
+                  flex: 1,
+                  maxWidth: BAR_MAX_WIDTH,
+                  height: "100%",
+                  alignItems: "center",
+                  justifyContent: "flex-end",
+                  marginLeft: extraGap
+                };
+                if (!isRep(slot)) {
+                  return /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, style: column, children: renderStub(
+                    slot.kind,
+                    barCorners,
+                    // Flat (compact) stubs fill the plot like the compact bars; else the fixed short stub.
+                    flat ? compactBarHeight : STUB_HEIGHT,
+                    placeholderColor,
+                    testIDPrefix,
+                    todoVariant,
+                    solidTodoColor,
+                    emptyColor
+                  ) }, i);
+                }
+                const repIndex = repIndices[i];
+                const value = slot.value ?? 0;
+                const isLive = liveRepIndex === repIndex;
+                const color = colorFor(value);
+                const barHeightStyle = expandProgress ? expandProgress.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [flatBarHeight, valueBarHeight(value)]
+                }) : isLive ? liveGrowth.interpolate({ inputRange: [0, 1], outputRange: [0, barHeight(value)] }) : barHeight(value);
+                const ownLabel = showValueLabels && !renderBarOverlay && showBarLabel(repIndex);
+                const labelBottom = (expandProgress ? valueBarHeight(best) : barHeight(best)) + LABEL_GAP;
+                return /* @__PURE__ */ jsxs(View, { accessibilityElementsHidden: renderBarOverlay == null, style: column, children: [
+                  ownLabel && // All labels pin to one aligned row JUST ABOVE THE PEAK BAR (not the container top),
+                  // in the muted on-surface-secondary tone — so the row hugs the bars, no floating void.
+                  /* @__PURE__ */ jsx(
+                    Animated.View,
+                    {
+                      style: {
+                        position: "absolute",
+                        bottom: labelBottom,
+                        left: 0,
+                        right: 0,
+                        alignItems: "center",
+                        ...expandProgress ? { opacity: expandProgress } : null
+                      },
+                      pointerEvents: "none",
+                      children: /* @__PURE__ */ jsx(
+                        Text,
+                        {
+                          className: "text-text-secondary",
+                          style: [{ fontSize: valueLabelFontSize(height), fontWeight: "700" }, flipStyle],
+                          testID: `${testIDPrefix}-label-${repIndex}`,
+                          children: formatValue3(value)
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    Animated.View,
+                    {
+                      style: [
+                        { width: "100%", height: barHeightStyle, backgroundColor: color },
+                        barCorners,
+                        barPaper(color, flip)
+                      ],
+                      testID: `${testIDPrefix}-bar-${repIndex}`
+                    }
+                  ),
+                  renderBarOverlay?.(repIndex, value)
+                ] }, i);
+              })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function renderStub(kind, barCorners, stubHeight, placeholderColor, testIDPrefix, todoVariant, solidTodoColor, emptyColor) {
+  const base = {
+    width: "100%",
+    height: stubHeight,
+    ...barCorners
+  };
+  if (kind === "variable") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: { ...base, backgroundColor: VARIABLE_FILL },
+        testID: `${testIDPrefix}-slot-variable`
+      }
+    );
+  }
+  if (kind === "continue") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: { ...base, borderWidth: 1, borderColor: CONTINUE_OUTLINE },
+        testID: `${testIDPrefix}-slot-continue`
+      }
+    );
+  }
+  if (kind === "empty") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: { ...base, backgroundColor: emptyColor },
+        testID: `${testIDPrefix}-slot-empty`
+      }
+    );
+  }
+  const todoStyle = todoVariant === "solid" ? { ...base, backgroundColor: solidTodoColor } : { ...base, borderWidth: 1, borderStyle: "dashed", borderColor: placeholderColor };
+  return /* @__PURE__ */ jsx(View, { style: todoStyle, testID: `${testIDPrefix}-slot-todo` });
+}
+function sideLabelFontSize(height) {
+  return Math.round(Math.max(7, Math.min(13, height * 0.06)));
+}
+var SIDE_LABEL_INITIALS_BELOW = 70;
+function sideLabelText(label, extent) {
+  if (extent >= SIDE_LABEL_INITIALS_BELOW) return label;
+  return label.trim().split(/\s+/).map((word) => word.charAt(0)).join(" ").toUpperCase();
+}
+function ChartSideRail({
+  sections,
+  sectionExtent,
+  variant = "hero"
+}) {
+  if (!sections.some((s) => s.label)) return null;
+  const isRail = variant === "rail";
+  const labelLength = Math.max(0, sectionExtent - (isRail ? 0 : 6));
+  const fontSize = isRail ? 7 : sideLabelFontSize(sectionExtent);
+  const textStyle = {
+    maxWidth: "100%",
+    textAlign: "center",
+    fontSize,
+    fontWeight: "700",
+    letterSpacing: isRail || fontSize < 10 ? 0 : 2,
+    textTransform: "uppercase"
+  };
+  return /* @__PURE__ */ jsx(View, { style: { width: isRail ? 18 : 34 }, accessibilityElementsHidden: true, children: sections.map((s) => /* @__PURE__ */ jsx(
+    View,
+    {
+      style: { height: sectionExtent, alignItems: "center", justifyContent: "center" },
+      children: s.label ? /* @__PURE__ */ jsx(
         View,
         {
           style: {
-            flex: seg.weight ?? 1,
-            minWidth: 0,
-            height: "100%",
-            marginLeft: seg.leadingGap,
-            borderRadius: radius,
-            overflow: "hidden"
+            width: labelLength,
+            alignItems: "center",
+            transform: [{ rotate: "-90deg" }]
           },
-          children: seg.pulse ? /* @__PURE__ */ jsx(
-            Animated.View,
+          children: /* @__PURE__ */ jsx(
+            Text,
             {
-              style: {
-                ...fillStyle,
-                ...seg.pulseColor ? {
-                  backgroundColor: pulse.interpolate({
-                    inputRange: [0, 1],
-                    outputRange: seg.pulseColor
-                  })
-                } : {
-                  opacity: pulse.interpolate({
-                    inputRange: [0, 1],
-                    outputRange: [PULSE_MIN_OPACITY, 1]
-                  })
-                }
-              },
-              accessibilityElementsHidden: true,
-              testID
+              className: "text-text-tertiary",
+              style: textStyle,
+              numberOfLines: 1,
+              testID: s.testID,
+              children: isRail ? s.label : sideLabelText(s.label, sectionExtent)
             }
-          ) : /* @__PURE__ */ jsx(View, { style: fillStyle, accessibilityElementsHidden: true, testID })
-        },
-        i
-      );
-    }),
-    marker ? /* @__PURE__ */ jsx(
-      View,
-      {
-        style: {
-          position: "absolute",
-          left: `${marker.position * 100}%`,
-          top: 0,
-          bottom: 0,
-          width: 2,
-          backgroundColor: marker.color
-        },
-        accessibilityElementsHidden: true,
-        testID: "segmented-bar-marker"
-      }
-    ) : null
-  ] });
+          )
+        }
+      ) : null
+    },
+    s.testID
+  )) });
 }
 
-// src/components/custom/Workout/SetBar.tsx
-var SET_STRIP_ZONES = {
-  slow: primitiveRamps.red[600],
-  moderate: primitiveRamps.orange[400],
-  fast: primitiveRamps.amber[300],
-  fastest: primitiveRamps.green[300]
-};
-var TODO_COLOR = primitiveColors.charcoal[300];
-var SET_STRIP_VARIABLE_COLOR = primitiveRamps.cyan[900];
-var NOTCH_GAP = 2;
-var CLUSTER_GAP = 3;
-var MYO_UPCOMING_CLUSTERS = 3;
-var MYO_UPCOMING_CLUSTER_LEN = 5;
-var MYO_UPCOMING_FADE = 0.6;
-var PULSE_RANGE = {
-  [SET_STRIP_ZONES.slow]: [primitiveRamps.red[500], primitiveRamps.red[700]],
-  [SET_STRIP_ZONES.moderate]: [primitiveRamps.orange[300], primitiveRamps.orange[500]],
-  [SET_STRIP_ZONES.fast]: [primitiveRamps.amber[200], primitiveRamps.amber[400]],
-  [SET_STRIP_ZONES.fastest]: [primitiveRamps.green[200], primitiveRamps.green[400]]
-};
-function velocityZoneColor(v) {
-  if (v < 0.5) return SET_STRIP_ZONES.slow;
-  if (v < 0.75) return SET_STRIP_ZONES.moderate;
-  if (v < 1) return SET_STRIP_ZONES.fast;
-  return SET_STRIP_ZONES.fastest;
-}
-function chunkedSegments(chunks, gap) {
-  return chunks.flatMap(
-    (vels, ci) => vels.map((v, ri) => ({
-      color: velocityZoneColor(v),
-      ...ci > 0 && ri === 0 ? { leadingGap: gap } : {}
-    }))
-  );
-}
-function rangeSegments(floor, max, doneVels) {
-  return Array.from({ length: max }, (_, i) => {
-    if (i < doneVels.length) return { color: velocityZoneColor(doneVels[i]) };
-    return { color: i < floor ? TODO_COLOR : SET_STRIP_VARIABLE_COLOR };
-  });
-}
-function myoUpcomingSegments(activationLen, clusterCount) {
-  const activation = Array.from({ length: activationLen }, () => ({ color: TODO_COLOR }));
-  const trail = Array.from(
-    { length: clusterCount },
-    (_, ci) => Array.from({ length: MYO_UPCOMING_CLUSTER_LEN }, (_2, ri) => ({
-      color: SET_STRIP_VARIABLE_COLOR,
-      opacity: MYO_UPCOMING_FADE ** ci,
-      ...ri === 0 ? { leadingGap: CLUSTER_GAP } : {}
-    }))
-  ).flat();
-  return [...activation, ...trail];
-}
-function setSegments(set) {
-  if (set.status === "todo") {
-    return [{ color: TODO_COLOR }];
-  }
-  if (set.status === "done") {
-    return set.velocities.map((v) => ({ color: velocityZoneColor(v) }));
-  }
-  if (set.status === "range") {
-    return rangeSegments(set.floor, set.max, set.doneVels);
-  }
-  if (set.status === "drop") {
-    return chunkedSegments(set.subloads, NOTCH_GAP);
-  }
-  if (set.status === "myo") {
-    return chunkedSegments([set.activation, ...set.clusters], CLUSTER_GAP);
-  }
-  if (set.status === "myo-upcoming") {
-    return myoUpcomingSegments(set.activationLen, set.clusterCount ?? MYO_UPCOMING_CLUSTERS);
-  }
-  const performed = set.velocities.map((v) => {
-    const color = velocityZoneColor(v);
-    return { color, pulse: true, pulseColor: PULSE_RANGE[color] };
-  });
-  const remaining = Math.max(0, set.planned - set.velocities.length);
-  return [...performed, ...Array.from({ length: remaining }, () => ({ color: TODO_COLOR }))];
-}
-function setBarSegmentTestID(seg) {
-  if (seg.pulse) return "set-strip-pulse";
-  if (seg.color === SET_STRIP_VARIABLE_COLOR) return "set-strip-variable";
-  return seg.color === TODO_COLOR ? "set-strip-empty" : "set-strip-fill";
-}
-function SetBar({ set, height = 8 }) {
-  return /* @__PURE__ */ jsx(
-    SegmentedBar,
-    {
-      segments: setSegments(set),
-      height,
-      gap: 0,
-      radius: 0,
-      segmentTestID: setBarSegmentTestID,
-      style: { flex: 1, minWidth: 0, borderRadius: 2, overflow: "hidden" },
-      testID: "set-strip-set"
-    }
-  );
-}
-
-// src/components/custom/Workout/SetStrip.tsx
-var SET_STRIP_GAP = 5;
-function setCategory(set) {
-  switch (set.status) {
-    case "done":
-    case "drop":
-    case "myo":
-      return "done";
-    case "active":
-      return "active";
-    case "range":
-      return set.doneVels.length > 0 ? "active" : "upcoming";
-    case "todo":
-    case "myo-upcoming":
-      return "upcoming";
-  }
-}
-function describeSets(sets) {
-  const done = sets.filter((s) => setCategory(s) === "done").length;
-  const active = sets.filter((s) => setCategory(s) === "active").length;
-  const upcoming = sets.filter((s) => setCategory(s) === "upcoming").length;
-  return `Set progress: ${done} done, ${active} in progress, ${upcoming} upcoming`;
-}
-function SetStrip({ sets, height = 8, className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    View,
-    {
-      className,
-      style: { flexDirection: "row", width: "100%", height, gap: SET_STRIP_GAP },
-      accessibilityRole: "image",
-      accessibilityLabel: describeSets(sets),
-      testID: "set-strip",
-      ...props,
-      children: sets.map((set, i) => /* @__PURE__ */ jsx(SetBar, { set, height }, i))
-    }
-  );
-}
-
-// src/components/custom/Workout/VelocityStrip.tsx
-var VEL_COLORS = WORKOUT_TOKENS.scale;
-var bandIdToEffortColor = {
-  speed: sequentialEffort[0],
-  // green-300
-  power: sequentialEffort[2],
-  // amber-300 (gold)
-  strengthSpeed: sequentialEffort[3],
-  // orange-400
-  maximalStrength: sequentialEffort[4],
-  // red-600
-  grinding: sequentialEffort[5]
-  // red-700 — the distinct 5th band
+// src/components/custom/Workout/VelocityStrip.tsx
+var VEL_COLORS = WORKOUT_TOKENS.scale;
+var bandIdToEffortColor = {
+  speed: sequentialEffort[0],
+  // green-300
+  power: sequentialEffort[2],
+  // amber-300 (gold)
+  strengthSpeed: sequentialEffort[3],
+  // orange-400
+  maximalStrength: sequentialEffort[4],
+  // red-600
+  grinding: sequentialEffort[5]
+  // red-700 — the distinct 5th band
 };
 function getVelocityZoneColor(velocity) {
   if (velocity >= 1) return "vel-green";
@@ -8943,6 +9098,18 @@ function calculateMeanVelocity(velocities) {
   const sum = velocities.reduce((acc, v) => acc + v, 0);
   return sum / velocities.length;
 }
+var VL_LOSS_THRESHOLDS = [10, 20, 30];
+function getVelocityLossColor(lossPct) {
+  const [t1, t26, t32] = VL_LOSS_THRESHOLDS;
+  if (lossPct < t1) return VEL_COLORS.green;
+  if (lossPct < t26) return VEL_COLORS.yellow;
+  if (lossPct < t32) return VEL_COLORS.orange;
+  return VEL_COLORS.red;
+}
+function velocityLossForRep(velocity, best) {
+  if (best <= 0) return 0;
+  return Math.max(0, Math.round((best - velocity) / best * 100));
+}
 function classifyBand(velocity, bands) {
   for (const band of bands) {
     if (band.max === null || velocity < band.max) return band;
@@ -8952,15 +9119,17 @@ function classifyBand(velocity, bands) {
 function bandColor(band) {
   return bandIdToEffortColor[band.id] ?? VEL_COLORS.green;
 }
+function makeBarColorFor(zones) {
+  const hasZones = zones != null && zones.length > 0;
+  return (v) => hasZones ? bandColor(classifyBand(v, zones)) : zoneHexMap[getVelocityZoneColor(v)];
+}
 function getLossStyle(loss) {
   if (loss > 25) return { color: VEL_COLORS.red };
   if (loss > 20) return { color: VEL_COLORS.orange };
   return null;
 }
-var REP_GAP = 2;
+var REP_GAP2 = 2;
 var WIDE_GAP = 8;
-var TODO_COLOR2 = primitiveColors.charcoal[300];
-var CONTINUE_OUTLINE = primitiveRamps.cyan[800];
 function deriveDoneVelocities(set) {
   switch (set.type) {
     case "drop":
@@ -8976,7 +9145,7 @@ function chunkedRepSlots(chunks) {
   chunks.forEach((chunk) => {
     chunk.forEach((velocity, ri) => {
       const first = slots.length === 0;
-      slots.push({ kind: "rep", velocity, leadingGap: first ? 0 : ri === 0 ? WIDE_GAP : REP_GAP });
+      slots.push({ kind: "rep", velocity, leadingGap: first ? 0 : ri === 0 ? WIDE_GAP : REP_GAP2 });
     });
   });
   return slots;
@@ -8990,7 +9159,7 @@ function buildSlots(set) {
         return {
           kind: done ? "rep" : "todo",
           velocity: done ? set.velocities[i] : void 0,
-          leadingGap: i === 0 ? 0 : REP_GAP
+          leadingGap: i === 0 ? 0 : REP_GAP2
         };
       });
     }
@@ -9001,7 +9170,7 @@ function buildSlots(set) {
         return {
           kind,
           velocity: kind === "rep" ? set.velocities[i] : void 0,
-          leadingGap: i === 0 ? 0 : REP_GAP
+          leadingGap: i === 0 ? 0 : REP_GAP2
         };
       });
     }
@@ -9009,16 +9178,16 @@ function buildSlots(set) {
       const reps = set.velocities.map((velocity, i) => ({
         kind: "rep",
         velocity,
-        leadingGap: i === 0 ? 0 : REP_GAP
+        leadingGap: i === 0 ? 0 : REP_GAP2
       }));
-      reps.push({ kind: "continue", leadingGap: reps.length === 0 ? 0 : REP_GAP });
+      reps.push({ kind: "continue", leadingGap: reps.length === 0 ? 0 : REP_GAP2 });
       return reps;
     }
     case "drop":
       return chunkedRepSlots(set.subloads);
     case "myo": {
       const slots = chunkedRepSlots([set.activation, ...set.clusters]);
-      if (set.open) slots.push({ kind: "continue", leadingGap: slots.length === 0 ? 0 : REP_GAP });
+      if (set.open) slots.push({ kind: "continue", leadingGap: slots.length === 0 ? 0 : REP_GAP2 });
       return slots;
     }
     case "cluster": {
@@ -9029,7 +9198,7 @@ function buildSlots(set) {
         return {
           kind: done ? "rep" : "todo",
           velocity: done ? set.velocities[i] : void 0,
-          leadingGap: i === 0 ? 0 : boundary ? WIDE_GAP : REP_GAP
+          leadingGap: i === 0 ? 0 : boundary ? WIDE_GAP : REP_GAP2
         };
       });
     }
@@ -9051,253 +9220,406 @@ function setAccessibilityLabel(set, repCount) {
       return `Velocity strip, cluster set, groups of ${set.groupSize}, ${repCount} reps`;
   }
 }
-function slotAccessibilityLabel(slot, index) {
-  switch (slot.kind) {
-    case "rep":
-      return `Rep ${index + 1}: ${formatVelocity(slot.velocity ?? 0)} meters per second`;
-    case "todo":
-      return `Rep ${index + 1}: planned`;
-    case "variable":
-      return `Rep ${index + 1}: variable`;
-    case "continue":
-      return "Keep going";
-  }
-}
-var EXPANDED_TODO_STUB_PCT = 16;
-var EXPANDED_ENCODED_PCT = 45;
 var EXPANDED_HEIGHT = 60;
-var FIXED_MAX_VELOCITY = 1.15;
-var BARE_STUB_HEIGHT = 3;
-var HERO_HEIGHT = 220;
-var HERO_LABEL_HEADROOM = 20;
-var HERO_BAR_GAP = 8;
-var HERO_BAR_MAX_WIDTH = 120;
-var HERO_LABEL_MIN_BAR_WIDTH = 30;
-var HERO_BAR_RADIUS = 5;
-var HERO_MIN_BAR_HEIGHT = 4;
-var HERO_PENDING_COLOR = primitiveColors.charcoal[100];
+var COMPACT_HEIGHT = 8;
 var HERO_REFERENCE_COLOR = primitiveColors.charcoal[0];
-var PEAK_HEADROOM = 1.06;
-function scaleDenominator(scale, maxVelocity) {
-  return scale === "fixed" ? FIXED_MAX_VELOCITY : maxVelocity * PEAK_HEADROOM;
-}
-function bareSlotHeight(slot, height, denom) {
-  if (slot.kind !== "rep" || denom <= 0) return BARE_STUB_HEIGHT;
-  const ratio = Math.min(1, (slot.velocity ?? 0) / denom);
-  return Math.max(BARE_STUB_HEIGHT, ratio * height);
-}
-function getReducedMotionPreference() {
-  if (typeof window === "undefined" || typeof window.matchMedia !== "function") return false;
-  return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-}
-function usePrefersReducedMotion() {
-  const [reduced, setReduced] = useState(getReducedMotionPreference);
-  useEffect(() => {
-    if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
-    const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
-    const handler = () => setReduced(mq.matches);
-    handler();
-    mq.addEventListener?.("change", handler);
-    return () => mq.removeEventListener?.("change", handler);
-  }, []);
-  return reduced;
+function DashedReferenceLine({
+  anchor,
+  offset,
+  testID
+}) {
+  const edge = anchor === "top" ? { top: offset } : { bottom: offset };
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityElementsHidden: true,
+      style: {
+        position: "absolute",
+        left: 0,
+        right: 0,
+        borderTopWidth: 1,
+        borderStyle: "dashed",
+        borderColor: HERO_REFERENCE_COLOR,
+        pointerEvents: "none",
+        ...edge
+      },
+      testID
+    }
+  );
 }
-var ANIMATION_DURATION = 400;
-var ANIMATION_EASING = Easing.bezier(0.22, 1, 0.36, 1);
-var POP_EASING = Easing.bezier(0.34, 1.56, 0.64, 1);
-function useLiveRepPop(active, liveRepIndex, liveVelocity, isNewPeak) {
-  const prefersReducedMotion = usePrefersReducedMotion();
-  const [liveScale] = useState(() => new Animated.Value(1));
-  useEffect(() => {
-    if (!active || liveRepIndex == null || liveVelocity == null) return;
-    if (prefersReducedMotion) {
-      liveScale.setValue(1);
-      return;
+var BAND_LABEL_FONT = "monospace";
+var VL_LABEL_MIN_PLOT = 65;
+var VL_SEMANTIC = getSemanticColors("dark");
+function VelocityLossBands({
+  best,
+  scaleDenom,
+  plotHeight,
+  flip = false
+}) {
+  if (best <= 0 || scaleDenom <= 0 || plotHeight <= 0) return null;
+  const yOf = (v) => v / scaleDenom * plotHeight;
+  const vl20 = best * 0.8;
+  const vl30 = best * 0.7;
+  const vlFont = Math.round(Math.max(7, Math.min(9, plotHeight * 0.05)));
+  const showLabels = plotHeight >= VL_LABEL_MIN_PLOT;
+  const band = (loV, hiV, color) => /* @__PURE__ */ jsx(
+    View,
+    {
+      style: {
+        position: "absolute",
+        left: 0,
+        right: 0,
+        bottom: yOf(loV),
+        height: Math.max(0, yOf(hiV) - yOf(loV)),
+        backgroundColor: color
+      }
     }
-    if (isNewPeak) {
-      liveScale.setValue(1);
-      Animated.sequence([
-        Animated.timing(liveScale, {
-          toValue: 1.25,
-          duration: 150,
-          easing: Easing.out(Easing.quad),
-          useNativeDriver: true
-        }),
-        Animated.spring(liveScale, {
-          toValue: 1,
-          friction: 3,
-          tension: 140,
-          useNativeDriver: true
-        })
-      ]).start();
-    } else {
-      liveScale.setValue(0.8);
-      Animated.timing(liveScale, {
-        toValue: 1,
-        duration: 300,
-        easing: POP_EASING,
-        useNativeDriver: true
-      }).start();
+  );
+  const threshold = (v, color, label) => /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: {
+        position: "absolute",
+        left: 0,
+        right: 0,
+        bottom: yOf(v),
+        // Collapse to zero height so the dashed border lands EXACTLY on `yOf(v)` — the
+        // band edge — instead of floating up half a text-row (the label then centres on
+        // the line, breaking it). Matches DashedReferenceLine's bare-border anchoring.
+        height: 0,
+        flexDirection: "row",
+        alignItems: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(View, { style: { flex: 9, borderTopWidth: 1, borderStyle: "dashed", borderColor: color } }),
+        showLabels ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              style: {
+                marginHorizontal: 6,
+                fontSize: vlFont,
+                fontWeight: "800",
+                fontFamily: BAND_LABEL_FONT,
+                color,
+                ...flip ? { transform: [{ scaleY: -1 }] } : null
+              },
+              children: label
+            }
+          ),
+          /* @__PURE__ */ jsx(View, { style: { flex: 1, borderTopWidth: 1, borderStyle: "dashed", borderColor: color } })
+        ] }) : null
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessibilityElementsHidden: true,
+      pointerEvents: "none",
+      style: { position: "absolute", left: 0, right: 0, bottom: 0, top: 0 },
+      testID: "velocity-loss-bands",
+      children: [
+        band(0, vl30, alpha(VL_SEMANTIC["status-error"], 0.09)),
+        band(vl30, vl20, alpha(VL_SEMANTIC["status-warning"], 0.08)),
+        threshold(vl20, alpha(VL_SEMANTIC["status-warning"], 0.75), "VL 20%"),
+        threshold(vl30, alpha(VL_SEMANTIC["status-error"], 0.75), "VL 30%")
+      ]
     }
-  }, [active, liveRepIndex, liveVelocity, isNewPeak, prefersReducedMotion, liveScale]);
-  return liveScale;
+  );
 }
-function HeroVelocityChart({
-  doneVelocities,
-  barColorFor,
-  scaleDenom,
-  referenceVelocity,
-  liveRepIndex,
-  isNewPeak,
+function velocityReferenceOverlay(g, showLossBands) {
+  const referencePx = g.best > 0 && g.scaleDenom > 0 ? Math.min(g.plotHeight, g.yOf(g.best)) : 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    showLossBands && /* @__PURE__ */ jsx(
+      VelocityLossBands,
+      {
+        best: g.best,
+        scaleDenom: g.scaleDenom,
+        plotHeight: g.plotHeight,
+        flip: g.flip
+      }
+    ),
+    referencePx > 0 && /* @__PURE__ */ jsx(
+      DashedReferenceLine,
+      {
+        anchor: "bottom",
+        offset: referencePx,
+        testID: "velocity-hero-reference"
+      }
+    )
+  ] });
+}
+var ANIMATION_DURATION = 400;
+var DUAL_HERO_HEIGHT = SET_BAR_DEFAULT_HEIGHT;
+var DUAL_RAIL_HEIGHT = 96;
+var DUAL_COMPACT_HEIGHT = 11.5;
+var DUAL_WING_GAP = 2;
+var COMPACT_FOLD_GAP = 1.5;
+var COMPACT_FOLD_HALF = 5;
+function streamDone(stream) {
+  return stream.set ? deriveDoneVelocities(stream.set) : stream.velocities ?? [];
+}
+function streamNaturalSlots(stream, targetReps) {
+  if (stream.set) {
+    return buildSlots(stream.set).map((s) => ({
+      kind: s.kind,
+      value: s.velocity,
+      leadingGap: s.leadingGap
+    }));
+  }
+  const reps = (stream.velocities ?? []).map((v, i) => ({
+    kind: "rep",
+    value: v,
+    leadingGap: i === 0 ? 0 : REP_GAP2
+  }));
+  const pad = Math.max(0, (targetReps ?? 0) - reps.length);
+  return [...reps, ...Array.from({ length: pad }, () => ({ kind: "todo" }))];
+}
+function mergeColumnKind(l, r) {
+  const kinds = [l?.kind, r?.kind];
+  if (kinds.includes("variable")) return "variable";
+  if (kinds.includes("continue")) return "continue";
+  if (kinds.includes("rep")) return "rep";
+  return "todo";
+}
+function sideColumnCell(slot, kind, leadingGap) {
+  if (kind !== "rep") return { kind, leadingGap };
+  return slot?.kind === "rep" ? { kind: "rep", value: slot.value, leadingGap } : { kind: "empty", leadingGap };
+}
+function alignDualSlots(left, right) {
+  const n = Math.max(left.length, right.length);
+  const L = [];
+  const R = [];
+  for (let i = 0; i < n; i++) {
+    const lt = left[i];
+    const rt = right[i];
+    const kind = mergeColumnKind(lt, rt);
+    const gap = Math.max(lt?.leadingGap ?? REP_GAP2, rt?.leadingGap ?? REP_GAP2);
+    L.push(sideColumnCell(lt, kind, gap));
+    R.push(sideColumnCell(rt, kind, gap));
+  }
+  return { left: L, right: R };
+}
+function DualVelocityHero({
+  leftDone,
+  rightDone,
+  leftStream,
+  rightStream,
+  leftLabel,
+  rightLabel,
+  zones,
+  barColor: barColor2,
+  scale,
   targetReps,
+  liveRepIndex,
   height,
   className,
+  label,
   viewProps
 }) {
-  const liveVelocity = liveRepIndex != null ? doneVelocities[liveRepIndex] : void 0;
-  const liveScale = useLiveRepPop(true, liveRepIndex, liveVelocity, isNewPeak);
-  const [plotW, setPlotW] = useState(0);
-  const onPlotLayout = (e) => setPlotW(e.nativeEvent.layout.width);
-  const plotHeight = Math.max(0, height - HERO_LABEL_HEADROOM);
-  const barHeight = (velocity) => scaleDenom > 0 ? Math.max(HERO_MIN_BAR_HEIGHT, Math.min(1, velocity / scaleDenom) * plotHeight) : HERO_MIN_BAR_HEIGHT;
-  const pendingCount = Math.max(0, (targetReps ?? 0) - doneVelocities.length);
-  const referencePx = referenceVelocity > 0 && scaleDenom > 0 ? Math.min(plotHeight, referenceVelocity / scaleDenom * plotHeight) : 0;
-  const totalSlots = doneVelocities.length + pendingCount;
-  const barWidth = plotW > 0 && totalSlots > 0 ? Math.min(HERO_BAR_MAX_WIDTH, (plotW - HERO_BAR_GAP * (totalSlots - 1)) / totalSlots) : HERO_BAR_MAX_WIDTH;
-  const labelsCrowded = plotW > 0 && barWidth < HERO_LABEL_MIN_BAR_WIDTH;
-  const heroGap = plotW === 0 ? HERO_BAR_GAP : barWidth < 16 ? 2 : barWidth < 28 ? 4 : HERO_BAR_GAP;
-  const peakIndex = doneVelocities.reduce(
-    (best, v, i) => v > doneVelocities[best] ? i : best,
-    0
-  );
-  const showBarLabel = (i) => !labelsCrowded || i === peakIndex || i === liveRepIndex;
-  const repCount = doneVelocities.length;
-  const total = Math.max(repCount, targetReps ?? repCount);
-  const label = referenceVelocity > 0 ? `Velocity chart, ${repCount} of ${total} reps, best ${formatVelocity(referenceVelocity)} meters per second` : `Velocity chart, ${repCount} of ${total} reps`;
+  const plotHalf = (height - DUAL_WING_GAP) / 2;
+  const sharedMax = Math.max(...leftDone, ...rightDone, 0);
+  const aligned = alignDualSlots(
+    leftStream ? streamNaturalSlots(leftStream, targetReps) : [],
+    rightStream ? streamNaturalSlots(rightStream, targetReps) : []
+  );
   const { style: externalStyle, ...restProps } = viewProps;
-  return /* @__PURE__ */ jsx(
+  const wing = (orientation, columns, done) => /* @__PURE__ */ jsx(
+    VelocityStrip,
+    {
+      variant: "hero",
+      orientation,
+      velocities: done,
+      columnSlots: columns,
+      scale,
+      scaleMax: scale === "fixed" ? void 0 : sharedMax,
+      barColor: barColor2,
+      zones,
+      liveRepIndex,
+      height: plotHalf,
+      hideBaseline: true
+    }
+  );
+  return /* @__PURE__ */ jsxs(
     View,
     {
       className,
-      style: [{ height }, externalStyle],
+      style: [{ height, flexDirection: "row" }, externalStyle],
       accessibilityRole: "image",
       accessibilityLabel: label,
-      testID: "velocity-strip-hero",
+      testID: "dual-velocity-strip",
       ...restProps,
-      children: /* @__PURE__ */ jsxs(
-        View,
-        {
-          onLayout: onPlotLayout,
-          style: {
-            flex: 1,
-            flexDirection: "row",
-            alignItems: "flex-end",
-            gap: heroGap,
-            position: "relative",
-            borderBottomWidth: 2,
-            borderBottomColor: HERO_PENDING_COLOR
-          },
-          children: [
-            referencePx > 0 && /* @__PURE__ */ jsx(
-              View,
-              {
-                accessibilityElementsHidden: true,
-                style: {
-                  position: "absolute",
-                  left: 0,
-                  right: 0,
-                  bottom: referencePx,
-                  borderTopWidth: 1,
-                  borderStyle: "dashed",
-                  borderColor: HERO_REFERENCE_COLOR,
-                  pointerEvents: "none"
-                },
-                testID: "velocity-hero-reference"
-              }
-            ),
-            doneVelocities.map((velocity, i) => {
-              const isLive = liveRepIndex === i;
-              return /* @__PURE__ */ jsxs(
-                View,
-                {
-                  accessibilityElementsHidden: true,
-                  style: {
-                    flex: 1,
-                    maxWidth: HERO_BAR_MAX_WIDTH,
-                    height: "100%",
-                    alignItems: "center",
-                    justifyContent: "flex-end"
-                  },
-                  children: [
-                    showBarLabel(i) && /* @__PURE__ */ jsx(
-                      Text,
-                      {
-                        className: "text-text-primary",
-                        style: { fontSize: 12, fontWeight: "800", marginBottom: 4 },
-                        testID: `velocity-label-${i}`,
-                        children: formatVelocity(velocity)
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      Animated.View,
-                      {
-                        style: [
-                          {
-                            width: "100%",
-                            height: barHeight(velocity),
-                            borderTopLeftRadius: HERO_BAR_RADIUS,
-                            borderTopRightRadius: HERO_BAR_RADIUS,
-                            backgroundColor: barColorFor(velocity)
-                          },
-                          isLive ? { transform: [{ scale: liveScale }] } : null
-                        ],
-                        testID: `velocity-bar-${i}`
-                      }
-                    )
-                  ]
-                },
-                i
-              );
-            }),
-            Array.from({ length: pendingCount }, (_, i) => /* @__PURE__ */ jsx(
-              View,
-              {
-                accessibilityElementsHidden: true,
-                style: {
-                  flex: 1,
-                  maxWidth: HERO_BAR_MAX_WIDTH,
-                  height: "100%",
-                  alignItems: "center",
-                  justifyContent: "flex-end"
-                },
-                children: /* @__PURE__ */ jsx(
-                  View,
-                  {
-                    style: {
-                      width: "100%",
-                      height: HERO_MIN_BAR_HEIGHT * 3,
-                      borderWidth: 1,
-                      borderStyle: "dashed",
-                      borderColor: HERO_PENDING_COLOR,
-                      borderTopLeftRadius: HERO_BAR_RADIUS,
-                      borderTopRightRadius: HERO_BAR_RADIUS
-                    },
-                    testID: "velocity-slot-todo"
-                  }
-                )
-              },
-              `pending-${i}`
-            ))
-          ]
-        }
-      )
+      children: [
+        /* @__PURE__ */ jsx(
+          ChartSideRail,
+          {
+            sectionExtent: plotHalf,
+            variant: "hero",
+            sections: [
+              { label: leftLabel, testID: "dual-velocity-side-label-L" },
+              { label: rightLabel, testID: "dual-velocity-side-label-R" }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(View, { style: { flex: 1, gap: DUAL_WING_GAP }, children: [
+          /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-up", children: wing("up", aligned.left, leftDone) }),
+          /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-down", children: wing("down", aligned.right, rightDone) })
+        ] })
+      ]
+    }
+  );
+}
+function DualVelocityRail({
+  leftDone,
+  rightDone,
+  leftStream,
+  rightStream,
+  zones,
+  barColor: barColor2,
+  scale,
+  targetReps,
+  liveRepIndex,
+  height,
+  className,
+  label,
+  viewProps
+}) {
+  const plotHalf = (height - DUAL_WING_GAP) / 2;
+  const sharedMax = Math.max(...leftDone, ...rightDone, 0);
+  const aligned = alignDualSlots(
+    leftStream ? streamNaturalSlots(leftStream, targetReps) : [],
+    rightStream ? streamNaturalSlots(rightStream, targetReps) : []
+  );
+  const { style: externalStyle, ...restProps } = viewProps;
+  const wing = (orientation, columns, done) => /* @__PURE__ */ jsx(
+    VelocityStrip,
+    {
+      variant: "expanded",
+      showNumbers: false,
+      showInfo: false,
+      orientation,
+      velocities: done,
+      columnSlots: columns,
+      scale,
+      scaleMax: scale === "fixed" ? void 0 : sharedMax,
+      barColor: barColor2,
+      zones,
+      liveRepIndex,
+      height: plotHalf
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ height, flexDirection: "column", gap: DUAL_WING_GAP }, externalStyle],
+      accessibilityRole: "image",
+      accessibilityLabel: label,
+      testID: "dual-velocity-strip",
+      ...restProps,
+      children: [
+        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-up", children: wing("up", aligned.left, leftDone) }),
+        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-down", children: wing("down", aligned.right, rightDone) })
+      ]
+    }
+  );
+}
+function DualVelocityCompactStrip({
+  leftDone,
+  rightDone,
+  leftStream,
+  rightStream,
+  zones,
+  barColor: barColor2,
+  targetReps,
+  height,
+  className,
+  label,
+  viewProps
+}) {
+  const half = height === DUAL_COMPACT_HEIGHT ? COMPACT_FOLD_HALF : (height - COMPACT_FOLD_GAP) / 2;
+  const aligned = alignDualSlots(
+    leftStream ? streamNaturalSlots(leftStream, targetReps) : [],
+    rightStream ? streamNaturalSlots(rightStream, targetReps) : []
+  );
+  const { style: externalStyle, ...restProps } = viewProps;
+  const wing = (orientation, columns, done) => /* @__PURE__ */ jsx(
+    VelocityStrip,
+    {
+      variant: "compact",
+      orientation,
+      velocities: done,
+      columnSlots: columns,
+      barColor: barColor2,
+      zones,
+      height: half
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ height, flexDirection: "column", gap: COMPACT_FOLD_GAP }, externalStyle],
+      accessibilityRole: "image",
+      accessibilityLabel: label,
+      testID: "dual-velocity-strip",
+      ...restProps,
+      children: [
+        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-up", children: wing("up", aligned.left, leftDone) }),
+        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "dual-velocity-wing-down", children: wing("down", aligned.right, rightDone) })
+      ]
     }
   );
 }
+function DualVelocityStrip({
+  left,
+  right,
+  zones,
+  barColor: barColor2 = "loss",
+  targetReps,
+  liveRepIndex,
+  variant = "hero",
+  scale = "peak",
+  height,
+  className,
+  ...props
+}) {
+  const resolvedHeight = height ?? (variant === "hero" ? DUAL_HERO_HEIGHT : variant === "compact" ? DUAL_COMPACT_HEIGHT : DUAL_RAIL_HEIGHT);
+  const leftDone = streamDone(left);
+  const rightDone = streamDone(right);
+  const label = `Dual velocity chart, left ${leftDone.length} of ${Math.max(leftDone.length, targetReps ?? leftDone.length)} reps, right ${rightDone.length} of ${Math.max(rightDone.length, targetReps ?? rightDone.length)} reps`;
+  const shared = {
+    leftDone,
+    rightDone,
+    leftStream: left,
+    rightStream: right,
+    leftLabel: left.label,
+    rightLabel: right.label,
+    zones,
+    barColor: barColor2,
+    scale,
+    targetReps,
+    height: resolvedHeight,
+    className,
+    label,
+    viewProps: props
+  };
+  if (variant === "rail") return /* @__PURE__ */ jsx(DualVelocityRail, { ...shared, liveRepIndex });
+  if (variant === "compact") return /* @__PURE__ */ jsx(DualVelocityCompactStrip, { ...shared });
+  return /* @__PURE__ */ jsx(DualVelocityHero, { ...shared, liveRepIndex });
+}
 function VelocityStrip({
   velocities,
   set,
   zones,
+  barColor: barColor2 = "loss",
+  showLossBands,
+  orientation = "up",
+  scaleMax,
+  hideBaseline,
+  columnSlots,
+  label,
   liveRepIndex,
   expanded = true,
   onToggle,
@@ -9311,51 +9633,29 @@ function VelocityStrip({
   className,
   ...props
 }) {
+  const lossBandsOn = showLossBands ?? barColor2 === "loss";
   const doneVelocities = set ? deriveDoneVelocities(set) : velocities ?? [];
-  const slots = set ? buildSlots(set) : doneVelocities.map((v, i) => ({
-    kind: "rep",
-    velocity: v,
-    leadingGap: i === 0 ? 0 : REP_GAP
-  }));
   const maxVelocity = Math.max(...doneVelocities, 0);
   const meanVelocity = calculateMeanVelocity(doneVelocities);
   const loss = calculateVelocityLoss(doneVelocities);
   const framed = showNumbers || showInfo;
-  const scaleDenom = scaleDenominator(scale, maxVelocity);
   const hasZones = zones != null && zones.length > 0;
-  const barColorFor = (v) => hasZones ? bandColor(classifyBand(v, zones)) : zoneHexMap[getVelocityZoneColor(v)];
-  const slotColor = (slot) => {
-    if (slot.kind === "rep") return barColorFor(slot.velocity ?? 0);
-    if (slot.kind === "todo") return TODO_COLOR2;
-    return SET_STRIP_VARIABLE_COLOR;
-  };
+  const zoneColorFor = makeBarColorFor(zones);
+  const barColorFor = (v) => barColor2 === "loss" ? getVelocityLossColor(velocityLossForRep(v, maxVelocity)) : zoneColorFor(v);
   const meanZone = hasZones ? classifyBand(meanVelocity, zones)?.label ?? "" : getVelocityZoneName(meanVelocity);
-  const [heightAnim] = useState(() => new Animated.Value(expanded ? height : 3));
-  const [labelOpacity] = useState(() => new Animated.Value(expanded ? 1 : 0));
+  const [expandProgress] = useState(() => new Animated.Value(expanded ? 1 : 0));
   const [infoOpacity] = useState(() => new Animated.Value(expanded ? 1 : 0));
   const liveVelocity = liveRepIndex != null ? doneVelocities[liveRepIndex] : void 0;
   const isNewPeak = liveVelocity != null && maxVelocity > 0 && liveVelocity === maxVelocity;
-  const liveScale = useLiveRepPop(
-    variant === "expanded" && framed,
-    liveRepIndex,
-    liveVelocity,
-    isNewPeak
-  );
   useEffect(() => {
     if (variant !== "expanded" || !framed) return;
     Animated.parallel([
-      Animated.timing(heightAnim, {
-        toValue: expanded ? height : 3,
+      Animated.timing(expandProgress, {
+        toValue: expanded ? 1 : 0,
         duration: ANIMATION_DURATION,
         easing: ANIMATION_EASING,
         useNativeDriver: false
       }),
-      Animated.timing(labelOpacity, {
-        toValue: expanded ? 1 : 0,
-        duration: 300,
-        delay: expanded ? 150 : 0,
-        useNativeDriver: false
-      }),
       Animated.timing(infoOpacity, {
         toValue: expanded ? 1 : 0,
         duration: 300,
@@ -9363,250 +9663,176 @@ function VelocityStrip({
         useNativeDriver: false
       })
     ]).start();
-  }, [expanded, variant, framed, height, heightAnim, labelOpacity, infoOpacity]);
+  }, [expanded, variant, framed, expandProgress, infoOpacity]);
   if (set == null && velocities == null) return null;
   const repCount = doneVelocities.length;
   const miniLabel = set ? setAccessibilityLabel(set, repCount) : `Velocity strip, ${repCount} reps`;
   if (variant === "hero") {
-    const heroHeight = height === EXPANDED_HEIGHT ? HERO_HEIGHT : height;
+    const heroHeight = height === EXPANDED_HEIGHT && columnSlots == null ? SET_BAR_DEFAULT_HEIGHT : height;
+    const heroSlots = columnSlots ?? (set ? buildSlots(set).map((s) => ({
+      kind: s.kind,
+      value: s.velocity,
+      leadingGap: s.leadingGap
+    })) : doneVelocities.map((v) => ({ kind: "rep", value: v })));
+    const total = Math.max(repCount, targetReps ?? repCount);
+    const heroLabel = maxVelocity > 0 ? `Velocity chart, ${repCount} of ${total} reps, best ${formatVelocity(maxVelocity)} meters per second` : `Velocity chart, ${repCount} of ${total} reps`;
     return /* @__PURE__ */ jsx(
-      HeroVelocityChart,
+      SetBarChart,
       {
-        doneVelocities,
-        barColorFor,
-        scaleDenom,
-        referenceVelocity: maxVelocity,
+        slots: heroSlots,
+        colorFor: barColorFor,
+        height: heroHeight,
+        scale,
+        scaleMax,
+        orientation,
         liveRepIndex,
         isNewPeak,
-        targetReps,
-        height: heroHeight,
+        targetReps: set || columnSlots ? void 0 : targetReps,
+        label,
+        showValueLabels: true,
+        formatValue: formatVelocity,
+        renderReference: (g) => velocityReferenceOverlay(g, lossBandsOn),
+        hideBaseline: true,
+        testID: "velocity-strip-hero",
+        testIDPrefix: "velocity",
+        accessibilityLabel: heroLabel,
         className,
         viewProps: props
       }
     );
   }
-  if (variant === "mini") {
-    const { style: externalStyle, ...restProps } = props;
+  if (variant === "compact") {
+    const compactSlots = columnSlots ?? (set ? buildSlots(set).map((s) => ({
+      kind: s.kind,
+      value: s.velocity,
+      leadingGap: s.leadingGap
+    })) : doneVelocities.map((v) => ({ kind: "rep", value: v })));
+    const compactHeight = height === EXPANDED_HEIGHT ? COMPACT_HEIGHT : height;
     return /* @__PURE__ */ jsx(
-      View,
+      SetBarChart,
       {
-        className,
-        style: [
-          { flexDirection: "row", height: 3, gap: REP_GAP, borderRadius: 2, overflow: "hidden" },
-          externalStyle
-        ],
-        accessibilityRole: "image",
+        slots: compactSlots,
+        colorFor: barColorFor,
+        height: compactHeight,
+        scale,
+        scaleMax,
+        orientation,
+        flat: true,
+        barRadius: 2,
+        cornerStyle: "all",
+        targetReps: set || columnSlots ? void 0 : targetReps,
+        label,
+        hideBaseline: true,
+        testID: "velocity-strip-compact",
+        testIDPrefix: "velocity",
         accessibilityLabel: miniLabel,
-        testID: "velocity-strip-mini",
-        ...restProps,
-        children: slots.map((slot, i) => /* @__PURE__ */ jsx(
-          View,
-          {
-            style: {
-              flex: 1,
-              backgroundColor: slotColor(slot),
-              borderRadius: 1,
-              minWidth: 4,
-              height: "100%",
-              // The container's uniform 2px gap covers rep spacing; a wide slot adds
-              // only the EXTRA (WIDE_GAP − REP_GAP) so the notch totals WIDE_GAP.
-              marginLeft: Math.max(0, slot.leadingGap - REP_GAP),
-              ...slot.kind === "continue" ? { borderWidth: 1, borderColor: CONTINUE_OUTLINE } : {}
-            },
-            accessibilityElementsHidden: true,
-            testID: slot.kind === "rep" ? `velocity-bar-${i}` : `velocity-slot-${slot.kind}`
-          },
-          i
-        ))
+        className,
+        viewProps: props
       }
     );
   }
   if (!framed) {
-    const { style: externalStyle, ...restProps } = props;
+    const spotlightSlots = columnSlots ?? (set ? buildSlots(set).map((s) => ({
+      kind: s.kind,
+      value: s.velocity,
+      leadingGap: s.leadingGap
+    })) : doneVelocities.map((v) => ({ kind: "rep", value: v })));
     return /* @__PURE__ */ jsx(
-      View,
+      SetBarChart,
       {
-        className,
-        style: [
-          { flexDirection: "row", height, gap: REP_GAP, alignItems: "flex-end" },
-          externalStyle
-        ],
-        accessibilityRole: "image",
+        slots: spotlightSlots,
+        colorFor: barColorFor,
+        height,
+        scale,
+        scaleMax,
+        orientation,
+        liveRepIndex,
+        isNewPeak,
+        barRadius: 2,
+        cornerStyle: "top",
+        targetReps: set ? void 0 : targetReps,
+        label,
+        hideBaseline: true,
+        testID: "velocity-strip-spotlight",
+        testIDPrefix: "velocity",
         accessibilityLabel: miniLabel,
-        testID: "velocity-strip-compact",
-        ...restProps,
-        children: slots.map((slot, i) => /* @__PURE__ */ jsx(
-          View,
-          {
-            style: {
-              flex: 1,
-              minWidth: 4,
-              height: bareSlotHeight(slot, height, scaleDenom),
-              // Top-rounded to match the framed chart's bars (the "rounded tops from
-              // the numbers one"); square bottoms since bars sit on the baseline.
-              borderTopLeftRadius: 2,
-              borderTopRightRadius: 2,
-              backgroundColor: slotColor(slot),
-              marginLeft: Math.max(0, slot.leadingGap - REP_GAP),
-              ...slot.kind === "continue" ? { borderWidth: 1, borderColor: CONTINUE_OUTLINE } : {}
-            },
-            accessibilityElementsHidden: true,
-            testID: slot.kind === "rep" ? `velocity-bar-${i}` : `velocity-slot-${slot.kind}`
-          },
-          i
-        ))
+        className,
+        viewProps: props
       }
     );
   }
   const stripLabel = set ? `${setAccessibilityLabel(set, repCount)}, tap to ${expanded ? "collapse" : "expand"}` : `Velocity chart for set, ${repCount} reps, tap to ${expanded ? "collapse" : "expand"}`;
   const hasInteractiveContainer = onToggle != null;
   const hasInteractiveReps = onRepPress != null && expanded;
-  const setBars = set != null && slots.map((slot, i) => {
-    const isStraightRep = set.type === "straight" && slot.kind === "rep";
-    const heightPct = isStraightRep ? scaleDenom > 0 ? Math.round((slot.velocity ?? 0) / scaleDenom * 100) : 0 : set.type === "straight" ? EXPANDED_TODO_STUB_PCT : EXPANDED_ENCODED_PCT;
-    return /* @__PURE__ */ jsx(
-      View,
+  const framedSlots = set ? buildSlots(set).map((sl) => ({
+    kind: sl.kind,
+    value: sl.velocity,
+    leadingGap: sl.leadingGap
+  })) : doneVelocities.map((v) => ({ kind: "rep", value: v }));
+  const needsBarOverlay = showNumbers || onRepPress != null;
+  const renderFramedBarOverlay = needsBarOverlay ? (repIndex, value) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    showNumbers && /* @__PURE__ */ jsx(
+      Animated.View,
       {
         style: {
-          flex: 1,
-          height: "100%",
-          justifyContent: "flex-end",
-          marginLeft: slot.leadingGap
+          opacity: expandProgress,
+          position: "absolute",
+          top: -13,
+          left: 0,
+          right: 0,
+          alignItems: "center"
         },
+        accessibilityElementsHidden: true,
+        pointerEvents: "none",
         children: /* @__PURE__ */ jsx(
-          View,
+          Text,
           {
-            style: {
-              height: `${heightPct}%`,
-              minHeight: 2,
-              borderTopLeftRadius: 2,
-              borderTopRightRadius: 2,
-              backgroundColor: slotColor(slot),
-              ...slot.kind === "continue" ? { borderWidth: 1, borderColor: CONTINUE_OUTLINE } : {}
-            },
-            testID: slot.kind === "rep" ? `velocity-bar-${i}` : `velocity-slot-${slot.kind}`,
-            accessibilityRole: "image",
-            accessibilityLabel: slotAccessibilityLabel(slot, i)
+            className: "text-text-secondary",
+            style: { fontSize: 8, fontWeight: "600" },
+            testID: `velocity-label-${repIndex}`,
+            children: formatVelocity(value)
           }
         )
-      },
-      i
-    );
-  });
+      }
+    ),
+    onRepPress && expanded && /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        style: { position: "absolute", top: 0, bottom: 0, left: 0, right: 0 },
+        onPress: () => onRepPress(repIndex, value),
+        accessibilityRole: "button",
+        accessibilityLabel: `Rep ${repIndex + 1}: ${formatVelocity(value)} meters per second, tap for details`,
+        testID: `velocity-bar-pressable-${repIndex}`
+      }
+    )
+  ] }) : void 0;
   const stripContent = /* @__PURE__ */ jsxs(
     Animated.View,
     {
-      className: [className, expanded ? "bg-surface-raised" : "bg-transparent"].filter(Boolean).join(" "),
-      style: [
-        {
-          height: heightAnim,
-          width: "100%",
-          gap: 2,
-          borderRadius: expanded ? 6 : 2,
-          paddingTop: expanded ? 16 : 0,
-          paddingBottom: expanded ? 24 : 0,
-          // No horizontal inset — the framed chart's bars span full width, matching
-          // the bare spotlight and mini. Numbers/info sit in the vertical padding.
-          paddingHorizontal: 0,
-          paddingVertical: expanded ? void 0 : 8,
-          overflow: expanded ? "visible" : "hidden"
-        }
-      ],
+      className: [className, "bg-surface-raised"].filter(Boolean).join(" "),
+      style: { width: "100%", borderRadius: 6, paddingTop: 16, paddingBottom: showInfo ? 8 : 4 },
       accessibilityRole: hasInteractiveContainer || hasInteractiveReps ? "none" : "button",
       accessibilityLabel: hasInteractiveContainer || hasInteractiveReps ? void 0 : stripLabel,
       testID: "velocity-strip",
       ...props,
       children: [
-        /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flex: 1, gap: set ? 0 : 2, alignItems: "flex-end" }, children: set ? setBars : doneVelocities.map((v, i) => {
-          const barBackground = barColorFor(v);
-          const barHeightPct = scaleDenom > 0 ? Math.round(v / scaleDenom * 100) : 0;
-          const isLive = liveRepIndex === i;
-          const liveLabelSuffix = isLive ? isNewPeak ? ", latest rep, new set peak" : ", latest rep" : "";
-          const barStyle = expanded ? {
-            height: `${barHeightPct}%`,
-            minHeight: 2,
-            borderTopLeftRadius: 2,
-            borderTopRightRadius: 2,
-            backgroundColor: barBackground
-          } : {
-            minHeight: "100%",
-            borderTopLeftRadius: 2,
-            borderTopRightRadius: 2,
-            borderBottomLeftRadius: 0,
-            borderBottomRightRadius: 0,
-            backgroundColor: barBackground
-          };
-          const barInner = isLive ? /* @__PURE__ */ jsx(
-            Animated.View,
-            {
-              style: [barStyle, { transform: [{ scale: liveScale }] }],
-              testID: `velocity-bar-${i}`,
-              accessibilityRole: "image",
-              accessibilityLabel: `Rep ${i + 1}: ${formatVelocity(v)} meters per second${liveLabelSuffix}`
-            }
-          ) : /* @__PURE__ */ jsx(
-            View,
-            {
-              style: barStyle,
-              testID: `velocity-bar-${i}`,
-              accessibilityRole: "image",
-              accessibilityLabel: `Rep ${i + 1}: ${formatVelocity(v)} meters per second`
-            }
-          );
-          const bar = /* @__PURE__ */ jsxs(
-            View,
-            {
-              style: {
-                flex: 1,
-                height: "100%",
-                justifyContent: "flex-end",
-                position: "relative"
-              },
-              children: [
-                expanded && showNumbers && /* @__PURE__ */ jsx(
-                  Animated.View,
-                  {
-                    style: {
-                      opacity: labelOpacity,
-                      alignItems: "center",
-                      position: "absolute",
-                      top: -13,
-                      left: 0,
-                      right: 0
-                    },
-                    accessibilityElementsHidden: true,
-                    children: /* @__PURE__ */ jsx(
-                      Text,
-                      {
-                        className: "text-text-secondary",
-                        style: { fontSize: 8, fontWeight: "600" },
-                        testID: `velocity-label-${i}`,
-                        children: formatVelocity(v)
-                      }
-                    )
-                  }
-                ),
-                barInner
-              ]
-            },
-            i
-          );
-          if (onRepPress && expanded) {
-            return /* @__PURE__ */ jsx(
-              Pressable,
-              {
-                style: { flex: 1, height: "100%" },
-                onPress: () => onRepPress(i, v),
-                accessibilityRole: "button",
-                accessibilityLabel: `Rep ${i + 1}: ${formatVelocity(v)} meters per second, tap for details`,
-                testID: `velocity-bar-pressable-${i}`,
-                children: bar
-              },
-              i
-            );
+        /* @__PURE__ */ jsx(
+          SetBarChart,
+          {
+            slots: framedSlots,
+            colorFor: barColorFor,
+            height,
+            scale,
+            scaleMax,
+            expandProgress,
+            renderBarOverlay: renderFramedBarOverlay,
+            targetReps: set ? void 0 : targetReps,
+            barRadius: 2,
+            cornerStyle: "top",
+            hideBaseline: true,
+            testIDPrefix: "velocity"
           }
-          return bar;
-        }) }),
+        ),
         expanded && showInfo && /* @__PURE__ */ jsxs(
           Animated.View,
           {
@@ -9614,10 +9840,8 @@ function VelocityStrip({
               flexDirection: "row",
               justifyContent: "space-between",
               opacity: infoOpacity,
-              position: "absolute",
-              bottom: 4,
-              left: 6,
-              right: 6
+              marginTop: 6,
+              paddingHorizontal: 6
             },
             testID: "velocity-info-row",
             children: [
@@ -9625,10 +9849,7 @@ function VelocityStrip({
                 Text,
                 {
                   className: "text-text-secondary",
-                  style: {
-                    fontSize: 10,
-                    fontFamily: "Inter, sans-serif"
-                  },
+                  style: { fontSize: 10, fontFamily: "Inter, sans-serif" },
                   children: [
                     meanZone,
                     " ",
@@ -9643,11 +9864,7 @@ function VelocityStrip({
                 Text,
                 {
                   className: "text-text-secondary",
-                  style: {
-                    fontSize: 10,
-                    fontFamily: "Inter, sans-serif",
-                    ...getLossStyle(loss)
-                  },
+                  style: { fontSize: 10, fontFamily: "Inter, sans-serif", ...getLossStyle(loss) },
                   children: [
                     "Loss: ",
                     loss,
@@ -9955,6 +10172,7 @@ function RowStrip({ set }) {
         showInfo: false,
         height: 24,
         scale: "fixed",
+        liveRepIndex: set.velocities.length - 1,
         set: { type: "straight", velocities: set.velocities, planned: set.target.reps },
         zones
       }
@@ -9964,7 +10182,9 @@ function RowStrip({ set }) {
   return /* @__PURE__ */ jsx(
     VelocityStrip,
     {
-      variant: "mini",
+      variant: "compact",
+      height: 8,
+      hideBaseline: true,
       set: { type: "straight", velocities, planned: plannedReps(set) },
       zones
     }
@@ -10417,11 +10637,112 @@ function SetsRepsLoad({
     }
   );
 }
-
-// src/components/custom/Workout/paceTone.ts
-function paceTone(progress, target) {
-  if (target === void 0) return "neutral";
-  return progress >= target ? "ahead" : "behind";
+var PULSE_HALF_MS = 950;
+var PULSE_MIN_OPACITY = 0.45;
+var SEGMENTED_BAR_GAP = 5;
+function usePulse2(active) {
+  const [value] = useState(() => new Animated.Value(0));
+  useEffect(() => {
+    if (!active) return;
+    const loop = Animated.loop(
+      Animated.sequence([
+        Animated.timing(value, {
+          toValue: 1,
+          duration: PULSE_HALF_MS,
+          easing: Easing.inOut(Easing.ease),
+          useNativeDriver: false
+        }),
+        Animated.timing(value, {
+          toValue: 0,
+          duration: PULSE_HALF_MS,
+          easing: Easing.inOut(Easing.ease),
+          useNativeDriver: false
+        })
+      ])
+    );
+    loop.start();
+    return () => loop.stop();
+  }, [active, value]);
+  return value;
+}
+function SegmentedBar({
+  segments,
+  height = 8,
+  gap = SEGMENTED_BAR_GAP,
+  radius = 2,
+  marker = null,
+  segmentTestID,
+  style,
+  ...props
+}) {
+  const pulse = usePulse2(segments.some((s) => s.pulse));
+  return /* @__PURE__ */ jsxs(View, { style: [{ flexDirection: "row", height, gap, position: "relative" }, style], ...props, children: [
+    segments.map((seg, i) => {
+      const fillStyle = {
+        width: `${(seg.fill ?? 1) * 100}%`,
+        height: "100%",
+        backgroundColor: seg.color,
+        opacity: seg.opacity
+      };
+      const testID = segmentTestID?.(seg, i) ?? "segmented-bar-segment";
+      return /* @__PURE__ */ jsx(
+        View,
+        {
+          style: {
+            flex: seg.weight ?? 1,
+            minWidth: 0,
+            height: "100%",
+            marginLeft: seg.leadingGap,
+            borderRadius: radius,
+            overflow: "hidden"
+          },
+          children: seg.pulse ? /* @__PURE__ */ jsx(
+            Animated.View,
+            {
+              style: {
+                ...fillStyle,
+                ...seg.pulseColor ? {
+                  backgroundColor: pulse.interpolate({
+                    inputRange: [0, 1],
+                    outputRange: seg.pulseColor
+                  })
+                } : {
+                  opacity: pulse.interpolate({
+                    inputRange: [0, 1],
+                    outputRange: [PULSE_MIN_OPACITY, 1]
+                  })
+                }
+              },
+              accessibilityElementsHidden: true,
+              testID
+            }
+          ) : /* @__PURE__ */ jsx(View, { style: fillStyle, accessibilityElementsHidden: true, testID })
+        },
+        i
+      );
+    }),
+    marker ? /* @__PURE__ */ jsx(
+      View,
+      {
+        style: {
+          position: "absolute",
+          left: `${marker.position * 100}%`,
+          top: 0,
+          bottom: 0,
+          width: 2,
+          backgroundColor: marker.color
+        },
+        accessibilityElementsHidden: true,
+        testID: "segmented-bar-marker"
+      }
+    ) : null
+  ] });
+}
+
+// src/components/custom/Workout/paceTone.ts
+function paceTone(progress, target) {
+  if (target === void 0) return "neutral";
+  return progress >= target ? "ahead" : "behind";
 }
 var PACE_TONE_COLORS = {
   ahead: getSemanticColors("dark")["status-success"],
@@ -10510,6 +10831,140 @@ function ScheduleTiles({ when, now, gap = 1, ...props }) {
     )
   ] });
 }
+
+// src/components/custom/Workout/SetBar.tsx
+var SET_STRIP_ZONES = {
+  slow: primitiveRamps.red[600],
+  moderate: primitiveRamps.orange[400],
+  fast: primitiveRamps.amber[300],
+  fastest: primitiveRamps.green[300]
+};
+var TODO_COLOR = primitiveColors.charcoal[300];
+var SET_STRIP_VARIABLE_COLOR = primitiveRamps.cyan[900];
+var NOTCH_GAP = 2;
+var CLUSTER_GAP = 3;
+var MYO_UPCOMING_CLUSTERS = 3;
+var MYO_UPCOMING_CLUSTER_LEN = 5;
+var MYO_UPCOMING_FADE = 0.6;
+var PULSE_RANGE = {
+  [SET_STRIP_ZONES.slow]: [primitiveRamps.red[500], primitiveRamps.red[700]],
+  [SET_STRIP_ZONES.moderate]: [primitiveRamps.orange[300], primitiveRamps.orange[500]],
+  [SET_STRIP_ZONES.fast]: [primitiveRamps.amber[200], primitiveRamps.amber[400]],
+  [SET_STRIP_ZONES.fastest]: [primitiveRamps.green[200], primitiveRamps.green[400]]
+};
+function velocityZoneColor(v) {
+  if (v < 0.5) return SET_STRIP_ZONES.slow;
+  if (v < 0.75) return SET_STRIP_ZONES.moderate;
+  if (v < 1) return SET_STRIP_ZONES.fast;
+  return SET_STRIP_ZONES.fastest;
+}
+function chunkedSegments(chunks, gap) {
+  return chunks.flatMap(
+    (vels, ci) => vels.map((v, ri) => ({
+      color: velocityZoneColor(v),
+      ...ci > 0 && ri === 0 ? { leadingGap: gap } : {}
+    }))
+  );
+}
+function rangeSegments(floor, max, doneVels) {
+  return Array.from({ length: max }, (_, i) => {
+    if (i < doneVels.length) return { color: velocityZoneColor(doneVels[i]) };
+    return { color: i < floor ? TODO_COLOR : SET_STRIP_VARIABLE_COLOR };
+  });
+}
+function myoUpcomingSegments(activationLen, clusterCount) {
+  const activation = Array.from({ length: activationLen }, () => ({ color: TODO_COLOR }));
+  const trail = Array.from(
+    { length: clusterCount },
+    (_, ci) => Array.from({ length: MYO_UPCOMING_CLUSTER_LEN }, (_2, ri) => ({
+      color: SET_STRIP_VARIABLE_COLOR,
+      opacity: MYO_UPCOMING_FADE ** ci,
+      ...ri === 0 ? { leadingGap: CLUSTER_GAP } : {}
+    }))
+  ).flat();
+  return [...activation, ...trail];
+}
+function setSegments(set) {
+  if (set.status === "todo") {
+    return [{ color: TODO_COLOR }];
+  }
+  if (set.status === "done") {
+    return set.velocities.map((v) => ({ color: velocityZoneColor(v) }));
+  }
+  if (set.status === "range") {
+    return rangeSegments(set.floor, set.max, set.doneVels);
+  }
+  if (set.status === "drop") {
+    return chunkedSegments(set.subloads, NOTCH_GAP);
+  }
+  if (set.status === "myo") {
+    return chunkedSegments([set.activation, ...set.clusters], CLUSTER_GAP);
+  }
+  if (set.status === "myo-upcoming") {
+    return myoUpcomingSegments(set.activationLen, set.clusterCount ?? MYO_UPCOMING_CLUSTERS);
+  }
+  const performed = set.velocities.map((v) => {
+    const color = velocityZoneColor(v);
+    return { color, pulse: true, pulseColor: PULSE_RANGE[color] };
+  });
+  const remaining = Math.max(0, set.planned - set.velocities.length);
+  return [...performed, ...Array.from({ length: remaining }, () => ({ color: TODO_COLOR }))];
+}
+function setBarSegmentTestID(seg) {
+  if (seg.pulse) return "set-strip-pulse";
+  if (seg.color === SET_STRIP_VARIABLE_COLOR) return "set-strip-variable";
+  return seg.color === TODO_COLOR ? "set-strip-empty" : "set-strip-fill";
+}
+function SetBar({ set, height = 8 }) {
+  return /* @__PURE__ */ jsx(
+    SegmentedBar,
+    {
+      segments: setSegments(set),
+      height,
+      gap: 0,
+      radius: 0,
+      segmentTestID: setBarSegmentTestID,
+      style: { flex: 1, minWidth: 0, borderRadius: 2, overflow: "hidden" },
+      testID: "set-strip-set"
+    }
+  );
+}
+var SET_STRIP_GAP = 5;
+function setCategory(set) {
+  switch (set.status) {
+    case "done":
+    case "drop":
+    case "myo":
+      return "done";
+    case "active":
+      return "active";
+    case "range":
+      return set.doneVels.length > 0 ? "active" : "upcoming";
+    case "todo":
+    case "myo-upcoming":
+      return "upcoming";
+  }
+}
+function describeSets(sets) {
+  const done = sets.filter((s) => setCategory(s) === "done").length;
+  const active = sets.filter((s) => setCategory(s) === "active").length;
+  const upcoming = sets.filter((s) => setCategory(s) === "upcoming").length;
+  return `Set progress: ${done} done, ${active} in progress, ${upcoming} upcoming`;
+}
+function SetStrip({ sets, height = 8, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      className,
+      style: { flexDirection: "row", width: "100%", height, gap: SET_STRIP_GAP },
+      accessibilityRole: "image",
+      accessibilityLabel: describeSets(sets),
+      testID: "set-strip",
+      ...props,
+      children: sets.map((set, i) => /* @__PURE__ */ jsx(SetBar, { set, height }, i))
+    }
+  );
+}
 var t9 = getSemanticColors("dark");
 var INDICATOR_CONFIG = {
   imbalance: { Icon: ScaleIcon, color: t9["status-error"], label: "Left/right imbalance" },
@@ -10812,7 +11267,9 @@ function CollapsedCard({
                 {
                   velocities,
                   zones: velocityZones,
-                  variant: "mini",
+                  variant: "compact",
+                  height: 8,
+                  hideBaseline: true,
                   testID: `exercise-card-velocity-strip-${i}`
                 },
                 i
@@ -11111,6 +11568,7 @@ function SessionRail({
   next,
   stripHeight = 8,
   width = DEFAULT_WIDTH,
+  expandedIndex,
   onExercisePress,
   className,
   style,
@@ -11151,7 +11609,24 @@ function SessionRail({
                   borderBottomWidth: i < exercises.length - 1 ? 1 : 0,
                   borderBottomColor: DIVIDER
                 },
-                children: /* @__PURE__ */ jsx(
+                children: i === expandedIndex && ex.sets ? /* @__PURE__ */ jsx(
+                  ExerciseCard,
+                  {
+                    name: ex.name,
+                    expanded: true,
+                    summary: {
+                      sets: ex.summary.sets,
+                      reps: ex.summary.reps,
+                      // ExerciseCard's summary takes a numeric load; a string load is
+                      // an unset/discovery weight, which has no expanded form yet.
+                      weight: typeof ex.summary.weight === "number" ? ex.summary.weight : 0,
+                      unit: ex.summary.unit
+                    },
+                    tempo: ex.tempo,
+                    sets: ex.sets,
+                    onExpandedChange: () => onExercisePress?.(ex, i)
+                  }
+                ) : /* @__PURE__ */ jsx(
                   ExerciseCardHeading,
                   {
                     name: ex.name,
@@ -12497,8 +12972,8 @@ var ERROR_PILL_BORDER = "rgba(209,67,67,0.20)";
 var PLOT_LEFT = 26;
 var TOOLTIP_WIDTH = 124;
 function timeOf(dateStr) {
-  const t17 = Date.parse(dateStr);
-  return Number.isNaN(t17) ? 0 : t17;
+  const t26 = Date.parse(dateStr);
+  return Number.isNaN(t26) ? 0 : t26;
 }
 function formatValue(value) {
   return `${Math.round(value)}`;
@@ -13033,8 +13508,8 @@ function interpEdge(pixels, x, key) {
     const a = pixels[i];
     const b = pixels[i + 1];
     if (x >= a.x && x <= b.x) {
-      const t17 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
-      return a[key] + t17 * (b[key] - a[key]);
+      const t26 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
+      return a[key] + t26 * (b[key] - a[key]);
     }
   }
   return pixels[pixels.length - 1][key];
@@ -13640,14 +14115,14 @@ function FatigueMeter({
   className,
   ...props
 }) {
-  const [t1, t22, t32] = thresholds;
+  const [t1, t26, t32] = thresholds;
   const zones = [
     { upTo: t1, color: zoneColors[0] },
-    { upTo: t22, color: zoneColors[1] },
+    { upTo: t26, color: zoneColors[1] },
     { upTo: t32, color: zoneColors[2] },
     { upTo: max, color: zoneColors[3] }
   ];
-  const tickValues = [0, t1, t22, t32, max];
+  const tickValues = [0, t1, t26, t32, max];
   const ticks = tickValues.map((v, i) => ({ value: v, label: labels[i] }));
   return /* @__PURE__ */ jsx(
     ZoneTrack,
@@ -13695,196 +14170,1095 @@ function zoneForSets(sets, { mev, mav, mrv }) {
   const midpoint = (mav + mrv) / 2;
   return sets < midpoint ? "productive" : "approaching";
 }
-function VolumeLandmarkBar({
-  muscle,
-  currentSets,
-  landmarks,
-  width = 220,
-  trackHeight = 10,
-  scaleMax,
-  className,
-  style,
-  ...props
-}) {
-  const { mev, mav, mrv } = landmarks;
-  const max = scaleMax ?? mrv * 1.2;
-  const zone = zoneForSets(currentSets, landmarks);
-  const fillColor = HEAT_BY_ZONE[zone];
-  const pct2 = mav > 0 ? Math.round(currentSets / mav * 100) : 0;
+function VolumeLandmarkBar({
+  muscle,
+  currentSets,
+  landmarks,
+  width = 220,
+  trackHeight = 10,
+  scaleMax,
+  className,
+  style,
+  ...props
+}) {
+  const { mev, mav, mrv } = landmarks;
+  const max = scaleMax ?? mrv * 1.2;
+  const zone = zoneForSets(currentSets, landmarks);
+  const fillColor = HEAT_BY_ZONE[zone];
+  const pct2 = mav > 0 ? Math.round(currentSets / mav * 100) : 0;
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ width, gap: 3 }, style],
+      testID: "volume-landmark-bar",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          DataRow,
+          {
+            label: muscle,
+            value: /* @__PURE__ */ jsxs(
+              Text,
+              {
+                testID: "volume-landmark-pct",
+                style: { fontSize: 14, fontWeight: "700", fontFamily: MONO2, color: fillColor },
+                children: [
+                  pct2,
+                  "%"
+                ]
+              }
+            ),
+            className: "py-0",
+            testID: "volume-landmark-header"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ZoneTrack,
+          {
+            zones: [{ upTo: max, color: NEUTRAL_TRACK }],
+            max,
+            marker: {
+              type: "fill",
+              value: currentSets,
+              color: fillColor,
+              // Glow when in the optimal productive band — the "sweet spot" cue.
+              glow: zone === "productive"
+            },
+            trackColor: NEUTRAL_TRACK,
+            trackHeight,
+            ticks: [
+              { value: mev, label: "MEV", tooltip: `${LANDMARK_NAME.MEV} \xB7 ${mev} sets/wk` },
+              {
+                value: mav,
+                label: "MAV",
+                emphasized: true,
+                tooltip: `${LANDMARK_NAME.MAV} (target) \xB7 ${mav} sets/wk`
+              },
+              { value: mrv, label: "MRV", tooltip: `${LANDMARK_NAME.MRV} \xB7 ${mrv} sets/wk` }
+            ],
+            accessibilityLabel: `${muscle} weekly volume: ${currentSets} sets, ${pct2}% of MAV target, ${ZONE_DESCRIPTION[zone]}`,
+            testID: "volume-landmark-track"
+          }
+        )
+      ]
+    }
+  );
+}
+var t15 = getSemanticColors("dark");
+var statusToken = {
+  productive: "status-success",
+  threshold: "status-warning",
+  stop: "status-error"
+};
+var statusDotVariant = {
+  productive: "success",
+  threshold: "warning",
+  stop: "error"
+};
+var defaultLabel = {
+  productive: "Productive",
+  threshold: "Threshold",
+  stop: "Stop"
+};
+function statusPillColor(status) {
+  return t15[statusToken[status]];
+}
+function StatusPill2({ status, label, className, style, ...props }) {
+  const color = statusPillColor(status);
+  const text = label ?? defaultLabel[status];
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      testID: "status-pill",
+      className,
+      style: [
+        {
+          flexDirection: "row",
+          alignItems: "center",
+          gap: 7,
+          alignSelf: "flex-start",
+          paddingVertical: 7,
+          paddingHorizontal: 13,
+          borderRadius: 9,
+          backgroundColor: alpha(color, 0.14),
+          borderWidth: 1,
+          borderColor: alpha(color, 0.4)
+        },
+        style
+      ],
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, children: /* @__PURE__ */ jsx(StatusDot, { variant: statusDotVariant[status], glow: true }) }),
+        /* @__PURE__ */ jsx(Text, { testID: "status-pill-label", style: { fontSize: 13, fontWeight: "800", color }, children: text })
+      ]
+    }
+  );
+}
+var t16 = getSemanticColors("dark");
+var categoryToken = {
+  productive: null,
+  threshold: "status-warning",
+  stop: "status-error"
+};
+var floodOpacity = {
+  productive: 0,
+  threshold: 0.12,
+  stop: 0.18
+};
+function liveAuraColor(category) {
+  const token = categoryToken[category];
+  return token ? t16[token] : null;
+}
+function LiveAuraFrame({
+  category,
+  pulse = true,
+  className,
+  children,
+  style,
+  ...props
+}) {
+  const color = liveAuraColor(category);
+  const tint = color ? alpha(color, floodOpacity[category]) : "transparent";
+  const floodStyle = {
+    ...StyleSheet.absoluteFillObject,
+    ...Platform.OS === "web" ? (
+      // backgroundImage is a runtime RNW style, not in RN ViewStyle types.
+      { backgroundImage: `radial-gradient(130% 95% at 50% 0%, ${tint}, transparent 62%)` }
+    ) : { backgroundColor: tint }
+  };
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      testID: "live-aura-frame",
+      className,
+      style: [
+        {
+          position: "relative",
+          overflow: "hidden",
+          borderRadius: 10,
+          backgroundColor: t16["background-base"],
+          borderWidth: 1,
+          borderColor: t16["border-default"]
+        },
+        style
+      ],
+      ...props,
+      children: [
+        color && /* @__PURE__ */ jsx(
+          View,
+          {
+            testID: "live-aura-flood",
+            accessibilityElementsHidden: true,
+            pointerEvents: "none",
+            className: category === "stop" && pulse ? "animate-pulse" : void 0,
+            style: floodStyle
+          }
+        ),
+        children
+      ]
+    }
+  );
+}
+function VelocityHero({
+  velocities,
+  targetReps,
+  liveRepIndex,
+  width,
+  height = 300
+}) {
+  return /* @__PURE__ */ jsx(View, { testID: "velocity-hero", style: width != null ? { width, height } : { flex: 1, height }, children: /* @__PURE__ */ jsx(
+    VelocityStrip,
+    {
+      variant: "hero",
+      velocities,
+      liveRepIndex: liveRepIndex ?? velocities.length - 1,
+      targetReps,
+      height,
+      scale: "peak"
+    }
+  ) });
+}
+
+// src/components/custom/Fatigue/fatigue-tokens.ts
+var t17 = getSemanticColors("dark");
+var FONT_HEAD = '"Space Grotesk", sans-serif';
+var FONT_UI = '"Nunito Sans", sans-serif';
+var FONT_MONO = "monospace";
+var TONE_COLOR = {
+  ok: t17["status-success"],
+  warn: t17["status-warning"],
+  alarm: t17["status-error"]
+};
+var STATE_LABEL = {
+  good: "Good",
+  slowing: "Slowing",
+  grinding: "Grinding",
+  "form-breakdown": "Form breaking down"
+};
+var PHASE_AXIS_COLOR = {
+  eccentric: primitiveRamps.magenta[800],
+  concentric: primitiveRamps.cyan[800],
+  hold: primitiveColors.charcoal[100],
+  idle: primitiveColors.charcoal[200]
+};
+var PHASE_AXIS_BASE_COLOR = {
+  eccentric: primitiveRamps.magenta[950],
+  concentric: primitiveRamps.cyan[950],
+  hold: primitiveColors.charcoal[300],
+  idle: primitiveColors.charcoal[200]
+};
+var PACING_TONE = {
+  ahead: primitiveRamps.amber[300],
+  onPace: primitiveRamps.green[300],
+  over: primitiveRamps.red[300]
+};
+var SILVER = primitiveColors.neutral[300];
+var RED_LIGHT = primitiveRamps.red[400];
+var RED_MID = primitiveRamps.red[600];
+var RED_DEEP = primitiveRamps.red[800];
+var GRIND_THRESHOLD = 0.35;
+var DRIFT_GREY = primitiveColors.neutral[600];
+function clamp012(v) {
+  return Math.min(1, Math.max(0, v));
+}
+function hexToRgb2(hex) {
+  const h = hex.replace("#", "");
+  const f = h.length === 3 ? h.split("").map((c) => c + c).join("") : h;
+  return [parseInt(f.slice(0, 2), 16), parseInt(f.slice(2, 4), 16), parseInt(f.slice(4, 6), 16)];
+}
+function mixHex2(a, b, ratio) {
+  const [ar, ag, ab] = hexToRgb2(a);
+  const [br, bg, bb] = hexToRgb2(b);
+  const m = (x, y) => Math.round(x + (y - x) * clamp012(ratio));
+  return `#${[m(ar, br), m(ag, bg), m(ab, bb)].map((v) => v.toString(16).padStart(2, "0")).join("")}`;
+}
+function ghostLineColor(tempoDeviation, grindSignature) {
+  if (grindSignature >= GRIND_THRESHOLD) {
+    const severity = clamp012((grindSignature - GRIND_THRESHOLD) / (1 - GRIND_THRESHOLD));
+    return severity < 0.5 ? mixHex2(RED_LIGHT, RED_MID, severity * 2) : mixHex2(RED_MID, RED_DEEP, (severity - 0.5) * 2);
+  }
+  return mixHex2(SILVER, DRIFT_GREY, (tempoDeviation ?? 0) * 0.55);
+}
+function auraForVerdict(state) {
+  if (state == null || state === "good") return "productive";
+  if (state === "form-breakdown") return "stop";
+  return "threshold";
+}
+
+// src/components/custom/Fatigue/VerdictHero.tsx
+var t18 = getSemanticColors("dark");
+function formatRpe(rpe) {
+  if (rpe == null) return "\u2014";
+  return (Math.round(rpe * 2) / 2).toFixed(1);
+}
+function VerdictHero({ rpe, verdict }) {
+  const tone = verdict ? TONE_COLOR[verdict.tone] : t18["text-tertiary"];
+  const word = verdict ? STATE_LABEL[verdict.state] : "Warming up";
+  return /* @__PURE__ */ jsxs(View, { style: { gap: 6 }, testID: "verdict-hero", children: [
+    /* @__PURE__ */ jsx(
+      Text,
+      {
+        style: {
+          fontSize: 9,
+          letterSpacing: 1.5,
+          fontFamily: FONT_MONO,
+          color: t18["text-tertiary"]
+        },
+        children: "FATIGUE"
+      }
+    ),
+    /* @__PURE__ */ jsxs(View, { style: { gap: 2 }, children: [
+      /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", alignItems: "flex-end", gap: 7 }, children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontSize: 62,
+              fontWeight: "900",
+              fontFamily: FONT_HEAD,
+              color: tone,
+              lineHeight: 60
+            },
+            accessibilityLabel: `RPE ${formatRpe(rpe)}`,
+            children: formatRpe(rpe)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontSize: 18,
+              fontWeight: "800",
+              color: tone,
+              marginBottom: 9,
+              fontFamily: FONT_HEAD
+            },
+            children: "RPE"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(Text, { style: { fontSize: 17, fontWeight: "800", fontFamily: FONT_HEAD, color: tone }, children: word })
+    ] })
+  ] });
+}
+var t19 = getSemanticColors("dark");
+var TONE_VARIANT = {
+  ok: "success",
+  warn: "warning",
+  alarm: "error"
+};
+var TONE_WORD = { ok: "ok", warn: "watch", alarm: "alarm" };
+function Light({
+  label,
+  tone,
+  detail
+}) {
+  const variant = tone ? TONE_VARIANT[tone] : "neutral";
+  const word = tone ? TONE_WORD[tone] : "warming up";
+  return /* @__PURE__ */ jsx(Tooltip, { label: `${detail} \xB7 ${word}`, placement: "bottom", children: /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessibilityLabel: `${detail}, ${word}`,
+      style: { flexDirection: "row", alignItems: "center", gap: 5 },
+      children: [
+        /* @__PURE__ */ jsx(StatusDot, { variant, size: "sm", glow: true }),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontSize: 9,
+              letterSpacing: 0.6,
+              fontFamily: FONT_MONO,
+              color: t19["text-secondary"]
+            },
+            children: label
+          }
+        )
+      ]
+    }
+  ) });
+}
+function FatigueLights({ dimensions, spread = false }) {
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      testID: "fatigue-lights",
+      style: {
+        flexDirection: "row",
+        gap: spread ? 0 : 16,
+        alignItems: "center",
+        justifyContent: spread ? "space-between" : "flex-start"
+      },
+      children: [
+        /* @__PURE__ */ jsx(Light, { label: "VEL", tone: dimensions?.velocityLoss ?? null, detail: "Velocity loss" }),
+        /* @__PURE__ */ jsx(Light, { label: "ROM", tone: dimensions?.rom ?? null, detail: "ROM depth" }),
+        /* @__PURE__ */ jsx(Light, { label: "TEMPO", tone: dimensions?.tempo ?? null, detail: "Tempo" })
+      ]
+    }
+  );
+}
+function barColor(romM, working, short) {
+  if (short != null && romM < short) return RED_DEEP;
+  if (working != null && romM < working) return RED_LIGHT;
+  return SILVER;
+}
+function romReferenceOverlay(g, workingStandardM, shortThresholdM) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    shortThresholdM != null && /* @__PURE__ */ jsx(
+      View,
+      {
+        pointerEvents: "none",
+        style: {
+          position: "absolute",
+          left: 0,
+          right: 0,
+          bottom: 0,
+          height: g.yOf(shortThresholdM),
+          backgroundColor: alpha(RED_DEEP, 0.06)
+        }
+      }
+    ),
+    workingStandardM != null && /* @__PURE__ */ jsx(
+      View,
+      {
+        pointerEvents: "none",
+        style: {
+          position: "absolute",
+          left: 0,
+          right: 0,
+          bottom: g.yOf(workingStandardM),
+          borderTopWidth: 1,
+          borderStyle: "dashed",
+          borderColor: alpha(SILVER, 0.4)
+        }
+      }
+    ),
+    shortThresholdM != null && /* @__PURE__ */ jsx(
+      View,
+      {
+        pointerEvents: "none",
+        style: {
+          position: "absolute",
+          left: 0,
+          right: 0,
+          bottom: g.yOf(shortThresholdM),
+          borderTopWidth: 1,
+          borderStyle: "dashed",
+          borderColor: alpha(RED_DEEP, 0.4)
+        }
+      }
+    )
+  ] });
+}
+function RomProgressionChart({
+  points,
+  workingStandardM,
+  shortThresholdM,
+  barHeight = 44,
+  maxReps = 12,
+  plannedReps: plannedReps2
+}) {
+  const shown = points.slice(-maxReps);
+  const slots = shown.map((p) => ({ kind: "rep", value: p.romM }));
+  const scaleMax = Math.max(...shown.map((p) => p.romM), workingStandardM ?? 0, shortThresholdM ?? 0) || void 0;
+  return /* @__PURE__ */ jsx(View, { testID: "rom-progression", children: /* @__PURE__ */ jsx(
+    SetBarChart,
+    {
+      slots,
+      colorFor: (romM) => barColor(romM, workingStandardM, shortThresholdM),
+      height: barHeight,
+      scaleMax,
+      barRadius: 2,
+      hideBaseline: true,
+      targetReps: plannedReps2,
+      renderReference: (g) => romReferenceOverlay(g, workingStandardM, shortThresholdM),
+      testIDPrefix: "rom"
+    }
+  ) });
+}
+
+// src/components/custom/Fatigue/tempo-pacing.ts
+var t20 = getSemanticColors("dark");
+var ON_TARGET_MS2 = 100;
+function phaseFillFraction(elapsedMs, targetMs) {
+  if (targetMs == null || targetMs <= 0) return 1;
+  return Math.min(1, Math.max(0, elapsedMs / targetMs));
+}
+function pacingTone(elapsedMs, targetMs) {
+  if (targetMs == null || targetMs <= 0) return t20["text-primary"];
+  const remainingMs = targetMs - elapsedMs;
+  if (remainingMs > ON_TARGET_MS2) return PACING_TONE.ahead;
+  if (remainingMs >= -ON_TARGET_MS2) return PACING_TONE.onPace;
+  return PACING_TONE.over;
+}
+function prescribedSegments(tempo) {
+  if (tempo == null) return [];
+  const [ecc, pauseBottom, con, pauseTop] = tempo;
+  const order = [
+    ["eccentric", ecc],
+    ["hold", pauseBottom],
+    ["concentric", con],
+    ["hold", pauseTop]
+  ];
+  const out = [];
+  let t26 = 0;
+  for (const [phase, seconds] of order) {
+    const ms = seconds * 1e3;
+    if (ms > 0) out.push({ phase, startMs: t26, endMs: t26 + ms });
+    t26 += ms;
+  }
+  return out;
+}
+function phaseTargetsMs(phases, tempo) {
+  if (tempo == null) return phases.map(() => null);
+  const [eccS, pauseBottomS, conS, pauseTopS] = tempo;
+  let seenConcentric = false;
+  return phases.map((phase) => {
+    switch (phase) {
+      case "eccentric":
+        return eccS * 1e3;
+      case "concentric":
+        seenConcentric = true;
+        return conS * 1e3;
+      case "hold":
+        return (seenConcentric ? pauseTopS : pauseBottomS) * 1e3;
+      default:
+        return null;
+    }
+  });
+}
+
+// src/components/custom/Fatigue/GhostBand.tsx
+var t21 = getSemanticColors("dark");
+var BAND_H = 16;
+var BAND_GAP = 4;
+var PHASE_LABEL = {
+  eccentric: "ECC",
+  concentric: "CON"
+};
+var LABEL_CH_PX = 7;
+var LABEL_PAD_PX = 6;
+var WELL_SHADE = primitiveColors.black;
+var WELL_FLOOR_LIGHT = primitiveColors.white;
+function labelFits(label, segW) {
+  return segW >= label.length * LABEL_CH_PX + LABEL_PAD_PX;
+}
+function GhostBand({
+  segments,
+  x,
+  top,
+  height = BAND_H,
+  showLabels = false,
+  labelColor = t21["text-primary"],
+  targetTempoSeconds = null,
+  prescribed = false
+}) {
+  const rawId = useId();
+  const safeId = rawId.replace(/[^a-zA-Z0-9]/g, "");
+  const clipId = `ghost-band-${safeId}`;
+  const wellId = `ghost-band-well-${safeId}`;
+  const drawn = segments.filter((seg) => x(seg.endMs) - x(seg.startMs) > 0);
+  if (drawn.length === 0) return null;
+  const bandLeft = x(drawn[0].startMs);
+  const bandRight = x(drawn[drawn.length - 1].endMs);
+  const bandW = bandRight - bandLeft;
+  if (bandW <= 0) return null;
+  const pacing = targetTempoSeconds != null && !prescribed;
+  const targetsMs = phaseTargetsMs(
+    drawn.map((seg) => seg.phase),
+    targetTempoSeconds
+  );
+  const runs = drawn.map((seg, i) => {
+    const left = x(seg.startMs);
+    const right = i === drawn.length - 1 ? bandRight : x(drawn[i + 1].startMs);
+    const width = Math.max(0, right - left);
+    const targetMs = targetsMs[i];
+    const elapsedMs = seg.endMs - seg.startMs;
+    return {
+      phase: seg.phase,
+      left,
+      width,
+      // Prescribed → nothing performed, so nothing filled. No target at all → the run reads
+      // complete rather than perpetually empty.
+      fillWidth: prescribed ? 0 : pacing ? width * phaseFillFraction(elapsedMs, targetMs) : width,
+      labelTone: pacing ? pacingTone(elapsedMs, targetMs) : labelColor
+    };
+  });
+  return /* @__PURE__ */ jsxs("g", { children: [
+    /* @__PURE__ */ jsxs("defs", { children: [
+      /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { x: bandLeft, y: top, width: bandW, height, rx: 2 }) }),
+      /* @__PURE__ */ jsxs("linearGradient", { id: wellId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+        /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: WELL_SHADE, stopOpacity: 0.6 }),
+        /* @__PURE__ */ jsx("stop", { offset: "42%", stopColor: WELL_SHADE, stopOpacity: 0.12 }),
+        /* @__PURE__ */ jsx("stop", { offset: "88%", stopColor: WELL_SHADE, stopOpacity: 0.02 }),
+        /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: WELL_FLOOR_LIGHT, stopOpacity: 0.07 })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("g", { clipPath: `url(#${clipId})`, children: [
+      /* @__PURE__ */ jsx(
+        "rect",
+        {
+          x: bandLeft,
+          y: top,
+          width: bandW,
+          height,
+          fill: PHASE_AXIS_COLOR.idle,
+          "data-testid": "ghost-band-floor"
+        }
+      ),
+      runs.map((run, i) => /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: run.left,
+            y: top,
+            width: run.width,
+            height,
+            fill: PHASE_AXIS_BASE_COLOR[run.phase],
+            "data-testid": "ghost-band-base"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: run.left,
+            y: top,
+            width: run.width,
+            height,
+            fill: `url(#${wellId})`,
+            "data-testid": "ghost-band-well"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: run.left,
+            y: top,
+            width: run.fillWidth,
+            height,
+            fill: PHASE_AXIS_COLOR[run.phase],
+            "data-testid": "ghost-band-fill"
+          }
+        )
+      ] }, i)),
+      showLabels && runs.map((run, i) => {
+        const label = PHASE_LABEL[run.phase];
+        if (!label || !labelFits(label, run.width)) return null;
+        return /* @__PURE__ */ jsx(
+          "text",
+          {
+            x: run.left + run.width / 2,
+            y: top + height / 2,
+            textAnchor: "middle",
+            dominantBaseline: "central",
+            fill: run.labelTone,
+            fontSize: 8,
+            fontWeight: 800,
+            letterSpacing: 1,
+            fontFamily: FONT_UI,
+            children: label
+          },
+          i
+        );
+      })
+    ] })
+  ] });
+}
+var t22 = getSemanticColors("dark");
+var PARCH = t22["text-primary"];
+function smoothPath(pts) {
+  if (pts.length < 2) return pts.length ? `M ${pts[0][0]} ${pts[0][1]}` : "";
+  let d = `M ${pts[0][0].toFixed(1)} ${pts[0][1].toFixed(1)}`;
+  for (let i = 0; i < pts.length - 1; i++) {
+    const p0 = pts[i - 1] ?? pts[i];
+    const p1 = pts[i];
+    const p2 = pts[i + 1];
+    const p3 = pts[i + 2] ?? p2;
+    const c1x = p1[0] + (p2[0] - p0[0]) / 6;
+    const c1y = p1[1] + (p2[1] - p0[1]) / 6;
+    const c2x = p2[0] - (p3[0] - p1[0]) / 6;
+    const c2y = p2[1] - (p3[1] - p1[1]) / 6;
+    d += ` C ${c1x.toFixed(1)} ${c1y.toFixed(1)}, ${c2x.toFixed(1)} ${c2y.toFixed(1)}, ${p2[0].toFixed(1)} ${p2[1].toFixed(1)}`;
+  }
+  return d;
+}
+var BLUR_STD_DEV = 2.6;
+function GhostBloom({
+  current,
+  ghosts = [],
+  tint,
+  baseline,
+  orientation = "up",
+  ghostStroke = (i) => alpha(PARCH, 0.1 + i * 0.015),
+  lineWidth = 3.5
+}) {
+  const rawId = useId();
+  const blurId = `bloom-blur-${rawId.replace(/[^a-zA-Z0-9]/g, "")}`;
+  const toY = (mag) => orientation === "down" ? baseline + mag : baseline - mag;
+  const toAbs = (pts) => pts.map(([px, mag]) => [px, toY(mag)]);
+  const curD = smoothPath(toAbs(current));
+  const ghostDs = ghosts.map((g) => smoothPath(toAbs(g)));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("filter", { id: blurId, x: "-50%", y: "-50%", width: "200%", height: "200%", children: /* @__PURE__ */ jsx("feGaussianBlur", { stdDeviation: BLUR_STD_DEV }) }) }),
+    ghostDs.map((d, i) => /* @__PURE__ */ jsx(
+      "path",
+      {
+        d,
+        fill: "none",
+        stroke: ghostStroke(i),
+        strokeWidth: 1.5,
+        strokeLinejoin: "round"
+      },
+      i
+    )),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: curD,
+        fill: "none",
+        stroke: alpha(primitiveColors.black, 0.3),
+        strokeWidth: lineWidth + 3,
+        strokeLinejoin: "round",
+        strokeLinecap: "round",
+        filter: `url(#${blurId})`
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: curD,
+        fill: "none",
+        stroke: tint,
+        strokeWidth: lineWidth,
+        strokeLinejoin: "round",
+        strokeLinecap: "round"
+      }
+    )
+  ] });
+}
+
+// src/components/custom/Fatigue/GhostSpark.tsx
+function GhostSpark({
+  curves,
+  width,
+  height = 172,
+  targetTempoSeconds = null
+}) {
+  const w = width;
+  const h = height;
+  const padL = 12;
+  const padR = 8;
+  const padTop = 10;
+  const padBot = 6;
+  if (curves.length === 0) {
+    const prescribed = prescribedSegments(targetTempoSeconds);
+    if (prescribed.length === 0) {
+      return /* @__PURE__ */ jsx(View, { testID: "ghost-spark", style: { width: w, height: h } });
+    }
+    const totalMs = prescribed[prescribed.length - 1].endMs;
+    const bandTopEmpty = h - padBot - BAND_H;
+    const xEmpty = (ms) => padL + ms / (totalMs * 1.04) * (w - padL - padR);
+    return /* @__PURE__ */ jsx(View, { testID: "ghost-spark", style: { paddingHorizontal: 4 }, children: /* @__PURE__ */ jsx("svg", { width: w, height: h, children: /* @__PURE__ */ jsx(
+      GhostBand,
+      {
+        segments: prescribed,
+        x: xEmpty,
+        top: bandTopEmpty,
+        showLabels: true,
+        targetTempoSeconds,
+        prescribed: true
+      }
+    ) }) });
+  }
+  const cur = curves[curves.length - 1];
+  const allSamples = curves.flatMap((c) => c.samples);
+  const vmax = Math.max(0.01, ...allSamples.map((s) => s.velocityMps)) * 1.06;
+  const axisMaxT = Math.max(1, ...curves.map((c) => c.samples[c.samples.length - 1]?.tMs ?? 0)) * 1.04;
+  const bandBottom = h - padBot;
+  const bandTop = bandBottom - BAND_H;
+  const baseline = bandTop - BAND_GAP;
+  const plotH = Math.max(1, baseline - padTop);
+  const x = (ms) => padL + ms / axisMaxT * (w - padL - padR);
+  const mag = (v) => clamp012(v / vmax) * plotH;
+  const lineTint = ghostLineColor(cur.tempoDeviation, cur.grindSignature);
+  const curPts = cur.samples.map((s) => [x(s.tMs), mag(s.velocityMps)]);
+  const ghostPts = curves.slice(0, -1).map((c) => c.samples.map((s) => [x(s.tMs), mag(s.velocityMps)]));
+  return /* @__PURE__ */ jsx(View, { testID: "ghost-spark", style: { paddingHorizontal: 4 }, children: /* @__PURE__ */ jsxs("svg", { width: w, height: h, children: [
+    /* @__PURE__ */ jsx(
+      GhostBloom,
+      {
+        current: curPts,
+        ghosts: ghostPts,
+        tint: lineTint,
+        baseline,
+        orientation: "up"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      GhostBand,
+      {
+        segments: cur.phaseSegments,
+        x,
+        top: bandTop,
+        showLabels: true,
+        targetTempoSeconds
+      }
+    )
+  ] }) });
+}
+
+// src/components/custom/Fatigue/LiveFatigueCard.tsx
+var t23 = getSemanticColors("dark");
+var PAD = 18;
+var GHOST_GUTTER = 4;
+function LiveFatigueCard({ model, width = 318, height }) {
+  const chartW = width - PAD * 2 - GHOST_GUTTER * 2;
+  const chartH = height != null ? Math.round(Math.min(240, Math.max(168, height * 0.4))) : 172;
   return /* @__PURE__ */ jsxs(
-    View,
+    Surface,
     {
-      className,
-      style: [{ width, gap: 3 }, style],
-      testID: "volume-landmark-bar",
-      ...props,
+      level: "base",
+      testID: "live-fatigue-card",
+      style: {
+        width,
+        height,
+        borderRadius: 14,
+        padding: PAD,
+        borderWidth: 1,
+        borderColor: t23["hairline-default"],
+        ...barPaper(t23["surface-base"])
+      },
       children: [
+        /* @__PURE__ */ jsxs(View, { style: { gap: 12 }, children: [
+          /* @__PURE__ */ jsx(VerdictHero, { rpe: model.rpe, verdict: model.verdict }),
+          /* @__PURE__ */ jsx(FatigueLights, { dimensions: model.verdict?.dimensions ?? null })
+        ] }),
+        /* @__PURE__ */ jsx(View, { style: { flex: 1, minHeight: 16 } }),
         /* @__PURE__ */ jsx(
-          DataRow,
+          RomProgressionChart,
           {
-            label: muscle,
-            value: /* @__PURE__ */ jsxs(
-              Text,
-              {
-                testID: "volume-landmark-pct",
-                style: { fontSize: 14, fontWeight: "700", fontFamily: MONO2, color: fillColor },
-                children: [
-                  pct2,
-                  "%"
-                ]
-              }
-            ),
-            className: "py-0",
-            testID: "volume-landmark-header"
+            points: model.romProgression,
+            workingStandardM: model.romWorkingStandardM,
+            shortThresholdM: model.romShortThresholdM,
+            plannedReps: model.plannedReps
           }
         ),
+        /* @__PURE__ */ jsx(View, { style: { flex: 1, minHeight: 16 } }),
         /* @__PURE__ */ jsx(
-          ZoneTrack,
+          GhostSpark,
           {
-            zones: [{ upTo: max, color: NEUTRAL_TRACK }],
-            max,
-            marker: {
-              type: "fill",
-              value: currentSets,
-              color: fillColor,
-              // Glow when in the optimal productive band — the "sweet spot" cue.
-              glow: zone === "productive"
-            },
-            trackColor: NEUTRAL_TRACK,
-            trackHeight,
-            ticks: [
-              { value: mev, label: "MEV", tooltip: `${LANDMARK_NAME.MEV} \xB7 ${mev} sets/wk` },
-              {
-                value: mav,
-                label: "MAV",
-                emphasized: true,
-                tooltip: `${LANDMARK_NAME.MAV} (target) \xB7 ${mav} sets/wk`
-              },
-              { value: mrv, label: "MRV", tooltip: `${LANDMARK_NAME.MRV} \xB7 ${mrv} sets/wk` }
-            ],
-            accessibilityLabel: `${muscle} weekly volume: ${currentSets} sets, ${pct2}% of MAV target, ${ZONE_DESCRIPTION[zone]}`,
-            testID: "volume-landmark-track"
+            curves: model.velocityCurves,
+            width: chartW,
+            height: chartH,
+            targetTempoSeconds: model.targetTempoSeconds
           }
         )
       ]
     }
   );
 }
-var t15 = getSemanticColors("dark");
-var statusToken = {
-  productive: "status-success",
-  threshold: "status-warning",
-  stop: "status-error"
-};
-var statusDotVariant = {
-  productive: "success",
-  threshold: "warning",
-  stop: "error"
-};
-var defaultLabel = {
-  productive: "Productive",
-  threshold: "Threshold",
-  stop: "Stop"
-};
-function statusPillColor(status) {
-  return t15[statusToken[status]];
-}
-function StatusPill2({ status, label, className, style, ...props }) {
-  const color = statusPillColor(status);
-  const text = label ?? defaultLabel[status];
+
+// src/components/custom/Fatigue/LiveFatiguePanel.tsx
+var t24 = getSemanticColors("dark");
+function ExerciseHeaderLite({ header }) {
   return /* @__PURE__ */ jsxs(
     View,
     {
-      testID: "status-pill",
-      className,
-      style: [
-        {
-          flexDirection: "row",
-          alignItems: "center",
-          gap: 7,
-          alignSelf: "flex-start",
-          paddingVertical: 7,
-          paddingHorizontal: 13,
-          borderRadius: 9,
-          backgroundColor: alpha(color, 0.14),
-          borderWidth: 1,
-          borderColor: alpha(color, 0.4)
-        },
-        style
-      ],
-      ...props,
+      style: {
+        flexDirection: "row",
+        alignItems: "flex-end",
+        justifyContent: "space-between",
+        paddingHorizontal: 24,
+        paddingTop: 18,
+        paddingBottom: 14,
+        borderBottomWidth: 1,
+        borderColor: alpha(t24["text-primary"], 0.08)
+      },
       children: [
-        /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, children: /* @__PURE__ */ jsx(StatusDot, { variant: statusDotVariant[status], glow: true }) }),
-        /* @__PURE__ */ jsx(Text, { testID: "status-pill-label", style: { fontSize: 13, fontWeight: "800", color }, children: text })
+        /* @__PURE__ */ jsxs(View, { style: { gap: 2 }, children: [
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              style: {
+                fontSize: 28,
+                fontWeight: "700",
+                fontFamily: FONT_HEAD,
+                color: t24["text-primary"]
+              },
+              children: header.title
+            }
+          ),
+          header.subtitle && /* @__PURE__ */ jsx(
+            Text,
+            {
+              style: {
+                fontSize: 13,
+                fontWeight: "600",
+                fontFamily: FONT_UI,
+                color: t24["text-secondary"]
+              },
+              children: header.subtitle
+            }
+          )
+        ] }),
+        header.meta && /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontSize: 13,
+              fontWeight: "800",
+              fontFamily: FONT_MONO,
+              color: t24["text-tertiary"]
+            },
+            children: header.meta
+          }
+        )
       ]
     }
   );
 }
-var t16 = getSemanticColors("dark");
-var categoryToken = {
-  productive: null,
-  threshold: "status-warning",
-  stop: "status-error"
-};
-var floodOpacity = {
-  productive: 0,
-  threshold: 0.12,
-  stop: 0.18
-};
-function liveAuraColor(category) {
-  const token = categoryToken[category];
-  return token ? t16[token] : null;
-}
-function LiveAuraFrame({
-  category,
-  pulse = true,
-  className,
-  children,
-  style,
-  ...props
+function LiveFatiguePanel({
+  model,
+  velocity,
+  header,
+  aura,
+  bodyHeight = 508,
+  cardWidth = 318
 }) {
-  const color = liveAuraColor(category);
-  const tint = color ? alpha(color, floodOpacity[category]) : "transparent";
-  const floodStyle = {
-    ...StyleSheet.absoluteFillObject,
-    ...Platform.OS === "web" ? (
-      // backgroundImage is a runtime RNW style, not in RN ViewStyle types.
-      { backgroundImage: `radial-gradient(130% 95% at 50% 0%, ${tint}, transparent 62%)` }
-    ) : { backgroundColor: tint }
-  };
-  return /* @__PURE__ */ jsxs(
-    View,
-    {
-      testID: "live-aura-frame",
-      className,
-      style: [
-        {
-          position: "relative",
-          overflow: "hidden",
-          borderRadius: 10,
-          backgroundColor: t16["background-base"],
-          borderWidth: 1,
-          borderColor: t16["border-default"]
-        },
-        style
-      ],
-      ...props,
-      children: [
-        color && /* @__PURE__ */ jsx(
-          View,
-          {
-            testID: "live-aura-flood",
-            accessibilityElementsHidden: true,
-            pointerEvents: "none",
-            className: category === "stop" && pulse ? "animate-pulse" : void 0,
-            style: floodStyle
-          }
-        ),
-        children
-      ]
+  const category = aura ?? auraForVerdict(model.verdict?.state ?? null);
+  const heroH = bodyHeight - 26;
+  return /* @__PURE__ */ jsx(
+    LiveAuraFrame,
+    {
+      category,
+      style: { borderRadius: 0, borderWidth: 0 },
+      testID: "live-fatigue-panel",
+      children: /* @__PURE__ */ jsxs(View, { style: { flex: 1 }, children: [
+        header && /* @__PURE__ */ jsx(ExerciseHeaderLite, { header }),
+        /* @__PURE__ */ jsxs(View, { style: { padding: 24, flexDirection: "row", gap: 18, alignItems: "stretch" }, children: [
+          /* @__PURE__ */ jsxs(View, { style: { flex: 1, gap: 8 }, children: [
+            /* @__PURE__ */ jsx(
+              Text,
+              {
+                style: {
+                  fontSize: 9,
+                  letterSpacing: 1.2,
+                  fontFamily: FONT_MONO,
+                  color: t24["text-tertiary"]
+                },
+                children: "VELOCITY \xB7 this set"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              VelocityHero,
+              {
+                velocities: velocity.velocities,
+                targetReps: velocity.targetReps,
+                liveRepIndex: velocity.liveRepIndex,
+                height: heroH
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(LiveFatigueCard, { model, width: cardWidth, height: bodyHeight })
+        ] })
+      ] })
     }
   );
 }
+var t25 = getSemanticColors("dark");
+function phaseAt(segments, ms) {
+  const hit = segments.find((s) => ms >= s.startMs && ms < s.endMs);
+  return hit ? hit.phase : null;
+}
+function mergePhaseSegments(a, b) {
+  if (a.length === 0) return b;
+  if (b.length === 0) return a;
+  const bounds = Array.from(new Set([...a, ...b].flatMap((s) => [s.startMs, s.endMs]))).sort(
+    (p, q) => p - q
+  );
+  const out = [];
+  for (let i = 0; i < bounds.length - 1; i++) {
+    const startMs = bounds[i];
+    const endMs = bounds[i + 1];
+    if (endMs <= startMs) continue;
+    const mid = (startMs + endMs) / 2;
+    const pa = phaseAt(a, mid);
+    const pb = phaseAt(b, mid);
+    const phase = pa == null ? pb ?? "idle" : pb == null ? pa : pa === pb ? pa : "idle";
+    const last = out[out.length - 1];
+    if (last && last.phase === phase && last.endMs === startMs) last.endMs = endMs;
+    else out.push({ phase, startMs, endMs });
+  }
+  return out;
+}
+function lastTMs(curves) {
+  return Math.max(0, ...curves.map((c) => c.samples[c.samples.length - 1]?.tMs ?? 0));
+}
+function DualGhostSpark({
+  left,
+  right,
+  width,
+  height = 232,
+  leftLabel = "LEFT",
+  rightLabel = "RIGHT",
+  showDeviceLabels = true,
+  targetTempoSeconds = null
+}) {
+  const w = width;
+  const h = height;
+  const padL = 14;
+  const padR = 14;
+  const padTop = 22;
+  const padBot = 22;
+  if (left.length === 0 && right.length === 0) {
+    return /* @__PURE__ */ jsx(View, { testID: "dual-ghost-spark", style: { width: w, height: h } });
+  }
+  const mid = padTop + (h - padTop - padBot) / 2;
+  const bandTop = mid - BAND_H / 2;
+  const baseUp = bandTop - BAND_GAP;
+  const baseDown = mid + BAND_H / 2 + BAND_GAP;
+  const wingH = Math.max(1, Math.min(baseUp - padTop, h - padBot - baseDown));
+  const allSamples = [...left, ...right].flatMap((c) => c.samples);
+  const vmax = Math.max(0.01, ...allSamples.map((s) => s.velocityMps)) * 1.06;
+  const axisMaxT = Math.max(1, lastTMs(left), lastTMs(right)) * 1.04;
+  const x = (ms) => padL + ms / axisMaxT * (w - padL - padR);
+  const mag = (v) => clamp012(v / vmax) * wingH;
+  const toPts = (c) => c.samples.map((s) => [x(s.tMs), mag(s.velocityMps)]);
+  const wing = (curves) => {
+    const cur = curves[curves.length - 1];
+    return {
+      cur,
+      current: cur ? toPts(cur) : [],
+      ghosts: curves.slice(0, -1).map(toPts),
+      tint: cur ? ghostLineColor(cur.tempoDeviation, cur.grindSignature) : t25["text-tertiary"]
+    };
+  };
+  const up = wing(left);
+  const down = wing(right);
+  const segments = mergePhaseSegments(up.cur?.phaseSegments ?? [], down.cur?.phaseSegments ?? []);
+  return /* @__PURE__ */ jsx(View, { testID: "dual-ghost-spark", style: { paddingHorizontal: 4 }, children: /* @__PURE__ */ jsxs("svg", { width: w, height: h, children: [
+    up.current.length > 0 && /* @__PURE__ */ jsx("g", { "data-testid": "dual-ghost-bloom-left", children: /* @__PURE__ */ jsx(
+      GhostBloom,
+      {
+        current: up.current,
+        ghosts: up.ghosts,
+        tint: up.tint,
+        baseline: baseUp,
+        orientation: "up"
+      }
+    ) }),
+    down.current.length > 0 && /* @__PURE__ */ jsx("g", { "data-testid": "dual-ghost-bloom-right", children: /* @__PURE__ */ jsx(
+      GhostBloom,
+      {
+        current: down.current,
+        ghosts: down.ghosts,
+        tint: down.tint,
+        baseline: baseDown,
+        orientation: "down"
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      GhostBand,
+      {
+        segments,
+        x,
+        top: bandTop,
+        showLabels: true,
+        labelColor: alpha(t25["text-primary"], 0.92),
+        targetTempoSeconds
+      }
+    ),
+    showDeviceLabels && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "text",
+        {
+          x: padL,
+          y: padTop - 9,
+          fontSize: 9,
+          fontWeight: 800,
+          letterSpacing: 1,
+          fontFamily: FONT_UI,
+          fill: t25["text-tertiary"],
+          children: leftLabel
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "text",
+        {
+          x: padL,
+          y: h - padBot + 15,
+          fontSize: 9,
+          fontWeight: 800,
+          letterSpacing: 1,
+          fontFamily: FONT_UI,
+          fill: t25["text-tertiary"],
+          children: rightLabel
+        }
+      )
+    ] })
+  ] }) });
+}
 var PALETTE = DATAVIZ_CATEGORICAL_PALETTE;
 function scaleValue(v, scale) {
   if (v <= 0) return 0;
@@ -13973,7 +15347,7 @@ function Treemap({
   const rects = squarify(weighted, width, height);
   return /* @__PURE__ */ jsx(View, { className: cn("relative", className), style: { width, height }, ...props, children: rects.map((r) => {
     const selected = r.datum.id === selectedId;
-    const labelFits = r.w > 54 && r.h > 22;
+    const labelFits2 = r.w > 54 && r.h > 22;
     const pressable = r.datum.id !== "__more__";
     return /* @__PURE__ */ jsx(
       Pressable,
@@ -13995,7 +15369,7 @@ function Treemap({
           padding: 4,
           overflow: "hidden"
         },
-        children: labelFits && /* @__PURE__ */ jsx(Text, { numberOfLines: 2, className: "text-[10px] font-semibold text-[#0b0b0b]", children: r.datum.label ?? r.datum.id })
+        children: labelFits2 && /* @__PURE__ */ jsx(Text, { numberOfLines: 2, className: "text-[10px] font-semibold text-[#0b0b0b]", children: r.datum.label ?? r.datum.id })
       },
       r.datum.id
     );
@@ -14091,28 +15465,28 @@ function Scatter({
         testID: "scatter-canvas",
         style: { position: "absolute", top: 0, left: 0, width, height, overflow: "hidden" },
         children: [
-          ticksOf(yd, TICK_COUNT).map((t17, i) => {
-            const y = toY(t17);
+          ticksOf(yd, TICK_COUNT).map((t26, i) => {
+            const y = toY(t26);
             return /* @__PURE__ */ jsx(
               View,
               {
                 accessibilityElementsHidden: true,
                 testID: "scatter-gridline-y",
                 style: { position: "absolute", left: PLOT_LEFT2, width: innerW, top: y, height: 1, backgroundColor: GRID_LINE2 },
-                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", left: -PLOT_LEFT2, top: -6, width: PLOT_LEFT2 - 6, textAlign: "right" }, children: formatTick(t17) })
+                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", left: -PLOT_LEFT2, top: -6, width: PLOT_LEFT2 - 6, textAlign: "right" }, children: formatTick(t26) })
               },
               `y-${i}`
             );
           }),
-          ticksOf(xd, TICK_COUNT).map((t17, i) => {
-            const x = toX(t17);
+          ticksOf(xd, TICK_COUNT).map((t26, i) => {
+            const x = toX(t26);
             return /* @__PURE__ */ jsx(
               View,
               {
                 accessibilityElementsHidden: true,
                 testID: "scatter-gridline-x",
                 style: { position: "absolute", top: PLOT_TOP, height: innerH, left: x, width: 1, backgroundColor: GRID_LINE2 },
-                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t17) })
+                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t26) })
               },
               `x-${i}`
             );
@@ -14185,7 +15559,7 @@ var DEFAULT_THRESHOLDS2 = [
 var ARC_START = 135;
 var ARC_SWEEP = 270;
 var SEGMENTS = 40;
-function clamp012(n) {
+function clamp013(n) {
   if (Number.isNaN(n)) return 0;
   return Math.max(0, Math.min(1, n));
 }
@@ -14230,7 +15604,7 @@ function Gauge2({
   ...props
 }) {
   const span = max - min || 1;
-  const fill = clamp012((value - min) / span);
+  const fill = clamp013((value - min) / span);
   const activeColor = (f) => color ?? bandColor2(f, thresholds, min, max);
   const ticks = buildTicks(fill, size, activeColor);
   const displayColor = color ?? bandColor2(fill, thresholds, min, max);
@@ -14247,23 +15621,23 @@ function Gauge2({
       testID: "gauge",
       ...props,
       children: [
-        ticks.map((t17) => /* @__PURE__ */ jsx(
+        ticks.map((t26) => /* @__PURE__ */ jsx(
           View,
           {
             accessibilityElementsHidden: true,
             testID: "gauge-segment",
             style: {
               position: "absolute",
-              left: t17.left - tickThickness / 2,
-              top: t17.top - tickLength / 2,
+              left: t26.left - tickThickness / 2,
+              top: t26.top - tickLength / 2,
               width: tickThickness,
               height: tickLength,
               borderRadius: tickThickness / 2,
-              backgroundColor: t17.color,
-              transform: [{ rotate: t17.rotate }]
+              backgroundColor: t26.color,
+              transform: [{ rotate: t26.rotate }]
             }
           },
-          t17.key
+          t26.key
         )),
         /* @__PURE__ */ jsxs(View, { style: { position: "absolute", top: 0, left: 0, width: size, height: size }, className: "items-center justify-center", children: [
           /* @__PURE__ */ jsxs(View, { className: "flex-row items-baseline gap-0.5", children: [
@@ -14683,6 +16057,6 @@ function composeValidators(...validators) {
   };
 }
 
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, ActivityIcon, Alert, AlertDescription, AlertTitle, AlertTriangleIcon, Autocomplete, Avatar, AvatarBadge, AvatarGroup, AwardIcon, Badge, BadgeText, BaseBadge, BluetoothIcon, BrandLockup, BreadcrumbItem, Breadcrumbs, Button, ButtonIcon, ButtonSpinner, ButtonText, CATEGORICAL_CVD_SAFE_MAX, CapacityBandChart, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardSkeleton, CardTitle, Checkbox, CheckboxGroup, Chip, CircleSlashIcon, CircularProgress, CircularTimer, Collapse, CollapseButton, CollapseContent, DashboardShell, DataRow, DateTime, DeviationBar, DeviceIndicator, DeviceMenu, DeviceRow, Divider, Drawer, DrawerBody, DrawerFooter, DrawerHeader, DumbbellIcon, EmptyState, ExerciseCard, ExerciseCardHeading, ExerciseHeading, ExerciseIndicator, FatigueMeter, FormActions, FormField, FormRow, FormSection, Gauge2 as Gauge, HStack, Heading, HelpTip, HistoryIcon, INDICATOR_PRECEDENCE, IconBox, Indicator, InfoIcon, Input, InputBar, InputGroup, IntensityBar, Label, LabelWithHelp, LayersIcon, Link, ListItem, ListItemContent, ListItemDivider, ListItemIcon, ListItemTrailing, LiveAuraFrame, METRIC_FONT, Menu, MenuDivider, MenuGroup, MenuItem, MenuList, MenuTrigger, MesoCard, MesoProgressBar, MesoStatusCard, Metric, MetricCell, MetricGroup, MetricTiles, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalTitle, MuscleGroupChip, NavItem, Overline, PRESSED_ELEVATION_LEVEL, Paragraph, PasswordInput, PersonStandingIcon, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, Radio, RadioGroup, ReadinessCheck, RestTimer, SET_STRIP_VARIABLE_COLOR, SET_STRIP_ZONES, SURFACE_LEVEL_TOKEN, ScaleIcon, Scatter, ScheduleTiles, Section, SectionContent, SectionHeader, SegmentedBar, SegmentedProgressBar, Select, SessionHeader, SessionRail, SessionStatePill, SetBar, SetRow, SetStrip, SetTableHeader, SetsRepsLoad, SideNav, Sidebar, SidebarContent, SidebarDivider, SidebarFooter, SidebarHeader, SidebarItem, SidebarSection, Skeleton, SkeletonCard, SkeletonCircle, SkeletonListItem, SkeletonText, Sparkline, Spinner, Stack, StarIcon, StatusDot, StatusPill2 as StatusPill, StepContent, StepIndicator, StepLabel, Stepper, Step as StepperStep, StrengthTrendChart, SupersetWrapper, Surface, SurfaceContext, SvgIcon, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoDisplay, Tile, TimerReadout, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, TrendingDownIcon, Typography, VStack, VelocityStrip, VoltrasMark, VolumeLandmarkBar, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, ZoneTrack, alpha, applyThemePreset, audiobookPreset, backgroundFrameDark, bestTextColor, buttonSizes, calculateMeanVelocity, calculateVelocityLoss, categoricalPalette, cn, componentElevationRanges, composeValidators, createFieldId, createFlatShadow, createPressedHoverShadow, createPressedShadow, createRaisedHoverShadow, createRaisedShadow, darkThemeCSSVars, darken, defaultNavItems, defaultPreset, discreteRainbow, divergingScale, elevationSystem, formatDateTime, formatDuration, formatPrescription, formatSignedPct, formatVelocity, getBaseSurfaceColor, getCategoricalColor, getContrastText, getDiscreteRainbowColor, getElevationConfig, getElevationShadow, getElevationSurface, getFieldAriaProps, getFieldValidationProps, getGlowShadow, getHoverColors, getLuminance, getPressedRecessShadow, getResultColor, getSemanticColors, getStatusColor, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, liveAuraColor, neumorphicShadows, onSurfaceColors, paceTone, paceToneColor, pressedLevel, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, resolveIndicator, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, statusPillColor, surfaceBackground, surfaceGradient, surfaceRampDark, useOnSurfaceColor, useSurface, useSurfaceMode, useTable, useTimer, useToast, useToolbarButton, validateCssPropertyManifest, validationRules, velocityZoneColor };
+export { Accordion, AccordionButton, AccordionItem, AccordionPanel, ActivityIcon, Alert, AlertDescription, AlertTitle, AlertTriangleIcon, Autocomplete, Avatar, AvatarBadge, AvatarGroup, AwardIcon, BAND_GAP, BAND_H, Badge, BadgeText, BaseBadge, BluetoothIcon, BrandLockup, BreadcrumbItem, Breadcrumbs, Button, ButtonIcon, ButtonSpinner, ButtonText, CATEGORICAL_CVD_SAFE_MAX, CapacityBandChart, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardSkeleton, CardTitle, Checkbox, CheckboxGroup, Chip, CircleSlashIcon, CircularProgress, CircularTimer, Collapse, CollapseButton, CollapseContent, DRIFT_GREY, DashboardShell, DataRow, DateTime, DeviationBar, DeviceIndicator, DeviceMenu, DeviceRow, Divider, Drawer, DrawerBody, DrawerFooter, DrawerHeader, DualGhostSpark, DualVelocityStrip, DumbbellIcon, EmptyState, ExerciseCard, ExerciseCardHeading, ExerciseHeading, ExerciseIndicator, FatigueLights, FatigueMeter, FormActions, FormField, FormRow, FormSection, GRIND_THRESHOLD, Gauge2 as Gauge, GhostBand, GhostBloom, GhostSpark, HStack, Heading, HelpTip, HistoryIcon, INDICATOR_PRECEDENCE, IconBox, Indicator, InfoIcon, Input, InputBar, InputGroup, IntensityBar, Label, LabelWithHelp, LayersIcon, Link, ListItem, ListItemContent, ListItemDivider, ListItemIcon, ListItemTrailing, LiveAuraFrame, LiveFatigueCard, LiveFatiguePanel, METRIC_FONT, Menu, MenuDivider, MenuGroup, MenuItem, MenuList, MenuTrigger, MesoCard, MesoProgressBar, MesoStatusCard, Metric, MetricCell, MetricGroup, MetricTiles, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalTitle, MuscleGroupChip, NavItem, Overline, PHASE_AXIS_COLOR, PRESSED_ELEVATION_LEVEL, Paragraph, PasswordInput, PersonStandingIcon, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, RED_DEEP, RED_LIGHT, RED_MID, Radio, RadioGroup, ReadinessCheck, RestTimer, RomProgressionChart, SET_STRIP_VARIABLE_COLOR, SET_STRIP_ZONES, SILVER, STATE_LABEL, SURFACE_LEVEL_TOKEN, ScaleIcon, Scatter, ScheduleTiles, Section, SectionContent, SectionHeader, SegmentedBar, SegmentedProgressBar, Select, SessionHeader, SessionRail, SessionStatePill, SetBar, SetRow, SetStrip, SetTableHeader, SetsRepsLoad, SideNav, Sidebar, SidebarContent, SidebarDivider, SidebarFooter, SidebarHeader, SidebarItem, SidebarSection, Skeleton, SkeletonCard, SkeletonCircle, SkeletonListItem, SkeletonText, Sparkline, Spinner, Stack, StarIcon, StatusDot, StatusPill2 as StatusPill, StepContent, StepIndicator, StepLabel, Stepper, Step as StepperStep, StrengthTrendChart, SupersetWrapper, Surface, SurfaceContext, SvgIcon, Switch, TONE_COLOR, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoDisplay, Tile, TimerReadout, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, TrendingDownIcon, Typography, VStack, VelocityHero, VelocityStrip, VerdictHero, VoltrasMark, VolumeLandmarkBar, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, ZoneTrack, alpha, applyThemePreset, audiobookPreset, auraForVerdict, backgroundFrameDark, bestTextColor, buttonSizes, calculateMeanVelocity, calculateVelocityLoss, categoricalPalette, cn, componentElevationRanges, composeValidators, createFieldId, createFlatShadow, createPressedHoverShadow, createPressedShadow, createRaisedHoverShadow, createRaisedShadow, darkThemeCSSVars, darken, defaultNavItems, defaultPreset, discreteRainbow, divergingScale, elevationSystem, formatDateTime, formatDuration, formatPrescription, formatSignedPct, formatVelocity, getBaseSurfaceColor, getCategoricalColor, getContrastText, getDiscreteRainbowColor, getElevationConfig, getElevationShadow, getElevationSurface, getFieldAriaProps, getFieldValidationProps, getGlowShadow, getHoverColors, getLuminance, getPressedRecessShadow, getResultColor, getSemanticColors, getStatusColor, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, ghostLineColor, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, liveAuraColor, mergePhaseSegments, neumorphicShadows, onSurfaceColors, paceTone, paceToneColor, pressedLevel, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, resolveIndicator, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, smoothPath, statusPillColor, surfaceBackground, surfaceGradient, surfaceRampDark, useOnSurfaceColor, useSurface, useSurfaceMode, useTable, useTimer, useToast, useToolbarButton, validateCssPropertyManifest, validationRules, velocityZoneColor };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map