#modal-container > div { position: fixed; top: 0; right: 0; height: 100%; width: 100%; z-index: 1000; display: flex; justify-content: center; align-items: center; background-color: var(--backdrop-color); animation: appear 0.5s var(--timing-function) both; &.solid { background-color: var(--backdrop-solid-color); } .sheet { transition: transform 0.3s var(--timing-function); transform-origin: center bottom; } &:has(~ div) .sheet { transform: scale(0.975); } }