/* -------------------------
   Metadata gamification
   Kept minimal: XP popups + level-up animation only.
------------------------- */

.mgame-xp-pop {
  position: fixed;
  z-index: 9999;
  pointer-events: none;

  padding: 4px 7px;
  border-radius: 999px;

  font-size: 11px;
  font-weight: 800;
  color: #0f5132;

  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.14);

  animation: xpPopFloat 2s ease forwards;
}

@keyframes xpPopFloat {
  0% {
    transform: translateY(0) scale(0.85);
    opacity: 0;
  }

  20% {
    transform: translateY(-4px) scale(1);
    opacity: 1;
  }

  100% {
    transform: translateY(-28px) scale(1);
    opacity: 0;
  }
}

.mp-title.is-level-up {
  animation: levelUpPop 0.75s ease;
}

.mp-title.is-level-up::after {
  content: "Level up";
  margin-left: 8px;
  padding: 2px 7px;

  border-radius: 999px;
  border: 1px solid #bae6fd;

  background: #e0f2fe;
  color: #075985;

  font-size: 10px;
  font-weight: 800;

  animation: levelUpBadge 2s ease forwards;
}

@keyframes levelUpPop {
  0% {
    transform: scale(0.96);
  }

  45% {
    transform: scale(1.06);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes levelUpBadge {
  0% {
    opacity: 0;
    transform: translateY(4px);
  }

  25% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    transform: translateY(-6px);
  }
}

/* Achievements stay disabled in this professional UI. */
.mgame-achievements,
.mgame-achievement,
.mp-achievements {
  display: none !important;
}