@keyframes FwdZoomOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(5)}}@keyframes FwdZoomIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes BwdZoomOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}@keyframes BwdZoomIn{0%{opacity:0;transform:scale(5)}to{opacity:1;transform:scale(1)}}@keyframes FwdMoveOut{0%{opacity:1;transform:translate(0,0)rotateX(0)}50%{opacity:1;transform:translate3d(-10cm,0,-50cm)rotateX(45deg)}to{opacity:0;transform:translate3d(-50cm,0,-50cm)rotateX(0)}}@keyframes FwdMoveIn{0%{opacity:0;transform:translate3d(50cm,0,-50cm)rotateX(0)}50%{opacity:1;transform:translate3d(10cm,0,-50cm)rotateX(-45deg)}to{opacity:1;transform:translate(0,0)rotateX(0)}}@keyframes BwdMoveOut{0%{opacity:1;transform:translate(0,0)rotateX(0)}50%{opacity:1;transform:translate3d(10cm,0,-50cm)rotateX(-45deg)}to{opacity:0;transform:translate3d(50cm,0,-50cm)rotateX(0)}}@keyframes BwdMoveIn{0%{opacity:0;transform:translate3d(-50cm,0,-50cm)rotateX(0)}50%{opacity:1;transform:translate3d(-10cm,0,-50cm)rotateX(45deg)}to{opacity:1;transform:translate(0,0)rotateX(0)}}::view-transition-image-pair(*){perspective:50cm}#demo:where(.astro-ng7jbkbs){background:var(--vtbot-gradbg);border:1px dotted var(--vtbot-accent);padding:4ex}.button-grid:where(.astro-ng7jbkbs){background:var(--vtbot-gradbg);grid-template-columns:repeat(3,1fr);gap:10px;padding:3ex;display:grid}.button-grid:where(.astro-ng7jbkbs) button:where(.astro-ng7jbkbs){color:var(--vtbot-color);background:var(--vtbot-table-background);border:dotted 1px var(--vtbot-color);padding:10px;font-size:16px}.button-grid:where(.astro-ng7jbkbs) button:where(.astro-ng7jbkbs).selected{color:var(--vtbot-accent);background:var(--vtbot-gradbg);border:solid 2px var(--vtbot-accent)}a{color:var(--vtbot-global-accent)}img{background-color:gray;margin:1ex;padding:.2ex}::view-transition-old(root),::view-transition-new(root),::view-transition-group(*){animation:none}