/* Static vector trails are composited as a handful of moving layers, including on TVs. */
.raffle-fireworks{display:none;position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.raffle-screen[data-phase="result"] .raffle-fireworks{display:block}
.raffle-fireworks::before{
  content:'';position:absolute;inset:0;will-change:opacity;
  background:radial-gradient(ellipse at 0% 20%,#ffca6eaa,transparent 43%),
    radial-gradient(ellipse at 100% 80%,#ffda8eaa,transparent 43%),
    radial-gradient(ellipse at 100% 0%,var(--raffle-celebration-glow,#f2a1bf77),transparent 44%),
    radial-gradient(ellipse at 0% 100%,var(--raffle-celebration-glow,#f2a1bf77),transparent 44%);
  animation:raffle-celebration-glow 2.8s ease-in-out infinite;
}
.raffle-firework{
  position:absolute;left:9%;top:21%;width:clamp(250px,27vw,440px);height:auto;
  aspect-ratio:1;overflow:visible;opacity:0;color:var(--raffle-burst-accent,#ffb5cf);
  transform-origin:center;will-change:transform,opacity;
  animation:raffle-celebration-burst 4.8s cubic-bezier(.18,.62,.3,1) -.75s infinite;
}
.raffle-firework-halo{fill:none;stroke:#ffc656;stroke-width:11;stroke-linecap:round;opacity:.2}
.raffle-firework-gold{fill:none;stroke:#ffedb9;stroke-width:3.6;stroke-linecap:round}
.raffle-firework-color{fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round}
.raffle-firework-sparks{fill:none;stroke:#fff8df;stroke-width:7;stroke-linecap:round}
.raffle-firework:nth-child(2){left:91%;top:28%;animation-delay:-1.95s}
.raffle-firework:nth-child(3){left:10%;top:78%;animation-delay:-3.15s}
.raffle-firework:nth-child(4){left:90%;top:76%;animation-delay:-4.35s}
.raffle-firework:nth-child(5){left:31%;top:6%;width:clamp(230px,23vw,380px);animation-delay:-3.15s}
.raffle-firework:nth-child(6){left:69%;top:5%;width:clamp(230px,23vw,380px);animation-delay:-.75s}
.raffle-firework:nth-child(7){left:29%;top:96%;width:clamp(230px,23vw,380px);animation-delay:-1.95s}
.raffle-firework:nth-child(8){left:72%;top:95%;width:clamp(230px,23vw,380px);animation-delay:-4.35s}
.raffle-firework:nth-child(9){left:2%;top:49%;width:clamp(280px,29vw,460px);animation-delay:-4.35s}
.raffle-firework:nth-child(10){left:98%;top:51%;width:clamp(280px,29vw,460px);animation-delay:-1.95s}
@keyframes raffle-celebration-burst{
  0%,4%{transform:translate(-50%,-50%) translateY(20px) scale(.06) rotate(-7deg);opacity:0}
  14%{opacity:1}
  36%{transform:translate(-50%,-50%) translateY(0) scale(1) rotate(0deg);opacity:1}
  58%{opacity:.8}
  76%,100%{transform:translate(-50%,-50%) translateY(28px) scale(1.2) rotate(7deg);opacity:0}
}
@keyframes raffle-celebration-glow{0%,100%{opacity:.16}50%{opacity:.82}}
@media(max-width:600px){
  .raffle-firework{left:1%;top:20%;width:250px}
  .raffle-firework:nth-child(2){left:99%;top:28%}
  .raffle-firework:nth-child(3){left:1%;top:77%}
  .raffle-firework:nth-child(4){left:99%;top:79%}
  .raffle-firework:nth-child(5){left:24%;top:2%;width:220px}
  .raffle-firework:nth-child(6){left:76%;top:1%;width:220px}
  .raffle-firework:nth-child(7){left:23%;top:98%;width:220px}
  .raffle-firework:nth-child(8){left:77%;top:97%;width:220px}
  .raffle-firework:nth-child(9){left:-7%;top:49%;width:240px}
  .raffle-firework:nth-child(10){left:107%;top:51%;width:240px}
}
@media(max-height:500px) and (min-width:601px){
  .raffle-firework{width:240px}
  .raffle-firework:nth-child(n+5){width:210px}
}
@media(prefers-reduced-motion:reduce){
  .raffle-screen[data-phase="result"] .raffle-fireworks{display:none}
  .raffle-firework,.raffle-fireworks::before{animation:none;will-change:auto}
}