*{box-sizing:border-box}html{font-family:menu,sans-serif;font-size:18px;line-height:1.5}html,body{padding:0;margin:0}.game{width:100%;height:100vh;color:#333;background:#eee}.limb{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:50%;height:50%;transition:background-color 2s ease}.limb--left{left:0%;padding-left:10vw}.limb--right{right:0%;padding-right:10vw}.limb--hand{top:0%;padding-top:10vw}.limb--foot{bottom:0%;padding-bottom:10vw}.limb:before{content:"";display:block;background:no-repeat center center/contain;filter:invert(100%) sepia(0%) saturate(2%) hue-rotate(311deg) brightness(107%) contrast(101%);aspect-ratio:1}.limb--hand:before{width:50%;height:50%;background-image:url(./hand.2115545f.svg)}.limb--foot:before{width:60%;height:60%;background-image:url(./foot.273455d5.svg)}.limb--left.limb--foot:before,.limb--right.limb--hand:before{transform:rotateY(180deg)}:root{--step-duration: 12s}.control{display:flex;justify-content:center;align-items:center;position:absolute;top:50%;left:50%;z-index:2;width:60px;height:60px;border-radius:50%;background:#fff;color:#666;transform:translate(-50%,-50%);cursor:pointer;border:none;box-shadow:0 2px 15px #00000040}.control:before{content:"";display:block}.is-paused .control:before{margin-left:15px;border:12px solid transparent;border-left:20px solid currentColor}.is-playing .control:before{width:8px;height:25px;border-left:6px solid;border-right:6px solid}.control__text{text-transform:uppercase}.control__loading{display:none}.is-playing .control__loading{display:block}.control__loading div{position:absolute;top:-10px;left:-10px;right:-10px;bottom:-10px;z-index:-1;-webkit-clip-path:polygon(50% 0,110% 0,110% 110%,50% 110%);clip-path:polygon(50% 0,110% 0,110% 110%,50% 110%)}.control__loading div:last-child{transform:rotate(180deg)}.control__loading div:first-child span{-webkit-animation:loading var(--step-duration) linear forwards infinite;animation:loading var(--step-duration) linear forwards infinite}.control__loading div:last-child span{-webkit-animation:loading var(--step-duration) linear forwards infinite calc(var(--step-duration) / 4);animation:loading var(--step-duration) linear forwards infinite calc(var(--step-duration) / 4)}.control__loading span{display:block;width:100%;height:100%;border:10px solid rgba(0,0,0,.3);border-radius:100%;-webkit-clip-path:polygon(0 0,50% 0,50% 100%,0 100%);clip-path:polygon(0 0,50% 0,50% 100%,0 100%)}@-webkit-keyframes loading{0%{transform:rotate(0)}25%{transform:rotate(180deg)}50%{transform:rotate(180deg)}75%{transform:rotate(360deg)}to{transform:rotate(360deg)}}@keyframes loading{0%{transform:rotate(0)}25%{transform:rotate(180deg)}50%{transform:rotate(180deg)}75%{transform:rotate(360deg)}to{transform:rotate(360deg)}}.red{background-color:#c00}.blue{background-color:#09f}.green{background-color:#090}.purple{background-color:#60c}