O CSS introduziu recentemente a capacidade de definir suas próprias camadas de cascata, e parece que está ganhando suporte nos navegadores. Esperançosamente, estará disponível em todos os principais navegadores em breve.
Referências:
https://developer.mozilla.org/en-US/docs/Web/CSS/@layer
https://css-tricks.com/css-cascade-layers/
https://www.youtube.com/watch?v=NDNRGW-_1EE
Fiquei curioso para saber se isso está sendo discutido para inclusão na base de código do Discourse?
Acho que poderia ser uma ótima adição e poderia ajudar com dificuldades de especificidade e também nos ajudar a evitar o uso da flag !important.
Talvez um conjunto de camadas possa ser definido na base de código principal. Talvez algo como:
@layer base, layout, theme, utilities;
e os desenvolvedores de temas podem aproveitar a camada “theme” para adicionar facilmente personalizações sem ter que ser tão específicos com seletores ou usar flags !important.