Help With Dynamic Centering Arc Inside Canvas

I have an arc that is inside a border radius canvas (so that it looks like a circle). The canvas is dynamic and centers its self and changes its size based on the size of the document (And will change on document resize later). I wanted to put a circle inside the circular canvas that is also dynamic, but, no matter what I try my logic does not seem to be accomplishing this. At different widths, the arc seems to start at different places. Any advice on making the arc center to the canvas would be appreciated. The project is posted below.
https://codepen.io/Bloodypizza17/pen/rYVZEd

how’s it going? i found some random arc