Eu tenho um menu de barra superior (baseado na Fundação Zurb):

Este é o SCSS:

.top-bar {
  .top-bar-section {
    ul {
      @import "menu-icons/*.png";
      @include all-menu-icons-sprites;
    }
  }
}

Agora, isso faz o que se espera, mas o problema é que eu quero estilizara elemento dentro de cadali elementos (na verdade, eu gostaria de aplicá-lo para.top-bar.topbar-section.ul.li.a:before).

No entanto, uma vez que o site é construído no WordPress, e assim no menu, eu só posso atribuir a classe ao elemento li e não tenho idéia de como fazer o trabalho de spriting da bússola.

Eu sei, eu poderia personalizar a forma como o menu é processado pelo WordPress usando uma classe walker, mas eu prefiro tentar encontrar uma solução simplesmente escrevendo o SCSS certo, desde que isso seja possível.