О тонкостях парсинга списка селекторов

Список селекторов, разделенных запятыми, представляет собой объединение всех элементов, выбранных каждым из отдельных селекторов этого списка. Например, когда несколько селекторов собержат одни и те же декларации, они могут быть сгруппированы в список, разделенный запятыми. Перед запятой и/или после нее может быть пробел или перенос строки.

h1 { font-family: sans-serif }
h2 { font-family: sans-serif }
h3 { font-family: sans-serif }

/* то же самое что: */

h1, h2, h3 { font-family: sans-serif }

НО! Это работает только пока все селекторы в списке валидны. Как только один них ошибочен, дропается весь список.

h1 { font-family: sans-serif } /* работает */
h2.. { font-family: sans-serif } /* НЕ работает */
h3 { font-family: sans-serif } /* работает */

/* НЕ то же самое что: */

h1, h2.., h3 { font-family: sans-serif } /* НЕ работает*/

Зачем оно вообще надо?
Например, это важно помнить при использовании браузеро-специфичных псевдоэлеметов. По неясным мне пока причинам неизвестные псевдоэлементы браузер парсит как невалидные (если только они не начинаются с -webkit).
То есть, если написать такие селекторы по отдельности, первый распарситься и примернится в хроме, второй хром проигнорирует как невалидный, а FF сделает ровно наоборот:

input[type=range]::-webkit-slider-runnable-track {
background-color: orange;
}

input[type=range]::-moz-range-track {
background-color: orange;
}

Если же написать их в списке, то, признав второй селектор невалидным, хром дропнет весь список и декларации внутри ни к чему не будут применены:

input[type=range]::-webkit-slider-runnable-track,
input[type=range]::-moz-range-track {
background-color: orange;
}

#selectors