Scoped CSS selector performance

For quite a while, I've taken this warning very seriously:

Scoped styles do not eliminate the need for classes. Due to the way browsers render various CSS selectors, p { color: red } will be many times slower when scoped (i.e. when combined with an attribute selector). If you use classes or ids instead, such as in .example { color: red }, then you virtually eliminate that performance hit.

In fact, I'll often go to great lengths to use only class selectors (e.g. adding a "last" class instead of using :last-child).

I'm unclear how important this actually is. Specifically, I have two questions:

1. Is the render performance hit isolated to the component? In other words, does scoping a ul, which then adds ul[data-v-f3f3eg9] to the CSS, going to globally punish all ul renders?
2. If I nest the element selector inside of a class, does that help in any way? E.g. using .messages p:last-child instead of p:last-child?

NOTE

I also notice this is in the Vue Style Guide here, which I trust to be more recently updated. Again it uses vague terms like "will be considerably slower", so I'm not sure what to make of that.