/* EduGames katalogi uchun alohida dekor qatlam.
   Asosiy karta uslubi style.css da qoladi; bu faylni olib tashlash
   kartalarning ishlashiga yoki joylashuviga ta'sir qilmaydi. */
.game-card .art.card-art-fx {
  position: relative;
  width: 138px;
  height: 138px;
}

.game-card .art.card-art-fx img {
  position: relative;
  z-index: 2;
}

.game-card .art.card-art-fx::before,
.game-card .art.card-art-fx::after {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  color: #fff;
}

.game-card .art.card-art-fx::before {
  content: "";
  inset: -13px;
  opacity: .75;
  background: repeating-conic-gradient(from 4deg at 50% 50%, transparent 0 12deg, rgba(255,255,255,.88) 13deg 15deg, transparent 16deg 45deg);
  -webkit-mask: radial-gradient(circle, transparent 0 58%, #000 60% 67%, transparent 69%);
  mask: radial-gradient(circle, transparent 0 58%, #000 60% 67%, transparent 69%);
}

.game-card .art.card-art-fx::after {
  font-size: 28px;
  line-height: 1;
}

.game-card:hover .card-art-fx::before { animation: cardFxPulse .8s ease-in-out infinite alternate; }
.game-card:hover .card-art-fx::after { animation: cardFxTwinkle .65s ease-in-out infinite alternate; }
@keyframes cardFxPulse { to { opacity: 1; scale: 1.07; } }
@keyframes cardFxTwinkle { to { opacity: .55; scale: .88; } }

.game-card .fx-speed::before { transform: rotate(82deg) scaleX(.72); }
.game-card .fx-speed::after { content: "➤"; left: -23px; top: 55px; font-size: 22px; opacity: .75; text-shadow: -17px 0 0 rgba(255,255,255,.42); }
.game-card .fx-play::after { content: "▶"; z-index: 3; left: 57px; top: 54px; font-size: 29px; text-shadow: 0 3px 7px rgba(15,23,42,.28); }
.game-card .fx-memory::after { content: "│"; top: -13px; left: 67px; font-size: 28px; text-shadow: -47px 36px 0 #fff, 47px 36px 0 #fff; opacity: .9; }
.game-card .fx-spark::after { content: "✦"; left: -14px; top: 25px; color: #ffe55c; text-shadow: 145px 58px 0 #ffe55c, 16px 105px 0 rgba(255,229,92,.9); }
.game-card .fx-lines::after { content: ""; left: -18px; top: 63px; width: 17px; height: 4px; border-radius: 9px; background: #fff; box-shadow: 5px -18px 0 -1px rgba(255,255,255,.85), 5px 18px 0 -1px rgba(255,255,255,.85), 156px 0 0 #fff; opacity: .85; }
.game-card .fx-stars::after { content: "✦"; left: -6px; top: 13px; color: #ffd92f; font-size: 33px; text-shadow: 127px 64px 0 #ffd92f, 23px 105px 0 #ffd92f; }

@media (max-width: 480px) {
  .game-card .art.card-art-fx { width: 88px; height: 88px; }
}

@media (prefers-reduced-motion: reduce) {
  .game-card:hover .card-art-fx::before,
  .game-card:hover .card-art-fx::after { animation: none; }
}