/* ---------- ENTRAR A LA CUEVA (carta → rituales) y salir de ella ---------- */
/* la carta se hunde hacia la boca de la cueva */
.wrap{transition:transform .55s cubic-bezier(.6,0,.4,1),filter .55s ease}
.wrap.cave-in{transform:scale(1.35);filter:brightness(.35) blur(2px)}
/* la oscuridad se cierra desde los bordes hasta el centro; en el centro queda un brillo dorado que se apaga */
.cave{position:fixed;inset:0;z-index:999;pointer-events:none;--x:50%;--y:50%;
  background:radial-gradient(circle at var(--x) var(--y),rgba(201,168,76,.35) 0,rgba(10,9,0,.2) 18%,#0A0900 42%);
  -webkit-mask:radial-gradient(circle at var(--x) var(--y),transparent 0,transparent var(--r,140vmax),#000 calc(var(--r,140vmax) + 1px));
  mask:radial-gradient(circle at var(--x) var(--y),transparent 0,transparent var(--r,140vmax),#000 calc(var(--r,140vmax) + 1px));
  animation:cave-close .5s cubic-bezier(.7,0,.3,1) forwards}
@keyframes cave-close{0%{--r:140vmax}100%{--r:0vmax}}
@property --r{syntax:'<length-percentage>';inherits:false;initial-value:140vmax}
/* llegada: la oscuridad se abre desde el centro y aparece el mundo */
.portal-in{position:fixed;inset:0;z-index:999;pointer-events:none;background:#0A0900;
  -webkit-mask:radial-gradient(circle at 50% 42%,transparent 0,transparent var(--r,0vmax),#000 calc(var(--r,0vmax) + 1px));
  mask:radial-gradient(circle at 50% 42%,transparent 0,transparent var(--r,0vmax),#000 calc(var(--r,0vmax) + 1px));
  animation:cave-open .5s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes cave-open{0%{--r:0vmax}100%{--r:140vmax}}
@media (prefers-reduced-motion:reduce){.cave,.portal-in{display:none}.wrap.cave-in{transform:none;filter:none}}
