@titan-design/react-ui 0.9.2 → 0.10.0

package/dist/pages.mjs

@@ -38,13 +38,24 @@ var primitiveColors = {
     200: "#3C3C3C",
     300: "#2C2C2C",
     400: "#1F1F1F",
-    500: "#1C1C1C",
-    600: "#191919",
-    700: "#161616",
-    900: "#101010"
-  },
+    500: "#1C1C1C"},
   // Pure colors
   white: "#FFFFFF"};
+var surfaceRampDark = {
+  inset: "#13100D",
+  // L*4.5  — sub-shell well / pressed
+  background: "#1C1916",
+  // L*9    — shell / frame
+  base: "#252321",
+  // L*13.5 — main content plane
+  elevated: "#2C2A28",
+  // L*17   — nav / rail
+  raised: "#31302F",
+  // L*20   — cards
+  overlay: "#373635"
+  // L*22.5 — hero / popover
+};
+var backgroundFrameDark = "#100D0A";
 var primitiveRamps = {
   red: {
     50: "#FFF4F4",
@@ -1366,83 +1377,6 @@ function InfoIcon(props) {
     /* @__PURE__ */ jsx("path", { d: "M12 8h.01" })
   ] });
 }
-var baseBadgeSizeConfig = {
-  sm: { fontSize: 9, paddingH: 6, paddingV: 2, iconSize: 10 },
-  md: { fontSize: 10, paddingH: 8, paddingV: 2, iconSize: 12 },
-  lg: { fontSize: 12, paddingH: 10, paddingV: 4, iconSize: 14 }
-};
-var variantColors = {
-  plain: { backgroundColor: "#1C1C1C", borderColor: "#1F1F1F" },
-  pr: {
-    backgroundColor: "rgba(255, 121, 0, 0.12)",
-    borderColor: "rgba(255, 121, 0, 0.3)"
-  }
-};
-function BaseBadge({
-  variant = "plain",
-  size = "md",
-  icon,
-  onPress,
-  className,
-  children,
-  ...props
-}) {
-  const [scaleAnim] = useState(() => new Animated.Value(1));
-  const config = baseBadgeSizeConfig[size];
-  const colors = variantColors[variant];
-  const handlePressIn = () => {
-    Animated.timing(scaleAnim, {
-      toValue: 0.97,
-      duration: 150,
-      useNativeDriver: true
-    }).start();
-  };
-  const handlePressOut = () => {
-    Animated.timing(scaleAnim, {
-      toValue: 1,
-      duration: 150,
-      useNativeDriver: true
-    }).start();
-  };
-  const badge = /* @__PURE__ */ jsxs(
-    View,
-    {
-      className,
-      style: {
-        flexDirection: "row",
-        alignItems: "center",
-        gap: 3,
-        // borderRadius 2 is intentional per workout-tokens.ts (squared-off pill)
-        borderRadius: 2,
-        borderWidth: 1,
-        borderColor: colors.borderColor,
-        backgroundColor: colors.backgroundColor,
-        paddingHorizontal: config.paddingH,
-        paddingVertical: config.paddingV
-      },
-      ...props,
-      children: [
-        icon != null && /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "base-badge-icon", children: icon }),
-        children
-      ]
-    }
-  );
-  if (onPress) {
-    return /* @__PURE__ */ jsx(Animated.View, { style: { transform: [{ scale: scaleAnim }] }, children: /* @__PURE__ */ jsx(
-      Pressable,
-      {
-        onPress,
-        onPressIn: handlePressIn,
-        onPressOut: handlePressOut,
-        accessibilityRole: "button",
-        accessibilityLabel: props.accessibilityLabel,
-        testID: "base-badge-pressable",
-        children: badge
-      }
-    ) });
-  }
-  return badge;
-}
 
 // src/theme/tokens/semantic.ts
 var semanticColorsLight = {
@@ -1549,10 +1483,19 @@ var semanticColorsLight = {
   "surface-overlay": primitiveColors.white,
   "surface-input": primitiveColors.neutral[50],
   // Input field background (filled variant)
+  // Deepest pressed pit (TD-surface-tokens, S-3) — light-mode counterpart of
+  // the dark ramp's `inset` plane; a placeholder pairing, not part of the
+  // dark-ramp investigation (surface.contract.test.ts is dark-mode only).
+  "surface-inset": primitiveColors.neutral[300],
   // Background colors (background-*)
   "background-base": "#EBEBEB",
   "background-default": primitiveColors.white,
   "background-subtle": primitiveColors.neutral[50],
+  // Frame/bezel chrome (TD-surface-tokens, S-3) — top bar + side nav shell,
+  // one step below `background-base` (darker still than `surface-inset`
+  // above, mirroring the dark-mode ordering). Placeholder pairing for light
+  // mode (see dark-mode note on `surface-inset` above).
+  "background-frame": primitiveColors.neutral[400],
   // Border colors (border-*)
   "border-default": "#E8E9EB",
   "border-subtle": primitiveColors.neutral[100],
@@ -1568,6 +1511,11 @@ var semanticColorsLight = {
   // Input field border on focus
   "border-input-error": primitiveColors.red[600],
   // Input field border on error
+  // Alpha hairline separators (surface-independent — composite toward black on
+  // light surfaces, mirroring the dark-mode white-alpha family). See §4/S-2.
+  "hairline-subtle": "rgba(0, 0, 0, 0.06)",
+  "hairline-default": "rgba(0, 0, 0, 0.09)",
+  "hairline-strong": "rgba(0, 0, 0, 0.14)",
   // Interactive states (interactive-*)
   "interactive-hover": "rgba(55, 65, 81, 0.04)",
   "interactive-focus": "rgba(55, 65, 81, 0.12)",
@@ -1660,25 +1608,46 @@ var semanticColorsDark = {
   "text-inverse": primitiveColors.neutral[900],
   "text-link": "#828DF8",
   "text-link-hover": primitiveColors.blue[400],
-  // Surface colors - dark backgrounds
-  "surface-base": primitiveColors.charcoal[700],
-  // main surface
-  "surface-elevated": primitiveColors.charcoal[600],
-  // elevated surface
-  "surface-raised": primitiveColors.charcoal[500],
-  // raised surface
-  "surface-overlay": primitiveColors.charcoal[600],
-  // overlay surface
-  "surface-input": primitiveColors.charcoal[600],
-  // input surface
-  // Background colors
-  "background-base": primitiveColors.charcoal[900],
-  // darkest charcoal
-  "background-default": primitiveColors.charcoal[700],
-  // main background
-  "background-subtle": primitiveColors.charcoal[500],
-  // subtle background
-  // Border colors
+  // Surface colors - dark backgrounds — warm-tapered DERIVED ramp (TD-surface-tokens,
+  // S-1, re-spaced S-3). Shipped verbatim from `deriveSurfaceRamp()` — see
+  // `surfaceRampDark` in primitives.ts for the full derivation note. `surface-overlay`
+  // and `surface-elevated` are distinct (were both #191919 pre-S-1); `surface-input`
+  // tracks one plane above `surface-base`, same relative position as before the remap.
+  // `background-base` backs `Surface level="background"` (SurfaceContext.SURFACE_LEVEL_TOKEN),
+  // so it takes the ramp's `background` (shell/frame) role, NOT `inset`. The ramp's
+  // deepest `inset` plane is now promoted to `surface-inset` below (S-3) — still no
+  // `SurfaceLevel` member for it (follow-up, alongside the elevation.ts -1/-2 pressed
+  // levels — parallel workstream, not this branch).
+  "surface-base": surfaceRampDark.base,
+  // main surface        (#252321, L*13.5)
+  "surface-elevated": surfaceRampDark.elevated,
+  // elevated surface     (#2C2A28, L*17   — nav/rail)
+  "surface-raised": surfaceRampDark.raised,
+  // raised surface       (#31302F, L*20   — cards)
+  "surface-overlay": surfaceRampDark.overlay,
+  // overlay surface      (#373635, L*22.5 — hero/popover)
+  "surface-input": surfaceRampDark.elevated,
+  // input surface        (#2C2A28 — one plane above base)
+  "surface-inset": surfaceRampDark.inset,
+  // deepest pressed pit  (#13100D, L*4.5  — sub-shell well)
+  // Background colors — same ramp, the frame/shell end of it.
+  "background-base": surfaceRampDark.background,
+  // shell / frame        (#1C1916, L*9 — Surface level="background")
+  "background-default": surfaceRampDark.base,
+  // main background      (#252321, L*13.5 — matches surface-base)
+  "background-subtle": surfaceRampDark.elevated,
+  // subtle background    (#2C2A28, L*17 — matches surface-elevated)
+  // Frame/bezel chrome (S-3) — the top bar + side nav shell; one step BELOW
+  // `background-base`, darker even than `surface-inset` — it exits the content
+  // ramp entirely rather than sitting in it. See `backgroundFrameDark` in
+  // primitives.ts.
+  "background-frame": backgroundFrameDark,
+  // frame / bezel        (#100D0A, L*3.79)
+  // Border colors — `border-subtle` (#1C1C1C) previously collided with
+  // `surface-raised` (also #1C1C1C, an invisible border on raised cards). The
+  // re-spaced ramp above moved `surface-raised` to #2D2C2B, so this value is now
+  // distinct from every surface hex without needing to change it — see
+  // `surface.contract.test.ts` R2/R4.
   "border-default": primitiveColors.charcoal[400],
   // default border
   "border-subtle": primitiveColors.charcoal[500],
@@ -1692,6 +1661,14 @@ var semanticColorsDark = {
   "border-input-hover": primitiveColors.neutral[500],
   "border-input-focus": "#828DF8",
   "border-input-error": primitiveColors.red[500],
+  // Alpha hairline separators — the primary separation cue (§4/S-2). Self-
+  // normalizing: composites toward white by ~the same amount on ANY plane, so
+  // one family works at every elevation instead of per-surface border tokens.
+  // Shadows are demoted to floating-overlay use only (not shipped as a fill
+  // separator here — see elevation.ts, follow-up S-4).
+  "hairline-subtle": "rgba(255, 255, 255, 0.06)",
+  "hairline-default": "rgba(255, 255, 255, 0.09)",
+  "hairline-strong": "rgba(255, 255, 255, 0.14)",
   // Interactive states
   "interactive-hover": "rgba(255, 255, 255, 0.04)",
   "interactive-focus": "rgba(255, 255, 255, 0.12)",
@@ -1710,6 +1687,86 @@ function getSemanticColors(mode) {
   return mode === "dark" ? semanticColorsDark : semanticColorsLight;
 }
 
+// src/components/custom/Workout/BaseBadge.tsx
+var t = getSemanticColors("dark");
+var baseBadgeSizeConfig = {
+  sm: { fontSize: 9, paddingH: 6, paddingV: 2, iconSize: 10 },
+  md: { fontSize: 10, paddingH: 8, paddingV: 2, iconSize: 12 },
+  lg: { fontSize: 12, paddingH: 10, paddingV: 4, iconSize: 14 }
+};
+var variantColors = {
+  plain: { backgroundColor: t["surface-raised"], borderColor: "#1F1F1F" },
+  pr: {
+    backgroundColor: "rgba(255, 121, 0, 0.12)",
+    borderColor: "rgba(255, 121, 0, 0.3)"
+  }
+};
+function BaseBadge({
+  variant = "plain",
+  size = "md",
+  icon,
+  onPress,
+  className,
+  children,
+  ...props
+}) {
+  const [scaleAnim] = useState(() => new Animated.Value(1));
+  const config = baseBadgeSizeConfig[size];
+  const colors = variantColors[variant];
+  const handlePressIn = () => {
+    Animated.timing(scaleAnim, {
+      toValue: 0.97,
+      duration: 150,
+      useNativeDriver: true
+    }).start();
+  };
+  const handlePressOut = () => {
+    Animated.timing(scaleAnim, {
+      toValue: 1,
+      duration: 150,
+      useNativeDriver: true
+    }).start();
+  };
+  const badge = /* @__PURE__ */ jsxs(
+    View,
+    {
+      className,
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        gap: 3,
+        // borderRadius 2 is intentional per workout-tokens.ts (squared-off pill)
+        borderRadius: 2,
+        borderWidth: 1,
+        borderColor: colors.borderColor,
+        backgroundColor: colors.backgroundColor,
+        paddingHorizontal: config.paddingH,
+        paddingVertical: config.paddingV
+      },
+      ...props,
+      children: [
+        icon != null && /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, testID: "base-badge-icon", children: icon }),
+        children
+      ]
+    }
+  );
+  if (onPress) {
+    return /* @__PURE__ */ jsx(Animated.View, { style: { transform: [{ scale: scaleAnim }] }, children: /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        onPress,
+        onPressIn: handlePressIn,
+        onPressOut: handlePressOut,
+        accessibilityRole: "button",
+        accessibilityLabel: props.accessibilityLabel,
+        testID: "base-badge-pressable",
+        children: badge
+      }
+    ) });
+  }
+  return badge;
+}
+
 // src/components/custom/Workout/PrBadge.tsx
 var BRAND_PRIMARY = getSemanticColors("dark")["brand-primary"];
 var typeLabels = {
@@ -1960,7 +2017,7 @@ function MetricCell({ children, color, fontSize = 11 }) {
 }
 
 // src/components/custom/Workout/SetsRepsLoad.tsx
-var t = getSemanticColors("dark");
+var t2 = getSemanticColors("dark");
 var TIMES = "\xD7";
 var AT = "@";
 function SetsRepsLoad({
@@ -1972,8 +2029,8 @@ function SetsRepsLoad({
   className,
   ...props
 }) {
-  const value = t["text-primary"];
-  const sep = t["text-tertiary"];
+  const value = t2["text-primary"];
+  const sep = t2["text-tertiary"];
   return /* @__PURE__ */ jsxs(
     View,
     {
@@ -2304,19 +2361,19 @@ function alpha(color, opacity) {
 }
 
 // src/components/custom/Workout/TempoDisplay.tsx
-var t2 = getSemanticColors("dark");
+var t3 = getSemanticColors("dark");
 var INTER = "Inter, sans-serif";
 var TEXT_TERTIARY = "#6B7280";
-var STATUS_ERROR = t2["status-error"];
-var STATUS_SUCCESS = t2["status-success"];
-var STATUS_WARNING = t2["status-warning"];
+var STATUS_ERROR = t3["status-error"];
+var STATUS_SUCCESS = t3["status-success"];
+var STATUS_WARNING = t3["status-warning"];
 var ON_TARGET_MS = 100;
 function getTempoFillPct(elapsedMs, targetMs) {
   if (!targetMs) return 100;
   return Math.min(100, elapsedMs / targetMs * 100);
 }
 function activeNumberTone(elapsedMs, targetMs) {
-  if (targetMs == null) return t2["text-primary"];
+  if (targetMs == null) return t3["text-primary"];
   const remainingMs = targetMs - elapsedMs;
   if (remainingMs > ON_TARGET_MS) return STATUS_WARNING;
   if (remainingMs >= -ON_TARGET_MS) return STATUS_SUCCESS;
@@ -2468,7 +2525,7 @@ function TempoDisplay({
       style: {
         flexDirection: "row",
         alignItems: "center",
-        backgroundColor: "#1C1C1C",
+        backgroundColor: t3["surface-raised"],
         paddingHorizontal: chromePadX,
         paddingVertical: chromePadY,
         borderRadius: chromeRadius
@@ -2483,7 +2540,7 @@ function TempoDisplay({
               fontSize: labelFont,
               fontWeight: "500",
               // Live-muted green while a rep is running, tertiary at rest.
-              color: live ? t2["status-live-muted"] : TEXT_TERTIARY,
+              color: live ? t3["status-live-muted"] : TEXT_TERTIARY,
               letterSpacing: 0.5,
               textTransform: "uppercase",
               marginRight: Math.round(fontSize * 0.5)
@@ -2541,7 +2598,7 @@ function TempoDisplay({
                 View,
                 {
                   style: {
-                    backgroundColor: "#191919",
+                    backgroundColor: t3["surface-overlay"],
                     borderRadius: 6,
                     paddingVertical: 8,
                     paddingHorizontal: 12,
@@ -2594,14 +2651,14 @@ function TempoDisplay({
     }
   );
 }
-var t3 = getSemanticColors("dark");
+var t4 = getSemanticColors("dark");
 var INDICATOR_CONFIG = {
-  imbalance: { Icon: ScaleIcon, color: t3["status-error"], label: "Left/right imbalance" },
-  overshoot: { Icon: AlertTriangleIcon, color: t3["status-error"], label: "Load overshoot" },
-  "velocity-loss": { Icon: TrendingDownIcon, color: t3["status-warning"], label: "Velocity loss" },
-  "missed-reps": { Icon: CircleSlashIcon, color: t3["status-warning"], label: "Missed reps" },
-  pr: { Icon: AwardIcon, color: t3["status-success"], label: "Personal record" },
-  info: { Icon: InfoIcon, color: t3["status-info"], label: "More info" }
+  imbalance: { Icon: ScaleIcon, color: t4["status-error"], label: "Left/right imbalance" },
+  overshoot: { Icon: AlertTriangleIcon, color: t4["status-error"], label: "Load overshoot" },
+  "velocity-loss": { Icon: TrendingDownIcon, color: t4["status-warning"], label: "Velocity loss" },
+  "missed-reps": { Icon: CircleSlashIcon, color: t4["status-warning"], label: "Missed reps" },
+  pr: { Icon: AwardIcon, color: t4["status-success"], label: "Personal record" },
+  info: { Icon: InfoIcon, color: t4["status-info"], label: "More info" }
 };
 function ExerciseIndicator({ kind, onPress, className, ...props }) {
   const { Icon, color, label } = INDICATOR_CONFIG[kind];
@@ -3617,7 +3674,7 @@ function RestTimer({
 var DEFAULTS = {
   label: "SS",
   color: getSemanticColors("dark")["brand-primary"],
-  bgBase: "#101010"
+  bgBase: getSemanticColors("dark")["background-base"]
 };
 function SupersetWrapper({
   label = DEFAULTS.label,
@@ -4399,11 +4456,11 @@ function CardContent({ children, className }) {
 function CardFooter({ children, className }) {
   return /* @__PURE__ */ jsx(View, { className: cn("px-6 py-4 flex-row items-center gap-2", className), children });
 }
-var t4 = getSemanticColors("dark");
+var t5 = getSemanticColors("dark");
 var solidVariantColors = {
-  success: t4["status-success"],
-  warning: t4["status-warning"],
-  error: t4["status-error"],
+  success: t5["status-success"],
+  warning: t5["status-warning"],
+  error: t5["status-error"],
   neutral: "#6B7280"
 };
 var ringVariantStyles = {
@@ -4443,8 +4500,8 @@ var iconColors = {
   warning: "#6B4000",
   error: "#5C1A1A",
   neutral: "#D1D5DB",
-  "on-track": t4["status-success"],
-  deviation: t4["status-warning"],
+  "on-track": t5["status-success"],
+  deviation: t5["status-warning"],
   future: "#6B7280"
 };
 var sizeDimensions = {
@@ -4530,13 +4587,13 @@ var MESO_ACCENT_GRADIENT_LIGHT = primitiveRamps.orange[300];
 var WORKOUT_PILL_DELOAD = primitiveRamps.magenta[600];
 
 // src/components/custom/Workout/MesoStatusCard.tsx
-var t5 = getSemanticColors("dark");
-var BRAND_PRIMARY5 = t5["brand-primary"];
+var t6 = getSemanticColors("dark");
+var BRAND_PRIMARY5 = t6["brand-primary"];
 var BRAND_PRIMARY_DARK = MESO_ACCENT_GRADIENT_DARK;
 var BRAND_PRIMARY_LIGHT = MESO_ACCENT_GRADIENT_LIGHT;
-var SUCCESS = t5["status-success"];
-var WARNING = t5["status-warning"];
-var ERROR = t5["status-error"];
+var SUCCESS = t6["status-success"];
+var WARNING = t6["status-warning"];
+var ERROR = t6["status-error"];
 var ACCENT_STOPS = [BRAND_PRIMARY_DARK, BRAND_PRIMARY5, BRAND_PRIMARY_LIGHT];
 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%)";
@@ -4907,8 +4964,8 @@ var ERROR_PILL_BORDER = "rgba(209,67,67,0.20)";
 var PLOT_LEFT = 26;
 var TOOLTIP_WIDTH = 124;
 function timeOf(dateStr) {
-  const t11 = Date.parse(dateStr);
-  return Number.isNaN(t11) ? 0 : t11;
+  const t12 = Date.parse(dateStr);
+  return Number.isNaN(t12) ? 0 : t12;
 }
 function formatValue(value) {
   return `${Math.round(value)}`;
@@ -5397,10 +5454,10 @@ function StrengthTrendChart({
     }
   );
 }
-var t6 = getSemanticColors("dark");
-var STATUS_SUCCESS3 = t6["status-success"];
-var STATUS_WARNING3 = t6["status-warning"];
-var STATUS_INFO = t6["status-info"];
+var t7 = getSemanticColors("dark");
+var STATUS_SUCCESS3 = t7["status-success"];
+var STATUS_WARNING3 = t7["status-warning"];
+var STATUS_INFO = t7["status-info"];
 var DOT_BORDER = "#F3F4F6";
 var BAND_FILL = "rgba(46,213,115,0.1)";
 var BAND_EDGE = "rgba(46,213,115,0.45)";
@@ -5443,8 +5500,8 @@ function interpEdge(pixels, x, key) {
     const a = pixels[i];
     const b = pixels[i + 1];
     if (x >= a.x && x <= b.x) {
-      const t11 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
-      return a[key] + t11 * (b[key] - a[key]);
+      const t12 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
+      return a[key] + t12 * (b[key] - a[key]);
     }
   }
   return pixels[pixels.length - 1][key];
@@ -6483,12 +6540,12 @@ function Badge({
     }
   );
 }
-var t7 = getSemanticColors("dark");
+var t8 = getSemanticColors("dark");
 var statusBgColors = {
   completed: "rgba(46,213,115,0.15)",
   current: "rgba(255,121,0,0.15)",
   next: "transparent",
-  upcoming: "#1C1C1C",
+  upcoming: t8["surface-raised"],
   missed: "rgba(209,67,67,0.1)",
   deload: "rgba(186,41,150,0.15)"
 };
@@ -6501,9 +6558,9 @@ var statusBorderStyles = {
   deload: { borderWidth: 1, borderColor: "rgba(186,41,150,0.3)" }
 };
 var textColors = {
-  completed: t7["status-success"],
-  current: t7["brand-primary"],
-  next: t7["brand-primary"],
+  completed: t8["status-success"],
+  current: t8["brand-primary"],
+  next: t8["brand-primary"],
   upcoming: "#6B7280",
   missed: "rgba(209,67,67,0.7)",
   deload: WORKOUT_PILL_DELOAD
@@ -6636,19 +6693,19 @@ function WorkoutPill({
   }
   return pill;
 }
-var t8 = getSemanticColors("dark");
+var t9 = getSemanticColors("dark");
 var TRACK_BG = "#333333";
 var LABEL_COLOR = "#6B7280";
 var TARGET_LINE_COLOR = "rgba(33, 150, 243, 0.5)";
 var AT_TARGET_GLOW = "0 0 5px 1px rgba(33, 150, 243, 0.35), 0 0 10px 3px rgba(33, 150, 243, 0.15)";
 var ZONE = {
-  building: t8["status-success"],
+  building: t9["status-success"],
   // below target ramp-up
-  approaching: t8["status-warning"],
+  approaching: t9["status-warning"],
   // nearing target
-  target: t8["brand-primary"],
+  target: t9["brand-primary"],
   // exactly at target
-  over1: t8["status-error"],
+  over1: t9["status-error"],
   // mild over-target
   over2: WORKOUT_TOKENS.intensity.over2,
   // moderate over-target
@@ -7071,13 +7128,13 @@ function MesoCard({
     }
   ) });
 }
-var t9 = getSemanticColors("dark");
+var t10 = getSemanticColors("dark");
 var dotColorMap = {
   untrained: "#2C2C2C",
-  behind: t9["brand-secondary"],
-  ontrack: t9["status-success"],
-  target: t9["brand-primary"],
-  over: t9["status-error"]
+  behind: t10["brand-secondary"],
+  ontrack: t10["status-success"],
+  target: t10["brand-primary"],
+  over: t10["status-error"]
 };
 function MuscleGroupChip({
   name,
@@ -7151,10 +7208,10 @@ function MuscleGroupChip({
 }
 
 // src/components/custom/Workout/WorkoutCard.tsx
-var t10 = getSemanticColors("dark");
+var t11 = getSemanticColors("dark");
 var COLORS = {
-  statusSuccess: t10["status-success"],
-  brandPrimary: t10["brand-primary"],
+  statusSuccess: t11["status-success"],
+  brandPrimary: t11["brand-primary"],
   borderDefault: "#1F1F1F",
   brandPrimarySubtle: "rgba(255,121,0,0.06)"
 };