/* Unique Shrine Hall portal sound interactions */

.shrine-portal-audio {
  display: none;
}

.shrine-portal {
  --portal-opening-glow: rgba(255, 246, 237, 0.3);
}

.shrine-portal.portal-opening {
  pointer-events: none;
  transform: translateY(-3px) scale(0.992);
  box-shadow:
    0 28px 60px rgba(76, 22, 41, 0.22),
    0 0 0 1px var(--portal-opening-glow) inset,
    0 0 34px var(--portal-opening-glow);
}

.mac-portal.portal-opening {
  --portal-opening-glow: rgba(231, 171, 137, 0.32);
}

.emre-portal.portal-opening {
  --portal-opening-glow: rgba(176, 234, 241, 0.34);
}

.shrine-portal.portal-opening .portal-sigil {
  animation: shrinePortalSigilWake 1.08s ease-out both;
}

.shrine-portal.portal-opening .portal-copy,
.shrine-portal.portal-opening .portal-action {
  animation: shrinePortalCopyWake 1.08s ease-out both;
}

.mac-portal.portal-opening::after {
  animation: macPortalSoundPulse 1.08s ease-out both;
}

.emre-portal.portal-opening::after {
  animation: emrePortalSoundPulse 1.08s ease-out both;
}

body.shrine-portal-leaving .site-header,
body.shrine-portal-leaving .shrines-page > :not(#shrine-doors),
body.shrine-portal-leaving .site-footer {
  opacity: 0.82;
  transition: opacity 220ms ease;
}

@keyframes shrinePortalSigilWake {
  0% { transform: scale(1); filter: brightness(1); }
  18% { transform: scale(0.92); filter: brightness(1.3); }
  48% { transform: scale(1.12); filter: brightness(1.5); }
  100% { transform: scale(1.02); filter: brightness(1.08); }
}

@keyframes shrinePortalCopyWake {
  0%, 16% { transform: translateY(0); }
  44% { transform: translateY(-3px); }
  100% { transform: translateY(-1px); }
}

@keyframes macPortalSoundPulse {
  0% {
    box-shadow: 0 0 0 1.7rem rgba(255, 246, 237, 0.07);
    opacity: 1;
  }
  28% {
    box-shadow:
      0 0 0 1.7rem rgba(255, 246, 237, 0.04),
      0 0 0 3.1rem rgba(215, 142, 109, 0.06);
  }
  58% {
    box-shadow:
      0 0 0 2.2rem rgba(255, 246, 237, 0.05),
      0 0 0 4.4rem rgba(215, 142, 109, 0.025);
  }
  100% {
    box-shadow: 0 0 0 2.1rem rgba(255, 246, 237, 0.025);
    opacity: 0.82;
  }
}

@keyframes emrePortalSoundPulse {
  0% {
    box-shadow: 0 0 0 1.7rem rgba(255, 246, 237, 0.07);
    opacity: 1;
  }
  24% {
    box-shadow:
      0 0 0 1.7rem rgba(255, 246, 237, 0.04),
      0 0 0 3.3rem rgba(150, 229, 238, 0.07);
  }
  55% {
    box-shadow:
      0 0 0 2.5rem rgba(255, 246, 237, 0.04),
      0 0 0 4.8rem rgba(150, 229, 238, 0.025);
  }
  100% {
    box-shadow: 0 0 0 2.1rem rgba(255, 246, 237, 0.025);
    opacity: 0.82;
  }
}

@media (prefers-reduced-motion: reduce) {
  .shrine-portal.portal-opening,
  .shrine-portal.portal-opening .portal-sigil,
  .shrine-portal.portal-opening .portal-copy,
  .shrine-portal.portal-opening .portal-action,
  .mac-portal.portal-opening::after,
  .emre-portal.portal-opening::after {
    animation: none !important;
    transition: none !important;
  }

  body.shrine-portal-leaving .site-header,
  body.shrine-portal-leaving .shrines-page > :not(#shrine-doors),
  body.shrine-portal-leaving .site-footer {
    opacity: 1;
    transition: none;
  }
}
