Pseudo-element style rules don't appear to be read from external stylesheet

[Ian Kemp]

Please see project attached: AngleSharpCssPseudoTest.zip

In brief I have test.css with the following CSS rule defined:

.thing[data-foo*="4"] .inner:before {
    background: red;
    content: "bar ";
}

Then I have test.html that references test.css with an element that uses the aforementioned rule:

<div class="thing" data-foo="1 2 3 4 5 6 7">
    <div class="inner first">This is red</div>
</div>

Finally I'm attempting to retrieve the rule definition as applied to the .first element via:

var config = Configuration.Default
	.WithRequesters()
	.WithDefaultLoader(new LoaderOptions { IsResourceLoadingEnabled = true })
	.WithCss();

var context = BrowsingContext.New(config);

var htmlFile = $"file:{Path.Combine(Path.GetDirectoryName(Assembly.GetExecutingAssembly().Location)!, "test.html")}";
var document = await context.OpenAsync(htmlFile);

var element = document.QuerySelector(".first");
var tree = document.DefaultView.Render();
var node = tree.Find(element);
await node.DownloadResources();

var style = document.DefaultView.GetComputedStyle(element);
var pseudos = document.DefaultView.GetPseudoElements(element);

Console.WriteLine(style.CssText);
Console.WriteLine(pseudos["::before"].Style.CssText);

Console.ReadKey(true);

But no matter what I do I cannot retrieve the content of that CSS rule; all I get back is the default style of display: block; unicode-bidi: embed applied to that element.

However, if I change the CSS style to be defined inline in test.html and remove the reference to test.css:

<style>
	.thing[data-foo*="4"] .inner:before {
		background: red;
		content: "bar ";
	}
</style>

then pseudos["::before"].Style.CssText returns what I expect.

I assume I'm loading the stylesheet incorrectly somehow (although document.StyleSheets does return test.css), please can you advise what I'm doing wrong?