/* PixelPost : styles du module d'animations (static/anim.js). 4 verts Game Boy uniquement. */
.pxanim {
  display: block;
  box-sizing: content-box;
  border: 4px solid #0f380f;            /* BORDER dans anim.js */
  background: #9bbc0f;
  image-rendering: crisp-edges;         /* repli */
  image-rendering: pixelated;
}

/* ---------- ecran de chargement : dessin + texte avec points par pas ---------- */
.pxloader {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  max-width: 100%; margin: 0 auto;
  font-family: "PS2P", monospace; font-size: 10px; line-height: 1.7; color: #0f380f;
  text-align: center;
}
.pxloader-art { max-width: 100%; }
.pxloader-txt { max-width: 100%; }
.pxdots { display: inline-block; width: 3ch; text-align: left; }

/* ---------- plein ecran d'accueil ---------- */
.pxsplash {
  position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 2147483000;
  background: #0f380f;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  font-family: "PS2P", monospace; color: #9bbc0f; text-align: center;
  overflow: hidden;
}
.pxsplash .pxanim { border-color: #306230; }
.pxsplash-txt { max-width: 100%; }

/* mouvement reduit : rien ne bouge cote CSS (les points restent fixes cote JS) */
@media (prefers-reduced-motion: reduce) {
  .pxloader, .pxsplash { animation: none; }
}