.hyperspace-light {
  --sw-btn-tertiary-text: #1250DE;
  --sw-btn-tertiary-hover: #e6f3ff;
  --sw-btn-tertiary-active: #d3e8ff;
  --sw-ai-border-01-gradient: linear-gradient(#FFFFFF, #FFFFFF) padding-box, linear-gradient(to right, #FFF4DF 0%, #E9FDE6 49%, #E2FBFF 100%) border-box;
  --sw-ai-border-gradient: linear-gradient(#FFFFFF, #FFFFFF) padding-box, linear-gradient(to right, #FFC005 2%, #FFE94F 12%, #8DE76E 21%, #3BE5FF 50%, #44BFFF 85%) border-box;
}
.hyperspace-dark {
  --sw-btn-tertiary-text: #3188FF;
  --sw-btn-tertiary-hover: #061f56;
  --sw-btn-tertiary-active: #0E3386;
  --sw-ai-border-01-gradient: linear-gradient(#1C1C1F, #1C1C1F) padding-box, linear-gradient(to right, #493B21 0%, #2C462B 49%, #22444C 100%) border-box;
  --sw-ai-border-gradient: linear-gradient(#121214, #121214) padding-box, linear-gradient(to right, #FFC005 2%, #FFE94F 12%, #8DE76E 21%, #3BE5FF 50%, #44BFFF 85%) border-box;
}


.grid-cols-\[--sw-grid-cols\] {
  grid-template-columns: repeat(var(--sw-grid-cols), minmax(0, 1fr));
}

.grid-rows-\[--sw-grid-rows\] {
  grid-template-rows: repeat(var(--sw-grid-rows), minmax(0, 1fr));
}

.gap-x-\[--sw-gap-x\] {
  grid-column-gap: var(--sw-gap-x);
  column-gap: var(--sw-gap-x);
}

.gap-y-\[--sw-gap-y\] {
  grid-row-gap: var(--sw-gap-y);
  row-gap: var(--sw-gap-y);
}

.col-start-\[--sw-col-start\] {
  grid-column-start: var(--sw-col-start);
}

.col-end-\[--sw-col-end\] {
  grid-column-end: var(--sw-col-end);
}

.row-start-\[--sw-row-start\] {
  grid-row-start: var(--sw-row-start);
}

.row-end-\[--sw-row-end\] {
  grid-row-end: var(--sw-row-end);
}

.translate-\[--sw-translate\] {
  transform: translateX(var(--sw-translate-x)) translateY(var(--sw-translate-y));
}

.st-trans-\[--sw-transform\] {
  transform: var(--sw-transform);
}

.w-\[--sw-width\] {
  width: var(--sw-width);
}

.max-w-4\.75 {
  max-width: 1.9rem;
}

.max-w-\[50vw\] {
  max-width: 50vw;
}

.max-w-\[--sw-max-width\] {
  max-width: var(--sw-max-width);
}

.min-h-6\.5 {
  min-height: 2.6rem;
}

.min-h-16 {
  min-height: 6.4rem;
}

.max-h-62\.5 {
  max-height: 25rem;
}

.max-h-\[--sw-max-height\] {
  max-height: var(--sw-max-height);
}

.h-\[--sw-height\] {
  height: var(--sw-height);
}

.z-\[--sw-z-index\] {
  z-index: var(--sw-z-index);
}

.isolation-\[--sw-isolate\] {
  isolation: var(--sw-isolate);
}

.resize-\[--sw-resize\] {
  resize: var(--sw-resize);
}

.pt-\[--sw-padding-block-start\] {
  padding-block-start: var(--sw-padding-block-start);
}

.pb-\[--sw-padding-block-end\] {
  padding-block-end: var(--sw-padding-block-end);
}

.pl-\[--sw-padding-inline-start\] {
  padding-inline-start: var(--sw-padding-inline-start);
}

.pr-\[--sw-padding-inline-end\] {
  padding-inline-end: var(--sw-padding-inline-end);
}

.rounded-\[--sw-rounded\] {
  border-radius: var(--sw-rounded);
}

.rounded-t-\[--sw-rounded-t\] {
  border-start-end-radius: var(--sw-rounded-t);
  border-start-start-radius: var(--sw-rounded-t);
}

.bg-\[--sw-bg-color\] {
  --tw-bg-opacity: 1;
  background-color: var(--sw-bg-color);
}

.bg-image-\[--sw-bg-image\] {
  --tw-bg-opacity: 1;
  background-image: var(--sw-bg-image);
}

.hover\:bg-\[--sw-bg-color-hover\]:hover {
  --tw-bg-opacity: 1;
  background-color: var(--sw-bg-color-hover);
}

.active\:bg-\[--sw-bg-color-active\]:active {
  --tw-bg-opacity: 1;
  background-color: var(--sw-bg-color-active);
}

.focus\:bg-\[--sw-bg-color-focus\]:focus {
  --tw-bg-opacity: 1;
  background-color: var(--sw-bg-color-focus);
}

.focus-within\:bg-\[--sw-bg-color-focus-within\]:focus-within {
  --tw-bg-opacity: 1;
  background-color: var(--sw-bg-color-focus-within);
}

.bg-\[--sw-bg\] {
  --tw-bg-opacity: 1;
  background: var(--sw-bg);
}

.bg-\[--sw-bg-size\] {
  background-size: var(--sw-bg-size);
}

.bg-full {
  background-size: 100%;
}

.bg-clip-text {
  background-clip: text;
  -webkit-background-clip: text;
}

.box-shadow-none {
  box-shadow: none;
}

.font-size-inherit {
  font-size: inherit;
}

.webkit-line-clamp-\[--sw-webkit-line-clamp\] {
  -webkit-line-clamp: var(--sw-webkit-line-clamp);
}

.webkit-text-\[--spr-text-02\] {
  -webkit-text-fill-color: var(--spr-text-02, #434350);
}

.webkit-text-transparent {
  -webkit-text-fill-color: transparent;
}

.webkit-tap-highlight-transparent {
  -webkit-tap-highlight-color: transparent;
}

.mx-\[--sw-margin-inline\] {
  -webkit-margin-start: var(--sw-margin-inline);
  margin-inline-start: var(--sw-margin-inline);
  -webkit-margin-end: var(--sw-margin-inline);
  margin-inline-end: var(--sw-margin-inline);
}

.my-\[--sw-margin-block\] {
  -webkit-margin-before: var(--sw-margin-block);
  margin-block-start: var(--sw-margin-block);
  -webkit-margin-after: var(--sw-margin-block);
  margin-block-end: var(--sw-margin-block);
}

.ml-\[--sw-margin-inline-start\] {
  margin-inline-start: var(--sw-margin-inline-start);
}

.mr-\[--sw-margin-inline-end\] {
  margin-inline-end: var(--sw-margin-inline-end);
}

.mt-\[--sw-margin-block-start\] {
  margin-block-start: var(--sw-margin-block-start);
}

.mb-\[--sw-margin-block-end\] {
  margin-block-end: var(--sw-margin-block-end);
}

/* directional prop needed for popover @no-flip styles */
.ml-\[--sw-margin-left\] {
  margin-left: var(--sw-margin-left);
}

.mr-\[--sw-margin-right\] {
  margin-right: var(--sw-margin-right);
}

.background-none {
  background: none;
}

.caret-transparent {
  caret-color: transparent;
}

.spr-ui-focus-disabled {
  background-color: rgba(var(--spr-ui-focus), 0.5);
}

.spr-support-error-disabled {
  background-color: rgba(var(--spr-support-error), 0.5);
}

.spr-support-success-disabled {
  background-color: rgba(var(--spr-support-success), 0.5);
}

.spr-support-warning-disabled {
  background-color: rgba(var(--spr-support-warning), 0.5);
}

.disabled\:spr-clr-blue-highlight:disabled {
  background-color: var(--spr-clr-blue-highlight, #e8f0fe);
}

.active\:spr-clr-blue-highlight:active {
  background-color: var(--spr-clr-blue-highlight, #e8f0fe);
}

.border-spr-field {
  border-color: var(--spr-field, #dbdbdb);
}

.border-b-\[--borderWidth-default\] {
  border-block-end-width: var(--borderWidth-default, 1px);
}

.border-b-\[--sw-border-bottom-color\] {
  border-bottom-color: var(--sw-border-bottom-color);
}

.border-t-\[--sw-border-top-color\] {
  border-top-color: var(--sw-border-top-color);
}

.border-l-\[--sw-border-left-color\] {
  border-left-color: var(--sw-border-left-color);
}

.border-r-\[--sw-border-right-color\] {
  border-right-color: var(--sw-border-right-color);
}

.delay-\[--sw-delay\] {
  animation-delay: var(--sw-delay);
}

.stroke-width-\[--sw-stroke-width\] {
  stroke-width: var(--sw-stroke-width);
}

.stroke-\[--sw-stroke\] {
  stroke: var(--sw-stroke);
}

.color-\[--sw-color\] {
  color: var(--sw-color);
}

.hover\:color-\[--sw-color-hover\]:hover {
  color: var(--sw-color-hover);
}

.focus\:color-\[--sw-color-focus\]:focus {
  color: var(--sw-color-focus);
}

.focus-within\:color-\[--sw-color-focus-within\]:focus-within {
  color: var(--sw-color-focus-within);
}

.active\:color-\[--sw-color-active\]:active {
  color: var(--sw-color-active);
}

.text-inherit {
  color: inherit;
}

.background-inherit {
  background: inherit;
}

.clip-0 {
  clip: rect(0, 0, 0, 0);
}

.word-spacing-normal {
  word-spacing: normal;
}

.ml-\[--sw-stack-margin-left\] {
  margin-inline-start: var(--sw-stack-margin-left);
}

.mt-\[--sw-stack-margin-top\] {
  margin-block-start: var(--sw-stack-margin-top);
}

.ml-\[--sw-stack-item-margin-left\] {
  margin-inline-start: var(--sw-stack-item-margin-left);
}

.mt-\[--sw-stack-item-margin-top\] {
  margin-block-start: var(--sw-stack-item-margin-top);
}

.sw-transparent-scrollbar::-webkit-scrollbar {
  background-color: transparent;
}

/* directional prop needed for popover @no-flip left styles */
.left-\[--sw-left-directional\] {
  left: var(--sw-left-directional);
}

.duration-\[--sw-duration\] {
  transition-duration: var(--sw-duration);
}

.border-\[--sw-border-color\] {
  border-color: var(--sw-border-color);
}

.border-t-\[--sw-border-t-color\] {
  border-block-start-color: var(--sw-border-t-color);
}

.border-b-\[--sw-border-b-color\] {
  border-block-end-color: var(--sw-border-b-color);
}

.border-l-\[--sw-border-l-color\] {
  border-inline-start-color: var(--sw-border-l-color);
}

.border-r-\[--sw-border-r-color\] {
  border-inline-end-color: var(--sw-border-r-color);
}

.hover\:border-\[--sw-border-color-hover\]:hover {
  border-color: var(--sw-border-color-hover);
}

.focus\:border-\[--sw-border-color-focus\]:focus {
  border-color: var(--sw-border-color-focus);
}

.active\:border-transparent:active {
  border-color: transparent;
}

.timing-function-\[--sw-timing-function\] {
  transition-timing-function: var(--sw-timing-function);
}

.duration-\[--sw-duration\] {
  transition-duration: var(--sw-duration);
}

.sw-transparent-scrollbar-thumb::-webkit-scrollbar-thumb {
  background-color: var(--spr-ui-03);
  border-radius: 8px;
  border-width: 4px;
  border-style: solid;
  border-color: transparent;
  background-clip: padding-box;
}

.sw-ai-textarea-scrollbar::-webkit-scrollbar {
  width: 20px;
  background-color: transparent;
}

.sw-ai-textarea-scrollbar-thumb::-webkit-scrollbar-thumb {
  background-color: var(--spr-ui-03);
  border-radius: 50rem;
  border-width: 8px;
  border-style: solid;
  border-color: transparent;
  background-clip: padding-box;
}

.translate-y-\[--sw-translate-y\] {
  transform: translateY(var(--sw-translate-y));
}

.min-w-\[--sw-min-width\] {
  min-width: var(--sw-min-width);
}

.sw-input-number {
  -moz-appearance: textfield;
}

.sw-input-number::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.sw-input-number::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.before\:content-none::before {
  content: none;
}

.hover\:before\:content-empty:hover::before {
  --tw-content: '';
  content: var(--tw-content);
}

.hover\:after\:content-empty:hover::after {
  --tw-content: '';
  content: var(--tw-content);
}

.active\:before\:content-empty:active::before {
  --tw-content: '';
  content: var(--tw-content);
}

.active\:before\:content-none:active::before {
  --tw-content: none;
  content: var(--tw-content);
}

.active\:after\:content-empty:active::after {
  --tw-content: '';
  content: var(--tw-content);
}

.active\:after\:content-none:active::after {
  --tw-content: none;
  content: var(--tw-content);
}

.before\:top-\[--sw-before-top\]::before {
  inset-block-start: var(--sw-before-top);
}

.before\:bottom-\[--sw-before-bottom\]::before {
  inset-block-end: var(--sw-before-bottom);
}

.before\:left-\[--sw-before-left\]::before {
  inset-inline-start: var(--sw-before-left);
}

.before\:right-\[--sw-before-right\]::before {
  inset-inline-end: var(--sw-before-right);
}

.before\:h-\[--sw-before-height\]::before {
  height: var(--sw-before-height);
}

.before\:w-\[--sw-before-width\]::before {
  width: var(--sw-before-width);
}

.active\:shadow-none:active {
  box-shadow: none;
}

.shadow-\[--sw-shadow\] {
  box-shadow: var(--sw-shadow);
}

.hover\:shadow-\[--sw-shadow-hover\]:hover {
  box-shadow: var(--sw-shadow-hover);
}

.focus\:shadow-\[--sw-shadow-focus\]:focus {
  box-shadow: var(--sw-shadow-focus);
}

.text-\[--sw-font-size\] {
  font-size: var(--sw-font-size);
}

@keyframes popover-hover {
  0% {
    pointer-events: none;
  }

  99% {
    pointer-events: none;
  }

  100% {
    pointer-events: auto;
  }
}

.sw-popover-hover-animation {
  animation-name: popover-hover;
  animation-duration: 100ms;
}

.transform-none {
  transform: none;
}

.transition-\[transform-opacity\] {
  transition-property: transform, opacity;
}

.transition-\[opacity\] {
  transition-property: opacity;
}

.text-\[85\%\] {
  font-size: 85%;
}

.top-\[--sw-top\] {
  top: var(--sw-top);
}

.right-\[--sw-right\] {
  inset-inline-end: var(--sw-right);
}

.ai-border-01 {
  background: var(--sw-ai-border-01-gradient);
  border-color: transparent;
}

.sw-btn-tertiary-hover,
.hover\:sw-btn-tertiary-hover:hover {
  background-color: var(--sw-btn-tertiary-hover);
}


.disabled\:sw-btn-tertiary-text:disabled,
.sw-btn-tertiary-text {
  color: var(--sw-btn-tertiary-text);
}

.sw-btn-tertiary-active,
.active\:sw-btn-tertiary-active:active {
  background-color: var(--sw-btn-tertiary-active);
}

.disabled\:sw-btn-bg-error:disabled,
.sw-btn-bg-error {
  background-color: #dc2625;
}

.disabled\:sw-btn-border-error:disabled,
.sw-btn-border-error {
  border-color: #dc2625;
}

.sw-btn-bg-error-hover,
.hover\:sw-btn-bg-error-hover:hover {
  background-color: #b91c1b;
}

.sw-btn-border-error-hover,
.hover\:sw-btn-border-error-hover:hover {
  border-color: #b91c1b;
}

.sw-btn-bg-error-active,
.active\:sw-btn-bg-error-active:active {
  background-color: #991b1b;
}

.sw-btn-border-error-active,
.active\:sw-btn-border-error-active:active {
  border-color: #991b1b;
}

.ai-border-gradient {
  background: var(--sw-ai-border-gradient);
  border-color: transparent;
}

.outline-hidden {
  outline-style: hidden;
}

.after\:outline-color-\[--sw-outline-color\]::after {
  outline-color: var(--sw-outline-color);
}

.after\:outline-2::after {
  outline-width: 2px;
}

.after\:-outline-offset-2::after {
  outline-offset: -2px;
}

.after\:outline::after {
  outline-style: solid;
}

@keyframes spinner-loader-animation {
  10% {
    opacity: 0.125;
  }

  100% {
    opacity: 1;
  }
}

@keyframes clip-loader-animation {
  0% {
    transform: rotate(0deg) scale(1);
  }

  50% {
    transform: rotate(180deg) scale(0.8);
  }

  100% {
    transform: rotate(360deg) scale(1);
  }
}

@keyframes beat-loader-animation {
  50% {
    transform: scale(0.75);
    opacity: 0.2;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes button-loader-animation {
  0% {
    transform: rotate(0deg) scale(1);
  }

  50% {
    transform: rotate(180deg) scale(1);
  }

  100% {
    transform: rotate(360deg) scale(1);
  }
}

@keyframes select-value-tombstone-animation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}

.sw-select-value-tombstone-animation {
  animation-name: select-value-tombstone-animation;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

.sw-button-loader-animation {
  animation-name: button-loader-animation;
}

.sw-spinner-loader-animation {
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-timing-function: step-start;
  animation-name: spinner-loader-animation;
}

.sw-clip-loader-animation {
  animation-duration: 0.75s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-name: clip-loader-animation;
}

.sw-beat-loader-animation {
  animation-duration: 0.7s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-fill-mode: both;
  animation-name: beat-loader-animation;
}

.pointer-events-all {
  pointer-events: all;
}

@keyframes ai-animated-gradient-border-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.sw-ai-deprecated-animated-gradient-border:hover {
  position: relative;
  z-index: 0;
}

.sw-ai-deprecated-animated-gradient-border:hover::before {
  background: var(--ai-ui-01);
  position: absolute;
  background-size: var(--sw-ai-animated-background-size, auto);
  z-index: -1;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  filter: blur(3px);
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-name: ai-animated-gradient-border-animation;
  animation-play-state: var(--sw-animation-play-state);
  border-radius: var(--sw-before-border-radius);
  inset-inline-start: var(--sw-before-left);
}

.sw-ai-deprecated-animated-gradient-border:hover::after {
  z-index: -1;
  top: 0px;
  inset-inline-start: 0px;
  position: absolute;
  background: var(--spr-ui-01);
  width: 100%;
  height: 100%;
  border-radius: var(--sw-after-border-radius);
}

.sw-ai-active-background:active {
  background: var(--ai-ui-02) padding-box, var(--ai-ui-01) border-box;
}

.sw-ai-active-background:hover:active {
  background: var(--ai-ui-02) padding-box, var(--ai-ui-01) border-box;
}

.focus-within\:spr-clr-magenta-border:focus-within {
  border-color: var(--spr-clr-magenta-border, #cb1cce);
}

.sw-ai-button-background {
  background: var(--sw-ai-button-background);
}

.hover\:sw-ai-button-background:hover {
  background: var(--sw-ai-button-hover-background);
}

.sw-ai-button-background:disabled {
  background: var(--sw-ai-button-background);
}

.sw-ai-button-selected-background {
  background: var(--ai-ui-02) padding-box, var(--ai-ui-01) border-box;
}

.touch-none {
  touch-action: none;
}

.overscroll-contain {
  overscroll-behavior: contain;
}

@media (min-width: 640px) {
  .sm\:grid-cols-\[--sw-grid-cols\] {
    grid-template-columns: repeat(var(--sw-sm-grid-cols), minmax(0, 1fr));
  }

  .sm\:grid-rows-\[--sw-grid-rows\] {
    grid-template-rows: repeat(var(--sw-sm-grid-rows), minmax(0, 1fr));
  }

  .sm\:gap-x-\[--sw-gap-x\] {
    grid-column-gap: var(--sw-sm-gap-x);
    column-gap: var(--sw-sm-gap-x);
  }

  .sm\:gap-y-\[--sw-gap-y\] {
    grid-row-gap: var(--sw-sm-gap-y);
    row-gap: var(--sw-sm-gap-y);
  }

  .sm\:col-start-\[--sw-col-start\] {
    grid-column-start: var(--sw-sm-col-start);
  }

  .sm\:col-end-\[--sw-col-end\] {
    grid-column-end: var(--sw-sm-col-end);
  }

  .sm\:row-start-\[--sw-row-start\] {
    grid-row-start: var(--sw-sm-row-start);
  }

  .sm\:row-end-\[--sw-row-end\] {
    grid-row-end: var(--sw-sm-row-end);
  }

  .sm\:ml-\[--sw-stack-margin-left\] {
    margin-inline-start: var(--sw-sm-stack-margin-left);
  }

  .sm\:mt-\[--sw-stack-margin-top\] {
    margin-block-start: var(--sw-sm-stack-margin-top);
  }

  .sm\:ml-\[--sw-stack-item-margin-left\] {
    margin-inline-start: var(--sw-sm-stack-item-margin-left);
  }

  .sm\:mt-\[--sw-stack-item-margin-top\] {
    margin-block-start: var(--sw-sm-stack-item-margin-top);
  }
}

@media (min-width: 768px) {
  .md\:grid-cols-\[--sw-grid-cols\] {
    grid-template-columns: repeat(var(--sw-md-grid-cols), minmax(0, 1fr));
  }

  .md\:grid-rows-\[--sw-grid-rows\] {
    grid-template-rows: repeat(var(--sw-md-grid-rows), minmax(0, 1fr));
  }

  .md\:gap-x-\[--sw-gap-x\] {
    grid-column-gap: var(--sw-md-gap-x);
    column-gap: var(--sw-md-gap-x);
  }

  .md\:gap-y-\[--sw-gap-y\] {
    grid-row-gap: var(--sw-md-gap-y);
    row-gap: var(--sw-md-gap-y);
  }

  .md\:col-start-\[--sw-col-start\] {
    grid-column-start: var(--sw-md-col-start);
  }

  .md\:col-end-\[--sw-col-end\] {
    grid-column-end: var(--sw-md-col-end);
  }

  .md\:row-start-\[--sw-row-start\] {
    grid-row-start: var(--sw-md-row-start);
  }

  .md\:row-end-\[--sw-row-end\] {
    grid-row-end: var(--sw-md-row-end);
  }

  .md\:ml-\[--sw-stack-margin-left\] {
    margin-inline-start: var(--sw-md-stack-margin-left);
  }

  .md\:mt-\[--sw-stack-margin-top\] {
    margin-block-start: var(--sw-md-stack-margin-top);
  }

  .md\:ml-\[--sw-stack-item-margin-left\] {
    margin-inline-start: var(--sw-md-stack-item-margin-left);
  }

  .md\:mt-\[--sw-stack-item-margin-top\] {
    margin-block-start: var(--sw-md-stack-item-margin-top);
  }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-\[--sw-grid-cols\] {
    grid-template-columns: repeat(var(--sw-lg-grid-cols), minmax(0, 1fr));
  }

  .lg\:grid-rows-\[--sw-grid-rows\] {
    grid-template-rows: repeat(var(--sw-lg-grid-rows), minmax(0, 1fr));
  }

  .lg\:gap-x-\[--sw-gap-x\] {
    grid-column-gap: var(--sw-lg-gap-x);
    column-gap: var(--sw-lg-gap-x);
  }

  .lg\:gap-y-\[--sw-gap-y\] {
    grid-row-gap: var(--sw-lg-gap-y);
    row-gap: var(--sw-lg-gap-y);
  }

  .lg\:col-start-\[--sw-col-start\] {
    grid-column-start: var(--sw-lg-col-start);
  }

  .lg\:col-end-\[--sw-col-end\] {
    grid-column-end: var(--sw-lg-col-end);
  }

  .lg\:row-start-\[--sw-row-start\] {
    grid-row-start: var(--sw-lg-row-start);
  }

  .lg\:row-end-\[--sw-row-end\] {
    grid-row-end: var(--sw-lg-row-end);
  }

  .lg\:ml-\[--sw-stack-margin-left\] {
    margin-inline-start: var(--sw-lg-stack-margin-left);
  }

  .lg\:mt-\[--sw-stack-margin-top\] {
    margin-block-start: var(--sw-lg-stack-margin-top);
  }

  .lg\:ml-\[--sw-stack-item-margin-left\] {
    margin-inline-start: var(--sw-lg-stack-item-margin-left);
  }

  .lg\:mt-\[--sw-stack-item-margin-top\] {
    margin-block-start: var(--sw-lg-stack-item-margin-top);
  }
}

@media (min-width: 1280px) {
  .xl\:grid-cols-\[--sw-grid-cols\] {
    grid-template-columns: repeat(var(--sw-xl-grid-cols), minmax(0, 1fr));
  }

  .xl\:grid-rows-\[--sw-grid-rows\] {
    grid-template-rows: repeat(var(--sw-xl-grid-rows), minmax(0, 1fr));
  }

  .xl\:gap-x-\[--sw-gap-x\] {
    grid-column-gap: var(--sw-xl-gap-x);
    column-gap: var(--sw-xl-gap-x);
  }

  .xl\:gap-y-\[--sw-gap-y\] {
    grid-row-gap: var(--sw-xl-gap-y);
    row-gap: var(--sw-xl-gap-y);
  }

  .xl\:col-start-\[--sw-col-start\] {
    grid-column-start: var(--sw-xl-col-start);
  }

  .xl\:col-end-\[--sw-col-end\] {
    grid-column-end: var(--sw-xl-col-end);
  }

  .xl\:row-start-\[--sw-row-start\] {
    grid-row-start: var(--sw-xl-row-start);
  }

  .xl\:row-end-\[--sw-row-end\] {
    grid-row-end: var(--sw-xl-row-end);
  }

  .x\:ml-\[--sw-stack-margin-left\] {
    margin-inline-start: var(--sw-xl-stack-margin-left);
  }

  .xl\:mt-\[--sw-stack-margin-top\] {
    margin-block-start: var(--sw-xl-stack-margin-top);
  }

  .xl\:ml-\[--sw-stack-item-margin-left\] {
    margin-inline-start: var(--sw-xl-stack-item-margin-left);
  }

  .xl\:mt-\[--sw-stack-item-margin-top\] {
    margin-block-start: var(--sw-xl-stack-item-margin-top);
  }
}