There are restrictions on use of external resources, like fonts, in standalone embedded SVGs. I couldn’t find an authoritative reference about it, but if you google about using web fonts in SVGs with data URIs you’ll find a number of discussions about it on StackOverflow, etc.
Here is your PG, modified to load the font face as a base64 data URI in svg2:
I encoded it manually and there might be some legal/license concerns around this. (I didn’t check.)
I believe it would also be possible to do it dynamically in the browser. For example:
ASIDE:
Although not the main issue, the reason your original PG showed checkeredd image (error), is because SVG contents must be XML encoded. The @import URL has & characters, etc. You could/should wrap that style section with CDATA. After doing that, no errors, but the font was still not used.