html, body { margin: 0; height: 100%; background: #07040c; overflow: hidden; overscroll-behavior: none; touch-action: none;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
#frame { position: fixed; left: 0; top: 0; transform-origin: 0 0; }
#game { display: block; image-rendering: pixelated; image-rendering: crisp-edges; touch-action: none; }
#turn { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
  background: #07040c; color: #f8f8ff; font: 700 15px ui-monospace, Menlo, Consolas, monospace; letter-spacing: 3px; text-align: center; padding: 24px; z-index: 5; }
#turn[hidden] { display: none; }
#turn .p { color: #b894d8; font-size: 11px; letter-spacing: 2px; }
#turn .phone { width: 46px; height: 80px; border: 4px solid #f8f8ff; border-radius: 9px; position: relative; animation: turn 2.4s ease-in-out infinite; }
#turn .screen { position: absolute; inset: 6px; background: linear-gradient(#2a1238, #ff2e88); border-radius: 3px; }
@keyframes turn { 0%, 30% { transform: rotate(0deg); } 55%, 85% { transform: rotate(-90deg); } 100% { transform: rotate(0deg); } }
