html, body {
  margin: 0; padding: 0; background: #000; height: 100%;
  overflow: hidden; user-select: none; -webkit-user-select: none;
  font-family: monospace;
}
#stage {
  position: fixed; inset: 0; display: flex; align-items: center; justify-content: center;
  background: #000;
}
#screen {
  image-rendering: pixelated; image-rendering: crisp-edges;
  background: #000; display: block;
  /* 320x200 framebuffer displayed with classic 1.2 vertical stretch (4:3) */
  aspect-ratio: 4 / 3;
  height: min(100vh, calc(100vw * 3 / 4));
  width: min(calc(100vh * 4 / 3), 100vw);
  cursor: none;
}
#clickcatch {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.55); cursor: pointer; outline: none;
}
#clickcatch.hidden { display: none; }
#clickmsg {
  color: #ff8820; font-size: 22px; letter-spacing: 4px; font-weight: bold;
  text-shadow: 0 0 12px #f80, 2px 2px 0 #300;
  animation: pulse 1.1s infinite alternate;
}
@keyframes pulse { from { opacity: .65; } to { opacity: 1; } }
