/* Stack — vertical layout primitive.
 * Renders children top-to-bottom with consistent gap.
 * Variants are switched via class names; see StackComponent.
 */

.stack {
  display: flex;
  flex-direction: column;
}

.stack--gap-xs { gap: 0.25rem; }  /*  4px */
.stack--gap-sm { gap: 0.5rem;  }  /*  8px */
.stack--gap-md { gap: 1rem;    }  /* 16px */
.stack--gap-lg { gap: 1.5rem;  }  /* 24px */
.stack--gap-xl { gap: 2rem;    }  /* 32px */

.stack--align-start   { align-items: flex-start; }
.stack--align-center  { align-items: center;     }
.stack--align-end     { align-items: flex-end;   }
.stack--align-stretch { align-items: stretch;    }