/* Shared Vault Inc. pop-ups: spawn at random spots; X closes, "Take me" goes to the vault page. */
.popups { position: fixed; inset: 0; pointer-events: none; z-index: 15; }
.popup {
  position: absolute;
  width: clamp(240px, 30vw, 420px);
  max-width: calc(100vw - 32px);
  aspect-ratio: 3193 / 2258;
  pointer-events: auto;
  filter: drop-shadow(0 10px 24px rgba(9, 11, 36, 0.55));
  animation: pop-in 260ms cubic-bezier(.2, 1.4, .4, 1) both;
}
.popup > img { display: block; width: 100%; height: 100%; }
.popup .hit {
  position: absolute;
  display: block;
  margin: 0; padding: 0; border: 0;
  background: transparent;
  cursor: pointer;
  color: transparent;
  font-size: 0;
}
.popup .close { left: 89.4%; top: 2.4%; width: 8.2%; height: 12.6%; }
.popup .take  { left: 31.8%; top: 74%;  width: 36.6%; height: 15.8%; }
.popup .hit:hover { background: rgba(255, 255, 255, 0.18); }
.popup .hit:focus-visible { outline: 2px solid var(--night, #090B24); outline-offset: 2px; }
.popup.is-closing { animation: pop-out 160ms ease-in both; }
@keyframes pop-in { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
@keyframes pop-out { to { opacity: 0; transform: scale(.85); } }
@media (prefers-reduced-motion: reduce) { .popup, .popup.is-closing { animation: none; } }