/* ============================================================
   kit.css · Games Engine (NEP Academy Core) · acompana a kit.js
   ------------------------------------------------------------
   Solo lo que el kit necesita dibujar por su cuenta: los puntos
   flotantes y la region de avisos para lectores de pantalla.
   Se publica unicamente en las verticales que activan el kit
   ("kit": true en games.json), asi que no altera en nada a las
   que no lo usan. Sin colores literales: ranuras del Core.
   ============================================================ */

/* Texto solo para lectores de pantalla (no se oculta con display:none,
   que lo dejaria fuera del arbol de accesibilidad). */
.nepa-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Puntos que suben y se desvanecen sobre el elemento que los produjo. */
.nepa-puntos{
  position:fixed;z-index:60;transform:translate(-50%,-50%);pointer-events:none;
  font-family:var(--f-titulo);font-weight:800;font-size:1.25rem;
  color:var(--color-secondary);text-shadow:0 1px 2px var(--color-white);
  animation:nepa-sube 1s ease-out forwards
}
.nepa-puntos.negativo{color:var(--color-danger,var(--color-accent-dark))}
@keyframes nepa-sube{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}
  18%{opacity:1;transform:translate(-50%,-60%) scale(1.08)}
  100%{opacity:0;transform:translate(-50%,-190%) scale(1)}
}
@media (prefers-reduced-motion:reduce){ .nepa-puntos{display:none} }