[0.5] Generate focus variants last and group-hover variants first

[adamwathan]

Resolves #392.

This PR changes the order in which state variants are generated to be more intuitive.

Prior to this PR, variants were generated in this order:

1. Focus
2. Hover
3. Group Hover

That means if an element had both hover and focus styles applied to the same property, the hover styles would win if the element was hovered and focused simultaneously:

<!-- This button will be green if hovered and focused -->
<button class="bg-blue focus:bg-red hover:bg-green">Click</button>

While this feels right for buttons, it feels wrong for inputs, where a focus style feels like it should take precedence over a hover style:

Choosing either option here has trade-offs, but I'm convinced that having focus styles trump hover styles is a better trade-off for two reasons:

1. Even though for non-input elements it feels more correct for hover to trump focus, it is very uncommon for focus and hover to both target the same property on those elements, so in practice it doesn't actually matter. I've never given a button a default background color, a focus background color, and a hover background color. Any focus styles I apply to buttons are usually changing the outline color or border.

2. The only elements where it is reasonably common to target the same property on both hover and focus are input elements, so since that situation actually happens, it makes sense to optimize for it.

This PR also moves group-hover to the beginning, giving it the lowest precedence whereas previously it had the highest precedence. That means that now, if a button is inside a div and has a group hover background color and a regular hover background color, hovering the button will apply the hover background instead of the group hover background.