I am converting svg/smil animations to use svg/css to take advantage of some better animation capabilities in css in a situation where there is no javascript.
Svg/Smil animations have a begin attribute which can be a named event (https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/begin) which allows interaction events like click, scroll, loaded, resize and so on to trigger the start of the animation (these listed are my most common required cases).
I've poured over a few css psuedoselector lists and found little, but there are always interesting tricks and hacks people have devised for capturing properties without javascript that I'm hoping someone might point me in a direction here. Of particular interst is if the svg element is in view (e.g. scrolled in / unoccluded / made visible), or if the document (or the svg) has been interacted with (clicked/tapped).