/* ============================================================================
   mine-hunt.css — Mine Hunt Spielseite
   Scoped: nur #gameCanvas, #mh-*, .mh-*, #canvasWrap — keine globalen
   Element-Selektoren.
   Shell-Klassen (.score-bar, .score-box, .canvas-wrap, .overlay, .diff-btn,
   .btn-start, .controls-hint, .key) kommen aus main-vhc.css.
   ============================================================================ */

/* ── Main-Block (identisch zu allen Spielseiten) ── */
main {
  flex: 1;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 20px 40px;
}

/* ── Canvas: responsive, kein Strecken ── */
#gameCanvas {
  display: block;
  max-width: 100%;
  height: auto;
  image-rendering: pixelated;
}

/* ── Overlay dezent kompakter, damit Icon/Titel/Buttons/START mittig sitzen ── */
.overlay { gap: 10px; padding: 20px 24px; }
.overlay-icon img { width: 64px; height: 64px; }

/* ── Controls-Hint: auf Mobilgeräten ausblenden ── */
@media (max-width: 500px) {
  #mh-controls-hint { display: none; }
}
@media (hover: none) and (pointer: coarse) {
  #mh-controls-hint { display: none; }
}