/* tw-live.css - the only custom CSS for page motion; everything else is Tailwind classes */
@view-transition{navigation:auto}
::view-transition-old(root){animation:tw-vt-out .12s ease both}
::view-transition-new(root){animation:tw-vt-in .2s ease both}
@keyframes tw-vt-out{to{opacity:0}}
@keyframes tw-vt-in{from{opacity:0}}
#tw-side{view-transition-name:tw-side}
.tw-bn{view-transition-name:tw-bn}
main.tw-main:focus{outline:0}
@keyframes tw-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.tw-enter .tw-rise{animation:tw-rise .45s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i,0)*45ms)}
.tw-wait{opacity:.5;transition:opacity .18s ease;pointer-events:none}
.tw-wait.tw-slow{animation:tw-pulse .9s ease-in-out infinite alternate}
@keyframes tw-pulse{to{opacity:.3}}
img.tw-img{opacity:0;transform:scale(1.02)}
img.tw-img.tw-in{opacity:1;transform:none;transition:opacity .45s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.tw-skel{border-radius:.5rem;background:linear-gradient(100deg,rgba(148,163,184,.14) 30%,rgba(148,163,184,.32) 50%,rgba(148,163,184,.14) 70%) 0 0/200% 100%;animation:tw-shim 1.3s linear infinite}
@keyframes tw-shim{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){
  .tw-enter .tw-rise,.tw-wait.tw-slow,.tw-skel{animation:none}
  .tw-wait{transition:none}
  img.tw-img,img.tw-img.tw-in{opacity:1;transform:none;transition:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}