/* 峰卓杆柜 · 开柜特效样式（麻将胡了式） */

.fx-wrap {
  position: fixed;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 99999;
  pointer-events: none;
  overflow: hidden;
}

/* 全屏金光爆闪 */
.fx-flash {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  background: radial-gradient(circle at 50% 42%,
    rgba(255, 240, 185, .95) 0%,
    rgba(255, 200, 70, .55) 32%,
    rgba(255, 150, 0, .18) 58%,
    rgba(255, 140, 0, 0) 75%);
  opacity: 0;
  animation: fxFlash .95s ease-out 1 forwards;
}
@keyframes fxFlash {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  28%  { opacity: .30; }
  44%  { opacity: .92; }
  62%  { opacity: .25; }
  78%  { opacity: .55; }
  100% { opacity: 0; }
}

/* 大字幕：奖品名 */
.fx-bigtext {
  position: absolute;
  left: 0; right: 0; top: 32%;
  text-align: center;
  padding: 0 16px;
}
.fx-bigtext span {
  display: inline-block;
  padding: .16em .5em;
  font-size: 1.55rem;
  font-weight: 900;
  letter-spacing: 2px;
  line-height: 1.25;
  color: #fff8dc;
  text-shadow:
    0 0 10px #ffc42e,
    0 0 26px #ff8a00,
    0 0 44px rgba(255, 120, 0, .6),
    0 2px 0 #a4530a;
  transform: scale(.4) rotate(-6deg);
  opacity: 0;
  animation: fxPop .8s cubic-bezier(.2, 1.55, .4, 1) forwards;
}
@keyframes fxPop {
  0%   { transform: scale(.4) rotate(-6deg); opacity: 0; }
  50%  { transform: scale(1.22) rotate(3deg); opacity: 1; }
  70%  { transform: scale(.94) rotate(-1.5deg); opacity: 1; }
  86%  { transform: scale(1.06) rotate(.8deg); opacity: 1; }
  100% { transform: scale(1.02) rotate(0); opacity: 1; }
}

/* S 级额外：字幕更亮更大 + 光环 */
.fx-S .fx-bigtext span {
  font-size: 1.9rem;
  text-shadow:
    0 0 14px #fff0a8,
    0 0 32px #ffb62e,
    0 0 60px #ff7a00,
    0 2px 0 #a4530a;
}
.fx-S .fx-flash { animation-duration: 1.35s; }

/* 金币雨 */
.fx-coins {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
}
.fx-coin {
  position: absolute;
  top: -44px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #fff6c4 0%, #ffd451 45%, #d99406 100%);
  box-shadow: 0 0 8px rgba(255, 190, 60, .85);
  opacity: 0;
  animation-name: fxCoinFall;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
@keyframes fxCoinFall {
  0%   { transform: translateY(0) rotate(0deg); opacity: 0; }
  8%   { opacity: 1; }
  85%  { opacity: 1; }
  100% { transform: translateY(108vh) rotate(760deg); opacity: .1; }
}
