Arguing strictly from a language design PoV, and having used before/after myself, if markup is for content/structure, and CSS is for presentation, then it's just idiosyncratic af to generate content from CSS rules. Obviously, the purpose of before/after is to produce a visual effect; then why produce pseudo-content if CSS is oh-so-great a language for presentation? But IMO that's par for the course for CSS which starts out by migrating rendering properties that used to be HTML attributes into their own syntactic category that's neither here nor there, then postulates a structure/presentation dichotomy after the fact. When actually markup attributes are intended exactly for the purpose of holding rendering properties rather than some elusive "structural semantics" bs. Going from there, it feels like CSS heads got lost in their maze of separation of concerns story, which in any case has never needed new syntax, let alone a thousand micro syntaxes.
> Obviously, the purpose of before/after is to produce a visual effect; then why produce pseudo-content if CSS is oh-so-great a language for presentation?
Because sometimes the best way to style something is by using a character (bullet points, arrows, ...). Example: you could add a symbol to URLs by giving <a> a slight padding on the left and by adding an image showing an URL symbol. But by using 🔗 in a:before, you cheaply get vector graphics, and a symbol which (in a perfect world) will always match the font.
(honest question) As someone who used pseudo before/after in my own code, I'd be interested in their potential downsides or issues.