When Virtual keyboard popup, we can relayout the UI element accordingly:
navigator.virtualKeyboard.overlaysContent = true;
navigator.virtualKeyboard.show()
navigator.virtualKeyboard.hide()
navigator.virtualKeyboard.addEventListener('geometrychanged', () => {})
keyboard-inset-top
keyboard-inset-right
keyboard-inset-bottom
keyboard-inset-left
keyboard-inset-width
keyboard-inset-height
margin-block-end: env(keyboard-inset-height, 100px) // fallback 100px
SS