@csszyx/compiler 0.6.2 → 0.8.0

package/dist/shared/compiler.BIUVmI0H.mjs

@@ -0,0 +1,2271 @@
+var PropertyCategory = /* @__PURE__ */ ((PropertyCategory2) => {
+  PropertyCategory2[PropertyCategory2["SPACING"] = 0] = "SPACING";
+  PropertyCategory2[PropertyCategory2["COLOR"] = 1] = "COLOR";
+  PropertyCategory2[PropertyCategory2["FRACTION"] = 2] = "FRACTION";
+  PropertyCategory2[PropertyCategory2["UNITLESS"] = 3] = "UNITLESS";
+  PropertyCategory2[PropertyCategory2["ANGLE"] = 4] = "ANGLE";
+  PropertyCategory2[PropertyCategory2["DURATION"] = 5] = "DURATION";
+  PropertyCategory2[PropertyCategory2["ARBITRARY"] = 6] = "ARBITRARY";
+  PropertyCategory2[PropertyCategory2["PASSTHROUGH"] = 7] = "PASSTHROUGH";
+  return PropertyCategory2;
+})(PropertyCategory || {});
+const PROPERTY_CATEGORY_MAP = {
+  // ---- SPACING ----
+  p: 0 /* SPACING */,
+  pt: 0 /* SPACING */,
+  pr: 0 /* SPACING */,
+  pb: 0 /* SPACING */,
+  pl: 0 /* SPACING */,
+  px: 0 /* SPACING */,
+  py: 0 /* SPACING */,
+  ps: 0 /* SPACING */,
+  pe: 0 /* SPACING */,
+  pbs: 0 /* SPACING */,
+  pbe: 0 /* SPACING */,
+  m: 0 /* SPACING */,
+  mt: 0 /* SPACING */,
+  mr: 0 /* SPACING */,
+  mb: 0 /* SPACING */,
+  ml: 0 /* SPACING */,
+  mx: 0 /* SPACING */,
+  my: 0 /* SPACING */,
+  ms: 0 /* SPACING */,
+  me: 0 /* SPACING */,
+  mbs: 0 /* SPACING */,
+  mbe: 0 /* SPACING */,
+  spaceX: 0 /* SPACING */,
+  spaceY: 0 /* SPACING */,
+  gap: 0 /* SPACING */,
+  gapX: 0 /* SPACING */,
+  gapY: 0 /* SPACING */,
+  inset: 0 /* SPACING */,
+  insetX: 0 /* SPACING */,
+  insetY: 0 /* SPACING */,
+  top: 0 /* SPACING */,
+  right: 0 /* SPACING */,
+  bottom: 0 /* SPACING */,
+  left: 0 /* SPACING */,
+  start: 0 /* SPACING */,
+  end: 0 /* SPACING */,
+  insetS: 0 /* SPACING */,
+  insetE: 0 /* SPACING */,
+  insetBs: 0 /* SPACING */,
+  insetBe: 0 /* SPACING */,
+  w: 0 /* SPACING */,
+  minW: 0 /* SPACING */,
+  maxW: 0 /* SPACING */,
+  h: 0 /* SPACING */,
+  minH: 0 /* SPACING */,
+  maxH: 0 /* SPACING */,
+  size: 0 /* SPACING */,
+  blockSize: 0 /* SPACING */,
+  minBlockSize: 0 /* SPACING */,
+  maxBlockSize: 0 /* SPACING */,
+  inlineSize: 0 /* SPACING */,
+  minInlineSize: 0 /* SPACING */,
+  maxInlineSize: 0 /* SPACING */,
+  basis: 0 /* SPACING */,
+  indent: 0 /* SPACING */,
+  scrollM: 0 /* SPACING */,
+  scrollMt: 0 /* SPACING */,
+  scrollMr: 0 /* SPACING */,
+  scrollMb: 0 /* SPACING */,
+  scrollMl: 0 /* SPACING */,
+  scrollMs: 0 /* SPACING */,
+  scrollMe: 0 /* SPACING */,
+  scrollMx: 0 /* SPACING */,
+  scrollMy: 0 /* SPACING */,
+  scrollP: 0 /* SPACING */,
+  scrollPt: 0 /* SPACING */,
+  scrollPr: 0 /* SPACING */,
+  scrollPb: 0 /* SPACING */,
+  scrollPl: 0 /* SPACING */,
+  scrollPs: 0 /* SPACING */,
+  scrollPe: 0 /* SPACING */,
+  scrollPx: 0 /* SPACING */,
+  scrollPy: 0 /* SPACING */,
+  scrollPbs: 0 /* SPACING */,
+  scrollPbe: 0 /* SPACING */,
+  scrollMbs: 0 /* SPACING */,
+  scrollMbe: 0 /* SPACING */,
+  translateX: 0 /* SPACING */,
+  translateY: 0 /* SPACING */,
+  borderSpacing: 0 /* SPACING */,
+  borderSpacingX: 0 /* SPACING */,
+  borderSpacingY: 0 /* SPACING */,
+  outlineOffset: 0 /* SPACING */,
+  ringOffset: 0 /* SPACING */,
+  underlineOffset: 0 /* SPACING */,
+  // ---- COLOR ----
+  bg: 1 /* COLOR */,
+  color: 1 /* COLOR */,
+  borderColor: 1 /* COLOR */,
+  divideColor: 1 /* COLOR */,
+  outlineColor: 1 /* COLOR */,
+  ringColor: 1 /* COLOR */,
+  ringOffsetColor: 1 /* COLOR */,
+  shadowColor: 1 /* COLOR */,
+  textShadowColor: 1 /* COLOR */,
+  decorationColor: 1 /* COLOR */,
+  accent: 1 /* COLOR */,
+  caret: 1 /* COLOR */,
+  fill: 1 /* COLOR */,
+  stroke: 1 /* COLOR */,
+  from: 1 /* COLOR */,
+  via: 1 /* COLOR */,
+  to: 1 /* COLOR */,
+  dropShadowColor: 1 /* COLOR */,
+  // ---- UNITLESS ----
+  opacity: 3 /* UNITLESS */,
+  z: 3 /* UNITLESS */,
+  order: 3 /* UNITLESS */,
+  columns: 3 /* UNITLESS */,
+  gridCols: 3 /* UNITLESS */,
+  gridRows: 3 /* UNITLESS */,
+  col: 3 /* UNITLESS */,
+  colSpan: 3 /* UNITLESS */,
+  colStart: 3 /* UNITLESS */,
+  colEnd: 3 /* UNITLESS */,
+  row: 3 /* UNITLESS */,
+  rowSpan: 3 /* UNITLESS */,
+  rowStart: 3 /* UNITLESS */,
+  rowEnd: 3 /* UNITLESS */,
+  lineClamp: 3 /* UNITLESS */,
+  grow: 3 /* UNITLESS */,
+  shrink: 3 /* UNITLESS */,
+  scale: 3 /* UNITLESS */,
+  scaleX: 3 /* UNITLESS */,
+  scaleY: 3 /* UNITLESS */,
+  brightness: 3 /* UNITLESS */,
+  contrast: 3 /* UNITLESS */,
+  saturate: 3 /* UNITLESS */,
+  hueRotate: 3 /* UNITLESS */,
+  backdropBrightness: 3 /* UNITLESS */,
+  backdropContrast: 3 /* UNITLESS */,
+  backdropSaturate: 3 /* UNITLESS */,
+  backdropHueRotate: 3 /* UNITLESS */,
+  backdropOpacity: 3 /* UNITLESS */,
+  strokeWidth: 3 /* UNITLESS */,
+  border: 3 /* UNITLESS */,
+  borderT: 3 /* UNITLESS */,
+  borderR: 3 /* UNITLESS */,
+  borderB: 3 /* UNITLESS */,
+  borderL: 3 /* UNITLESS */,
+  borderX: 3 /* UNITLESS */,
+  borderY: 3 /* UNITLESS */,
+  borderS: 3 /* UNITLESS */,
+  borderE: 3 /* UNITLESS */,
+  borderBs: 3 /* UNITLESS */,
+  borderBe: 3 /* UNITLESS */,
+  ring: 3 /* UNITLESS */,
+  outline: 3 /* UNITLESS */,
+  leading: 3 /* UNITLESS */,
+  decorationThickness: 3 /* UNITLESS */,
+  // ---- ANGLE ----
+  rotate: 4 /* ANGLE */,
+  skewX: 4 /* ANGLE */,
+  skewY: 4 /* ANGLE */,
+  // ---- DURATION ----
+  duration: 5 /* DURATION */,
+  delay: 5 /* DURATION */,
+  animationDelay: 5 /* DURATION */
+};
+function getPropertyCategory(property) {
+  return PROPERTY_CATEGORY_MAP[property] ?? 7 /* PASSTHROUGH */;
+}
+const COLOR_PROPERTIES = new Set(
+  Object.entries(PROPERTY_CATEGORY_MAP).filter(([, cat]) => cat === 1 /* COLOR */).map(([key]) => key)
+);
+function getCSSVariableName(property, variantPrefix) {
+  const prop = property.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+  if (variantPrefix) {
+    return `--_sz-${variantPrefix}-${prop}`;
+  }
+  return `--_sz-${prop}`;
+}
+
+const COLOR_STRING_KEYWORDS = /* @__PURE__ */ new Set([
+  "inherit",
+  "current",
+  "transparent",
+  "black",
+  "white",
+  "none"
+]);
+function isValidColorString(value) {
+  if (COLOR_STRING_KEYWORDS.has(value)) {
+    return true;
+  }
+  if (value.startsWith("--")) {
+    return true;
+  }
+  if (value.startsWith("#")) {
+    return true;
+  }
+  if (value.startsWith("[") && value.endsWith("]")) {
+    return true;
+  }
+  if (/^(rgb|hsl|oklch|color|hwb|lab|lch|oklab)\(/.test(value)) {
+    return true;
+  }
+  if (/^[a-zA-Z][a-zA-Z0-9]*(-[a-zA-Z0-9]+)*-\d+$/.test(value)) {
+    return true;
+  }
+  if (/^[a-zA-Z][a-zA-Z0-9]*(-[a-zA-Z][a-zA-Z0-9]*)*$/.test(value)) {
+    return true;
+  }
+  return false;
+}
+function hasSlashOpacity(value) {
+  const slashIdx = value.indexOf("/");
+  if (slashIdx === -1) {
+    return false;
+  }
+  return slashIdx > 0 && /\d$/.test(value.slice(0, slashIdx));
+}
+function stripInvalidColorStrings(sz) {
+  const result = {};
+  for (const [key, value] of Object.entries(sz)) {
+    if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+      result[key] = stripInvalidColorStrings(value);
+      continue;
+    }
+    if (typeof value === "string" && PROPERTY_CATEGORY_MAP[key] === PropertyCategory.COLOR) {
+      const strVal = value.replace(/!$/, "");
+      if (hasSlashOpacity(strVal)) {
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          const slashIdx = strVal.indexOf("/");
+          const colorPart = strVal.slice(0, slashIdx);
+          const opPart = strVal.slice(slashIdx + 1);
+          console.warn(
+            `[csszyx] "${key}: '${strVal}'" \u2014 string slash opacity is not supported. Use object form: { color: '${colorPart}', op: ${opPart} }.`
+          );
+        }
+        continue;
+      }
+      if (!isValidColorString(strVal)) {
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          console.warn(
+            `[csszyx] "${key}: '${strVal}'" is not a recognized color value and will be ignored. Use a Tailwind color ("blue-500"), CSS variable ("--my-color"), hex/rgb/hsl ("#ff0000"), or object form ({ color: "blue-500", op: 50 }).`
+          );
+        }
+        continue;
+      }
+    }
+    result[key] = value;
+  }
+  return result;
+}
+
+const PROPERTY_MAP = {
+  // Background
+  bg: "bg",
+  bgAttach: "bg",
+  bgClip: "bg-clip",
+  bgImg: "bg",
+  bgOrigin: "bg-origin",
+  bgPos: "bg",
+  bgRepeat: "bg",
+  bgSize: "bg",
+  // Gradient color stops
+  from: "from",
+  via: "via",
+  to: "to",
+  // Border Radius
+  rounded: "rounded",
+  roundedT: "rounded-t",
+  roundedR: "rounded-r",
+  roundedB: "rounded-b",
+  roundedL: "rounded-l",
+  roundedTl: "rounded-tl",
+  roundedTr: "rounded-tr",
+  roundedBl: "rounded-bl",
+  roundedBr: "rounded-br",
+  roundedS: "rounded-s",
+  roundedE: "rounded-e",
+  roundedSs: "rounded-ss",
+  roundedSe: "rounded-se",
+  roundedEs: "rounded-es",
+  roundedEe: "rounded-ee",
+  // Border
+  border: "border",
+  borderColor: "border",
+  borderStyle: "border",
+  borderT: "border-t",
+  borderR: "border-r",
+  borderB: "border-b",
+  borderL: "border-l",
+  borderX: "border-x",
+  borderY: "border-y",
+  borderS: "border-s",
+  borderE: "border-e",
+  borderBs: "border-bs",
+  borderBe: "border-be",
+  // Divide
+  divideX: "divide-x",
+  divideY: "divide-y",
+  divideColor: "divide",
+  divideStyle: "divide",
+  // Outline
+  outline: "outline",
+  outlineColor: "outline",
+  outlineOffset: "outline-offset",
+  outlineStyle: "outline",
+  // Ring (v4: outset ring + inset ring)
+  ring: "ring",
+  ringColor: "ring",
+  ringOffset: "ring-offset",
+  ringOffsetColor: "ring-offset",
+  insetRing: "inset-ring",
+  insetRingColor: "inset-ring",
+  // Spacing (canonical shorthand only)
+  p: "p",
+  pt: "pt",
+  pr: "pr",
+  pb: "pb",
+  pl: "pl",
+  px: "px",
+  py: "py",
+  ps: "ps",
+  pe: "pe",
+  pbs: "pbs",
+  pbe: "pbe",
+  m: "m",
+  mt: "mt",
+  mr: "mr",
+  mb: "mb",
+  ml: "ml",
+  mx: "mx",
+  my: "my",
+  ms: "ms",
+  me: "me",
+  mbs: "mbs",
+  mbe: "mbe",
+  // Space between
+  spaceX: "space-x",
+  spaceY: "space-y",
+  // Sizing (canonical shorthand only)
+  w: "w",
+  minW: "min-w",
+  maxW: "max-w",
+  h: "h",
+  minH: "min-h",
+  maxH: "max-h",
+  size: "size",
+  blockSize: "block",
+  minBlockSize: "min-block",
+  maxBlockSize: "max-block",
+  inlineSize: "inline",
+  minInlineSize: "min-inline",
+  maxInlineSize: "max-inline",
+  // Layout
+  aspect: "aspect",
+  columns: "columns",
+  breakAfter: "break-after",
+  breakBefore: "break-before",
+  breakInside: "break-inside",
+  boxDecoration: "box-decoration",
+  box: "box",
+  float: "float",
+  clear: "clear",
+  isolation: "isolation",
+  objectFit: "object",
+  objectPos: "object",
+  overflowX: "overflow-x",
+  overflowY: "overflow-y",
+  overscroll: "overscroll",
+  overscrollX: "overscroll-x",
+  overscrollY: "overscroll-y",
+  z: "z",
+  position: "position",
+  display: "display",
+  // Inset
+  inset: "inset",
+  insetX: "inset-x",
+  insetY: "inset-y",
+  top: "top",
+  right: "right",
+  bottom: "bottom",
+  left: "left",
+  // TW v4.2: start/end now emit inset-s-*/inset-e-* (same CSS, deprecated old class names)
+  start: "inset-s",
+  end: "inset-e",
+  insetS: "inset-s",
+  insetE: "inset-e",
+  insetBs: "inset-bs",
+  insetBe: "inset-be",
+  // Visibility
+  visibility: "visibility",
+  // Typography
+  color: "text",
+  text: "text",
+  fontWeight: "font",
+  weight: "font",
+  fontFamily: "font",
+  fontStretch: "font-stretch",
+  textAlign: "text",
+  decoration: "decoration",
+  decorationColor: "decoration",
+  decorationStyle: "decoration",
+  decorationThickness: "decoration",
+  underlineOffset: "underline-offset",
+  textTransform: "text",
+  textOverflow: "text",
+  textWrap: "text",
+  wrap: "wrap",
+  indent: "indent",
+  align: "align",
+  whitespace: "whitespace",
+  break: "break",
+  hyphens: "hyphens",
+  content: "content",
+  leading: "leading",
+  tracking: "tracking",
+  lineClamp: "line-clamp",
+  fontFeatures: "font-features",
+  list: "list",
+  listPos: "list",
+  listImg: "list-image",
+  // Flex & Grid
+  basis: "basis",
+  flexDir: "flex",
+  flexWrap: "flex",
+  grow: "grow",
+  shrink: "shrink",
+  order: "order",
+  items: "items",
+  self: "self",
+  justify: "justify",
+  justifyItems: "justify-items",
+  justifySelf: "justify-self",
+  placeContent: "place-content",
+  placeItems: "place-items",
+  placeSelf: "place-self",
+  gap: "gap",
+  gapX: "gap-x",
+  gapY: "gap-y",
+  // Grid
+  gridCols: "grid-cols",
+  gridRows: "grid-rows",
+  col: "col",
+  colSpan: "col-span",
+  colStart: "col-start",
+  colEnd: "col-end",
+  row: "row",
+  rowSpan: "row-span",
+  rowStart: "row-start",
+  rowEnd: "row-end",
+  gridFlow: "grid-flow",
+  autoCols: "auto-cols",
+  autoRows: "auto-rows",
+  // Effects
+  shadow: "shadow",
+  shadowColor: "shadow",
+  insetShadow: "inset-shadow",
+  insetShadowColor: "inset-shadow",
+  textShadow: "text-shadow",
+  textShadowColor: "text-shadow",
+  opacity: "opacity",
+  mixBlend: "mix-blend",
+  bgBlend: "bg-blend",
+  // Filters
+  blur: "blur",
+  brightness: "brightness",
+  contrast: "contrast",
+  dropShadow: "drop-shadow",
+  dropShadowColor: "drop-shadow",
+  grayscale: "grayscale",
+  hueRotate: "hue-rotate",
+  invert: "invert",
+  saturate: "saturate",
+  sepia: "sepia",
+  backdropBlur: "backdrop-blur",
+  backdropBrightness: "backdrop-brightness",
+  backdropContrast: "backdrop-contrast",
+  backdropGrayscale: "backdrop-grayscale",
+  backdropHueRotate: "backdrop-hue-rotate",
+  backdropInvert: "backdrop-invert",
+  backdropOpacity: "backdrop-opacity",
+  backdropSaturate: "backdrop-saturate",
+  backdropSepia: "backdrop-sepia",
+  // Transforms
+  scale: "scale",
+  scaleX: "scale-x",
+  scaleY: "scale-y",
+  scaleZ: "scale-z",
+  rotate: "rotate",
+  rotateX: "rotate-x",
+  rotateY: "rotate-y",
+  rotateZ: "rotate-z",
+  translate: "translate",
+  translateX: "translate-x",
+  translateY: "translate-y",
+  translateZ: "translate-z",
+  skewX: "skew-x",
+  skewY: "skew-y",
+  origin: "origin",
+  backface: "backface",
+  perspective: "perspective",
+  perspectiveOrigin: "perspective-origin",
+  transformStyle: "transform",
+  transform: "transform",
+  // Transitions & Animation
+  transition: "transition",
+  transitionBehavior: "transition",
+  duration: "duration",
+  ease: "ease",
+  delay: "delay",
+  animate: "animate",
+  animationDelay: "animation-delay",
+  // animation-delay — distinct from transition delay
+  // Masks
+  mask: "mask",
+  maskSize: "mask-size",
+  maskPos: "mask-position",
+  maskRepeat: "mask-repeat",
+  maskShape: "mask",
+  // Interactivity
+  cursor: "cursor",
+  caret: "caret",
+  pointerEvents: "pointer-events",
+  fieldSizing: "field-sizing",
+  scheme: "scheme",
+  resize: "resize",
+  scroll: "scroll",
+  scrollM: "scroll-m",
+  scrollMt: "scroll-mt",
+  scrollMr: "scroll-mr",
+  scrollMb: "scroll-mb",
+  scrollMl: "scroll-ml",
+  scrollMs: "scroll-ms",
+  scrollMe: "scroll-me",
+  scrollMx: "scroll-mx",
+  scrollMy: "scroll-my",
+  scrollP: "scroll-p",
+  scrollPt: "scroll-pt",
+  scrollPr: "scroll-pr",
+  scrollPb: "scroll-pb",
+  scrollPl: "scroll-pl",
+  scrollPs: "scroll-ps",
+  scrollPe: "scroll-pe",
+  scrollPx: "scroll-px",
+  scrollPy: "scroll-py",
+  scrollPbs: "scroll-pbs",
+  scrollPbe: "scroll-pbe",
+  scrollMbs: "scroll-mbs",
+  scrollMbe: "scroll-mbe",
+  snapAlign: "snap",
+  snapStop: "snap",
+  snapType: "snap",
+  touch: "touch",
+  select: "select",
+  willChange: "will-change",
+  appearance: "appearance",
+  accent: "accent",
+  forcedColorAdjust: "forced-color-adjust",
+  // SVG
+  fill: "fill",
+  stroke: "stroke",
+  strokeWidth: "stroke",
+  // Tables
+  borderCollapse: "border",
+  borderSpacing: "border-spacing",
+  borderSpacingX: "border-spacing-x",
+  borderSpacingY: "border-spacing-y",
+  tableLayout: "table",
+  caption: "caption",
+  // Overflow
+  overflow: "overflow"
+};
+const CSS_VAR_TYPE_HINTS = {
+  fontFamily: "family-name",
+  fontWeight: "weight",
+  text: "length"
+};
+const SUGGESTION_MAP = {
+  // Background
+  backgroundColor: "bg",
+  backgroundImage: "bgImg",
+  backgroundSize: "bgSize",
+  backgroundPosition: "bgPos",
+  backgroundRepeat: "bgRepeat",
+  bgAttachment: "bgAttach",
+  bgImage: "bgImg",
+  // Border Radius
+  borderRadius: "rounded",
+  borderTopLeftRadius: "roundedTl",
+  borderTopRightRadius: "roundedTr",
+  borderBottomLeftRadius: "roundedBl",
+  borderBottomRightRadius: "roundedBr",
+  // Border
+  borderWidth: "border",
+  // Spacing
+  padding: "p",
+  paddingTop: "pt",
+  paddingRight: "pr",
+  paddingBottom: "pb",
+  paddingLeft: "pl",
+  paddingX: "px",
+  paddingY: "py",
+  margin: "m",
+  marginTop: "mt",
+  marginRight: "mr",
+  marginBottom: "mb",
+  marginLeft: "ml",
+  marginX: "mx",
+  marginY: "my",
+  // Sizing
+  width: "w",
+  height: "h",
+  minWidth: "minW",
+  maxWidth: "maxW",
+  minHeight: "minH",
+  maxHeight: "maxH",
+  // Layout
+  aspectRatio: "aspect",
+  boxSizing: "box",
+  boxDecorationBreak: "boxDecoration",
+  objectPosition: "objectPos",
+  zIndex: "z",
+  // Typography
+  font: "fontWeight (for weight) or fontFamily (for family)",
+  fontStyle: "italic/notItalic (boolean)",
+  weight: "fontWeight",
+  textDecoration: "decoration or underline/lineThrough/noUnderline (boolean)",
+  textDecorationColor: "decorationColor",
+  textDecorationStyle: "decorationStyle",
+  textDecorationThickness: "decorationThickness",
+  textUnderlineOffset: "underlineOffset",
+  lineHeight: "leading",
+  letterSpacing: "tracking",
+  textIndent: "indent",
+  verticalAlign: "align",
+  wordBreak: "break",
+  overflowWrap: "wrap",
+  textWrap: "textWrap",
+  listStyleType: "list",
+  listStylePosition: "listPos",
+  listStyleImage: "listImg",
+  listStyle: "list",
+  listPosition: "listPos",
+  listImage: "listImg",
+  // Flex & Grid
+  flexBasis: "basis",
+  flexDirection: "flexDir",
+  flexGrow: "grow",
+  flexShrink: "shrink",
+  alignItems: "items",
+  alignContent: "content",
+  alignSelf: "self",
+  justifyContent: "justify",
+  gridTemplateColumns: "gridCols",
+  gridTemplateRows: "gridRows",
+  gridColumn: "col",
+  gridRow: "row",
+  gridAutoFlow: "gridFlow",
+  gridAutoColumns: "autoCols",
+  gridAutoRows: "autoRows",
+  // Effects
+  boxShadow: "shadow",
+  mixBlendMode: "mixBlend",
+  backgroundBlendMode: "bgBlend",
+  // Transitions
+  transitionProperty: "transition",
+  transitionDuration: "duration",
+  transitionTimingFunction: "ease",
+  transitionDelay: "delay",
+  animation: "animate",
+  transformOrigin: "origin",
+  // Interactivity
+  caretColor: "caret",
+  accentColor: "accent",
+  scrollBehavior: "scroll",
+  scrollMargin: "scrollM",
+  scrollPadding: "scrollP",
+  scrollSnapAlign: "snapAlign",
+  scrollSnapStop: "snapStop",
+  scrollSnapType: "snapType",
+  touchAction: "touch",
+  userSelect: "select",
+  captionSide: "caption",
+  // Boolean remaps
+  flexWrapReverse: "flexWrap: 'wrap-reverse'",
+  flexNowrap: "flexWrap: 'nowrap'"
+};
+const VARIANT_MAP = {
+  // Focus variants
+  focusWithin: "focus-within",
+  focusVisible: "focus-visible",
+  // Structural variants
+  firstOfType: "first-of-type",
+  lastOfType: "last-of-type",
+  onlyOfType: "only-of-type",
+  onlyChild: "only",
+  firstChild: "first",
+  lastChild: "last",
+  // Motion variants
+  motionReduce: "motion-reduce",
+  motionSafe: "motion-safe",
+  // Contrast variants
+  contrastMore: "contrast-more",
+  contrastLess: "contrast-less",
+  // Pseudo-element variants
+  firstLine: "first-line",
+  firstLetter: "first-letter",
+  // Form variants
+  placeholderShown: "placeholder-shown",
+  inRange: "in-range",
+  outOfRange: "out-of-range",
+  readOnly: "read-only",
+  // Pointer variants
+  pointerFine: "pointer-fine",
+  pointerCoarse: "pointer-coarse",
+  pointerNone: "pointer-none",
+  // Screen orientation
+  screenPortrait: "portrait",
+  screenLandscape: "landscape",
+  // Container query max variants
+  "@maxSm": "@max-sm",
+  "@maxMd": "@max-md",
+  "@maxLg": "@max-lg",
+  "@maxXl": "@max-xl",
+  "@max2xl": "@max-2xl"
+};
+const KNOWN_VARIANTS = /* @__PURE__ */ new Set([
+  // Responsive
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "2xl",
+  // Container queries
+  "@sm",
+  "@md",
+  "@lg",
+  "@xl",
+  "@2xl",
+  // Dark mode
+  "dark",
+  "light",
+  // Print/Media
+  "print",
+  "portrait",
+  "landscape",
+  // Motion
+  "motion-reduce",
+  "motion-safe",
+  "motionReduce",
+  "motionSafe",
+  // Contrast
+  "contrast-more",
+  "contrast-less",
+  "contrastMore",
+  "contrastLess",
+  // States
+  "hover",
+  "focus",
+  "focus-within",
+  "focus-visible",
+  "focusWithin",
+  "focusVisible",
+  "active",
+  "visited",
+  "target",
+  "disabled",
+  "enabled",
+  "checked",
+  "indeterminate",
+  "default",
+  "required",
+  "valid",
+  "invalid",
+  "in-range",
+  "out-of-range",
+  "inRange",
+  "outOfRange",
+  "placeholder-shown",
+  "placeholderShown",
+  "autofill",
+  "read-only",
+  "readOnly",
+  // Structure
+  "first",
+  "last",
+  "only",
+  "odd",
+  "even",
+  "empty",
+  "first-of-type",
+  "last-of-type",
+  "only-of-type",
+  "firstOfType",
+  "lastOfType",
+  "onlyOfType",
+  "first-child",
+  "last-child",
+  "only-child",
+  "firstChild",
+  "lastChild",
+  "onlyChild",
+  // Pseudo-elements
+  "before",
+  "after",
+  "placeholder",
+  "file",
+  "marker",
+  "selection",
+  "first-line",
+  "first-letter",
+  "firstLine",
+  "firstLetter",
+  "backdrop",
+  // Pointer
+  "pointer-fine",
+  "pointer-coarse",
+  "pointer-none",
+  "pointerFine",
+  "pointerCoarse",
+  "pointerNone",
+  // Open
+  "open",
+  // RTL/LTR
+  "ltr",
+  "rtl"
+]);
+const ARIA_STATES = /* @__PURE__ */ new Set([
+  "checked",
+  "disabled",
+  "expanded",
+  "hidden",
+  "pressed",
+  "readonly",
+  "required",
+  "selected",
+  "busy",
+  "current",
+  "invalid",
+  "live",
+  "atomic",
+  "modal"
+]);
+const BOOLEAN_SHORTHANDS = /* @__PURE__ */ new Set([
+  // Display
+  "block",
+  "inline",
+  "inlineBlock",
+  "flex",
+  "inlineFlex",
+  "grid",
+  "inlineGrid",
+  "hidden",
+  "contents",
+  "table",
+  "tableRow",
+  "tableCell",
+  "flowRoot",
+  "listItem",
+  // Position
+  "static",
+  "fixed",
+  "absolute",
+  "relative",
+  "sticky",
+  // Visibility
+  "visible",
+  "invisible",
+  "collapse",
+  // Typography
+  "truncate",
+  "uppercase",
+  "lowercase",
+  "capitalize",
+  "normalCase",
+  "underline",
+  "overline",
+  "lineThrough",
+  "noUnderline",
+  "italic",
+  "notItalic",
+  "antialiased",
+  "subpixelAntialiased",
+  // Flexbox (grow/shrink only — flexWrap uses string values)
+  "grow",
+  "shrink",
+  // Filters (default values)
+  "blur",
+  "grayscale",
+  "invert",
+  "sepia",
+  "backdropBlur",
+  "backdropGrayscale",
+  "backdropInvert",
+  "backdropSepia",
+  // Misc
+  "container",
+  "prose",
+  "proseInvert",
+  "srOnly",
+  "notSrOnly",
+  "isolate",
+  "ordinal",
+  "slashedZero",
+  // Font variant numeric
+  "liningNums",
+  "oldstyleNums",
+  "proportionalNums",
+  "tabularNums",
+  "diagonalFractions",
+  "stackedFractions",
+  // Divide/Space reverse
+  "divideXReverse",
+  "divideYReverse",
+  "spaceXReverse",
+  "spaceYReverse",
+  // Ring (v3 future)
+  "ring",
+  // Outline
+  "outline"
+]);
+const BOOLEAN_TO_CLASS = {
+  inlineBlock: "inline-block",
+  inlineFlex: "inline-flex",
+  inlineGrid: "inline-grid",
+  tableRow: "table-row",
+  tableCell: "table-cell",
+  flowRoot: "flow-root",
+  listItem: "list-item",
+  normalCase: "normal-case",
+  lineThrough: "line-through",
+  noUnderline: "no-underline",
+  notItalic: "not-italic",
+  subpixelAntialiased: "subpixel-antialiased",
+  backdropBlur: "backdrop-blur",
+  backdropGrayscale: "backdrop-grayscale",
+  backdropInvert: "backdrop-invert",
+  backdropSepia: "backdrop-sepia",
+  srOnly: "sr-only",
+  notSrOnly: "not-sr-only",
+  divideXReverse: "divide-x-reverse",
+  divideYReverse: "divide-y-reverse",
+  spaceXReverse: "space-x-reverse",
+  spaceYReverse: "space-y-reverse",
+  // Font variant numeric
+  liningNums: "lining-nums",
+  oldstyleNums: "oldstyle-nums",
+  proportionalNums: "proportional-nums",
+  tabularNums: "tabular-nums",
+  diagonalFractions: "diagonal-fractions",
+  stackedFractions: "stacked-fractions",
+  // Transforms
+  transformGpu: "transform-gpu",
+  transformCpu: "transform-cpu",
+  // Misc
+  proseInvert: "prose-invert"
+};
+const SNAP_DIRECT_MAP = {
+  snapAlign: {
+    start: "snap-start",
+    end: "snap-end",
+    center: "snap-center",
+    none: "snap-align-none"
+  },
+  snapStop: {
+    normal: "snap-normal",
+    always: "snap-always"
+  },
+  snapType: {
+    none: "snap-none",
+    x: "snap-x",
+    y: "snap-y",
+    both: "snap-both"
+  },
+  snapStrictness: {
+    mandatory: "snap-mandatory",
+    proximity: "snap-proximity"
+  }
+};
+const NEGATIVE_ALLOWED = /* @__PURE__ */ new Set([
+  "m",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "mx",
+  "my",
+  "ms",
+  "me",
+  "mbs",
+  "mbe",
+  "top",
+  "right",
+  "bottom",
+  "left",
+  "inset",
+  "inset-x",
+  "inset-y",
+  // TW v4.2: start/end now map to inset-s/inset-e
+  "inset-s",
+  "inset-e",
+  "inset-bs",
+  "inset-be",
+  "z",
+  "order",
+  "col",
+  "col-start",
+  "col-end",
+  "row",
+  "row-start",
+  "row-end",
+  "rotate",
+  "rotate-x",
+  "rotate-y",
+  "rotate-z",
+  "scale-z",
+  "skew-x",
+  "skew-y",
+  "translate",
+  "translate-x",
+  "translate-y",
+  "translate-z",
+  "mask",
+  "space-x",
+  "space-y",
+  "tracking",
+  "indent",
+  "scroll-m",
+  "scroll-mx",
+  "scroll-my",
+  "scroll-mt",
+  "scroll-mr",
+  "scroll-mb",
+  "scroll-ml",
+  "hue-rotate",
+  "backdrop-hue-rotate"
+]);
+function handleImportant(value) {
+  if (typeof value === "string" && value.endsWith("!")) {
+    return { value: value.slice(0, -1), important: true };
+  }
+  return { value, important: false };
+}
+function formatOpacity(op) {
+  if (typeof op === "number") {
+    if (Number.isInteger(op * 2)) {
+      return String(op);
+    }
+    return `[${op}]`;
+  }
+  if (typeof op === "string") {
+    if (op.startsWith("--")) {
+      return `(${op})`;
+    }
+    return `[${op}]`;
+  }
+  return String(op);
+}
+function isArbitraryVariant(key) {
+  return key.startsWith("[") && key.endsWith("]");
+}
+function normalizeArbitraryVariant(key) {
+  return key.replace(/\s+/g, "");
+}
+function normalizeArbitraryValue(value) {
+  const stripped = value.startsWith("[") && value.endsWith("]") ? value.slice(1, -1) : value;
+  return stripped.trim().replace(/\s+/g, "_");
+}
+const FRACTION_SUPPORTED_PROPS = /* @__PURE__ */ new Set([
+  // Sizing (both rawKey and resolved key forms)
+  "w",
+  "width",
+  "min-w",
+  "minW",
+  "minWidth",
+  "max-w",
+  "maxW",
+  "maxWidth",
+  "h",
+  "height",
+  "min-h",
+  "minH",
+  "minHeight",
+  "max-h",
+  "maxH",
+  "maxHeight",
+  "size",
+  // Flex
+  "basis",
+  "flexBasis",
+  "flex",
+  // Inset
+  "inset",
+  "inset-x",
+  "insetX",
+  "inset-y",
+  "insetY",
+  "top",
+  "right",
+  "bottom",
+  "left",
+  "start",
+  "end",
+  // Translate
+  "translate",
+  "translate-x",
+  "translateX",
+  "translate-y",
+  "translateY",
+  // Aspect
+  "aspect"
+]);
+function needsArbitraryBrackets(value) {
+  const v = value.startsWith("[") && value.endsWith("]") ? value.slice(1, -1) : value;
+  return /^\d+(\.\d+)?(px|rem|em|%|vh|vw|ch|dvh|dvw|svh|svw|lvh|lvw|cqw|cqh|deg|rad|turn|grad|ms|s|fr)$/.test(
+    v
+  ) || // Positive units
+  /^-\d+(\.\d+)?(px|rem|em|%|vh|vw|ch|dvh|dvw|svh|svw|lvh|lvw|cqw|cqh|deg|rad|turn|grad|ms|s|fr)$/.test(
+    v
+  ) || // Negative units like -1px, -2rem
+  /^\.\d+(px|rem|em|%|vh|vw|ch)?$/.test(v) || // Values starting with . like .25em
+  /^-\.\d+(px|rem|em|%|vh|vw|ch)?$/.test(v) || // Negative values starting with -. like -.25em
+  v.startsWith("#") || // Hex colors
+  v.startsWith("rgb") || // RGB colors
+  v.startsWith("hsl") || // HSL colors
+  v.includes("calc(") || // Calculations
+  v.includes("var(") || // CSS variables (old syntax)
+  v.includes("attr(") || // attr() function
+  v.includes("url(") || // URLs
+  v.includes("clamp(") || // Clamp
+  v.includes("min(") || // Min
+  v.includes("max(") || // Max
+  v.includes(" ");
+}
+const LIST_STYLE_STANDARD = /* @__PURE__ */ new Set(["none", "disc", "decimal"]);
+const FONT_STRETCH_KEYWORDS = /* @__PURE__ */ new Set([
+  "ultra-condensed",
+  "extra-condensed",
+  "condensed",
+  "semi-condensed",
+  "normal",
+  "semi-expanded",
+  "expanded",
+  "extra-expanded",
+  "ultra-expanded"
+]);
+function camelToKebab(prop) {
+  if (prop.startsWith("--")) {
+    return prop;
+  }
+  return prop.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+}
+function getVariantPrefix(key) {
+  if (VARIANT_MAP[key]) {
+    return VARIANT_MAP[key];
+  }
+  return key.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+}
+function handleGroupPeer(type, nestedObj, prefix) {
+  const classes = [];
+  for (const [nestedKey, nestedValue] of Object.entries(nestedObj)) {
+    if (nestedValue === null || nestedValue === void 0 || nestedValue === false) {
+      continue;
+    }
+    if (nestedKey === "has" && typeof nestedValue === "object") {
+      for (const [selector, selectorValue] of Object.entries(nestedValue)) {
+        if (selectorValue === null || selectorValue === void 0 || selectorValue === false) {
+          continue;
+        }
+        const variantPrefix = `${prefix}${type}-has-[${selector}]:`;
+        const result = transform(selectorValue, variantPrefix);
+        if (result.className) {
+          classes.push(result.className);
+        }
+      }
+      continue;
+    }
+    if (nestedKey === "data" && typeof nestedValue === "object") {
+      for (const [attr, attrValue] of Object.entries(nestedValue)) {
+        if (attrValue === null || attrValue === void 0 || attrValue === false) {
+          continue;
+        }
+        const variantPrefix = `${prefix}${type}-data-[${attr}]:`;
+        const result = transform(attrValue, variantPrefix);
+        if (result.className) {
+          classes.push(result.className);
+        }
+      }
+      continue;
+    }
+    if (nestedKey === "aria" && typeof nestedValue === "object") {
+      for (const [attr, attrValue] of Object.entries(nestedValue)) {
+        if (attrValue === null || attrValue === void 0 || attrValue === false) {
+          continue;
+        }
+        const variantPrefix = ARIA_STATES.has(attr) ? `${prefix}${type}-aria-${attr}:` : `${prefix}${type}-aria-[${attr}]:`;
+        const result = transform(attrValue, variantPrefix);
+        if (result.className) {
+          classes.push(result.className);
+        }
+      }
+      continue;
+    }
+    const isVariant = KNOWN_VARIANTS.has(nestedKey) || KNOWN_VARIANTS.has(getVariantPrefix(nestedKey));
+    const isArbitrary = nestedKey.startsWith(".") || nestedKey.startsWith("#") || nestedKey.startsWith("[") || nestedKey.startsWith(":");
+    if (isArbitrary) {
+      const variantPrefix = `${prefix}${type}-[${nestedKey}]:`;
+      const result = transform(nestedValue, variantPrefix);
+      if (result.className) {
+        classes.push(result.className);
+      }
+    } else if (isVariant) {
+      const mappedVariant = getVariantPrefix(nestedKey);
+      const variantPrefix = `${prefix}${type}-${mappedVariant}:`;
+      const result = transform(nestedValue, variantPrefix);
+      if (result.className) {
+        classes.push(result.className);
+      }
+    } else if (typeof nestedValue === "object" && nestedValue !== null) {
+      for (const [state, stateValue] of Object.entries(nestedValue)) {
+        if (stateValue === null || stateValue === void 0 || stateValue === false) {
+          continue;
+        }
+        if (state === "data" && typeof stateValue === "object") {
+          for (const [attr, attrValue] of Object.entries(stateValue)) {
+            if (attrValue === null || attrValue === void 0 || attrValue === false) {
+              continue;
+            }
+            const variantPrefix2 = `${prefix}${type}-data-[${attr}]/${nestedKey}:`;
+            const result2 = transform(attrValue, variantPrefix2);
+            if (result2.className) {
+              classes.push(result2.className);
+            }
+          }
+          continue;
+        }
+        if (state === "aria" && typeof stateValue === "object") {
+          for (const [attr, attrValue] of Object.entries(stateValue)) {
+            if (attrValue === null || attrValue === void 0 || attrValue === false) {
+              continue;
+            }
+            const ariaSegment = ARIA_STATES.has(attr) ? `aria-${attr}` : `aria-[${attr}]`;
+            const variantPrefix2 = `${prefix}${type}-${ariaSegment}/${nestedKey}:`;
+            const result2 = transform(attrValue, variantPrefix2);
+            if (result2.className) {
+              classes.push(result2.className);
+            }
+          }
+          continue;
+        }
+        const mappedState = getVariantPrefix(state);
+        const variantPrefix = `${prefix}${type}-${mappedState}/${nestedKey}:`;
+        const result = transform(stateValue, variantPrefix);
+        if (result.className) {
+          classes.push(result.className);
+        }
+      }
+    }
+  }
+  return classes;
+}
+function handleHas(hasObj, prefix) {
+  const classes = [];
+  for (const [selector, value] of Object.entries(hasObj)) {
+    if (value === null || value === void 0 || value === false) {
+      continue;
+    }
+    let selectorStr;
+    if (KNOWN_VARIANTS.has(selector) || selector.startsWith(":")) {
+      selectorStr = selector.startsWith(":") ? selector : `:${selector}`;
+    } else {
+      selectorStr = selector;
+    }
+    const variantPrefix = `${prefix}has-[${selectorStr}]:`;
+    const result = transform(value, variantPrefix);
+    if (result.className) {
+      classes.push(result.className);
+    }
+  }
+  return classes;
+}
+function handleNot(notObj, prefix) {
+  const classes = [];
+  for (const [key, value] of Object.entries(notObj)) {
+    if (value === null || value === void 0 || value === false) {
+      continue;
+    }
+    if (key === "supports" && typeof value === "object") {
+      for (const [condition, condValue] of Object.entries(value)) {
+        const variantPrefix = `${prefix}not-supports-[${condition}]:`;
+        const result = transform(condValue, variantPrefix);
+        if (result.className) {
+          classes.push(result.className);
+        }
+      }
+    } else {
+      const mappedVariant = getVariantPrefix(key);
+      const variantPrefix = `${prefix}not-${mappedVariant}:`;
+      const result = transform(value, variantPrefix);
+      if (result.className) {
+        classes.push(result.className);
+      }
+    }
+  }
+  return classes;
+}
+function handleData(dataObj, prefix) {
+  const classes = [];
+  for (const [key, value] of Object.entries(dataObj)) {
+    if (value === null || value === void 0 || value === false) {
+      continue;
+    }
+    const variantPrefix = `${prefix}data-[${key}]:`;
+    const result = transform(value, variantPrefix);
+    if (result.className) {
+      classes.push(result.className);
+    }
+  }
+  return classes;
+}
+function handleAria(ariaObj, prefix) {
+  const classes = [];
+  for (const [key, value] of Object.entries(ariaObj)) {
+    if (value === null || value === void 0 || value === false) {
+      continue;
+    }
+    let variantPrefix;
+    if (ARIA_STATES.has(key)) {
+      variantPrefix = `${prefix}aria-${key}:`;
+    } else {
+      variantPrefix = `${prefix}aria-[${key}]:`;
+    }
+    const result = transform(value, variantPrefix);
+    if (result.className) {
+      classes.push(result.className);
+    }
+  }
+  return classes;
+}
+function handleSupports(supportsObj, prefix) {
+  const classes = [];
+  for (const [condition, value] of Object.entries(supportsObj)) {
+    if (value === null || value === void 0 || value === false) {
+      continue;
+    }
+    const variantPrefix = `${prefix}supports-[${condition}]:`;
+    const result = transform(value, variantPrefix);
+    if (result.className) {
+      classes.push(result.className);
+    }
+  }
+  return classes;
+}
+function transform(szProp, prefix = "", mangleMap) {
+  if (!szProp || typeof szProp !== "object") {
+    return { className: "", attributes: {} };
+  }
+  const classes = [];
+  const attributes = {};
+  for (const [rawKey, value] of Object.entries(szProp)) {
+    if (value === false) {
+      if (rawKey === "italic") {
+        classes.push(`${prefix}not-italic`);
+      } else if (rawKey === "antialiased") {
+        classes.push(`${prefix}subpixel-antialiased`);
+      }
+      continue;
+    }
+    if (value === null || value === void 0) {
+      continue;
+    }
+    if (rawKey === "css") {
+      if (value && typeof value === "object" && !Array.isArray(value)) {
+        for (const [cssProp, cssVal] of Object.entries(value)) {
+          if (cssVal === null || cssVal === void 0) {
+            continue;
+          }
+          const kebab = camelToKebab(cssProp);
+          classes.push(`${prefix}[${kebab}:${normalizeArbitraryValue(String(cssVal))}]`);
+        }
+      }
+      continue;
+    }
+    if (rawKey.startsWith("@") && typeof value === "string") {
+      const mappedKey = VARIANT_MAP[rawKey] || rawKey;
+      classes.push(`${prefix}${mappedKey}/${value}`);
+      continue;
+    }
+    if (rawKey === "bgImg" && typeof value === "object" && value !== null && !Array.isArray(value)) {
+      const grad = value;
+      const gradType = grad.gradient;
+      if (!gradType) {
+        continue;
+      }
+      let cls = "";
+      if (gradType === "linear") {
+        const dir = grad.dir ?? "to-r";
+        if (typeof dir === "number") {
+          if (dir < 0) {
+            cls = `-bg-linear-${Math.abs(dir)}`;
+          } else {
+            cls = `bg-linear-${dir}`;
+          }
+        } else if (typeof dir === "string") {
+          if (dir.startsWith("--")) {
+            cls = `bg-linear-(${dir})`;
+          } else if (dir.startsWith("to-")) {
+            cls = `bg-linear-${dir}`;
+          } else {
+            cls = `bg-linear-[${normalizeArbitraryValue(dir)}]`;
+          }
+        }
+      } else if (gradType === "radial") {
+        const dir = grad.dir;
+        if (dir === void 0 || dir === null) {
+          cls = "bg-radial";
+        } else if (typeof dir === "string") {
+          if (dir.startsWith("--")) {
+            cls = `bg-radial-(${dir})`;
+          } else {
+            cls = `bg-radial-[${normalizeArbitraryValue(dir)}]`;
+          }
+        }
+      } else if (gradType === "conic") {
+        const dir = grad.dir;
+        if (dir === void 0 || dir === null) {
+          cls = "bg-conic";
+        } else if (typeof dir === "number") {
+          if (dir < 0) {
+            cls = `-bg-conic-${Math.abs(dir)}`;
+          } else {
+            cls = `bg-conic-${dir}`;
+          }
+        } else if (typeof dir === "string") {
+          if (dir.startsWith("--")) {
+            cls = `bg-conic-(${dir})`;
+          } else {
+            cls = `bg-conic-[${normalizeArbitraryValue(dir)}]`;
+          }
+        }
+      }
+      if (grad.in) {
+        cls += `/${grad.in}`;
+      }
+      if (cls) {
+        classes.push(`${prefix}${cls}`);
+      }
+      continue;
+    }
+    if ((rawKey === "group" || rawKey === "peer") && typeof value === "string") {
+      classes.push(`${prefix}${rawKey}/${value}`);
+      continue;
+    }
+    if (typeof value === "object" && value !== null && !Array.isArray(value) && rawKey in PROPERTY_MAP && "color" in value) {
+      const colorObj = value;
+      const twPrefix = PROPERTY_MAP[rawKey] || rawKey.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+      const rawColorBase = String(colorObj.color);
+      const colorBase = rawColorBase.startsWith("--") ? `(${rawColorBase})` : needsArbitraryBrackets(rawColorBase) ? `[${normalizeArbitraryValue(rawColorBase)}]` : normalizeArbitraryValue(rawColorBase);
+      if (colorObj.op !== void 0) {
+        const opStr = formatOpacity(colorObj.op);
+        classes.push(`${prefix}${twPrefix}-${colorBase}/${opStr}`);
+      } else {
+        classes.push(`${prefix}${twPrefix}-${colorBase}`);
+      }
+      continue;
+    }
+    if (typeof value === "string" && PROPERTY_CATEGORY_MAP[rawKey] === PropertyCategory.COLOR) {
+      const strVal = value.replace(/!$/, "");
+      if (hasSlashOpacity(strVal)) {
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          const slashIdx = strVal.indexOf("/");
+          const colorPart = strVal.slice(0, slashIdx);
+          const opPart = strVal.slice(slashIdx + 1);
+          console.warn(
+            `[csszyx] "${rawKey}: '${strVal}'" \u2014 string slash opacity is not supported. Use object form: { color: '${colorPart}', op: ${opPart} }.`
+          );
+        }
+        continue;
+      }
+      if (!isValidColorString(strVal)) {
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          console.warn(
+            `[csszyx] "${rawKey}: '${strVal}'" is not a recognized color value and will be ignored. Use a Tailwind color ("blue-500"), CSS variable ("--my-color"), hex/rgb/hsl ("#ff0000"), or object form ({ color: "blue-500", op: 50 }).`
+          );
+        }
+        continue;
+      }
+    }
+    if (typeof value === "object" && !Array.isArray(value)) {
+      if (rawKey === "group") {
+        const groupClasses = handleGroupPeer("group", value, prefix);
+        classes.push(...groupClasses);
+        continue;
+      }
+      if (rawKey === "peer") {
+        const peerClasses = handleGroupPeer("peer", value, prefix);
+        classes.push(...peerClasses);
+        continue;
+      }
+      if (rawKey === "has") {
+        const hasClasses = handleHas(value, prefix);
+        classes.push(...hasClasses);
+        continue;
+      }
+      if (rawKey === "not") {
+        const notClasses = handleNot(value, prefix);
+        classes.push(...notClasses);
+        continue;
+      }
+      if (rawKey === "data") {
+        const dataClasses = handleData(value, prefix);
+        classes.push(...dataClasses);
+        continue;
+      }
+      if (rawKey === "aria") {
+        const ariaClasses = handleAria(value, prefix);
+        classes.push(...ariaClasses);
+        continue;
+      }
+      if (rawKey === "supports") {
+        const supportsClasses = handleSupports(value, prefix);
+        classes.push(...supportsClasses);
+        continue;
+      }
+      if (rawKey === "min" || rawKey === "max") {
+        const KNOWN_BP = /* @__PURE__ */ new Set(["sm", "md", "lg", "xl", "2xl"]);
+        for (const [breakpoint, breakpointValue] of Object.entries(value)) {
+          if (breakpointValue === null || breakpointValue === void 0 || breakpointValue === false) {
+            continue;
+          }
+          let bpStr;
+          if (isArbitraryVariant(breakpoint)) {
+            bpStr = `${rawKey}-${breakpoint}`;
+          } else if (KNOWN_BP.has(breakpoint)) {
+            bpStr = `${rawKey}-${breakpoint}`;
+          } else {
+            bpStr = `${rawKey}-[${breakpoint}]`;
+          }
+          const nestedPrefix2 = `${prefix}${bpStr}:`;
+          const result = transform(breakpointValue, nestedPrefix2);
+          if (result.className) {
+            classes.push(result.className);
+          }
+        }
+        continue;
+      }
+      if (rawKey.startsWith("@")) {
+        const mappedKey = VARIANT_MAP[rawKey] || rawKey;
+        if (typeof value === "string") {
+          classes.push(`${prefix}${mappedKey}/${value}`);
+          continue;
+        }
+        const KNOWN_BP = /* @__PURE__ */ new Set(["sm", "md", "lg", "xl", "2xl"]);
+        for (const [nestedKey, nestedValue] of Object.entries(value)) {
+          if (nestedValue === null || nestedValue === void 0 || nestedValue === false) {
+            continue;
+          }
+          if (isArbitraryVariant(nestedKey)) {
+            const nestedPrefix2 = `${prefix}${mappedKey}-${nestedKey}:`;
+            const result = transform(nestedValue, nestedPrefix2);
+            if (result.className) {
+              classes.push(result.className);
+            }
+          } else if ((mappedKey === "@min" || mappedKey === "@max") && typeof nestedValue === "object" && nestedValue !== null && !KNOWN_BP.has(nestedKey) && !PROPERTY_MAP[nestedKey] && !BOOLEAN_SHORTHANDS.has(nestedKey)) {
+            const nestedPrefix2 = `${prefix}${mappedKey}-[${nestedKey}]:`;
+            const result = transform(nestedValue, nestedPrefix2);
+            if (result.className) {
+              classes.push(result.className);
+            }
+          } else if (PROPERTY_MAP[nestedKey] || BOOLEAN_SHORTHANDS.has(nestedKey) || nestedKey.startsWith("@")) {
+            const nestedPrefix2 = `${prefix}${mappedKey}:`;
+            const result = transform(
+              { [nestedKey]: nestedValue },
+              nestedPrefix2
+            );
+            if (result.className) {
+              classes.push(result.className);
+            }
+          } else if (typeof nestedValue === "object" && nestedValue !== null) {
+            const nestedPrefix2 = `${prefix}${mappedKey}/${nestedKey}:`;
+            const result = transform(nestedValue, nestedPrefix2);
+            if (result.className) {
+              classes.push(result.className);
+            }
+          } else {
+            const nestedPrefix2 = `${prefix}${mappedKey}:`;
+            const result = transform(
+              { [nestedKey]: nestedValue },
+              nestedPrefix2
+            );
+            if (result.className) {
+              classes.push(result.className);
+            }
+          }
+        }
+        continue;
+      }
+      if (isArbitraryVariant(rawKey)) {
+        const normalizedKey = normalizeArbitraryVariant(rawKey);
+        const nestedPrefix2 = `${prefix}${normalizedKey}:`;
+        const nestedResult2 = transform(value, nestedPrefix2);
+        if (nestedResult2.className) {
+          classes.push(nestedResult2.className);
+        }
+        continue;
+      }
+      const variantName = getVariantPrefix(rawKey);
+      const nestedPrefix = `${prefix}${variantName}:`;
+      const nestedResult = transform(value, nestedPrefix);
+      if (nestedResult.className) {
+        classes.push(nestedResult.className);
+      }
+      continue;
+    }
+    if (SNAP_DIRECT_MAP[rawKey] && typeof value === "string") {
+      const mapped = SNAP_DIRECT_MAP[rawKey][value];
+      if (mapped) {
+        classes.push(`${prefix}${mapped}`);
+        continue;
+      }
+    }
+    if (typeof value === "string" && KNOWN_VARIANTS.has(rawKey)) {
+      const variantName = getVariantPrefix(rawKey);
+      classes.push(`${prefix}${variantName}:${value}`);
+      continue;
+    }
+    if (rawKey.startsWith("--")) {
+      classes.push(`${prefix}[${rawKey}:${value}]`);
+      continue;
+    }
+    if (rawKey === "container") {
+      if (value === true) {
+        classes.push(`${prefix}container`);
+      } else if (typeof value === "string") {
+        classes.push(`${prefix}@container/${value}`);
+      }
+      continue;
+    }
+    let key = rawKey;
+    if (PROPERTY_MAP[key]) {
+      key = PROPERTY_MAP[key];
+    } else {
+      key = key.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+    }
+    let className = prefix;
+    if (rawKey === "willChange" && typeof value === "string") {
+      const WILL_CHANGE_KEYWORDS = /* @__PURE__ */ new Set(["auto", "scroll", "contents", "transform"]);
+      if (WILL_CHANGE_KEYWORDS.has(value)) {
+        classes.push(`${prefix}will-change-${value}`);
+      } else if (value.startsWith("--")) {
+        classes.push(`${prefix}will-change-(${value})`);
+      } else {
+        classes.push(`${prefix}will-change-[${normalizeArbitraryValue(value)}]`);
+      }
+      continue;
+    }
+    if (key === "display") {
+      if (typeof value === "string") {
+        if (value === "none") {
+          className += "hidden";
+        } else {
+          className += value;
+        }
+        classes.push(className);
+        continue;
+      }
+    }
+    if (key === "position") {
+      if (typeof value === "string") {
+        className += value;
+        classes.push(className);
+        continue;
+      }
+    }
+    if (key === "visibility") {
+      if (typeof value === "string") {
+        if (value === "hidden") {
+          className += "invisible";
+        } else {
+          className += value;
+        }
+        classes.push(className);
+        continue;
+      }
+    }
+    if (key === "isolation") {
+      if (typeof value === "string") {
+        if (value === "isolate") {
+          className += "isolate";
+        } else {
+          className += `isolation-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+    }
+    if ((rawKey === "fromPos" || rawKey === "viaPos" || rawKey === "toPos") && typeof value === "number") {
+      const gradPrefix = rawKey.replace("Pos", "");
+      classes.push(`${prefix}${gradPrefix}-${value}%`);
+      continue;
+    }
+    if (typeof value === "string") {
+      if (rawKey === "decoration") {
+        if (["underline", "overline", "line-through", "no-underline", "none"].includes(
+          value
+        )) {
+          className += value === "none" ? "no-underline" : value;
+          classes.push(className);
+          continue;
+        }
+      }
+      if (rawKey === "textTransform") {
+        if (["uppercase", "lowercase", "capitalize", "normal-case"].includes(value)) {
+          className += value;
+          classes.push(className);
+          continue;
+        }
+      }
+      if (rawKey === "fontVariant") {
+        const FONT_VARIANT_CLASSES = /* @__PURE__ */ new Set([
+          "normal-nums",
+          "ordinal",
+          "slashed-zero",
+          "lining-nums",
+          "oldstyle-nums",
+          "proportional-nums",
+          "tabular-nums",
+          "diagonal-fractions",
+          "stacked-fractions"
+        ]);
+        if (FONT_VARIANT_CLASSES.has(value)) {
+          className += value;
+          classes.push(className);
+          continue;
+        }
+      }
+      if (rawKey === "textWrap") {
+        className += `text-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "break") {
+        const wbMap = {
+          normal: "break-normal",
+          all: "break-all",
+          keep: "break-keep",
+          "break-normal": "break-normal",
+          "break-all": "break-all",
+          "break-keep": "break-keep"
+        };
+        className += wbMap[value] || `break-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "wrap") {
+        const owMap = {
+          normal: "wrap-normal",
+          "break-word": "wrap-break-word",
+          anywhere: "wrap-anywhere",
+          "wrap-normal": "wrap-normal",
+          "wrap-break-word": "wrap-break-word",
+          "wrap-anywhere": "wrap-anywhere"
+        };
+        className += owMap[value] || `wrap-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "textOverflow") {
+        if (value === "ellipsis" || value === "clip") {
+          classes.push(`${prefix}text-${value}`);
+        } else {
+          classes.push(`${prefix}text-[${value}]`);
+        }
+        continue;
+      }
+      if (rawKey === "lineClamp") {
+        const sValue = String(value);
+        if (sValue.startsWith("--")) {
+          className += `line-clamp-(${sValue})`;
+        } else {
+          const numVal = Number(sValue);
+          if (!Number.isNaN(numVal) && Number.isInteger(numVal)) {
+            className += `line-clamp-${sValue}`;
+          } else {
+            className += `line-clamp-[${sValue}]`;
+          }
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "list" || rawKey === "listStyle") {
+        const sValue = String(value);
+        if (sValue.startsWith("--")) {
+          className += `list-(${sValue})`;
+        } else if (LIST_STYLE_STANDARD.has(sValue)) {
+          className += `list-${sValue}`;
+        } else {
+          className += `list-[${sValue}]`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "listPos") {
+        className += `list-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "divideStyle") {
+        className += `divide-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "decorationStyle" || rawKey === "textDecorationStyle") {
+        className += `decoration-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "decorationColor" || rawKey === "textDecorationColor") {
+        className += `decoration-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "decorationThickness" || rawKey === "textDecorationThickness") {
+        if (needsArbitraryBrackets(value)) {
+          className += `decoration-[${normalizeArbitraryValue(value)}]`;
+        } else if (value.startsWith("--")) {
+          className += `decoration-(${value})`;
+        } else {
+          className += `decoration-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "fontStretch") {
+        const sValue = String(value);
+        if (FONT_STRETCH_KEYWORDS.has(sValue)) {
+          className += `font-${sValue}`;
+        } else if (sValue.startsWith("--")) {
+          className += `font-stretch-(${sValue})`;
+        } else if (/^\d+(\.\d+)?%$/.test(sValue)) {
+          const valNum = parseFloat(sValue);
+          if (sValue.includes(".") || !Number.isInteger(valNum)) {
+            className += `font-stretch-[${sValue}]`;
+          } else {
+            className += `font-stretch-${sValue}`;
+          }
+        } else {
+          className += `font-stretch-[${sValue}]`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maxW" && value === "container") {
+        classes.push("container");
+        continue;
+      }
+      if (rawKey === "shadowColor") {
+        if (String(value).startsWith("--")) {
+          classes.push(`shadow-(color:${value})`);
+        } else {
+          classes.push(`shadow-${value}`);
+        }
+        continue;
+      }
+      if (rawKey === "insetShadowColor") {
+        if (String(value).startsWith("--")) {
+          classes.push(`${prefix}inset-shadow-(color:${value})`);
+        } else {
+          classes.push(`${prefix}inset-shadow-${value}`);
+        }
+        continue;
+      }
+      if (rawKey === "brightness" || rawKey === "contrast" || rawKey === "saturate" || rawKey === "scale" || rawKey === "backdropBrightness" || rawKey === "backdropContrast" || rawKey === "backdropSaturate") {
+        const prop = rawKey.startsWith("backdrop") ? `backdrop-${rawKey.slice(8).toLowerCase()}` : rawKey;
+        const sValue = String(value);
+        if (sValue === "3d" && rawKey === "scale") {
+          classes.push(`${prefix}scale-3d`);
+        } else if (sValue.startsWith("--")) {
+          classes.push(`${prop}-(${sValue})`);
+        } else {
+          classes.push(`${prop}-[${sValue}]`);
+        }
+        continue;
+      }
+      if (rawKey === "textShadow") {
+        if (value === "none") {
+          className += "text-shadow-none";
+        } else if (value === "") {
+          className += "text-shadow";
+        } else if (needsArbitraryBrackets(value)) {
+          className += `text-shadow-[${normalizeArbitraryValue(value)}]`;
+        } else {
+          className += `text-shadow-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "textShadowColor") {
+        className += `text-shadow-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "fromPos" || rawKey === "viaPos" || rawKey === "toPos") {
+        const gradPrefix = rawKey.replace("Pos", "");
+        const sValue = String(value);
+        if (value.startsWith("--")) {
+          classes.push(`${gradPrefix}-(${value})`);
+        } else if (/^\d+%$/.test(sValue)) {
+          classes.push(`${gradPrefix}-${sValue}`);
+        } else {
+          classes.push(`${gradPrefix}-[${sValue}]`);
+        }
+        continue;
+      }
+      if (rawKey === "bgImg") {
+        const v = String(value).trim();
+        if (v === "none") {
+          classes.push(`${prefix}bg-none`);
+          continue;
+        }
+        const vNorm = v.startsWith("-") ? v.slice(1) : v;
+        if (vNorm.startsWith("repeating-")) {
+          classes.push(`${prefix}bg-[${normalizeArbitraryValue(v)}]`);
+          continue;
+        }
+        if (vNorm.startsWith("linear-") || vNorm.startsWith("radial") || vNorm.startsWith("conic") || vNorm.startsWith("gradient-to-")) {
+          const vMapped = vNorm.startsWith("gradient-to-") ? vNorm.replace("gradient-to-", "linear-to-") : vNorm;
+          if (v.startsWith("-")) {
+            classes.push(`${prefix}-bg-${vMapped}`);
+          } else {
+            classes.push(`${prefix}bg-${vMapped}`);
+          }
+          continue;
+        }
+        if (v.startsWith("--")) {
+          classes.push(`${prefix}bg-(image:${v})`);
+          continue;
+        }
+        if (v.startsWith("url(")) {
+          classes.push(`${prefix}bg-[${v}]`);
+          continue;
+        }
+        classes.push(`${prefix}bg-[url(${v})]`);
+        continue;
+      }
+      if (rawKey === "bgPos") {
+        const sVal = String(value);
+        if (sVal.startsWith("--")) {
+          classes.push(`${prefix}bg-(${sVal})`);
+        } else if (sVal.includes("_") || needsArbitraryBrackets(sVal)) {
+          classes.push(`${prefix}bg-[${normalizeArbitraryValue(sVal)}]`);
+        } else {
+          classes.push(`${prefix}bg-${sVal}`);
+        }
+        continue;
+      }
+      if (rawKey === "bgSize") {
+        const sVal = String(value);
+        if (sVal === "auto" || sVal === "cover" || sVal === "contain") {
+          classes.push(`${prefix}bg-${sVal}`);
+        } else if (sVal.startsWith("--")) {
+          classes.push(`${prefix}bg-size-(${sVal})`);
+        } else {
+          classes.push(`${prefix}bg-size-[${normalizeArbitraryValue(sVal)}]`);
+        }
+        continue;
+      }
+      if (rawKey === "maskPos") {
+        className += `mask-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskRepeat") {
+        if (value === "repeat") {
+          className += "mask-repeat";
+        } else if (value === "no-repeat") {
+          className += "mask-no-repeat";
+        } else {
+          className += `mask-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "bgRepeat" || rawKey === "backgroundRepeat") {
+        if (value === "repeat") {
+          className += "bg-repeat";
+        } else if (value === "no-repeat") {
+          className += "bg-no-repeat";
+        } else {
+          const suffix = value.startsWith("repeat-") ? value.slice(7) : value;
+          className += `bg-repeat-${suffix}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskSize") {
+        className += `mask-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskShape") {
+        className += `mask-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskComposite") {
+        className += `mask-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskMode") {
+        className += `mask-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "maskType") {
+        className += `mask-type-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "alignContent") {
+        className += `content-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "content") {
+        if (value === "none") {
+          className += "content-none";
+        } else if (value.startsWith("--")) {
+          className += `content-(${value})`;
+        } else {
+          const inner = value.startsWith('"') && value.endsWith('"') && value.length >= 2 ? `'${value.slice(1, -1)}'` : value;
+          className += `content-[${inner}]`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderTColor") {
+        className += `border-t-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderRColor") {
+        className += `border-r-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderBColor") {
+        className += `border-b-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderLColor") {
+        className += `border-l-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderXColor") {
+        className += `border-x-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "borderYColor") {
+        className += `border-y-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "transitionBehavior") {
+        className += `transition-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "dropShadowColor") {
+        if (value.startsWith("--")) {
+          className += `drop-shadow-(color:${value})`;
+        } else {
+          className += `drop-shadow-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "origin" || rawKey === "ease" || rawKey === "animate" || rawKey === "filter" || rawKey === "backdropFilter" || rawKey === "dropShadow") {
+        const sVal = String(value);
+        const prop = PROPERTY_MAP[rawKey] || rawKey;
+        if (needsArbitraryBrackets(sVal) || sVal.includes("(") || sVal.includes("_") || sVal.includes("%")) {
+          classes.push(`${className}${prop}-[${normalizeArbitraryValue(sVal)}]`);
+          continue;
+        }
+      }
+      if (rawKey === "transformStyle") {
+        className += `transform-${value}`;
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "perspective") {
+        const STANDARD_PERSPECTIVE = /* @__PURE__ */ new Set(["none", "normal", "dramatic", "midrange"]);
+        if (STANDARD_PERSPECTIVE.has(value)) {
+          className += `perspective-${value}`;
+        } else if (value.startsWith("--")) {
+          className += `perspective-(${value})`;
+        } else if (needsArbitraryBrackets(value)) {
+          className += `perspective-[${normalizeArbitraryValue(value)}]`;
+        } else {
+          className += `perspective-${value}`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "perspectiveOrigin") {
+        const STANDARD_ORIGINS = /* @__PURE__ */ new Set([
+          "center",
+          "top",
+          "right",
+          "bottom",
+          "left",
+          "top-left",
+          "top-right",
+          "bottom-left",
+          "bottom-right"
+        ]);
+        if (STANDARD_ORIGINS.has(value)) {
+          className += `perspective-origin-${value}`;
+        } else {
+          className += `perspective-origin-[${value}]`;
+        }
+        classes.push(className);
+        continue;
+      }
+      if (rawKey === "backface") {
+        className += `backface-${value}`;
+        classes.push(className);
+        continue;
+      }
+    }
+    if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+      const isKnown = PROPERTY_MAP[rawKey] || BOOLEAN_SHORTHANDS.has(rawKey) || SNAP_DIRECT_MAP[rawKey] || rawKey === "fromPos" || rawKey === "viaPos" || rawKey === "toPos" || rawKey.startsWith("--") || rawKey.startsWith("[") || rawKey.startsWith("@") || // Variants that fell through (e.g. empty object)
+      KNOWN_VARIANTS.has(rawKey) || // Groups/Peers
+      rawKey === "group" || rawKey === "peer" || // Special variant objects
+      rawKey === "has" || rawKey === "not" || rawKey === "data" || rawKey === "aria" || rawKey === "supports" || rawKey === "min" || rawKey === "max";
+      if (!isKnown) {
+        const suggestion = SUGGESTION_MAP[rawKey];
+        if (suggestion) {
+          console.warn(
+            `[csszyx] Use the canonical key "${suggestion}" instead of "${rawKey}".`
+          );
+        } else {
+          console.warn(
+            `[csszyx] Unknown property "${rawKey}" in sz prop. This will be ignored. Check for typos.`
+          );
+        }
+      }
+    }
+    if (value === true) {
+      if (BOOLEAN_SHORTHANDS.has(rawKey)) {
+        const mappedClass = BOOLEAN_TO_CLASS[rawKey] || key;
+        className += mappedClass;
+      } else {
+        className += key;
+      }
+      classes.push(className);
+      continue;
+    }
+    if (rawKey === "animationDelay") {
+      const ms = typeof value === "number" ? `${value}ms` : String(value);
+      classes.push(`${className}[animation-delay:${ms}]`);
+      continue;
+    }
+    if (typeof value === "number") {
+      if (value < 0 && NEGATIVE_ALLOWED.has(key)) {
+        className += `-${key}-${Math.abs(value)}`;
+      } else {
+        className += `${key}-${value}`;
+      }
+      classes.push(className);
+      continue;
+    }
+    if (typeof value === "string") {
+      const { value: cleanValue, important } = handleImportant(value);
+      let finalValue = cleanValue;
+      if (finalValue.startsWith("--")) {
+        const typeHint = CSS_VAR_TYPE_HINTS[rawKey];
+        if (typeHint) {
+          finalValue = `(${typeHint}:${finalValue})`;
+        } else {
+          finalValue = `(${finalValue})`;
+        }
+      } else if (finalValue.startsWith("var(")) {
+        finalValue = `[${normalizeArbitraryValue(finalValue)}]`;
+      } else if (/^\d+\/\d+$/.test(finalValue)) {
+        if (!FRACTION_SUPPORTED_PROPS.has(rawKey)) {
+          finalValue = `[${finalValue}]`;
+        }
+      } else if (key === "aspect" && /^[0-9]+(?:\.[0-9]+)?\/[0-9]+(?:\.[0-9]+)?$/.test(finalValue)) {
+        if (finalValue === "auto" || finalValue === "square" || finalValue === "video" || /^\d+\/\d+$/.test(finalValue)) ; else {
+          finalValue = `[${finalValue}]`;
+        }
+      } else if (needsArbitraryBrackets(finalValue) || /^\d+\.\d+%$/.test(finalValue)) {
+        finalValue = `[${normalizeArbitraryValue(finalValue)}]`;
+      }
+      if (finalValue.startsWith("-") && NEGATIVE_ALLOWED.has(key)) {
+        className = `-${prefix}${key}-${finalValue.substring(1)}`;
+      } else {
+        className += `${key}-${finalValue}`;
+      }
+      if (important) {
+        className += "!";
+      }
+      classes.push(className);
+    }
+  }
+  let mergedClasses = classes;
+  const textSizePattern = /^((?:[a-z0-9\-[\]@/:]*:)*)text-(xs|sm|base|lg|[2-9]?xl|\[.+\]|\(.+\))$/;
+  const leadingPattern = /^((?:[a-z0-9\-[\]@/:]*:)*)leading-(.+)$/;
+  const textEntries = [];
+  const leadingEntries = [];
+  for (let i = 0; i < classes.length; i++) {
+    const cls = classes[i];
+    const tm = textSizePattern.exec(cls);
+    if (tm) {
+      textEntries.push({ index: i, prefix: tm[1], size: tm[2] });
+    }
+    const lm = leadingPattern.exec(cls);
+    if (lm) {
+      leadingEntries.push({ index: i, prefix: lm[1], value: lm[2] });
+    }
+  }
+  if (textEntries.length > 0 && leadingEntries.length > 0) {
+    const removeIndices = /* @__PURE__ */ new Set();
+    const consumedLeading = /* @__PURE__ */ new Set();
+    for (const te of textEntries) {
+      const matchingLeading = leadingEntries.find(
+        (le) => le.prefix === te.prefix && !consumedLeading.has(le.index)
+      );
+      if (matchingLeading) {
+        mergedClasses[te.index] = `${te.prefix}text-${te.size}/${matchingLeading.value}`;
+        removeIndices.add(matchingLeading.index);
+        consumedLeading.add(matchingLeading.index);
+      }
+    }
+    if (removeIndices.size > 0) {
+      mergedClasses = mergedClasses.filter((_, i) => !removeIndices.has(i));
+    }
+  }
+  const finalClasses = mergedClasses.filter(Boolean);
+  if (mangleMap) {
+    const mangledClasses = finalClasses.map((cls) => mangleMap[cls] || cls);
+    return {
+      className: mangledClasses.join(" "),
+      attributes
+    };
+  }
+  return {
+    className: finalClasses.join(" "),
+    attributes
+  };
+}
+function isValidSzProp(szProp) {
+  return szProp !== null && szProp !== void 0 && typeof szProp === "object" && !Array.isArray(szProp);
+}
+function normalizeClassName(className) {
+  return className.split(/\s+/).filter(Boolean).join(" ");
+}
+
+export { BOOLEAN_SHORTHANDS as B, COLOR_PROPERTIES as C, KNOWN_VARIANTS as K, PROPERTY_MAP as P, SUGGESTION_MAP as S, VARIANT_MAP as V, PropertyCategory as a, getVariantPrefix as b, getPropertyCategory as c, PROPERTY_CATEGORY_MAP as d, normalizeArbitraryValue as e, normalizeArbitraryVariant as f, getCSSVariableName as g, isValidSzProp as i, normalizeClassName as n, stripInvalidColorStrings as s, transform as t };