Как изменить размер небольшого изображения синхронно с центром полноэкранного изображения? ⇐ CSS

[Гость]

Ссылка на Stackblitz

На моей странице у меня есть несколько эффектов и слоев, и это изображение содержит часы, циферблат которых всегда находится в центре изображения (попробовал изобразить это здесь с мужчиной на моем примере изображения, мужчина не довольно центрировано, но я надеюсь, что вы поняли это).

Теперь я хочу добавить к этим часам метки часов/минут/секунд.
Эти маркеры всегда должны быть того же размера, что и диск исходного полноэкранного изображения.

Другими словами, в stackblitz ручка всегда должна иметь то же соотношение высоты и ширины, что и человек на картинке.

Я понятия не имею, как синхронизировать размер со свойством object-fit: contains/cover/fill. Единственная идея, которая у меня возникла, — сделать ручки также полноэкранным изображением той же высоты, что и часы. Тогда я мог бы применить к нему тот же эффект. Но это делает размер изображения слишком большим + поскольку они должны отображать в реальном времени все операции преобразования, которые над ними выполняются, также обходятся дороже. И больше всего меня беспокоит... то, что я не могу этого понять.