*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#071920;touch-action:none;user-select:none;-webkit-user-select:none}body{display:grid;place-items:center}#stage{position:relative;width:min(100vw,177.7778vh);height:min(56.25vw,100vh);overflow:hidden;background:#29b7d4}#screen{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}#effects{position:absolute;inset:0;pointer-events:none;overflow:hidden}.hotspot{position:absolute;border:0;background:transparent;padding:0;cursor:pointer;touch-action:manipulation}.hotspot:active{filter:brightness(1.15);background:rgba(255,255,255,.08)}#fullscreen{position:absolute;left:1.2%;top:2%;width:4.5%;aspect-ratio:1;border:0;border-radius:50%;background:rgba(0,0,0,.2);color:white;font-size:clamp(18px,2.4vw,42px);cursor:pointer;opacity:.35}#fullscreen:hover{opacity:.8}#countdown{position:absolute;left:42.4%;top:5.8%;width:7%;text-align:center;color:white;font:900 clamp(35px,6vw,108px)/1 Arial;text-shadow:0 .05em .08em #08769a;pointer-events:none;transform:scale(0);transition:transform .16s}.key-copy,.spider-copy{position:absolute;inset:0;background:url('assets/xgame.png') 0 0/100% 100% no-repeat}.key-copy{transform-origin:50% 76%}.key-0{clip-path:polygon(16% 85%,27% 45%,32% 48%,24% 88%)}.key-1{clip-path:polygon(25% 87%,33% 49%,39% 51%,32% 88%)}.key-2{clip-path:polygon(34% 87%,40% 52%,46% 53%,41% 87%)}.key-3{clip-path:polygon(42% 87%,47% 53%,54% 54%,50% 87%)}.key-4{clip-path:polygon(51% 87%,55% 54%,62% 56%,59% 88%)}.key-5{clip-path:polygon(59% 88%,63% 56%,70% 58%,67% 89%)}.key-6{clip-path:polygon(67% 89%,71% 58%,77% 58%,75% 90%)}.key-7{clip-path:polygon(75% 90%,78% 59%,84% 60%,82% 91%)}.key-strike{animation:key-strike .26s ease-in-out}.spider-copy{clip-path:polygon(23.5% 43%,30.5% 43%,30.5% 53%,23.5% 53%);transform-origin:27% 50%}.spider-jump{animation:spider-jump .48s ease-out}@keyframes key-strike{0%,100%{transform:translate(0)}25%{transform:translate(-.35%,.45%) rotate(-.6deg)}55%{transform:translate(.35%,-.25%) rotate(.6deg)}75%{transform:translate(-.18%,.12%)}}@keyframes spider-jump{0%,100%{transform:translateY(0)}45%{transform:translateY(-7%) rotate(-5deg)}70%{transform:translateY(-2%) rotate(3deg)}}@media(display-mode:fullscreen){#fullscreen{display:none}}
