Honestly, you've ridiculously overthought the answer to this "problem", but to a degree that stems not from your code, but from the fact the original is from the web-rot disaster of scam artistry known as W3Schools. As I’ve said for going on two decades, the only thing W3Fools has to teach anyone is how not to use HTML or CSS.
There's an easier way, and you don't need "calc" for it.
I’ve redone this reply as a full and proper article here:
Scalable “Styled” Checkboxes Using Just CSS. It’s Called EM, Use ‘Em!
In replying to Omar Sharaki’s article “From Static to Dynamic CSS values” on rescaling the garbage example from…
Switched up the methodology a bit so that the border-radius is dynamically calculated off switch width/height and border-width using CSS3 variables.