/* pieces.css — Brick ZR : les pièces d'or qui volent jusqu'au compteur de Ma ville (pieces.js). Le style « Brick ZR, les briques »
   (jetons de styles.css) ; les ors de la pièce sont ceux de la pièce du compteur (#eco-pill) et des pièces d'economie.css. */
:root { --pc-or: #e8b923; --pc-or-clair: #ffe27a; --pc-or-fonce: #c99712; --pc-or-bord: #a87b08; }

/* La couche des pièces : au-dessus de la ville et d'une fenêtre (Infos), sous les bulles du tuto et les toasts ; elle ne prend
   jamais le doigt (rien n'est bloqué pendant le vol) */
.pc-couche { position: fixed; inset: 0; z-index: 510; pointer-events: none; overflow: hidden; }
.pc-piece {
  position: absolute; left: 0; top: 0; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle at 38% 32%, var(--pc-or-clair) 0 18%, var(--pc-or) 48%, var(--pc-or-fonce) 80%);
  box-shadow: inset 0 0 0 1.5px var(--pc-or-bord), 0 2px 0 rgba(10, 16, 34, .35);
  will-change: transform, opacity;
}
/* le petit rectangle gravé, comme sur la pièce du compteur */
.pc-piece::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 6px; height: 4px; margin: -2px 0 0 -3px; border-radius: 1px;
  background: var(--pc-or-bord); opacity: .8;
}
/* une seule caisse : la même chose, en plus petit */
.pc-piece.pc-petite { width: 15px; height: 15px; margin: -7.5px 0 0 -7.5px; }
.pc-piece.pc-petite::after { width: 5px; height: 3px; margin: -1.5px 0 0 -2.5px; }

/* « +12 » qui monte de la bulle de la caisse */
.pc-gain {
  position: absolute; transform: translate(-50%, -100%); white-space: nowrap; pointer-events: none;
  color: var(--jaune); font: 800 17px/1 var(--font); text-shadow: 0 2px 0 var(--plaque-bord), 0 0 6px rgba(10, 16, 34, .5);
  animation: pc-gain .9s var(--ease-out) forwards;
}
@keyframes pc-gain { 0% { opacity: 0; transform: translate(-50%, -80%); } 20% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -190%); } }

/* Le compteur pendant le vol : il montre l'or déjà arrivé (data-pc) ; le chiffre d'economie.js reste à jour dessous, caché */
.eco-pill.pc-compte .ep-or { font-size: 0 !important; }
.eco-pill.pc-compte .ep-or::after { content: attr(data-pc); font-size: var(--pc-fs, 15px); }
/* une pièce arrive : la pastille luit un instant (et sa pièce rebondit : pieces.js) */
.city-pill.eco-pill.pc-lueur { box-shadow: var(--ombre-ligne), inset 0 0 0 2px var(--jaune), 0 0 14px rgba(255, 197, 46, .55); }
.eco-pill.pc-lueur .ep-or { text-shadow: 0 0 8px rgba(255, 213, 74, .85); }
.eco-pill svg { transform-origin: 50% 50%; }

/* Moins d'animations : aucune pièce ne vole (pieces.js), le gain s'efface sur place */
@media (prefers-reduced-motion: reduce) {
  .pc-gain { animation: pc-gain-doux .9s ease forwards; }
  @keyframes pc-gain-doux { 0% { opacity: 0; } 20% { opacity: 1; } 100% { opacity: 0; } }
}