As I dive into my research on browser rendering, I've reached the stage in the rendering process where the browser creates the CSSOM from raw CSS.
In many tutorials I've encountered, the authors confidently state that the body element is the root, and any styles applied to it will automatically cascade down to the rest of the DOM unless overridden by a different selector. This concept can be seen in examples like those found here: https://blog.logrocket.com/how-css-works-parsing-painting-css-in-the-critical-rendering-path-b3ee290762d3/
and also here: https://developers.google.com/web/fundamentals/performance/critical-rendering-path/constructing-the-object-model
Both explanations assume the body tag to be the root, even though the html tag may seem more fitting for this role. Additionally, the HTML specifications do not mandate the presence of either of these tags in the markup (unless I'm mistaken).
This piece of information holds significant importance when styling elements in the render tree. Without clarity on which element serves as the root, understanding how styles cascade becomes challenging.
My query revolves around whether browsers always consider the body element as the root, or if there exists a method to determine the root element in the browser's CSS Tree?