Отменить непрозрачность всей страницы в прозрачном поле ⇐ CSS

[Гость]

Реальный код намного сложнее, но я думаю, что этот фрагмент достаточно хорошо иллюстрирует проблему.

У меня воспроизводится фоновое видео (здесь только фон, тот же результат), а сверху есть часы (здесь квадрат). Циферблат часов прозрачный, то есть сквозь него видно фоновое видео. Теперь фоновое видео имеет rgba(0,0,0,0.2), чтобы сделать его темнее. Внутри циферблата я не хочу, чтобы применялся rgba(0,0,0,0.2) — мне нужно исходное видео без этого эффекта. Я понятия не имею, возможно ли это с помощью CSS.

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

.container{ высота: 100вх; ширина: 100vw; цвет фона: rgba(0,0,0,0.2); дисплей: гибкий; оправдание-содержание: центр; выровнять-элементы: по центру; } /* квадратный фон должен быть черным, поэтому он не должен быть непрозрачным */ .квадрат{ ширина: 100 пикселей; высота: 100 пикселей; граница: 1 пиксель, сплошная красная;