.countdown-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:20;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
}

.countdown-overlay.show{
  opacity:1;
}

.count-star{
  width:min(38vw, 260px);
  aspect-ratio:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  transform:scale(.35);
  opacity:0;
  filter:blur(10px);
  clip-path:polygon(
    50% 0%,
    61% 35%,
    98% 35%,
    68% 57%,
    79% 91%,
    50% 70%,
    21% 91%,
    32% 57%,
    2% 35%,
    39% 35%
  );
  background:
    radial-gradient(circle at 35% 30%, #fff9c7 0%, #ffe978 18%, #ffd43b 45%, #f7b500 75%, #e69a00 100%);
  box-shadow:
    0 0 24px rgba(255, 214, 59, 0.55),
    0 0 60px rgba(255, 214, 59, 0.35),
    0 12px 35px rgba(0,0,0,0.30),
    inset 0 2px 0 rgba(255,255,255,0.55),
    inset 0 -8px 18px rgba(180,110,0,0.25);
}

.count-star::before{
  content:"";
  position:absolute;
  inset:10%;
  clip-path:polygon(
    50% 0%,
    61% 35%,
    98% 35%,
    68% 57%,
    79% 91%,
    50% 70%,
    21% 91%,
    32% 57%,
    2% 35%,
    39% 35%
  );
  background:linear-gradient(180deg, rgba(255,255,255,0.40), rgba(255,255,255,0.00));
  opacity:.7;
  pointer-events:none;
}

.count-star.flash{
  animation:starSplash .8s ease-out forwards;
}

.count-text{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  width:68%;
  line-height:.92;
  font-family:Arial Black, Impact, Inter, sans-serif;
  font-size:clamp(2rem, 7vw, 4.8rem);
  letter-spacing:.02em;
  color:#7a3e00;
  text-shadow:
    0 1px 0 rgba(255,255,255,0.40),
    0 0 10px rgba(255,255,255,0.22);
}

.count-text.small{
  width:56%;
  font-size:clamp(.7rem, 1.5vw, 1.4rem);
  line-height:1;
  letter-spacing:0;
}

@keyframes starSplash{
  0%{
    transform:scale(.25) rotate(-12deg);
    opacity:0;
    filter:blur(12px);
  }
  18%{
    transform:scale(1.18) rotate(4deg);
    opacity:1;
    filter:blur(0);
  }
  34%{
    transform:scale(.98) rotate(-2deg);
    opacity:1;
    filter:blur(0);
  }
  56%{
    transform:scale(1.05) rotate(0deg);
    opacity:1;
    filter:blur(0);
  }
  100%{
    transform:scale(.82) rotate(0deg);
    opacity:0;
    filter:blur(4px);
  }
}

.countdown-number{
animation:countSplash .8s ease-out;
}

@keyframes countSplash{

0%{
transform:scale(0.3);
opacity:0;
filter:blur(10px);
}

40%{
transform:scale(1.2);
opacity:1;
filter:blur(0);
}

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

}

.win-overlay{
position:absolute;
inset:0;
z-index:40;
display:none;
align-items:center;
justify-content:center;
}

.win-overlay.show{
display:flex;
}

.win-backdrop{
position:absolute;
inset:0;
background:rgba(0,0,0,0.62);
backdrop-filter:blur(4px);
}

.win-modal{
position:relative;
z-index:2;
display:flex;
flex-direction:column;
align-items:center;
gap:22px;
padding:20px;
width:min(92%, 620px);
animation:winAppear .28s ease-out;
}

.win-star{
width:min(52vw, 360px);
aspect-ratio:1 / 1;
display:flex;
align-items:center;
justify-content:center;
position:relative;
clip-path:polygon(
  50% 0%,
  61% 35%,
  98% 35%,
  68% 57%,
  79% 91%,
  50% 70%,
  21% 91%,
  32% 57%,
  2% 35%,
  39% 35%
);
background:
  radial-gradient(circle at 35% 30%, #effff6 0%, #b8ffd8 18%, #5dffb0 45%, #15d67f 74%, #089659 100%);
box-shadow:
  0 0 28px rgba(93,255,176,0.55),
  0 0 70px rgba(93,255,176,0.35),
  0 16px 40px rgba(0,0,0,0.35),
  inset 0 2px 0 rgba(255,255,255,0.55),
  inset 0 -10px 18px rgba(0,70,35,0.28);
}

.win-star::before{
content:"";
position:absolute;
inset:10%;
clip-path:polygon(
  50% 0%,
  61% 35%,
  98% 35%,
  68% 57%,
  79% 91%,
  50% 70%,
  21% 91%,
  32% 57%,
  2% 35%,
  39% 35%
);
background:linear-gradient(180deg, rgba(255,255,255,0.42), rgba(255,255,255,0.00));
opacity:.8;
pointer-events:none;
}

.win-star-text{
position:relative;
z-index:2;
width:62%;
text-align:center;
color:#0d5a36;
text-shadow:
  0 1px 0 rgba(255,255,255,0.38),
  0 0 10px rgba(255,255,255,0.18);
}

.win-title{
font-family:Arial Black, Impact, Inter, sans-serif;
font-size:clamp(1rem, 2.4vw, 1.55rem);
line-height:1.05;
letter-spacing:.04em;
}

.win-subtitle{
margin-top:8px;
font-family:Arial Black, Impact, Inter, sans-serif;
font-size:clamp(.95rem, 2.2vw, 1.35rem);
line-height:1.05;
}

.win-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
justify-content:center;
}

.win-btn{
min-width:170px;
}

@keyframes winAppear{
  0%{
    transform:scale(.88);
    opacity:0;
  }
  100%{
    transform:scale(1);
    opacity:1;
  }
}

@media (max-width: 720px){
  .win-star{
    width:min(78vw, 320px);
  }

  .win-actions{
    width:100%;
  }

  .win-btn{
    width:100%;
    min-width:0;
  }
}