.pong {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
}

.pong-canvas {
  width: 100%;
  height: 100%;
  display: block;
  touch-action: none;
}

.pong .screen-info {
  position: absolute;
  top: var(--space-3);
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-mono);
  font-size: var(--space-1);
  color: oklch(100% 0 0);
  letter-spacing: 0.2em;
  z-index: 2;
  pointer-events: none;
}

.pong-controls {
  position: absolute;
  bottom: var(--space-3);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: var(--space-3);
  z-index: 2;
}