.modal{z-index:25;visibility:hidden;position:fixed;inset:0}.modal .backdrop{opacity:0;background-color:#00000073;transition:opacity .2s ease-out;position:absolute;inset:0}.modal .modalPane{background-color:var(--colorBackgroundPrimary);opacity:0;border-radius:20px;flex-direction:column;width:min(520px,100% - 32px);max-height:calc(100dvh - 48px);transition:opacity .2s ease-out,transform .2s ease-out;display:flex;position:absolute;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-46%);box-shadow:0 20px 60px #0000004d}.modal .modalPane .closeModal{z-index:2;position:absolute;top:14px;right:14px}.modal.open{visibility:visible}.modal.open .backdrop{opacity:1}.modal.open .modalPane{opacity:1;transform:translate(-50%,-50%)}@media not (min-width:768px){.modal .modalPane{width:100%;max-height:92dvh;padding-bottom:env(safe-area-inset-bottom);border-radius:20px 20px 0 0;top:auto;bottom:0;left:0;transform:translateY(100%)}.modal.open .modalPane{transform:translateY(0)}}