.react-joystick{position:relative;border-radius:50%;background:#f1f1f1;box-shadow:0 0 5px #d5dadb inset;border:1px solid #fff;text-align:initial}.react-joystick.react-joystick-disabled{opacity:.5;cursor:not-allowed}.react-joystick .arrows-wrapper{position:absolute;width:100%;height:100%;top:0;left:0}.react-joystick .arrows-wrapper .controller-arrow{display:inline-flex;position:absolute}.react-joystick .arrows-wrapper .arrow-up{display:inline-flex;position:absolute;top:0;left:50%;transform:translate(-50%,50%)}.react-joystick .arrows-wrapper .arrow-down{display:inline-flex;position:absolute;bottom:0;left:50%;transform:translate(-50%,-50%)}.react-joystick .arrows-wrapper .arrow-left{display:inline-flex;position:absolute;left:0;top:50%;transform:translate(50%,-50%)}.react-joystick .arrows-wrapper .arrow-right{display:inline-flex;position:absolute;right:0;top:50%;transform:translate(-50%,-50%)}.react-joystick .react-joystick-controller{background:linear-gradient(to bottom,#fff,#eaf4fe);border-radius:50%;box-shadow:0 0 16px #d5dadb;border:1px solid #d9dde4;box-sizing:border-box}.react-joystick .controller-wrapper{display:inline-flex}.react-joystick-ghost-area{position:relative}.react-joystick-ghost-area .react-joystick-wrapper{position:absolute;width:0;height:0}.react-joystick-ghost-area .react-joystick-wrapper .react-joystick{transform:translate(-50%,-50%)}.react-joystick-ghost-area .react-joystick-wrapper .react-joystick.ghost{visibility:hidden}.react-joystick-ghost-area .react-joystick-wrapper .react-joystick.ghost-active{visibility:visible}