npm - @titan-design/react-ui - Versions diffs - 0.6.0 → 0.7.0 - Mend

@titan-design/react-ui 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (248) hide show

package/dist/index.mjs CHANGED Viewed

@@ -76,6 +76,72 @@ function DumbbellIcon(props) {
 function StarIcon(props) {
   return /* @__PURE__ */ jsx(SvgIcon, { ...props, children: /* @__PURE__ */ jsx("path", { d: "M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z" }) });
 }
+function ActivityIcon(props) {
+  return /* @__PURE__ */ jsx(SvgIcon, { ...props, children: /* @__PURE__ */ jsx("path", { d: "M22 12h-4l-3 9L9 3l-3 9H2" }) });
+}
+function HistoryIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 1 0 3-6.7L3 8" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 3v5h5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 7v5l4 2" })
+  ] });
+}
+function LayersIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z" }),
+    /* @__PURE__ */ jsx("path", { d: "m6.08 9.5-3.49 1.59a1 1 0 0 0 0 1.81l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9a1 1 0 0 0 0-1.83l-3.5-1.59" }),
+    /* @__PURE__ */ jsx("path", { d: "m6.08 14.5-3.49 1.59a1 1 0 0 0 0 1.81l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9a1 1 0 0 0 0-1.83l-3.5-1.59" })
+  ] });
+}
+function PersonStandingIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "1" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 20 3-6 3 6" }),
+    /* @__PURE__ */ jsx("path", { d: "m6 8 6 2 6-2" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 10v4" })
+  ] });
+}
+function ScaleIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "m16 16 3-8 3 8c-.87.65-1.92 1-3 1s-2.13-.35-3-1Z" }),
+    /* @__PURE__ */ jsx("path", { d: "m2 16 3-8 3 8c-.87.65-1.92 1-3 1s-2.13-.35-3-1Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M7 21h10" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 3v18" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 7h2c2 0 5-1 7-2 2 1 5 2 7 2h2" })
+  ] });
+}
+function AlertTriangleIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 9v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 17h.01" })
+  ] });
+}
+function TrendingDownIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "M16 17h6v-6" }),
+    /* @__PURE__ */ jsx("path", { d: "m22 17-8.5-8.5-5 5L2 7" })
+  ] });
+}
+function CircleSlashIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 15 6-6" })
+  ] });
+}
+function AwardIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("path", { d: "m15.477 12.89 1.515 8.526a.5.5 0 0 1-.81.47l-3.58-2.687a1 1 0 0 0-1.197 0l-3.586 2.686a.5.5 0 0 1-.81-.469l1.514-8.526" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "8", r: "6" })
+  ] });
+}
+function InfoIcon(props) {
+  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 16v-4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 8h.01" })
+  ] });
+}
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -174,7 +240,7 @@ function AlertDescription({ children, className }) {
 // src/theme/tokens/primitives.ts
 var primitiveColors = {
-  // Blue scale (primary brand)
+  // Blue scale
   blue: {
     50: "#EFF6FF",
     100: "#DBEAFE",
@@ -183,124 +249,36 @@ var primitiveColors = {
     400: "#60A5FA",
     500: "#3B82F6",
     600: "#5048E5",
-    // Primary main
     700: "#3832A0",
-    // Primary dark
     800: "#1E40AF",
     900: "#1E3A8A"
   },
-  // Green scale (secondary brand)
-  green: {
-    50: "#ECFDF5",
-    100: "#D1FAE5",
-    200: "#A7F3D0",
-    300: "#6EE7B7",
-    400: "#3FC79A",
-    // Secondary light
-    500: "#10B981",
-    // Secondary main
-    600: "#059669",
-    700: "#0B815A",
-    // Secondary dark
-    800: "#065F46",
-    900: "#064E3B"
-  },
-  // Teal scale (success)
-  teal: {
-    50: "#F0FDFA",
-    100: "#CCFBF1",
-    200: "#99F6E4",
-    300: "#5EEAD4",
-    400: "#43C6B7",
-    // Success light
-    500: "#14B8A6",
-    // Success main
-    600: "#0D9488",
-    700: "#0E8074",
-    // Success dark
-    800: "#115E59",
-    900: "#134E4A"
-  },
-  // Red scale (error)
+  // Red scale
   red: {
     50: "#FEF2F2",
     100: "#FEE2E2",
     200: "#FECACA",
     300: "#FCA5A5",
     400: "#DA6868",
-    // Error light
     500: "#EF4444",
     600: "#D14343",
-    // Error main
     700: "#922E2E",
-    // Error dark
     800: "#991B1B",
     900: "#7F1D1D"
   },
-  // Vivid green scale (live/go success)
-  greenVivid: {
-    50: "#E9FBF0",
-    100: "#C8F7DA",
-    200: "#9FF0BF",
-    300: "#6BE79D",
-    400: "#47DE84",
-    // Success vivid light
-    500: "#2ED573",
-    // Success vivid main
-    600: "#22B85F",
-    700: "#1A9950",
-    // Success vivid dark
-    800: "#157A40",
-    900: "#105C30"
-  },
-  // Vivid red scale (alert)
+  // Vivid red scale
   redVivid: {
     50: "#FFECEE",
     100: "#FFD6DB",
     200: "#FFB3BC",
     300: "#FF8593",
     400: "#FF6070",
-    // Error vivid light
     500: "#FF4757",
-    // Error vivid main
     600: "#E63548",
     700: "#C42539",
-    // Error vivid dark
     800: "#9E1C2C",
     900: "#7A1520"
   },
-  // Amber scale (warning)
-  amber: {
-    50: "#FFFBEB",
-    100: "#FEF3C7",
-    200: "#FDE68A",
-    300: "#FCD34D",
-    400: "#FFBF4C",
-    // Warning light
-    500: "#FFB020",
-    // Warning main
-    600: "#B27B16",
-    // Warning dark
-    700: "#B45309",
-    800: "#92400E",
-    900: "#78350F"
-  },
-  // Sky/Blue scale (info)
-  sky: {
-    50: "#F0F9FF",
-    100: "#E0F2FE",
-    200: "#BAE6FD",
-    300: "#7DD3FC",
-    400: "#64B6F7",
-    // Info light
-    500: "#2196F3",
-    // Info main
-    600: "#0284C7",
-    700: "#0B79D0",
-    // Info dark
-    800: "#075985",
-    900: "#0C4A6E"
-  },
   // Neutral/Gray scale
   neutral: {
     50: "#FAFAFA",
@@ -315,18 +293,6 @@ var primitiveColors = {
     900: "#111827",
     950: "#030712"
   },
-  // Orange scale (accent/brand color)
-  accent: {
-    100: "#FFA860",
-    200: "#FF9630",
-    300: "#FF8500",
-    400: "#FF7900",
-    500: "#F56C00",
-    600: "#E06D10",
-    700: "#D0620C",
-    800: "#B75500",
-    900: "#A34900"
-  },
   // Charcoal scale (dark backgrounds)
   charcoal: {
     0: "#6E6E6E",
@@ -341,18 +307,6 @@ var primitiveColors = {
     800: "#131313",
     900: "#101010"
   },
-  // Steel scale (cool accent)
-  steel: {
-    100: "#8AA4B8",
-    200: "#7894A8",
-    300: "#678498",
-    400: "#557488",
-    500: "#406D87",
-    600: "#39617A",
-    700: "#32556D",
-    800: "#243D53",
-    900: "#1D3146"
-  },
   // Pure colors
   white: "#FFFFFF",
   black: "#000000",
@@ -743,6 +697,9 @@ var semanticColorsLight = {
   "status-success-light": primitiveRamps.green[200],
   "status-success-dark": primitiveRamps.green[600],
   "status-success-subtle": primitiveRamps.green[50],
+  // Live-session accent — its OWN role, decoupled from success so the two can diverge
+  "status-live": primitiveRamps.green[300],
+  "status-live-muted": primitiveRamps.green[500],
   "status-error": primitiveRamps.red[600],
   "status-error-light": primitiveRamps.red[500],
   "status-error-dark": primitiveRamps.red[700],
@@ -876,6 +833,9 @@ var semanticColorsDark = {
   "status-success-light": primitiveRamps.green[200],
   "status-success-dark": primitiveRamps.green[600],
   "status-success-subtle": "rgba(46, 213, 115, 0.12)",
+  // Live-session accent — its OWN role, decoupled from success so the two can diverge
+  "status-live": primitiveRamps.green[300],
+  "status-live-muted": primitiveRamps.green[500],
   "status-error": primitiveRamps.red[600],
   "status-error-light": primitiveRamps.red[500],
   "status-error-dark": primitiveRamps.red[700],
@@ -1470,6 +1430,8 @@ var lightThemeCSSVars = {
   "--color-on-brand-secondary": semanticColorsLight["on-brand-secondary"],
   "--color-status-success": semanticColorsLight["status-success"],
   "--color-status-success-subtle": semanticColorsLight["status-success-subtle"],
+  "--color-status-live": semanticColorsLight["status-live"],
+  "--color-status-live-muted": semanticColorsLight["status-live-muted"],
   "--color-status-error": semanticColorsLight["status-error"],
   "--color-status-error-subtle": semanticColorsLight["status-error-subtle"],
   "--color-status-warning": semanticColorsLight["status-warning"],
@@ -1566,6 +1528,8 @@ var darkThemeCSSVars = {
   "--color-on-brand-secondary": semanticColorsDark["on-brand-secondary"],
   "--color-status-success": semanticColorsDark["status-success"],
   "--color-status-success-subtle": semanticColorsDark["status-success-subtle"],
+  "--color-status-live": semanticColorsDark["status-live"],
+  "--color-status-live-muted": semanticColorsDark["status-live-muted"],
   "--color-status-error": semanticColorsDark["status-error"],
   "--color-status-error-subtle": semanticColorsDark["status-error-subtle"],
   "--color-status-warning": semanticColorsDark["status-warning"],
@@ -2783,6 +2747,7 @@ var colorStyles = {
   default: "bg-text-tertiary",
   primary: "bg-brand-primary",
   success: "bg-status-success",
+  live: "bg-status-live",
   error: "bg-status-error",
   warning: "bg-status-warning",
   info: "bg-status-info",
@@ -2839,7 +2804,7 @@ function Indicator({
         colorClass,
         pulseMode === "opacity" && "animate-pulse",
         ring && "border-2 border-background-base",
-        glow && !customColor && color === "success" && "shadow-[0_0_6px_rgba(46,213,115,0.6)]",
+        glow && !customColor && (color === "success" || color === "live") && "shadow-[0_0_6px_rgba(46,213,115,0.6)]",
         glow && !customColor && color === "error" && "shadow-[0_0_6px_rgba(239,68,68,0.6)]",
         glow && !customColor && color === "warning" && "shadow-[0_0_6px_rgba(245,158,11,0.6)]",
         glow && !customColor && color === "primary" && "shadow-[0_0_6px_rgba(255,121,0,0.6)]",
@@ -5263,7 +5228,7 @@ function ToastProvider({
     return id;
   }, [defaultDuration, maxToasts]);
   const removeToast = useCallback((id) => {
-    setToasts((prev) => prev.filter((t12) => t12.id !== id));
+    setToasts((prev) => prev.filter((t18) => t18.id !== id));
   }, []);
   const removeAllToasts = useCallback(() => {
     setToasts([]);
@@ -6132,6 +6097,50 @@ function Pill({
   }
   return /* @__PURE__ */ jsx(View, { className: containerClasses, ...props, children: content });
 }
+function Tile({
+  label,
+  value,
+  valueColor,
+  align = "center",
+  className,
+  ...props
+}) {
+  const isCenter = align === "center";
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className: cn(
+        "flex-1 rounded-md bg-surface-raised px-1.5 py-2",
+        isCenter ? "items-center" : "items-start",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: cn(
+              "text-[10px] font-bold uppercase tracking-wider text-text-tertiary",
+              isCenter ? "text-center" : "text-left"
+            ),
+            children: label
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: cn(
+              "mt-0.5 font-mono text-sm font-bold text-text-primary",
+              isCenter ? "text-center" : "text-left"
+            ),
+            style: valueColor ? { color: valueColor } : void 0,
+            children: value
+          }
+        )
+      ]
+    }
+  );
+}
 var variantStyles4 = {
   h1: "font-heading text-5xl font-bold leading-tight",
   h2: "font-heading text-4xl font-bold leading-tight",
@@ -6991,6 +7000,79 @@ function formatDateTime(value, format = "datetime", isUTC = false, fallback = "-
   }
   return formatDate(value, format, isUTC);
 }
+function formatDuration(ms) {
+  const totalSeconds = Math.max(0, Math.ceil(ms / 1e3));
+  const minutes = Math.floor(totalSeconds / 60);
+  const seconds = totalSeconds % 60;
+  return `${minutes}:${String(seconds).padStart(2, "0")}`;
+}
+function useTimer(options = {}) {
+  const {
+    mode = "up",
+    durationMs,
+    elapsedMs: controlledElapsedMs,
+    running = false,
+    autoTick = false,
+    tickMs = 1e3
+  } = options;
+  const isControlled = controlledElapsedMs != null;
+  const [internalElapsedMs, setInternalElapsedMs] = useState(0);
+  useEffect(() => {
+    if (isControlled || !autoTick || !running) return;
+    const id = setInterval(() => {
+      setInternalElapsedMs((prev) => prev + tickMs);
+    }, tickMs);
+    return () => clearInterval(id);
+  }, [isControlled, autoTick, running, tickMs]);
+  const elapsedMs = isControlled ? controlledElapsedMs : internalElapsedMs;
+  const hasDuration = durationMs != null && durationMs > 0;
+  const remainingMs = durationMs != null ? Math.max(0, durationMs - elapsedMs) : 0;
+  let progress;
+  if (hasDuration) {
+    progress = Math.min(1, Math.max(0, elapsedMs / durationMs));
+  } else {
+    progress = mode === "down" ? 1 : 0;
+  }
+  const label = formatDuration(mode === "down" ? remainingMs : elapsedMs);
+  const done = durationMs != null && elapsedMs >= durationMs;
+  return { elapsedMs, remainingMs, progress, label, done };
+}
+// src/components/custom/TimerReadout/TimerReadout.tsx
+var semantic = getSemanticColors("dark");
+var LIVE_GREEN = primitiveRamps.green[500];
+var SECONDARY = semantic["text-secondary"];
+var TERTIARY = semantic["text-tertiary"];
+var DEFAULT_GLYPH = "\u23F1";
+function TimerReadout({
+  mode = "up",
+  elapsedMs,
+  durationMs,
+  running = false,
+  autoTick = false,
+  showTotal = false,
+  glyph = DEFAULT_GLYPH,
+  className,
+  ...rest
+}) {
+  const { label } = useTimer({ mode, durationMs, elapsedMs, running, autoTick });
+  const currentColor = running ? LIVE_GREEN : SECONDARY;
+  const total = showTotal && durationMs != null ? formatDuration(durationMs) : null;
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityRole: "timer",
+      accessibilityLabel: total != null ? `${label} of ${total}` : label,
+      className: cn("flex-row items-baseline justify-end", className),
+      ...rest,
+      children: /* @__PURE__ */ jsxs(Typography, { variant: "mono", style: { fontSize: 11, textAlign: "right" }, children: [
+        /* @__PURE__ */ jsx(Text, { testID: "timer-readout-glyph", style: { color: currentColor, marginRight: 3 }, children: glyph }),
+        /* @__PURE__ */ jsx(Text, { testID: "timer-readout-current", style: { color: currentColor }, children: label }),
+        total != null ? /* @__PURE__ */ jsx(Text, { testID: "timer-readout-total", style: { color: TERTIARY }, children: ` / ${total}` }) : null
+      ] })
+    }
+  );
+}
 var sizeConfig2 = {
   sm: { value: "text-lg font-bold", label: "text-xs", unit: "text-xs" },
   md: { value: "text-2xl font-bold", label: "text-xs", unit: "text-sm" },
@@ -7420,15 +7502,22 @@ var WORKOUT_TOKENS = {
   // Canonical 4-band performance scale — the single source for BOTH the
   // VelocityStrip zone bars and the SetRow RPE color (TD-03.43). The direction
   // is intentionally inverted between the two consumers: for velocity, green =
-  // fastest/best; for RPE, green = easiest. This is the [0,1,2,4] subsample of
-  // the canonical `sequentialEffort` primitive. The `orange` key is the band
-  // label. Consumed inline (RN).
+  // fastest/best; for RPE, green = easiest. This is the [0,2,3,4] subsample of
+  // the canonical `sequentialEffort` primitive: an EVEN hue walk across the ramp
+  // (green → gold → orange → red). The earlier [0,1,2,4] spent two of its four
+  // bands on adjacent yellows (amber-200 + amber-300) and skipped orange, reading
+  // yellow-heavy with an abrupt jump to red; sampling amber-300 + orange-400
+  // instead gives four cleanly separable bands that hold at 3px strip scale.
+  // Consumed inline (RN).
   scale: {
     green: sequentialEffort[0],
-    yellow: sequentialEffort[1],
-    orange: sequentialEffort[2],
-    // gold band
+    // green-300
+    yellow: sequentialEffort[2],
+    // amber-300 (gold)
+    orange: sequentialEffort[3],
+    // orange-400 (true orange)
     red: sequentialEffort[4]
+    // red-600
   },
   // BodyMap volume heatmap — the canonical `divergingScale` (under → optimal →
   // over): a true diverging shape with a light green center, cool-blue under-
@@ -7553,8 +7642,8 @@ function roundTempo(tempo) {
   return tempo.map((v) => Math.round(v * 10) / 10);
 }
 function formatSignedPct(ratio) {
-  const pct = Math.round(ratio * 100);
-  return `${pct > 0 ? "+" : ""}${pct}%`;
+  const pct2 = Math.round(ratio * 100);
+  return `${pct2 > 0 ? "+" : ""}${pct2}%`;
 }
 function formatPrescription(p) {
   if (p == null) return null;
@@ -7700,7 +7789,7 @@ function ActiveSegment({
   const pacing = getTempoPacingState(phaseElapsedMs, targetMs);
   const barColor = pacing === "behind" ? t2["status-error"] : config.color;
   const fillPct = getTempoFillPct(phaseElapsedMs, targetMs);
-  const label = targetMs ? `${formatDuration(phaseElapsedMs)} / ${formatDuration(targetMs)}` : formatDuration(phaseElapsedMs);
+  const label = targetMs ? `${formatDuration2(phaseElapsedMs)} / ${formatDuration2(targetMs)}` : formatDuration2(phaseElapsedMs);
   return /* @__PURE__ */ jsxs(View, { style: { height: "100%", position: "relative" }, testID: `tempo-segment-active-${config.label}`, children: [
     /* @__PURE__ */ jsx(
       View,
@@ -7750,16 +7839,32 @@ function CompletedSegment({
       },
       testID: `tempo-segment-completed-${config.label}`,
       children: /* @__PURE__ */ jsxs(Text, { style: { fontSize: 12, fontWeight: "500", color: alpha(config.color, 0.7) }, children: [
-        formatDuration(completedMs),
+        formatDuration2(completedMs),
         indicator
       ] })
     }
   );
 }
-function formatDuration(ms) {
+function formatDuration2(ms) {
   const s = ms / 1e3;
   return s < 10 ? s.toFixed(1) : Math.round(s).toString();
 }
+var METRIC_FONT = "Inter, sans-serif";
+function MetricCell({ children, color, fontSize = 11 }) {
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      style: {
+        fontFamily: METRIC_FONT,
+        fontSize,
+        color,
+        fontWeight: "600",
+        letterSpacing: 1
+      },
+      children
+    }
+  );
+}
 // src/components/custom/Workout/TempoDisplay.tsx
 var t3 = getSemanticColors("dark");
@@ -7778,34 +7883,10 @@ function TempoValue({
   color,
   fontSize
 }) {
-  return /* @__PURE__ */ jsx(
-    Text,
-    {
-      style: {
-        fontFamily: INTER,
-        fontSize,
-        color,
-        fontWeight: "600",
-        letterSpacing: 1
-      },
-      children: value
-    }
-  );
+  return /* @__PURE__ */ jsx(MetricCell, { color, fontSize, children: value });
 }
 function TempoSeparator({ color, fontSize }) {
-  return /* @__PURE__ */ jsx(
-    Text,
-    {
-      style: {
-        fontFamily: INTER,
-        fontSize,
-        color,
-        fontWeight: "600",
-        letterSpacing: 1
-      },
-      children: "-"
-    }
-  );
+  return /* @__PURE__ */ jsx(MetricCell, { color, fontSize, children: "-" });
 }
 var LIVE_PHASES = [
   { key: "eccentric", color: phaseColors.eccentric },
@@ -7867,6 +7948,7 @@ function TempoDisplay({
   tempo,
   size = "md",
   colored = true,
+  showLabel = true,
   showInfo = true,
   live,
   onPress,
@@ -7900,7 +7982,7 @@ function TempoDisplay({
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx(
+        showLabel && /* @__PURE__ */ jsx(
           Text,
           {
             style: {
@@ -8128,12 +8210,12 @@ var ZONE = {
   // severe over-target
 };
 var BULGE_SIZE = { 1: 8, 2: 10, 3: 11 };
-function zoneForPct(pct) {
-  if (pct >= 125) return { color: ZONE.over3, over: 3 };
-  if (pct >= 115) return { color: ZONE.over2, over: 2 };
-  if (pct > 100) return { color: ZONE.over1, over: 1 };
-  if (pct === 100) return { color: ZONE.target, over: 0 };
-  if (pct >= 75) return { color: ZONE.approaching, over: 0 };
+function zoneForPct(pct2) {
+  if (pct2 >= 125) return { color: ZONE.over3, over: 3 };
+  if (pct2 >= 115) return { color: ZONE.over2, over: 2 };
+  if (pct2 > 100) return { color: ZONE.over1, over: 1 };
+  if (pct2 === 100) return { color: ZONE.target, over: 0 };
+  if (pct2 >= 75) return { color: ZONE.approaching, over: 0 };
   return { color: ZONE.building, over: 0 };
 }
 function clampFill(value) {
@@ -8141,9 +8223,9 @@ function clampFill(value) {
   if (value > 1) return 1;
   return value;
 }
-function isAtTarget(pct, threshold) {
+function isAtTarget(pct2, threshold) {
   if (threshold == null) return false;
-  return Math.abs(pct - Math.round(threshold * 100)) <= 5;
+  return Math.abs(pct2 - Math.round(threshold * 100)) <= 5;
 }
 function IntensityBar({
   level,
@@ -8157,9 +8239,9 @@ function IntensityBar({
 }) {
   const isVertical = orientation === "vertical";
   const fillLevel = clampFill(level);
-  const pct = Math.round(Math.max(0, level) * 100);
-  const zone = zoneForPct(pct);
-  const atTarget = isAtTarget(pct, threshold);
+  const pct2 = Math.round(Math.max(0, level) * 100);
+  const zone = zoneForPct(pct2);
+  const atTarget = isAtTarget(pct2, threshold);
   const [fillAnim] = useState(() => new Animated.Value(fillLevel));
   useEffect(() => {
     const animation = Animated.timing(fillAnim, {
@@ -8210,8 +8292,8 @@ function IntensityBar({
       className,
       style: { alignItems: "center" },
       accessibilityRole: "progressbar",
-      accessibilityValue: { min: 0, max: 100, now: pct },
-      accessibilityLabel: `Intensity level: ${pct}%`,
+      accessibilityValue: { min: 0, max: 100, now: pct2 },
+      accessibilityLabel: `Intensity level: ${pct2}%`,
       testID: "intensity-bar",
       ...props,
       children: [
@@ -8257,7 +8339,7 @@ function IntensityBar({
             accessibilityElementsHidden: true,
             testID: "intensity-label",
             children: [
-              pct,
+              pct2,
               "%"
             ]
           }
@@ -8442,13 +8524,257 @@ 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));
+  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/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 zoneIdToScaleToken = {
-  speed: "green",
-  power: "yellow",
-  strengthSpeed: "orange",
-  maximalStrength: "red",
-  grinding: "red"
+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";
@@ -8487,14 +8813,132 @@ function classifyBand(velocity, bands) {
   return bands[bands.length - 1];
 }
 function bandColor(band) {
-  const token = zoneIdToScaleToken[band.id];
-  return token ? VEL_COLORS[token] : VEL_COLORS.green;
+  return bandIdToEffortColor[band.id] ?? VEL_COLORS.green;
 }
 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 WIDE_GAP = 8;
+var TODO_COLOR2 = primitiveColors.charcoal[300];
+var CONTINUE_OUTLINE = primitiveRamps.cyan[800];
+function deriveDoneVelocities(set) {
+  switch (set.type) {
+    case "drop":
+      return set.subloads.flat();
+    case "myo":
+      return [...set.activation, ...set.clusters.flat()];
+    default:
+      return set.velocities;
+  }
+}
+function chunkedRepSlots(chunks) {
+  const slots = [];
+  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 });
+    });
+  });
+  return slots;
+}
+function buildSlots(set) {
+  switch (set.type) {
+    case "straight": {
+      const total = Math.max(set.velocities.length, set.planned ?? set.velocities.length);
+      return Array.from({ length: total }, (_, i) => {
+        const done = i < set.velocities.length;
+        return {
+          kind: done ? "rep" : "todo",
+          velocity: done ? set.velocities[i] : void 0,
+          leadingGap: i === 0 ? 0 : REP_GAP
+        };
+      });
+    }
+    case "range": {
+      const total = Math.max(set.max, set.velocities.length);
+      return Array.from({ length: total }, (_, i) => {
+        const kind = i < set.velocities.length ? "rep" : i < set.floor ? "todo" : "variable";
+        return {
+          kind,
+          velocity: kind === "rep" ? set.velocities[i] : void 0,
+          leadingGap: i === 0 ? 0 : REP_GAP
+        };
+      });
+    }
+    case "amrap": {
+      const reps = set.velocities.map((velocity, i) => ({
+        kind: "rep",
+        velocity,
+        leadingGap: i === 0 ? 0 : REP_GAP
+      }));
+      reps.push({ kind: "continue", leadingGap: reps.length === 0 ? 0 : REP_GAP });
+      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 });
+      return slots;
+    }
+    case "cluster": {
+      const total = Math.max(set.velocities.length, set.planned ?? set.velocities.length);
+      return Array.from({ length: total }, (_, i) => {
+        const done = i < set.velocities.length;
+        const boundary = i > 0 && i % set.groupSize === 0;
+        return {
+          kind: done ? "rep" : "todo",
+          velocity: done ? set.velocities[i] : void 0,
+          leadingGap: i === 0 ? 0 : boundary ? WIDE_GAP : REP_GAP
+        };
+      });
+    }
+  }
+}
+function setAccessibilityLabel(set, repCount) {
+  switch (set.type) {
+    case "straight":
+      return `Velocity strip, straight set, ${repCount} reps`;
+    case "range":
+      return `Velocity strip, rep-range set, floor ${set.floor} to ${set.max}, ${repCount} reps done`;
+    case "amrap":
+      return `Velocity strip, AMRAP set, ${repCount} reps and counting`;
+    case "drop":
+      return `Velocity strip, drop set, ${set.subloads.length} loads, ${repCount} reps`;
+    case "myo":
+      return `Velocity strip, myo-reps set, ${set.clusters.length} clusters${set.open ? ", open" : ""}, ${repCount} reps`;
+    case "cluster":
+      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;
+function scaleDenominator(scale, maxVelocity) {
+  return scale === "fixed" ? FIXED_MAX_VELOCITY : maxVelocity * 1.15;
+}
+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;
@@ -8516,31 +8960,48 @@ var ANIMATION_EASING = Easing.bezier(0.22, 1, 0.36, 1);
 var POP_EASING = Easing.bezier(0.34, 1.56, 0.64, 1);
 function VelocityStrip({
   velocities,
+  set,
   zones,
   liveRepIndex,
-  expanded = false,
+  expanded = true,
   onToggle,
   onRepPress,
-  variant = "full",
+  variant = "expanded",
+  height = EXPANDED_HEIGHT,
+  scale = "peak",
+  showNumbers = true,
   showInfo = true,
   className,
   ...props
 }) {
-  const maxVelocity = Math.max(...velocities, 0);
-  const meanVelocity = calculateMeanVelocity(velocities);
-  const loss = calculateVelocityLoss(velocities);
+  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 meanZone = hasZones ? classifyBand(meanVelocity, zones)?.label ?? "" : getVelocityZoneName(meanVelocity);
   const prefersReducedMotion = usePrefersReducedMotion();
-  const [heightAnim] = useState(() => new Animated.Value(expanded ? 60 : 3));
+  const [heightAnim] = useState(() => new Animated.Value(expanded ? height : 3));
   const [labelOpacity] = useState(() => new Animated.Value(expanded ? 1 : 0));
   const [infoOpacity] = useState(() => new Animated.Value(expanded ? 1 : 0));
   const [liveScale] = useState(() => new Animated.Value(1));
-  const liveVelocity = liveRepIndex != null ? velocities[liveRepIndex] : void 0;
+  const liveVelocity = liveRepIndex != null ? doneVelocities[liveRepIndex] : void 0;
   const isNewPeak = liveVelocity != null && maxVelocity > 0 && liveVelocity === maxVelocity;
   useEffect(() => {
-    if (variant === "mini" || liveRepIndex == null || liveVelocity == null) return;
+    if (variant !== "expanded" || !framed || liveRepIndex == null || liveVelocity == null) return;
     if (prefersReducedMotion) {
       liveScale.setValue(1);
       return;
@@ -8570,12 +9031,12 @@ function VelocityStrip({
         useNativeDriver: true
       }).start();
     }
-  }, [variant, liveRepIndex, liveVelocity, isNewPeak, prefersReducedMotion, liveScale]);
+  }, [variant, framed, liveRepIndex, liveVelocity, isNewPeak, prefersReducedMotion, liveScale]);
   useEffect(() => {
-    if (variant === "mini") return;
+    if (variant !== "expanded" || !framed) return;
     Animated.parallel([
       Animated.timing(heightAnim, {
-        toValue: expanded ? 60 : 3,
+        toValue: expanded ? height : 3,
         duration: ANIMATION_DURATION,
         easing: ANIMATION_EASING,
         useNativeDriver: false
@@ -8593,52 +9054,133 @@ function VelocityStrip({
         useNativeDriver: false
       })
     ]).start();
-  }, [expanded, variant, heightAnim, labelOpacity, infoOpacity]);
+  }, [expanded, variant, framed, height, heightAnim, labelOpacity, infoOpacity]);
+  if (set == null && velocities == null) return null;
+  const repCount = doneVelocities.length;
+  const miniLabel = set ? setAccessibilityLabel(set, repCount) : `Velocity strip, ${repCount} reps`;
   if (variant === "mini") {
     const { style: externalStyle, ...restProps } = props;
     return /* @__PURE__ */ jsx(
       View,
       {
         className,
-        style: [{ flexDirection: "row", height: 3, gap: 2, borderRadius: 2, overflow: "hidden" }, externalStyle],
+        style: [
+          { flexDirection: "row", height: 3, gap: REP_GAP, borderRadius: 2, overflow: "hidden" },
+          externalStyle
+        ],
         accessibilityRole: "image",
-        accessibilityLabel: `Velocity strip, ${velocities.length} reps`,
+        accessibilityLabel: miniLabel,
         testID: "velocity-strip-mini",
         ...restProps,
-        children: velocities.map((v, i) => /* @__PURE__ */ jsx(
+        children: slots.map((slot, i) => /* @__PURE__ */ jsx(
           View,
           {
             style: {
               flex: 1,
-              backgroundColor: barColorFor(v),
+              backgroundColor: slotColor(slot),
               borderRadius: 1,
               minWidth: 4,
-              height: "100%"
+              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
+        ))
+      }
+    );
+  }
+  if (!framed) {
+    const { style: externalStyle, ...restProps } = props;
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        className,
+        style: [
+          { flexDirection: "row", height, gap: REP_GAP, alignItems: "flex-end" },
+          externalStyle
+        ],
+        accessibilityRole: "image",
+        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: `velocity-bar-${i}`
+            testID: slot.kind === "rep" ? `velocity-bar-${i}` : `velocity-slot-${slot.kind}`
           },
           i
         ))
       }
     );
   }
-  const stripLabel = `Velocity chart for set, ${velocities.length} reps, tap to ${expanded ? "collapse" : "expand"}`;
+  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 stripContent = /* @__PURE__ */ jsxs(
-    Animated.View,
-    {
-      className: [className, expanded ? "bg-surface-raised" : "bg-transparent"].filter(Boolean).join(" "),
-      style: [
-        {
-          height: heightAnim,
-          width: "100%",
-          gap: 2,
+  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,
+      {
+        style: {
+          flex: 1,
+          height: "100%",
+          justifyContent: "flex-end",
+          marginLeft: slot.leadingGap
+        },
+        children: /* @__PURE__ */ jsx(
+          View,
+          {
+            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)
+          }
+        )
+      },
+      i
+    );
+  });
+  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,
-          paddingHorizontal: expanded ? 6 : 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"
         }
@@ -8648,46 +9190,65 @@ function VelocityStrip({
       testID: "velocity-strip",
       ...props,
       children: [
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { flexDirection: "row", flex: 1, gap: 2, alignItems: "flex-end" },
-            children: velocities.map((v, i) => {
-              const barBackground = barColorFor(v);
-              const barHeightPct = maxVelocity > 0 ? Math.round(v / (maxVelocity * 1.15) * 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 && /* @__PURE__ */ jsx(Animated.View, { style: { opacity: labelOpacity, alignItems: "center", position: "absolute", top: -13, left: 0, right: 0 }, accessibilityElementsHidden: true, children: /* @__PURE__ */ jsx(
+        /* @__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",
@@ -8695,30 +9256,30 @@ function VelocityStrip({
                         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
-                );
-              }
-              return bar;
-            })
+                    )
+                  }
+                ),
+                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
+            );
           }
-        ),
+          return bar;
+        }) }),
         expanded && showInfo && /* @__PURE__ */ jsxs(
           Animated.View,
           {
@@ -9016,233 +9577,90 @@ function Sparkline({
     }
   );
 }
-function formatAccessibilityLabel(setNumber, reps, weight, unit) {
-  const repsText = reps != null ? `${reps} reps` : "no reps";
-  const weightText = weight != null ? `at ${roundWeight(weight)} ${unit}` : "";
-  return `Set ${setNumber}: ${repsText}${weightText ? ` ${weightText}` : ""}`;
+var DARK = getSemanticColors("dark");
+var TEXT_ACTIVE = DARK["text-primary"];
+var TEXT_MUTED = DARK["text-secondary"];
+var COL = { set: 36, reps: 44, load: 56, rpe: 36 };
+var cellText = { fontFamily: "Inter, sans-serif", fontSize: 13, fontWeight: "600" };
+var typeBadge = {
+  fontSize: 10,
+  fontWeight: "700",
+  fontFamily: "Inter, sans-serif",
+  color: WORKOUT_TOKENS.scale.orange,
+  backgroundColor: "rgba(255,165,2,0.12)",
+  paddingVertical: 1,
+  paddingHorizontal: 5,
+  borderRadius: 3,
+  overflow: "hidden"
+};
+function displayReps(set) {
+  return set.state === "done" ? set.reps : set.target.reps;
+}
+function displayWeight(set) {
+  return set.state === "done" ? set.weight : set.target.weight;
+}
+function plannedReps(set) {
+  if (set.state === "done") return set.velocities.length;
+  if (set.state === "live") return set.target.reps;
+  return set.planned ?? set.target.reps;
+}
+function accessibilityLabel(set) {
+  const base = `Set ${set.setNumber}: ${displayReps(set)} reps at ${roundWeight(displayWeight(set))} ${set.unit}`;
+  if (set.state === "live") return `${base}, in progress`;
+  if (set.state === "todo") return `${base}, upcoming`;
+  return base;
+}
+function Cell({
+  width,
+  children,
+  testID
+}) {
+  return /* @__PURE__ */ jsx(View, { style: { width, alignItems: "center", justifyContent: "center" }, testID, children });
 }
-function SetRow({
-  mode,
-  setNumber,
-  previous,
-  reps,
-  weight,
-  rpe,
-  unit,
-  velocities,
-  velocityZones,
-  velocityLiveRepIndex,
-  velocityExpanded,
-  onVelocityToggle,
-  setType,
-  prBadges,
-  isNextSet,
-  targets
-}) {
-  const isActive = mode === "active";
-  const isCompleted = mode === "completed";
-  const rowStyle = {
-    flexDirection: "row",
-    alignItems: "center",
-    padding: 7,
-    paddingHorizontal: 8,
-    gap: 8,
-    borderRadius: 8
-  };
-  if (isActive && isNextSet) {
-    rowStyle.backgroundColor = "rgba(255,121,0,0.06)";
-    rowStyle.borderWidth = 1;
-    rowStyle.borderColor = "rgba(255,121,0,0.15)";
-  }
-  if (isCompleted && !isNextSet) {
-    rowStyle.opacity = 0.55;
+function RowStrip({ set }) {
+  const zones = set.velocityZones;
+  if (set.state === "live") {
+    return /* @__PURE__ */ jsx(
+      VelocityStrip,
+      {
+        variant: "expanded",
+        showNumbers: false,
+        showInfo: false,
+        height: 24,
+        scale: "fixed",
+        set: { type: "straight", velocities: set.velocities, planned: set.target.reps },
+        zones
+      }
+    );
   }
+  const velocities = set.state === "done" ? set.velocities : [];
+  return /* @__PURE__ */ jsx(
+    VelocityStrip,
+    {
+      variant: "mini",
+      set: { type: "straight", velocities, planned: plannedReps(set) },
+      zones
+    }
+  );
+}
+function SetRow(set) {
+  const live = set.state === "live";
+  const valueColor = live ? TEXT_ACTIVE : TEXT_MUTED;
+  const rpe = set.state === "todo" ? null : set.rpe;
   return /* @__PURE__ */ jsxs(
     View,
     {
-      style: rowStyle,
-      accessibilityLabel: formatAccessibilityLabel(
-        setNumber,
-        reps,
-        weight,
-        unit
-      ),
+      style: { paddingVertical: 6, paddingHorizontal: 8 },
+      accessibilityLabel: accessibilityLabel(set),
       testID: "set-row",
       children: [
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { width: 36, alignItems: "center", justifyContent: "center" },
-            testID: "set-row-set-number",
-            children: setType ? /* @__PURE__ */ jsx(
-              Text,
-              {
-                style: {
-                  fontSize: 10,
-                  fontWeight: "700",
-                  fontFamily: "Inter, sans-serif",
-                  color: WORKOUT_TOKENS.scale.orange,
-                  backgroundColor: "rgba(255,165,2,0.12)",
-                  paddingVertical: 1,
-                  paddingHorizontal: 5,
-                  borderRadius: 3,
-                  overflow: "hidden"
-                },
-                testID: "set-row-type-badge",
-                children: setType
-              }
-            ) : /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: "text-text-secondary",
-                style: {
-                  fontSize: 13,
-                  fontWeight: "600",
-                  fontFamily: "Inter, sans-serif"
-                },
-                children: setNumber
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            className: "flex-1",
-            testID: "set-row-previous",
-            children: /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: "text-text-secondary",
-                style: {
-                  fontSize: 12,
-                  fontFamily: "Inter, sans-serif"
-                },
-                children: previous ? `${previous.reps} x ${roundWeight(previous.weight)}` : "\u2014"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { width: 44, alignItems: "center", justifyContent: "center" },
-            testID: "set-row-reps",
-            children: isActive && reps == null && targets ? /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: "text-text-tertiary",
-                style: {
-                  fontSize: 13,
-                  fontStyle: "italic",
-                  fontFamily: "Inter, sans-serif"
-                },
-                testID: "set-row-target-reps",
-                children: targets.reps
-              }
-            ) : /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: reps != null ? "text-text-primary" : "text-text-tertiary",
-                style: {
-                  fontSize: 14,
-                  fontWeight: "600",
-                  fontFamily: "Inter, sans-serif"
-                },
-                children: reps != null ? reps : "\u2014"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { width: 56, alignItems: "center", justifyContent: "center" },
-            testID: "set-row-weight",
-            children: isActive && weight == null && targets ? /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: "text-text-tertiary",
-                style: {
-                  fontSize: 13,
-                  fontStyle: "italic",
-                  fontFamily: "Inter, sans-serif"
-                },
-                testID: "set-row-target-weight",
-                children: roundWeight(targets.weight)
-              }
-            ) : /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: weight != null ? "text-text-primary" : "text-text-tertiary",
-                style: {
-                  fontSize: 14,
-                  fontWeight: "600",
-                  fontFamily: "Inter, sans-serif"
-                },
-                children: weight != null ? roundWeight(weight) : "\u2014"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { width: 36, alignItems: "center", justifyContent: "center" },
-            testID: "set-row-rpe",
-            children: /* @__PURE__ */ jsx(
-              Text,
-              {
-                className: rpe != null ? void 0 : "text-text-tertiary",
-                style: {
-                  fontSize: 13,
-                  fontWeight: "600",
-                  fontFamily: "Inter, sans-serif",
-                  // rpeColor returns a concrete hex (native-safe); only the tertiary
-                  // fallback needs the className token.
-                  color: rpe != null ? rpeColor(rpe) : void 0
-                },
-                children: rpe != null ? roundRpe(rpe) : "\u2014"
-              }
-            )
-          }
-        ),
-        prBadges && prBadges.length > 0 && /* @__PURE__ */ jsx(
-          View,
-          {
-            className: "flex-row items-center",
-            style: { gap: 4 },
-            testID: "set-row-pr-badges",
-            children: prBadges.map((badge, i) => /* @__PURE__ */ jsx(
-              PrBadge,
-              {
-                type: badge.type,
-                label: badge.label,
-                animate: false,
-                compact: true
-              },
-              i
-            ))
-          }
-        ),
-        velocities && velocities.length > 0 && /* @__PURE__ */ jsx(
-          View,
-          {
-            style: { position: "absolute", bottom: 0, left: 8, right: 8 },
-            testID: "set-row-velocity-strip",
-            children: /* @__PURE__ */ jsx(
-              VelocityStrip,
-              {
-                velocities,
-                zones: velocityZones,
-                liveRepIndex: velocityLiveRepIndex,
-                expanded: velocityExpanded,
-                onToggle: onVelocityToggle,
-                variant: onVelocityToggle ? "full" : "mini"
-              }
-            )
-          }
-        )
+        /* @__PURE__ */ jsxs(View, { className: "flex-row items-center", style: { justifyContent: "space-between" }, children: [
+          /* @__PURE__ */ jsx(Cell, { width: COL.set, testID: "set-row-set-number", children: set.setType ? /* @__PURE__ */ jsx(Text, { style: typeBadge, testID: "set-row-type-badge", children: set.setType }) : /* @__PURE__ */ jsx(Text, { style: { ...cellText, color: valueColor, fontWeight: live ? "700" : "600" }, children: set.setNumber }) }),
+          /* @__PURE__ */ jsx(Cell, { width: COL.reps, testID: "set-row-reps", children: /* @__PURE__ */ jsx(Text, { style: { ...cellText, color: valueColor }, children: displayReps(set) }) }),
+          /* @__PURE__ */ jsx(Cell, { width: COL.load, testID: "set-row-weight", children: /* @__PURE__ */ jsx(Text, { style: { ...cellText, color: valueColor }, children: roundWeight(displayWeight(set)) }) }),
+          /* @__PURE__ */ jsx(Cell, { width: COL.rpe, testID: "set-row-rpe", children: /* @__PURE__ */ jsx(Text, { style: { ...cellText, color: TEXT_MUTED }, children: rpe != null ? roundRpe(rpe) : "\u2014" }) })
+        ] }),
+        /* @__PURE__ */ jsx(View, { style: { marginTop: live ? 6 : 4 }, testID: "set-row-strip", children: /* @__PURE__ */ jsx(RowStrip, { set }) })
       ]
     }
   );
@@ -9413,14 +9831,18 @@ function RestTimer({
   visible,
   displayOnly = false
 }) {
-  if (!visible) return null;
-  const remainingMs = Math.max(0, totalSeconds * 1e3 - elapsedMs);
+  const {
+    remainingMs,
+    progress,
+    label: timeDisplay
+  } = useTimer({
+    mode: "down",
+    durationMs: totalSeconds * 1e3,
+    elapsedMs
+  });
   const remainingSec = Math.ceil(remainingMs / 1e3);
-  const minutes = Math.floor(remainingSec / 60);
-  const seconds = remainingSec % 60;
-  const timeDisplay = `${minutes}:${String(seconds).padStart(2, "0")}`;
-  const totalMs = totalSeconds * 1e3;
-  const progressPct = totalMs > 0 ? Math.min(100, elapsedMs / totalMs * 100) : 100;
+  const progressPct = progress * 100;
+  if (!visible) return null;
   return /* @__PURE__ */ jsxs(
     View,
     {
@@ -9578,15 +10000,319 @@ function RestTimer({
     }
   );
 }
-function buildColumnHeaders(unit) {
-  return ["SET", "PREV", "REPS", unit.toUpperCase(), "RPE"];
+var t8 = getSemanticColors("dark");
+var TIMES = "\xD7";
+var AT = "@";
+function SetsRepsLoad({
+  sets,
+  reps,
+  load,
+  unit = "lb",
+  className,
+  ...props
+}) {
+  const value = t8["text-primary"];
+  const sep = t8["text-tertiary"];
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: { flexDirection: "row", alignItems: "baseline" },
+      accessibilityLabel: `${sets} sets of ${reps} reps at ${load} ${unit}`,
+      testID: "sets-reps-load",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(MetricCell, { color: value, children: sets }),
+        /* @__PURE__ */ jsx(MetricCell, { color: sep, children: ` ${TIMES} ` }),
+        /* @__PURE__ */ jsx(MetricCell, { color: value, children: reps }),
+        /* @__PURE__ */ jsx(MetricCell, { color: sep, children: ` ${AT} ` }),
+        /* @__PURE__ */ jsx(MetricCell, { color: value, children: load }),
+        /* @__PURE__ */ jsx(MetricCell, { color: sep, children: ` ${unit}` })
+      ]
+    }
+  );
 }
-function getSupersetBorderRadius(position) {
-  switch (position) {
-    case "first":
-      return {
-        borderTopLeftRadius: 12,
-        borderTopRightRadius: 12,
+// 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"],
+  behind: getSemanticColors("dark")["status-warning"],
+  neutral: primitiveRamps.cyan[400]
+};
+function paceToneColor(tone) {
+  return PACE_TONE_COLORS[tone];
+}
+// src/components/custom/Workout/SegmentedProgressBar.tsx
+var DEFAULT_MARKER_COLOR = primitiveRamps.green[500];
+function SegmentedProgressBar({
+  segments,
+  value,
+  target,
+  markerColor = DEFAULT_MARKER_COLOR,
+  color,
+  height,
+  gap,
+  ...props
+}) {
+  const total = segments.reduce((sum, s) => sum + s.weight, 0);
+  const fillColor = color ?? paceToneColor(paceTone(total > 0 ? value / total : 0, target));
+  const barSegments = segments.map((seg, i) => {
+    const cumulativeBefore = segments.slice(0, i).reduce((sum, s) => sum + s.weight, 0);
+    const fill = Math.max(0, Math.min(1, (value - cumulativeBefore) / seg.weight));
+    return { weight: seg.weight, fill, color: fillColor };
+  });
+  return /* @__PURE__ */ jsx(
+    SegmentedBar,
+    {
+      segments: barSegments,
+      marker: target != null ? { position: target, color: markerColor } : null,
+      height,
+      gap,
+      ...props
+    }
+  );
+}
+// src/components/custom/Workout/MetricTiles.tsx
+function MetricTiles({ metrics, gap = 1, ...props }) {
+  return /* @__PURE__ */ jsx(HStack, { gap, align: "stretch", ...props, children: metrics.map((metric) => /* @__PURE__ */ jsx(
+    Tile,
+    {
+      label: metric.label,
+      value: metric.value,
+      valueColor: metric.valueColor
+    },
+    metric.label
+  )) });
+}
+var DAY_MS = 24 * 60 * 60 * 1e3;
+var SOON_ACCENT = primitiveRamps.orange[400];
+function compactUntil(ms) {
+  if (ms <= 0) return "now";
+  const min = Math.round(ms / 6e4);
+  if (min < 60) return `${min}m`;
+  const hr = Math.round(min / 60);
+  if (hr < 24) return `${hr}h`;
+  const d = Math.round(hr / 24);
+  if (d < 7) return `${d}d`;
+  return `${Math.round(d / 7)}w`;
+}
+function ScheduleTiles({ when, now, gap = 1, ...props }) {
+  const [mountNow] = useState(() => Date.now());
+  const reference = now ?? mountNow;
+  const whenMs = when instanceof Date ? when.getTime() : when;
+  const soon = whenMs - reference < DAY_MS;
+  const time = new Date(whenMs).toLocaleTimeString(void 0, {
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true
+  });
+  return /* @__PURE__ */ jsxs(HStack, { gap, ...props, children: [
+    /* @__PURE__ */ jsx(Tile, { label: "Date", value: formatDateTime(when, "short") }),
+    /* @__PURE__ */ jsx(Tile, { label: "Time", value: time }),
+    /* @__PURE__ */ jsx(
+      Tile,
+      {
+        label: "Until",
+        value: compactUntil(whenMs - reference),
+        valueColor: soon ? SOON_ACCENT : void 0
+      }
+    )
+  ] });
+}
+var t9 = getSemanticColors("dark");
+var INDICATOR_CONFIG = {
+  imbalance: { Icon: ScaleIcon, color: t9["status-error"], label: "Left/right imbalance" },
+  overshoot: { Icon: AlertTriangleIcon, color: t9["status-error"], label: "Load overshoot" },
+  "velocity-loss": { Icon: TrendingDownIcon, color: t9["status-warning"], label: "Velocity loss" },
+  "missed-reps": { Icon: CircleSlashIcon, color: t9["status-warning"], label: "Missed reps" },
+  pr: { Icon: AwardIcon, color: t9["status-success"], label: "Personal record" },
+  info: { Icon: InfoIcon, color: t9["status-info"], label: "More info" }
+};
+var INDICATOR_PRECEDENCE = [
+  "imbalance",
+  "overshoot",
+  "velocity-loss",
+  "missed-reps",
+  "pr",
+  "info"
+];
+function resolveIndicator(candidates) {
+  return INDICATOR_PRECEDENCE.find((kind) => candidates.includes(kind));
+}
+function ExerciseIndicator({ kind, onPress, className, ...props }) {
+  const { Icon, color, label } = INDICATOR_CONFIG[kind];
+  const chip = /* @__PURE__ */ jsx(
+    View,
+    {
+      className,
+      style: {
+        width: 16,
+        height: 16,
+        borderRadius: 8,
+        borderWidth: 1,
+        borderColor: color,
+        alignItems: "center",
+        justifyContent: "center"
+      },
+      accessibilityRole: "image",
+      accessibilityLabel: label,
+      testID: "exercise-indicator",
+      ...props,
+      children: /* @__PURE__ */ jsx(Icon, { size: 11, color })
+    }
+  );
+  if (onPress) {
+    return /* @__PURE__ */ jsx(Pressable, { onPress, accessibilityRole: "button", accessibilityLabel: label, children: chip });
+  }
+  return chip;
+}
+function headingLabel(name, sets, reps, load, unit) {
+  return `${name}, ${sets}\xD7${reps} @ ${roundWeight(load)} ${unit}`;
+}
+function ExerciseHeading({
+  name,
+  sets,
+  reps,
+  load,
+  unit = "lbs",
+  tempo,
+  indicator,
+  dimmed,
+  onPress
+}) {
+  return /* @__PURE__ */ jsxs(View, { style: { opacity: dimmed ? 0.55 : 1 }, testID: "exercise-heading", children: [
+    /* @__PURE__ */ jsxs(
+      Pressable,
+      {
+        onPress,
+        accessibilityRole: "button",
+        accessibilityLabel: headingLabel(name, sets, reps, load, unit),
+        className: "flex-row items-center",
+        style: { gap: 8 },
+        testID: "exercise-card-header",
+        children: [
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              className: "text-text-primary",
+              style: { fontSize: 14, fontFamily: '"Space Grotesk", sans-serif', fontWeight: "700" },
+              testID: "exercise-card-name",
+              children: name
+            }
+          ),
+          /* @__PURE__ */ jsx(View, { className: "flex-1" }),
+          indicator && /* @__PURE__ */ jsx(ExerciseIndicator, { kind: indicator })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      View,
+      {
+        className: "flex-row items-center",
+        style: { gap: 8, marginTop: 1 },
+        testID: "exercise-card-summary",
+        children: [
+          /* @__PURE__ */ jsx(SetsRepsLoad, { sets, reps, load, unit }),
+          /* @__PURE__ */ jsx(View, { className: "flex-1" }),
+          tempo && /* @__PURE__ */ jsx(TempoDisplay, { tempo, size: "sm", showLabel: false, showInfo: false })
+        ]
+      }
+    )
+  ] });
+}
+function ExerciseCardHeading({
+  setStates,
+  stripHeight = 8,
+  dimmed,
+  testID = "exercise-card",
+  ...heading
+}) {
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: { paddingVertical: 9, paddingHorizontal: 12, opacity: dimmed ? 0.55 : 1 },
+      testID,
+      children: [
+        /* @__PURE__ */ jsx(ExerciseHeading, { ...heading }),
+        setStates.length > 0 && /* @__PURE__ */ jsx(View, { style: { marginTop: 7 }, testID: "exercise-card-strip", children: /* @__PURE__ */ jsx(SetStrip, { sets: setStates, height: stripHeight }) })
+      ]
+    }
+  );
+}
+var PREV_COLUMN = { label: "PREV", width: void 0 };
+function buildColumns(unit, showPrevious) {
+  return [
+    { label: "SET", width: 36 },
+    ...showPrevious ? [PREV_COLUMN] : [],
+    { label: "REPS", width: 44 },
+    { label: unit.toUpperCase(), width: 56 },
+    { label: "RPE", width: 36 }
+  ];
+}
+function SetTableHeader({
+  unit = "lbs",
+  showPrevious = true,
+  testID = "table-header"
+}) {
+  const columns = buildColumns(unit, showPrevious);
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      className: "flex-row",
+      style: {
+        paddingVertical: 8,
+        paddingHorizontal: 8,
+        paddingBottom: 4,
+        ...showPrevious ? {} : { justifyContent: "space-between" }
+      },
+      testID,
+      children: columns.map(({ label, width }) => {
+        const isFlex = width === void 0;
+        return /* @__PURE__ */ jsx(
+          View,
+          {
+            style: {
+              ...isFlex ? { minWidth: 44 } : { width, flexShrink: 1 },
+              alignItems: "center",
+              justifyContent: "center",
+              gap: 8
+            },
+            ...isFlex ? { className: "flex-1" } : {},
+            children: /* @__PURE__ */ jsx(
+              Text,
+              {
+                className: "text-text-tertiary",
+                style: {
+                  fontSize: 10,
+                  fontWeight: "600",
+                  fontFamily: "Inter, sans-serif",
+                  textTransform: "uppercase",
+                  letterSpacing: 0.8
+                },
+                children: label
+              }
+            )
+          },
+          label
+        );
+      })
+    }
+  );
+}
+// src/components/custom/Workout/ExerciseCard.tsx
+function getSupersetBorderRadius(position) {
+  switch (position) {
+    case "first":
+      return {
+        borderTopLeftRadius: 12,
+        borderTopRightRadius: 12,
         borderBottomLeftRadius: 8,
         borderBottomRightRadius: 8
       };
@@ -9623,7 +10349,7 @@ function formatSummary(summary) {
   if (!summary) return "";
   return `${summary.sets}\xD7${summary.reps} @ ${roundWeight(summary.weight)} ${summary.unit}`;
 }
-function formatAccessibilityLabel2(name, summary, prescription) {
+function formatAccessibilityLabel(name, summary, prescription) {
   if (summary) return `${name}, ${formatSummary(summary)}`;
   if (prescription) return `${name}, ${prescription}`;
   return name;
@@ -9632,7 +10358,6 @@ function CollapsedCard({
   name,
   onToggle,
   summary,
-  e1rm,
   isPR,
   setVelocities,
   velocityZones,
@@ -9651,7 +10376,7 @@ function CollapsedCard({
       onPressIn: () => setPressed(true),
       onPressOut: () => setPressed(false),
       accessibilityRole: "button",
-      accessibilityLabel: formatAccessibilityLabel2(name, summary, void 0),
+      accessibilityLabel: formatAccessibilityLabel(name, summary, void 0),
       testID: "exercise-card",
       children: /* @__PURE__ */ jsxs(
         View,
@@ -9665,100 +10390,93 @@ function CollapsedCard({
             ...supersetMargin
           },
           children: [
-            /* @__PURE__ */ jsxs(
-              View,
-              {
-                className: "flex-row items-center",
-                testID: "exercise-card-header",
-                children: [
-                  /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      className: "text-text-primary",
-                      style: {
-                        fontSize: 14,
-                        fontFamily: '"Space Grotesk", sans-serif',
-                        fontWeight: "700"
-                      },
-                      testID: "exercise-card-name",
-                      children: name
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(View, { className: "flex-1" }),
-                  summary && /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      className: "text-text-secondary",
-                      style: {
-                        fontSize: 12,
-                        fontFamily: "Inter, sans-serif",
-                        marginRight: 8
-                      },
-                      testID: "exercise-card-summary",
-                      children: formatSummary(summary)
-                    }
-                  ),
-                  e1rm && /* @__PURE__ */ jsx(
-                    WeightBadge,
-                    {
-                      value: roundWeight(e1rm.value),
-                      unit: e1rm.unit,
-                      size: "sm",
-                      showIcon: false,
-                      testID: "exercise-card-e1rm"
-                    }
-                  ),
-                  isPR && /* @__PURE__ */ jsx(View, { style: { marginLeft: 4 }, children: /* @__PURE__ */ jsx(PrBadge, { type: "e1rm", compact: true, animate: false }) })
-                ]
-              }
-            ),
-            (completedSets > 0 || remaining > 0) && /* @__PURE__ */ jsxs(
-              View,
-              {
-                className: "flex-row",
-                style: { marginTop: 6, gap: 4 },
-                testID: "exercise-card-strips",
-                children: [
-                  setVelocities?.map((velocities, i) => /* @__PURE__ */ jsx(
-                    VelocityStrip,
-                    {
-                      velocities,
-                      zones: velocityZones,
-                      variant: "mini",
-                      testID: `exercise-card-velocity-strip-${i}`
-                    },
-                    i
-                  )),
-                  Array.from({ length: remaining }, (_, i) => /* @__PURE__ */ jsx(
-                    PlaceholderStrip,
-                    {
-                      testID: `exercise-card-placeholder-${i}`
-                    },
-                    `placeholder-${i}`
-                  ))
-                ]
-              }
-            )
+            /* @__PURE__ */ jsxs(View, { className: "flex-row items-center", testID: "exercise-card-header", children: [
+              /* @__PURE__ */ jsx(
+                Text,
+                {
+                  className: "text-text-primary",
+                  style: {
+                    fontSize: 14,
+                    fontFamily: '"Space Grotesk", sans-serif',
+                    fontWeight: "700"
+                  },
+                  testID: "exercise-card-name",
+                  children: name
+                }
+              ),
+              /* @__PURE__ */ jsx(View, { className: "flex-1" }),
+              summary && /* @__PURE__ */ jsx(
+                Text,
+                {
+                  className: "text-text-secondary",
+                  style: {
+                    fontSize: 12,
+                    fontFamily: "Inter, sans-serif",
+                    marginRight: 8
+                  },
+                  testID: "exercise-card-summary",
+                  children: formatSummary(summary)
+                }
+              ),
+              isPR && /* @__PURE__ */ jsx(View, { style: { marginLeft: 4 }, children: /* @__PURE__ */ jsx(PrBadge, { type: "e1rm", compact: true, animate: false }) })
+            ] }),
+            (completedSets > 0 || remaining > 0) && /* @__PURE__ */ jsxs(View, { className: "flex-row", style: { marginTop: 6, gap: 4 }, testID: "exercise-card-strips", children: [
+              setVelocities?.map((velocities, i) => /* @__PURE__ */ jsx(
+                VelocityStrip,
+                {
+                  velocities,
+                  zones: velocityZones,
+                  variant: "mini",
+                  testID: `exercise-card-velocity-strip-${i}`
+                },
+                i
+              )),
+              Array.from({ length: remaining }, (_, i) => /* @__PURE__ */ jsx(
+                PlaceholderStrip,
+                {
+                  testID: `exercise-card-placeholder-${i}`
+                },
+                `placeholder-${i}`
+              ))
+            ] })
           ]
         }
       )
     }
   );
 }
+var DARK2 = getSemanticColors("dark");
+var BODY_DIVIDER = DARK2["border-subtle"];
+function deriveHeaderSetStates(sets) {
+  return sets.map((set) => {
+    switch (set.state) {
+      case "live":
+        return { status: "active", velocities: set.velocities, planned: set.target.reps };
+      case "done":
+        return { status: "done", velocities: set.velocities };
+      case "todo":
+        return { status: "todo", planned: set.planned ?? set.target.reps };
+    }
+  });
+}
 function ExpandedCard({
   name,
   onToggle,
   summary,
-  e1rm,
   isPR,
   sets,
   tempo,
+  indicator,
+  setStates,
+  stripHeight = 8,
+  velocityZones,
   supersetPosition
 }) {
   const borderRadius = getSupersetBorderRadius(supersetPosition);
   const supersetMargin = getSupersetMargin(supersetPosition);
   const unit = summary?.unit ?? sets?.[0]?.unit ?? "lbs";
-  const columnHeaders = buildColumnHeaders(unit);
+  const headerStates = setStates ?? (sets ? deriveHeaderSetStates(sets) : []);
+  const headerIndicator = indicator ?? (isPR ? "pr" : void 0);
   return /* @__PURE__ */ jsxs(
     View,
     {
@@ -9771,114 +10489,32 @@ function ExpandedCard({
       testID: "exercise-card",
       children: [
         /* @__PURE__ */ jsx(
-          Pressable,
+          ExerciseCardHeading,
           {
+            name,
+            sets: summary?.sets ?? sets?.length ?? 0,
+            reps: summary?.reps ?? 0,
+            load: summary?.weight ?? 0,
+            unit,
+            tempo,
+            indicator: headerIndicator,
+            setStates: headerStates,
+            stripHeight,
             onPress: onToggle,
-            accessibilityRole: "button",
-            accessibilityLabel: formatAccessibilityLabel2(name, summary, void 0),
-            "aria-expanded": true,
-            testID: "exercise-card-header",
-            children: /* @__PURE__ */ jsxs(
-              View,
-              {
-                className: "flex-row items-center",
-                style: {
-                  padding: 12,
-                  paddingHorizontal: 14,
-                  paddingBottom: 10,
-                  borderBottomWidth: 1,
-                  borderBottomColor: resolveColor("border-default")
-                },
-                children: [
-                  /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      className: "text-text-primary",
-                      style: {
-                        fontSize: 14,
-                        fontFamily: '"Space Grotesk", sans-serif',
-                        fontWeight: "700"
-                      },
-                      testID: "exercise-card-name",
-                      children: name
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(View, { className: "flex-1" }),
-                  summary && /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      className: "text-text-secondary",
-                      style: {
-                        fontSize: 12,
-                        fontFamily: "Inter, sans-serif",
-                        marginRight: 8
-                      },
-                      testID: "exercise-card-summary",
-                      children: formatSummary(summary)
-                    }
-                  ),
-                  e1rm && /* @__PURE__ */ jsx(
-                    WeightBadge,
-                    {
-                      value: roundWeight(e1rm.value),
-                      unit: e1rm.unit,
-                      size: "sm",
-                      showIcon: false,
-                      testID: "exercise-card-e1rm"
-                    }
-                  ),
-                  isPR && /* @__PURE__ */ jsx(View, { style: { marginLeft: 4 }, children: /* @__PURE__ */ jsx(PrBadge, { type: "e1rm", compact: true, animate: false }) })
-                ]
-              }
-            )
+            testID: "exercise-card-heading"
           }
         ),
-        tempo && /* @__PURE__ */ jsx(View, { style: { marginTop: 8, paddingHorizontal: 14 }, testID: "exercise-card-tempo", children: /* @__PURE__ */ jsx(TempoDisplay, { tempo, size: "sm" }) }),
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxs(
           View,
           {
-            className: "flex-row",
-            style: {
-              paddingVertical: 8,
-              paddingHorizontal: 8,
-              paddingBottom: 4
-            },
-            testID: "exercise-card-column-headers",
-            children: columnHeaders.map((header, i) => {
-              const widths = [36, void 0, 44, 56, 36];
-              const width = widths[i];
-              const isFlex = width === void 0;
-              return /* @__PURE__ */ jsx(
-                View,
-                {
-                  style: {
-                    ...isFlex ? {} : { width },
-                    alignItems: "center",
-                    justifyContent: "center",
-                    gap: 8
-                  },
-                  ...isFlex ? { className: "flex-1" } : {},
-                  children: /* @__PURE__ */ jsx(
-                    Text,
-                    {
-                      className: "text-text-tertiary",
-                      style: {
-                        fontSize: 10,
-                        fontWeight: "600",
-                        fontFamily: "Inter, sans-serif",
-                        textTransform: "uppercase",
-                        letterSpacing: 0.8
-                      },
-                      children: header
-                    }
-                  )
-                },
-                header
-              );
-            })
+            style: { borderTopWidth: 1, borderTopColor: BODY_DIVIDER, paddingBottom: 6 },
+            testID: "exercise-card-body",
+            children: [
+              /* @__PURE__ */ jsx(SetTableHeader, { unit, showPrevious: false, testID: "exercise-card-column-headers" }),
+              sets && /* @__PURE__ */ jsx(View, { testID: "exercise-card-sets", children: sets.map((set, i) => /* @__PURE__ */ jsx(SetRow, { ...set, velocityZones: set.velocityZones ?? velocityZones }, i)) })
+            ]
           }
-        ),
-        sets && /* @__PURE__ */ jsx(View, { testID: "exercise-card-sets", children: sets.map((setProps, i) => /* @__PURE__ */ jsx(SetRow, { ...setProps }, i)) })
+        )
       ]
     }
   );
@@ -9887,11 +10523,12 @@ function UpcomingCard({
   name,
   prescription,
   previousBest,
-  supersetPosition
+  supersetPosition,
+  onToggle
 }) {
   const borderRadius = getSupersetBorderRadius(supersetPosition);
   const supersetMargin = getSupersetMargin(supersetPosition);
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Pressable, { onPress: onToggle, accessibilityRole: "button", children: /* @__PURE__ */ jsx(
     View,
     {
       style: {
@@ -9901,7 +10538,7 @@ function UpcomingCard({
         ...borderRadius,
         ...supersetMargin
       },
-      accessibilityLabel: formatAccessibilityLabel2(name, void 0, prescription),
+      accessibilityLabel: formatAccessibilityLabel(name, void 0, prescription),
       testID: "exercise-card",
       children: /* @__PURE__ */ jsxs(View, { className: "flex-row items-center", children: [
         /* @__PURE__ */ jsx(
@@ -9909,6 +10546,7 @@ function UpcomingCard({
           {
             className: "text-text-primary",
             style: {
+              flexShrink: 0,
               fontSize: 14,
               fontFamily: '"Space Grotesk", sans-serif',
               fontWeight: "700"
@@ -9921,7 +10559,9 @@ function UpcomingCard({
           Text,
           {
             className: "text-text-secondary",
+            numberOfLines: 1,
             style: {
+              flexShrink: 1,
               fontSize: 12,
               fontFamily: "Inter, sans-serif",
               marginLeft: 8
@@ -9930,12 +10570,14 @@ function UpcomingCard({
             children: prescription
           }
         ),
-        /* @__PURE__ */ jsx(View, { className: "flex-1" }),
+        /* @__PURE__ */ jsx(View, { className: "flex-1", style: { minWidth: 8 } }),
         previousBest && /* @__PURE__ */ jsx(
           Text,
           {
             className: "text-text-tertiary",
+            numberOfLines: 1,
             style: {
+              flexShrink: 1,
               fontSize: 11,
               fontFamily: "Inter, sans-serif"
             },
@@ -9945,17 +10587,208 @@ function UpcomingCard({
         )
       ] })
     }
+  ) });
+}
+function ExerciseCard({
+  upcoming,
+  expanded,
+  defaultExpanded,
+  onExpandedChange,
+  ...rest
+}) {
+  const [internalExpanded, setInternalExpanded] = useState(defaultExpanded ?? false);
+  const isControlled = expanded !== void 0;
+  const isExpanded = isControlled ? expanded : internalExpanded;
+  const onToggle = () => {
+    const next = !isExpanded;
+    onExpandedChange?.(next);
+    if (!isControlled) setInternalExpanded(next);
+  };
+  if (upcoming) return /* @__PURE__ */ jsx(UpcomingCard, { ...rest, onToggle });
+  return isExpanded ? /* @__PURE__ */ jsx(ExpandedCard, { ...rest, onToggle }) : /* @__PURE__ */ jsx(CollapsedCard, { ...rest, onToggle });
+}
+var t10 = getSemanticColors("dark");
+var RAISED = primitiveColors.charcoal[400];
+var BAR_HEIGHT = 9;
+var BAR_GAP = 3;
+function SessionHeader({
+  title,
+  plan,
+  setsDone = 0,
+  elapsedMs,
+  budgetMs,
+  running = true,
+  metrics = [],
+  next,
+  className,
+  style,
+  ...props
+}) {
+  const upcoming = next != null;
+  const totalSets = plan.reduce((sum, e) => sum + e.sets, 0);
+  const hasPace = !upcoming && budgetMs != null && elapsedMs != null;
+  const target = hasPace ? elapsedMs / budgetMs : void 0;
+  const setsLabel = upcoming ? `${totalSets} sets` : `${Math.floor(setsDone)}/${totalSets} sets`;
+  const setsLabelColor = upcoming ? t10["text-secondary"] : paceToneColor(paceTone(totalSets > 0 ? setsDone / totalSets : 0, target));
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [
+        {
+          backgroundColor: RAISED,
+          paddingTop: 11,
+          paddingRight: 12,
+          paddingBottom: 12,
+          paddingLeft: 12,
+          zIndex: 2
+        },
+        style
+      ],
+      testID: "session-rail-header",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            accessibilityRole: "header",
+            style: {
+              fontSize: 16,
+              lineHeight: 18,
+              fontWeight: "700",
+              fontFamily: '"Space Grotesk", sans-serif',
+              color: t10["text-primary"],
+              marginBottom: 10
+            },
+            testID: "session-rail-title",
+            children: title
+          }
+        ),
+        upcoming ? /* @__PURE__ */ jsx(ScheduleTiles, { when: next }) : /* @__PURE__ */ jsx(MetricTiles, { metrics }),
+        /* @__PURE__ */ jsxs(View, { style: { marginTop: 10 }, children: [
+          /* @__PURE__ */ jsx(
+            SegmentedProgressBar,
+            {
+              segments: plan.map((e) => ({ weight: e.sets })),
+              value: upcoming ? 0 : setsDone,
+              target,
+              height: BAR_HEIGHT,
+              gap: BAR_GAP
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            View,
+            {
+              style: {
+                flexDirection: "row",
+                justifyContent: "space-between",
+                alignItems: "baseline",
+                marginTop: 5
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  Typography,
+                  {
+                    variant: "mono",
+                    style: { fontSize: 10, color: setsLabelColor },
+                    testID: "session-rail-sets",
+                    children: setsLabel
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  TimerReadout,
+                  {
+                    mode: "up",
+                    elapsedMs: upcoming ? budgetMs : elapsedMs,
+                    durationMs: budgetMs,
+                    running: running && !upcoming,
+                    showTotal: budgetMs != null && !upcoming
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      ]
+    }
   );
 }
-function ExerciseCard(props) {
-  switch (props.state) {
-    case "collapsed":
-      return /* @__PURE__ */ jsx(CollapsedCard, { ...props });
-    case "expanded":
-      return /* @__PURE__ */ jsx(ExpandedCard, { ...props });
-    case "upcoming":
-      return /* @__PURE__ */ jsx(UpcomingCard, { ...props });
-  }
+var INSET = primitiveColors.charcoal[800];
+var DIVIDER = primitiveColors.charcoal[500];
+var DEFAULT_WIDTH = 246;
+function SessionRail({
+  title,
+  exercises,
+  setsDone,
+  elapsedMs,
+  budgetMs,
+  running,
+  metrics,
+  next,
+  stripHeight = 8,
+  width = DEFAULT_WIDTH,
+  onExercisePress,
+  className,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ width, flexDirection: "column", backgroundColor: INSET }, style],
+      testID: "session-rail",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          SessionHeader,
+          {
+            title,
+            plan: exercises.map((ex) => ({ name: ex.name, sets: ex.summary.sets })),
+            setsDone,
+            elapsedMs,
+            budgetMs,
+            running,
+            metrics,
+            next
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          View,
+          {
+            style: [{ flex: 1, backgroundColor: INSET }, neumorphicShadows.charcoal.pressed.subtle],
+            testID: "session-rail-list",
+            children: exercises.map((ex, i) => /* @__PURE__ */ jsx(
+              View,
+              {
+                style: {
+                  borderBottomWidth: i < exercises.length - 1 ? 1 : 0,
+                  borderBottomColor: DIVIDER
+                },
+                children: /* @__PURE__ */ jsx(
+                  ExerciseCardHeading,
+                  {
+                    name: ex.name,
+                    sets: ex.summary.sets,
+                    reps: ex.summary.reps,
+                    load: ex.summary.weight,
+                    unit: ex.summary.unit,
+                    tempo: ex.tempo,
+                    indicator: ex.indicator,
+                    setStates: ex.setStates,
+                    stripHeight,
+                    dimmed: ex.upcoming,
+                    onPress: () => onExercisePress?.(ex, i)
+                  }
+                )
+              },
+              ex.id ?? i
+            ))
+          }
+        )
+      ]
+    }
+  );
 }
 var DEFAULTS = {
   label: "SS",
@@ -10219,10 +11052,10 @@ function WeekRow({
     }
   );
 }
-var t8 = getSemanticColors("dark");
+var t11 = getSemanticColors("dark");
 var COLORS = {
-  statusSuccess: t8["status-success"],
-  brandPrimary: t8["brand-primary"],
+  statusSuccess: t11["status-success"],
+  brandPrimary: t11["brand-primary"],
   borderDefault: "#1F1F1F",
   brandPrimarySubtle: "rgba(255,121,0,0.06)"
 };
@@ -10706,12 +11539,12 @@ function PrHistoryModal({
     }
   );
 }
-var t9 = getSemanticColors("dark");
-var BRAND_PRIMARY9 = t9["brand-primary"];
+var t12 = getSemanticColors("dark");
+var BRAND_PRIMARY9 = t12["brand-primary"];
 var BRAND_PRIMARY_SUBTLE = "rgba(255,121,0,0.12)";
-var STATUS_SUCCESS = t9["status-success"];
-var STATUS_WARNING = t9["status-warning"];
-var STATUS_ERROR2 = t9["status-error"];
+var STATUS_SUCCESS = t12["status-success"];
+var STATUS_WARNING = t12["status-warning"];
+var STATUS_ERROR2 = t12["status-error"];
 var EMOJI_SETS = {
   sleep: ["\u{1F634}", "\u{1F610}", "\u{1F642}", "\u{1F60A}", "\u{1F929}"],
   soreness: ["\u{1F635}", "\u{1F623}", "\u{1F610}", "\u{1F642}", "\u{1F4AA}"],
@@ -10901,13 +11734,13 @@ function ReadinessCheck({
     )
   ] }) });
 }
-var t10 = getSemanticColors("dark");
-var BRAND_PRIMARY10 = t10["brand-primary"];
+var t13 = getSemanticColors("dark");
+var BRAND_PRIMARY10 = t13["brand-primary"];
 var BRAND_PRIMARY_DARK2 = MESO_ACCENT_GRADIENT_DARK;
 var BRAND_PRIMARY_LIGHT2 = MESO_ACCENT_GRADIENT_LIGHT;
-var SUCCESS = t10["status-success"];
-var WARNING = t10["status-warning"];
-var ERROR = t10["status-error"];
+var SUCCESS = t13["status-success"];
+var WARNING = t13["status-warning"];
+var ERROR = t13["status-error"];
 var ACCENT_STOPS2 = [BRAND_PRIMARY_DARK2, BRAND_PRIMARY10, BRAND_PRIMARY_LIGHT2];
 var CARD_GRADIENT = `linear-gradient(135deg, ${resolveColor("surface-elevated")} 0%, ${resolveColor("surface-raised")} 100%)`;
 var GAUGE_GRADIENT = "linear-gradient(90deg, rgba(46,213,115,0.25) 0%, rgba(249,180,21,0.25) 50%, rgba(209,67,67,0.25) 100%)";
@@ -10979,7 +11812,7 @@ function StatusPill({ badge }) {
     }
   );
 }
-function MetricCell({ metric }) {
+function MetricCell2({ metric }) {
   return /* @__PURE__ */ jsxs(View, { style: { width: "48%" }, testID: "meso-status-card-metric", children: [
     /* @__PURE__ */ jsx(
       Text,
@@ -11197,7 +12030,7 @@ function MesoStatusCard({
               className: "flex-row flex-wrap",
               style: { gap: 8 },
               testID: "meso-status-card-metrics",
-              children: metrics.map((metric, index) => /* @__PURE__ */ jsx(MetricCell, { metric }, `${metric.label}-${index}`))
+              children: metrics.map((metric, index) => /* @__PURE__ */ jsx(MetricCell2, { metric }, `${metric.label}-${index}`))
             }
           ),
           gauges.length > 0 && /* @__PURE__ */ jsx(View, { style: { gap: 12 }, testID: "meso-status-card-gauges", children: gauges.map((gauge, index) => /* @__PURE__ */ jsx(Gauge, { gauge }, `${gauge.label}-${index}`)) }),
@@ -11278,8 +12111,8 @@ var ERROR_PILL_BORDER = "rgba(209,67,67,0.20)";
 var PLOT_LEFT = 26;
 var TOOLTIP_WIDTH = 124;
 function timeOf(dateStr) {
-  const t12 = Date.parse(dateStr);
-  return Number.isNaN(t12) ? 0 : t12;
+  const t18 = Date.parse(dateStr);
+  return Number.isNaN(t18) ? 0 : t18;
 }
 function formatValue(value) {
   return `${Math.round(value)}`;
@@ -11768,10 +12601,10 @@ function StrengthTrendChart({
     }
   );
 }
-var t11 = getSemanticColors("dark");
-var STATUS_SUCCESS3 = t11["status-success"];
-var STATUS_WARNING3 = t11["status-warning"];
-var STATUS_INFO = t11["status-info"];
+var t14 = getSemanticColors("dark");
+var STATUS_SUCCESS3 = t14["status-success"];
+var STATUS_WARNING3 = t14["status-warning"];
+var STATUS_INFO = t14["status-info"];
 var DOT_BORDER = "#F3F4F6";
 var BAND_FILL = "rgba(46,213,115,0.1)";
 var BAND_EDGE = "rgba(46,213,115,0.45)";
@@ -11814,13 +12647,13 @@ function interpEdge(pixels, x, key) {
     const a = pixels[i];
     const b = pixels[i + 1];
     if (x >= a.x && x <= b.x) {
-      const t12 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
-      return a[key] + t12 * (b[key] - a[key]);
+      const t18 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
+      return a[key] + t18 * (b[key] - a[key]);
     }
   }
   return pixels[pixels.length - 1][key];
 }
-function buildColumns(pixels, step) {
+function buildColumns2(pixels, step) {
   if (pixels.length < 2) return [];
   const start = pixels[0].x;
   const end = pixels[pixels.length - 1].x;
@@ -11932,7 +12765,7 @@ function CapacityBandChart({
   }
   const { toX, toY } = scale;
   const bandPixels = toPixels(band, toX, toY);
-  const columns = buildColumns(bandPixels, COLUMN_STEP);
+  const columns = buildColumns2(bandPixels, COLUMN_STEP);
   const topEdge = buildEdges(bandPixels, "yHigh");
   const bottomEdge = buildEdges(bandPixels, "yLow");
   const lastBandPoint = band[band.length - 1];
@@ -12007,8 +12840,8 @@ function CapacityBandChart({
                   testID: "capacity-band-chart-reveal",
                   children: /* @__PURE__ */ jsxs(View, { style: { width, height, position: "relative" }, children: [
                     projection && /* @__PURE__ */ jsxs(View, { testID: "capacity-band-chart-projection", children: [
-                      renderColumns(buildColumns(trainingPixels, COLUMN_STEP), PROJECTION_FILL, "capacity-band-chart-projection-fill"),
-                      renderColumns(buildColumns(restPixels, COLUMN_STEP), PROJECTION_FILL, "capacity-band-chart-projection-fill"),
+                      renderColumns(buildColumns2(trainingPixels, COLUMN_STEP), PROJECTION_FILL, "capacity-band-chart-projection-fill"),
+                      renderColumns(buildColumns2(restPixels, COLUMN_STEP), PROJECTION_FILL, "capacity-band-chart-projection-fill"),
                       renderEdges(buildEdges(trainingPixels, "yHigh"), STATUS_SUCCESS3, true, "capacity-band-chart-projection-training"),
                       renderEdges(buildEdges(trainingPixels, "yLow"), STATUS_SUCCESS3, true, "capacity-band-chart-projection-training"),
                       renderEdges(buildEdges(restPixels, "yHigh"), STATUS_INFO, true, "capacity-band-chart-projection-rest"),
@@ -12075,72 +12908,546 @@ function CapacityBandChart({
                 return /* @__PURE__ */ jsx(
                   Text,
                   {
-                    className: "text-text-tertiary",
+                    className: "text-text-tertiary",
+                    style: {
+                      position: "absolute",
+                      left: toX(point.date) - 14,
+                      top: height - PADDING_BOTTOM + 2,
+                      width: 28,
+                      textAlign: "center",
+                      fontSize: 10,
+                      fontFamily: "Inter, sans-serif"
+                    },
+                    accessibilityElementsHidden: true,
+                    importantForAccessibility: "no-hide-descendants",
+                    testID: "capacity-band-chart-x-label",
+                    children: formatDate2(point.date)
+                  },
+                  `x-${point.date}`
+                );
+              })
+            ]
+          }
+        ),
+        workouts.map((workout, i) => {
+          const cx = toX(workout.date);
+          const cy = toY(workout.load);
+          const color = DOT_COLORS[workout.status];
+          const dotStyle = {
+            width: DOT_SIZE,
+            height: DOT_SIZE,
+            borderRadius: DOT_SIZE / 2,
+            backgroundColor: color,
+            borderWidth: 2,
+            borderColor: DOT_BORDER
+          };
+          const label = `Workout on ${formatDate2(workout.date)}, load ${workout.load}, ${STATUS_PHRASES[workout.status]}`;
+          return /* @__PURE__ */ jsx(
+            Animated.View,
+            {
+              style: {
+                position: "absolute",
+                left: cx - DOT_SIZE / 2,
+                top: cy - DOT_SIZE / 2,
+                transform: [{ scale: dotAnims[i] ?? 1 }]
+              },
+              testID: "capacity-band-chart-dot-wrapper",
+              children: onWorkoutPress ? /* @__PURE__ */ jsx(
+                Pressable,
+                {
+                  onPress: () => onWorkoutPress(workout),
+                  accessibilityRole: "button",
+                  accessibilityLabel: label,
+                  style: dotStyle,
+                  testID: "capacity-band-chart-dot"
+                }
+              ) : /* @__PURE__ */ jsx(
+                View,
+                {
+                  accessibilityElementsHidden: true,
+                  importantForAccessibility: "no-hide-descendants",
+                  style: dotStyle,
+                  testID: "capacity-band-chart-dot"
+                }
+              )
+            },
+            `dot-${workout.date}-${i}`
+          );
+        })
+      ]
+    }
+  );
+}
+var t15 = getSemanticColors("dark");
+function glowShadow(color) {
+  return `0 0 5px 1px ${alpha(color, 0.3)}, 0 0 10px 3px ${alpha(color, 0.12)}`;
+}
+var DEFAULT_TRACK_COLOR = primitiveColors.charcoal[200];
+var DEFAULT_MARKER_COLOR2 = primitiveColors.white;
+var TICK_COLOR = t15["text-tertiary"];
+var DEFAULT_TRACK_HEIGHT = 14;
+var DEFAULT_NEEDLE_OVERHANG = 6;
+var NEEDLE_WIDTH = 4;
+function fraction(value, min, max) {
+  if (max <= min) return 0;
+  return Math.max(0, Math.min(1, (value - min) / (max - min)));
+}
+function pct(frac) {
+  return `${frac * 100}%`;
+}
+function ZoneTrack({
+  zones,
+  max,
+  min = 0,
+  marker = null,
+  ticks,
+  band = null,
+  trackHeight = DEFAULT_TRACK_HEIGHT,
+  needleOverhang = DEFAULT_NEEDLE_OVERHANG,
+  trackColor = DEFAULT_TRACK_COLOR,
+  className,
+  style,
+  accessibilityLabel: accessibilityLabel2,
+  ...props
+}) {
+  const isNeedle = marker?.type === "needle";
+  const markerHeight = isNeedle ? trackHeight + needleOverhang * 2 : trackHeight;
+  const markerFrac = marker != null ? fraction(marker.value, min, max) : 0;
+  const bands = zones.map((zone, i) => {
+    const prev = i === 0 ? min : zones[i - 1].upTo;
+    const start = Math.max(min, Math.min(max, prev));
+    const end = Math.max(min, Math.min(max, zone.upTo));
+    return { color: zone.color, weight: Math.max(0, end - start) };
+  });
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: [{ width: "100%" }, style],
+      accessibilityRole: "progressbar",
+      accessibilityValue: marker != null ? { min, max, now: marker.value } : { min, max, now: min },
+      accessibilityLabel: accessibilityLabel2 ?? `Zone track: ${marker?.value ?? min}`,
+      testID: "zone-track",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(View, { style: { position: "relative", height: markerHeight }, children: [
+          /* @__PURE__ */ jsxs(
+            View,
+            {
+              testID: "zone-track-track",
+              accessibilityElementsHidden: true,
+              style: {
+                position: "absolute",
+                top: (markerHeight - trackHeight) / 2,
+                left: 0,
+                right: 0,
+                height: trackHeight,
+                borderRadius: trackHeight / 2,
+                backgroundColor: trackColor,
+                overflow: "hidden",
+                flexDirection: "row",
+                // The pill's own box-shadow renders outside its overflow:hidden, so
+                // `glow` haloes the whole track in the marker colour.
+                ...marker?.glow ? { boxShadow: glowShadow(marker.color ?? DEFAULT_MARKER_COLOR2) } : null
+              },
+              children: [
+                bands.map((b, i) => /* @__PURE__ */ jsx(
+                  View,
+                  {
+                    testID: "zone-track-band",
+                    style: {
+                      flexGrow: b.weight,
+                      flexShrink: 1,
+                      flexBasis: 0,
+                      minWidth: 0,
+                      height: "100%",
+                      backgroundColor: b.color
+                    }
+                  },
+                  i
+                )),
+                band != null && /* @__PURE__ */ jsx(
+                  View,
+                  {
+                    testID: "zone-track-band-highlight",
+                    style: {
+                      position: "absolute",
+                      top: 0,
+                      bottom: 0,
+                      left: pct(fraction(band.from, min, max)),
+                      width: pct(fraction(band.to, min, max) - fraction(band.from, min, max)),
+                      backgroundColor: band.color
+                    }
+                  }
+                ),
+                marker?.type === "fill" && /* @__PURE__ */ jsx(
+                  View,
+                  {
+                    testID: "zone-track-unfilled",
+                    style: {
+                      position: "absolute",
+                      top: 0,
+                      bottom: 0,
+                      left: pct(markerFrac),
+                      right: 0,
+                      backgroundColor: trackColor
+                    }
+                  }
+                ),
+                marker?.type === "fill" && marker.color != null && /* @__PURE__ */ jsx(
+                  View,
+                  {
+                    testID: "zone-track-fill",
                     style: {
                       position: "absolute",
-                      left: toX(point.date) - 14,
-                      top: height - PADDING_BOTTOM + 2,
-                      width: 28,
-                      textAlign: "center",
-                      fontSize: 10,
-                      fontFamily: "Inter, sans-serif"
-                    },
-                    accessibilityElementsHidden: true,
-                    importantForAccessibility: "no-hide-descendants",
-                    testID: "capacity-band-chart-x-label",
-                    children: formatDate2(point.date)
-                  },
-                  `x-${point.date}`
-                );
-              })
-            ]
-          }
-        ),
-        workouts.map((workout, i) => {
-          const cx = toX(workout.date);
-          const cy = toY(workout.load);
-          const color = DOT_COLORS[workout.status];
-          const dotStyle = {
-            width: DOT_SIZE,
-            height: DOT_SIZE,
-            borderRadius: DOT_SIZE / 2,
-            backgroundColor: color,
-            borderWidth: 2,
-            borderColor: DOT_BORDER
-          };
-          const label = `Workout on ${formatDate2(workout.date)}, load ${workout.load}, ${STATUS_PHRASES[workout.status]}`;
+                      top: 0,
+                      bottom: 0,
+                      left: 0,
+                      width: pct(markerFrac),
+                      backgroundColor: marker.color
+                    }
+                  }
+                )
+              ]
+            }
+          ),
+          isNeedle && /* @__PURE__ */ jsx(
+            View,
+            {
+              testID: "zone-track-needle",
+              style: {
+                position: "absolute",
+                top: 0,
+                left: pct(markerFrac),
+                width: NEEDLE_WIDTH,
+                height: markerHeight,
+                borderRadius: NEEDLE_WIDTH / 2,
+                backgroundColor: marker.color ?? DEFAULT_MARKER_COLOR2,
+                transform: [{ translateX: -NEEDLE_WIDTH / 2 }]
+              }
+            }
+          ),
+          ticks?.map((tick, i) => {
+            const emphasized = tick.emphasized === true;
+            const lineColor = tick.color ?? (emphasized ? t15["brand-primary"] : TICK_COLOR);
+            const lineWidth = emphasized ? 2 : 1.5;
+            return /* @__PURE__ */ jsx(
+              View,
+              {
+                testID: "zone-track-tick-line",
+                accessibilityElementsHidden: true,
+                style: {
+                  position: "absolute",
+                  top: (markerHeight - trackHeight) / 2 - 2,
+                  left: pct(fraction(tick.value, min, max)),
+                  width: lineWidth,
+                  height: trackHeight + 4,
+                  borderRadius: lineWidth / 2,
+                  backgroundColor: lineColor,
+                  transform: [{ translateX: -lineWidth / 2 }],
+                  zIndex: 3
+                }
+              },
+              `line-${i}`
+            );
+          })
+        ] }),
+        ticks != null && ticks.length > 0 && /* @__PURE__ */ jsx(View, { style: { position: "relative", height: 16, marginTop: 5 }, children: ticks.map((tick, i) => {
+          if (tick.label == null) return null;
+          const emphasized = tick.emphasized === true;
+          const labelColor = tick.color ?? (emphasized ? t15["brand-primary"] : TICK_COLOR);
+          const labelNode = /* @__PURE__ */ jsx(
+            Text,
+            {
+              testID: "zone-track-tick-label",
+              style: {
+                fontSize: 9,
+                letterSpacing: 0.5,
+                color: labelColor,
+                fontFamily: "monospace",
+                fontWeight: emphasized ? "700" : "400"
+              },
+              children: tick.label
+            }
+          );
           return /* @__PURE__ */ jsx(
-            Animated.View,
+            View,
             {
+              testID: "zone-track-tick",
               style: {
                 position: "absolute",
-                left: cx - DOT_SIZE / 2,
-                top: cy - DOT_SIZE / 2,
-                transform: [{ scale: dotAnims[i] ?? 1 }]
+                left: pct(fraction(tick.value, min, max)),
+                transform: [{ translateX: -14 }],
+                width: 28,
+                alignItems: "center"
               },
-              testID: "capacity-band-chart-dot-wrapper",
-              children: onWorkoutPress ? /* @__PURE__ */ jsx(
-                Pressable,
-                {
-                  onPress: () => onWorkoutPress(workout),
-                  accessibilityRole: "button",
-                  accessibilityLabel: label,
-                  style: dotStyle,
-                  testID: "capacity-band-chart-dot"
-                }
-              ) : /* @__PURE__ */ jsx(
-                View,
-                {
-                  accessibilityElementsHidden: true,
-                  importantForAccessibility: "no-hide-descendants",
-                  style: dotStyle,
-                  testID: "capacity-band-chart-dot"
-                }
-              )
+              children: tick.tooltip != null ? /* @__PURE__ */ jsx(Tooltip, { label: tick.tooltip, placement: "top", children: labelNode }) : labelNode
             },
-            `dot-${workout.date}-${i}`
+            `label-${i}`
           );
-        })
+        }) })
+      ]
+    }
+  );
+}
+// src/components/custom/Workout/FatigueMeter.tsx
+var { green, yellow, orange, red } = WORKOUT_TOKENS.scale;
+var DEFAULT_ZONE_COLORS = [green, yellow, orange, red];
+var DEFAULT_THRESHOLDS = [10, 20, 30];
+var DEFAULT_LABELS = ["fresh", "VL10", "VL20", "VL30", "stop"];
+var DEFAULT_MAX = 40;
+function FatigueMeter({
+  value,
+  max = DEFAULT_MAX,
+  thresholds = DEFAULT_THRESHOLDS,
+  zoneColors = DEFAULT_ZONE_COLORS,
+  labels = DEFAULT_LABELS,
+  trackHeight = 14,
+  needleColor,
+  className,
+  ...props
+}) {
+  const [t1, t22, t32] = thresholds;
+  const zones = [
+    { upTo: t1, color: zoneColors[0] },
+    { upTo: t22, color: zoneColors[1] },
+    { upTo: t32, color: zoneColors[2] },
+    { upTo: max, color: zoneColors[3] }
+  ];
+  const tickValues = [0, t1, t22, t32, max];
+  const ticks = tickValues.map((v, i) => ({ value: v, label: labels[i] }));
+  return /* @__PURE__ */ jsx(
+    ZoneTrack,
+    {
+      className,
+      zones,
+      min: 0,
+      max,
+      trackHeight,
+      ticks,
+      marker: { type: "needle", value, color: needleColor },
+      accessibilityLabel: `Fatigue: ${value}% velocity loss`,
+      testID: "fatigue-meter",
+      ...props
+    }
+  );
+}
+var HEAT = WORKOUT_TOKENS.heatmap;
+var NEUTRAL_TRACK = primitiveColors.charcoal[200];
+var MONO = "monospace";
+var HEAT_BY_ZONE = {
+  under: HEAT.under,
+  maintenance: HEAT.maintenance,
+  productive: HEAT.productive,
+  approaching: HEAT.approaching,
+  over: HEAT.over
+};
+var ZONE_DESCRIPTION = {
+  under: "below MEV",
+  maintenance: "building toward MAV",
+  productive: "in the productive zone",
+  approaching: "approaching MRV",
+  over: "over MRV"
+};
+var LANDMARK_NAME = {
+  MEV: "Minimum Effective Volume",
+  MAV: "Maximum Adaptive Volume",
+  MRV: "Maximum Recoverable Volume"
+};
+function zoneForSets(sets, { mev, mav, mrv }) {
+  if (sets < mev) return "under";
+  if (sets < mav) return "maintenance";
+  if (sets >= mrv) return "over";
+  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;
+  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: MONO, 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 t16 = 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 t16[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 t17 = 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 ? t17[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: t17["background-base"],
+          borderWidth: 1,
+          borderColor: t17["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
       ]
     }
   );
@@ -12351,28 +13658,28 @@ function Scatter({
         testID: "scatter-canvas",
         style: { position: "absolute", top: 0, left: 0, width, height, overflow: "hidden" },
         children: [
-          ticksOf(yd, TICK_COUNT).map((t12, i) => {
-            const y = toY(t12);
+          ticksOf(yd, TICK_COUNT).map((t18, i) => {
+            const y = toY(t18);
             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(t12) })
+                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(t18) })
               },
               `y-${i}`
             );
           }),
-          ticksOf(xd, TICK_COUNT).map((t12, i) => {
-            const x = toX(t12);
+          ticksOf(xd, TICK_COUNT).map((t18, i) => {
+            const x = toX(t18);
             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(t12) })
+                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t18) })
               },
               `x-${i}`
             );
@@ -12437,7 +13744,7 @@ var STATUS_SUCCESS4 = sem2["status-success"];
 var STATUS_WARNING4 = sem2["status-warning"];
 var STATUS_ERROR4 = sem2["status-error"];
 var TRACK = "rgba(255,255,255,0.08)";
-var DEFAULT_THRESHOLDS = [
+var DEFAULT_THRESHOLDS2 = [
   { value: 0, color: STATUS_ERROR4 },
   { value: 60, color: STATUS_WARNING4 },
   { value: 80, color: STATUS_SUCCESS4 }
@@ -12452,8 +13759,8 @@ function clamp012(n) {
 function formatValue2(v) {
   return Number.isInteger(v) ? `${v}` : v.toFixed(1);
 }
-function bandColor2(fraction, bands, min, max) {
-  const value = min + fraction * (max - min);
+function bandColor2(fraction2, bands, min, max) {
+  const value = min + fraction2 * (max - min);
   const sorted = [...bands].sort((a, b) => a.value - b.value);
   let color = sorted[0]?.color ?? STATUS_SUCCESS4;
   for (const band of sorted) {
@@ -12465,15 +13772,15 @@ function buildTicks(fill, size, activeColor) {
   const center = size / 2;
   const radius = center - size * 0.08;
   return Array.from({ length: SEGMENTS }, (_, i) => {
-    const fraction = (i + 0.5) / SEGMENTS;
-    const deg = ARC_START + fraction * ARC_SWEEP;
+    const fraction2 = (i + 0.5) / SEGMENTS;
+    const deg = ARC_START + fraction2 * ARC_SWEEP;
     const rad = deg * Math.PI / 180;
     return {
       key: i,
       left: center + radius * Math.cos(rad),
       top: center + radius * Math.sin(rad),
       rotate: `${deg - 90}deg`,
-      color: fraction <= fill ? activeColor(fraction) : TRACK
+      color: fraction2 <= fill ? activeColor(fraction2) : TRACK
     };
   });
 }
@@ -12484,7 +13791,7 @@ function Gauge2({
   size = 160,
   label,
   unit,
-  thresholds = DEFAULT_THRESHOLDS,
+  thresholds = DEFAULT_THRESHOLDS2,
   color,
   className,
   ...props
@@ -12507,23 +13814,23 @@ function Gauge2({
       testID: "gauge",
       ...props,
       children: [
-        ticks.map((t12) => /* @__PURE__ */ jsx(
+        ticks.map((t18) => /* @__PURE__ */ jsx(
           View,
           {
             accessibilityElementsHidden: true,
             testID: "gauge-segment",
             style: {
               position: "absolute",
-              left: t12.left - tickThickness / 2,
-              top: t12.top - tickLength / 2,
+              left: t18.left - tickThickness / 2,
+              top: t18.top - tickLength / 2,
               width: tickThickness,
               height: tickLength,
               borderRadius: tickThickness / 2,
-              backgroundColor: t12.color,
-              transform: [{ rotate: t12.rotate }]
+              backgroundColor: t18.color,
+              transform: [{ rotate: t18.rotate }]
             }
           },
-          t12.key
+          t18.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: [
@@ -12569,7 +13876,7 @@ function BrandLockup({
 }
 var stateConfig = {
   // live = vivid green with an expanding ring; rest = solid amber (no pulse — operator); idle is dim.
-  live: { label: "LIVE", color: "success", pulse: "ping", textColor: "primary" },
+  live: { label: "LIVE", color: "live", pulse: "ping", textColor: "primary" },
   rest: { label: "REST", color: "warning", pulse: false, textColor: "primary" },
   idle: { label: "IDLE", color: "default", pulse: false, textColor: "secondary" }
 };
@@ -12733,6 +14040,127 @@ function TopBar({
     }
   );
 }
+function NavItem({
+  icon,
+  label,
+  active = false,
+  live = false,
+  onPress,
+  className
+}) {
+  const glyphColor = active ? "text-brand-primary" : "text-text-tertiary";
+  const labelColor = active ? "text-brand-primary" : live ? "text-status-live-muted" : "text-text-tertiary";
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "tab",
+      accessibilityState: { selected: active },
+      accessibilityLabel: label,
+      onPress,
+      className: cn("relative h-[46px] w-[60px] items-center justify-center", className),
+      children: [
+        active ? /* @__PURE__ */ jsx(
+          View,
+          {
+            testID: "nav-item-accent",
+            className: "absolute left-0 top-[13px] bottom-[13px] w-[3px] rounded-r-[3px] bg-brand-primary"
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs(
+          View,
+          {
+            className: cn(
+              "h-[46px] w-[46px] items-center justify-center gap-[3px] rounded-[11px]",
+              glyphColor
+            ),
+            children: [
+              icon,
+              /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "button",
+                  color: "inherit",
+                  className: cn("text-[8.5px] font-bold uppercase tracking-[0.4px]", labelColor),
+                  children: label
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+var defaultNavItems = [
+  { key: "live", label: "Live", icon: /* @__PURE__ */ jsx(ActivityIcon, { size: 20, color: "currentColor" }) },
+  { key: "review", label: "Review", icon: /* @__PURE__ */ jsx(HistoryIcon, { size: 20, color: "currentColor" }) },
+  { key: "program", label: "Plan", icon: /* @__PURE__ */ jsx(LayersIcon, { size: 20, color: "currentColor" }) },
+  { key: "body", label: "Body", icon: /* @__PURE__ */ jsx(PersonStandingIcon, { size: 20, color: "currentColor" }) }
+];
+function SideNav({
+  items = defaultNavItems,
+  activeKey,
+  onNavigate,
+  liveKey = null,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityRole: "tablist",
+      className: cn(
+        "w-[60px] items-center gap-[6px] border-r border-border bg-background-base py-3",
+        className
+      ),
+      children: items.map((item) => /* @__PURE__ */ jsx(
+        NavItem,
+        {
+          icon: item.icon,
+          label: item.label,
+          active: item.key === activeKey,
+          live: item.key === liveKey && item.key !== activeKey,
+          onPress: () => onNavigate?.(item.key)
+        },
+        item.key
+      ))
+    }
+  );
+}
+var DEMO_DEVICES = [
+  { id: "Voltra-A3F2", nickname: "Left Cable", slot: "L", state: "connected" },
+  { id: "Voltra-9B1C", nickname: "Right Cable", slot: "R", state: "connected" }
+];
+function ContentPlaceholder() {
+  return /* @__PURE__ */ jsx(View, { className: "flex-1 items-center justify-center", children: /* @__PURE__ */ jsx(Text, { className: "font-heading text-sm text-text-tertiary", children: "main content region" }) });
+}
+function DashboardShell({
+  activeKey = "live",
+  navItems,
+  liveKey = null,
+  state = "live",
+  devices = DEMO_DEVICES,
+  subtitle = "wall dashboard",
+  onNavigate,
+  onSelectDevice,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(View, { className: cn("flex-1 flex-row bg-surface-base", className), children: [
+    /* @__PURE__ */ jsx(SideNav, { activeKey, items: navItems, liveKey, onNavigate }),
+    /* @__PURE__ */ jsxs(View, { className: "flex-1", children: [
+      /* @__PURE__ */ jsx(
+        TopBar,
+        {
+          state,
+          devices,
+          subtitle,
+          onSelectDevice
+        }
+      ),
+      /* @__PURE__ */ jsx(View, { className: "flex-1", children: children ?? /* @__PURE__ */ jsx(ContentPlaceholder, {}) })
+    ] })
+  ] });
+}
 // src/utils/form.ts
 function getFieldValidationProps(state) {
@@ -12822,6 +14250,6 @@ function composeValidators(...validators) {
   };
 }
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert, AlertDescription, AlertTitle, Autocomplete, Avatar, AvatarBadge, AvatarGroup, 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, CircularProgress, Collapse, CollapseButton, CollapseContent, DataRow, DateTime, DeviationBar, DeviceIndicator, DeviceMenu, DeviceRow, Divider, Drawer, DrawerBody, DrawerFooter, DrawerHeader, DumbbellIcon, EmptyState, ExerciseCard, FormActions, FormField, FormRow, FormSection, Gauge2 as Gauge, HStack, Heading, HelpTip, IconBox, Indicator, Input, InputBar, InputGroup, IntensityBar, Label, LabelWithHelp, Link, ListItem, ListItemContent, ListItemDivider, ListItemIcon, ListItemTrailing, Menu, MenuDivider, MenuGroup, MenuItem, MenuList, MenuTrigger, MesoCard, MesoProgressBar, MesoStatusCard, Metric, MetricGroup, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalTitle, MuscleGroupChip, Overline, Paragraph, PasswordInput, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, Radio, RadioGroup, ReadinessCheck, RestTimer, Scatter, Section, SectionContent, SectionHeader, Select, SessionStatePill, SetRow, Sidebar, SidebarContent, SidebarDivider, SidebarFooter, SidebarHeader, SidebarItem, SidebarSection, Skeleton, SkeletonCard, SkeletonCircle, SkeletonListItem, SkeletonText, Sparkline, Spinner, Stack, StarIcon, StatusDot, StepContent, StepIndicator, StepLabel, Stepper, Step as StepperStep, StrengthTrendChart, SupersetWrapper, Surface, SvgIcon, Switch, TEMPO_PACING, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoBar, TempoDisplay, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, Typography, VStack, VelocityStrip, VoltrasMark, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, alpha, applyThemePreset, audiobookPreset, bestTextColor, buttonSizes, calculateMeanVelocity, calculateVelocityLoss, categoricalPalette, cn, componentElevationRanges, composeValidators, createFieldId, createFlatShadow, createPressedHoverShadow, createPressedShadow, createRaisedHoverShadow, createRaisedShadow, darkThemeCSSVars, darken, defaultPreset, discreteRainbow, divergingScale, elevationSystem, formatDateTime, formatPrescription, formatSignedPct, formatVelocity, getBaseSurfaceColor, getCategoricalColor, getContrastText, getDiscreteRainbowColor, getElevationConfig, getElevationShadow, getElevationSurface, getFieldAriaProps, getFieldValidationProps, getGlowShadow, getHoverColors, getLuminance, getResultColor, getSemanticColors, getStatusColor, getTempoFillPct, getTempoPacingState, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, neumorphicShadows, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, surfaceGradient, useTable, useToast, useToolbarButton, validateCssPropertyManifest, validationRules };
+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, 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, Paragraph, PasswordInput, PersonStandingIcon, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, Radio, RadioGroup, ReadinessCheck, RestTimer, SET_STRIP_VARIABLE_COLOR, SET_STRIP_ZONES, 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, SvgIcon, Switch, TEMPO_PACING, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoBar, TempoDisplay, Tile, TimerReadout, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, TrendingDownIcon, Typography, VStack, VelocityStrip, VoltrasMark, VolumeLandmarkBar, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, ZoneTrack, alpha, applyThemePreset, audiobookPreset, 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, getResultColor, getSemanticColors, getStatusColor, getTempoFillPct, getTempoPacingState, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, liveAuraColor, neumorphicShadows, paceTone, paceToneColor, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, resolveIndicator, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, statusPillColor, surfaceGradient, useTable, useTimer, useToast, useToolbarButton, validateCssPropertyManifest, validationRules, velocityZoneColor };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map