[Aetae]

Сделано на коленке, не красиво, не оптимизировано, но суть отображает.

<div>

#foo {
        border: 1px;
        a {
                border: 2px;
        }
        b {
                border: 3px;
                c {
                        border: 4px; /* comment */
                }
        }
}


</div>
<script>
d=document.getElementsByTagName('div')[0].innerHTML;
function css(str){
  var result=[],
  re = /([^{\s]+)\s*\{[^}{]+\}/g,
  re2 = /(\d+)_array/g,
  placer = function( all , selector){
    var lower='';  
    all = all.replace( re2 ,function(x,y){
      result[y] = selector + ' ' + result[y];
      lower += x;
      return ''
    })
    return result.push( all + '\n') - 1 + '_array' + lower;
  }
  while(~str.indexOf('{'))alert( str=str.replace( re , placer ) );
  return str.replace( re2 , function(ar,ar){ return result[ar] } )
}
alert(css(d))
</script>