@bamboocss/preset-base 1.11.1 → 1.11.3

package/dist/index.js

@@ -1,3355 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  default: () => index_default,
-  preset: () => preset
-});
-module.exports = __toCommonJS(index_exports);
-
-// src/conditions.ts
-var conditions = {
-  hover: "&:is(:hover, [data-hover])",
-  focus: "&:is(:focus, [data-focus])",
-  focusWithin: "&:focus-within",
-  focusVisible: "&:is(:focus-visible, [data-focus-visible])",
-  disabled: "&:is(:disabled, [disabled], [data-disabled], [aria-disabled=true])",
-  active: "&:is(:active, [data-active])",
-  visited: "&:visited",
-  target: "&:target",
-  readOnly: "&:is(:read-only, [data-read-only], [aria-readonly=true])",
-  readWrite: "&:read-write",
-  empty: "&:is(:empty, [data-empty])",
-  checked: '&:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"])',
-  enabled: "&:enabled",
-  expanded: '&:is([aria-expanded=true], [data-expanded], [data-state="expanded"])',
-  highlighted: "&[data-highlighted]",
-  complete: "&[data-complete]",
-  incomplete: "&[data-incomplete]",
-  dragging: "&[data-dragging]",
-  before: "&::before",
-  after: "&::after",
-  firstLetter: "&::first-letter",
-  firstLine: "&::first-line",
-  marker: "&::marker, &::-webkit-details-marker",
-  selection: "&::selection",
-  file: "&::file-selector-button",
-  backdrop: "&::backdrop",
-  first: "&:first-child",
-  last: "&:last-child",
-  only: "&:only-child",
-  even: "&:nth-child(even)",
-  odd: "&:nth-child(odd)",
-  firstOfType: "&:first-of-type",
-  lastOfType: "&:last-of-type",
-  onlyOfType: "&:only-of-type",
-  peerFocus: ".peer:is(:focus, [data-focus]) ~ &",
-  peerHover: ".peer:is(:hover, [data-hover]) ~ &",
-  peerActive: ".peer:is(:active, [data-active]) ~ &",
-  peerFocusWithin: ".peer:focus-within ~ &",
-  peerFocusVisible: ".peer:is(:focus-visible, [data-focus-visible]) ~ &",
-  peerDisabled: ".peer:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) ~ &",
-  peerChecked: '.peer:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) ~ &',
-  peerInvalid: ".peer:is(:invalid, [data-invalid], [aria-invalid=true]) ~ &",
-  peerExpanded: '.peer:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) ~ &',
-  peerPlaceholderShown: ".peer:placeholder-shown ~ &",
-  groupFocus: ".group:is(:focus, [data-focus]) &",
-  groupHover: ".group:is(:hover, [data-hover]) &",
-  groupActive: ".group:is(:active, [data-active]) &",
-  groupFocusWithin: ".group:focus-within &",
-  groupFocusVisible: ".group:is(:focus-visible, [data-focus-visible]) &",
-  groupDisabled: ".group:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) &",
-  groupChecked: '.group:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) &',
-  groupExpanded: '.group:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) &',
-  groupInvalid: ".group:is(:invalid, [data-invalid], [aria-invalid=true]) &",
-  indeterminate: '&:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state="indeterminate"])',
-  required: "&:is(:required, [data-required], [aria-required=true])",
-  valid: "&:is(:valid, [data-valid])",
-  invalid: "&:is(:invalid, [data-invalid], [aria-invalid=true])",
-  autofill: "&:autofill",
-  inRange: "&:is(:in-range, [data-in-range])",
-  outOfRange: "&:is(:out-of-range, [data-outside-range])",
-  placeholder: "&::placeholder, &[data-placeholder]",
-  placeholderShown: "&:is(:placeholder-shown, [data-placeholder-shown])",
-  pressed: "&:is([aria-pressed=true], [data-pressed])",
-  selected: "&:is([aria-selected=true], [data-selected])",
-  grabbed: "&:is([aria-grabbed=true], [data-grabbed])",
-  underValue: "&[data-state=under-value]",
-  overValue: "&[data-state=over-value]",
-  atValue: "&[data-state=at-value]",
-  default: "&:default",
-  optional: "&:optional",
-  open: '&:is([open], [data-open], [data-state="open"], :popover-open)',
-  closed: '&:is([closed], [data-closed], [data-state="closed"])',
-  fullscreen: "&:is(:fullscreen, [data-fullscreen])",
-  loading: "&:is([data-loading], [aria-busy=true])",
-  hidden: "&:is([hidden], [data-hidden])",
-  current: "&:is([aria-current=true], [data-current])",
-  currentPage: "&[aria-current=page]",
-  currentStep: "&[aria-current=step]",
-  today: "&[data-today]",
-  unavailable: "&[data-unavailable]",
-  rangeStart: "&[data-range-start]",
-  rangeEnd: "&[data-range-end]",
-  now: "&[data-now]",
-  topmost: "&[data-topmost]",
-  motionReduce: "@media (prefers-reduced-motion: reduce)",
-  motionSafe: "@media (prefers-reduced-motion: no-preference)",
-  print: "@media print",
-  landscape: "@media (orientation: landscape)",
-  portrait: "@media (orientation: portrait)",
-  dark: ".dark &",
-  light: ".light &",
-  osDark: "@media (prefers-color-scheme: dark)",
-  osLight: "@media (prefers-color-scheme: light)",
-  highContrast: "@media (forced-colors: active)",
-  lessContrast: "@media (prefers-contrast: less)",
-  moreContrast: "@media (prefers-contrast: more)",
-  ltr: ":where([dir=ltr], :dir(ltr)) &",
-  rtl: ":where([dir=rtl], :dir(rtl)) &",
-  scrollbar: "&::-webkit-scrollbar",
-  scrollbarThumb: "&::-webkit-scrollbar-thumb",
-  scrollbarTrack: "&::-webkit-scrollbar-track",
-  horizontal: "&[data-orientation=horizontal]",
-  vertical: "&[data-orientation=vertical]",
-  icon: "& :where(svg)",
-  starting: "@starting-style",
-  noscript: "@media (scripting: none)",
-  invertedColors: "@media (inverted-colors: inverted)"
-};
-
-// src/global-css.ts
-var EMPTY = "/*-*/ /*-*/";
-var globalCss = {
-  "*, ::before, ::after, ::backdrop": {
-    "--blur": EMPTY,
-    "--brightness": EMPTY,
-    "--contrast": EMPTY,
-    "--grayscale": EMPTY,
-    "--hue-rotate": EMPTY,
-    "--invert": EMPTY,
-    "--saturate": EMPTY,
-    "--sepia": EMPTY,
-    "--drop-shadow": EMPTY,
-    "--backdrop-blur": EMPTY,
-    "--backdrop-brightness": EMPTY,
-    "--backdrop-contrast": EMPTY,
-    "--backdrop-grayscale": EMPTY,
-    "--backdrop-hue-rotate": EMPTY,
-    "--backdrop-invert": EMPTY,
-    "--backdrop-opacity": EMPTY,
-    "--backdrop-saturate": EMPTY,
-    "--backdrop-sepia": EMPTY,
-    "--gradient-from-position": EMPTY,
-    "--gradient-to-position": EMPTY,
-    "--gradient-via-position": EMPTY,
-    "--scroll-snap-strictness": "proximity",
-    "--border-spacing-x": 0,
-    "--border-spacing-y": 0,
-    "--translate-x": 0,
-    "--translate-y": 0,
-    "--rotate": 0,
-    "--rotate-x": 0,
-    "--rotate-y": 0,
-    "--skew-x": 0,
-    "--skew-y": 0,
-    "--scale-x": 1,
-    "--scale-y": 1
-  }
-};
-
-// src/patterns.ts
-function definePattern(config) {
-  return config;
-}
-var box = definePattern({
-  transform(props) {
-    return props;
-  }
-});
-var flex = definePattern({
-  properties: {
-    align: { type: "property", value: "alignItems" },
-    justify: { type: "property", value: "justifyContent" },
-    direction: { type: "property", value: "flexDirection" },
-    wrap: { type: "property", value: "flexWrap" },
-    basis: { type: "property", value: "flexBasis" },
-    grow: { type: "property", value: "flexGrow" },
-    shrink: { type: "property", value: "flexShrink" }
-  },
-  transform(props) {
-    const { direction, align, justify, wrap: wrap2, basis, grow, shrink, ...rest } = props;
-    return {
-      display: "flex",
-      flexDirection: direction,
-      alignItems: align,
-      justifyContent: justify,
-      flexWrap: wrap2,
-      flexBasis: basis,
-      flexGrow: grow,
-      flexShrink: shrink,
-      ...rest
-    };
-  }
-});
-var stack = definePattern({
-  properties: {
-    align: { type: "property", value: "alignItems" },
-    justify: { type: "property", value: "justifyContent" },
-    direction: { type: "property", value: "flexDirection" },
-    gap: { type: "property", value: "gap" }
-  },
-  defaultValues: {
-    direction: "column",
-    gap: "8px"
-  },
-  transform(props) {
-    const { align, justify, direction, gap, ...rest } = props;
-    return {
-      display: "flex",
-      flexDirection: direction,
-      alignItems: align,
-      justifyContent: justify,
-      gap,
-      ...rest
-    };
-  }
-});
-var vstack = definePattern({
-  jsxName: "VStack",
-  properties: {
-    justify: { type: "property", value: "justifyContent" },
-    gap: { type: "property", value: "gap" }
-  },
-  defaultValues: {
-    gap: "8px"
-  },
-  transform(props) {
-    const { justify, gap, ...rest } = props;
-    return {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: justify,
-      gap,
-      flexDirection: "column",
-      ...rest
-    };
-  }
-});
-var hstack = definePattern({
-  jsxName: "HStack",
-  properties: {
-    justify: { type: "property", value: "justifyContent" },
-    gap: { type: "property", value: "gap" }
-  },
-  defaultValues: {
-    gap: "8px"
-  },
-  transform(props) {
-    const { justify, gap, ...rest } = props;
-    return {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: justify,
-      gap,
-      flexDirection: "row",
-      ...rest
-    };
-  }
-});
-var spacer = definePattern({
-  properties: {
-    size: { type: "token", value: "spacing" }
-  },
-  transform(props, { map, isCssUnit, isCssVar }) {
-    const { size, ...rest } = props;
-    return {
-      alignSelf: "stretch",
-      justifySelf: "stretch",
-      flex: map(size, (v) => {
-        if (v == null) return "1";
-        const val = isCssUnit(v) || isCssVar(v) ? v : `token(spacing.${v}, ${v})`;
-        return `0 0 ${val}`;
-      }),
-      ...rest
-    };
-  }
-});
-var circle = definePattern({
-  properties: {
-    size: { type: "property", value: "width" }
-  },
-  transform(props) {
-    const { size, ...rest } = props;
-    return {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      flex: "0 0 auto",
-      width: size,
-      height: size,
-      borderRadius: "9999px",
-      ...rest
-    };
-  }
-});
-var square = definePattern({
-  properties: {
-    size: { type: "property", value: "width" }
-  },
-  transform(props) {
-    const { size, ...rest } = props;
-    return {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      flex: "0 0 auto",
-      width: size,
-      height: size,
-      ...rest
-    };
-  }
-});
-var grid = definePattern({
-  properties: {
-    gap: { type: "property", value: "gap" },
-    columnGap: { type: "property", value: "gap" },
-    rowGap: { type: "property", value: "gap" },
-    columns: { type: "number" },
-    minChildWidth: { type: "token", value: "sizes", property: "width" }
-  },
-  defaultValues(props) {
-    return { gap: props.columnGap || props.rowGap ? void 0 : "8px" };
-  },
-  transform(props, { map, isCssUnit }) {
-    const { columnGap, rowGap, gap, columns, minChildWidth, ...rest } = props;
-    const getValue = (v) => isCssUnit(v) ? v : `token(sizes.${v}, ${v})`;
-    return {
-      display: "grid",
-      gridTemplateColumns: columns != null ? map(columns, (v) => `repeat(${v}, minmax(0, 1fr))`) : minChildWidth != null ? map(minChildWidth, (v) => `repeat(auto-fit, minmax(${getValue(v)}, 1fr))`) : void 0,
-      gap,
-      columnGap,
-      rowGap,
-      ...rest
-    };
-  }
-});
-var gridItem = definePattern({
-  properties: {
-    colSpan: { type: "number" },
-    rowSpan: { type: "number" },
-    colStart: { type: "number" },
-    rowStart: { type: "number" },
-    colEnd: { type: "number" },
-    rowEnd: { type: "number" }
-  },
-  transform(props, { map }) {
-    const { colSpan, rowSpan, colStart, rowStart, colEnd, rowEnd, ...rest } = props;
-    const spanFn = (v) => v === "auto" ? v : `span ${v}`;
-    return {
-      gridColumn: colSpan != null ? map(colSpan, spanFn) : void 0,
-      gridRow: rowSpan != null ? map(rowSpan, spanFn) : void 0,
-      gridColumnStart: colStart,
-      gridColumnEnd: colEnd,
-      gridRowStart: rowStart,
-      gridRowEnd: rowEnd,
-      ...rest
-    };
-  }
-});
-var wrap = definePattern({
-  properties: {
-    gap: { type: "property", value: "gap" },
-    rowGap: { type: "property", value: "gap" },
-    columnGap: { type: "property", value: "gap" },
-    align: { type: "property", value: "alignItems" },
-    justify: { type: "property", value: "justifyContent" }
-  },
-  transform(props) {
-    const { columnGap, rowGap, gap = columnGap || rowGap ? void 0 : "8px", align, justify, ...rest } = props;
-    return {
-      display: "flex",
-      flexWrap: "wrap",
-      alignItems: align,
-      justifyContent: justify,
-      gap,
-      columnGap,
-      rowGap,
-      ...rest
-    };
-  }
-});
-var container = definePattern({
-  transform(props) {
-    return {
-      position: "relative",
-      maxWidth: "8xl",
-      mx: "auto",
-      px: { base: "4", md: "6", lg: "8" },
-      ...props
-    };
-  }
-});
-var center = definePattern({
-  properties: {
-    inline: { type: "boolean" }
-  },
-  transform(props) {
-    const { inline, ...rest } = props;
-    return {
-      display: inline ? "inline-flex" : "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      ...rest
-    };
-  }
-});
-var aspectRatio = definePattern({
-  properties: {
-    ratio: { type: "number" }
-  },
-  blocklist: ["aspectRatio"],
-  transform(props, { map }) {
-    const { ratio = 4 / 3, ...rest } = props;
-    return {
-      position: "relative",
-      _before: {
-        content: `""`,
-        display: "block",
-        height: "0",
-        paddingBottom: map(ratio, (r) => `${1 / r * 100}%`)
-      },
-      "&>*": {
-        display: "flex",
-        justifyContent: "center",
-        alignItems: "center",
-        overflow: "hidden",
-        position: "absolute",
-        inset: "0",
-        width: "100%",
-        height: "100%"
-      },
-      "&>img, &>video": {
-        objectFit: "cover"
-      },
-      ...rest
-    };
-  }
-});
-var divider = definePattern({
-  properties: {
-    orientation: { type: "enum", value: ["horizontal", "vertical"] },
-    thickness: { type: "token", value: "sizes", property: "borderWidth" },
-    color: { type: "token", value: "colors", property: "borderColor" }
-  },
-  defaultValues: {
-    orientation: "horizontal",
-    thickness: "1px"
-  },
-  transform(props, { map }) {
-    const { orientation, thickness, color, ...rest } = props;
-    return {
-      "--thickness": thickness,
-      width: map(orientation, (v) => v === "vertical" ? void 0 : "100%"),
-      height: map(orientation, (v) => v === "horizontal" ? void 0 : "100%"),
-      borderBlockEndWidth: map(orientation, (v) => v === "horizontal" ? "var(--thickness)" : void 0),
-      borderInlineEndWidth: map(orientation, (v) => v === "vertical" ? "var(--thickness)" : void 0),
-      borderColor: color,
-      ...rest
-    };
-  }
-});
-var linkOverlay = definePattern({
-  jsxElement: "a",
-  transform(props) {
-    return {
-      _before: {
-        content: '""',
-        position: "absolute",
-        inset: "0",
-        zIndex: "0",
-        ...props["_before"]
-      },
-      ...props
-    };
-  }
-});
-var float = definePattern({
-  properties: {
-    offsetX: { type: "token", value: "spacing", property: "left" },
-    offsetY: { type: "token", value: "spacing", property: "top" },
-    offset: { type: "token", value: "spacing", property: "top" },
-    placement: {
-      type: "enum",
-      value: [
-        "bottom-end",
-        "bottom-start",
-        "top-end",
-        "top-start",
-        "bottom-center",
-        "top-center",
-        "middle-center",
-        "middle-end",
-        "middle-start"
-      ]
-    }
-  },
-  defaultValues(props) {
-    const offset = props.offset || "0";
-    return { offset, offsetX: offset, offsetY: offset, placement: "top-end" };
-  },
-  transform(props, { map }) {
-    const { offset, offsetX, offsetY, placement, ...rest } = props;
-    return {
-      display: "inline-flex",
-      justifyContent: "center",
-      alignItems: "center",
-      position: "absolute",
-      insetBlockStart: map(placement, (v) => {
-        const [side] = v.split("-");
-        const map2 = { top: offsetY, middle: "50%", bottom: "auto" };
-        return map2[side];
-      }),
-      insetBlockEnd: map(placement, (v) => {
-        const [side] = v.split("-");
-        const map2 = { top: "auto", middle: "50%", bottom: offsetY };
-        return map2[side];
-      }),
-      insetInlineStart: map(placement, (v) => {
-        const [, align] = v.split("-");
-        const map2 = { start: offsetX, center: "50%", end: "auto" };
-        return map2[align];
-      }),
-      insetInlineEnd: map(placement, (v) => {
-        const [, align] = v.split("-");
-        const map2 = { start: "auto", center: "50%", end: offsetX };
-        return map2[align];
-      }),
-      translate: map(placement, (v) => {
-        const [side, align] = v.split("-");
-        const mapX = { start: "-50%", center: "-50%", end: "50%" };
-        const mapY = { top: "-50%", middle: "-50%", bottom: "50%" };
-        return `${mapX[align]} ${mapY[side]}`;
-      }),
-      ...rest
-    };
-  }
-});
-var bleed = definePattern({
-  properties: {
-    inline: { type: "property", value: "marginInline" },
-    block: { type: "property", value: "marginBlock" }
-  },
-  defaultValues: {
-    inline: "0",
-    block: "0"
-  },
-  transform(props, { map, isCssUnit, isCssVar }) {
-    const { inline, block, ...rest } = props;
-    const valueFn = (v) => isCssUnit(v) || isCssVar(v) ? v : `token(spacing.${v}, ${v})`;
-    return {
-      "--bleed-x": map(inline, valueFn),
-      "--bleed-y": map(block, valueFn),
-      marginInline: "calc(var(--bleed-x, 0) * -1)",
-      marginBlock: "calc(var(--bleed-y, 0) * -1)",
-      ...rest
-    };
-  }
-});
-var visuallyHidden = definePattern({
-  transform(props) {
-    return {
-      srOnly: true,
-      ...props
-    };
-  }
-});
-var cq = definePattern({
-  properties: {
-    name: { type: "token", value: "containerNames", property: "containerName" },
-    type: { type: "property", value: "containerType" }
-  },
-  defaultValues: {
-    type: "inline-size"
-  },
-  transform(props) {
-    const { name, type, ...rest } = props;
-    return {
-      containerType: type,
-      containerName: name,
-      ...rest
-    };
-  }
-});
-var patterns = {
-  box,
-  flex,
-  stack,
-  vstack,
-  hstack,
-  spacer,
-  square,
-  circle,
-  center,
-  linkOverlay,
-  aspectRatio,
-  grid,
-  gridItem,
-  wrap,
-  container,
-  divider,
-  float,
-  bleed,
-  visuallyHidden,
-  cq
-};
-
-// src/color-mix-transform.ts
-var createColorMixTransform = (prop) => (value, args) => {
-  const mix = args.utils.colorMix(value);
-  if (mix.invalid) return { [prop]: value };
-  const cssVar = "--mix-" + prop;
-  return {
-    [cssVar]: mix.value,
-    [prop]: `var(${cssVar}, ${mix.color})`
-  };
-};
-
-// src/utilities/background.ts
-var background = {
-  backgroundPosition: {
-    shorthand: "bgPosition",
-    className: "bg-p",
-    group: "Background"
-  },
-  backgroundPositionX: {
-    shorthand: "bgPositionX",
-    className: "bg-p-x",
-    group: "Background"
-  },
-  backgroundPositionY: {
-    shorthand: "bgPositionY",
-    className: "bg-p-y",
-    group: "Background"
-  },
-  backgroundAttachment: {
-    shorthand: "bgAttachment",
-    className: "bg-a",
-    group: "Background"
-  },
-  backgroundClip: {
-    shorthand: "bgClip",
-    className: "bg-cp",
-    group: "Background",
-    transform(value) {
-      return {
-        backgroundClip: value,
-        WebkitBackgroundClip: value
-      };
-    }
-  },
-  background: {
-    shorthand: "bg",
-    className: "bg",
-    values: "colors",
-    group: "Background",
-    transform: createColorMixTransform("background")
-  },
-  backgroundColor: {
-    shorthand: "bgColor",
-    className: "bg-c",
-    values: "colors",
-    group: "Background",
-    transform: createColorMixTransform("backgroundColor")
-  },
-  backgroundOrigin: {
-    shorthand: "bgOrigin",
-    className: "bg-o",
-    group: "Background"
-  },
-  backgroundImage: {
-    shorthand: "bgImage",
-    className: "bg-i",
-    values: "assets",
-    group: "Background"
-  },
-  backgroundRepeat: {
-    shorthand: "bgRepeat",
-    className: "bg-r",
-    group: "Background"
-  },
-  backgroundBlendMode: {
-    shorthand: "bgBlendMode",
-    className: "bg-bm",
-    group: "Background"
-  },
-  backgroundSize: {
-    shorthand: "bgSize",
-    className: "bg-s",
-    group: "Background"
-  }
-};
-
-// src/utilities/border.ts
-var border = {
-  // Border Radius
-  borderRadius: {
-    className: "bdr",
-    shorthand: "rounded",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopLeftRadius: {
-    className: "bdr-tl",
-    shorthand: "roundedTopLeft",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopRightRadius: {
-    className: "bdr-tr",
-    shorthand: "roundedTopRight",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderBottomRightRadius: {
-    className: "bdr-br",
-    shorthand: "roundedBottomRight",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderBottomLeftRadius: {
-    className: "bdr-bl",
-    shorthand: "roundedBottomLeft",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopRadius: {
-    className: "bdr-t",
-    shorthand: "roundedTop",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopLeftRadius: value,
-        borderTopRightRadius: value
-      };
-    }
-  },
-  borderRightRadius: {
-    className: "bdr-r",
-    shorthand: "roundedRight",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopRightRadius: value,
-        borderBottomRightRadius: value
-      };
-    }
-  },
-  borderBottomRadius: {
-    className: "bdr-b",
-    shorthand: "roundedBottom",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderBottomLeftRadius: value,
-        borderBottomRightRadius: value
-      };
-    }
-  },
-  borderLeftRadius: {
-    className: "bdr-l",
-    shorthand: "roundedLeft",
-    values: "radii",
-    property: "borderRadius",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopLeftRadius: value,
-        borderBottomLeftRadius: value
-      };
-    }
-  },
-  borderStartStartRadius: {
-    className: "bdr-ss",
-    shorthand: "roundedStartStart",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderStartEndRadius: {
-    className: "bdr-se",
-    shorthand: "roundedStartEnd",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderStartRadius: {
-    className: "bdr-s",
-    values: "radii",
-    property: "borderRadius",
-    shorthand: "roundedStart",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderStartStartRadius: value,
-        borderEndStartRadius: value
-      };
-    }
-  },
-  borderEndStartRadius: {
-    className: "bdr-es",
-    shorthand: "roundedEndStart",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderEndEndRadius: {
-    className: "bdr-ee",
-    shorthand: "roundedEndEnd",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderEndRadius: {
-    className: "bdr-e",
-    shorthand: "roundedEnd",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderStartEndRadius: value,
-        borderEndEndRadius: value
-      };
-    }
-  },
-  // Border
-  border: {
-    className: "bd",
-    values: "borders",
-    group: "Border"
-  },
-  borderWidth: {
-    className: "bd-w",
-    values: "borderWidths",
-    group: "Border Radius"
-  },
-  borderTopWidth: {
-    className: "bd-t-w",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderLeftWidth: {
-    className: "bd-l-w",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderRightWidth: {
-    className: "bd-r-w",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderBottomWidth: {
-    className: "bd-b-w",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderBlockStartWidth: {
-    className: "bd-bs-w",
-    values: "borderWidths",
-    group: "Border Radius"
-  },
-  borderBlockEndWidth: {
-    className: "bd-be-w",
-    values: "borderWidths",
-    group: "Border Radius"
-  },
-  borderColor: {
-    className: "bd-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderColor")
-  },
-  borderInline: {
-    className: "bd-x",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderX"
-  },
-  borderInlineWidth: {
-    className: "bd-x-w",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderXWidth"
-  },
-  borderInlineColor: {
-    className: "bd-x-c",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderXColor",
-    transform: createColorMixTransform("borderInlineColor")
-  },
-  borderBlock: {
-    className: "bd-y",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderY"
-  },
-  borderBlockWidth: {
-    className: "bd-y-w",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderYWidth"
-  },
-  borderBlockColor: {
-    className: "bd-y-c",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderYColor",
-    transform: createColorMixTransform("borderBlockColor")
-  },
-  borderLeft: {
-    className: "bd-l",
-    values: "borders",
-    group: "Border"
-  },
-  borderLeftColor: {
-    className: "bd-l-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderLeftColor")
-  },
-  borderInlineStart: {
-    className: "bd-s",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderStart"
-  },
-  borderInlineStartWidth: {
-    className: "bd-s-w",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderStartWidth"
-  },
-  borderInlineStartColor: {
-    className: "bd-s-c",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderStartColor",
-    transform: createColorMixTransform("borderInlineStartColor")
-  },
-  borderRight: {
-    className: "bd-r",
-    values: "borders",
-    group: "Border"
-  },
-  borderRightColor: {
-    className: "bd-r-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderRightColor")
-  },
-  borderInlineEnd: {
-    className: "bd-e",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderEnd"
-  },
-  borderInlineEndWidth: {
-    className: "bd-e-w",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderEndWidth"
-  },
-  borderInlineEndColor: {
-    className: "bd-e-c",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderEndColor",
-    transform: createColorMixTransform("borderInlineEndColor")
-  },
-  borderTop: {
-    className: "bd-t",
-    values: "borders",
-    group: "Border"
-  },
-  borderTopColor: {
-    className: "bd-t-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderTopColor")
-  },
-  borderBottom: {
-    className: "bd-b",
-    values: "borders",
-    group: "Border"
-  },
-  borderBottomColor: {
-    className: "bd-b-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBottomColor")
-  },
-  borderBlockEnd: {
-    className: "bd-be",
-    values: "borders",
-    group: "Border"
-  },
-  borderBlockEndColor: {
-    className: "bd-be-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBlockEndColor")
-  },
-  borderBlockStart: {
-    className: "bd-bs",
-    values: "borders",
-    group: "Border"
-  },
-  borderBlockStartColor: {
-    className: "bd-bs-c",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBlockStartColor")
-  }
-};
-
-// src/utilities/container.ts
-var container2 = {
-  container: {
-    className: "cq",
-    group: "Container"
-  },
-  containerName: {
-    className: "cq-n",
-    property: "containerName",
-    values: "containerNames",
-    group: "Container"
-  },
-  containerType: {
-    className: "cq-t",
-    group: "Container"
-  }
-};
-
-// src/utilities/cursor.ts
-var cursor = {
-  cursor: {
-    className: "cursor",
-    values: "cursor",
-    group: "System"
-  }
-};
-
-// src/utilities/display.ts
-var display = {
-  display: {
-    className: "d",
-    group: "Display"
-  },
-  hideFrom: {
-    className: "hide",
-    values: "breakpoints",
-    group: "Display",
-    transform(value, { raw, token }) {
-      const bp = token.raw(`breakpoints.${raw}`);
-      const media = bp ? `@breakpoint ${raw}` : `@media screen and (min-width: ${value})`;
-      return {
-        [media]: {
-          display: "none"
-        }
-      };
-    }
-  },
-  hideBelow: {
-    className: "show",
-    values: "breakpoints",
-    group: "Display",
-    transform(value, { raw, token }) {
-      const bp = token.raw(`breakpoints.${raw}`);
-      const media = bp ? `@breakpoint ${raw}Down` : `@media screen and (max-width: ${value})`;
-      return {
-        [media]: {
-          display: "none"
-        }
-      };
-    }
-  }
-};
-
-// src/utilities/divide.ts
-var divideColor = createColorMixTransform("borderColor");
-var divide = {
-  divideX: {
-    className: "dvd-x",
-    values: "borderWidths",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderInlineStartWidth: value,
-          borderInlineEndWidth: "0px"
-        }
-      };
-    }
-  },
-  divideY: {
-    className: "dvd-y",
-    values: "borderWidths",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderTopWidth: value,
-          borderBottomWidth: "0px"
-        }
-      };
-    }
-  },
-  divideColor: {
-    className: "dvd-c",
-    values: "colors",
-    group: "Border",
-    transform(value, args) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": divideColor(value, args)
-      };
-    }
-  },
-  divideStyle: {
-    className: "dvd-s",
-    property: "borderStyle",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderStyle: value
-        }
-      };
-    }
-  }
-};
-
-// src/utilities/effects.ts
-var effects = {
-  opacity: {
-    className: "op",
-    values: "opacity",
-    group: "Background"
-  },
-  boxShadow: {
-    shorthand: "shadow",
-    className: "bx-sh",
-    values: "shadows",
-    group: "Shadow"
-  },
-  boxShadowColor: {
-    shorthand: "shadowColor",
-    className: "bx-sh-c",
-    values: "colors",
-    transform: createColorMixTransform("--shadow-color"),
-    group: "Color"
-  },
-  mixBlendMode: {
-    className: "mix-bm",
-    group: "Effect"
-  },
-  filter: {
-    className: "filter",
-    group: "Effect",
-    values: {
-      auto: "var(--blur, ) var(--brightness, ) var(--contrast, ) var(--grayscale, ) var(--hue-rotate, ) var(--invert, ) var(--saturate, ) var(--sepia, ) var(--drop-shadow, )"
-    }
-  },
-  brightness: {
-    className: "brightness",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--brightness": `brightness(${value})`
-      };
-    }
-  },
-  contrast: {
-    className: "contrast",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--contrast": `contrast(${value})`
-      };
-    }
-  },
-  grayscale: {
-    className: "grayscale",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--grayscale": `grayscale(${value})`
-      };
-    }
-  },
-  hueRotate: {
-    className: "hue-rotate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--hue-rotate": `hue-rotate(${value})`
-      };
-    }
-  },
-  invert: {
-    className: "invert",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--invert": `invert(${value})`
-      };
-    }
-  },
-  saturate: {
-    className: "saturate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--saturate": `saturate(${value})`
-      };
-    }
-  },
-  sepia: {
-    className: "sepia",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--sepia": `sepia(${value})`
-      };
-    }
-  },
-  dropShadow: {
-    className: "drop-shadow",
-    group: "Effect",
-    values: "dropShadows",
-    transform(value) {
-      return {
-        "--drop-shadow": value
-      };
-    }
-  },
-  blur: {
-    className: "blur",
-    group: "Effect",
-    values: "blurs",
-    transform(value) {
-      return {
-        "--blur": `blur(${value})`
-      };
-    }
-  },
-  backdropFilter: {
-    className: "bkdp",
-    group: "Effect",
-    values: {
-      auto: "var(--backdrop-blur, ) var(--backdrop-brightness, ) var(--backdrop-contrast, ) var(--backdrop-grayscale, ) var(--backdrop-hue-rotate, ) var(--backdrop-invert, ) var(--backdrop-opacity, ) var(--backdrop-saturate, ) var(--backdrop-sepia, )"
-    },
-    transform(value) {
-      return {
-        backdropFilter: value,
-        WebkitBackdropFilter: value
-      };
-    }
-  },
-  backdropBlur: {
-    className: "bkdp-blur",
-    group: "Effect",
-    values: "blurs",
-    transform(value) {
-      return {
-        "--backdrop-blur": `blur(${value})`
-      };
-    }
-  },
-  backdropBrightness: {
-    className: "bkdp-brightness",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-brightness": `brightness(${value})`
-      };
-    }
-  },
-  backdropContrast: {
-    className: "bkdp-contrast",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-contrast": `contrast(${value})`
-      };
-    }
-  },
-  backdropGrayscale: {
-    className: "bkdp-grayscale",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-grayscale": `grayscale(${value})`
-      };
-    }
-  },
-  backdropHueRotate: {
-    className: "bkdp-hue-rotate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-hue-rotate": `hue-rotate(${value})`
-      };
-    }
-  },
-  backdropInvert: {
-    className: "bkdp-invert",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-invert": `invert(${value})`
-      };
-    }
-  },
-  backdropOpacity: {
-    className: "bkdp-opacity",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-opacity": value
-      };
-    }
-  },
-  backdropSaturate: {
-    className: "bkdp-saturate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-saturate": `saturate(${value})`
-      };
-    }
-  },
-  backdropSepia: {
-    className: "bkdp-sepia",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-sepia": `sepia(${value})`
-      };
-    }
-  }
-};
-
-// src/utilities/flex-and-grid.ts
-var flexGrid = {
-  flexBasis: {
-    className: "flex-b",
-    group: "Flex Layout",
-    values(theme) {
-      return {
-        ...theme("sizes"),
-        "1/2": "50%",
-        "1/3": "33.333333%",
-        "2/3": "66.666667%",
-        "1/4": "25%",
-        "2/4": "50%",
-        "3/4": "75%",
-        "1/5": "20%",
-        "2/5": "40%",
-        "3/5": "60%",
-        "4/5": "80%",
-        "1/6": "16.666667%",
-        "2/6": "33.333333%",
-        "3/6": "50%",
-        "4/6": "66.666667%",
-        "5/6": "83.333333%",
-        "1/12": "8.333333%",
-        "2/12": "16.666667%",
-        "3/12": "25%",
-        "4/12": "33.333333%",
-        "5/12": "41.666667%",
-        "6/12": "50%",
-        "7/12": "58.333333%",
-        "8/12": "66.666667%",
-        "9/12": "75%",
-        "10/12": "83.333333%",
-        "11/12": "91.666667%",
-        full: "100%"
-      };
-    }
-  },
-  flex: {
-    className: "flex",
-    group: "Flex Layout",
-    values: {
-      "1": "1 1 0%",
-      auto: "1 1 auto",
-      initial: "0 1 auto",
-      none: "none"
-    }
-  },
-  flexDirection: {
-    className: "flex-d",
-    group: "Flex Layout",
-    shorthand: "flexDir"
-  },
-  flexGrow: {
-    className: "flex-g",
-    group: "Flex Layout"
-  },
-  flexShrink: {
-    className: "flex-sh",
-    group: "Flex Layout"
-  },
-  gridTemplateColumns: {
-    className: "grid-tc",
-    group: "Grid Layout"
-  },
-  gridTemplateRows: {
-    className: "grid-tr",
-    group: "Grid Layout"
-  },
-  gridColumn: {
-    className: "grid-c",
-    group: "Grid Layout"
-  },
-  gridRow: {
-    className: "grid-r",
-    group: "Grid Layout"
-  },
-  gridColumnStart: {
-    className: "grid-cs",
-    group: "Grid Layout"
-  },
-  gridColumnEnd: {
-    className: "grid-ce",
-    group: "Grid Layout"
-  },
-  gridAutoFlow: {
-    className: "grid-af",
-    group: "Grid Layout"
-  },
-  gridAutoColumns: {
-    className: "grid-ac",
-    group: "Grid Layout",
-    values: {
-      min: "min-content",
-      max: "max-content",
-      fr: "minmax(0, 1fr)"
-    }
-  },
-  gridAutoRows: {
-    className: "grid-ar",
-    group: "Grid Layout",
-    values: {
-      min: "min-content",
-      max: "max-content",
-      fr: "minmax(0, 1fr)"
-    }
-  },
-  gap: {
-    className: "gap",
-    group: "Flex Layout",
-    values: "spacing"
-  },
-  gridGap: {
-    className: "grid-g",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  gridRowGap: {
-    className: "grid-rg",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  gridColumnGap: {
-    className: "grid-cg",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  rowGap: {
-    className: "rg",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  columnGap: {
-    className: "cg",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  justifyContent: {
-    className: "jc",
-    group: "Flex Layout"
-  },
-  alignContent: {
-    className: "ac",
-    group: "Flex Layout"
-  },
-  alignItems: {
-    className: "ai",
-    group: "Flex Layout"
-  },
-  alignSelf: {
-    className: "as",
-    group: "Flex Layout"
-  }
-};
-
-// src/utilities/focus-ring.ts
-function createFocusRing(selector, className) {
-  return {
-    className,
-    group: "Focus Ring",
-    values: ["outside", "inside", "mixed", "none"],
-    transform(value) {
-      const fallback = "var(--global-color-focus-ring, #005FCC)";
-      const focusRingColor = `var(--focus-ring-color-prop, ${fallback})`;
-      switch (value) {
-        case "inside":
-          return {
-            "--focus-ring-color": focusRingColor,
-            [selector]: {
-              outlineOffset: "0px",
-              outlineWidth: "var(--focus-ring-width, 1px)",
-              outlineColor: "var(--focus-ring-color)",
-              outlineStyle: "var(--focus-ring-style, solid)",
-              borderColor: "var(--focus-ring-color)"
-            }
-          };
-        case "outside":
-          return {
-            "--focus-ring-color": focusRingColor,
-            [selector]: {
-              outlineWidth: "var(--focus-ring-width, 2px)",
-              outlineOffset: "var(--focus-ring-offset, 2px)",
-              outlineStyle: "var(--focus-ring-style, solid)",
-              outlineColor: "var(--focus-ring-color)"
-            }
-          };
-        case "mixed":
-          return {
-            "--focus-ring-color": focusRingColor,
-            [selector]: {
-              outlineOffset: "0px",
-              outlineWidth: "var(--focus-ring-width, 3px)",
-              outlineStyle: "var(--focus-ring-style, solid)",
-              outlineColor: "color-mix(in srgb, var(--focus-ring-color), transparent 60%)",
-              borderColor: "var(--focus-ring-color)"
-            }
-          };
-        case "none":
-          return {
-            "--focus-ring-color": focusRingColor,
-            [selector]: {
-              outline: "none"
-            }
-          };
-        default:
-          return {};
-      }
-    }
-  };
-}
-var focusRing = {
-  focusRing: createFocusRing("&:is(:focus, [data-focus])", "focus-ring"),
-  focusVisibleRing: createFocusRing("&:is(:focus-visible, [data-focus-visible])", "focus-v-ring"),
-  focusRingColor: {
-    className: "focus-ring-c",
-    values: "colors",
-    group: "Focus Ring",
-    transform(value, { utils }) {
-      const prop = "--focus-ring-color-prop";
-      const mix = utils.colorMix(value);
-      if (mix.invalid) return { [prop]: value };
-      const cssVar = "--mix-" + prop;
-      return {
-        [cssVar]: mix.value,
-        [prop]: `var(${cssVar}, ${mix.color})`
-      };
-    }
-  },
-  focusRingOffset: {
-    className: "focus-ring-o",
-    values: "spacing",
-    group: "Focus Ring",
-    transform: (v) => ({ "--focus-ring-offset": v })
-  },
-  focusRingWidth: {
-    className: "focus-ring-w",
-    values: "borderWidths",
-    property: "outlineWidth",
-    group: "Focus Ring",
-    transform: (v) => ({ "--focus-ring-width": v })
-  },
-  focusRingStyle: {
-    className: "focus-ring-s",
-    values: "borderStyles",
-    property: "outlineStyle",
-    group: "Focus Ring",
-    transform: (v) => ({ "--focus-ring-style": v })
-  }
-};
-
-// src/utilities/gradient.ts
-var gradientVia = createColorMixTransform("--gradient-via");
-var linearGradientDirectionMap = /* @__PURE__ */ new Map([
-  ["to-t", "to top"],
-  ["to-tr", "to top right"],
-  ["to-r", "to right"],
-  ["to-br", "to bottom right"],
-  ["to-b", "to bottom"],
-  ["to-bl", "to bottom left"],
-  ["to-l", "to left"],
-  ["to-tl", "to top left"]
-]);
-var isGradientShortcut = (value) => linearGradientDirectionMap.has(value);
-var linearGradientValues = (theme) => {
-  return {
-    ...theme("gradients"),
-    ...Object.fromEntries(linearGradientDirectionMap.entries())
-  };
-};
-var gradientStops = "var(--gradient-via-stops, var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-to) var(--gradient-to-position))";
-var gradientViaStops = "var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-via) var(--gradient-via-position), var(--gradient-to) var(--gradient-to-position)";
-var backgroundGradients = {
-  backgroundGradient: {
-    shorthand: "bgGradient",
-    className: "bg-grad",
-    group: "Background Gradient",
-    values: linearGradientValues,
-    transform(value, { raw, token }) {
-      const tokenValue = token(`gradients.${raw}`);
-      if (tokenValue) {
-        return { backgroundImage: tokenValue };
-      }
-      if (!isGradientShortcut(raw)) {
-        return { backgroundImage: value };
-      }
-      return {
-        "--gradient-stops": gradientStops,
-        "--gradient-position": linearGradientDirectionMap.get(raw),
-        backgroundImage: `linear-gradient(var(--gradient-stops))`
-      };
-    }
-  },
-  backgroundLinear: {
-    shorthand: "bgLinear",
-    className: "bg-linear",
-    group: "Background Gradient",
-    values: linearGradientValues,
-    transform(value, { raw, token }) {
-      const tokenValue = token(`gradients.${raw}`);
-      if (tokenValue) {
-        return { backgroundImage: tokenValue };
-      }
-      if (!isGradientShortcut(raw)) {
-        return { backgroundImage: value };
-      }
-      return {
-        "--gradient-stops": gradientStops,
-        "--gradient-position": linearGradientDirectionMap.get(raw),
-        backgroundImage: `linear-gradient(var(--gradient-stops))`
-      };
-    }
-  },
-  backgroundRadial: {
-    shorthand: "bgRadial",
-    className: "bg-radial",
-    group: "Background Gradient",
-    values: "gradients",
-    transform(value, { raw, token }) {
-      const tokenValue = token(`gradients.${raw}`);
-      if (tokenValue) {
-        return { backgroundImage: tokenValue };
-      }
-      return {
-        "--gradient-stops": gradientStops,
-        "--gradient-position": value,
-        backgroundImage: `radial-gradient(var(--gradient-stops,${value}))`
-      };
-    }
-  },
-  backgroundConic: {
-    shorthand: "bgConic",
-    className: "bg-conic",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-stops": gradientStops,
-        "--gradient-position": value,
-        backgroundImage: `conic-gradient(var(--gradient-stops))`
-      };
-    }
-  },
-  textGradient: {
-    className: "txt-grad",
-    group: "Background Gradient",
-    values: linearGradientValues,
-    transform(value, { raw, token }) {
-      const tokenValue = token(`gradients.${raw}`);
-      if (tokenValue) {
-        return {
-          backgroundImage: tokenValue,
-          WebkitBackgroundClip: "text",
-          color: "transparent"
-        };
-      }
-      if (!isGradientShortcut(raw)) {
-        return {
-          backgroundImage: value,
-          WebkitBackgroundClip: "text",
-          color: "transparent"
-        };
-      }
-      return {
-        "--gradient-stops": gradientStops,
-        "--gradient-position": linearGradientDirectionMap.get(raw),
-        backgroundImage: `linear-gradient(var(--gradient-stops))`,
-        WebkitBackgroundClip: "text",
-        color: "transparent"
-      };
-    }
-  },
-  gradientFromPosition: {
-    className: "grad-from-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-from-position": value
-      };
-    }
-  },
-  gradientToPosition: {
-    className: "grad-to-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-to-position": value
-      };
-    }
-  },
-  gradientFrom: {
-    className: "grad-from",
-    values: "colors",
-    group: "Background Gradient",
-    transform: createColorMixTransform("--gradient-from")
-  },
-  gradientTo: {
-    className: "grad-to",
-    values: "colors",
-    group: "Background Gradient",
-    transform: createColorMixTransform("--gradient-to")
-  },
-  gradientVia: {
-    className: "grad-via",
-    values: "colors",
-    group: "Background Gradient",
-    transform(value, args) {
-      const transformed = gradientVia(value, args);
-      return {
-        ...transformed,
-        "--gradient-stops": "var(--gradient-via-stops)",
-        "--gradient-via-stops": gradientViaStops
-      };
-    }
-  },
-  gradientViaPosition: {
-    className: "grad-via-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-via-position": value
-      };
-    }
-  }
-};
-
-// src/utilities/helpers.ts
-var srMapping = {
-  true: {
-    position: "absolute",
-    width: "1px",
-    height: "1px",
-    padding: "0",
-    margin: "-1px",
-    overflow: "hidden",
-    clip: "rect(0, 0, 0, 0)",
-    whiteSpace: "nowrap",
-    borderWidth: "0"
-  },
-  false: {
-    position: "static",
-    width: "auto",
-    height: "auto",
-    padding: "0",
-    margin: "0",
-    overflow: "visible",
-    clip: "auto",
-    whiteSpace: "normal"
-  }
-};
-var helpers = {
-  srOnly: {
-    className: "sr",
-    values: { type: "boolean" },
-    group: "Other",
-    transform(value) {
-      return srMapping[value] || {};
-    }
-  },
-  debug: {
-    className: "debug",
-    values: { type: "boolean" },
-    group: "Other",
-    transform(value) {
-      if (!value) return {};
-      return {
-        outline: "1px solid blue !important",
-        "&>*": {
-          outline: "1px solid red !important"
-        }
-      };
-    }
-  }
-};
-
-// src/utilities/interactivity.ts
-var interactivity = {
-  accentColor: {
-    className: "ac-c",
-    values: "colors",
-    transform: createColorMixTransform("accentColor"),
-    group: "Color"
-  },
-  caretColor: {
-    className: "ca-c",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("caretColor")
-  },
-  scrollBehavior: {
-    className: "scr-bhv",
-    group: "Scroll"
-  },
-  // Scroll bar
-  scrollbar: {
-    className: "scr-bar",
-    values: ["visible", "hidden"],
-    group: "Scroll",
-    transform(value) {
-      if (value === "visible") {
-        return {
-          msOverflowStyle: "auto",
-          scrollbarWidth: "auto",
-          "&::-webkit-scrollbar": {
-            display: "block"
-          }
-        };
-      }
-      if (value === "hidden") {
-        return {
-          msOverflowStyle: "none",
-          scrollbarWidth: "none",
-          "&::-webkit-scrollbar": {
-            display: "none"
-          }
-        };
-      }
-    }
-  },
-  scrollbarColor: {
-    className: "scr-bar-c",
-    values: "colors",
-    group: "Scroll",
-    transform: createColorMixTransform("scrollbarColor")
-  },
-  scrollbarGutter: {
-    className: "scr-bar-g",
-    group: "Scroll"
-  },
-  scrollbarWidth: {
-    className: "scr-bar-w",
-    values: "sizes",
-    group: "Scroll"
-  },
-  // Scroll Margin
-  scrollMargin: {
-    className: "scr-m",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginLeft: {
-    className: "scr-ml",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginRight: {
-    className: "scr-mr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginTop: {
-    className: "scr-mt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBottom: {
-    className: "scr-mb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBlock: {
-    className: "scr-my",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollMarginY"]
-  },
-  scrollMarginBlockEnd: {
-    className: "scr-mbe",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBlockStart: {
-    className: "scr-mbt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginInline: {
-    className: "scr-mx",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollMarginX"]
-  },
-  scrollMarginInlineEnd: {
-    className: "scr-me",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginInlineStart: {
-    className: "scr-ms",
-    values: "spacing",
-    group: "Scroll"
-  },
-  // Scroll Padding
-  scrollPadding: {
-    className: "scr-p",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBlock: {
-    className: "scr-py",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollPaddingY"]
-  },
-  scrollPaddingBlockStart: {
-    className: "scr-pbs",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBlockEnd: {
-    className: "scr-pbe",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingInline: {
-    className: "scr-px",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollPaddingX"]
-  },
-  scrollPaddingInlineEnd: {
-    className: "scr-pe",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingInlineStart: {
-    className: "scr-ps",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingLeft: {
-    className: "scr-pl",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingRight: {
-    className: "scr-pr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingTop: {
-    className: "scr-pt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBottom: {
-    className: "scr-pb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  // Scroll Snap
-  scrollSnapAlign: {
-    className: "scr-sa",
-    group: "Scroll"
-  },
-  scrollSnapStop: {
-    className: "scrs-s",
-    group: "Scroll"
-  },
-  scrollSnapType: {
-    className: "scrs-t",
-    group: "Scroll",
-    values: {
-      none: "none",
-      x: "x var(--scroll-snap-strictness)",
-      y: "y var(--scroll-snap-strictness)",
-      both: "both var(--scroll-snap-strictness)"
-    }
-  },
-  scrollSnapStrictness: {
-    className: "scrs-strt",
-    values: ["mandatory", "proximity"],
-    group: "Scroll",
-    transform(value) {
-      return {
-        "--scroll-snap-strictness": value
-      };
-    }
-  },
-  scrollSnapMargin: {
-    className: "scrs-m",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginTop: {
-    className: "scrs-mt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginBottom: {
-    className: "scrs-mb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginLeft: {
-    className: "scrs-ml",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginRight: {
-    className: "scrs-mr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapCoordinate: {
-    className: "scrs-c",
-    group: "Scroll"
-  },
-  scrollSnapDestination: {
-    className: "scrs-d",
-    group: "Scroll"
-  },
-  scrollSnapPointsX: {
-    className: "scrs-px",
-    group: "Scroll"
-  },
-  scrollSnapPointsY: {
-    className: "scrs-py",
-    group: "Scroll"
-  },
-  scrollSnapTypeX: {
-    className: "scrs-tx",
-    group: "Scroll"
-  },
-  scrollSnapTypeY: {
-    className: "scrs-ty",
-    group: "Scroll"
-  },
-  // Scroll Timeline
-  scrollTimeline: {
-    className: "scrtl",
-    group: "Scroll"
-  },
-  scrollTimelineAxis: {
-    className: "scrtl-a",
-    group: "Scroll"
-  },
-  scrollTimelineName: {
-    className: "scrtl-n",
-    group: "Scroll"
-  },
-  touchAction: {
-    className: "tch-a",
-    group: "Interactivity"
-  },
-  userSelect: {
-    className: "us",
-    group: "Interactivity",
-    transform(value) {
-      return {
-        WebkitUserSelect: value,
-        userSelect: value
-      };
-    }
-  },
-  // Overflow
-  overflow: {
-    className: "ov",
-    group: "Scroll"
-  },
-  overflowWrap: {
-    className: "ov-wrap",
-    group: "Scroll"
-  },
-  overflowX: {
-    className: "ov-x",
-    group: "Scroll"
-  },
-  overflowY: {
-    className: "ov-y",
-    group: "Scroll"
-  },
-  overflowAnchor: {
-    className: "ov-a",
-    group: "Scroll"
-  },
-  overflowBlock: {
-    className: "ov-b",
-    group: "Scroll"
-  },
-  overflowInline: {
-    className: "ov-i",
-    group: "Scroll"
-  },
-  overflowClipBox: {
-    className: "ovcp-bx",
-    group: "Scroll"
-  },
-  overflowClipMargin: {
-    className: "ovcp-m",
-    group: "Scroll"
-  },
-  overscrollBehavior: {
-    className: "ovs-b",
-    group: "Scroll"
-  },
-  overscrollBehaviorX: {
-    className: "ovs-bx",
-    group: "Scroll"
-  },
-  overscrollBehaviorY: {
-    className: "ovs-by",
-    group: "Scroll"
-  },
-  overscrollBehaviorBlock: {
-    className: "ovs-bb",
-    group: "Scroll"
-  },
-  overscrollBehaviorInline: {
-    className: "ovs-bi",
-    group: "Scroll"
-  }
-};
-
-// src/utilities/layout.ts
-var layout = {
-  aspectRatio: {
-    className: "asp",
-    values: "aspectRatios",
-    group: "Layout"
-  },
-  boxDecorationBreak: {
-    className: "bx-db",
-    group: "Layout",
-    transform(value) {
-      return {
-        boxDecorationBreak: value,
-        WebkitBoxDecorationBreak: value
-      };
-    }
-  },
-  zIndex: {
-    className: "z",
-    values: "zIndex",
-    group: "Visibility"
-  },
-  boxSizing: {
-    className: "bx-s",
-    group: "System"
-  },
-  objectPosition: {
-    className: "obj-p",
-    group: "Layout"
-  },
-  objectFit: {
-    className: "obj-f",
-    group: "Layout"
-  },
-  overscrollBehavior: {
-    className: "ovscl",
-    group: "Scroll"
-  },
-  overscrollBehaviorX: {
-    className: "ovscl-x",
-    group: "Scroll"
-  },
-  overscrollBehaviorY: {
-    className: "ovscl-y",
-    group: "Scroll"
-  },
-  position: {
-    className: "pos",
-    shorthand: "pos",
-    group: "Position"
-  },
-  top: {
-    className: "top",
-    values: "spacing",
-    group: "Position"
-  },
-  left: {
-    className: "left",
-    values: "spacing",
-    group: "Position"
-  },
-  inset: {
-    className: "inset",
-    group: "Position",
-    values: (theme) => ({
-      auto: "auto",
-      ...theme("spacing")
-    })
-  },
-  insetInline: {
-    className: "inset-x",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetX"]
-  },
-  insetBlock: {
-    className: "inset-y",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetY"]
-  },
-  insetBlockEnd: {
-    className: "inset-be",
-    values: "spacing",
-    group: "Position"
-  },
-  insetBlockStart: {
-    className: "inset-bs",
-    values: "spacing",
-    group: "Position"
-  },
-  insetInlineEnd: {
-    className: "inset-e",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetEnd", "end"]
-  },
-  insetInlineStart: {
-    className: "inset-s",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetStart", "start"]
-  },
-  right: {
-    className: "right",
-    values: "spacing",
-    group: "Position"
-  },
-  bottom: {
-    className: "bottom",
-    values: "spacing",
-    group: "Position"
-  },
-  float: {
-    className: "float",
-    values: ["start", "end"],
-    property: "float",
-    group: "Position",
-    transform(value) {
-      if (value === "start") {
-        return {
-          float: "left",
-          '[dir="rtl"] &': {
-            float: "right"
-          }
-        };
-      }
-      if (value === "end") {
-        return {
-          float: "right",
-          '[dir="rtl"] &': {
-            float: "left"
-          }
-        };
-      }
-      return {
-        float: value
-      };
-    }
-  },
-  visibility: {
-    className: "vis",
-    group: "Visibility"
-  }
-};
-
-// src/utilities/list.ts
-var list = {
-  listStyleType: {
-    className: "li-t",
-    group: "List"
-  },
-  listStylePosition: {
-    className: "li-pos",
-    group: "List"
-  },
-  listStyleImage: {
-    className: "li-img",
-    group: "List",
-    values: "assets"
-  },
-  listStyle: {
-    className: "li-s",
-    group: "List"
-  }
-};
-
-// src/utilities/outline.ts
-var outline = {
-  outlineWidth: {
-    className: "ring-w",
-    shorthand: "ringWidth",
-    values: "borderWidths",
-    group: "Border"
-  },
-  outlineColor: {
-    className: "ring-c",
-    values: "colors",
-    group: "Color",
-    shorthand: "ringColor",
-    transform: createColorMixTransform("outlineColor")
-  },
-  outline: {
-    className: "ring",
-    shorthand: "ring",
-    values: "borders",
-    group: "Border",
-    transform(value) {
-      if (value === "none") {
-        return { outline: "2px solid transparent", outlineOffset: "2px" };
-      }
-      return { outline: value };
-    }
-  },
-  outlineOffset: {
-    className: "ring-o",
-    shorthand: "ringOffset",
-    values: "spacing",
-    group: "Border"
-  }
-};
-
-// src/utilities/polyfill.ts
-var polyfill = {
-  appearance: {
-    className: "ap",
-    group: "Visibility",
-    transform(value) {
-      return { appearance: value, WebkitAppearance: value };
-    }
-  },
-  backfaceVisibility: {
-    className: "bfv",
-    group: "Visibility",
-    transform(value) {
-      return { backfaceVisibility: value, WebkitBackfaceVisibility: value };
-    }
-  },
-  clipPath: {
-    className: "cp-path",
-    group: "Other",
-    transform(value) {
-      return { clipPath: value, WebkitClipPath: value };
-    }
-  },
-  hyphens: {
-    className: "hy",
-    group: "Other",
-    transform(value) {
-      return { hyphens: value, WebkitHyphens: value };
-    }
-  },
-  mask: {
-    className: "msk",
-    group: "Other",
-    transform(value) {
-      return { mask: value, WebkitMask: value };
-    }
-  },
-  maskImage: {
-    className: "msk-i",
-    group: "Other",
-    transform(value) {
-      return { maskImage: value, WebkitMaskImage: value };
-    }
-  },
-  maskSize: {
-    className: "msk-s",
-    group: "Other",
-    transform(value) {
-      return { maskSize: value, WebkitMaskSize: value };
-    }
-  },
-  textSizeAdjust: {
-    className: "txt-adj",
-    group: "Typography",
-    transform(value) {
-      return { textSizeAdjust: value, WebkitTextSizeAdjust: value };
-    }
-  }
-};
-
-// src/utilities/sizing.ts
-var widthValues = (theme) => ({
-  auto: "auto",
-  ...theme("sizes"),
-  "1/2": "50%",
-  "1/3": "33.333333%",
-  "2/3": "66.666667%",
-  "1/4": "25%",
-  "2/4": "50%",
-  "3/4": "75%",
-  "1/5": "20%",
-  "2/5": "40%",
-  "3/5": "60%",
-  "4/5": "80%",
-  "1/6": "16.666667%",
-  "2/6": "33.333333%",
-  "3/6": "50%",
-  "4/6": "66.666667%",
-  "5/6": "83.333333%",
-  "1/12": "8.333333%",
-  "2/12": "16.666667%",
-  "3/12": "25%",
-  "4/12": "33.333333%",
-  "5/12": "41.666667%",
-  "6/12": "50%",
-  "7/12": "58.333333%",
-  "8/12": "66.666667%",
-  "9/12": "75%",
-  "10/12": "83.333333%",
-  "11/12": "91.666667%",
-  screen: "100vw"
-});
-var heightValues = (theme) => ({
-  auto: "auto",
-  ...theme("sizes"),
-  svh: "100svh",
-  lvh: "100lvh",
-  dvh: "100dvh",
-  screen: "100vh",
-  "1/2": "50%",
-  "1/3": "33.333333%",
-  "2/3": "66.666667%",
-  "1/4": "25%",
-  "2/4": "50%",
-  "3/4": "75%",
-  "1/5": "20%",
-  "2/5": "40%",
-  "3/5": "60%",
-  "4/5": "80%",
-  "1/6": "16.666667%",
-  "2/6": "33.333333%",
-  "3/6": "50%",
-  "4/6": "66.666667%",
-  "5/6": "83.333333%"
-});
-var sizing = {
-  width: {
-    shorthand: "w",
-    className: "w",
-    group: "Width",
-    values: widthValues
-  },
-  inlineSize: {
-    className: "w-is",
-    group: "Width",
-    values: widthValues
-  },
-  minWidth: {
-    shorthand: "minW",
-    className: "min-w",
-    group: "Width",
-    values: widthValues
-  },
-  minInlineSize: {
-    className: "min-w-is",
-    group: "Width",
-    values: widthValues
-  },
-  maxWidth: {
-    shorthand: "maxW",
-    className: "max-w",
-    group: "Width",
-    values: widthValues
-  },
-  maxInlineSize: {
-    className: "max-w-is",
-    group: "Width",
-    values: widthValues
-  },
-  height: {
-    shorthand: "h",
-    className: "h",
-    group: "Height",
-    values: heightValues
-  },
-  blockSize: {
-    className: "h-bs",
-    group: "Height",
-    values: heightValues
-  },
-  minHeight: {
-    shorthand: "minH",
-    className: "min-h",
-    group: "Height",
-    values: heightValues
-  },
-  minBlockSize: {
-    className: "min-h-bs",
-    group: "Height",
-    values: heightValues
-  },
-  maxHeight: {
-    shorthand: "maxH",
-    className: "max-h",
-    group: "Height",
-    values: heightValues
-  },
-  maxBlockSize: {
-    className: "max-b",
-    group: "Height",
-    values: heightValues
-  },
-  boxSize: {
-    className: "size",
-    group: "Width",
-    values: widthValues,
-    transform(value) {
-      return {
-        width: value,
-        height: value
-      };
-    }
-  }
-};
-
-// src/utilities/spacing.ts
-var marginValues = (theme) => ({
-  auto: "auto",
-  ...theme("spacing")
-});
-var spacing = {
-  padding: {
-    className: "p",
-    shorthand: "p",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingLeft: {
-    className: "pl",
-    shorthand: "pl",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingRight: {
-    className: "pr",
-    shorthand: "pr",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingTop: {
-    className: "pt",
-    shorthand: "pt",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingBottom: {
-    className: "pb",
-    shorthand: "pb",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingBlock: {
-    className: "py",
-    values: "spacing",
-    group: "Padding",
-    shorthand: ["py", "paddingY"]
-  },
-  paddingBlockEnd: {
-    className: "pbe",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingBlockStart: {
-    className: "pbs",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingInline: {
-    className: "px",
-    values: "spacing",
-    group: "Padding",
-    shorthand: ["paddingX", "px"]
-  },
-  paddingInlineEnd: {
-    className: "pe",
-    shorthand: ["pe", "paddingEnd"],
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingInlineStart: {
-    className: "ps",
-    shorthand: ["ps", "paddingStart"],
-    values: "spacing",
-    group: "Padding"
-  },
-  marginLeft: {
-    className: "ml",
-    shorthand: "ml",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginRight: {
-    className: "mr",
-    shorthand: "mr",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginTop: {
-    className: "mt",
-    shorthand: "mt",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginBottom: {
-    className: "mb",
-    shorthand: "mb",
-    values: marginValues,
-    group: "Margin"
-  },
-  margin: {
-    className: "m",
-    shorthand: "m",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginBlock: {
-    className: "my",
-    values: marginValues,
-    group: "Margin",
-    shorthand: ["my", "marginY"]
-  },
-  marginBlockEnd: {
-    className: "mbe",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginBlockStart: {
-    className: "mbs",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginInline: {
-    className: "mx",
-    values: marginValues,
-    group: "Margin",
-    shorthand: ["mx", "marginX"]
-  },
-  marginInlineEnd: {
-    className: "me",
-    shorthand: ["me", "marginEnd"],
-    values: marginValues,
-    group: "Margin"
-  },
-  marginInlineStart: {
-    className: "ms",
-    shorthand: ["ms", "marginStart"],
-    values: marginValues,
-    group: "Margin"
-  },
-  spaceX: {
-    className: "sx",
-    values: marginValues,
-    property: "marginInlineStart",
-    group: "Margin",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          marginInlineStart: value,
-          marginInlineEnd: "0px"
-        }
-      };
-    }
-  },
-  spaceY: {
-    className: "sy",
-    values: marginValues,
-    property: "marginBlockStart",
-    group: "Margin",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          marginTop: value,
-          marginBottom: "0px"
-        }
-      };
-    }
-  }
-};
-
-// src/utilities/svg.ts
-var svg = {
-  fill: {
-    className: "fill",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("fill")
-  },
-  stroke: {
-    className: "stk",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("stroke")
-  },
-  strokeWidth: {
-    className: "stk-w",
-    values: "borderWidths",
-    group: "Border"
-  },
-  strokeDasharray: {
-    className: "stk-dsh",
-    group: "Border"
-  },
-  strokeDashoffset: {
-    className: "stk-do",
-    group: "Border"
-  },
-  strokeLinecap: {
-    className: "stk-lc",
-    group: "Border"
-  },
-  strokeLinejoin: {
-    className: "stk-lj",
-    group: "Border"
-  },
-  strokeMiterlimit: {
-    className: "stk-ml",
-    group: "Border"
-  },
-  strokeOpacity: {
-    className: "stk-op",
-    group: "Border"
-  }
-};
-
-// src/utilities/tables.ts
-var tables = {
-  borderCollapse: {
-    className: "bd-cl",
-    group: "Table"
-  },
-  borderSpacing: {
-    className: "bd-sp",
-    group: "Table",
-    values(theme) {
-      return {
-        ...theme("spacing"),
-        auto: "var(--border-spacing-x) var(--border-spacing-y)"
-      };
-    }
-  },
-  borderSpacingX: {
-    className: "bd-sx",
-    values: "spacing",
-    group: "Table",
-    transform(value) {
-      return {
-        "--border-spacing-x": value
-      };
-    }
-  },
-  borderSpacingY: {
-    className: "bd-sy",
-    values: "spacing",
-    group: "Table",
-    transform(value) {
-      return {
-        "--border-spacing-y": value
-      };
-    }
-  },
-  tableLayout: {
-    className: "tbl",
-    group: "Table"
-  }
-};
-
-// src/utilities/transforms.ts
-var positiveFractions = {
-  "1/2": "50%",
-  "1/3": "33.333333%",
-  "2/3": "66.666667%",
-  "1/4": "25%",
-  "2/4": "50%",
-  "3/4": "75%",
-  full: "100%"
-};
-var negativeFractions = Object.fromEntries(
-  Object.entries(positiveFractions).map(([key, value]) => [`-${key}`, `-${value}`])
-);
-var fractions = { ...positiveFractions, ...negativeFractions };
-var transforms = {
-  transformOrigin: {
-    className: "trf-o",
-    group: "Transform"
-  },
-  transformBox: {
-    className: "trf-b",
-    group: "Transform"
-  },
-  transformStyle: {
-    className: "trf-s",
-    group: "Transform"
-  },
-  transform: {
-    className: "trf",
-    group: "Transform"
-  },
-  rotate: {
-    className: "rotate",
-    group: "Transform",
-    property: "rotate",
-    values: {
-      auto: "var(--rotate-x) var(--rotate-y)",
-      "auto-3d": "var(--rotate-x) var(--rotate-y) var(--rotate-z)"
-    }
-  },
-  rotateX: {
-    className: "rotate-x",
-    group: "Transform",
-    property: "rotate",
-    transform(value) {
-      return {
-        "--rotate-x": value
-      };
-    }
-  },
-  rotateY: {
-    className: "rotate-y",
-    group: "Transform",
-    property: "rotate",
-    transform(value) {
-      return {
-        "--rotate-y": value
-      };
-    }
-  },
-  rotateZ: {
-    className: "rotate-z",
-    group: "Transform",
-    property: "rotate",
-    transform(value) {
-      return {
-        "--rotate-z": value
-      };
-    }
-  },
-  scale: {
-    className: "scale",
-    group: "Transform",
-    property: "scale",
-    values: {
-      auto: "var(--scale-x) var(--scale-y)"
-    }
-  },
-  scaleX: {
-    className: "scale-x",
-    group: "Transform",
-    transform(value) {
-      return {
-        "--scale-x": value
-      };
-    }
-  },
-  scaleY: {
-    className: "scale-y",
-    group: "Transform",
-    transform(value) {
-      return {
-        "--scale-y": value
-      };
-    }
-  },
-  translate: {
-    className: "translate",
-    group: "Transform",
-    property: "translate",
-    values: {
-      auto: "var(--translate-x) var(--translate-y)",
-      "auto-3d": "var(--translate-x) var(--translate-y) var(--translate-z)"
-    }
-  },
-  translateX: {
-    shorthand: "x",
-    className: "translate-x",
-    group: "Transform",
-    values(theme) {
-      return {
-        ...theme("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-x": value
-      };
-    }
-  },
-  translateY: {
-    shorthand: "y",
-    className: "translate-y",
-    group: "Transform",
-    values(theme) {
-      return {
-        ...theme("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-y": value
-      };
-    }
-  },
-  translateZ: {
-    shorthand: "z",
-    className: "translate-z",
-    group: "Transform",
-    values(theme) {
-      return {
-        ...theme("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-z": value
-      };
-    }
-  }
-};
-
-// src/utilities/transitions.ts
-var createTransition = (value) => ({
-  transitionProperty: `var(--transition-prop, ${value})`,
-  transitionTimingFunction: "var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1))",
-  transitionDuration: "var(--transition-duration, 150ms)"
-});
-var transitionMap = {
-  all: createTransition("all"),
-  common: createTransition(
-    "color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter"
-  ),
-  size: createTransition("width, height, min-width, max-width, min-height, max-height"),
-  position: createTransition("left, right, top, bottom, inset, inset-inline, inset-block"),
-  background: createTransition("background, background-color, background-image, background-position"),
-  colors: createTransition("color, background-color, border-color, outline-color, text-decoration-color, fill, stroke"),
-  opacity: createTransition("opacity"),
-  shadow: createTransition("box-shadow"),
-  transform: createTransition("transform")
-};
-var transitionPropertyMap = {
-  common: "color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",
-  colors: "color, background-color, border-color, outline-color, text-decoration-color, fill, stroke",
-  size: "width, height, min-width, max-width, min-height, max-height",
-  position: "left, right, top, bottom, inset, inset-inline, inset-block",
-  background: "background, background-color, background-image, background-position"
-};
-var transitions = {
-  transitionTimingFunction: {
-    className: "trs-tmf",
-    values: "easings",
-    group: "Transition",
-    transform(value) {
-      return {
-        "--transition-easing": value,
-        transitionTimingFunction: value
-      };
-    }
-  },
-  transitionDelay: {
-    className: "trs-dly",
-    values: "durations",
-    group: "Transition"
-  },
-  transitionDuration: {
-    className: "trs-dur",
-    values: "durations",
-    group: "Transition",
-    transform(value) {
-      return {
-        "--transition-duration": value,
-        transitionDuration: value
-      };
-    }
-  },
-  transitionProperty: {
-    className: "trs-prop",
-    group: "Transition",
-    values: transitionPropertyMap,
-    transform(value) {
-      return {
-        "--transition-prop": value,
-        transitionProperty: value
-      };
-    }
-  },
-  transition: {
-    className: "trs",
-    values: Object.keys(transitionMap),
-    group: "Transition",
-    transform(value) {
-      return transitionMap[value] ?? { transition: value };
-    }
-  },
-  // Animations
-  animation: {
-    className: "anim",
-    values: "animations",
-    group: "Animation"
-  },
-  animationName: {
-    className: "anim-n",
-    values: "keyframes",
-    group: "Animation"
-  },
-  animationTimingFunction: {
-    className: "anim-tmf",
-    values: "easings",
-    group: "Animation"
-  },
-  animationDuration: {
-    className: "anim-dur",
-    values: "durations",
-    group: "Animation"
-  },
-  animationDelay: {
-    className: "anim-dly",
-    values: "durations",
-    group: "Animation"
-  },
-  animationPlayState: {
-    className: "anim-ps",
-    group: "Animation"
-  },
-  animationComposition: {
-    className: "anim-comp",
-    group: "Animation"
-  },
-  animationFillMode: {
-    className: "anim-fm",
-    group: "Animation"
-  },
-  animationDirection: {
-    className: "anim-dir",
-    group: "Animation"
-  },
-  animationIterationCount: {
-    className: "anim-ic",
-    group: "Animation"
-  },
-  animationRange: {
-    className: "anim-r",
-    group: "Animation"
-  },
-  animationState: {
-    className: "anim-s",
-    group: "Animation"
-  },
-  animationRangeStart: {
-    className: "anim-rs",
-    group: "Animation"
-  },
-  animationRangeEnd: {
-    className: "anim-re",
-    group: "Animation"
-  },
-  animationTimeline: {
-    className: "anim-tl",
-    group: "Animation"
-  }
-};
-
-// src/utilities/typography.ts
-var typography = {
-  color: {
-    className: "c",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("color")
-  },
-  fontFamily: {
-    className: "ff",
-    values: "fonts",
-    group: "Typography"
-  },
-  fontSize: {
-    className: "fs",
-    values: "fontSizes",
-    group: "Typography"
-  },
-  fontSizeAdjust: {
-    className: "fs-a",
-    group: "Typography"
-  },
-  fontPalette: {
-    className: "fp",
-    group: "Typography"
-  },
-  fontKerning: {
-    className: "fk",
-    group: "Typography"
-  },
-  fontFeatureSettings: {
-    className: "ff-s",
-    group: "Typography"
-  },
-  fontWeight: {
-    className: "fw",
-    values: "fontWeights",
-    group: "Typography"
-  },
-  fontSmoothing: {
-    className: "fsmt",
-    group: "Typography",
-    values: {
-      antialiased: "antialiased",
-      "subpixel-antialiased": "auto"
-    },
-    transform(value) {
-      return {
-        WebkitFontSmoothing: value
-      };
-    }
-  },
-  fontVariant: {
-    className: "fv",
-    group: "Typography"
-  },
-  fontVariantAlternates: {
-    className: "fv-alt",
-    group: "Typography"
-  },
-  fontVariantCaps: {
-    className: "fv-caps",
-    group: "Typography"
-  },
-  fontVariationSettings: {
-    className: "fv-s",
-    group: "Typography"
-  },
-  fontVariantNumeric: {
-    className: "fv-num",
-    group: "Typography"
-  },
-  letterSpacing: {
-    className: "ls",
-    values: "letterSpacings",
-    group: "Typography"
-  },
-  lineHeight: {
-    className: "lh",
-    values: "lineHeights",
-    group: "Typography"
-  },
-  textAlign: {
-    className: "ta",
-    group: "Typography"
-  },
-  textDecoration: {
-    className: "td",
-    group: "Typography"
-  },
-  textDecorationColor: {
-    className: "td-c",
-    values: "colors",
-    transform: createColorMixTransform("textDecorationColor"),
-    group: "Typography"
-  },
-  textEmphasisColor: {
-    className: "te-c",
-    values: "colors",
-    transform: createColorMixTransform("textEmphasisColor"),
-    group: "Typography"
-  },
-  textDecorationStyle: {
-    className: "td-s",
-    group: "Typography"
-  },
-  textDecorationThickness: {
-    className: "td-t",
-    group: "Typography"
-  },
-  textUnderlineOffset: {
-    className: "tu-o",
-    group: "Typography"
-  },
-  textTransform: {
-    className: "tt",
-    group: "Typography"
-  },
-  textIndent: {
-    className: "ti",
-    group: "Typography",
-    values: "spacing"
-  },
-  textShadow: {
-    className: "tsh",
-    values: "shadows",
-    group: "Typography"
-  },
-  textShadowColor: {
-    shorthand: "textShadowColor",
-    className: "tsh-c",
-    values: "colors",
-    transform: createColorMixTransform("--text-shadow-color"),
-    group: "Typography"
-  },
-  WebkitTextFillColor: {
-    className: "wktf-c",
-    values: "colors",
-    transform: createColorMixTransform("WebkitTextFillColor"),
-    group: "Typography"
-  },
-  textOverflow: {
-    className: "tov",
-    group: "Typography"
-  },
-  verticalAlign: {
-    className: "va",
-    group: "Typography"
-  },
-  wordBreak: {
-    className: "wb",
-    group: "Typography"
-  },
-  textWrap: {
-    className: "tw",
-    values: ["wrap", "balance", "nowrap"],
-    group: "Typography",
-    transform(value) {
-      return { textWrap: value };
-    }
-  },
-  truncate: {
-    className: "trunc",
-    values: { type: "boolean" },
-    group: "Typography",
-    transform(value) {
-      if (!value) return {};
-      return {
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap"
-      };
-    }
-  },
-  lineClamp: {
-    className: "lc",
-    group: "Typography",
-    transform(value) {
-      if (value === "none") {
-        return {
-          WebkitLineClamp: "unset"
-        };
-      }
-      return {
-        overflow: "hidden",
-        display: "-webkit-box",
-        WebkitLineClamp: value,
-        WebkitBoxOrient: "vertical"
-      };
-    }
-  }
-};
-
-// src/utilities/index.ts
-var utilities = Object.assign(
-  {},
-  layout,
-  display,
-  flexGrid,
-  spacing,
-  outline,
-  focusRing,
-  divide,
-  sizing,
-  typography,
-  list,
-  background,
-  backgroundGradients,
-  border,
-  effects,
-  tables,
-  transitions,
-  transforms,
-  interactivity,
-  svg,
-  helpers,
-  polyfill,
-  container2,
-  cursor
-);
-
-// src/index.ts
-var definePreset = (preset2) => preset2;
-var preset = definePreset({
-  name: "@bamboocss/preset-base",
-  conditions,
-  utilities,
-  patterns,
-  // globalVars,
-  globalCss
-});
-var index_default = preset;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  preset
-});