body.unlock-confetti-burst::after {
  content: '';
  position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background:
    radial-gradient(circle at 10% 20%, #ffcb08 2px, transparent 3px),
    radial-gradient(circle at 30% 50%, #ed1c24 2px, transparent 3px),
    radial-gradient(circle at 70% 30%, #b369aa 2px, transparent 3px),
    radial-gradient(circle at 90% 70%, #1a1a2e 2px, transparent 3px);
  background-size: 50% 50%;
  animation: confetti-fall 4s linear infinite;
}
@keyframes confetti-fall {
  0%   { background-position: 0 -10%, 25% -20%, 60% -30%, 80% -10%; }
  100% { background-position: 0 110%, 25% 120%, 60% 130%, 80% 110%; }
}

body.unlock-rainbow-logo .site-logo-img,
body.unlock-rainbow-logo .logo img {
  animation: rainbow-shift 6s linear infinite;
}
@keyframes rainbow-shift {
  0%   { filter: hue-rotate(0deg) saturate(1.4); }
  100% { filter: hue-rotate(360deg) saturate(1.4); }
}

body.unlock-gold-theme {
  --c-purple: #d4af37;
  --c-yellow: #fff9b0;
}
body.unlock-gold-theme .site-header,
body.unlock-gold-theme .site-footer,
body.unlock-gold-theme header,
body.unlock-gold-theme footer {
  background: linear-gradient(135deg, #fff9b0, #d4af37);
}

body.unlock-neon-glow .site-header,
body.unlock-neon-glow .home-hero,
body.unlock-neon-glow .unlocks-progress-bar {
  box-shadow: 0 0 40px var(--c-purple, #b369aa), 0 0 80px var(--c-purple, #b369aa);
}

.unlock-image-slot { display: flex; flex-direction: column; gap: var(--s-3); margin-top: var(--s-4); }
.unlock-image-slot .unlock-image { max-width: 100%; border-radius: var(--r-md); box-shadow: var(--shadow-md); }
.unlock-media-slot { display: flex; flex-direction: column; gap: var(--s-3); margin-top: var(--s-4); }
.unlock-media-slot .unlock-media { width: 100%; }

.unlocks-section { padding: var(--s-6) 0; }
.unlocks-progress { margin: var(--s-4) 0; }
.unlocks-progress-bar {
  height: 24px; background: var(--n-100); border-radius: var(--r-full); overflow: hidden;
  position: relative;
}
.unlocks-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--c-yellow, #ffcb08), var(--c-red, #ed1c24), var(--c-purple, #b369aa));
  transition: width 1.5s ease-out;
}
.unlocks-progress-label {
  margin-top: var(--s-2); font-weight: 600; text-align: center;
}
.unlocks-list-home {
  display: grid; gap: var(--s-3); margin-top: var(--s-4);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.unlock-item {
  padding: var(--s-3); background: var(--n-0); border-radius: var(--r-md);
  border: 1px solid var(--n-100);
  display: grid; grid-template-columns: auto auto 1fr; gap: var(--s-2);
  align-items: center;
}
.unlock-item.is-locked { opacity: 0.65; }
.unlock-item-status { font-size: 20px; }
.unlock-item-threshold {
  font-family: var(--ff-display); font-weight: 900; color: var(--c-purple);
}
.unlock-item-label { font-weight: 600; grid-column: 1 / -1; }
.unlock-item-desc { font-size: var(--fs-small); color: var(--n-500); grid-column: 1 / -1; }