@pandacss/eslint-plugin 0.3.2 → 2.0.0-beta.11

package/dist/utils/worker.js

@@ -1,4103 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/utils/worker.ts
-var worker_exports = {};
-__export(worker_exports, {
-  getContext: () => getContext,
-  run: () => run,
-  runAsync: () => runAsync
-});
-module.exports = __toCommonJS(worker_exports);
-var import_generator2 = require("@pandacss/generator");
-var import_synckit = require("synckit");
-
-// ../node_modules/.pnpm/@pandacss+preset-base@0.40.1/node_modules/@pandacss/preset-base/dist/index.mjs
-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])",
-  active: "&:is(:active, [data-active])",
-  visited: "&:visited",
-  target: "&:target",
-  readOnly: "&:is(:read-only, [data-read-only])",
-  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]",
-  before: "&::before",
-  after: "&::after",
-  firstLetter: "&::first-letter",
-  firstLine: "&::first-line",
-  marker: "&::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]) ~ &",
-  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]) &",
-  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:invalid &",
-  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])",
-  autofill: "&:autofill",
-  inRange: "&:in-range",
-  outOfRange: "&:out-of-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])",
-  default: "&:default",
-  optional: "&:optional",
-  open: '&:is([open], [data-open], [data-state="open"])',
-  closed: '&:is([closed], [data-closed], [data-state="closed"])',
-  fullscreen: "&:fullscreen",
-  loading: "&:is([data-loading], [aria-busy=true])",
-  currentPage: "&[aria-current=page]",
-  currentStep: "&[aria-current=step]",
-  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: "[dir=ltr] &",
-  rtl: "[dir=rtl] &",
-  scrollbar: "&::-webkit-scrollbar",
-  scrollbarThumb: "&::-webkit-scrollbar-thumb",
-  scrollbarTrack: "&::-webkit-scrollbar-track",
-  horizontal: "&[data-orientation=horizontal]",
-  vertical: "&[data-orientation=vertical]",
-  starting: "@starting-style"
-};
-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
-  }
-};
-function definePattern(config2) {
-  return config2;
-}
-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: "10px"
-  },
-  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: "10px"
-  },
-  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: "10px"
-  },
-  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 }) {
-    const { size, ...rest } = props;
-    return {
-      alignSelf: "stretch",
-      justifySelf: "stretch",
-      flex: map(size, (v) => v == null ? "1" : `0 0 ${v}`),
-      ...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 : "10px" };
-  },
-  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 : "10px", 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
-};
-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})`
-  };
-};
-var background = {
-  backgroundPosition: {
-    shorthand: "bgPosition",
-    className: "bg-pos",
-    group: "Background"
-  },
-  backgroundPositionX: {
-    shorthand: "bgPositionX",
-    className: "bg-pos-x",
-    group: "Background"
-  },
-  backgroundPositionY: {
-    shorthand: "bgPositionY",
-    className: "bg-pos-y",
-    group: "Background"
-  },
-  backgroundAttachment: {
-    shorthand: "bgAttachment",
-    className: "bg-attach",
-    group: "Background"
-  },
-  backgroundClip: {
-    shorthand: "bgClip",
-    className: "bg-clip",
-    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",
-    values: "colors",
-    group: "Background",
-    transform: createColorMixTransform("backgroundColor")
-  },
-  backgroundOrigin: {
-    shorthand: "bgOrigin",
-    className: "bg-origin",
-    group: "Background"
-  },
-  backgroundImage: {
-    shorthand: "bgImage",
-    className: "bg-img",
-    values: "assets",
-    group: "Background"
-  },
-  backgroundRepeat: {
-    shorthand: "bgRepeat",
-    className: "bg-repeat",
-    group: "Background"
-  },
-  backgroundBlendMode: {
-    shorthand: "bgBlendMode",
-    className: "bg-blend",
-    group: "Background"
-  },
-  backgroundSize: {
-    shorthand: "bgSize",
-    className: "bg-size",
-    group: "Background"
-  }
-};
-var border = {
-  borderRadius: {
-    className: "rounded",
-    shorthand: "rounded",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopLeftRadius: {
-    className: "rounded-tl",
-    shorthand: "roundedTopLeft",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopRightRadius: {
-    className: "rounded-tr",
-    shorthand: "roundedTopRight",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderBottomRightRadius: {
-    className: "rounded-br",
-    shorthand: "roundedBottomRight",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderBottomLeftRadius: {
-    className: "rounded-bl",
-    shorthand: "roundedBottomLeft",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderTopRadius: {
-    className: "rounded-t",
-    shorthand: "roundedTop",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopLeftRadius: value,
-        borderTopRightRadius: value
-      };
-    }
-  },
-  borderRightRadius: {
-    className: "rounded-r",
-    shorthand: "roundedRight",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopRightRadius: value,
-        borderBottomRightRadius: value
-      };
-    }
-  },
-  borderBottomRadius: {
-    className: "rounded-b",
-    shorthand: "roundedBottom",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderBottomLeftRadius: value,
-        borderBottomRightRadius: value
-      };
-    }
-  },
-  borderLeftRadius: {
-    className: "rounded-l",
-    shorthand: "roundedLeft",
-    values: "radii",
-    property: "borderRadius",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderTopLeftRadius: value,
-        borderBottomLeftRadius: value
-      };
-    }
-  },
-  borderStartStartRadius: {
-    className: "rounded-ss",
-    shorthand: "roundedStartStart",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderStartEndRadius: {
-    className: "rounded-se",
-    shorthand: "roundedStartEnd",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderStartRadius: {
-    className: "rounded-s",
-    values: "radii",
-    property: "borderRadius",
-    shorthand: "roundedStart",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderStartStartRadius: value,
-        borderEndStartRadius: value
-      };
-    }
-  },
-  borderEndStartRadius: {
-    className: "rounded-es",
-    shorthand: "roundedEndStart",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderEndEndRadius: {
-    className: "rounded-ee",
-    shorthand: "roundedEndEnd",
-    values: "radii",
-    group: "Border Radius"
-  },
-  borderEndRadius: {
-    className: "rounded-e",
-    shorthand: "roundedEnd",
-    property: "borderRadius",
-    values: "radii",
-    group: "Border Radius",
-    transform(value) {
-      return {
-        borderStartEndRadius: value,
-        borderEndEndRadius: value
-      };
-    }
-  },
-  border: {
-    className: "border",
-    values: "borders",
-    group: "Border"
-  },
-  borderWidth: {
-    className: "border-w",
-    values: "borderWidths",
-    group: "Border Radius"
-  },
-  borderTopWidth: {
-    className: "border-tw",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderLeftWidth: {
-    className: "border-lw",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderRightWidth: {
-    className: "border-rw",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderBottomWidth: {
-    className: "border-bw",
-    values: "borderWidths",
-    group: "Border"
-  },
-  borderColor: {
-    className: "border",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderColor")
-  },
-  borderInline: {
-    className: "border-x",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderX"
-  },
-  borderInlineWidth: {
-    className: "border-x",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderXWidth"
-  },
-  borderInlineColor: {
-    className: "border-x",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderXColor",
-    transform: createColorMixTransform("borderInlineColor")
-  },
-  borderBlock: {
-    className: "border-y",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderY"
-  },
-  borderBlockWidth: {
-    className: "border-y",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderYWidth"
-  },
-  borderBlockColor: {
-    className: "border-y",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderYColor",
-    transform: createColorMixTransform("borderBlockColor")
-  },
-  borderLeft: {
-    className: "border-l",
-    values: "borders",
-    group: "Border"
-  },
-  borderLeftColor: {
-    className: "border-l",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderLeftColor")
-  },
-  borderInlineStart: {
-    className: "border-s",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderStart"
-  },
-  borderInlineStartWidth: {
-    className: "border-s",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderStartWidth"
-  },
-  borderInlineStartColor: {
-    className: "border-s",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderStartColor",
-    transform: createColorMixTransform("borderInlineStartColor")
-  },
-  borderRight: {
-    className: "border-r",
-    values: "borders",
-    group: "Border"
-  },
-  borderRightColor: {
-    className: "border-r",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderRightColor")
-  },
-  borderInlineEnd: {
-    className: "border-e",
-    values: "borders",
-    group: "Border",
-    shorthand: "borderEnd"
-  },
-  borderInlineEndWidth: {
-    className: "border-e",
-    values: "borderWidths",
-    group: "Border",
-    shorthand: "borderEndWidth"
-  },
-  borderInlineEndColor: {
-    className: "border-e",
-    values: "colors",
-    group: "Border",
-    shorthand: "borderEndColor",
-    transform: createColorMixTransform("borderInlineEndColor")
-  },
-  borderTop: {
-    className: "border-t",
-    values: "borders",
-    group: "Border"
-  },
-  borderTopColor: {
-    className: "border-t",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderTopColor")
-  },
-  borderBottom: {
-    className: "border-b",
-    values: "borders",
-    group: "Border"
-  },
-  borderBottomColor: {
-    className: "border-b",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBottomColor")
-  },
-  borderBlockEnd: {
-    className: "border-be",
-    values: "borders",
-    group: "Border"
-  },
-  borderBlockEndColor: {
-    className: "border-be",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBlockEndColor")
-  },
-  borderBlockStart: {
-    className: "border-bs",
-    values: "borders",
-    group: "Border"
-  },
-  borderBlockStartColor: {
-    className: "border-bs",
-    values: "colors",
-    group: "Border",
-    transform: createColorMixTransform("borderBlockStartColor")
-  }
-};
-var container2 = {
-  container: {
-    className: "cq",
-    group: "Container"
-  },
-  containerName: {
-    className: "cq-name",
-    property: "containerName",
-    values: "containerNames",
-    group: "Container"
-  },
-  containerType: {
-    className: "cq-type",
-    group: "Container"
-  }
-};
-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"
-        }
-      };
-    }
-  }
-};
-var divideColor = createColorMixTransform("borderColor");
-var divide = {
-  divideX: {
-    className: "divide-x",
-    values: "borderWidths",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderInlineStartWidth: value,
-          borderInlineEndWidth: "0px"
-        }
-      };
-    }
-  },
-  divideY: {
-    className: "divide-y",
-    values: "borderWidths",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderTopWidth: value,
-          borderBottomWidth: "0px"
-        }
-      };
-    }
-  },
-  divideColor: {
-    className: "divide-color",
-    values: "colors",
-    group: "Border",
-    transform(value, args) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": divideColor(value, args)
-      };
-    }
-  },
-  divideStyle: {
-    className: "divide-style",
-    property: "borderStyle",
-    group: "Border",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          borderStyle: value
-        }
-      };
-    }
-  }
-};
-var effects = {
-  opacity: {
-    values: "opacity",
-    group: "Background"
-  },
-  boxShadow: {
-    shorthand: "shadow",
-    className: "shadow",
-    values: "shadows",
-    group: "Shadow"
-  },
-  boxShadowColor: {
-    shorthand: "shadowColor",
-    className: "shadow-color",
-    values: "colors",
-    transform: createColorMixTransform("--shadow-color"),
-    group: "Color"
-  },
-  mixBlendMode: {
-    className: "mix-blend",
-    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: "backdrop",
-    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: "backdrop-blur",
-    group: "Effect",
-    values: "blurs",
-    transform(value) {
-      return {
-        "--backdrop-blur": `blur(${value})`
-      };
-    }
-  },
-  backdropBrightness: {
-    className: "backdrop-brightness",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-brightness": `brightness(${value})`
-      };
-    }
-  },
-  backdropContrast: {
-    className: "backdrop-contrast",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-contrast": `contrast(${value})`
-      };
-    }
-  },
-  backdropGrayscale: {
-    className: "backdrop-grayscale",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-grayscale": `grayscale(${value})`
-      };
-    }
-  },
-  backdropHueRotate: {
-    className: "backdrop-hue-rotate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-hue-rotate": `hue-rotate(${value})`
-      };
-    }
-  },
-  backdropInvert: {
-    className: "backdrop-invert",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-invert": `invert(${value})`
-      };
-    }
-  },
-  backdropOpacity: {
-    className: "backdrop-opacity",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-opacity": value
-      };
-    }
-  },
-  backdropSaturate: {
-    className: "backdrop-saturate",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-saturate": `saturate(${value})`
-      };
-    }
-  },
-  backdropSepia: {
-    className: "backdrop-sepia",
-    group: "Effect",
-    transform(value) {
-      return {
-        "--backdrop-sepia": `sepia(${value})`
-      };
-    }
-  }
-};
-var flexGrid = {
-  flexBasis: {
-    className: "basis",
-    group: "Flex Layout",
-    values(theme2) {
-      return {
-        ...theme2("spacing"),
-        "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",
-    group: "Flex Layout",
-    shorthand: "flexDir"
-  },
-  flexGrow: {
-    className: "grow",
-    group: "Flex Layout"
-  },
-  flexShrink: {
-    className: "shrink",
-    group: "Flex Layout"
-  },
-  gridTemplateColumns: {
-    className: "grid-cols",
-    group: "Grid Layout",
-    values: {
-      "1": "repeat(1, minmax(0, 1fr))",
-      "2": "repeat(2, minmax(0, 1fr))",
-      "3": "repeat(3, minmax(0, 1fr))",
-      "4": "repeat(4, minmax(0, 1fr))",
-      "5": "repeat(5, minmax(0, 1fr))",
-      "6": "repeat(6, minmax(0, 1fr))",
-      "7": "repeat(7, minmax(0, 1fr))",
-      "8": "repeat(8, minmax(0, 1fr))",
-      "9": "repeat(9, minmax(0, 1fr))",
-      "10": "repeat(10, minmax(0, 1fr))",
-      "11": "repeat(11, minmax(0, 1fr))",
-      "12": "repeat(12, minmax(0, 1fr))"
-    }
-  },
-  gridTemplateRows: {
-    className: "grid-rows",
-    group: "Grid Layout",
-    values: {
-      "1": "repeat(1, minmax(0, 1fr))",
-      "2": "repeat(2, minmax(0, 1fr))",
-      "3": "repeat(3, minmax(0, 1fr))",
-      "4": "repeat(4, minmax(0, 1fr))",
-      "5": "repeat(5, minmax(0, 1fr))",
-      "6": "repeat(6, minmax(0, 1fr))",
-      "7": "repeat(7, minmax(0, 1fr))",
-      "8": "repeat(8, minmax(0, 1fr))",
-      "9": "repeat(9, minmax(0, 1fr))",
-      "10": "repeat(10, minmax(0, 1fr))",
-      "11": "repeat(11, minmax(0, 1fr))",
-      "12": "repeat(12, minmax(0, 1fr))"
-    }
-  },
-  gridColumn: {
-    className: "col-span",
-    group: "Grid Layout",
-    values: {
-      full: "1 / -1",
-      "1": "span 1 / span 1",
-      "2": "span 2 / span 2",
-      "3": "span 3 / span 3",
-      "4": "span 4 / span 4",
-      "5": "span 5 / span 5",
-      "6": "span 6 / span 6",
-      "7": "span 7 / span 7",
-      "8": "span 8 / span 8",
-      "9": "span 9 / span 9",
-      "10": "span 10 / span 10",
-      "11": "span 11 / span 11",
-      "12": "span 12 / span 12"
-    }
-  },
-  gridRow: {
-    className: "row-span",
-    group: "Grid Layout",
-    values: {
-      full: "1 / -1",
-      "1": "span 1 / span 1",
-      "2": "span 2 / span 2",
-      "3": "span 3 / span 3",
-      "4": "span 4 / span 4",
-      "5": "span 5 / span 5",
-      "6": "span 6 / span 6",
-      "7": "span 7 / span 7",
-      "8": "span 8 / span 8",
-      "9": "span 9 / span 9",
-      "10": "span 10 / span 10",
-      "11": "span 11 / span 11",
-      "12": "span 12 / span 12"
-    }
-  },
-  gridColumnStart: {
-    className: "col-start",
-    group: "Grid Layout"
-  },
-  gridColumnEnd: {
-    className: "col-end",
-    group: "Grid Layout"
-  },
-  gridAutoFlow: {
-    className: "grid-flow",
-    group: "Grid Layout"
-  },
-  gridAutoColumns: {
-    className: "auto-cols",
-    group: "Grid Layout",
-    values: {
-      min: "min-content",
-      max: "max-content",
-      fr: "minmax(0, 1fr)"
-    }
-  },
-  gridAutoRows: {
-    className: "auto-rows",
-    group: "Grid Layout",
-    values: {
-      min: "min-content",
-      max: "max-content",
-      fr: "minmax(0, 1fr)"
-    }
-  },
-  gap: {
-    className: "gap",
-    group: "Flex Layout",
-    values: "spacing"
-  },
-  gridGap: {
-    className: "gap",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  gridRowGap: {
-    className: "gap-x",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  gridColumnGap: {
-    className: "gap-y",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  rowGap: {
-    className: "gap-x",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  columnGap: {
-    className: "gap-y",
-    group: "Grid Layout",
-    values: "spacing"
-  },
-  justifyContent: {
-    className: "justify",
-    group: "Flex Layout"
-  },
-  alignContent: {
-    className: "content",
-    group: "Flex Layout"
-  },
-  alignItems: {
-    className: "items",
-    group: "Flex Layout"
-  },
-  alignSelf: {
-    className: "self",
-    group: "Flex Layout"
-  }
-};
-var gradientVia = createColorMixTransform("--gradient-via");
-var gradientTemplate = {
-  "to-t": "linear-gradient(to top, var(--gradient))",
-  "to-tr": "linear-gradient(to top right, var(--gradient))",
-  "to-r": "linear-gradient(to right, var(--gradient))",
-  "to-br": "linear-gradient(to bottom right, var(--gradient))",
-  "to-b": "linear-gradient(to bottom, var(--gradient))",
-  "to-bl": "linear-gradient(to bottom left, var(--gradient))",
-  "to-l": "linear-gradient(to left, var(--gradient))",
-  "to-tl": "linear-gradient(to top left, var(--gradient))"
-};
-var gradientVars = {
-  "--gradient-stops": "var(--gradient-via-stops, var(--gradient-from) var(--gradient-from-position), var(--gradient-to) var(--gradient-to-position))",
-  "--gradient": "var(--gradient-via-stops, var(--gradient-stops))"
-};
-var backgroundGradients = {
-  backgroundGradient: {
-    shorthand: "bgGradient",
-    className: "bg-gradient",
-    group: "Background Gradient",
-    values(theme2) {
-      return {
-        ...theme2("gradients"),
-        ...gradientTemplate
-      };
-    },
-    transform(value) {
-      return {
-        ...gradientVars,
-        backgroundImage: value
-      };
-    }
-  },
-  textGradient: {
-    className: "text-gradient",
-    group: "Background Gradient",
-    values(theme2) {
-      return {
-        ...theme2("gradients"),
-        ...gradientTemplate
-      };
-    },
-    transform(value) {
-      return {
-        ...gradientVars,
-        backgroundImage: value,
-        WebkitBackgroundClip: "text",
-        color: "transparent"
-      };
-    }
-  },
-  gradientFromPosition: {
-    className: "gradient-from-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-from-position": value
-      };
-    }
-  },
-  gradientToPosition: {
-    className: "gradient-to-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-to-position": value
-      };
-    }
-  },
-  gradientFrom: {
-    className: "gradient-from",
-    values: "colors",
-    group: "Background Gradient",
-    transform: createColorMixTransform("--gradient-from")
-  },
-  gradientTo: {
-    className: "gradient-to",
-    values: "colors",
-    group: "Background Gradient",
-    transform: createColorMixTransform("--gradient-to")
-  },
-  gradientVia: {
-    className: "gradient-via",
-    values: "colors",
-    group: "Background Gradient",
-    transform(value, args) {
-      const transformed = gradientVia(value, args);
-      return {
-        ...transformed,
-        "--gradient-stops": "var(--gradient-from) var(--gradient-from-position), var(--gradient-via) var(--gradient-via-position), var(--gradient-to) var(--gradient-to-position)"
-      };
-    }
-  },
-  gradientViaPosition: {
-    className: "gradient-via-pos",
-    group: "Background Gradient",
-    transform(value) {
-      return {
-        "--gradient-via-position": value
-      };
-    }
-  }
-};
-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"
-        }
-      };
-    }
-  }
-};
-var interactivity = {
-  accentColor: {
-    className: "accent",
-    values: "colors",
-    transform: createColorMixTransform("accentColor"),
-    group: "Color"
-  },
-  caretColor: {
-    className: "caret",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("caretColor")
-  },
-  scrollBehavior: {
-    className: "scroll",
-    group: "Scroll"
-  },
-  scrollbar: {
-    className: "scrollbar",
-    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"
-          }
-        };
-      }
-    }
-  },
-  scrollMargin: {
-    className: "scroll-m",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginLeft: {
-    className: "scroll-ml",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginRight: {
-    className: "scroll-mr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginTop: {
-    className: "scroll-mt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBottom: {
-    className: "scroll-mb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBlock: {
-    className: "scroll-my",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollMarginY"]
-  },
-  scrollMarginBlockEnd: {
-    className: "scroll-mb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginBlockStart: {
-    className: "scroll-mt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginInline: {
-    className: "scroll-mx",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollMarginX"]
-  },
-  scrollMarginInlineEnd: {
-    className: "scroll-me",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollMarginInlineStart: {
-    className: "scroll-ms",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPadding: {
-    className: "scroll-p",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBlock: {
-    className: "scroll-pb",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollPaddingY"]
-  },
-  scrollPaddingBlockStart: {
-    className: "scroll-pt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBlockEnd: {
-    className: "scroll-pb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingInline: {
-    className: "scroll-px",
-    values: "spacing",
-    group: "Scroll",
-    shorthand: ["scrollPaddingX"]
-  },
-  scrollPaddingInlineEnd: {
-    className: "scroll-pe",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingInlineStart: {
-    className: "scroll-ps",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingLeft: {
-    className: "scroll-pl",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingRight: {
-    className: "scroll-pr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingTop: {
-    className: "scroll-pt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollPaddingBottom: {
-    className: "scroll-pb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapAlign: {
-    className: "snap-align",
-    group: "Scroll"
-  },
-  scrollSnapStop: {
-    className: "snap-stop",
-    group: "Scroll"
-  },
-  scrollSnapType: {
-    className: "snap-type",
-    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: "snap-strictness",
-    values: ["mandatory", "proximity"],
-    group: "Scroll",
-    transform(value) {
-      return {
-        "--scroll-snap-strictness": value
-      };
-    }
-  },
-  scrollSnapMargin: {
-    className: "snap-m",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginTop: {
-    className: "snap-mt",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginBottom: {
-    className: "snap-mb",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginLeft: {
-    className: "snap-ml",
-    values: "spacing",
-    group: "Scroll"
-  },
-  scrollSnapMarginRight: {
-    className: "snap-mr",
-    values: "spacing",
-    group: "Scroll"
-  },
-  touchAction: {
-    className: "touch",
-    group: "Interactivity"
-  },
-  userSelect: {
-    className: "select",
-    group: "Interactivity",
-    transform(value) {
-      return {
-        WebkitUserSelect: value,
-        userSelect: value
-      };
-    }
-  }
-};
-var layout = {
-  aspectRatio: {
-    className: "aspect",
-    values: "aspectRatios",
-    group: "Layout"
-  },
-  boxDecorationBreak: {
-    className: "decoration",
-    group: "Layout",
-    transform(value) {
-      return {
-        boxDecorationBreak: value,
-        WebkitBoxDecorationBreak: value
-      };
-    }
-  },
-  zIndex: {
-    className: "z",
-    values: "zIndex",
-    group: "Visibility"
-  },
-  boxSizing: {
-    className: "box",
-    group: "System"
-  },
-  objectPosition: {
-    className: "obj-pos",
-    group: "Layout"
-  },
-  objectFit: {
-    className: "obj-fit",
-    group: "Layout"
-  },
-  overscrollBehavior: {
-    className: "overscroll",
-    group: "Scroll"
-  },
-  overscrollBehaviorX: {
-    className: "overscroll-x",
-    group: "Scroll"
-  },
-  overscrollBehaviorY: {
-    className: "overscroll-y",
-    group: "Scroll"
-  },
-  position: {
-    className: "pos",
-    shorthand: "pos",
-    group: "Position"
-  },
-  top: {
-    className: "top",
-    values: "spacing",
-    group: "Position"
-  },
-  left: {
-    className: "left",
-    values: "spacing",
-    group: "Position"
-  },
-  insetInline: {
-    className: "inset-x",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetX"]
-  },
-  insetBlock: {
-    className: "inset-y",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetY"]
-  },
-  inset: {
-    className: "inset",
-    group: "Position",
-    values: (theme2) => ({
-      auto: "auto",
-      ...theme2("spacing")
-    })
-  },
-  insetBlockEnd: {
-    className: "inset-b",
-    values: "spacing",
-    group: "Position"
-  },
-  insetBlockStart: {
-    className: "inset-t",
-    values: "spacing",
-    group: "Position"
-  },
-  insetInlineEnd: {
-    className: "end",
-    values: "spacing",
-    group: "Position",
-    shorthand: ["insetEnd", "end"]
-  },
-  insetInlineStart: {
-    className: "start",
-    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"
-  }
-};
-var list = {
-  listStyleType: {
-    className: "list-type",
-    group: "List"
-  },
-  listStylePosition: {
-    className: "list-pos",
-    group: "List"
-  },
-  listStyleImage: {
-    className: "list-img",
-    group: "List",
-    values: "assets"
-  }
-};
-var outline = {
-  outlineWidth: {
-    className: "ring-width",
-    shorthand: "ringWidth",
-    values: "borderWidths",
-    group: "Border"
-  },
-  outlineColor: {
-    className: "ring-color",
-    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-offset",
-    shorthand: "ringOffset",
-    values: "spacing",
-    group: "Border"
-  }
-};
-var polyfill = {
-  appearance: {
-    className: "appearance",
-    group: "Visibility",
-    transform(value) {
-      return { appearance: value, WebkitAppearance: value };
-    }
-  },
-  backfaceVisibility: {
-    className: "backface",
-    group: "Visibility",
-    transform(value) {
-      return { backfaceVisibility: value, WebkitBackfaceVisibility: value };
-    }
-  },
-  clipPath: {
-    className: "clip-path",
-    group: "Other",
-    transform(value) {
-      return { clipPath: value, WebkitClipPath: value };
-    }
-  },
-  hyphens: {
-    className: "hyphens",
-    group: "Other",
-    transform(value) {
-      return { hyphens: value, WebkitHyphens: value };
-    }
-  },
-  mask: {
-    className: "mask",
-    group: "Other",
-    transform(value) {
-      return { mask: value, WebkitMask: value };
-    }
-  },
-  maskImage: {
-    className: "mask-image",
-    group: "Other",
-    transform(value) {
-      return { maskImage: value, WebkitMaskImage: value };
-    }
-  },
-  maskSize: {
-    className: "mask-size",
-    group: "Other",
-    transform(value) {
-      return { maskSize: value, WebkitMaskSize: value };
-    }
-  },
-  textSizeAdjust: {
-    className: "text-adjust",
-    group: "Typography",
-    transform(value) {
-      return { textSizeAdjust: value, WebkitTextSizeAdjust: value };
-    }
-  }
-};
-var widthValues = (theme2) => ({
-  auto: "auto",
-  ...theme2("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 = (theme2) => ({
-  auto: "auto",
-  ...theme2("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",
-    group: "Width",
-    values: widthValues
-  },
-  minWidth: {
-    shorthand: "minW",
-    className: "min-w",
-    group: "Width",
-    values: widthValues
-  },
-  minInlineSize: {
-    className: "min-w",
-    group: "Width",
-    values: widthValues
-  },
-  maxWidth: {
-    shorthand: "maxW",
-    className: "max-w",
-    group: "Width",
-    values: widthValues
-  },
-  maxInlineSize: {
-    className: "max-w",
-    group: "Width",
-    values: widthValues
-  },
-  height: {
-    shorthand: "h",
-    className: "h",
-    group: "Height",
-    values: heightValues
-  },
-  blockSize: {
-    className: "h",
-    group: "Height",
-    values: heightValues
-  },
-  minHeight: {
-    shorthand: "minH",
-    className: "min-h",
-    group: "Height",
-    values: heightValues
-  },
-  minBlockSize: {
-    className: "min-h",
-    group: "Height",
-    values: heightValues
-  },
-  maxHeight: {
-    shorthand: "maxH",
-    className: "max-h",
-    group: "Height",
-    values: heightValues
-  },
-  maxBlockSize: {
-    className: "max-b",
-    group: "Height",
-    values: heightValues
-  }
-};
-var marginValues = (theme2) => ({
-  auto: "auto",
-  ...theme2("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: "pb",
-    values: "spacing",
-    group: "Padding"
-  },
-  paddingBlockStart: {
-    className: "pt",
-    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: "mb",
-    values: marginValues,
-    group: "Margin"
-  },
-  marginBlockStart: {
-    className: "mt",
-    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: "space-x",
-    values: marginValues,
-    property: "marginInlineStart",
-    group: "Margin",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          marginInlineStart: value,
-          marginInlineEnd: "0px"
-        }
-      };
-    }
-  },
-  spaceY: {
-    className: "space-y",
-    values: marginValues,
-    property: "marginBlockStart",
-    group: "Margin",
-    transform(value) {
-      return {
-        "& > :not([hidden]) ~ :not([hidden])": {
-          marginTop: value,
-          marginBottom: "0px"
-        }
-      };
-    }
-  }
-};
-var svg = {
-  fill: {
-    className: "fill",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("fill")
-  },
-  stroke: {
-    className: "stroke",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("stroke")
-  },
-  strokeWidth: {
-    className: "stroke-w",
-    values: "borderWidths",
-    group: "Border"
-  }
-};
-var tables = {
-  borderCollapse: {
-    className: "border",
-    group: "Table"
-  },
-  borderSpacing: {
-    className: "border-spacing",
-    group: "Table",
-    values(theme2) {
-      return {
-        ...theme2("spacing"),
-        auto: "var(--border-spacing-x) var(--border-spacing-y)"
-      };
-    }
-  },
-  borderSpacingX: {
-    className: "border-spacing-x",
-    values: "spacing",
-    group: "Table",
-    transform(value) {
-      return {
-        "--border-spacing-x": value
-      };
-    }
-  },
-  borderSpacingY: {
-    className: "border-spacing-y",
-    values: "spacing",
-    group: "Table",
-    transform(value) {
-      return {
-        "--border-spacing-y": value
-      };
-    }
-  },
-  tableLayout: {
-    className: "table",
-    group: "Table"
-  }
-};
-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: "origin",
-    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(theme2) {
-      return {
-        ...theme2("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-x": value
-      };
-    }
-  },
-  translateY: {
-    shorthand: "y",
-    className: "translate-y",
-    group: "Transform",
-    values(theme2) {
-      return {
-        ...theme2("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-y": value
-      };
-    }
-  },
-  translateZ: {
-    shorthand: "z",
-    className: "translate-z",
-    group: "Transform",
-    values(theme2) {
-      return {
-        ...theme2("spacing"),
-        ...fractions
-      };
-    },
-    transform(value) {
-      return {
-        "--translate-z": value
-      };
-    }
-  }
-};
-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"
-  ),
-  background: createTransition("background, background-color"),
-  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 transitions = {
-  transitionTimingFunction: {
-    className: "ease",
-    values: "easings",
-    group: "Transition",
-    transform(value) {
-      return {
-        "--transition-easing": value,
-        transitionTimingFunction: value
-      };
-    }
-  },
-  transitionDelay: {
-    className: "delay",
-    values: "durations",
-    group: "Transition"
-  },
-  transitionDuration: {
-    className: "duration",
-    values: "durations",
-    group: "Transition",
-    transform(value) {
-      return {
-        "--transition-duration": value,
-        transitionDuration: value
-      };
-    }
-  },
-  transitionProperty: {
-    className: "transition-prop",
-    group: "Transition",
-    transform(value) {
-      return {
-        "--transition-prop": value,
-        transitionProperty: value
-      };
-    }
-  },
-  transition: {
-    className: "transition",
-    values: Object.keys(transitionMap),
-    group: "Transition",
-    transform(value) {
-      return transitionMap[value] ?? { transition: value };
-    }
-  },
-  animation: {
-    className: "animation",
-    values: "animations",
-    group: "Transition"
-  },
-  animationName: {
-    className: "animation-name",
-    values: "keyframes",
-    group: "Transition"
-  },
-  animationTimingFunction: {
-    className: "animation-ease",
-    values: "easings",
-    group: "Transition"
-  },
-  animationDuration: {
-    className: "animation-duration",
-    values: "durations",
-    group: "Transition"
-  },
-  animationDelay: {
-    className: "animation-delay",
-    values: "durations",
-    group: "Transition"
-  }
-};
-var typography = {
-  color: {
-    className: "text",
-    values: "colors",
-    group: "Color",
-    transform: createColorMixTransform("color")
-  },
-  fontFamily: {
-    className: "font",
-    values: "fonts",
-    group: "Typography"
-  },
-  fontSize: {
-    className: "fs",
-    values: "fontSizes",
-    group: "Typography"
-  },
-  fontWeight: {
-    className: "fw",
-    values: "fontWeights",
-    group: "Typography"
-  },
-  fontSmoothing: {
-    className: "smoothing",
-    group: "Typography",
-    values: {
-      antialiased: "antialiased",
-      "subpixel-antialiased": "auto"
-    },
-    transform(value) {
-      return {
-        WebkitFontSmoothing: value
-      };
-    }
-  },
-  fontVariantNumeric: {
-    className: "numeric",
-    group: "Typography"
-  },
-  letterSpacing: {
-    className: "tracking",
-    values: "letterSpacings",
-    group: "Typography"
-  },
-  lineHeight: {
-    className: "leading",
-    values: "lineHeights",
-    group: "Typography"
-  },
-  textAlign: {
-    className: "text-align",
-    group: "Typography"
-  },
-  textDecoration: {
-    className: "text-decor",
-    group: "Typography"
-  },
-  textDecorationColor: {
-    className: "text-decor-color",
-    values: "colors",
-    transform: createColorMixTransform("textDecorationColor"),
-    group: "Typography"
-  },
-  textEmphasisColor: {
-    className: "text-emphasis-color",
-    values: "colors",
-    transform: createColorMixTransform("textEmphasisColor"),
-    group: "Typography"
-  },
-  textDecorationStyle: {
-    className: "decoration-style",
-    group: "Typography"
-  },
-  textDecorationThickness: {
-    className: "decoration-thickness",
-    group: "Typography"
-  },
-  textUnderlineOffset: {
-    className: "underline-offset",
-    group: "Typography"
-  },
-  textTransform: {
-    className: "text-transform",
-    group: "Typography"
-  },
-  textIndent: {
-    className: "indent",
-    group: "Typography",
-    values: "spacing"
-  },
-  textShadow: {
-    className: "text-shadow",
-    values: "shadows",
-    group: "Typography"
-  },
-  textShadowColor: {
-    shorthand: "textShadowColor",
-    className: "text-shadow",
-    values: "colors",
-    transform: createColorMixTransform("--text-shadow-color"),
-    group: "Typography"
-  },
-  textOverflow: {
-    className: "text-overflow",
-    group: "Typography"
-  },
-  verticalAlign: {
-    className: "v-align",
-    group: "Typography"
-  },
-  wordBreak: {
-    className: "break",
-    group: "Typography"
-  },
-  textWrap: {
-    className: "text-wrap",
-    values: ["wrap", "balance", "nowrap"],
-    group: "Typography",
-    transform(value) {
-      return { textWrap: value };
-    }
-  },
-  truncate: {
-    className: "truncate",
-    values: { type: "boolean" },
-    group: "Typography",
-    transform(value) {
-      if (!value)
-        return {};
-      return {
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap"
-      };
-    }
-  },
-  lineClamp: {
-    className: "clamp",
-    group: "Typography",
-    transform(value) {
-      if (value === "none") {
-        return {
-          WebkitLineClamp: "unset"
-        };
-      }
-      return {
-        overflow: "hidden",
-        display: "-webkit-box",
-        WebkitLineClamp: value,
-        WebkitBoxOrient: "vertical"
-      };
-    }
-  }
-};
-var utilities = Object.assign(
-  {},
-  layout,
-  display,
-  flexGrid,
-  spacing,
-  outline,
-  divide,
-  sizing,
-  typography,
-  list,
-  background,
-  backgroundGradients,
-  border,
-  effects,
-  tables,
-  transitions,
-  transforms,
-  interactivity,
-  svg,
-  helpers,
-  polyfill,
-  container2
-);
-var definePreset = (preset22) => preset22;
-var preset = definePreset({
-  conditions,
-  utilities,
-  patterns,
-  // globalVars,
-  globalCss
-});
-var src_default = preset;
-
-// ../node_modules/.pnpm/@pandacss+preset-panda@0.40.1/node_modules/@pandacss/preset-panda/dist/index.mjs
-var breakpoints = {
-  sm: "640px",
-  md: "768px",
-  lg: "1024px",
-  xl: "1280px",
-  "2xl": "1536px"
-};
-var containerSizes = {
-  xs: "320px",
-  sm: "384px",
-  md: "448px",
-  lg: "512px",
-  xl: "576px",
-  "2xl": "672px",
-  "3xl": "768px",
-  "4xl": "896px",
-  "5xl": "1024px",
-  "6xl": "1152px",
-  "7xl": "1280px",
-  "8xl": "1440px"
-};
-var keyframes = {
-  spin: {
-    to: {
-      transform: "rotate(360deg)"
-    }
-  },
-  ping: {
-    "75%, 100%": {
-      transform: "scale(2)",
-      opacity: "0"
-    }
-  },
-  pulse: {
-    "50%": {
-      opacity: ".5"
-    }
-  },
-  bounce: {
-    "0%, 100%": {
-      transform: "translateY(-25%)",
-      animationTimingFunction: "cubic-bezier(0.8,0,1,1)"
-    },
-    "50%": {
-      transform: "none",
-      animationTimingFunction: "cubic-bezier(0,0,0.2,1)"
-    }
-  }
-};
-var animations = {
-  spin: { value: "spin 1s linear infinite" },
-  ping: { value: "ping 1s cubic-bezier(0, 0, 0.2, 1) infinite" },
-  pulse: { value: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite" },
-  bounce: { value: "bounce 1s infinite" }
-};
-var aspectRatios = {
-  square: { value: "1 / 1" },
-  landscape: { value: "4 / 3" },
-  portrait: { value: "3 / 4" },
-  wide: { value: "16 / 9" },
-  ultrawide: { value: "18 / 5" },
-  golden: { value: "1.618 / 1" }
-};
-var borders = {
-  none: { value: "none" }
-};
-var colors = {
-  current: { value: "currentColor" },
-  black: { value: "#000" },
-  white: { value: "#fff" },
-  transparent: { value: "rgb(0 0 0 / 0)" },
-  rose: {
-    50: { value: "#fff1f2" },
-    100: { value: "#ffe4e6" },
-    200: { value: "#fecdd3" },
-    300: { value: "#fda4af" },
-    400: { value: "#fb7185" },
-    500: { value: "#f43f5e" },
-    600: { value: "#e11d48" },
-    700: { value: "#be123c" },
-    800: { value: "#9f1239" },
-    900: { value: "#881337" },
-    950: { value: "#4c0519" }
-  },
-  pink: {
-    50: { value: "#fdf2f8" },
-    100: { value: "#fce7f3" },
-    200: { value: "#fbcfe8" },
-    300: { value: "#f9a8d4" },
-    400: { value: "#f472b6" },
-    500: { value: "#ec4899" },
-    600: { value: "#db2777" },
-    700: { value: "#be185d" },
-    800: { value: "#9d174d" },
-    900: { value: "#831843" },
-    950: { value: "#500724" }
-  },
-  fuchsia: {
-    50: { value: "#fdf4ff" },
-    100: { value: "#fae8ff" },
-    200: { value: "#f5d0fe" },
-    300: { value: "#f0abfc" },
-    400: { value: "#e879f9" },
-    500: { value: "#d946ef" },
-    600: { value: "#c026d3" },
-    700: { value: "#a21caf" },
-    800: { value: "#86198f" },
-    900: { value: "#701a75" },
-    950: { value: "#4a044e" }
-  },
-  purple: {
-    50: { value: "#faf5ff" },
-    100: { value: "#f3e8ff" },
-    200: { value: "#e9d5ff" },
-    300: { value: "#d8b4fe" },
-    400: { value: "#c084fc" },
-    500: { value: "#a855f7" },
-    600: { value: "#9333ea" },
-    700: { value: "#7e22ce" },
-    800: { value: "#6b21a8" },
-    900: { value: "#581c87" },
-    950: { value: "#3b0764" }
-  },
-  violet: {
-    50: { value: "#f5f3ff" },
-    100: { value: "#ede9fe" },
-    200: { value: "#ddd6fe" },
-    300: { value: "#c4b5fd" },
-    400: { value: "#a78bfa" },
-    500: { value: "#8b5cf6" },
-    600: { value: "#7c3aed" },
-    700: { value: "#6d28d9" },
-    800: { value: "#5b21b6" },
-    900: { value: "#4c1d95" },
-    950: { value: "#2e1065" }
-  },
-  indigo: {
-    50: { value: "#eef2ff" },
-    100: { value: "#e0e7ff" },
-    200: { value: "#c7d2fe" },
-    300: { value: "#a5b4fc" },
-    400: { value: "#818cf8" },
-    500: { value: "#6366f1" },
-    600: { value: "#4f46e5" },
-    700: { value: "#4338ca" },
-    800: { value: "#3730a3" },
-    900: { value: "#312e81" },
-    950: { value: "#1e1b4b" }
-  },
-  blue: {
-    50: { value: "#eff6ff" },
-    100: { value: "#dbeafe" },
-    200: { value: "#bfdbfe" },
-    300: { value: "#93c5fd" },
-    400: { value: "#60a5fa" },
-    500: { value: "#3b82f6" },
-    600: { value: "#2563eb" },
-    700: { value: "#1d4ed8" },
-    800: { value: "#1e40af" },
-    900: { value: "#1e3a8a" },
-    950: { value: "#172554" }
-  },
-  sky: {
-    50: { value: "#f0f9ff" },
-    100: { value: "#e0f2fe" },
-    200: { value: "#bae6fd" },
-    300: { value: "#7dd3fc" },
-    400: { value: "#38bdf8" },
-    500: { value: "#0ea5e9" },
-    600: { value: "#0284c7" },
-    700: { value: "#0369a1" },
-    800: { value: "#075985" },
-    900: { value: "#0c4a6e" },
-    950: { value: "#082f49" }
-  },
-  cyan: {
-    50: { value: "#ecfeff" },
-    100: { value: "#cffafe" },
-    200: { value: "#a5f3fc" },
-    300: { value: "#67e8f9" },
-    400: { value: "#22d3ee" },
-    500: { value: "#06b6d4" },
-    600: { value: "#0891b2" },
-    700: { value: "#0e7490" },
-    800: { value: "#155e75" },
-    900: { value: "#164e63" },
-    950: { value: "#083344" }
-  },
-  teal: {
-    50: { value: "#f0fdfa" },
-    100: { value: "#ccfbf1" },
-    200: { value: "#99f6e4" },
-    300: { value: "#5eead4" },
-    400: { value: "#2dd4bf" },
-    500: { value: "#14b8a6" },
-    600: { value: "#0d9488" },
-    700: { value: "#0f766e" },
-    800: { value: "#115e59" },
-    900: { value: "#134e4a" },
-    950: { value: "#042f2e" }
-  },
-  emerald: {
-    50: { value: "#ecfdf5" },
-    100: { value: "#d1fae5" },
-    200: { value: "#a7f3d0" },
-    300: { value: "#6ee7b7" },
-    400: { value: "#34d399" },
-    500: { value: "#10b981" },
-    600: { value: "#059669" },
-    700: { value: "#047857" },
-    800: { value: "#065f46" },
-    900: { value: "#064e3b" },
-    950: { value: "#022c22" }
-  },
-  green: {
-    50: { value: "#f0fdf4" },
-    100: { value: "#dcfce7" },
-    200: { value: "#bbf7d0" },
-    300: { value: "#86efac" },
-    400: { value: "#4ade80" },
-    500: { value: "#22c55e" },
-    600: { value: "#16a34a" },
-    700: { value: "#15803d" },
-    800: { value: "#166534" },
-    900: { value: "#14532d" },
-    950: { value: "#052e16" }
-  },
-  lime: {
-    50: { value: "#f7fee7" },
-    100: { value: "#ecfccb" },
-    200: { value: "#d9f99d" },
-    300: { value: "#bef264" },
-    400: { value: "#a3e635" },
-    500: { value: "#84cc16" },
-    600: { value: "#65a30d" },
-    700: { value: "#4d7c0f" },
-    800: { value: "#3f6212" },
-    900: { value: "#365314" },
-    950: { value: "#1a2e05" }
-  },
-  yellow: {
-    50: { value: "#fefce8" },
-    100: { value: "#fef9c3" },
-    200: { value: "#fef08a" },
-    300: { value: "#fde047" },
-    400: { value: "#facc15" },
-    500: { value: "#eab308" },
-    600: { value: "#ca8a04" },
-    700: { value: "#a16207" },
-    800: { value: "#854d0e" },
-    900: { value: "#713f12" },
-    950: { value: "#422006" }
-  },
-  amber: {
-    50: { value: "#fffbeb" },
-    100: { value: "#fef3c7" },
-    200: { value: "#fde68a" },
-    300: { value: "#fcd34d" },
-    400: { value: "#fbbf24" },
-    500: { value: "#f59e0b" },
-    600: { value: "#d97706" },
-    700: { value: "#b45309" },
-    800: { value: "#92400e" },
-    900: { value: "#78350f" },
-    950: { value: "#451a03" }
-  },
-  orange: {
-    50: { value: "#fff7ed" },
-    100: { value: "#ffedd5" },
-    200: { value: "#fed7aa" },
-    300: { value: "#fdba74" },
-    400: { value: "#fb923c" },
-    500: { value: "#f97316" },
-    600: { value: "#ea580c" },
-    700: { value: "#c2410c" },
-    800: { value: "#9a3412" },
-    900: { value: "#7c2d12" },
-    950: { value: "#431407" }
-  },
-  red: {
-    50: { value: "#fef2f2" },
-    100: { value: "#fee2e2" },
-    200: { value: "#fecaca" },
-    300: { value: "#fca5a5" },
-    400: { value: "#f87171" },
-    500: { value: "#ef4444" },
-    600: { value: "#dc2626" },
-    700: { value: "#b91c1c" },
-    800: { value: "#991b1b" },
-    900: { value: "#7f1d1d" },
-    950: { value: "#450a0a" }
-  },
-  neutral: {
-    50: { value: "#fafafa" },
-    100: { value: "#f5f5f5" },
-    200: { value: "#e5e5e5" },
-    300: { value: "#d4d4d4" },
-    400: { value: "#a3a3a3" },
-    500: { value: "#737373" },
-    600: { value: "#525252" },
-    700: { value: "#404040" },
-    800: { value: "#262626" },
-    900: { value: "#171717" },
-    950: { value: "#0a0a0a" }
-  },
-  stone: {
-    50: { value: "#fafaf9" },
-    100: { value: "#f5f5f4" },
-    200: { value: "#e7e5e4" },
-    300: { value: "#d6d3d1" },
-    400: { value: "#a8a29e" },
-    500: { value: "#78716c" },
-    600: { value: "#57534e" },
-    700: { value: "#44403c" },
-    800: { value: "#292524" },
-    900: { value: "#1c1917" },
-    950: { value: "#0c0a09" }
-  },
-  zinc: {
-    50: { value: "#fafafa" },
-    100: { value: "#f4f4f5" },
-    200: { value: "#e4e4e7" },
-    300: { value: "#d4d4d8" },
-    400: { value: "#a1a1aa" },
-    500: { value: "#71717a" },
-    600: { value: "#52525b" },
-    700: { value: "#3f3f46" },
-    800: { value: "#27272a" },
-    900: { value: "#18181b" },
-    950: { value: "#09090b" }
-  },
-  gray: {
-    50: { value: "#f9fafb" },
-    100: { value: "#f3f4f6" },
-    200: { value: "#e5e7eb" },
-    300: { value: "#d1d5db" },
-    400: { value: "#9ca3af" },
-    500: { value: "#6b7280" },
-    600: { value: "#4b5563" },
-    700: { value: "#374151" },
-    800: { value: "#1f2937" },
-    900: { value: "#111827" },
-    950: { value: "#030712" }
-  },
-  slate: {
-    50: { value: "#f8fafc" },
-    100: { value: "#f1f5f9" },
-    200: { value: "#e2e8f0" },
-    300: { value: "#cbd5e1" },
-    400: { value: "#94a3b8" },
-    500: { value: "#64748b" },
-    600: { value: "#475569" },
-    700: { value: "#334155" },
-    800: { value: "#1e293b" },
-    900: { value: "#0f172a" },
-    950: { value: "#020617" }
-  }
-};
-var shadows = {
-  xs: { value: "0 1px 2px 0 rgb(0 0 0 / 0.05)" },
-  sm: { value: ["0 1px 3px 0 rgb(0 0 0 / 0.1)", "0 1px 2px -1px rgb(0 0 0 / 0.1)"] },
-  md: { value: ["0 4px 6px -1px rgb(0 0 0 / 0.1)", "0 2px 4px -2px rgb(0 0 0 / 0.1)"] },
-  lg: { value: ["0 10px 15px -3px rgb(0 0 0 / 0.1)", "0 4px 6px -4px rgb(0 0 0 / 0.1)"] },
-  xl: { value: ["0 20px 25px -5px rgb(0 0 0 / 0.1)", "0 8px 10px -6px rgb(0 0 0 / 0.1)"] },
-  "2xl": { value: "0 25px 50px -12px rgb(0 0 0 / 0.25)" },
-  inner: { value: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)" }
-};
-var spacing2 = {
-  0: { value: "0rem" },
-  0.5: { value: "0.125rem" },
-  1: { value: "0.25rem" },
-  1.5: { value: "0.375rem" },
-  2: { value: "0.5rem" },
-  2.5: { value: "0.625rem" },
-  3: { value: "0.75rem" },
-  3.5: { value: "0.875rem" },
-  4: { value: "1rem" },
-  5: { value: "1.25rem" },
-  6: { value: "1.5rem" },
-  7: { value: "1.75rem" },
-  8: { value: "2rem" },
-  9: { value: "2.25rem" },
-  10: { value: "2.5rem" },
-  11: { value: "2.75rem" },
-  12: { value: "3rem" },
-  14: { value: "3.5rem" },
-  16: { value: "4rem" },
-  20: { value: "5rem" },
-  24: { value: "6rem" },
-  28: { value: "7rem" },
-  32: { value: "8rem" },
-  36: { value: "9rem" },
-  40: { value: "10rem" },
-  44: { value: "11rem" },
-  48: { value: "12rem" },
-  52: { value: "13rem" },
-  56: { value: "14rem" },
-  60: { value: "15rem" },
-  64: { value: "16rem" },
-  72: { value: "18rem" },
-  80: { value: "20rem" },
-  96: { value: "24rem" }
-};
-var largeSizes = {
-  xs: { value: "20rem" },
-  sm: { value: "24rem" },
-  md: { value: "28rem" },
-  lg: { value: "32rem" },
-  xl: { value: "36rem" },
-  "2xl": { value: "42rem" },
-  "3xl": { value: "48rem" },
-  "4xl": { value: "56rem" },
-  "5xl": { value: "64rem" },
-  "6xl": { value: "72rem" },
-  "7xl": { value: "80rem" },
-  "8xl": { value: "90rem" },
-  prose: { value: "65ch" }
-};
-var sizes = {
-  ...spacing2,
-  ...largeSizes,
-  full: { value: "100%" },
-  min: { value: "min-content" },
-  max: { value: "max-content" },
-  fit: { value: "fit-content" }
-};
-var fontSizes = {
-  "2xs": { value: "0.5rem" },
-  xs: { value: "0.75rem" },
-  sm: { value: "0.875rem" },
-  md: { value: "1rem" },
-  lg: { value: "1.125rem" },
-  xl: { value: "1.25rem" },
-  "2xl": { value: "1.5rem" },
-  "3xl": { value: "1.875rem" },
-  "4xl": { value: "2.25rem" },
-  "5xl": { value: "3rem" },
-  "6xl": { value: "3.75rem" },
-  "7xl": { value: "4.5rem" },
-  "8xl": { value: "6rem" },
-  "9xl": { value: "8rem" }
-};
-var fontWeights = {
-  thin: { value: "100" },
-  extralight: { value: "200" },
-  light: { value: "300" },
-  normal: { value: "400" },
-  medium: { value: "500" },
-  semibold: { value: "600" },
-  bold: { value: "700" },
-  extrabold: { value: "800" },
-  black: { value: "900" }
-};
-var letterSpacings = {
-  tighter: { value: "-0.05em" },
-  tight: { value: "-0.025em" },
-  normal: { value: "0em" },
-  wide: { value: "0.025em" },
-  wider: { value: "0.05em" },
-  widest: { value: "0.1em" }
-};
-var lineHeights = {
-  none: { value: "1" },
-  tight: { value: "1.25" },
-  snug: { value: "1.375" },
-  normal: { value: "1.5" },
-  relaxed: { value: "1.625" },
-  loose: { value: "2" }
-};
-var fonts = {
-  sans: {
-    value: [
-      "ui-sans-serif",
-      "system-ui",
-      "-apple-system",
-      "BlinkMacSystemFont",
-      '"Segoe UI"',
-      "Roboto",
-      '"Helvetica Neue"',
-      "Arial",
-      '"Noto Sans"',
-      "sans-serif",
-      '"Apple Color Emoji"',
-      '"Segoe UI Emoji"',
-      '"Segoe UI Symbol"',
-      '"Noto Color Emoji"'
-    ]
-  },
-  serif: {
-    value: ["ui-serif", "Georgia", "Cambria", '"Times New Roman"', "Times", "serif"]
-  },
-  mono: {
-    value: [
-      "ui-monospace",
-      "SFMono-Regular",
-      "Menlo",
-      "Monaco",
-      "Consolas",
-      '"Liberation Mono"',
-      '"Courier New"',
-      "monospace"
-    ]
-  }
-};
-var textStyles = {
-  xs: {
-    value: {
-      fontSize: "0.75rem",
-      lineHeight: "1rem"
-    }
-  },
-  sm: {
-    value: {
-      fontSize: "0.875rem",
-      lineHeight: "1.25rem"
-    }
-  },
-  md: {
-    value: {
-      fontSize: "1rem",
-      lineHeight: "1.5rem"
-    }
-  },
-  lg: {
-    value: {
-      fontSize: "1.125rem",
-      lineHeight: "1.75rem"
-    }
-  },
-  xl: {
-    value: {
-      fontSize: "1.25rem",
-      lineHeight: "1.75rem"
-    }
-  },
-  "2xl": {
-    value: {
-      fontSize: "1.5rem",
-      lineHeight: "2rem"
-    }
-  },
-  "3xl": {
-    value: {
-      fontSize: "1.875rem",
-      lineHeight: "2.25rem"
-    }
-  },
-  "4xl": {
-    value: {
-      fontSize: "2.25rem",
-      lineHeight: "2.5rem"
-    }
-  },
-  "5xl": {
-    value: {
-      fontSize: "3rem",
-      lineHeight: "1"
-    }
-  },
-  "6xl": {
-    value: {
-      fontSize: "3.75rem",
-      lineHeight: "1"
-    }
-  },
-  "7xl": {
-    value: {
-      fontSize: "4.5rem",
-      lineHeight: "1"
-    }
-  },
-  "8xl": {
-    value: {
-      fontSize: "6rem",
-      lineHeight: "1"
-    }
-  },
-  "9xl": {
-    value: {
-      fontSize: "8rem",
-      lineHeight: "1"
-    }
-  }
-};
-var defineTokens = (v) => v;
-var tokens = defineTokens({
-  aspectRatios,
-  borders,
-  easings: {
-    default: { value: "cubic-bezier(0.4, 0, 0.2, 1)" },
-    linear: { value: "linear" },
-    in: { value: "cubic-bezier(0.4, 0, 1, 1)" },
-    out: { value: "cubic-bezier(0, 0, 0.2, 1)" },
-    "in-out": { value: "cubic-bezier(0.4, 0, 0.2, 1)" }
-  },
-  durations: {
-    fastest: { value: "50ms" },
-    faster: { value: "100ms" },
-    fast: { value: "150ms" },
-    normal: { value: "200ms" },
-    slow: { value: "300ms" },
-    slower: { value: "400ms" },
-    slowest: { value: "500ms" }
-  },
-  radii: {
-    xs: { value: "0.125rem" },
-    sm: { value: "0.25rem" },
-    md: { value: "0.375rem" },
-    lg: { value: "0.5rem" },
-    xl: { value: "0.75rem" },
-    "2xl": { value: "1rem" },
-    "3xl": { value: "1.5rem" },
-    full: { value: "9999px" }
-  },
-  fontWeights,
-  lineHeights,
-  fonts,
-  letterSpacings,
-  fontSizes,
-  shadows,
-  colors,
-  blurs: {
-    sm: { value: "4px" },
-    base: { value: "8px" },
-    md: { value: "12px" },
-    lg: { value: "16px" },
-    xl: { value: "24px" },
-    "2xl": { value: "40px" },
-    "3xl": { value: "64px" }
-  },
-  spacing: spacing2,
-  sizes,
-  animations
-});
-var definePreset2 = (config2) => config2;
-var preset2 = definePreset2({
-  theme: {
-    keyframes,
-    breakpoints,
-    tokens,
-    textStyles,
-    containerSizes
-  }
-});
-var src_default2 = preset2;
-
-// ../fixture/src/recipes.ts
-var recipes = {
-  textStyle: {
-    className: "textStyle",
-    base: {
-      fontFamily: "mono",
-      divideX: "20px"
-    },
-    variants: {
-      size: {
-        h1: {
-          fontSize: "5rem",
-          lineHeight: "1em",
-          fontWeight: 800
-        },
-        h2: {
-          fontSize: "3rem",
-          lineHeight: "1.2em",
-          fontWeight: 700,
-          letterSpacing: "-0.03em"
-        }
-      }
-    }
-  },
-  tooltipStyle: {
-    className: "tooltipStyle",
-    base: {
-      "&[data-tooltip], & [data-tooltip]": {
-        color: { _dark: "red" }
-      }
-    }
-  },
-  cardStyle: {
-    className: "card",
-    variants: {
-      rounded: {
-        true: {
-          borderRadius: "0.375rem"
-        }
-      }
-    }
-  },
-  buttonStyle: {
-    className: "buttonStyle",
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      justifyContent: "center",
-      _hover: {
-        backgroundColor: "red.200",
-        fontSize: "3xl",
-        color: "white"
-      }
-    },
-    variants: {
-      size: {
-        sm: {
-          height: "2.5rem",
-          minWidth: "2.5rem",
-          padding: "0 0.5rem"
-        },
-        md: {
-          height: "3rem",
-          minWidth: "3rem",
-          padding: "0 0.75rem"
-        }
-      },
-      variant: {
-        solid: {
-          backgroundColor: "blue",
-          color: "white",
-          _hover: {
-            backgroundColor: "darkblue"
-          },
-          "&[data-disabled]": {
-            backgroundColor: "gray",
-            color: "black",
-            fontSize: "2xl"
-          }
-        },
-        outline: {
-          backgroundColor: "transparent",
-          border: "1px solid blue",
-          color: "blue",
-          _hover: {
-            backgroundColor: "blue",
-            color: "white"
-          },
-          "&[data-disabled]": {
-            backgroundColor: "transparent",
-            border: "1px solid gray",
-            color: "gray"
-          }
-        }
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      variant: "solid"
-    }
-  }
-};
-
-// ../fixture/src/slot-recipes.ts
-var slotRecipes = {
-  checkbox: {
-    className: "checkbox",
-    slots: ["root", "control", "label"],
-    base: {
-      root: { display: "flex", alignItems: "center", gap: "2" },
-      control: { borderWidth: "1px", borderRadius: "sm" },
-      label: { marginStart: "2" }
-    },
-    variants: {
-      size: {
-        sm: {
-          control: { textStyle: "headline.h1", width: "8", height: "8" },
-          label: { fontSize: "sm" }
-        },
-        md: {
-          control: { width: "10", height: "10" },
-          label: { fontSize: "md" }
-        },
-        lg: {
-          control: { width: "12", height: "12" },
-          label: { fontSize: "lg" }
-        }
-      }
-    },
-    defaultVariants: {
-      size: "sm"
-    }
-  },
-  badge: {
-    className: "badge",
-    slots: ["title", "body"],
-    base: {
-      title: { bg: "red.300", rounded: "sm" }
-    },
-    variants: {
-      size: {
-        sm: {
-          title: { px: "4" },
-          body: { color: "red" }
-        }
-      },
-      raised: {
-        true: {
-          title: { shadow: "md" }
-        }
-      }
-    },
-    compoundVariants: [
-      {
-        raised: true,
-        size: "sm",
-        css: {
-          title: { color: "ButtonHighlight" }
-        }
-      }
-    ]
-  }
-};
-
-// ../fixture/src/semantic-tokens.ts
-var semanticTokens = {
-  colors: {
-    primary: { value: { base: "{colors.red.500}", _dark: "{colors.red.400}" } },
-    secondary: { value: { base: "{colors.red.800}", _dark: "{colors.red.700}" } },
-    complex: { value: { base: "{colors.red.800}", _dark: { _highContrast: "{colors.red.700}" } } },
-    surface: {
-      value: {
-        _materialTheme: { base: "#m-b", _dark: "#m-d" },
-        _pastelTheme: { base: "#p-b", _dark: { md: "#p-d" } }
-      }
-    },
-    button: {
-      thick: {
-        value: { base: "#fff", _dark: "#000" }
-      },
-      card: {
-        body: {
-          value: { base: "#fff", _dark: "#000" }
-        },
-        heading: {
-          value: { base: "#fff", _dark: "#000" }
-        }
-      }
-    }
-  },
-  spacing: {
-    gutter: { value: { base: "{spacing.4}", lg: "{spacing.5}" } }
-  }
-};
-
-// ../fixture/src/config.ts
-var conditions2 = {
-  ...src_default.conditions,
-  materialTheme: "[data-color=material] &",
-  pastelTheme: "[data-color=pastel] &",
-  dark: "[data-theme=dark] &, .dark &, &.dark, &[data-theme=dark]",
-  light: "[data-theme=light] &, .light &, &.light, &[data-theme=light]"
-};
-var theme = src_default2.theme;
-var tokens2 = {
-  ...theme.tokens,
-  colors: {
-    ...theme.tokens?.colors,
-    deep: {
-      test: {
-        yam: {
-          value: "%555"
-        },
-        pool: {
-          poller: {
-            value: "#fff"
-          },
-          tall: {
-            value: "$dfdf"
-          }
-        }
-      }
-    }
-  }
-};
-var textStyles2 = {
-  headline: {
-    h1: {
-      value: {
-        fontSize: "2rem",
-        fontWeight: "bold"
-      }
-    },
-    h2: {
-      value: {
-        fontSize: { base: "1.5rem", lg: "2rem" },
-        fontWeight: "bold"
-      }
-    }
-  }
-};
-var fixturePreset = {
-  ...src_default,
-  conditions: conditions2,
-  theme: {
-    ...theme,
-    textStyles: textStyles2,
-    tokens: tokens2,
-    semanticTokens,
-    recipes,
-    slotRecipes
-  }
-};
-
-// ../fixture/src/create-context.ts
-var import_config = require("@pandacss/config");
-var import_generator = require("@pandacss/generator");
-var import_shared2 = require("@pandacss/shared");
-
-// ../node_modules/.pnpm/@pandacss+dev@1.8.2_typescript@5.7.3/node_modules/@pandacss/dev/dist/index.mjs
-var import_shared = require("@pandacss/shared");
-function defineConfig(config2) {
-  return Object.assign(config2, { name: "__panda.config__" });
-}
-
-// ../sandbox/v9/panda.config.ts
-var panda_config_default = defineConfig({
-  preflight: true,
-  include: ["./src/**/*.{tsx,jsx}", "./pages/**/*.{jsx,tsx}"],
-  exclude: [],
-  outdir: "styled-system",
-  jsxFactory: "panda",
-  jsxFramework: "react",
-  theme: {
-    extend: {
-      tokens: {
-        colors: {
-          red: {
-            400: {
-              value: "#ff0000",
-              description: "red color",
-              deprecated: true
-            }
-          }
-        }
-      },
-      semanticTokens: {
-        colors: {
-          text: { value: { base: "{colors.gray.600}", _osDark: "{colors.gray.400}" } },
-          bg: { value: { base: "{colors.gray.600}", _osDark: "{colors.gray.400}" } }
-        }
-      },
-      recipes: {
-        button: {
-          className: "button",
-          jsx: ["Button", "ListedButton", /WithRegex$/, "PrimaryButtonLike"],
-          description: "A button styles",
-          base: {
-            fontSize: "lg"
-          },
-          variants: {
-            size: {
-              sm: {
-                padding: "2",
-                borderRadius: "sm"
-              },
-              md: {
-                padding: "4",
-                borderRadius: "md"
-              }
-            },
-            variant: {
-              primary: {
-                color: "white",
-                backgroundColor: "blue.500"
-              },
-              danger: {
-                color: "white",
-                backgroundColor: "red.500"
-              },
-              secondary: {
-                color: "pink.300",
-                backgroundColor: "green.500"
-              },
-              purple: {
-                color: "amber.300",
-                backgroundColor: "purple.500"
-              }
-            },
-            state: {
-              focused: {
-                color: "green"
-              },
-              hovered: {
-                color: "pink.400"
-              }
-            },
-            rounded: {
-              true: {
-                borderRadius: "md"
-              }
-            }
-          },
-          compoundVariants: [
-            {
-              size: "sm",
-              variant: "primary",
-              css: {
-                fontSize: "12px"
-              }
-            },
-            {
-              variant: ["primary", "danger"],
-              state: "focused",
-              css: {
-                padding: 4,
-                fontWeight: "bold",
-                fontSize: "24px"
-              }
-            }
-          ]
-        }
-      }
-    }
-  },
-  globalCss: {
-    "*": {
-      fontFamily: "Inter",
-      margin: "0"
-    },
-    a: {
-      color: "inherit",
-      textDecoration: "none"
-    }
-  }
-});
-
-// ../fixture/src/create-context.ts
-var config = {
-  ...fixturePreset,
-  optimize: true,
-  cwd: "",
-  outdir: "styled-system",
-  include: [],
-  //
-  cssVarRoot: ":where(html)",
-  jsxFramework: "react"
-};
-var fixtureDefaults = {
-  dependencies: [],
-  config,
-  path: "",
-  hooks: {},
-  serialized: (0, import_shared2.stringifyJson)(config),
-  deserialize: () => (0, import_shared2.parseJson)((0, import_shared2.stringifyJson)(config))
-};
-var createGeneratorContext = (userConfig) => {
-  const resolvedConfig = userConfig ? (0, import_config.mergeConfigs)([fixtureDefaults.config, userConfig]) : fixtureDefaults.config;
-  return new import_generator.Generator({ ...fixtureDefaults, config: resolvedConfig });
-};
-
-// src/utils/worker.ts
-var import_ts_path = require("@pandacss/config/ts-path");
-var import_config3 = require("@pandacss/config");
-var import_path = __toESM(require("path"));
-var import_micromatch = __toESM(require("micromatch"));
-var contextCache = {};
-async function _getContext(configPath) {
-  if (!configPath) throw new Error("Invalid config path");
-  const cwd = import_path.default.dirname(configPath);
-  const conf = await (0, import_config3.loadConfig)({ file: configPath, cwd });
-  const ctx = new import_generator2.Generator(conf);
-  return ctx;
-}
-async function getContext(opts) {
-  if (process.env.NODE_ENV === "test") {
-    const ctx = createGeneratorContext({
-      ...panda_config_default,
-      include: ["**/*"],
-      exclude: ["**/Invalid.tsx", "**/panda.config.ts"],
-      importMap: "./panda",
-      jsxFactory: "styled"
-    });
-    return ctx;
-  } else {
-    const configPath = (0, import_config3.findConfig)({ cwd: opts.configPath ?? opts.currentFile });
-    if (!contextCache[configPath]) {
-      contextCache[configPath] = _getContext(configPath);
-    }
-    return contextCache[configPath];
-  }
-}
-async function filterInvalidTokens(ctx, paths) {
-  const invalid = paths.filter((path2) => !ctx.utility.tokens.view.get(path2));
-  if (invalid.length > 0) {
-    console.error("filterInvalidTokens", { paths, invalid });
-  }
-  return invalid;
-}
-async function filterDeprecatedTokens(ctx, tokens3) {
-  return tokens3.filter((token) => {
-    const value = typeof token === "string" ? token : token.category + "." + token.value;
-    return ctx.utility.tokens.isDeprecated(value);
-  });
-}
-async function isColorToken(ctx, value) {
-  return !!ctx.utility.tokens.view.categoryMap.get("colors")?.get(value);
-}
-async function getPropCategory(ctx, _attr) {
-  const longhand = await resolveLongHand(ctx, _attr);
-  const attr = longhand || _attr;
-  const attrConfig = ctx.utility.config[attr];
-  return typeof attrConfig?.values === "string" ? attrConfig.values : void 0;
-}
-async function isColorAttribute(ctx, _attr) {
-  const category = await getPropCategory(ctx, _attr);
-  return category === "colors";
-}
-async function isValidFile(ctx, fileName) {
-  const { include, exclude } = ctx.config;
-  const cwd = ctx.config.cwd || process.cwd();
-  const relativePath = import_path.default.isAbsolute(fileName) ? import_path.default.relative(cwd, fileName) : fileName;
-  return import_micromatch.default.isMatch(relativePath, include, { ignore: exclude, dot: true });
-}
-async function resolveShorthands(ctx, name) {
-  return ctx.utility.getPropShorthandsMap().get(name);
-}
-var reverseLonghandCache = /* @__PURE__ */ new WeakMap();
-async function resolveLongHand(ctx, name) {
-  let reverseMap = reverseLonghandCache.get(ctx);
-  if (!reverseMap) {
-    reverseMap = /* @__PURE__ */ new Map();
-    for (const [key, values] of ctx.utility.getPropShorthandsMap()) {
-      for (const value of values) {
-        reverseMap.set(value, key);
-      }
-    }
-    reverseLonghandCache.set(ctx, reverseMap);
-  }
-  return reverseMap.get(name);
-}
-async function isValidProperty(ctx, name, patternName) {
-  const isValid = ctx.isValidProperty(name);
-  if (isValid) return true;
-  if (!patternName) return false;
-  if (patternName === ctx.config.jsxFactory) {
-    return false;
-  }
-  const pattern = ctx.patterns.details.find((p) => p.baseName === patternName || p.jsx.includes(patternName))?.config.properties;
-  if (!pattern) return false;
-  return Object.keys(pattern).includes(name);
-}
-async function matchFile(ctx, name, imports) {
-  const file = ctx.imports.file(imports);
-  return file.match(name);
-}
-async function matchImports(ctx, result) {
-  const isMatch = ctx.imports.match(result, (mod) => {
-    const { tsOptions } = ctx.parserOptions;
-    if (!tsOptions?.pathMappings) return;
-    return (0, import_ts_path.resolveTsPathPattern)(tsOptions.pathMappings, mod);
-  });
-  return isMatch;
-}
-async function getJsxFactory(ctx) {
-  return ctx.config.jsxFactory;
-}
-async function runAsync(action, opts, ...args) {
-  const ctx = await getContext(opts);
-  switch (action) {
-    case "matchImports":
-      return matchImports(ctx, ...args);
-    case "matchFile":
-      return matchFile(ctx, ...args);
-    case "isValidProperty":
-      return isValidProperty(ctx, ...args);
-    case "resolveLongHand":
-      return resolveLongHand(ctx, ...args);
-    case "resolveShorthands":
-      return resolveShorthands(ctx, ...args);
-    case "isValidFile":
-      return isValidFile(ctx, opts.currentFile);
-    case "isColorAttribute":
-      return isColorAttribute(ctx, ...args);
-    case "isColorToken":
-      return isColorToken(ctx, ...args);
-    case "filterInvalidTokens":
-      return filterInvalidTokens(ctx, ...args);
-    case "getPropCategory":
-      return getPropCategory(ctx, ...args);
-    case "getJsxFactory":
-      return getJsxFactory(ctx);
-    case "filterDeprecatedTokens":
-      return filterDeprecatedTokens(ctx, ...args);
-  }
-}
-function run(action, opts, ...args) {
-  return runAsync(action, opts, ...args);
-}
-(0, import_synckit.runAsWorker)(run);
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  getContext,
-  run,
-  runAsync
-});