Only show possible classes.
Filter classes list to only show those that could apply. Right now you do a prefix naming scheme to help people identify relevant container classes. Just don't show the other options, it saves space, is more intuitive and we can abuse that prefix names then
Show selected state.
Show what classes are applied, most likely by highlighting. If you have multiple classes, even with the visual styling feedback, it may not always be apparent which classes are being applied.
Families/Mutual Exclusive
So lets abuse that prefix naming. I'm not showing anything before ':' in the name anymore because we don't need to if you are only showing what is possible to be applied to that container. Now we can set it so that if two styles have what I'll call a family, then only one of those can be on at a time.
-----------
A great use case of how these work together is shown in some of your examples. If you apply, a hidden note class or important class to a paragraph, you can't apply the other. Not horrible except the other one can't be applied and we don't know why. There is nothing telling you that both can't be applied at the same time, it just looks like it isn't working.
Now this is more of a wysiwyg example, but I don't think it is unreasonable to offer alignment, but the proper way to do it is with classes. If they apply a right class and then a center, if the right class isn't removed (and they can't see it is on by it showing the selected classes), then depending how the CSS is written, the center will be overridden even though it was applied. Again, it looks like it is just not working when it is.
