.qy-easter-portal {
  position: fixed;
  z-index: 10040;
  inset: 0;
  visibility: hidden;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 460ms var(--qy-ease-standard), visibility 0s linear 460ms;
}

.qy-easter-portal.is-active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0s;
}

body.qy-easter-active { overflow: hidden; }

.qy-easter__close {
  position: absolute;
  z-index: 40;
  top: max(18px, env(safe-area-inset-top));
  right: max(18px, env(safe-area-inset-right));
  min-height: 38px;
  padding: 0 15px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: var(--qy-radius-pill);
  color: rgba(255, 255, 255, 0.9);
  background: rgba(25, 18, 29, 0.52);
  box-shadow: 0 12px 36px rgba(12, 8, 16, 0.2);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  cursor: pointer;
  font-family: var(--qy-font-sans);
  font-size: 0.62rem;
  font-weight: 760;
  transition: background var(--qy-duration-fast), transform var(--qy-duration-fast) var(--qy-ease-spring);
}

.qy-easter__close:hover { background: rgba(39, 27, 45, 0.76); transform: translateY(-1px); }

.qy-bloom,
.qy-wormhole { position: absolute; inset: 0; overflow: hidden; }

.qy-bloom {
  background:
    radial-gradient(circle at 16% 18%, rgba(255, 219, 177, 0.32), transparent 34rem),
    radial-gradient(circle at 82% 22%, rgba(177, 137, 206, 0.28), transparent 36rem),
    radial-gradient(circle at 48% 94%, rgba(142, 207, 191, 0.18), transparent 32rem),
    linear-gradient(145deg, rgba(39, 29, 43, 0.78), rgba(82, 54, 76, 0.67));
  backdrop-filter: blur(12px) saturate(126%);
  -webkit-backdrop-filter: blur(12px) saturate(126%);
}

.qy-bloom__ambient,
.qy-bloom__vignette,
.qy-bloom__stage { position: absolute; inset: 0; }

.qy-bloom__ambient {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.046) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.046) 1px, transparent 1px);
  background-size: 68px 68px;
  mask-image: radial-gradient(circle at 50% 46%, #000, transparent 78%);
  -webkit-mask-image: radial-gradient(circle at 50% 46%, #000, transparent 78%);
  opacity: 0.62;
  animation: qy-bloom-grid 8s ease-in-out infinite alternate;
}

.qy-bloom__vignette {
  z-index: 6;
  background: radial-gradient(circle at center, transparent 48%, rgba(17, 11, 19, 0.32));
  pointer-events: none;
}

.qy-bloom__stage { z-index: 3; overflow: hidden; contain: strict; }

.qy-bloom-card {
  position: absolute;
  top: 0;
  left: 0;
  width: clamp(142px, 13vw, 188px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--card-accent) 29%, rgba(255, 255, 255, 0.72));
  border-radius: 13px;
  color: #302433;
  background: color-mix(in srgb, var(--card-bg) 92%, rgba(255, 255, 255, 0.78));
  box-shadow: 0 18px 46px rgba(21, 14, 25, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.78);
  opacity: 0;
  contain: layout paint style;
  will-change: transform, opacity, filter;
}

.qy-bloom-card__chrome {
  display: flex;
  height: 25px;
  align-items: center;
  gap: 5px;
  padding: 0 9px;
  border-bottom: 1px solid color-mix(in srgb, var(--card-accent) 16%, transparent);
  background: rgba(255, 255, 255, 0.5);
}

.qy-bloom-card__chrome > span {
  min-width: 0;
  flex: 1;
  color: color-mix(in srgb, var(--card-accent) 64%, #453448);
  font-size: 0.43rem;
  font-weight: 750;
}

.qy-bloom-card__chrome i { width: 6px; height: 6px; border-radius: 50%; background: color-mix(in srgb, var(--card-accent) 62%, #fff); opacity: 0.7; }
.qy-bloom-card__chrome i:nth-last-child(2) { opacity: 0.46; }
.qy-bloom-card__chrome i:last-child { opacity: 0.26; }

.qy-bloom-card p {
  display: grid;
  min-height: 52px;
  place-items: center;
  margin: 0;
  padding: 12px 14px 14px;
  font-size: clamp(0.7rem, 1.3vw, 0.82rem);
  font-weight: 680;
  letter-spacing: -0.02em;
  text-align: center;
}

.qy-bloom-card.is-heart {
  width: 46px;
  height: 34px;
  border-radius: 12px;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--card-accent) 26%, transparent);
}
.qy-bloom-card.is-heart .qy-bloom-card__chrome,
.qy-bloom-card.is-heart p { display: none; }

.qy-wormhole {
  display: grid;
  place-items: center;
  color: #f6f1f7;
  background:
    radial-gradient(circle at 50% 50%, rgba(158, 101, 184, 0.19), transparent 24%),
    radial-gradient(circle at 16% 14%, rgba(85, 174, 186, 0.13), transparent 31rem),
    #07060a;
}

.qy-wormhole__field {
  position: absolute;
  inset: -20%;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.62) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(207, 165, 230, 0.45) 0 1px, transparent 1.5px);
  background-position: 0 0, 31px 46px;
  background-size: 73px 73px, 97px 97px;
  opacity: 0.34;
  transform: perspective(500px) rotateX(66deg) scale(1.8);
  animation: qy-wormhole-field 2.8s linear infinite;
}

.qy-wormhole__core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(58vw, 540px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #030205 0 18%, rgba(24, 12, 31, 0.98) 27%, rgba(147, 89, 177, 0.28) 45%, transparent 67%);
  filter: drop-shadow(0 0 60px rgba(168, 112, 196, 0.28));
  transform: translate(-50%, -50%) scale(0.25) rotate(-18deg);
  animation: qy-wormhole-open 2.3s var(--qy-ease-spring) forwards;
}

.qy-wormhole__core::before,
.qy-wormhole__core::after,
.qy-wormhole__core i {
  position: absolute;
  border: 1px solid rgba(205, 160, 228, 0.25);
  border-radius: 50%;
  content: '';
}
.qy-wormhole__core::before { inset: 9%; animation: qy-wormhole-spin 5s linear infinite; border-width: 2px 0 1px 2px; }
.qy-wormhole__core::after { inset: 20%; animation: qy-wormhole-spin 3.8s linear infinite reverse; border-width: 1px 2px 2px 0; }
.qy-wormhole__core i:nth-child(1) { inset: 2%; border-color: rgba(82, 184, 196, 0.16); animation: qy-wormhole-spin 7s linear infinite reverse; }
.qy-wormhole__core i:nth-child(2) { inset: 14%; border-color: rgba(237, 177, 207, 0.19); animation: qy-wormhole-spin 4.4s linear infinite; }
.qy-wormhole__core i:nth-child(3) { inset: 27%; border-color: rgba(255, 255, 255, 0.12); animation: qy-wormhole-spin 2.7s linear infinite reverse; }
.qy-wormhole__core i:nth-child(4) { inset: 38%; border-color: rgba(174, 119, 202, 0.33); animation: qy-wormhole-spin 2s linear infinite; }

.qy-wormhole__copy {
  position: relative;
  z-index: 5;
  display: grid;
  width: min(500px, calc(100vw - 40px));
  justify-items: center;
  gap: 7px;
  padding: 30px;
  border: 1px solid rgba(229, 207, 239, 0.15);
  border-radius: clamp(22px, 4vw, 34px);
  color: #f6f1f7;
  background: rgba(17, 12, 21, 0.52);
  box-shadow: 0 36px 100px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  opacity: 0;
  transform: translateY(16px) scale(0.96);
  animation: qy-wormhole-copy 900ms 1.1s var(--qy-ease-spring) forwards;
  text-align: center;
}
.qy-wormhole__copy span { color: rgba(211, 174, 228, 0.62); font-size: 0.51rem; font-weight: 780; letter-spacing: 0.16em; }
.qy-wormhole__copy strong { font-size: clamp(1.5rem, 5vw, 2.7rem); letter-spacing: -0.055em; }
.qy-wormhole__copy p { margin: 0; color: rgba(241, 232, 246, 0.66); font-size: 0.7rem; }
.qy-wormhole__copy a {
  margin-top: 9px;
  padding: 9px 15px;
  border: 1px solid rgba(222, 188, 238, 0.25);
  border-radius: var(--qy-radius-pill);
  color: #fff;
  background: rgba(151, 91, 178, 0.42);
  text-decoration: none;
}
.qy-wormhole.is-settled .qy-wormhole__core { filter: drop-shadow(0 0 72px rgba(168, 112, 196, 0.34)); }

@keyframes qy-bloom-grid { to { opacity: 0.38; transform: translate3d(18px, -12px, 0); } }
@keyframes qy-wormhole-field { to { background-position: 73px 73px, -66px -51px; } }
@keyframes qy-wormhole-open { to { transform: translate(-50%, -50%) scale(1) rotate(0); } }
@keyframes qy-wormhole-spin { to { transform: rotate(360deg); } }
@keyframes qy-wormhole-copy { to { opacity: 1; transform: none; } }

@media (max-width: 680px) {
  .qy-bloom-card { width: 132px; border-radius: 11px; }
  .qy-bloom-card__chrome { height: 22px; }
  .qy-bloom-card p { min-height: 43px; padding: 9px 10px 11px; font-size: 0.64rem; }
  .qy-bloom-card.is-heart { width: 38px; height: 28px; }
  .qy-wormhole__core { width: min(92vw, 470px); }
  .qy-wormhole__copy { width: min(88vw, 430px); padding: 24px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .qy-bloom__ambient,
  .qy-wormhole__field,
  .qy-wormhole__core,
  .qy-wormhole__core::before,
  .qy-wormhole__core::after,
  .qy-wormhole__core i,
  .qy-wormhole__copy { animation: none !important; }
  .qy-wormhole__core { transform: translate(-50%, -50%); }
  .qy-wormhole__copy { opacity: 1; transform: none; }
  .qy-easter-portal { transition-duration: 120ms; }
}