:root{--timeout:.2s;--modal-blur:5px;--modal-bg-opacity:.5}.modal-item-enter{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}.modal-item-enter-active,.modal-item-exit{background-color:rgba(0,0,0,var(--modal-bg-opacity));-webkit-backdrop-filter:blur(var(--modal-blur));backdrop-filter:blur(var(--modal-blur))}.modal-item-exit-active{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}.modal-item-enter-active,.modal-item-exit-active{transition:all var(--timeout) linear}.modal-item-enter-done{background-color:rgba(0,0,0,var(--modal-bg-opacity));-webkit-backdrop-filter:blur(var(--modal-blur));backdrop-filter:blur(var(--modal-blur))}.modalContent{transform-origin:center}.modal-item-enter .modalContent{opacity:0;transform:scale(.8) translateY(-300px) translateX(-50px)}.modal-item-enter-active .modalContent{transition:all var(--timeout) ease-in-out}.modal-item-enter-active .modalContent,.modal-item-exit .modalContent{opacity:1;transform:scale(1) translateY(0) translateX(0)}.modal-item-exit-active .modalContent{opacity:0;transform:scale(.8) translateY(-300px) translateX(-50px);transition:all var(--timeout) ease-in-out}