/* --- WIN POPUP MODAL --- */
.win-popup-overlay {
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.75);
  display: none; align-items: center; justify-content: center;
  z-index: 10000;
  backdrop-filter: blur(4px);
}
.win-modal {
  width: 90%; max-width: 340px;
  background: linear-gradient(180deg, #ff6b3d 0%, #ff4b2b 100%);
  border-radius: 24px;
  position: relative;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
  text-align: center;
  padding-bottom: 20px;
  animation: modalSlideUp 0.4s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}
.win-header-bg {
  width: 100%; height: 160px;
  background-size: cover; background-position: center;
  position: relative;
  border-radius: 24px 24px 0 0;
}
.win-title {
  color: #fff; font-family: 'Playfair Display', serif;
  font-size: 28px; font-weight: 700;
  margin-top: -30px; margin-bottom: 20px;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
.win-results-chips {
  display: flex; justify-content: center; gap: 8px; margin-bottom: 24px;
}
.result-chip {
  padding: 4px 12px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.4);
  color: #fff; font-size: 13px; font-weight: 600;
}
.result-chip.res-green { background: #10b981; }
.result-chip.res-red { background: #ef4444; }
.result-chip.res-violet { background: #8b5cf6; }
.result-chip.res-gold { background: var(--gold); }

.win-bonus-card {
  background: #fff;
  width: 80%; margin: 0 auto 12px;
  border-radius: 12px;
  padding: 20px 10px;
  position: relative;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
.win-bonus-card::before, .win-bonus-card::after {
  content: ""; position: absolute; top: 50%;
  width: 16px; height: 16px; border-radius: 50%; background: #ff4b2b; transform: translateY(-50%);
}
.win-bonus-card::before { left: -8px; }
.win-bonus-card::after { right: -8px; }

.win-bonus-label { color: #ff4b2b; font-size: 11px; font-weight: 700; margin-bottom: 4px; }
.win-bonus-amount { color: #ff4b2b; font-size: 24px; font-weight: 800; }
.win-period-info { color: #666; font-size: 11px; margin-top: 10px; opacity: 1; }

.win-auto-close { color: rgba(255,255,255,0.8); font-size: 11px; margin-bottom: 0px; margin-top: 5px; }

.win-close-btn {
  position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%);
  background: rgba(0,0,0,0.3); border: 2px solid #fff;
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 24px; cursor: pointer;
}

@keyframes modalSlideUp {
  from { opacity: 0; transform: scale(0.8) translateY(50px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
