/* The ending: the blue robot walks towards mountains it never reaches. One ground line, a few one-line birds. */
@keyframes end-slide{to{transform:translateX(calc(var(--d)*-1))}}
@keyframes end-walk36{to{transform:translateX(calc(-100%*35/36))}}
.we-e{--h:clamp(88px,8.4vw,122px);--asp:.7934;--rx:.4688;--r:9.256;--n:30;--T:1.7s;--air:clamp(150px,26svh,280px);
  --tw:calc(var(--h)*var(--r));--mw:min(40vw,720px);--mr:3vw;--ma:2.336;--mh:calc(var(--mw)/var(--ma));--gh:calc(var(--tw)*.05);
  --x:calc(100% + var(--mr) - var(--mw) - var(--h)*.12);
  position:relative;overflow:clip;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;
  min-height:calc(var(--air) + max(var(--mh),var(--h)) + var(--gh)*.5);padding-top:var(--air);padding-bottom:calc(var(--gh)*.5 + 24px)}
.we-e a{position:relative;z-index:2;align-self:flex-start}
.end-scene{position:absolute;inset:0;z-index:1;overflow:clip;pointer-events:none}
.end-mtn{position:absolute;right:calc(var(--mr)*-1);bottom:calc(var(--gh)*.5 - var(--mh)*.06);width:var(--mw);height:auto;max-width:none}
/* every moving layer repeats in exactly --n walk cycles, so the loop has no seam */
.end-ground{--d:var(--tw);position:absolute;left:0;bottom:0;width:calc(100% + var(--d));height:var(--gh);background-repeat:repeat-x;background-size:var(--d) 100%;will-change:transform}
.end-scene.on .end-ground{background-image:url(ground2.webp)}
.end-walker{position:absolute;z-index:1;bottom:calc(var(--gh)*.5 - var(--h)*.0165 + 1px);left:var(--x);height:var(--h);width:calc(var(--h)*var(--asp));
  margin-left:calc(var(--h)*var(--asp)*var(--rx)*-1);overflow:hidden}
.end-walker img{display:block;height:100%;width:3600%;max-width:none}
html.mv .end-ground{animation:end-slide calc(var(--T)*var(--n)) linear infinite paused}
html.mv .end-walker img{animation:end-walk36 var(--T) steps(36,jump-none) infinite paused}
html.mv .end-scene.on.live .end-ground,html.mv .end-scene.on.live .end-walker img{animation-play-state:running}
@media (prefers-reduced-motion:reduce){.end-ground,.end-walker img{animation:none!important}}
.end-sky{position:absolute;inset:0;z-index:1;pointer-events:none}
.end-sky i{position:absolute;left:0;top:0;background:url(birds.webp) 0 0/300% 100% no-repeat;will-change:transform}
@media (max-width:1040px){
  .we-e{--h:78px;--mw:min(100vw,560px);--mr:40px;--air:clamp(110px,18svh,180px);display:block;min-height:0;padding-bottom:0}
  .we-e .end-scene{position:relative;inset:auto;height:calc(max(var(--mh),var(--h)) + var(--gh)*.5 + 8px);margin:32px -16px 0}
}
