.padlock-event-banner,
.padlock-events-banner{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.08), transparent 26%),
    linear-gradient(135deg,#081426,#10213d 58%, #1a2d4c);
  color:#fff;
  padding:22px 24px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 34px rgba(0,0,0,.26);
  margin-bottom:20px;
}
.padlock-event-banner::before,
.padlock-events-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top center, rgba(0,255,159,.08), transparent 30%);
  pointer-events:none;
}
.padlock-event-banner > *,
.padlock-events-banner > *{
  position:relative;
  z-index:1;
}
.padlock-event-banner__eyebrow,
.padlock-event-card__type{
  display:inline-block;
  margin-bottom:8px;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#00ff9f !important;
  font-weight:800;
}
.padlock-event-banner h3,
.padlock-event-title{
  margin:0 0 8px !important;
  color:#ffffff !important;
}
.padlock-event-banner p,
.padlock-event-meta,
.event-meta{
  color:#d1d9e8 !important;
  line-height:1.5;
}
.padlock-events-live{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) !important;
  gap:18px !important;
}
.padlock-event-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.05), transparent 25%),
    linear-gradient(135deg,#0b172b,#172742);
  color:#fff !important;
  padding:18px !important;
  border-radius:20px !important;
  border:1px solid rgba(255,255,255,.07) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.24) !important;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.padlock-event-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 38px rgba(0,0,0,.3) !important;
  border-color:rgba(255,255,255,.12) !important;
}
.padlock-event-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
}
.padlock-event-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.padlock-event-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  line-height:1;
  letter-spacing:.03em;
  white-space:nowrap;
}
.padlock-event-badge-live{
  background:rgba(0,255,159,.12);
  color:#00ff9f;
  box-shadow:0 0 0 1px rgba(0,255,159,.14);
}
.padlock-event-badge-ending{
  background:rgba(251,191,36,.14);
  color:#fbbf24;
  box-shadow:0 0 0 1px rgba(251,191,36,.14);
}
.padlock-event-badge-rarity-common{
  background:rgba(148,163,184,.15);
  color:#cbd5e1;
}
.padlock-event-badge-rarity-uncommon{
  background:rgba(34,197,94,.15);
  color:#86efac;
}
.padlock-event-badge-rarity-rare{
  background:rgba(59,130,246,.16);
  color:#93c5fd;
}
.padlock-event-badge-rarity-epic{
  background:rgba(168,85,247,.16);
  color:#d8b4fe;
}
.padlock-event-badge-rarity-legendary{
  background:rgba(251,191,36,.16);
  color:#fde68a;
}
.padlock-event-card.rarity-uncommon{
  box-shadow:0 12px 28px rgba(0,0,0,.24), 0 0 0 1px rgba(34,197,94,.10) inset !important;
}
.padlock-event-card.rarity-rare{
  box-shadow:0 12px 28px rgba(0,0,0,.24), 0 0 0 1px rgba(59,130,246,.12) inset !important;
}
.padlock-event-card.rarity-epic{
  box-shadow:0 12px 28px rgba(0,0,0,.24), 0 0 0 1px rgba(168,85,247,.14) inset, 0 0 22px rgba(168,85,247,.10) !important;
}
.padlock-event-card.rarity-legendary{
  box-shadow:0 14px 34px rgba(0,0,0,.3), 0 0 0 1px rgba(251,191,36,.18) inset, 0 0 28px rgba(251,191,36,.10) !important;
}
.padlock-event-card.is-ending-soon{
  animation:padlockEventPulse 1.6s ease-in-out infinite;
}
@keyframes padlockEventPulse{
  0%{ box-shadow:0 12px 28px rgba(0,0,0,.24), 0 0 0 1px rgba(251,191,36,.12) inset; }
  50%{ box-shadow:0 14px 32px rgba(0,0,0,.28), 0 0 0 1px rgba(251,191,36,.28) inset, 0 0 24px rgba(251,191,36,.10); }
  100%{ box-shadow:0 12px 28px rgba(0,0,0,.24), 0 0 0 1px rgba(251,191,36,.12) inset; }
}
.padlock-event-reward-line{
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.padlock-event-reward,
.event-reward{
  color:#00ff9f !important;
  font-weight:800 !important;
  margin-bottom:6px !important;
}
.padlock-event-countdown{
  margin-top:10px !important;
  color:#fbbf24 !important;
  font-weight:800 !important;
  font-size:12px !important;
}
.padlock-event-progress{
  margin-top:12px !important;
  background:#374151 !important;
  border-radius:999px !important;
  overflow:hidden !important;
  height:10px !important;
}
.padlock-event-progress-bar{
  height:10px !important;
  background:linear-gradient(90deg,#00ff9f,#4ade80) !important;
}

.padlock-events-toast-stack{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:99999;
  display:flex;
  flex-direction:column;
  gap:12px;
  pointer-events:none;
}
.padlock-events-toast{
  min-width:280px;
  max-width:360px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(17,24,39,0.96);
  border:1px solid rgba(0,255,159,0.22);
  box-shadow:0 14px 34px rgba(0,0,0,0.3);
  color:#fff;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .22s ease, transform .22s ease;
  pointer-events:none;
}
.padlock-events-toast.is-visible{
  opacity:1;
  transform:translateY(0);
}
.padlock-events-toast__title{
  font-size:14px;
  font-weight:800;
  color:#00ff9f;
  margin-bottom:4px;
}
.padlock-events-toast__message{
  font-size:14px;
  color:#ffffff;
  line-height:1.4;
}
.padlock-events-toast__meta{
  font-size:12px;
  color:#d1d5db;
  margin-top:6px;
}
.padlock-events-toast.rare{
  border-color:rgba(59,130,246,.24);
  box-shadow:0 14px 34px rgba(0,0,0,.3), 0 0 0 1px rgba(59,130,246,.18) inset;
}
.padlock-events-toast.epic{
  border-color:rgba(168,85,247,.28);
  box-shadow:0 14px 34px rgba(0,0,0,.3), 0 0 0 1px rgba(168,85,247,.22) inset, 0 0 26px rgba(168,85,247,.10);
}
.padlock-events-toast.legendary{
  border-color:rgba(251,191,36,.28);
  box-shadow:0 14px 34px rgba(0,0,0,.3), 0 0 0 1px rgba(251,191,36,.24) inset, 0 0 28px rgba(251,191,36,.10);
}

@media (max-width:640px){
  .padlock-event-banner,
  .padlock-event-card{
    border-radius:18px !important;
  }
  .padlock-events-live{
    grid-template-columns:1fr !important;
  }
}



.padlock-line{
  margin:4px 0;
  font-size:14px;
}

.padlock-line.base{
  color:#86efac;
  font-weight:600;
}

.padlock-line.level{
  color:#fde68a;
  font-weight:600;
}

.padlock-line.streak{
  color:#fb7185;
  font-weight:700;
}

.padlock-line.total{
  color:#00ff9f;
  font-weight:800;
  font-size:15px;
  margin-top:6px;
}

.padlock-line.info{
  color:#d1d5db;
  font-size:13px;
}

.padlock-line-spacer{
  height:6px;
}



/* =========================
   🔥 TOAST ANIMATION UPGRADE
   ========================= */

.padlock-events-toast{
  opacity:0;
  transform:translateY(20px) scale(0.96);
  transition:
    opacity .25s ease,
    transform .25s cubic-bezier(.2,.8,.2,1);
}

.padlock-events-toast.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

/* slight stagger effect when multiple toasts stack */
.padlock-events-toast + .padlock-events-toast{
  margin-top:10px;
}

/* =========================
   ✨ LINE ANIMATIONS
   ========================= */

.padlock-line{
  animation:padlockLineFade .4s ease forwards;
  opacity:0;
}

.padlock-line:nth-child(1){ animation-delay:0.05s; }
.padlock-line:nth-child(2){ animation-delay:0.1s; }
.padlock-line:nth-child(3){ animation-delay:0.15s; }
.padlock-line:nth-child(4){ animation-delay:0.2s; }
.padlock-line:nth-child(5){ animation-delay:0.25s; }

@keyframes padlockLineFade{
  from{
    opacity:0;
    transform:translateY(4px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* =========================
   🔥 STREAK GLOW (subtle pulse)
   ========================= */

.padlock-line.streak{
  animation:padlockStreakPulse 1.8s ease-in-out infinite;
}

@keyframes padlockStreakPulse{
  0%{ text-shadow:0 0 0 rgba(251,113,133,0); }
  50%{ text-shadow:0 0 8px rgba(251,113,133,0.5); }
  100%{ text-shadow:0 0 0 rgba(251,113,133,0); }
}

/* =========================
   💎 TOTAL GLOW (reward hit)
   ========================= */

.padlock-line.total{
  text-shadow:0 0 10px rgba(0,255,159,0.4);
  animation:padlockTotalPop .35s ease;
}

@keyframes padlockTotalPop{
  0%{
    transform:scale(0.95);
    opacity:0.6;
  }
  100%{
    transform:scale(1);
    opacity:1;
  }
}



.padlock-bonus-stack{
  margin-top:8px;
}

.padlock-bonus{
  font-size:12px;
  margin:2px 0;
  opacity:0.9;
}

.padlock-bonus.level{
  color:#fde68a;
}

.padlock-bonus.streak{
  color:#fb7185;
  font-weight:600;
}

.padlock-bonus.info{
  color:#00ff9f;
  font-size:11px;
  opacity:0.8;
}




.padlock-bonus{
  opacity:0;
  transform:translateY(4px);
  transition:all .3s ease;
}

.padlock-bonus.is-active{
  opacity:1;
  transform:translateY(0);
}

.padlock-bonus.streak.is-active{
  text-shadow:0 0 8px rgba(251,113,133,0.6);
}



/* =========================
   💎 BONUS PREVIEW UPGRADE
   ========================= */

.padlock-bonus-stack{
  margin-top:10px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(0,255,159,0.04);
  border:1px solid rgba(0,255,159,0.08);
}

/* base bonus line */
.padlock-bonus{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  margin:3px 0;
  opacity:0;
  transform:translateY(4px);
  transition:all .3s ease;
}

/* active animation */
.padlock-bonus.is-active{
  opacity:1;
  transform:translateY(0);
}

/* ⭐ LEVEL BONUS */
.padlock-bonus.level{
  color:#fde68a;
  font-weight:600;
}

/* 🔥 STREAK BONUS */
.padlock-bonus.streak{
  color:#fb7185;
  font-weight:700;
}

/* subtle glow when active */
.padlock-bonus.streak.is-active{
  text-shadow:0 0 10px rgba(251,113,133,0.6);
}

/* 💎 ESTIMATED REWARD */
.padlock-bonus.info{
  margin-top:6px;
  font-size:12px;
  color:#00ff9f;
  font-weight:700;
  letter-spacing:.01em;
  text-shadow:0 0 8px rgba(0,255,159,0.35);
}

/* subtle pulse (very light, not distracting) */
.padlock-bonus.info.is-active{
  animation:padlockBonusPulse 2.4s ease-in-out infinite;
}

@keyframes padlockBonusPulse{
  0%{ opacity:0.9; }
  50%{ opacity:1; }
  100%{ opacity:0.9; }
}



/* =========================
   ⚡ URGENCY SYSTEM
   ========================= */

.padlock-urgency-stack{
  margin-top:8px;
  padding-top:6px;
  border-top:1px solid rgba(255,255,255,0.06);
}

.padlock-urgency{
  font-size:11px;
  margin:3px 0;
  opacity:0.85;
}

/* ⏳ time pressure */
.padlock-urgency.time{
  color:#fbbf24;
}

/* 🔥 streak urgency */
.padlock-urgency.streak{
  color:#fb7185;
  font-weight:600;
}

/* ⚡ boost window */
.padlock-urgency.boost{
  color:#60a5fa;
}

/* subtle fade-in */
.padlock-urgency{
  opacity:0;
  transform:translateY(4px);
  transition:all .3s ease;
}

.padlock-bonus.is-active + .padlock-urgency-stack .padlock-urgency{
  opacity:1;
  transform:translateY(0);
}



/* =========================
   🧠 FINAL POLISH LAYER
   ========================= */

/* --- stronger separation between bonus + urgency --- */
.padlock-bonus-stack{
  position:relative;
  overflow:hidden;
}

.padlock-bonus-stack::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top right, rgba(0,255,159,0.08), transparent 40%);
  pointer-events:none;
}

/* --- urgency panel refinement --- */
.padlock-urgency-stack{
  margin-top:10px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,0.08);
}

/* --- urgency entry animation (staggered) --- */
.padlock-urgency{
  opacity:0;
  transform:translateY(6px);
  animation:padlockUrgencyFade .4s ease forwards;
}

.padlock-urgency:nth-child(1){ animation-delay:0.2s; }
.padlock-urgency:nth-child(2){ animation-delay:0.3s; }
.padlock-urgency:nth-child(3){ animation-delay:0.4s; }

@keyframes padlockUrgencyFade{
  from{
    opacity:0;
    transform:translateY(6px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* =========================
   ⚡ SMART URGENCY EFFECTS
   ========================= */

/* ⏳ ENDING SOON = pulse border + glow */
.padlock-event-card.is-ending-soon{
  animation:padlockUrgencyPulse 1.4s ease-in-out infinite;
}

@keyframes padlockUrgencyPulse{
  0%{
    box-shadow:0 12px 28px rgba(0,0,0,.24),
               0 0 0 1px rgba(251,191,36,.12) inset;
  }
  50%{
    box-shadow:0 16px 34px rgba(0,0,0,.28),
               0 0 0 1px rgba(251,191,36,.35) inset,
               0 0 26px rgba(251,191,36,.18);
  }
  100%{
    box-shadow:0 12px 28px rgba(0,0,0,.24),
               0 0 0 1px rgba(251,191,36,.12) inset;
  }
}

/* 🔥 streak urgency = stronger glow */
.padlock-urgency.streak{
  text-shadow:0 0 6px rgba(251,113,133,.4);
}

/* ⚡ high-value window = subtle electric pulse */
.padlock-urgency.boost{
  position:relative;
}

.padlock-urgency.boost::after{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:6px;
  background:linear-gradient(90deg, transparent, rgba(96,165,250,.25), transparent);
  opacity:0;
  animation:padlockBoostSweep 2.6s linear infinite;
}

@keyframes padlockBoostSweep{
  0%{ opacity:0; transform:translateX(-40%); }
  50%{ opacity:.4; }
  100%{ opacity:0; transform:translateX(40%); }
}

/* =========================
   💎 PREMIUM MICRO-DETAILS
   ========================= */

/* reward line subtle shimmer */
.padlock-event-reward{
  position:relative;
}

.padlock-event-reward::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.2), transparent);
  opacity:0;
  animation:padlockShimmer 3s infinite;
}

@keyframes padlockShimmer{
  0%{ transform:translateX(-60%); opacity:0; }
  40%{ opacity:.25; }
  100%{ transform:translateX(60%); opacity:0; }
}

/* slightly stronger hover on important cards */
.padlock-event-card.rarity-epic:hover,
.padlock-event-card.rarity-legendary:hover{
  transform:translateY(-6px) scale(1.01);
}

/* =========================
   📱 MOBILE TIGHTENING
   ========================= */

@media (max-width:640px){

  .padlock-bonus-stack{
    padding:6px 8px;
  }

  .padlock-bonus{
    font-size:11px;
  }

  .padlock-urgency{
    font-size:10px;
  }

  .padlock-event-reward{
    font-size:13px;
  }
}