sort styles by first rule's index

lib/carto/renderer.js

@@ -170,15 +170,20 @@ function inheritRules(definitions, env) {
 }
 
 function sortStyles(styles, env) {
+    styles.forEach(function(style) {
+        style.index = Infinity;
+        style.forEach(function(block) {
+            block.rules.forEach(function(rule) {
+                if (rule.index < style.index) {
+                    style.index = rule.index;
+                }
+            });
+        });
+    });
+
     var result = styles.slice();
     result.sort(function(a, b) {
-        var as = a[a.length - 1].specificity;
-        var bs = b[b.length - 1].specificity;
-
-        if (as[0] != bs[0]) return bs[0] - as[0];
-        if (as[1] != bs[1]) return bs[1] - as[1];
-        if (as[2] != bs[2]) return bs[2] - as[2];
-        return bs[3] - as[3];
+        return b.index - a.index;
     });
     return result;
 }