/* 034TEST: visual preview only. No character attributes or player data changed. */
.collectible-card.rarity-card.frame-preview-v1 { --preview-color: #aeb4bd; }
/* A decoração pode ultrapassar a caixa da carta sem ser recortada. */
.collectible-card.rarity-card.frame-preview-v1 { overflow: visible !important; }
/* A moldura aprovada tem 115% de altura; reservar espaço entre linhas evita
   que a parte inferior de uma carta encoste na seguinte. */
.cards.rarity-cards { row-gap: 105px !important; }
@media (max-width:720px) { .cards.rarity-cards { row-gap: 80px !important; } }
.collectible-card.rarity-card.frame-preview-v1.rarity-uncommon { --preview-color: #33d978; }
.collectible-card.rarity-card.frame-preview-v1.rarity-rare { --preview-color: #37a7ff; }
.collectible-card.rarity-card.frame-preview-v1.rarity-epic { --preview-color: #c36aff; }
.collectible-card.rarity-card.frame-preview-v1.rarity-legendary { --preview-color: #ffcb43; }
.collectible-card.rarity-card.frame-preview-v1.rarity-mythic { --preview-color: #ff4258; }

.rarity-card.frame-preview-v1::after { display: none !important; }
.rarity-card.frame-preview-v1 .mc-card-stats { display: none !important; }
.rarity-card.frame-preview-v1 .rarity-image-overlay,
.rarity-card.frame-preview-v1 .nyte-card-border { opacity: 0 !important; }
.rarity-card.frame-preview-v1 .mc-card-portrait-window { z-index: 2; }
.rarity-card.frame-preview-v1 .mc-card-name { z-index: 14 !important; }
.rarity-card.frame-preview-v1 .mc-card-name[aria-label]::after {
  top: 43% !important;
  font-size: calc(var(--mc-name-size, 50px) * .9) !important;
}

.rarity-card.frame-preview-v1 .rarity-preview-frame {
  position: absolute; inset: 0; overflow: visible; pointer-events: none; z-index: 12;
}
.rarity-card.frame-preview-v1 .rarity-preview-art-top {
  position: absolute; inset: 0; height: 100%; overflow: visible; z-index: 2;
}
.rarity-card.frame-preview-v1 .rarity-preview-art-top img {
  display: block; width: 110%; max-width: none; height: 100%;
  object-fit: fill;
  transform: translateX(-4.545%);
  /* Retém somente a borda externa, removendo os números embutidos na imagem. */
  -webkit-mask-image: linear-gradient(to right,#000 0 12%,transparent 12% 88%,#000 88% 100%),linear-gradient(to bottom,#000 0 11%,transparent 11% 95%,#000 95% 100%);
  mask-image: linear-gradient(to right,#000 0 12%,transparent 12% 88%,#000 88% 100%),linear-gradient(to bottom,#000 0 11%,transparent 11% 95%,#000 95% 100%);
  -webkit-mask-composite: source-over;
  mask-composite: add;
}
.rarity-card.frame-preview-v1 .rarity-preview-stats {
  position: absolute; left: 2.5%; right: 2.5%; bottom: 2.1%; height: 42.1%;
  z-index: 1;
  box-sizing: border-box; padding: 3.5% 2.3% 2%; display: flex;
  flex-direction: column; justify-content: space-between; gap: 1.2%;
  color: #f8f8f8; background: linear-gradient(135deg,#292934f8,#111217fe 52%,#24242bf9);
  border: max(1px,.7cqw) solid var(--preview-color); border-radius: 2.5%;
  box-shadow: inset 0 0 1px #fff8, inset 0 0 12px color-mix(in srgb,var(--preview-color) 30%,transparent),0 3px 9px #000c;
  font-family: 'Barlow Condensed', sans-serif;
}
.rarity-card.frame-preview-v1 .rarity-preview-heading {
  display: grid; place-items: center; min-height: 14%;
  font-size: clamp(10px,4.8cqw,22px); font-weight: 900; text-align: center;
  letter-spacing: .02em; color: #f5f5f7; line-height: 1;
  text-shadow: 0 0 6px var(--preview-color),0 1px 2px #000;
  background: linear-gradient(90deg,transparent,#ffffff14 28%,#ffffff14 72%,transparent);
  border-top: 1px solid var(--preview-color); border-bottom: 1px solid var(--preview-color);
}
.rarity-card.frame-preview-v1 .rarity-preview-row {
  display: grid; grid-template-columns: 14% 37% 1fr 10%;
  align-items: center; column-gap: 1.7%; min-height: 11%;
  font-size: clamp(7px,3.7cqw,16px); font-weight: 750;
  line-height: 1; padding: .6% 1%;
  background: linear-gradient(180deg,#ffffff0e,#00000030);
  border: 1px solid color-mix(in srgb,var(--preview-color) 57%,#373840);
  border-radius: 2px; box-shadow: 0 1px 1px #000b, inset 0 0 4px #ffffff08;
}
.rarity-card.frame-preview-v1 .rarity-preview-icon {
  display: grid; place-items: center; width: 100%; aspect-ratio: 1.05;
  max-height: 100%; color: #f5f3ff;
  background: linear-gradient(145deg,color-mix(in srgb,var(--preview-color) 50%,#161721),#171820);
  border: 1px solid var(--preview-color);
  clip-path: polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  filter: drop-shadow(0 0 2px var(--preview-color));
}
.rarity-card.frame-preview-v1 .rarity-preview-icon svg { width: 65%; height: 65%; }
.rarity-card.frame-preview-v1 .rarity-preview-label { white-space: nowrap; letter-spacing: -.02em; text-shadow: 0 1px 2px #000; }
.rarity-card.frame-preview-v1 .rarity-preview-meter {
  display: block; height: 26%; min-height: 2px;
  background: linear-gradient(180deg,#575865,#22232b);
  border: 1px solid color-mix(in srgb,var(--preview-color) 80%,#fff);
  border-radius: 999px; box-shadow: inset 0 1px 3px #000d,0 0 3px var(--preview-color);
}
.rarity-card.frame-preview-v1 .rarity-preview-value {
  display: grid; place-items: center; height: 75%;
  border: 1px solid var(--preview-color); border-radius: 18%;
  background: #1b1b22; color: #b9bac1; font-size: .9em; line-height: 1;
}
.rarity-card.frame-preview-v1 .rarity-preview-culture {
  display: flex; align-items: center; justify-content: center; gap: .25em; min-height: 13%;
  font-size: clamp(8px,3.9cqw,17px); font-weight: 900;
  text-align: center; color: #f9f9f9;
  border: 1px solid var(--preview-color);
  background: linear-gradient(90deg,#16171c,var(--preview-color) 50%,#16171c);
  box-shadow: inset 0 0 8px #0009;
  clip-path: polygon(8% 0,92% 0,100% 50%,92% 100%,8% 100%,0 50%);
}
.rarity-card.frame-preview-v1 .rarity-preview-culture strong { color: #fff; }
.rarity-card.frame-preview-v1 .card-upgrade { z-index: 16; }

/* Todas as raridades usam moldura e atributos como uma só imagem. */
.rarity-card.frame-preview-v1 .rarity-preview-stats { display: none !important; }
.rarity-card.frame-preview-v1 .rarity-preview-art-top img {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}
.rarity-card.frame-preview-v1 .integrated-values {
  position: absolute; top: 0; left: 0;
  width: var(--edit-frame-size,110%); height: var(--edit-frame-height,100%);
  transform: translate(var(--edit-frame-x,-4.545%),var(--edit-frame-y,0%));
  pointer-events: none; color: #f9efff; font-family: 'Barlow Condensed',sans-serif;
  text-shadow: 0 1px 2px #000,0 0 3px #000;
}
.rarity-card.frame-preview-v1 .integrated-row {
  position: absolute; top: calc(66.45% + var(--index) * 4.72%);
  left: 0; width: 100%; height: 4%; transform: translateY(-50%);
}
.rarity-card.frame-preview-v1 .integrated-bar {
  position: absolute; left: 42.8%; width: 38.1%; top: 50%;
  height: 20%; transform: translateY(-50%); overflow: hidden;
  border-radius: 50px;
}
.rarity-card.frame-preview-v1 .integrated-fill {
  display: block; height: 100%; min-width: 0;
  background: linear-gradient(180deg,#fff1ff,#d486f6 55%,#9e48dd);
  box-shadow: 0 0 4px #ec9cff;
  transition: width .2s ease;
}
.rarity-card.frame-preview-v1 .integrated-number {
  position: absolute; left: 84%; width: 8.5%; top: 50%;
  transform: translateY(-50%); text-align: center;
  font-size: clamp(8px,4.2cqw,21px); font-weight: 900;
}
.rarity-card.frame-preview-v1 .integrated-total {
  position: absolute; left: 60%; top: 58.8%; width: 18%;
  text-align: center; font-size: clamp(8px,4.5cqw,23px); font-weight: 900;
}
.rarity-card.frame-preview-v1 .integrated-culture {
  position: absolute; left: 62%; width: 12%; top: 92.4%;
  transform: translateY(-50%); text-align: center;
  font-size: clamp(8px,4.3cqw,22px); font-weight: 900;
}
