/* La Clique — coins lumineux sur les cartes, style « viseur / écran holographique » (27 oct. 2026, idée 4 choisie par Gabriel).
   Quatre petits coins en L au lieu d'un contour complet : cyan en haut à gauche et en bas à droite, mauve dans les deux autres.
   Ils suivent l'arrondi de la carte et s'écartent un peu quand on passe la souris dessus. Posés par js/coins.js. */
.coins{position:absolute;inset:-1px;pointer-events:none;z-index:3}
.coins i{position:absolute;width:22px;height:22px;border:0 solid;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s;opacity:.9}
.coins i:nth-child(1){top:0;left:0;border-top-width:2px;border-left-width:2px;border-color:#02ffe1;border-top-left-radius:var(--r,14px);filter:drop-shadow(0 0 4px rgba(2,255,225,.8))}
.coins i:nth-child(2){top:0;right:0;border-top-width:2px;border-right-width:2px;border-color:#cc00ff;border-top-right-radius:var(--r,14px);filter:drop-shadow(0 0 4px rgba(204,0,255,.8))}
.coins i:nth-child(3){bottom:0;right:0;border-bottom-width:2px;border-right-width:2px;border-color:#02ffe1;border-bottom-right-radius:var(--r,14px);filter:drop-shadow(0 0 4px rgba(2,255,225,.8))}
.coins i:nth-child(4){bottom:0;left:0;border-bottom-width:2px;border-left-width:2px;border-color:#cc00ff;border-bottom-left-radius:var(--r,14px);filter:drop-shadow(0 0 4px rgba(204,0,255,.8))}
@media (hover:hover){
  .a-coins:hover > .coins i{opacity:1}
  .a-coins:hover > .coins i:nth-child(1){transform:translate(-4px,-4px)}
  .a-coins:hover > .coins i:nth-child(2){transform:translate(4px,-4px)}
  .a-coins:hover > .coins i:nth-child(3){transform:translate(4px,4px)}
  .a-coins:hover > .coins i:nth-child(4){transform:translate(-4px,4px)}
}
@media (prefers-reduced-motion:reduce){.coins i{transition:none}}