.level-transition-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:9999;pointer-events:none}.level-transition-banner{position:relative;width:100%;height:25vh;background-color:#9b03d4;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #9b03d480,8px 12px 25px #0006;overflow:hidden}.level-transition-text{color:#fff;font-size:4rem;font-weight:700;text-align:center;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.3);z-index:1;position:relative}.level-transition-stripe{position:absolute;width:25%;height:200%;background-color:#fff;right:0;top:50%;transform:translateY(-50%) skew(-45deg);transform-origin:center;opacity:.3}.level-transition-edge-left,.level-transition-edge-right{position:absolute;width:25vh;height:25vh;background-color:#9b03d4;top:0}.level-transition-edge-left{left:-12.5vh;transform:rotate(45deg)}.level-transition-edge-right{right:-12.5vh;transform:rotate(45deg)}.level-transition-fade-left{position:absolute;left:0;top:0;width:15%;height:100%;background:linear-gradient(to right,#9b03d400,#9b03d4);z-index:0}.level-transition-fade-right{position:absolute;right:0;top:0;width:15%;height:100%;background:linear-gradient(to left,#9b03d400,#9b03d4);z-index:0}.level-transition-overlay.slide-in .level-transition-banner{animation:slideInFromRight .5s ease-out forwards}.level-transition-overlay.pause .level-transition-banner{transform:translate(0)}.level-transition-overlay.slide-out .level-transition-banner{animation:slideOutToLeft .5s ease-in forwards}@keyframes slideInFromRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideOutToLeft{0%{transform:translate(0)}to{transform:translate(-100%)}}@media (max-width: 768px){.level-transition-text{font-size:2.5rem}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden;background:#000;font-family:Quantico,sans-serif}canvas{width:100%;height:100%;display:block}.quantico-regular{font-family:Quantico,sans-serif;font-weight:400;font-style:normal}.quantico-bold{font-family:Quantico,sans-serif;font-weight:700;font-style:normal}.quantico-regular-italic{font-family:Quantico,sans-serif;font-weight:400;font-style:italic}.quantico-bold-italic{font-family:Quantico,sans-serif;font-weight:700;font-style:italic}@media only screen and (max-width: 768px){html,body,#root{min-height:100vh;height:100vh;position:fixed;width:100%}input{font-size:16px!important}}@media only screen and (max-height: 500px) and (orientation: landscape){html,body,#root{height:100vh;overflow:hidden}}