/* 홀덤 찐 최종 애니메이션 CSS - 원본 HTML 완전 복사 */
.holdem-animation {
  position: relative;
  width: 100%;
  height: 100%;
  isolation: isolate;
  opacity: 1;
  transition: opacity 0.8s ease;
  top: -75px !important; /* 40px 하향 조정 적용 */
  min-height: 100px;
}

.holdem-animation.loaded {
  opacity: 1;
}

/* 원본 컨테이너 스타일 완전 복사 */
.holdem-animation img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  will-change: transform, opacity, filter;
}

/* ===== 레이어 순서 ===== */
.holdem-animation .chip-6 { z-index: 9; }
.holdem-animation .chip-7 { z-index: 8; }
.holdem-animation .chip-4 { z-index: 7; }
.holdem-animation .chip-5 { z-index: 6; }

.holdem-animation .card-3 { z-index: 5; }
.holdem-animation .card-2 { z-index: 4; }

.holdem-animation .layer-1 { z-index: 3; }

.holdem-animation .gem-8 { z-index: 2; }
.holdem-animation .gem-9 { z-index: 1; }

/* =========================================
   카드 연출 (Glow 제거)
   ========================================= */
.holdem-animation .card {
    transform-origin: 50% 50%;
    filter: none !important;   /* **글로우/블러 완전 제거** */
}

/* 카드 2 (스페이드) */
.holdem-animation .card-2 {
    animation:
        cardBreathing 4s infinite alternate,
        cardRotateLeft 15s infinite ease-in-out,
        cardOpacity 15s infinite linear;
}

/* 카드 3 (하트) */
.holdem-animation .card-3 {
    animation:
        cardBreathing 4s infinite alternate,
        cardRotateRight 15s infinite ease-in-out,
        cardOpacity 15s infinite linear;
}

/* 카드 숨쉬기: **글로우 제거 버전** */
@keyframes cardBreathing {
    0%, 100% {
        filter: none;
    }
    50% {
        filter: none;
    }
}

/* 오퍼시티 루프 */
@keyframes cardOpacity {
    0%   { opacity: 0.7; }
    10%  { opacity: 1; }
    65%  { opacity: 1; }
    90%  { opacity: 0.7; }
    100% { opacity: 0.7; }
}

/* 카드 팬 회전 */
@keyframes cardRotateLeft {
    0%, 8% {
        transform: translate(0, 0) rotate(0deg);
    }
    28% {
        transform: translateX(-4%) rotate(-14deg);
    }
    65% {
        transform: translateX(-4%) rotate(-14deg);
    }
    100% {
        transform: translate(0, 0) rotate(0deg);
    }
}

@keyframes cardRotateRight {
    0%, 8% {
        transform: translate(0, 0) rotate(0deg);
    }
    28% {
        transform: translateX(4%) rotate(14deg);
    }
    65% {
        transform: translateX(4%) rotate(14deg);
    }
    100% {
        transform: translate(0, 0) rotate(0deg);
    }
}

/* =========================================
   칩 팝 애니메이션 그대로 유지
   ========================================= */
.holdem-animation .chip { 
    opacity: 1; 
}

.holdem-animation .chip-7 {
    animation: chipPopCenter 15s infinite cubic-bezier(0.2, 0.7, 0.3, 1.3);
}

.holdem-animation .chip-6 {
    animation: chipPopCenter 15s infinite cubic-bezier(0.2, 0.7, 0.3, 1.3);
    animation-delay: 0.08s;
}

.holdem-animation .chip-4 {
    animation: chipPopDiagonalUpLeft 15s infinite cubic-bezier(0.2, 0.7, 0.3, 1.3);
    animation-delay: 0.16s;
}

.holdem-animation .chip-5 {
    animation: chipPopDiagonalUpRight 15s infinite cubic-bezier(0.2, 0.7, 0.3, 1.3);
    animation-delay: 0.16s;
}

@keyframes chipPopCenter {
    0%, 9% { transform: translateY(0) scale(1); }
    10%   { transform: translateY(-26px) scale(1.16); }
    14%   { transform: translateY(0) scale(1); }
    18%   { transform: translateY(-14px) scale(1.08); }
    22%   { transform: translateY(0) scale(1); }
    23%,100% { transform: translateY(0) scale(1); }
}

@keyframes chipPopDiagonalUpLeft {
    0%, 15% { transform: translate(0, 0) scale(1); }
    16%     { transform: translate(-16px, -26px) scale(1.18); }
    20%     { transform: translate(0, 0) scale(1); }
    24%     { transform: translate(-8px, -14px) scale(1.08); }
    28%     { transform: translate(0, 0) scale(1); }
    29%,100% { transform: translate(0, 0) scale(1); }
}

@keyframes chipPopDiagonalUpRight {
    0%, 15% { transform: translate(0, 0) scale(1); }
    16%     { transform: translate(16px, -26px) scale(1.18); }
    20%     { transform: translate(0, 0) scale(1); }
    24%     { transform: translate(8px, -14px) scale(1.08); }
    28%     { transform: translate(0, 0) scale(1); }
    29%,100% { transform: translate(0, 0) scale(1); }
}

/* =========================================
   보석 플로팅
   ========================================= */
.holdem-animation .gem {
    animation: gemFloat 5s infinite alternate ease-in-out;
}
.holdem-animation .gem-9 {
    animation-delay: -2.5s;
}

@keyframes gemFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50%     { transform: translate(0, -10px) scale(1.05); }
}

/* 접근성 */
@media (prefers-reduced-motion: reduce) {
  .holdem-animation .card, 
  .holdem-animation .chip, 
  .holdem-animation .gem { 
    animation: none !important; 
  }
}