html,body{height:100%;width:100%;overflow:hidden;touch-action:none;background:#05060c}
body.play{padding:0;margin:0;position:fixed;inset:0;overflow:hidden;background:#05060c}
.play-top{
  position:absolute;left:0;right:0;top:0;z-index:6;
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 16px;padding-top:calc(8px + env(safe-area-inset-top));
  background:linear-gradient(180deg,rgba(5,6,12,.72),transparent);
  pointer-events:none;
}
.play-top a,.play-top strong{pointer-events:auto}
#game{
  position:absolute;inset:0;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:#05060c;
}
#stage{
  position:relative;
  overflow:hidden;
  background:#05060c;
  flex:0 0 auto;
}
#stage canvas{display:block;width:100% !important;height:100% !important}
#rotate{
  display:none;position:fixed;inset:0;z-index:40;
  background:#05060c;color:#f4f6fb;
  flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:32px 24px;gap:16px;
}
#rotate strong{font-size:1.35rem;letter-spacing:-.03em}
#rotate p{margin:0;color:#9aa3b5;max-width:280px}
#rotate .phone{
  width:54px;height:88px;border:3px solid #3ee8ff;border-radius:10px;
  animation:tip 1.2s ease-in-out infinite;
}
@keyframes tip{
  0%{transform:rotate(0deg)}
  35%{transform:rotate(90deg)}
  100%{transform:rotate(90deg)}
}
@media (max-aspect-ratio: 5/4){
  #rotate{display:flex}
  #game{visibility:hidden}
}