Unfortunatly, you can't use this Logic in firefox because Firefox (and Safari, per spec) treats as creating a shadow tree, isolating the cloned nodes from external CSS selectors that aren't scoped to the . this means .my-text inside is effectively in a shadow DOM, which is not a descendant of body in the composed tree, and not affected by selectors like body:has(:checked).

And to answer your last question : it's chrome that doesn't follow spec 😉