:root{
  --noir:#050505; --noir2:#111111; --noir3:#1c1c1c; --rouge:#E31C3D;
  --blanc:#F2F0EC; --argent:rgba(242,240,236,0.5); --line:rgba(255,59,92,0.15);
  --commune:#cdf2e1; --commune-fond:#1c5f40;
  --peucommune:#b7d1f2; --peucommune-fond:#1c395f;
  --rare:#cfb7f1; --rare-fond:#371c5f;
  --ultrarare:#f294bb; --ultrarare-fond:#5f1c37;
  --legendaire:#fdb756; --legendaire-fond:#5f431c;
}

.zone-reveal{
  display:flex;
  gap:1.4rem;
  margin-top:2.5rem;
  perspective:1200px;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
}

.carte-flip{
  width:170px;
  height:265px;
  cursor:pointer;
  position:relative;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.65));
  transition:transform .25s ease, filter .25s ease;
}

.carte-flip:hover{
  transform:translateY(-8px) scale(1.025);
  filter:drop-shadow(0 24px 34px rgba(0,0,0,.8));
}

.flip-inner{
  position:relative;
  width:100%;
  height:100%;
  transition:transform .6s cubic-bezier(.2,.75,.2,1);
  transform-style:preserve-3d;
}

.carte-flip.revelee .flip-inner{
  transform:rotateY(180deg);
}

.flip-face{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  backface-visibility:hidden;
  border-radius:14px;
  overflow:hidden;
}

.flip-back{
  background:var(--noir2);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    0 0 0 1px rgba(0,0,0,.9);
}

.flip-back img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.flip-front{
  transform:rotateY(180deg);
  position:relative;
  display:flex;
  border:1px solid rgba(255,255,255,.42) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.08),
    0 12px 28px rgba(0,0,0,.62),
    inset 0 0 0 1px rgba(255,255,255,.10),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -18px 30px rgba(0,0,0,.42) !important;
  outline:1px solid rgba(255,255,255,.055);
  outline-offset:-5px;
}

.perfo{
  width:9px;
  flex-shrink:0;
  align-self:stretch;
  background-image:radial-gradient(circle,#030303 2px,transparent 2.3px);
  background-size:100% 13px;
  background-position:center 5px;
  background-repeat:repeat-y;
  background-color:#252525;
  box-shadow:inset -1px 0 rgba(255,255,255,.08);
}

.colonne-centrale{
  flex:1;
  display:flex;
  flex-direction:column;
  min-width:0;
  position:relative;
}

.affiche{
  flex:1;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:
    inset 0 1px rgba(255,255,255,.10),
    inset 0 -1px rgba(0,0,0,.25);
}

.affiche::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,
    rgba(0,0,0,.04) 45%,
    rgba(0,0,0,.38) 100%);
  box-shadow:inset 0 0 28px rgba(0,0,0,.55);
}

.affiche img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.badge-niveau{
  position:absolute;
  top:8px;
  left:8px;
  z-index:12;
  width:23px;
  height:23px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Space Grotesk',sans-serif;
  font-weight:800;
  font-size:.56rem;
  color:#080808;
  border:1px solid rgba(255,255,255,.5);
  box-shadow:
    0 2px 8px rgba(0,0,0,.55),
    inset 0 1px 2px rgba(255,255,255,.5);
}

.infos{
  padding:.6rem .65rem .7rem;
  border-top:1px solid rgba(255,255,255,.1);
  position:relative;
  z-index:11;
}

.desc{
  font-family:'IBM Plex Mono',monospace;
  font-size:.55rem;
  color:rgba(255,255,255,.62);
  margin-bottom:.55rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.stats{
  display:flex;
  gap:.4rem;
}

.stat{
  flex:1;
  background:rgba(0,0,0,.34);
  border:1px solid rgba(255,255,255,.08);
  border-radius:6px;
  padding:.38rem .42rem;
  box-shadow:inset 0 1px rgba(255,255,255,.035);
}

.stat-label{
  font-family:'IBM Plex Mono',monospace;
  font-size:.48rem;
  color:rgba(255,255,255,.5);
  text-transform:uppercase;
  letter-spacing:.08em;
}

.stat-val{
  font-family:'Space Grotesk',sans-serif;
  font-weight:800;
  font-size:.78rem;
  color:#f2f0ec;
  letter-spacing:.02em;
}

.c-commune .affiche, .c-commune .infos{ background:var(--commune-fond); }
.c-commune .badge-niveau{ background:var(--commune); } .c-commune .stat-val{ color:var(--commune); }
.c-peu_commune .affiche, .c-peu_commune .infos{ background:var(--peucommune-fond); }
.c-peu_commune .badge-niveau{ background:var(--peucommune); } .c-peu_commune .stat-val{ color:var(--peucommune); }
.c-rare .affiche, .c-rare .infos{ background:var(--rare-fond); }
.c-rare .badge-niveau{ background:var(--rare); } .c-rare .stat-val{ color:var(--rare); }
.c-ultra_rare .affiche, .c-ultra_rare .infos{ background:var(--ultrarare-fond); }
.c-ultra_rare .badge-niveau{ background:var(--ultrarare); } .c-ultra_rare .stat-val{ color:var(--ultrarare); }
.c-legendaire .affiche, .c-legendaire .infos{ background:var(--legendaire-fond); }
.c-legendaire .badge-niveau{ background:var(--legendaire); } .c-legendaire .stat-val{ color:var(--legendaire); }

.c-commune{
  border-color:rgba(205,242,225,.48) !important;
  box-shadow:
    0 0 0 1px rgba(205,242,225,.10),
    0 10px 28px rgba(0,0,0,.62),
    inset 0 0 18px rgba(205,242,225,.055) !important;
}

.c-peu_commune{
  border-color:rgba(183,209,242,.58) !important;
  box-shadow:
    0 0 0 1px rgba(183,209,242,.12),
    0 10px 28px rgba(0,0,0,.62),
    inset 0 0 20px rgba(110,170,255,.075) !important;
}

.c-rare{
  border-color:rgba(207,183,241,.72) !important;
  box-shadow:
    0 0 0 1px rgba(207,183,241,.16),
    0 0 22px rgba(145,90,220,.18),
    0 12px 30px rgba(0,0,0,.65),
    inset 0 0 24px rgba(150,100,230,.09) !important;
}

.c-ultra_rare{
  border-color:rgba(242,148,187,.78) !important;
  box-shadow:
    0 0 0 1px rgba(242,148,187,.18),
    0 0 28px rgba(220,55,125,.24),
    0 12px 32px rgba(0,0,0,.68),
    inset 0 0 28px rgba(225,55,125,.11) !important;
}

.c-legendaire{
  border-color:rgba(255,235,190,.88) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.22),
    0 0 32px rgba(255,205,105,.24),
    0 12px 34px rgba(0,0,0,.70),
    inset 0 0 30px rgba(255,215,130,.12) !important;
}

.flip-front::before{
  content:"";
  position:absolute;
  inset:3px;
  z-index:1;
  pointer-events:none;
  border-radius:11px;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.16) 0%,
      transparent 14%,
      rgba(255,255,255,.035) 31%,
      rgba(255,255,255,.10) 50%,
      rgba(255,255,255,.025) 67%,
      transparent 84%,
      rgba(255,255,255,.13) 100%
    );
  mix-blend-mode:screen;
}

.flip-front::after{
  content:"";
  position:absolute;
  inset:4px;
  z-index:1;
  pointer-events:none;
  border-radius:10px;
  background:
    repeating-linear-gradient(
      118deg,
      transparent 0px,
      transparent 6px,
      rgba(255,255,255,.018) 7px,
      transparent 8px
    ),
    linear-gradient(
      135deg,
      rgba(255,30,110,.055) 0%,
      transparent 22%,
      rgba(70,220,255,.055) 48%,
      transparent 73%,
      rgba(255,215,80,.05) 100%
    );
  mix-blend-mode:screen;
  opacity:.9;
}

.c-rare.flip-front::after{
  background:
    repeating-linear-gradient(
      118deg,
      transparent 0px,
      transparent 6px,
      rgba(255,255,255,.018) 7px,
      transparent 8px
    ),
    linear-gradient(
      135deg,
      rgba(170,100,255,.09),
      transparent 30%,
      rgba(80,210,255,.055) 52%,
      transparent 72%,
      rgba(255,120,210,.07)
    );
}

.c-ultra_rare.flip-front::after{
  background:
    repeating-linear-gradient(
      118deg,
      transparent 0px,
      transparent 6px,
      rgba(255,255,255,.018) 7px,
      transparent 8px
    ),
    linear-gradient(
      135deg,
      rgba(255,70,150,.10),
      transparent 27%,
      rgba(90,210,255,.065) 52%,
      transparent 72%,
      rgba(255,210,90,.075)
    );
}

.c-legendaire.flip-front::after{
  background:
    repeating-linear-gradient(
      118deg,
      transparent 0px,
      transparent 6px,
      rgba(255,255,255,.022) 7px,
      transparent 8px
    ),
    linear-gradient(
      135deg,
      rgba(255,220,120,.11),
      rgba(255,255,255,.035) 25%,
      rgba(190,220,255,.065) 50%,
      rgba(255,190,110,.09) 100%
    );
}

.flip-front .affiche,
.flip-front .infos{
  z-index:2;
}

.flip-front .badge-niveau{
  display:none !important;
}

.popup-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,0.78);
  display:flex; align-items:center; justify-content:center; z-index:100; padding:1.5rem;
}
.popup-overlay.hidden{ display:none; }

.popup-carte{
  background:var(--noir2); border-radius:16px; max-width:420px; width:100%;
  overflow:hidden; display:flex; flex-direction:column; max-height:90vh;
  box-shadow:0 24px 60px -12px rgba(0,0,0,0.7);
}

.popup-header{ display:flex; justify-content:flex-end; padding:0.5rem 0.5rem 0; }
.popup-close{ background:none; border:none; color:var(--argent); font-size:1.5rem; cursor:pointer; line-height:1; padding:0.3rem 0.6rem; }
.popup-close:hover{ color:var(--blanc); }

.popup-corps{ display:flex; gap:1.1rem; padding:0 1.2rem 1rem; overflow-y:auto; }
.popup-affiche{ width:140px; flex-shrink:0; aspect-ratio:2/3; border-radius:10px; overflow:hidden; position:relative; }
.popup-affiche img{ width:100%; height:100%; object-fit:contain; }

.popup-infos{ flex:1; min-width:0; }
.popup-rarete{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; font-weight:600; margin-bottom:0.4rem; text-transform:uppercase; letter-spacing:0.04em; }
.popup-titre{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem; margin-bottom:0.2rem; line-height:1.25; }
.popup-desc{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:var(--argent); margin-bottom:0.7rem; }
.popup-numero{ font-family:'IBM Plex Mono',monospace; font-size:0.65rem; color:var(--argent); margin-bottom:0.7rem; }

.popup-stats{ display:flex; gap:0.5rem; }
.popup-stat{ flex:1; background:var(--noir); border-radius:8px; padding:0.5rem 0.6rem; }
.popup-stat-label{ font-family:'IBM Plex Mono',monospace; font-size:0.58rem; color:var(--argent); text-transform:uppercase; }
.popup-stat-val{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.95rem; }

.popup-actions{ padding:1rem 1.2rem 1.2rem; border-top:1px solid var(--line); }
.popup-actions label{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--argent); margin-bottom:0.3rem; }
.popup-actions input{ width:100%; background:var(--noir); border:1px solid var(--line); color:var(--blanc); padding:0.5rem 0.7rem; border-radius:8px; font-size:0.85rem; margin-bottom:0.8rem; }
.popup-duree{ display:flex; gap:0.4rem; margin-bottom:0.9rem; }
.popup-duree button{ flex:1; background:var(--noir); border:1px solid var(--line); color:var(--argent); padding:0.4rem; border-radius:8px; font-family:'IBM Plex Mono',monospace; font-size:0.75rem; cursor:pointer; }
.popup-duree button.actif{ background:rgba(227,28,61,0.15); border-color:var(--rouge); color:var(--rouge); }
.popup-btn{ width:100%; padding:0.6rem; border-radius:100px; border:none; font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:0.85rem; cursor:pointer; margin-bottom:0.5rem; }
.popup-btn-vendre{ background:var(--rouge); color:var(--blanc); }
.popup-btn-defausser{ background:var(--noir); color:var(--argent); border:1px solid var(--line); }
.popup-btn-encherir{ background:var(--rouge); color:var(--blanc); }
.popup-btn-annuler{ background:var(--noir); color:var(--rouge); border:1px solid var(--rouge); }

.grille-simple{ display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:1rem; justify-items:center; }
.carte-vignette{ cursor:pointer; }
.carte-vignette .corps{ background:var(--noir2); border-radius:12px; overflow:hidden; position:relative; box-shadow:0 10px 22px -8px rgba(0,0,0,0.6); transition:transform 0.15s; }
.carte-vignette:hover .corps{ transform:translateY(-4px); }
.carte-vignette .affiche{ aspect-ratio:2/3; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.carte-vignette .affiche img{ width:100%; height:100%; object-fit:contain; }
.carte-vignette .badge-niveau{ position:absolute; top:6px; left:6px; z-index:3; width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.55rem; color:var(--noir); }
.carte-vignette .sous-info{ padding:0.4rem 0.5rem 0.5rem; font-family:'IBM Plex Mono',monospace; font-size:0.62rem; color:var(--argent); text-align:center; }
.carte-vignette.manquante .corps{ filter:grayscale(1); opacity:0.35; }

.carte-vignette.c-commune .affiche{ background:var(--commune-fond); }
.carte-vignette.c-commune .badge-niveau{ background:var(--commune); }
.carte-vignette.c-peu_commune .affiche{ background:var(--peucommune-fond); }
.carte-vignette.c-peu_commune .badge-niveau{ background:var(--peucommune); }
.carte-vignette.c-rare .affiche{ background:var(--rare-fond); }
.carte-vignette.c-rare .badge-niveau{ background:var(--rare); }
.carte-vignette.c-ultra_rare .affiche{ background:var(--ultrarare-fond); }
.carte-vignette.c-ultra_rare .badge-niveau{ background:var(--ultrarare); }
.carte-vignette.c-legendaire .affiche{ background:var(--legendaire-fond); }
.carte-vignette.c-legendaire .badge-niveau{ background:var(--legendaire); }

.popup-corps-2col{ display:flex; gap:1.3rem; padding:0.5rem 1.4rem 1rem; align-items:center; }
.popup-corps-carte{ display:flex; flex-direction:column; align-items:flex-start; flex-shrink:0; perspective:1200px; }
.popup-lexique{ flex:1; display:flex; flex-direction:column; gap:0.65rem; min-width:0; }
.popup-lexique-ligne{ display:flex; flex-direction:column; gap:0.15rem; }
.popup-lexique-label{ font-family:'IBM Plex Mono',monospace; font-size:0.62rem; color:var(--argent); text-transform:uppercase; letter-spacing:0.05em; }
.popup-lexique-val{ font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:0.92rem; color:var(--blanc); }

.sidebar-soldes{ display:flex; flex-direction:column; gap:0.6rem; margin-bottom:1.2rem; }
.sidebar-solde-item{ background:var(--noir); border:1px solid var(--line); border-radius:10px; padding:0.7rem 0.5rem; display:flex; flex-direction:column; align-items:center; gap:0.4rem; }
.sidebar-solde-item img{ width:24px; height:24px; object-fit:contain; }
.sidebar-solde-item span{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.85rem; color:var(--blanc); }
.badge-notif{ display:inline-flex; align-items:center; justify-content:center; min-width:16px; height:16px; padding:0 4px; background:var(--rouge); color:var(--blanc); border-radius:100px; font-size:0.62rem; font-weight:700; font-family:'IBM Plex Mono',monospace; float:right; margin-top:1px; }
.sidebar-recherche{ position:relative; margin:0.6rem 0; }
.sidebar-recherche input{ width:100%; background:var(--noir); border:1px solid var(--line); color:var(--blanc); padding:0.5rem 0.7rem; border-radius:8px; font-family:'IBM Plex Mono',monospace; font-size:0.75rem; }
.sidebar-resultats-joueur{ position:absolute; top:calc(100% + 4px); left:0; right:0; background:var(--noir2); border:1px solid var(--line); border-radius:8px; overflow:hidden; z-index:20; display:none; }
.sidebar-resultats-joueur.visible{ display:block; }
.sidebar-resultat-item{ padding:0.5rem 0.7rem; cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:0.75rem; }
.sidebar-resultat-item:hover{ background:rgba(255,255,255,0.05); }

.badge-wishlist{
  position:absolute; top:8px; right:8px; z-index:12;
  width:23px; height:23px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(227,28,61,0.9); color:#fff;
  font-size:0.9rem; line-height:1;
  border:1px solid rgba(255,255,255,.5);
  box-shadow:0 2px 8px rgba(0,0,0,.55), inset 0 1px 2px rgba(255,255,255,.3);
}

.badge-wishlist{
  position:absolute; top:8px; right:8px; z-index:12;
  width:23px; height:23px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(227,28,61,0.9); color:#fff;
  font-size:0.9rem; line-height:1;
  border:1px solid rgba(255,255,255,.5);
  box-shadow:0 2px 8px rgba(0,0,0,.55), inset 0 1px 2px rgba(255,255,255,.3);
}

.popup-titre-carte{
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.05rem;
  line-height:1.3; margin-bottom:0.8rem; word-wrap:break-word; overflow-wrap:break-word;
}

.popup-badge-possedee{
  display:inline-block; box-sizing:border-box; text-align:left;
  font-family:'IBM Plex Mono',monospace; font-size:0.55rem;
  color:var(--commune); background:rgba(205,242,225,0.08); border:1px solid rgba(205,242,225,0.2);
  padding:0.1rem 0.4rem; border-radius:4px; margin-bottom:0.4rem;
}
.popup-badge-non-possedee{
  display:inline-block; box-sizing:border-box; text-align:left;
  font-family:'IBM Plex Mono',monospace; font-size:0.55rem;
  color:var(--rouge); background:rgba(227,28,61,0.08); border:1px solid rgba(227,28,61,0.2);
  padding:0.1rem 0.4rem; border-radius:4px; margin-bottom:0.4rem;
}

/* Effet spécial révélation Légendaire */
.carte-flip.legendaire-reveal .flip-inner{
  transition:transform 3s cubic-bezier(.2,.75,.2,1) !important;
}
.flip-front.c-legendaire.holo-actif::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(
    100deg,
    transparent 0%,
    rgba(255,255,255,0.2) 45%,
    rgba(255,255,255,0.45) 50%,
    rgba(255,255,255,0.2) 55%,
    transparent 100%
  );
  mix-blend-mode:overlay;
  pointer-events:none;
  z-index:5;
  animation:balayageHoloLegendaire 2.6s ease-in-out infinite;
}
@keyframes balayageHoloLegendaire{
  0%{ transform:translateX(-120%); opacity:0; }
  8%{ opacity:1; }
  35%{ transform:translateX(120%); opacity:0; }
  100%{ transform:translateX(120%); opacity:0; }
}

/* Navigation mobile */
.mobile-nav{
  display:none;
  position:fixed; bottom:0; left:0; right:0; z-index:100;
  background:var(--noir2); border-top:1px solid var(--line);
  padding:0.5rem 0.3rem calc(0.5rem + env(safe-area-inset-bottom));
  justify-content:space-around; align-items:center;
}
.mobile-nav a, .mobile-nav button{
  display:flex; flex-direction:column; align-items:center; gap:0.15rem;
  color:var(--argent); text-decoration:none; background:none; border:none;
  font-family:'IBM Plex Mono',monospace; font-size:0.62rem; padding:0.3rem;
  cursor:pointer;
}
.mobile-nav a span:first-child, .mobile-nav button span:first-child{ display:flex; align-items:center; justify-content:center; }
.mobile-nav a svg, .mobile-nav button svg{ display:block; }
.mobile-nav a.actif{ color:var(--rouge); }

.mobile-drawer{
  display:none;
  position:fixed; inset:0; z-index:200;
  background:rgba(0,0,0,0.7);
}
.mobile-drawer.ouvert{ display:block; }
.mobile-drawer-contenu{
  position:absolute; bottom:0; left:0; right:0;
  background:var(--noir2); border-top:1px solid var(--line);
  border-radius:16px 16px 0 0;
  padding:1.5rem 1rem calc(1.5rem + env(safe-area-inset-bottom));
  display:flex; flex-direction:column; gap:0.3rem;
  max-height:70vh; overflow-y:auto;
}
.mobile-drawer-contenu a, .mobile-drawer-contenu span.desactive{
  display:flex; align-items:center; gap:0.8rem;
  color:var(--argent); text-decoration:none; font-family:'IBM Plex Mono',monospace;
  font-size:0.9rem; padding:0.8rem; border-radius:8px;
}
.drawer-icone{ display:flex; align-items:center; justify-content:center; width:20px; flex-shrink:0; }
.drawer-icone svg{ display:block; }
.mobile-drawer-contenu a.actif{ background:rgba(227,28,61,0.12); color:var(--rouge); }
.mobile-drawer-contenu span.desactive{ opacity:0.35; }

@media (max-width:768px){
  .mobile-nav{ display:flex; }
  body{ padding-bottom:70px; }
}

/* Barre de soldes mobile */
.mobile-soldes-bar{
  display:none;
  position:fixed; top:0; left:0; right:0; z-index:99;
  background:var(--noir2); border-bottom:1px solid var(--line);
  padding:0.5rem 1rem calc(0.5rem + env(safe-area-inset-top));
  justify-content:space-around; align-items:center;
}
.mobile-solde-item{
  display:flex; align-items:center; gap:0.3rem;
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.75rem; color:var(--blanc);
}
.mobile-solde-item img{ width:16px; height:16px; object-fit:contain; }

@media (max-width:768px){
  .mobile-soldes-bar{ display:flex; }
  body{ padding-top:40px; }
}

/* Étincelles pour nouvelle Légendaire dans la collection */
.carte-flip.legendaire-reveal .flip-front.c-legendaire.nouvelle-carte{
  border:2px solid #fff8dc !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08), 0 0 22px rgba(253,183,86,0.7), inset 0 0 0 1px rgba(255,255,255,.1) !important;
}
.etincelle-carte{
  position:absolute; width:14px; height:14px; z-index:20; pointer-events:none;
  clip-path: polygon(50% 0%, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0% 50%, 39% 39%);
  animation: scintillerCarte 1.6s ease-in-out infinite;
  opacity:0;
}
.etincelle-carte.etincelle-commune{ background:radial-gradient(circle, #ffffff 0%, var(--commune) 40%, transparent 75%); }
.etincelle-carte.etincelle-peu_commune{ background:radial-gradient(circle, #ffffff 0%, var(--peucommune) 40%, transparent 75%); }
.etincelle-carte.etincelle-rare{ background:radial-gradient(circle, #ffffff 0%, var(--rare) 40%, transparent 75%); }
.etincelle-carte.etincelle-ultra_rare{ background:radial-gradient(circle, #ffffff 0%, var(--ultrarare) 40%, transparent 75%); }
.etincelle-carte.etincelle-legendaire{ background:radial-gradient(circle, #fffbe6 0%, var(--legendaire) 40%, transparent 75%); }
@keyframes scintillerCarte{
  0%, 100%{ opacity:0; transform:scale(0.3) rotate(0deg); }
  50%{ opacity:1; transform:scale(1.1) rotate(90deg); }
}
.etincelle-1{ top:-10px; left:5%; animation-delay:0s; }
.etincelle-2{ top:15%; right:-12px; width:10px; height:10px; animation-delay:0.4s; }
.etincelle-3{ bottom:20%; left:-14px; animation-delay:0.8s; }
.etincelle-4{ bottom:-10px; right:15%; width:18px; height:18px; animation-delay:1.1s; }
.etincelle-5{ top:40%; left:-8px; width:9px; height:9px; animation-delay:1.4s; }
.etincelle-6{ top:-8px; right:20%; width:11px; height:11px; animation-delay:0.6s; }