.button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 8px;
  padding: 10px 16px;
  cursor: var(--cursor-pointer);
  font-weight: 800;
  transition: transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

.button:hover { transform: scale(1.03); }
.button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
  transform: none;
}
.button.full { width: 100%; }
.button.small { min-height: 34px; padding: 7px 10px; font-size: 13px; }
.button.primary { background: var(--primary); color: #fff; }
.button.secondary { background: var(--secondary); color: #fff; }
.button.danger { background: #fee2e2; color: #b91c1c; }
.button.ghost { background: var(--muted); color: var(--foreground); }
.button.outline { background: transparent; color: var(--foreground); box-shadow: inset 0 0 0 3px currentColor; }