如何放置3个圆圈，使它们的重叠中心始终位于不同屏幕尺寸的屏幕中心？

Question

我将实现像此链接中的图片一样的UI设计（请忽略图片中的所有文字和坐标）：Page numbers with CSS/HTML

有3个具有相同半径的圆，并且3个圆重叠，其中重叠的中心是屏幕中心。圆对齐父顶部和B对齐父底部和左侧。 C是B的对称。我的问题是如何缩放3个圆的坐标和半径，以便在不同大小的屏幕上看起来总是相同？我需要在不同尺寸的屏幕上计算这些值：

1. 圆圈A的上边距
2. 圆圈B的左边缘
3. 圆圈B的下边缘
4. 圆的半径

提前谢谢！