.block-victory-overlay.hidden{
  display:none;
}

.block-victory-overlay{
  position:absolute;
  inset:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:
    radial-gradient(circle at 50% 40%, rgba(255,228,118,.18), rgba(255,228,118,0) 34%),
    rgba(5,16,22,.22);
  backdrop-filter:blur(2px);
}

.block-victory-scene{
  position:relative;
  width:min(680px,96vw);
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:10px 18px 18px;
  color:#fff5bf;
  text-align:center;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,228,92,.24), rgba(255,228,92,0) 48%);
  overflow:visible;
  animation:blockVictoryEnter 360ms ease-out both;
}

.block-victory-glow{
  position:absolute;
  inset:-36%;
  pointer-events:none;
  opacity:.62;
  background:
    conic-gradient(
      from 0deg,
      rgba(255,255,255,0),
      rgba(255,242,160,.36),
      rgba(255,255,255,0) 22%,
      rgba(255,196,56,.28),
      rgba(255,255,255,0) 48%
    );
  animation:blockVictoryGlow 6200ms linear infinite;
}

.block-victory-win-row{
  position:relative;
  z-index:2;
  width:min(640px,96vw);
  height:176px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 -4px;
}

.block-victory-win-img{
  width:min(214px,38vw);
  height:auto;
  object-fit:contain;
  filter:
    drop-shadow(0 9px 12px rgba(32,14,4,.40))
    drop-shadow(0 0 18px rgba(255,226,94,.44))
    saturate(1.08);
  animation:blockVictoryWinPop 1050ms ease-in-out infinite;
}

.block-victory-cannon{
  width:min(214px,34vw);
  height:auto;
  object-fit:contain;
  filter:
    drop-shadow(0 10px 12px rgba(20,16,12,.34))
    drop-shadow(0 0 12px rgba(255,206,74,.28))
    saturate(1.08);
  animation:
    blockVictoryCannonEnter 520ms ease-out both,
    blockVictoryCannonKick 1150ms ease-in-out 560ms infinite;
}

.block-victory-cannon.cannon-left{
  --cannon-enter-x:-190px;
  margin-right:-42px;
  transform-origin:82% 62%;
}

.block-victory-cannon.cannon-right{
  --cannon-enter-x:190px;
  margin-left:-42px;
  transform-origin:18% 62%;
  animation-delay:70ms, 680ms;
}

.block-victory-confetti{
  position:absolute;
  inset:-20px 0 0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}

.block-victory-confetti i{
  position:absolute;
  left:var(--x);
  top:-24px;
  width:11px;
  height:22px;
  border-radius:3px;
  background:var(--c);
  opacity:0;
  box-shadow:
    0 0 8px color-mix(in srgb, var(--c), transparent 40%);
  transform:rotate(var(--r));
  animation:blockVictoryConfetti 1550ms ease-in var(--d) infinite;
}

.block-victory-prize{
  position:relative;
  z-index:2;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:-4px 0 2px;
  padding:4px 14px;
  border-radius:999px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,245,166,.22), rgba(255,245,166,0) 62%),
    rgba(31,18,8,.18);
  border:1px solid rgba(255,232,138,.32);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 8px 16px rgba(16,14,10,.12);
}

.block-victory-coins{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  color:#fff6bf;
  font-weight:900;
  text-shadow:
    0 1px 0 rgba(255,255,232,.66),
    0 2px 0 rgba(92,38,18,.88),
    1px 0 0 rgba(92,38,18,.62),
    -1px 0 0 rgba(92,38,18,.62),
    0 0 11px rgba(255,226,112,.48);
}

.block-victory-coins img{
  width:36px;
  height:36px;
  object-fit:contain;
  filter:
    drop-shadow(0 3px 3px rgba(84,38,12,.42))
    saturate(1.1);
}

.block-victory-coins b{
  font-size:24px;
}

.block-victory-scene button{
  position:relative;
  z-index:1;
  min-width:166px;
  height:50px;
  margin-top:-8px;
  border:2px solid rgba(255,245,170,.92);
  border-radius:999px;
  color:#4c2200;
  font-size:17px;
  font-weight:900;
  text-shadow:
    0 1px 0 rgba(255,255,220,.78),
    0 2px 0 rgba(255,185,48,.62);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,220,.72), rgba(255,255,220,0) 46%),
    linear-gradient(180deg, #fff05e, #ff9d22 58%, #c76712);
  box-shadow:
    0 5px 0 rgba(111,50,6,.88),
    0 0 18px rgba(255,218,82,.36),
    inset 0 1px 0 rgba(255,255,255,.52);
}

.block-victory-scene button:active{
  transform:translateY(2px);
}

@keyframes blockVictoryEnter{
  0%{
    opacity:0;
    transform:translateY(22px) scale(.92);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes blockVictoryGlow{
  100%{
    transform:rotate(360deg);
  }
}

@keyframes blockVictoryWinPop{
  0%,
  100%{
    transform:translateY(0) scale(1);
  }

  50%{
    transform:translateY(-3px) scale(1.055);
  }
}

@keyframes blockVictoryCannonEnter{
  0%{
    opacity:0;
    transform:
      translateX(var(--cannon-enter-x))
      translateY(12px)
      scale(.82);
  }

  72%{
    opacity:1;
    transform:
      translateX(0)
      translateY(-4px)
      scale(1.08);
  }

  100%{
    opacity:1;
    transform:
      translateX(0)
      translateY(0)
      scale(1);
  }
}

@keyframes blockVictoryCannonKick{
  0%,
  100%{
    transform:translateY(0) rotate(0deg) scale(1);
  }

  18%{
    transform:translateY(3px) rotate(-2deg) scale(1.04);
  }

  34%{
    transform:translateY(0) rotate(0deg) scale(1);
  }
}

@keyframes blockVictoryConfetti{
  0%{
    opacity:0;
    transform:
      translateY(-20px)
      rotate(var(--r))
      scale(.82);
  }

  10%,
  82%{
    opacity:1;
  }

  100%{
    opacity:0;
    transform:
      translateY(380px)
      rotate(calc(var(--r) + 260deg))
      scale(1.08);
  }
}

@media (max-width:640px){
  .block-victory-scene{
    width:98vw;
    min-height:238px;
    gap:4px;
    padding:18px 8px;
  }

  .block-victory-win-row{
    height:140px;
  }

  .block-victory-win-img{
    width:min(154px,37vw);
  }

  .block-victory-cannon{
    width:min(138px,32vw);
  }

  .block-victory-prize{
    min-height:38px;
    gap:8px;
    padding:3px 10px;
  }

  .block-victory-coins img{
    width:30px;
    height:30px;
  }

  .block-victory-coins b{
    font-size:20px;
  }
}
