If you use !important, you either understand CSS very well, or don't understand it at all.
Someone probably knows of a targeted resource or two that may help.
Order of precedence is the hardest thing for me to figure out, if I have three nested <div>s and a couple of <li> elements and all of them with a conflicting fontColor property, which one takes precedence? If I think really hard and trace back all the code, I can figure it out. Or I can put an !important on it and future me will deal with the consequences.
You can paste in a series of selectors (getting new boxes by clicking "duplicate"), then hit "Sort by specificity".