/* ============================================================
   GALLA 진영 선택 축하 이펙트 (아케이드풍 폭발 + 큰 글자 터짐)
   #gv-fx : 전체화면 오버레이(포인터 통과). JS가 파티클 주입.
   ============================================================ */
#gv-fx {
  position: fixed; inset: 0; z-index: 100000; overflow: hidden;
  pointer-events: none;
}
#gv-fx * { pointer-events: none; }

/* 화면 컬러 플래시 */
.gvfx-flash {
  position: absolute; inset: 0;
  background: radial-gradient(circle at var(--ox, 50%) var(--oy, 55%), var(--c1), transparent 60%);
  opacity: 0; animation: gvfxFlash .6s ease-out forwards;
}
@keyframes gvfxFlash { 0% { opacity: .0; } 12% { opacity: .55; } 100% { opacity: 0; } }

/* 충격파 링 */
.gvfx-ring {
  position: absolute; left: var(--ox, 50%); top: var(--oy, 55%);
  width: 40px; height: 40px; margin: -20px 0 0 -20px; border-radius: 50%;
  border: 4px solid var(--c1); opacity: .9; transform: scale(.2);
  animation: gvfxRing .85s cubic-bezier(.2,.7,.3,1) forwards;
}
.gvfx-ring.r2 { border-color: #fff; animation-delay: .08s; }
@keyframes gvfxRing { to { transform: scale(9); opacity: 0; border-width: 1px; } }

/* 큰 글자 터짐 */
.gvfx-word {
  position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%) scale(.3);
  text-align: center; opacity: 0; width: 92vw; max-width: 560px;
  animation: gvfxWord 1.5s cubic-bezier(.18,1.5,.4,1) forwards;
}
.gvfx-word .gvfx-pick {
  display: block; font-size: clamp(30px, 10vw, 66px); font-weight: 900; letter-spacing: -1px; line-height: 1.05;
  color: #fff;
  text-shadow: 0 0 18px var(--c1), 0 0 40px var(--c1), 0 4px 10px rgba(0,0,0,.55);
  -webkit-text-stroke: 2px rgba(255,255,255,.85);
}
.gvfx-word .gvfx-sub {
  display: block; margin-top: 8px; font-size: 5.5vw; font-weight: 900;
  color: #ffd54a; text-shadow: 0 0 14px rgba(255,196,0,.8), 0 2px 6px rgba(0,0,0,.6);
  letter-spacing: 1px;
}
@media (min-width: 620px) {
  .gvfx-word .gvfx-pick { font-size: 76px; }
  .gvfx-word .gvfx-sub { font-size: 34px; }
}
@keyframes gvfxWord {
  0%   { opacity: 0; transform: translate(-50%,-50%) scale(.3) rotate(-6deg); }
  18%  { opacity: 1; transform: translate(-50%,-50%) scale(1.18) rotate(2deg); }
  32%  { transform: translate(-50%,-50%) scale(.96) rotate(-1deg); }
  46%  { transform: translate(-50%,-50%) scale(1.04); }
  70%  { opacity: 1; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%,-58%) scale(1.02); }
}

/* 색종이 조각 */
.gvfx-confetti {
  position: absolute; left: var(--ox, 50%); top: var(--oy, 55%);
  width: 10px; height: 14px; border-radius: 2px; opacity: 0;
  will-change: transform, opacity;
  animation: gvfxConfetti var(--dur, 1.1s) cubic-bezier(.15,.6,.35,1) var(--delay, 0s) forwards;
}
@keyframes gvfxConfetti {
  0%   { opacity: 1; transform: translate(0,0) rotate(0deg) scale(1); }
  70%  { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--tx), var(--ty)) rotate(var(--rot)) scale(.6); }
}

/* 이모지/코인 폭발 */
.gvfx-emoji {
  position: absolute; left: var(--ox, 50%); top: var(--oy, 55%);
  font-size: var(--sz, 26px); opacity: 0; will-change: transform, opacity;
  animation: gvfxEmoji var(--dur, 1.2s) cubic-bezier(.1,.7,.3,1) var(--delay, 0s) forwards;
}
@keyframes gvfxEmoji {
  0%   { opacity: 0; transform: translate(0,0) scale(.2) rotate(0deg); }
  18%  { opacity: 1; transform: translate(calc(var(--tx) * .35), calc(var(--ty) * .35)) scale(1.15) rotate(calc(var(--rot) * .4)); }
  100% { opacity: 0; transform: translate(var(--tx), var(--ty)) scale(.9) rotate(var(--rot)); }
}

/* 상단에서 쏟아지는 코인 샤워(아케이드 대박) */
.gvfx-coin {
  position: absolute; top: -6vh; left: var(--x, 50%); font-size: var(--sz, 22px);
  opacity: 0; will-change: transform, opacity;
  animation: gvfxCoin var(--dur, 1.3s) cubic-bezier(.3,.2,.5,1) var(--delay, 0s) forwards;
}
@keyframes gvfxCoin {
  0%   { opacity: 0; transform: translateY(0) rotate(0deg); }
  10%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(112vh) rotate(var(--rot, 540deg)); }
}