@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,serif;scrollbar-width:none}body{background-color:#222436}.container{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw}.react-p5-wrapper{overflow:none;-webkit-user-select:none;user-select:none}.hamburger-menu{position:fixed;top:20px;left:20px;z-index:999;-webkit-user-select:none;user-select:none}.hamburger-icon{width:30px;height:24px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;-webkit-user-select:none;user-select:none}.hamburger-icon span{display:block;width:100%;height:4px;background-color:#fff;border-radius:15px;transition:.3s all ease-in-out}.hamburger-icon.open span:nth-child(1){transform:translateY(10px) rotate(45deg)}.hamburger-icon.open span:nth-child(2){opacity:0}.hamburger-icon.open span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}.menu-icons{position:fixed;top:60px;left:20px;z-index:998;opacity:0;transform:translateY(-20px);transition:all .3s ease-in-out;-webkit-user-select:none;user-select:none}.menu-icons.open{opacity:1;transform:translateY(0);display:flex;flex-direction:column;gap:8px}.menu-item{display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none}.menu-item:hover{cursor:pointer}.popup{opacity:0;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;display:flex;justify-content:center;align-items:center;background-color:#00000080;transition:all .3s ease-in-out}.popup.show{opacity:1;z-index:99}.popup-wrapper{background-color:#fff;padding:20px;border-radius:8px;text-align:center;min-width:min(80%,400px);max-width:min(80%,700px);max-height:80%;overflow-y:scroll;position:relative}.popup-wrapper>h2{margin-bottom:20px}form{display:flex;flex-direction:column;align-items:center}.popup-input{width:60%;padding:8px;margin:8px}.popup-invalid{color:red;margin-bottom:10px}.popup-button{padding:8px 16px;margin-top:8px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer}#draw-fov{position:relative;width:50px;height:24px;display:inline-block;border-radius:100px;box-shadow:0 2px 6px -2px #0006;margin:10px}#draw-fov .fill{position:absolute;left:2px;top:2px;bottom:0;border-radius:50%;background:#222436;width:20px;height:20px;transition:.4s left}#draw-fov input{width:0;visibility:hidden}#draw-fov input:checked+span.fill{left:calc(100% - 22px)}.exit-form{position:absolute;top:10px;right:10px;cursor:pointer}