/*

  PROFILE CARD — single full-card image front

*/

.card.profile-card {
  --card-aspect: 0.7148;
  --card-glow: hsl(175, 40%, 55%);
  /* Photo frame bounds on jac-card.png (1128×714 in 1222×1738 Figma frame) */
  --clip-photo: inset(9.78% 8% 52.85% 8%);
}

.card.profile-card .card__rotator .card__front.profile-card__front {
  position: relative;
  display: grid !important;
  overflow: hidden;
}

.card.profile-card .card__rotator .profile-card__front img.profile-card__image {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: var(--card-aspect) !important;
  object-fit: cover;
  display: block !important;
  grid-area: 1 / 1 !important;
  border-radius: inherit;
  transform: translate3d(0, 0, 0.01px) !important;
}

.profile-card .card__shine {
  z-index: 2;
}

.profile-card .card__glare {
  z-index: 3;
}

.card.profile-card .card__rotator .profile-card__front img.profile-card__image {
  z-index: 1;
}

/* Holofoil texture — photo frame only */
.card.profile-card[data-rarity="rare holo"] .card__shine,
.card.profile-card[data-rarity="rare holo"] .card__shine::before,
.card.profile-card[data-rarity="rare holo"] .card__shine::after,
.card.profile-card[data-rarity="rare holo v"] .card__shine,
.card.profile-card[data-rarity="rare holo v"] .card__shine::before,
.card.profile-card[data-rarity="rare holo v"] .card__shine::after {
  clip-path: var(--clip-photo);
}

/* Pointer glare — full card (not clipped to photo) */
.card.profile-card[data-rarity="rare holo"] .card__glare,
.card.profile-card[data-rarity="rare holo"] .card__glare::after,
.card.profile-card[data-rarity="rare holo v"] .card__glare,
.card.profile-card[data-rarity="rare holo v"] .card__glare::after {
  clip-path: none;
}

/* Person cutout — sits above holo, never blended with shine/glare */
.card.profile-card .card__rotator .profile-card__overlay {
  position: absolute;
  inset: 0;
  z-index: 10;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: top center;
  display: block !important;
  grid-area: unset !important;
  aspect-ratio: unset !important;
  border-radius: inherit;
  transform: translateZ(2px) !important;
  -webkit-transform: translateZ(2px) !important;
  transform-style: flat;
  -webkit-transform-style: flat;
  mix-blend-mode: normal;
  isolation: isolate;
  filter: none;
  opacity: 1;
  pointer-events: none;
  backface-visibility: hidden;
}

/* Loading skeleton — match site-wide #181818 shimmer style */
.card.profile-card {
  position: relative;
}

.card.profile-card.loading .card__translater {
  opacity: 0;
  visibility: hidden;
}

.profile-card__skeleton {
  position: absolute;
  inset: 0;
  z-index: 5;
  width: 100%;
  aspect-ratio: var(--card-aspect);
  border-radius: var(--card-radius);
  background: #181818;
  overflow: hidden;
  pointer-events: none;
}
