/* ─── Popup de score central ──────────────────────────────────────────────
   Élément unique #scorePopup (game.php), piloté par scorePopup.js via la
   Web Animations API (opacity/transform uniquement — cf. scorePopup.js).
   Fixé au centre exact de l'écran, indépendant de Three.js/de la caméra,
   non interactif, au-dessus du canvas (#app, z-index:1) et des HUD
   (#arcadeScore/#scorePanel/#tileUI, z-index max 12) — mais sous les
   overlays modaux (help.css/multiplayerUi.css, z-index 9999-10000). */

#scorePopup {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 500;

  margin: 0;
  padding: 0;
  opacity: 0;

  /* width:max-content — indispensable depuis l'ajout du message "Capture faite !"
     (2026-07-15, cf. scorePopup.js::showCenterMessage) : un <div> fixed avec
     seulement `left` (pas `right`) calcule sinon une largeur "shrink-to-fit" basée
     sur l'espace DISPONIBLE à droite de l'ancre, pas sur le contenu réel — ok pour
     un court "+N" mais pour un texte plus long ça provoquait un retour à la ligne
     ET un centrage faussé (translate(-50%) porte sur cette largeur asymétrique).
     max-content force la boîte à coller exactement à la largeur du texte, quelle
     que soit sa longueur, donc le centrage reste toujours exact et sur une ligne. */
  width: max-content;
  max-width: none;
  white-space: nowrap;
  text-align: center;

  pointer-events: none;
  user-select: none;

  font-family: 'BebasNeue', system-ui, sans-serif;
  font-size: 208px;
  line-height: 1;
  color: #ffffff;
  text-shadow:
    0 0 48px rgba(120, 255, 170, 0.80),
    0 0 18px rgba(120, 255, 170, 0.65);

  will-change: transform, opacity;
}

@media (max-width: 640px) {
  #scorePopup {
    font-size: 132px;
  }
}

/* Messages textuels (ex. "Capture faite !", cf. showCenterMessage) — taille dédiée,
   plus petite que les "+N" numériques : 208px conviendrait à "+25" mais ferait
   déborder de l'écran un texte de plusieurs mots. Classe posée/retirée par
   scorePopup.js selon l'appel (showScorePopup vs showCenterMessage). */
#scorePopup.scorePopup--message {
  font-size: clamp(38px, 8.1vw, 97px);
}