.btn {
  &-xs {
    @apply h-6 min-h-[1.5rem] px-2;
    font-size: 0.75rem;
  }
  &-sm {
    @apply h-8 min-h-[2rem] px-3;
    font-size: 0.875rem;
  }
  &-md {
    @apply h-12 min-h-[3rem] px-4;
    font-size: 0.875rem;
  }
  &-lg {
    @apply h-16 min-h-[4rem] px-6;
    font-size: 1.125rem;
  }
  &-wide {
    @apply w-64;
  }
  &-block {
    @apply w-full;
  }
  &-square {
    &:where(.btn-xs) {
      @apply h-6 w-6 p-0;
    }
    &:where(.btn-sm) {
      @apply h-8 w-8 p-0;
    }
    &:where(.btn-md) {
      @apply h-12 w-12 p-0;
    }
    &:where(.btn-lg) {
      @apply h-16 w-16 p-0;
    }
  }
  &-circle {
    &:where(.btn-xs) {
      @apply h-6 w-6 rounded-full p-0;
    }
    &:where(.btn-sm) {
      @apply h-8 w-8 rounded-full p-0;
    }
    &:where(.btn-md) {
      @apply h-12 w-12 rounded-full p-0;
    }
    &:where(.btn-lg) {
      @apply h-16 w-16 rounded-full p-0;
    }
  }
}
