Style with Stateful, Semantic Selectors

If a state is important enough to indicate visually, it's probably important enough to expose to assistive technologies.

Love this idea of building state into HTML attributes for screen readers and doing your styling there

Instead of:

.button--is-expanded {}

You do:

button[aria-expanded="true"]::before {}