Почитайте про то как происходит разбор селекторов и все встанет на свои места. Селекторы разбираются слева на право (или снизу вверх по дереву). То есть селекторы вида:
.some-specific-element
будут относительно быстрее
#some-hight-specific-element .some-not-so-specific-element
пососкольку не нужно сильно далеко траверсить DOM дерево.
Самый медленный вариант селекторов:
body.someSpecificClass *,
* + span,
html span
benfrain.com/css-performance-revisited-selectors-b...
идею вы должны уловить. Чем ближе в дереве - тем быстрее. А вообще с вложенными селекторами и каскадированием стилей лучше не баловаться слишком сильно. Учитывая что у вас есть препроцессоры.
Ну и про BEM почитайте (У Вадима Макеева был
неплохой доклад на эту тему).
Использовать не агитирую но идеи которые в этой методологии заложены должны сильно облегчают жизнь.
p.s. посмотрите в сторону autoprefixer и избавьте свой CSS от этих ужасных миксинов. Как уже заметили выше добавлять префиксы для border-radius уже не имеет смысла. Ваши миксины это не учитывают, а autoprefixer имеет актуальную статистику и позволяет вообще не париться по поводу таких вот вещей.
