/* =============================================================
   V1802 · FUR / ZENITH +11 ~ +13 전용 티어 연출
   -------------------------------------------------------------
   · 11강 MASTER    금 · 황동
   · 12강 GRAND     보라 · 백금
   · 13강 TRANSCEND 붉은 용 · 봉황 (원본 색)

   오라 색은 각 단계 프레임 PNG 의 색과 맞춰 둔다.
   FUR 은 PNG 프레임(.has-tier-frame), ZENITH 은 아직 PNG 가 없어 오라·배지만 나간다.
   페이커 챔피언십 카드는 전용 프레임을 유지하고 오라·배지만 함께 붙는다.
   ============================================================= */

.card-frame.bt-tier-11 { --tier-a:#ffd479; --tier-b:#b8862f; --tier-c:#fff3d0; }
.card-frame.bt-tier-12 { --tier-a:#c9a6ff; --tier-b:#6d4bd0; --tier-c:#eceaff; }
.card-frame.bt-tier-13 { --tier-a:#ff8a8a; --tier-b:#c01020; --tier-c:#ffe8e8; }

/* ── 1. 외곽 오라 ───────────────────────────────────────────── */
.card-frame.bt-tier-11,
.card-frame.bt-tier-12,
.card-frame.bt-tier-13 {
  position: relative;
  overflow: visible;
  filter:
    drop-shadow(0 0 6px color-mix(in srgb, var(--tier-a) 70%, transparent))
    drop-shadow(0 0 15px color-mix(in srgb, var(--tier-b) 45%, transparent));
  animation: tierAuraBreath 3.4s ease-in-out infinite;
}
.card-frame.bt-tier-13 {
  filter:
    drop-shadow(0 0 7px color-mix(in srgb, var(--tier-a) 78%, transparent))
    drop-shadow(0 0 18px color-mix(in srgb, var(--tier-b) 55%, transparent))
    drop-shadow(0 0 30px rgba(255, 255, 255, .22));
}
@keyframes tierAuraBreath {
  0%, 100% { filter:
    drop-shadow(0 0 6px color-mix(in srgb, var(--tier-a) 62%, transparent))
    drop-shadow(0 0 14px color-mix(in srgb, var(--tier-b) 38%, transparent)); }
  50% { filter:
    drop-shadow(0 0 10px color-mix(in srgb, var(--tier-a) 88%, transparent))
    drop-shadow(0 0 24px color-mix(in srgb, var(--tier-b) 60%, transparent)); }
}

/* ── 2. 프레임 색 전환 (CSS 프레임을 쓰는 FUR 10강 대비 차별) ── */
/* V1813-fix: 페이커 챔피언십 카드는 전용 T1 프레임을 쓰므로 색을 덮으면 안 된다. */
.card-frame.bt-tier-11:not(.has-tier-frame):not(.faker-championship-card),
.card-frame.bt-tier-12:not(.has-tier-frame):not(.faker-championship-card),
.card-frame.bt-tier-13:not(.has-tier-frame):not(.faker-championship-card) {
  border-color: var(--tier-a) !important;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--tier-c) 55%, transparent),
    inset 0 0 18px color-mix(in srgb, var(--tier-b) 30%, transparent) !important;
}
/* V1813-fix: 회전 프리즘 테두리 제거.
   ::before 박스 전체를 rotate 시키는 방식이라, 2:3 비율 카드에서는
   회전한 사각형이 카드 밖으로 쓸려나가 선이 떠다니는 것처럼 보였다.
   게다가 이 블록은 PNG 프레임이 없는 카드(ZENITH 전 단계·페이커 챔피언십)
   에서만 걸리는데, 파일 상단 주석의 의도는 그 카드들에 "오라·배지만"
   붙이는 것이었다. 의도와 어긋나 있었다. 오라와 배지는 그대로 둔다. */

/* ── 3. 프레임 PNG ─────────────────────────────────────────── */
.card-frame.has-tier-frame > .tier-card-frame {
  position: absolute;
  z-index: 21;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
}
/* PNG 가 붙으면 그림이 전부 책임진다. CSS 테두리·홀로는 물러난다. */
.card-frame.has-tier-frame {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  aspect-ratio: 2 / 3;
  isolation: isolate;
}
.card-frame.has-tier-frame > .card-holo,
.card-frame.has-tier-frame > .breakthrough-effect { display: none !important; }
.card-frame.has-tier-frame > .zenith-card-frame { z-index: 19; opacity: 0; }
.card-frame.has-tier-frame .card-inner {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* 납품된 프레임 실측 사진 창 — 좌 10.35% / 상 12.11% / 79.49% x 83.72% */
.card-frame.has-tier-frame .card-art {
  position: absolute;
  z-index: 1;
  top: 12.11%;
  left: 10.35%;
  width: 79.49%;
  height: 83.72%;
  min-height: 0;
  border: 0;
  border-radius: 8%;
  background: #0a0710;
  box-shadow: none;
  clip-path: inset(0 round 8%);
}
.card-frame.has-tier-frame .card-art img { width: 100%; height: 100%; object-fit: cover; }
.card-frame.has-tier-frame .card-header {
  position: absolute;
  z-index: 6;
  top: 13.1%;
  left: 13.2%;
  right: 13.2%;
  height: auto;
  padding: 0;
  align-items: flex-start;
}
.card-frame.has-tier-frame .card-header b { display: none; }
/* 사진 창이 아래 4% 까지 내려오므로 이름판은 사진 위에 얹고 검정 그라디언트로 가독성을 잡는다 */
.card-frame.has-tier-frame .card-footer {
  position: absolute;
  z-index: 5;
  left: 11%;
  right: 11%;
  bottom: 5.5%;
  min-height: 16%;
  padding: 9% 3% 2%;
  align-items: flex-end;
  background: linear-gradient(180deg, transparent 0%, rgba(8, 3, 10, .72) 42%, rgba(8, 3, 10, .94) 100%);
}
.card-frame.has-tier-frame .card-mini-logo { display: none; }
.card-frame.has-tier-frame > .breakthrough-badge,
.card-frame.has-tier-frame .deck-card-top-badges {
  z-index: 30;
  top: 13.1%;
  right: 13.2%;
  left: auto;
}
.card-frame.has-tier-frame .deck-card-top-badges > .breakthrough-badge { position: relative; inset: auto; }

/* ── 4. 단계 배지 (MASTER / GRAND / TRANSCEND) ──────────────── */
.card-frame .tier-rank-badge {
  position: absolute;
  z-index: 32;
  left: 50%;
  bottom: 3.2%;
  transform: translateX(-50%);
  padding: 2px 9px;
  border: 1px solid color-mix(in srgb, var(--tier-a) 70%, transparent);
  border-radius: 999px;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--tier-b) 82%, #05040a),
    color-mix(in srgb, var(--tier-a) 42%, #05040a));
  color: var(--tier-c);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.5;
  white-space: nowrap;
  text-shadow: 0 0 6px color-mix(in srgb, var(--tier-a) 75%, transparent);
  box-shadow: 0 0 8px color-mix(in srgb, var(--tier-a) 40%, transparent);
  pointer-events: none;
}
.card-frame.has-tier-frame .tier-rank-badge { bottom: 2.4%; }
.card-frame.small .tier-rank-badge,
.card-frame.pve-deck-card-display .tier-rank-badge,
.card-frame.pvp-card-display .tier-rank-badge { font-size: 7px; padding: 1px 6px; letter-spacing: .12em; }

/* ── 5. 접근성 ─────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .card-frame.bt-tier-11,
  .card-frame.bt-tier-12,
  .card-frame.bt-tier-13 { animation: none; }
  .card-frame.bt-tier-13:not(.has-tier-frame)::before { animation: none; }
}

/* ── 6. 강화 화면 안내 문구 ─────────────────────────────────── */
.breakthrough-info .breakthrough-duplicate-note,
.breakthrough-info .breakthrough-pity-note {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.45;
  color: #9fb0c8;
}
.breakthrough-info .breakthrough-duplicate-note.is-short { color: #ff8b8b; font-weight: 700; }
.breakthrough-info .breakthrough-pity-note { color: #ffd479; }