/* Mole Pop Game v2.0.0 */
.mpv2-wrap { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mpv2 {
  position: relative;
  width: 100%;
  aspect-ratio: var(--ratio, 9/16);
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
  user-select: none;
}
.mpv2 > * { pointer-events: none; }
#mpv2-bg, #mpv2-mask, .mpv2-overlay { position:absolute; inset:0; width:100%; height:100%; display:block; }
#mpv2-bg, #mpv2-mask { z-index:0; }
#mpv2-mask { opacity:0; }
.mpv2-overlay { z-index:20; display:flex; align-items:center; justify-content:center; background: rgba(0,0,0,.18); }
.mpv2-overlay.hidden { display:none !important; }
.mpv2-overlay img { max-width:100%; max-height:100%; object-fit:contain; border-radius:inherit; }
.mpv2-overlay-text { position:absolute; bottom:12px; right:12px; background:rgba(0,0,0,.55); color:#fff; padding:6px 10px; border-radius:10px; font-weight:600; }
.mpv2-mole {
  position:absolute; width:42px; height:42px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, #6b4a42, #3a2a25 60%, #231713 100%);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.6), 0 0 0 2px rgba(0,0,0,.25);
  transform: translate(-50%, -50%) scale(0.1);
  transition: transform var(--grow, 2s) linear;
  cursor: crosshair; z-index:10; pointer-events:auto;
}
.mpv2-mole.grown { transform: translate(-50%, -50%) scale(1); }
.mpv2-mole.pop { animation: mpv2Pop var(--shrink, .2s) ease-out forwards; }
@keyframes mpv2Pop { to { transform: translate(-50%, -50%) scale(0.01); opacity:0; } }
.mpv2-hud { display:flex; gap:12px; align-items:center; margin-top:10px; flex-wrap:wrap; }
.mpv2-media { display:flex; gap:8px; align-items:center; margin-bottom:8px; }