Properties and nested declarations should appear in the following order, with line breaks between groups:
1. Any @ rules
2. Layout and box-model properties
- margin, padding, box-sizing, overflow, position, display, width/height, etc.
3. Typographic properties
- E.g. font-, line-height, letter-spacing, text-, etc.
4. Stylistic properties
- color, background-*, animation, border, etc.
5. UI properties
- appearance, cursor, user-select, pointer-events, etc.
6. Pseudo-elements
- ::after, ::before, ::selection, etc.
7. Pseudo-selectors
- :hover, :focus, :active, etc.
8. Modifier classes
9. Nested elements