The cancel button we used is a silent button. In form-like contexts, the common pattern has been to place the actions at the bottom of the form with the button right-aligned and emphasising the main action while keeping Cancel silent.

In the old Trello board for UI components this is a common pattern. and the screenshot below from the design document show it too. However it is true that it is not present on the live guide page (yet?), and placing the actions on top is also a pattern that exists (I assumed mainly for mobile). @violetto, @Volker_E, or @Prtksxna may be able to confirm which is the current status of placing form actions and provide recommendations on when to use them according to UI-Standardization recommendations.

Primary (framed / bordered) buttons are reserved for actions that are most important on the page or the most obvious step forward to help users progress in a certain workflow.

In this case, "Reply" is the primary button. Quiet buttons are not framed because they are secondary actions. In order to keep an interface uncluttered and to preserve the higher hierarchy of primary buttons, we needed to a way of preserving secondary actions' importance (i.e. "Cancel") while keeping the interface easy to understand and digest.

In the case of toolbar, these actions are framed only because they are in a toolbar with a top, bottom, left and right boundaries for clarity.

Hope this helps clarify.