@keyframes ClaimReveal_pack-scale-in__9Z0ak {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes ClaimReveal_pack-top-slice__2bb8_ {
  0% {
    transform: translateY(0);
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
  }
  100% {
    transform: translateY(-100px) rotate(-6deg);
    opacity: 0;
    clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
  }
}

@keyframes ClaimReveal_pack-bottom-fade__GGgnW {
  0% {
    opacity: 1;
    clip-path: polygon(0 10%, 100% 10%, 100% 100%, 0 100%);
  }
  100% {
    opacity: 0;
    clip-path: polygon(0 10%, 100% 10%, 100% 100%, 0 100%);
  }
}

@keyframes ClaimReveal_card-fan-in__4EoEK {
  0% {
    opacity: 0;
    transform: translateY(50px) rotate(0deg) scale(0.8);
    filter: blur(3px);
  }
  100% {
    opacity: 1;
    transform: translateY(var(--fan-y, 0)) rotate(var(--fan-rotation, 0deg)) scale(1);
    filter: blur(0);
  }
}

@keyframes ClaimReveal_card-flip__yhMXq {
  0% {
    transform: translateY(var(--fan-y, 0)) rotate(var(--fan-rotation, 0deg)) rotateX(0deg) rotateY(0deg) scale(1);
  }
  35% {
    transform: translateY(-25px) rotate(0deg) rotateX(-15deg) rotateY(0deg) scale(var(--flip-scale-mid));
  }
  45% {
    transform: translateY(-22px) rotate(0deg) rotateX(-10deg) rotateY(0deg) scale(var(--flip-scale-mid));
  }
  70% {
    transform: translateY(-20px) rotate(0deg) rotateX(0deg) rotateY(90deg) scale(var(--flip-scale-end));
  }
  100% {
    transform: translateY(-20px) rotate(0deg) rotateX(0deg) rotateY(180deg) scale(var(--flip-scale-end));
  }
}

@keyframes ClaimReveal_card-exit-left__edZ6p {
  0% {
    opacity: 1;
    transform: translateX(0) translateY(-20px) rotateY(180deg) scale(var(--flip-scale-end));
    filter: blur(0);
  }
  100% {
    opacity: 0;
    transform: translateX(-150px) translateY(60px) rotateY(90deg) rotate(20deg) scale(0.7);
    filter: blur(4px);
  }
}

.ClaimReveal_backdrop__IW2Bz {
  --pack-w: clamp(260px, 65vw, 320px);
  --pack-h: clamp(363px, 91vw, 447px);
  --card-w: clamp(240px, 60vw, 288px);
  --card-h: clamp(335px, 84vw, 403px);
  --container-w: clamp(360px, 90vw, 720px);
  --container-h: clamp(380px, 90vw, 540px);
  --flip-scale-mid: 1.02;
  --flip-scale-end: 1.05;
  --cut-delay: 0ms;
}

@media (min-width: 640px) {
  .ClaimReveal_backdrop__IW2Bz {
    --flip-scale-mid: 1.08;
    --flip-scale-end: 1.2;
  }
}

.ClaimReveal_pack__tVZ2u {
  animation: ClaimReveal_pack-scale-in__9Z0ak 0.5s ease-out forwards;
}

.ClaimReveal_packTopSlice___mgrD {
  animation: ClaimReveal_pack-top-slice__2bb8_ 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  animation-delay: var(--cut-delay, 0ms);
}

.ClaimReveal_packBottomFade__UrKe8 {
  animation: ClaimReveal_pack-bottom-fade__GGgnW 0.4s ease-out forwards;
  animation-delay: calc(var(--cut-delay, 0ms) + 200ms);
}

.ClaimReveal_slash__ijhpp {
  animation-delay: calc(var(--cut-delay, 0ms) - 200ms);
}

.ClaimReveal_packTopStatic__k_vJh {
  clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
}

.ClaimReveal_packBottomStatic__KFJfs {
  clip-path: polygon(0 10%, 100% 10%, 100% 100%, 0 100%);
}

.ClaimReveal_cardFan__zrqCV {
  animation: ClaimReveal_card-fan-in__4EoEK 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  animation-delay: var(--fan-delay, 0ms);
  opacity: 0;
}

.ClaimReveal_cardFlip__QlVO1 {
  animation-name: ClaimReveal_card-flip__yhMXq;
  animation-duration: 0.8s;
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  animation-fill-mode: forwards;
  transform-style: preserve-3d;
}

.ClaimReveal_cardExitLeft__SYSlR {
  animation-name: ClaimReveal_card-exit-left__edZ6p;
  animation-duration: 0.4s;
  animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
  animation-fill-mode: both;
}

.ClaimReveal_cardDepthBlur__DM_Zf {
  filter: blur(var(--depth-blur, 0)) brightness(var(--depth-brightness, 1)) !important;
}

.ClaimReveal_cardReadyToFlip__riYvM {
  cursor: pointer;
  transition: scale 0.2s ease-out;
}

.ClaimReveal_cardReadyToFlip__riYvM:hover {
  scale: 1.01;
}

.ClaimReveal_cardReadyToFlip__riYvM::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: url('/images/rewards/referral/tcg/card-texture-illusion.png');
  background-size: 33%;
  opacity: 0.01;
  transition: opacity 0.2s ease-out;
  pointer-events: none;
}

.ClaimReveal_cardReadyToFlip__riYvM:hover::after {
  opacity: 0.03;
}

/* RevealCard - wrapper for PokemonCard with flip animation
   Note: Parent Card component's .cardFlip animation handles the actual rotation.
   RevealCard just positions both faces with backface-visibility. */
.ClaimReveal_revealCard__ovKeQ {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  overflow: visible;
}

.ClaimReveal_revealCardBack__QrEah,
.ClaimReveal_revealCardFront__F6qpG {
  position: absolute;
  inset: 0;
  border-radius: 0.5rem;
  overflow: visible;
}

.ClaimReveal_revealCardBack__QrEah {
  transform: rotateY(0deg);
  backface-visibility: hidden;
}

/* Hide back face after reveal to prevent it showing during exit */
.ClaimReveal_revealCardBackHidden___CLKM {
  visibility: hidden;
}

.ClaimReveal_revealCardFront__F6qpG {
  transform: rotateY(180deg);
  backface-visibility: hidden;
  --card-width: 100%;
}

/* After flip complete: make front face always visible (for exit animation) */
.ClaimReveal_revealCardFrontVisible__LEmld {
  backface-visibility: visible;
}

/* Interactive TCG-style card effect */

/* ===========================
   BASE STYLES / VARIABLES
   =========================== */

.PokemonCard_card__d1RxG {
  /* Base variables (moved from :root for CSS Modules compatibility) */
  --card-aspect: 0.718;
  --card-radius: 4.55% / 3.5%;
  --card-edge: hsl(47, 100%, 78%);
  --card-back: hsl(205, 100%, 25%);
  --card-glow: hsl(175, 100%, 90%);
  --sunpillar-1: hsl(2, 100%, 73%);
  --sunpillar-2: hsl(53, 100%, 69%);
  --sunpillar-3: hsl(93, 100%, 69%);
  --sunpillar-4: hsl(176, 100%, 76%);
  --sunpillar-5: hsl(228, 100%, 74%);
  --sunpillar-6: hsl(283, 100%, 73%);
  --sunpillar-clr-1: var(--sunpillar-1);
  --sunpillar-clr-2: var(--sunpillar-2);
  --sunpillar-clr-3: var(--sunpillar-3);
  --sunpillar-clr-4: var(--sunpillar-4);
  --sunpillar-clr-5: var(--sunpillar-5);
  --sunpillar-clr-6: var(--sunpillar-6);

  --space: 5%;
  --angle: 133deg;
  --imgsize: cover;

  /* Dynamic CSS variables - set via JS, defaults here */
  --pointer-x: 50%;
  --pointer-y: 50%;
  --card-scale: 1;
  --card-opacity: 0;
  --translate-x: 0px;
  --translate-y: 0px;
  --rotate-x: 0deg;
  --rotate-y: 0deg;
  --background-x: 50%;
  --background-y: 50%;
  --pointer-from-center: 0;
  --pointer-from-top: 0.5;
  --pointer-from-left: 0.5;

  /* place the card on a new transform layer and
  make sure it has hardware acceleration... we gun'need that! */
  transform: translate3d(0px, 0px, 0.01px);
  pointer-events: none;

  /* make sure the card is above others if it's scaled up */
  z-index: calc(var(--card-scale) * 2);

  /* every little helps! */
  will-change: transform, visibility, z-index;
  /* this prevents major problems in firefox, but also causes a bit of
  clipping as the card animates to/from active state. worth it. */
  transform-style: preserve-3d;
}

.PokemonCard_card__d1RxG,
.PokemonCard_card__d1RxG * {
  /* outline is a little trick to anti-alias */
  outline: 1px solid transparent;
}

.PokemonCard_interactive___AimM {
  /* marker class for cards in interactive mode (framework-controlled) */
  cursor: grab;
}

.PokemonCard_card__d1RxG:not(.PokemonCard_interactive___AimM) .PokemonCard_card__translater__9mLAH,
.PokemonCard_card__d1RxG:not(.PokemonCard_interactive___AimM) .PokemonCard_card__rotator__J2f5N,
.PokemonCard_card__d1RxG:not(.PokemonCard_interactive___AimM) .PokemonCard_card__shine__Y_3p_,
.PokemonCard_card__d1RxG:not(.PokemonCard_interactive___AimM) .PokemonCard_card__glare__fCtd5 {
  /* if this card is not in a framework, we can add simply
    hover effects when it's not "interactive" */
  transition: all 0.3s ease;
}

.PokemonCard_card__d1RxG:not(.PokemonCard_interactive___AimM):hover {
  --pointer-x: 25% !important;
  --pointer-y: 10% !important;
  --card-scale: 1.1 !important;
  --card-opacity: 1 !important;
  --translate-x: 0px !important;
  --translate-y: -10px !important;
  --rotate-x: 7deg !important;
  --rotate-y: -19deg !important;
  --background-x: 44% !important;
  --background-y: 36% !important;
  --pointer-from-center: 0.9 !important;
  --pointer-from-top: 0.11 !important;
  --pointer-from-left: 0.25 !important;
}

.PokemonCard_card__d1RxG {
  width: var(--card-width, 280px);
  aspect-ratio: var(--card-aspect);
  border-radius: var(--card-radius);
}

.PokemonCard_card__rotator__J2f5N {
  width: 100%;
  height: 100%;
  aspect-ratio: var(--card-aspect);
  border-radius: var(--card-radius);
}

.PokemonCard_card__d1RxG.PokemonCard_interacting__f8KEK {
  z-index: calc(var(--card-scale) * 120);
}

.PokemonCard_card__d1RxG.PokemonCard_active__DDpID .PokemonCard_card__translater__9mLAH,
.PokemonCard_card__d1RxG.PokemonCard_active__DDpID .PokemonCard_card__rotator__J2f5N {
  /* prevent pinch/double-tap zooms on card */
  touch-action: none;
}

.PokemonCard_card__translater__9mLAH,
.PokemonCard_card__rotator__J2f5N {
  display: grid;
  perspective: 600px;
  will-change: transform, box-shadow;
  transform-origin: center;
  -webkit-transform-origin: center;
  transform-style: preserve-3d;
}

.PokemonCard_card__translater__9mLAH {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translate3d(var(--translate-x), var(--translate-y), 0.1px) scale(var(--card-scale));
}

.PokemonCard_card__rotator__J2f5N {
  /* Matching original: rotateY uses --rotate-x, rotateX uses --rotate-y */
  transform: rotateY(var(--rotate-x)) rotateX(var(--rotate-y));
  transform-style: preserve-3d;
  -webkit-transform: rotateY(var(--rotate-x)) rotateX(var(--rotate-y));
  -webkit-transform-style: preserve-3d;

  /* performance */
  pointer-events: auto;
  /* overflow: hidden; <-- this improves perf on mobile, but breaks backface visibility. */
  /* isolation: isolate; <-- this improves perf, but breaks backface visibility on Chrome. */
}

button.PokemonCard_card__rotator__J2f5N {
  /* because the card is a button, there's some default
    browser styles which need to be subdued */
  border: none;
  background: transparent;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.PokemonCard_card__rotator__J2f5N,
.PokemonCard_card__d1RxG.PokemonCard_active__DDpID .PokemonCard_card__rotator__J2f5N:focus {
  transition:
    box-shadow 0.4s ease,
    opacity 0.33s ease-out;
  box-shadow:
    0 0 3px -1px transparent,
    0 0 2px 1px transparent,
    0 0 5px 0px transparent,
    0px 10px 20px -5px black,
    0 2px 15px -5px black,
    0 0 20px 0px transparent;
}

.PokemonCard_card__d1RxG.PokemonCard_active__DDpID .PokemonCard_card__rotator__J2f5N,
.PokemonCard_card__rotator__J2f5N:focus,
.PokemonCard_alwaysGlow__6zNn5 {
  box-shadow:
    0 0 3px -1px white,
    0 0 3px 1px var(--card-edge),
    0 0 12px 2px var(--card-glow),
    0px 10px 20px -5px black,
    0 0 40px -30px var(--card-glow),
    0 0 50px -20px var(--card-glow);
}

.PokemonCard_card__rotator__J2f5N * {
  width: 100%;
  display: grid;
  grid-area: 1/1;
  aspect-ratio: var(--card-aspect);
  border-radius: var(--card-radius);
  image-rendering: optimizeQuality;
  transform-style: preserve-3d;
  pointer-events: none;
  overflow: hidden;
}

.PokemonCard_card__rotator__J2f5N img {
  height: auto;
}

.PokemonCard_card__rotator__J2f5N img:not(.PokemonCard_card__back__AeXtI) {
  transform: translate3d(0px, 0px, 0.01px);
}

.PokemonCard_card__back__AeXtI {
  background-color: var(--card-back);
  transform: rotateY(180deg) translateZ(1px);
  backface-visibility: visible;
}

.PokemonCard_card__front__6eIRj,
.PokemonCard_card__front__6eIRj * {
  backface-visibility: hidden;
}

.PokemonCard_card__front__6eIRj {
  opacity: 1;
  transition: opacity 0.33s ease-out;
  transform: translate3d(0px, 0px, 0.01px);
}

.PokemonCard_loading__hsbsP .PokemonCard_card__front__6eIRj {
  opacity: 0;
}

.PokemonCard_loading__hsbsP .PokemonCard_card__back__AeXtI {
  transform: rotateY(0deg);
}

/* ===========================
   SHINE & GLARE EFFECTS
   =========================== */

.PokemonCard_card__shine__Y_3p_,
.PokemonCard_card__glare__fCtd5 {
  will-change:
    transform, opacity, background-image, background-size, background-position, background-blend-mode, filter;
}

.PokemonCard_card__shine__Y_3p_ {
  display: grid;
  transform: translateZ(1px);
  overflow: hidden;
  z-index: 3;
  background: transparent;
  background-size: cover;
  background-position: center;
  filter: brightness(0.85) contrast(2.75) saturate(0.65);
  mix-blend-mode: color-dodge;
  opacity: var(--card-opacity);
}

.PokemonCard_card__shine__Y_3p_:before,
.PokemonCard_card__shine__Y_3p_:after {
  --sunpillar-clr-1: var(--sunpillar-5);
  --sunpillar-clr-2: var(--sunpillar-6);
  --sunpillar-clr-3: var(--sunpillar-1);
  --sunpillar-clr-4: var(--sunpillar-2);
  --sunpillar-clr-5: var(--sunpillar-3);
  --sunpillar-clr-6: var(--sunpillar-4);
  grid-area: 1/1;
  transform: translateZ(1px);
  border-radius: var(--card-radius);
}

.PokemonCard_card__shine__Y_3p_:after {
  --sunpillar-clr-1: var(--sunpillar-6);
  --sunpillar-clr-2: var(--sunpillar-1);
  --sunpillar-clr-3: var(--sunpillar-2);
  --sunpillar-clr-4: var(--sunpillar-3);
  --sunpillar-clr-5: var(--sunpillar-4);
  --sunpillar-clr-6: var(--sunpillar-5);
  transform: translateZ(1.2px);
}

.PokemonCard_card__glare__fCtd5 {
  /* make sure the glare doesn't clip */
  transform: translateZ(1.41px);
  overflow: hidden;
  background-image: radial-gradient(
    farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.8) 10%,
    hsla(0, 0%, 100%, 0.65) 20%,
    hsla(0, 0%, 0%, 0.5) 90%
  );
  opacity: var(--card-opacity);
  mix-blend-mode: overlay;
}

/* ===========================
   MASKING EFFECTS
   =========================== */

.PokemonCard_card__d1RxG.PokemonCard_masked__PKp_P .PokemonCard_card__shine__Y_3p_,
.PokemonCard_card__d1RxG.PokemonCard_masked__PKp_P .PokemonCard_card__shine__Y_3p_:before,
.PokemonCard_card__d1RxG.PokemonCard_masked__PKp_P .PokemonCard_card__shine__Y_3p_:after {
  /** masking image for cards which are masked **/
  -webkit-mask-image: var(--mask);
  mask-image: var(--mask);
  -webkit-mask-size: cover;
  mask-size: cover;
  -webkit-mask-position: center center;
  mask-position: center center;
}

/* ===========================
   RARE SHINY V (ULTRA RARE)
   =========================== */

/* SHINE LAYERS */
.PokemonCard_card__d1RxG[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_,
.PokemonCard_card__d1RxG[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:after {
  --space: 5%;
  --angle: 133deg;
  --imgsize: cover;

  background-image:
    var(--foil),
    repeating-linear-gradient(
      0deg,
      var(--sunpillar-clr-1) calc(var(--space) * 1),
      var(--sunpillar-clr-2) calc(var(--space) * 2),
      var(--sunpillar-clr-3) calc(var(--space) * 3),
      var(--sunpillar-clr-4) calc(var(--space) * 4),
      var(--sunpillar-clr-5) calc(var(--space) * 5),
      var(--sunpillar-clr-6) calc(var(--space) * 6),
      var(--sunpillar-clr-1) calc(var(--space) * 7)
    ),
    repeating-linear-gradient(
      var(--angle),
      #0e152e 0%,
      hsl(180, 10%, 60%) 3.8%,
      hsl(180, 29%, 66%) 4.5%,
      hsl(180, 10%, 60%) 5.2%,
      #0e152e 10%,
      #0e152e 12%
    ),
    radial-gradient(
      farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(0, 0%, 0%, 0.1) 12%,
      hsla(0, 0%, 0%, 0.15) 20%,
      hsla(0, 0%, 0%, 0.25) 120%
    );

  background-position:
    center center,
    0% var(--background-y),
    calc(var(--background-x) + (var(--background-y) * 0.2)) var(--background-y),
    var(--background-x) var(--background-y);

  background-blend-mode: soft-light, hue, hard-light;
  background-size:
    var(--imgsize),
    200% 700%,
    300% 100%,
    200% 100%;

  filter: brightness(calc((var(--pointer-from-center) * 0.4) + 0.4)) contrast(1.4) saturate(2.25);
}

.PokemonCard_card__d1RxG[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:after {
  content: '';

  background-position:
    center center,
    0% var(--background-y),
    calc((var(--background-x) + (var(--background-y) * 0.2)) * -1) calc(var(--background-y) * -1),
    var(--background-x) var(--background-y);

  background-size:
    var(--imgsize),
    200% 400%,
    195% 100%,
    200% 100%;

  filter: brightness(calc((var(--pointer-from-center) * 0.4) + 0.8)) contrast(1.5) saturate(1.25);
  mix-blend-mode: exclusion;
}

.PokemonCard_card__d1RxG[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:before {
  content: '';
  -webkit-mask-image: none;
  mask-image: none;

  background-image: radial-gradient(
    farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 100%) 0%,
    hsla(0, 0%, 0%, 0) 40%
  );
  background-position: center;
  background-size: cover;
  mix-blend-mode: overlay;

  opacity: 0.75;
  z-index: 1;
}

/* GLARE LAYERS */
.PokemonCard_card__d1RxG[data-rarity='rare shiny v'] .PokemonCard_card__glare__fCtd5 {
  background-image: radial-gradient(
    farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 90%) 5%,
    hsl(200, 5%, 45%) 80%,
    hsl(320, 40%, 10%) 150%
  );

  background-size: 120% 140%;
  background-position: center center;

  mix-blend-mode: darken;
  filter: brightness(0.88) contrast(2.25) saturate(0.7);

  opacity: calc(var(--card-opacity) * var(--pointer-from-center) * 0.75);
}

/* NO MASK */
.PokemonCard_card__d1RxG:not(.PokemonCard_masked__PKp_P)[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_,
.PokemonCard_card__d1RxG:not(.PokemonCard_masked__PKp_P)[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:after {
  --mask: none;
  --foil: url('/images/rewards/referral/tcg/card-texture-illusion.png');
  --imgsize: 33%;

  -webkit-mask-image: var(--mask);
  mask-image: var(--mask);
  -webkit-mask-size: var(--imgsize);
  mask-size: var(--imgsize);

  background-blend-mode: exclusion, hue, hard-light;
  filter: brightness(calc((var(--pointer-from-center) * 0.3) + 0.35)) contrast(2) saturate(1.5);
}

.PokemonCard_card__d1RxG:not(.PokemonCard_masked__PKp_P)[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:before {
  content: none;
  display: none;
}

.PokemonCard_card__d1RxG:not(.PokemonCard_masked__PKp_P)[data-rarity='rare shiny v'] .PokemonCard_card__shine__Y_3p_:after {
  filter: brightness(calc((var(--pointer-from-center) * 0.5) + 0.8)) contrast(1.6) saturate(1.4);
}

