html,body,#root{position:fixed;top:0;left:0;width:100%;height:100%}.loading{width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-size:24px}.loading h2{margin-left:24px}.loading .loader{height:60px;aspect-ratio:2;border-bottom:3px solid #0000;background:linear-gradient(90deg,#524656 50%,#0000 0) -25% 100%/50% 3px repeat-x border-box;position:relative;animation:l3-0 .75s linear infinite}.loading .loader:before{content:"";position:absolute;inset:auto 42.5% 0;aspect-ratio:1;border-radius:50%;background:#9370db;animation:l3-1 .75s cubic-bezier(0,900,1,900) infinite}@keyframes l3-0{to{background-position:-125% 100%}}@keyframes l3-1{0%,2%{bottom:0%}98%,to{bottom:.1%}}.interface{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;font-family:Bebas Neue,cursive}.time{position:absolute;top:15%;left:0;width:100%;color:#fff;font-size:6vh;background:#0003;padding-top:5px;text-align:center}.restart{display:flex;justify-content:center;position:absolute;top:40%;left:0;width:100%;color:#fff;font-size:80px;background:#0003;padding-top:10px;pointer-events:auto;cursor:pointer}.controls{position:absolute;bottom:10%;left:0;width:100%}.controls .raw{display:flex;justify-content:center}.controls .key{width:40px;height:40px;margin:4px;border:2px solid #ffffff;background:#fff4;text-align:center;line-height:40px;color:#fff}.controls .key.large{width:144px}.controls .key.active{background:#fff9}