:root{font-family:Noto Sans Mono,monospace,Arial,sans-serif;line-height:1.2}*,*:before,*:after{box-sizing:border-box;padding:0;margin:0}body{background-color:#000}.init .loading{opacity:0;visibility:hidden}.init .main__media{opacity:1}.result .main__content,.result .main__foot{opacity:1;visibility:visible}.result .main__logo{opacity:0}.loading{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#00000080;transition:all .5s}.loading:before,.loading:after{--size: 48px;position:absolute;top:50%;left:50%;width:var(--size);height:var(--size);border-radius:var(--size);border:4px solid var(--primaryColor);content:"";opacity:.3;margin:calc(var(--size) / -2)}.loading:before{opacity:1;border-color:transparent;border-right-color:var(--primaryColor);animation:spin .75s infinite linear}.message{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#0003;transition:all .5s;z-index:10;display:grid;place-items:center;color:#fff;font-weight:500;font-size:22px;pointer-events:none;text-align:center;white-space:pre-wrap;opacity:0;visibility:hidden;padding-top:10vh}html:not(.loading):not(.result) .message.show{opacity:1;visibility:visible;transition:all .5s 2s}.main{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;display:grid;align-content:space-between;padding:16px;overflow:hidden}.main__media{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:auto;display:grid;pointer-events:none;opacity:0;transition:all .5s .5s}.main__video,.main__canvas{position:absolute;width:auto;height:100%;z-index:-1;left:50%;transform:scaleX(-1) translate(50%)}.main__text{position:absolute;top:70px;left:0;width:100%;text-align:center;z-index:1;color:#fff}.main__head,.main__foot{max-width:460px;display:grid;gap:16px;width:100%;height:100%;justify-self:center;align-content:space-between}.main__foot{transition:all .5s;visibility:hidden;opacity:0}.main__content{text-align:center;padding:8px;background:#fff;border-radius:8px;transition:all .5s;visibility:hidden;opacity:0}.main__content span{min-width:30px;font-size:22px;font-weight:600;padding:0 4px}.main__button{display:flex;align-items:center;justify-content:center;padding:0 20px;width:100%;height:48px;border-radius:var(--borderRadius);color:var(--textColor);font-size:18px;background:var(--primaryColor);text-transform:uppercase;cursor:pointer;border:none;font-weight:600;transition:all .3s;-webkit-user-select:none;user-select:none}.main__button:hover{opacity:.9}.main__button:disabled{opacity:.5;pointer-events:none}.main__logo,.main__logo img{display:block}.main__logo{position:absolute;left:16px;bottom:16px;opacity:.8;transition:all .5s;display:none}.main__logo a:hover{opacity:1}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}