/* Intrinsic motion is independent of the paused scene used for review. */
.backgrounds-stage .continuous-collage[data-detail-motion="true"] [data-detail-visible="true"] .iso-live *{animation-play-state:running!important}
/* IA: datos entran, el núcleo responde y aparece el resultado. */
.iso-asset .motion-ai-core{transform-box:fill-box;transform-origin:50% 58%}
.iso-asset .motion-ai-data{transform-box:fill-box;transform-origin:16.6% 40.7%}
.iso-asset .motion-ai-check{transform-box:fill-box;transform-origin:83.3% 33.8%;opacity:0}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-ai-data{animation:beos-ai-data 8s ease-in-out infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-ai-core{animation:beos-ai-core 8s ease-in-out infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-ai-check{animation:beos-ai-check 8s ease-out infinite}
@keyframes beos-ai-data{
 0%,12%{transform:translate(0,0) scale(1);opacity:1}
 22%{transform:translate(45px,120px) scale(.8);opacity:1}
 32%{transform:translate(195px,160px) scale(.3);opacity:0}
 94%{transform:translate(195px,160px) scale(.3);opacity:0}
 95%{transform:translate(0,0) scale(1);opacity:0}
 100%{transform:translate(0,0) scale(1);opacity:1}
}
@keyframes beos-ai-core{
 0%,32%{transform:scale(1)}
 38%{transform:scale(1.045)}
 46%,100%{transform:scale(1)}
}
@keyframes beos-ai-check{
 0%,44%{transform:scale(.75);opacity:0}
 46%{transform:scale(.75);opacity:1}
 54%{transform:scale(1.07);opacity:1}
 60%,88%{transform:scale(1);opacity:1}
 95%,100%{transform:scale(1);opacity:0}
}
/* Same frame and motion as the postcard, with the two white nodes attached below it. */
.continuous-collage .ai-postcard-anchor{position:absolute;left:21%;top:22%;width:61%;height:64%;border:7px solid transparent;transform:rotate(-6deg);z-index:2}
.continuous-collage .collage-ai{left:20%;top:94%;width:60%;height:auto;aspect-ratio:1254/900;rotate:7deg;z-index:2}
.continuous-collage[data-illustration="original"] .collage-ai{display:none}
@media(max-width:720px){
 .continuous-collage .ai-postcard-anchor{border-width:5px}
 .variant-section .visual{margin-bottom:32px}
}
@media(prefers-reduced-motion:reduce){.iso-asset *{animation:none!important}}
.iso-asset .iso-still{display:none}
.iso-asset .iso-live{display:block}
[data-detail-motion="false"] .iso-still{display:block}
[data-detail-motion="false"] .iso-live{display:none}
.iso-asset .motion-click,.iso-asset .motion-glitch,.iso-asset .motion-gleam{opacity:0}
.iso-asset .motion-payment{transform-box:view-box;transform-origin:center}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-paper{animation:beos-print 6.4s linear infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-cursor{animation:beos-cursor 6.2s ease-in-out infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-click{animation:beos-click 6.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-logo{animation:beos-tiktok 6.8s steps(1) infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-glitch-a{animation:beos-glitch-a 6.8s steps(1) infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-glitch-b{animation:beos-glitch-b 6.8s steps(1) infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-payment{animation:beos-payment 5.6s ease-out infinite}
[data-detail-motion="true"] [data-detail-visible="true"] .motion-gleam{animation:beos-gleam 5.6s ease-out infinite}
@keyframes beos-print{
 0%,5%{transform:translate(260px,-500px);opacity:1}
 13%{transform:translate(185px,-356px);animation-timing-function:steps(3)}
 24%{transform:translate(185px,-356px)}
 34%{transform:translate(110px,-212px);animation-timing-function:steps(3)}
 43%{transform:translate(110px,-212px)}
 56%{transform:translate(0,0)}
 86%{transform:translate(0,0);opacity:1}
 93%{transform:translate(-25px,48px);opacity:0}
 94%,100%{transform:translate(260px,-500px);opacity:0}
}
@keyframes beos-cursor{
 0%,12%{transform:translate(0,0)}
 25%,34%{transform:translate(-30px,-38px)}
 37%{transform:translate(-30px,-32px)}
 41%,49%{transform:translate(-30px,-38px)}
 68%,100%{transform:translate(0,0)}
}
@keyframes beos-click{
 0%,35%{opacity:0;transform:scale(.4)}
 36%{opacity:.5;transform:scale(.4)}
 45%{opacity:0;transform:scale(1.7)}
 100%{opacity:0}
}
@keyframes beos-tiktok{
 0%,37%{transform:translate(0,0)}
 38%{transform:translate(9px,-2px)}
 39.2%{transform:translate(-7px,2px)}
 40.4%,43%{transform:translate(0,0)}
 44%{transform:translate(5px,0)}
 45%,100%{transform:translate(0,0)}
}
@keyframes beos-glitch-a{
 0%,37.5%{opacity:0;transform:translate(0,0)}
 38%{opacity:.8;transform:translate(-24px,0)}
 39.3%{opacity:.65;transform:translate(19px,0)}
 40.5%,43%{opacity:0}
 44%{opacity:.5;transform:translate(-15px,0)}
 45%,100%{opacity:0}
}
@keyframes beos-glitch-b{
 0%,38%{opacity:0;transform:translate(0,0)}
 38.6%{opacity:.75;transform:translate(22px,0)}
 40%{opacity:.6;transform:translate(-18px,0)}
 41%,100%{opacity:0}
}
@keyframes beos-payment{
 0%,12%{transform:translateY(0) scale(1)}
 21%{transform:translateY(-12px) scale(1.045)}
 29%{transform:translateY(2px) scale(.995)}
 38%,100%{transform:translateY(0) scale(1)}
}
@keyframes beos-gleam{
 0%,18%{transform:translateX(0);opacity:0}
 20%{opacity:.7}
 38%{transform:translateX(1150px);opacity:0}
 100%{transform:translateX(1150px);opacity:0}
}
@media(prefers-reduced-motion:reduce){.iso-asset .iso-still{display:block!important}.iso-asset .iso-live{display:none!important}.iso-asset *{animation:none!important}}