So there is polygon() in CSS and <polygon> in SVG. They are closely related, but there are all kinds of weirdnesses. For example, you can use path() in CSS to update the d attribute of a <path>, but you can't do the same with polygon() and <polygon>.
Part of the problem is that polygon() in CSS only accepts numbers with units, like px, %, em, or whatever.
The trick is that you can force the SVG coordinates to behave like percentage coordinates (even with weird viewBoxes) with some light math, a transform attribute, and a special clipPathUnits attribute.
Those two values are 1/329.6667 and 1/86, respectively, and they effectively scale every point in the d attribute to fit into the needed 0–1 range. Thus we have an SVG clipping path that scales with the element and fits to its dimensions!