Порядок CSS на основе специфики селектора

Я проанализировал заданный файл/строку CSS в объект JSON следующим образом:

{
    "#header": {
        "color": "#000000"
    },
    "#header h1": {
        "color": "#000"
    },
    "h1": {
        "color": "#4fb6e5"
    }
}

Что я хочу сделать сейчас, это переупорядочить их на основе специфики, В этом случае #header h1должен идти после h1в объекте JSON, так как они будут применяться в браузере.

Как мне это сделать? Существуют ли какие-либо существующие библиотеки для этого? Или какие-либо полезные библиотеки, которые могут помочь в этом?

Для этого я могу использовать как Javascript/jQuery, так и PHP. Я ищу за совет по внедрению, и, надеюсь, это уже сделано!