css-variables-reduce-css-1.css

.grid {
  display: flex;
  flex-wrap: wrap;
}

.grid > * {
  flex-basis: 100%;
}

.grid-gap-xxxs {
  margin-bottom: calc(-1 * var(--space-xxxs));
  margin-left: calc(-1 * var(--space-xxxs));
}

.grid-gap-xxxs > * {
  margin-bottom: var(--space-xxxs);
  margin-left: calc(var(--space-xxxs));
}

.grid-gap-xxs {
  margin-bottom: calc(-1 * var(--space-xxs));
  margin-left: calc(-1 * var(--space-xxs));
}

.grid-gap-xxs > * {
  margin-bottom: var(--space-xxs);
  margin-left: calc(var(--space-xxs));
}

.grid-gap-xs {
  margin-bottom: calc(-1 * var(--space-xs));
  margin-left: calc(-1 * var(--space-xs));
}

.grid-gap-xs > * {
  margin-bottom: var(--space-xs);
  margin-left: calc(var(--space-xs));
}

.grid-gap-sm {
  margin-bottom: calc(-1 * var(--space-sm));
  margin-left: calc(-1 * var(--space-sm));
}

.grid-gap-sm  > * {
  margin-bottom: var(--space-sm);
  margin-left: calc(var(--space-sm));
}

.grid-gap-md {
  margin-bottom: calc(-1 * var(--space-md));
  margin-left: calc(-1 * var(--space-md));
}

.grid-gap-md > * {
  margin-bottom: var(--space-md);
  margin-left: calc(var(--space-md));
}

.grid-gap-lg {
  margin-bottom: calc(-1 * var(--space-lg));
  margin-left: calc(-1 * var(--space-lg));
}

.grid-gap-lg > * {
  margin-bottom: var(--space-lg);
  margin-left: calc(var(--space-lg));
}

.grid-gap-xl {
  margin-bottom: calc(-1 * var(--space-xl));
  margin-left: calc(-1 * var(--space-xl));
}

.grid-gap-xl > * {
  margin-bottom: var(--space-xl);
  margin-left: calc(var(--space-xl));
}

.grid-gap-xxl {
  margin-bottom: calc(-1 * var(--space-xxl));
  margin-left: calc(-1 * var(--space-xxl));
}

.grid-gap-xxl > * {
  margin-bottom: var(--space-xxl);
  margin-left: calc(var(--space-xxl));
}

.grid-gap-xxxl {
  margin-bottom: calc(-1 * var(--space-xxxl));
  margin-left: calc(-1 * var(--space-xxxl));
}

.grid-gap-xxxl > * {
  margin-bottom: var(--space-xxxl);
  margin-left: calc(var(--space-xxxl));
}