html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #0b0f14;
  color: #7dd3a0;
  font-family: "Consolas", "Courier New", monospace;
  overflow: hidden;
}
body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#game {
  position: relative;
  width: 100%;
  height: calc(100% - 28px);
  display: flex;
  align-items: center;
  justify-content: center;
}
#game canvas {
  display: block;
  margin: 0 auto;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  box-shadow: 0 0 40px rgba(125, 211, 160, 0.15);
}
#hint {
  margin: 4px 0;
  font-size: 12px;
  opacity: 0.6;
  height: 20px;
  line-height: 20px;
}

/* Consola de comandos (tecla |) */
#console {
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  width: min(720px, 92%);
  display: none;
  flex-direction: column;
  gap: 4px;
  background: rgba(11, 15, 20, 0.96);
  border: 1px solid #7dd3a0;
  box-shadow: 0 0 24px rgba(125, 211, 160, 0.25);
  padding: 8px 10px;
  font-family: "Consolas", "Courier New", monospace;
  font-size: 13px;
  z-index: 10;
}
#console-log { max-height: 160px; overflow: hidden; line-height: 1.35; white-space: pre-wrap; }
#console-row { display: flex; align-items: center; gap: 6px; color: #7dd3a0; }
#console-prompt { cursor: pointer; padding: 0 4px; }
#console-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #e6edf3;
  font-family: inherit;
  font-size: 14px;
}

/* Móvil */
#game canvas { touch-action: none; -webkit-user-select: none; user-select: none; }
#rotate-hint { display: none; margin: 0; padding: 6px 12px; font-size: 13px; color: #ffe066; background: #1a2430; width: 100%; text-align: center; box-sizing: border-box; }
@media (pointer: coarse) {
  #hint { display: none; }
  #game { height: 100%; }
}
@media (pointer: coarse) and (orientation: portrait) {
  #rotate-hint { display: block; }
  #game { height: calc(100% - 30px); }
}

/* Aviso discreto de error interno (esquina) */
#err-badge {
  display: none;
  position: fixed;
  right: 10px;
  top: 10px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #ff5e7a;
  color: #0b0f14;
  font: bold 14px/22px Consolas, monospace;
  text-align: center;
  z-index: 20;
  cursor: help;
}