Как убрать стилизацию, если высота экрана меньше высоты элемента ⇐ CSS

[Anonymous]

Я центрировал элемент по высоте экрана, используя абсолютное позиционирование.
Однако, когда высота экрана меньше ширины элемента, часть элемента обрезается, что делает его верхнюю часть недоступной. Как добавлять и удалять стили, если высота экрана меньше высоты элемента?
https://codepen.io/alena-chuyankova/pen/YzmWYKZ
https://codepen.io/alena-chuyankova/pen/YzmWYKZ

.wrap {
position: absolute;
top: 50%;
transform: translate(0, -50%);
background-color: white;
gap: 1rem;
width: 45%;
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
display: flex;
flex-direction: column;
padding: 4rem;

}


Подробнее здесь: https://stackoverflow.com/questions/790 ... ent-height