J'ai vraiment du mal à le comprendre ce ">"
A quoi sert il concrètement et comment l'utiliser ?
Il a des petit copains qui font des trucs sympa ce ">" ?
Le problème n'est en fait pas lié au > mais aux priorités CSS.
Après relecture (http://www.w3.org/TR/CSS/cascade.html#cascading-order), le problème vient du fait que la première déclaration est plus "spécifique" (il y a dans les deux cas une classe, mais il y a 3 éléments dans la première déclaration et une seule dans la deuxième), et donc prioritaire.
Le fait que les ramener "au même niveau" fait que la dernière l'emporte.
Un id (#id) l'aurait emporté, ou un !important. Ceci dit, inclure html et body dans le sélecteur, c'est un peu redondant à mon humble avis. D'ailleurs les outils d'analyse de CSS ne te disent pas que ça bouffe des ressources pour rien?