Is there a non-JS method of keeping an object within the viewport? (e.g., legend for a map)
Not sure what you mean by ‘within the viewport’?
Within the browser window.
You can set the distance from the edge of the viewport using regular CSS: position:fixed;top:0;left;0;
https://www.w3schools.com/css/css_positioning.asp
This is what the pins essentially do when you have a document setup for flexible layout and you pin an element. So this is a no css + no JS method