/* Escena aislada: no cambia el estado visual ni funcional del POS. */
#birthdayEgg.birthday-egg-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  overflow: hidden;
  background: rgba(8, 10, 14, .86);
  color: #f8f3e8;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  isolation: isolate;
  animation: birthday-egg-backdrop-in .22s ease-out both;
}

#birthdayEgg.birthday-egg-backdrop.is-closing {
  animation: birthday-egg-backdrop-out .22s ease-in both;
}

#birthdayEgg .birthday-egg-card {
  position: relative;
  z-index: 1;
  width: min(100%, 35rem);
  padding: clamp(1.6rem, 5vw, 3rem);
  border: 1px solid rgba(243, 182, 93, .45);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 8%, rgba(223, 91, 71, .26), transparent 34%),
    linear-gradient(145deg, #20252b, #111417 68%);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .58), 0 0 0 1px rgba(255, 255, 255, .04) inset;
  text-align: center;
  animation: birthday-egg-card-in .42s cubic-bezier(.2, .8, .2, 1) both;
}

#birthdayEgg.is-closing .birthday-egg-card {
  animation: birthday-egg-card-out .2s ease-in both;
}

#birthdayEgg .birthday-egg-eyebrow {
  color: #f3b65d;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .19em;
}

#birthdayEgg .birthday-egg-cake {
  margin: .6rem 0 .35rem;
  font-size: clamp(3.3rem, 14vw, 5.2rem);
  line-height: 1;
  filter: drop-shadow(0 8px 16px rgba(243, 182, 93, .22));
  animation: birthday-egg-cake .8s ease-in-out .2s both;
}

#birthdayEgg h2 {
  max-width: 25rem;
  margin: 0 auto .95rem;
  color: #fff9ef;
  font-size: clamp(1.55rem, 5vw, 2.25rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}

#birthdayEgg h2 em {
  color: #f3b65d;
  font-style: normal;
}

#birthdayEgg .birthday-egg-card p {
  max-width: 29rem;
  margin: 0 auto;
  color: #cbd1d6;
  font-size: .96rem;
  line-height: 1.65;
}

#birthdayEgg .birthday-egg-aside {
  margin-top: .85rem;
  color: #f2c989;
  font-size: .78rem;
  line-height: 1.5;
}

#birthdayEgg .birthday-egg-dismiss {
  margin-top: 1.55rem;
  border: 1px solid rgba(243, 182, 93, .6);
  border-radius: 999px;
  padding: .7rem 1.05rem;
  background: rgba(243, 182, 93, .12);
  color: #fff3d7;
  font: inherit;
  font-size: .8rem;
  font-weight: 800;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

#birthdayEgg .birthday-egg-dismiss:hover,
#birthdayEgg .birthday-egg-dismiss:focus-visible {
  border-color: #f3b65d;
  background: rgba(243, 182, 93, .24);
  outline: none;
  transform: translateY(-1px);
}

#birthdayEgg .birthday-egg-footnote {
  margin-top: 1.1rem;
  color: #82909b;
  font-size: .62rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#birthdayEgg .birthday-egg-confetti {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#birthdayEgg .birthday-egg-confetti-piece {
  position: absolute;
  top: -1rem;
  left: var(--confetti-x);
  width: .42rem;
  height: .85rem;
  border-radius: 2px;
  background: var(--confetti-color);
  opacity: 0;
  transform: rotate(var(--confetti-rotation));
  animation: birthday-egg-confetti-fall 1.8s ease-out var(--confetti-delay) both;
}

@keyframes birthday-egg-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes birthday-egg-backdrop-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes birthday-egg-card-in {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes birthday-egg-card-out {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(8px) scale(.98); }
}

@keyframes birthday-egg-cake {
  0% { opacity: 0; transform: scale(.7) rotate(-8deg); }
  70% { opacity: 1; transform: scale(1.08) rotate(4deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

@keyframes birthday-egg-confetti-fall {
  0% { opacity: 0; transform: translateY(-1rem) rotate(var(--confetti-rotation)); }
  12% { opacity: .9; }
  100% { opacity: 0; transform: translateY(45vh) rotate(calc(var(--confetti-rotation) + 210deg)); }
}

@media (prefers-reduced-motion: reduce) {
  #birthdayEgg.birthday-egg-backdrop,
  #birthdayEgg .birthday-egg-card,
  #birthdayEgg .birthday-egg-cake,
  #birthdayEgg .birthday-egg-confetti-piece {
    animation: none !important;
  }
}