.lost-band{background:linear-gradient(135deg, var(--hero-a), var(--hero-b));padding-block:24px;overflow:hidden}.lost-band .wrap{justify-content:center;display:flex}.lost-stage{--lost-shadow:#0000004d;--t-roll:1.15s;--d-roll:1.7s;--t-pop:calc(var(--t-roll) + var(--d-roll) + 50ms);--t-idle:calc(var(--t-pop) + .45s);--t-catch:calc(var(--t-pop) + .33s);width:100%;max-width:760px}.lost-scene{position:relative}.lost-scene svg{width:100%;height:auto;display:block;overflow:visible}.lost-field,.lost-fx{pointer-events:none;position:absolute;inset:0}.lost-hopper{transform-origin:50% 84.6%;position:relative}@media (min-width:720px){.lost-band{padding-block:40px}}.lost-after{gap:40px 48px;padding-block:40px 64px;display:grid}.lost-copy{max-width:var(--measure)}.lost-copy p{color:var(--ink-2);text-wrap:pretty;margin-top:14px;font-size:18px}.lost-copy .btn-row{margin-top:24px}.lost-pages h2{letter-spacing:-.01em;margin-bottom:16px;font-size:20px;line-height:1.3}.lost-pages .facts{grid-template-columns:1fr 1fr;gap:12px 32px;max-width:none}@media (min-width:900px){.lost-after{grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:start;padding-block:56px 80px}.lost-pages{padding-top:10px}}.lost-ring{fill:none;stroke:var(--cream);stroke-width:1px;opacity:0;transform-box:view-box;transform-origin:200px 372px;animation:lost-ring 5.6s linear calc(var(--k) * -1.867s) infinite}.lost-mote{fill:var(--cream);opacity:0;animation:lost-mote var(--dur) linear var(--delay) infinite}.lost-mote-gold{fill:var(--coin)}.lost-digit{fill:var(--cream);letter-spacing:-.03em;transform-box:fill-box;transform-origin:50%;font-size:320px;font-weight:700}.lost-field ellipse{fill:var(--lost-shadow)}.lost-slot{fill:none;stroke:var(--cream);stroke-width:3px;stroke-dasharray:17 13;stroke-linecap:round;opacity:.75;transform-box:view-box;transform-origin:200px 372px;animation:24s linear infinite lost-slot-turn}.lost-ripple{fill:none;stroke:var(--cream);stroke-width:2px;opacity:0;transform-box:view-box;transform-origin:200px 372px}.lost-spark{fill:var(--coin);opacity:0;transform-box:view-box;transform-origin:200px 372px}.lost-dust circle{fill:#ffffff73;opacity:0;transform-box:fill-box;transform-origin:50%}.lost-stage:not([data-play]) .lost-puppet,.lost-stage:not([data-play]) #tf-shadow-frog{opacity:0}@property --breath{syntax:"<number>";inherits:false;initial-value:1}@property --tilt{syntax:"<angle>";inherits:false;initial-value:0deg}@property --arm{syntax:"<angle>";inherits:false;initial-value:0deg}@property --cx{syntax:"<length>";inherits:false;initial-value:0}@property --cy{syntax:"<length>";inherits:false;initial-value:0}@property --spin{syntax:"<angle>";inherits:true;initial-value:0deg}@property --lap{syntax:"<angle>";inherits:false;initial-value:0deg}@property --lid{syntax:"<number>";inherits:false;initial-value:0}@property --look-x{syntax:"<length>";inherits:true;initial-value:0}@property --look-y{syntax:"<length>";inherits:true;initial-value:0}@property --sx{syntax:"<number>";inherits:false;initial-value:1}@property --sy{syntax:"<number>";inherits:false;initial-value:1}@property --land{syntax:"<number>";inherits:true;initial-value:1}@property --sk{syntax:"<number>";inherits:false;initial-value:1}.lost-puppet [id]{transform-box:view-box;transform-origin:0 0}#tf-frog{transform-origin:200px 534px;transform:scale(var(--sx), var(--sy))}#tf-body{transform-origin:200px 475px;transform:scale(var(--breath))}#tf-head{transform:translate(200px, 475px) scale(var(--breath)) translate(-200px, -475px) translate(200px, 264px) rotate(var(--tilt)) translate(-200px, -264px)}#tf-arm-left{transform:translate(200px, 475px) scale(var(--breath)) translate(-200px, -475px) translate(87px, 254px) rotate(var(--arm)) translate(-87px, -254px)}#tf-arm-right{transform:translate(200px, 475px) scale(var(--breath)) translate(-200px, -475px) translate(313px, 254px) rotate(calc(-1 * var(--arm))) translate(-313px, -254px)}#tf-coin{transform:translate(200px, 475px) scale(var(--breath)) translate(-200px, -475px) translate(var(--cx), var(--cy)) translate(200px, 372px) rotate(var(--spin)) translate(-200px, -372px)}#tf-coin-shine{transform-origin:200px 372px;transform:rotate(calc(var(--lap) - var(--spin)))}#tf-eye-left-lid,#tf-eye-right-lid{transform:scale(1, var(--lid));opacity:clamp(0, calc(var(--lid) * 100), 1)}#tf-eye-left-lid{transform-origin:92.5px 47.5px}#tf-eye-right-lid{transform-origin:307.5px 47.5px}#tf-eye-left-pupil,#tf-eye-left-highlight,#tf-eye-right-pupil,#tf-eye-right-highlight{transform:translate(var(--look-x), var(--look-y));transition:transform .18s ease-out}.lost-field [id]{transform-box:view-box}#tf-shadow-frog{transform-origin:200px 534px;transform:scale(calc(.6 + .4 * var(--land)));opacity:var(--land)}#tf-shadow-coin{transform-origin:200px 534px;transform:translateX(var(--cx)) scale(var(--sk));opacity:0}.lost-stage[data-play] .lost-puppet{transform-origin:50% 84.6%;animation:.75s cubic-bezier(.2,.7,.3,1) both lost-arrive}.lost-stage[data-play] .lost-field{animation:.75s cubic-bezier(.2,.7,.3,1) both lost-land}.lost-stage[data-play] .lost-dust circle{animation:.5s ease-out .4s both lost-dust}.lost-stage[data-play] #tf-eye-left-lid,.lost-stage[data-play] #tf-eye-right-lid{animation:lost-wake .3s ease-in-out .85s both, lost-blink 14.1s ease-in-out calc(var(--t-pop) + .55s) infinite}.lost-stage[data-play] #tf-arm-left,.lost-stage[data-play] #tf-arm-right{animation:lost-catch-arms .5s cubic-bezier(.2, .7, .3, 1) var(--t-pop) both, lost-breathe 4.2s ease-in-out var(--t-idle) infinite}.lost-stage[data-play] #tf-body{animation:lost-breathe 4.2s ease-in-out var(--t-idle) infinite}.lost-stage[data-play] #tf-head{animation:lost-breathe 4.2s ease-in-out var(--t-idle) infinite, lost-tilt 7.3s ease-in-out var(--t-idle) infinite}.lost-stage[data-play] #tf-frog{animation:lost-catch-squash .45s ease-in-out calc(var(--t-pop) + .2s)}.lost-stage[data-play] #tf-coin{animation:lost-roll var(--d-roll) linear var(--t-roll) both, lost-pop .5s linear var(--t-pop) forwards, lost-breathe 4.2s ease-in-out var(--t-idle) infinite}.lost-stage[data-play] #tf-coin-shine{animation:lost-lap 7s linear calc(var(--t-pop) + .8s) infinite}.lost-stage[data-play] #tf-shadow-coin{animation:lost-roll var(--d-roll) linear var(--t-roll) both, lost-pop-shadow .5s ease-out var(--t-pop) forwards}.lost-stage[data-play] .lost-slot{animation:lost-slot-turn 24s linear infinite, lost-slot-out .45s ease-out var(--t-catch) forwards}.lost-stage[data-play] .lost-ripple{animation:lost-ripple 1s cubic-bezier(.2, .7, .3, 1) calc(var(--t-catch) + var(--k) * .13s) both}.lost-stage[data-play] .lost-spark{animation:lost-spark .75s cubic-bezier(.2, .7, .3, 1) var(--t-catch) both}.lost-stage[data-play] .lost-digit{animation:lost-bump .5s cubic-bezier(.2, .7, .3, 1) var(--t-catch)}.lost-stage[data-play] #tf-eye-left,.lost-stage[data-play] #tf-eye-right{animation:lost-watch calc(var(--d-roll) + .6s) linear calc(var(--t-roll) - .1s) both, lost-glance 16s ease-in-out calc(var(--t-idle) + .5s) infinite}.lost-stage[data-look] #tf-eye-left,.lost-stage[data-look] #tf-eye-right{animation:none}.lost-hopper.hop{animation:.62s cubic-bezier(.3,.8,.3,1) lost-hop}.lost-scene:has(.hop) #tf-shadow-frog{animation:.62s cubic-bezier(.3,.8,.3,1) lost-shadow-hop}@keyframes lost-ring{0%{opacity:.2;transform:scale(.5)}to{opacity:0;transform:scale(2.6)}}@keyframes lost-mote{0%{opacity:0;transform:translateY(0)}12%{opacity:.7}50%{opacity:.4}70%{opacity:.65}88%{opacity:.6}to{transform:translateY(calc(-1 * var(--rise)));opacity:0}}@keyframes lost-slot-turn{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes lost-slot-out{0%{opacity:.75;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}@keyframes lost-ripple{0%{opacity:0;transform:scale(1)}8%{opacity:.6}to{opacity:0;transform:scale(3.1)}}@keyframes lost-spark{0%{transform:rotate(var(--a)) translateX(100px) scale(.6);opacity:0}10%{opacity:1}70%{opacity:.9}to{transform:rotate(var(--a)) translateX(330px) scale(1.1);opacity:0}}@keyframes lost-bump{0%,to{transform:scale(1)}40%{transform:scale(1.06)}}@keyframes lost-dust{0%{opacity:0;transform:translate(0)scale(.4)}15%{opacity:.6}to{transform:translate(calc(var(--side) * 46px), -14px) scale(1.5);opacity:0}}@keyframes lost-arrive{0%{opacity:0;transform:translateY(-150px)scale(.97,1.04)}55%{opacity:1;transform:translateY(0)scale(1.06,.91)}78%{transform:translateY(0)scale(.99,1.01)}to{opacity:1;transform:none}}@keyframes lost-land{0%{--land:0}55%{--land:1.08}78%{--land:.98}to{--land:1}}@keyframes lost-wake{0%{--lid:1}to{--lid:0}}@keyframes lost-blink{0%,1.56%,33.33%,34.89%,36.74%,38.3%,66.67%,68.23%,to{--lid:0}.78%,34.11%,37.52%,67.45%{--lid:1}}@keyframes lost-catch-arms{0%{--arm:20deg}70%{--arm:-4deg}to{--arm:0deg}}@keyframes lost-breathe{0%,to{--breath:1}50%{--breath:1.012}}@keyframes lost-tilt{0%,to{--tilt:0deg}25%{--tilt:1.5deg}75%{--tilt:-1.5deg}}@keyframes lost-catch-squash{0%,to{--sx:1;--sy:1}40%{--sx:1.03;--sy:.965}}@keyframes lost-roll{0%{--cx:var(--cx0,-1400px);--cy:49px;--spin:var(--spin0,-890deg);opacity:1;animation-timing-function:cubic-bezier(.16,.7,.3,1)}86%{--cx:10px;--cy:49px;--spin:-174.93deg;opacity:1;animation-timing-function:ease-in-out}to{--cx:0px;--cy:49px;--spin:-180deg;opacity:1}}@keyframes lost-pop{0%{--cx:0px;--cy:49px;--spin:-180deg;animation-timing-function:cubic-bezier(.2,.8,.3,1)}62%{--cx:0px;--cy:-9px;--spin:-24deg;animation-timing-function:ease-in-out}to{--cx:0px;--cy:0px;--spin:0deg}}@keyframes lost-pop-shadow{0%{--sk:1;opacity:1}to{--sk:.5;opacity:0}}@keyframes lost-lap{0%{--lap:0deg;animation-timing-function:ease-in-out}22.86%,to{--lap:360deg}}@keyframes lost-watch{0%{--look-x:0px;--look-y:0px;animation-timing-function:ease-in-out}5%{--look-x:-11px;--look-y:4px;animation-timing-function:cubic-bezier(.16,.7,.3,1)}78%{--look-x:0px;--look-y:8px}84%{--look-x:0px;--look-y:8px;animation-timing-function:ease-in-out}to{--look-x:0px;--look-y:0px}}@keyframes lost-glance{0%,31%,40.5%,72%,80%,to{--look-x:0px;--look-y:0px}33.5%,38%{--look-x:-9px;--look-y:3px}74.5%,77.5%{--look-x:8px;--look-y:4px}}@keyframes lost-hop{0%{transform:scale(1.06,.9)}35%{transform:translateY(-22px)scale(.96,1.06)rotate(-4deg)}70%{transform:translateY(0)scale(1.04,.94)}to{transform:none}}@keyframes lost-shadow-hop{0%{transform:scale(1.04)}35%{opacity:.55;transform:scale(.82)}70%{opacity:1;transform:scale(1.03)}to{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.lost-stage:not([data-play]) .lost-puppet,.lost-stage:not([data-play]) #tf-shadow-frog,.lost-stage .lost-puppet,.lost-stage #tf-shadow-frog{opacity:1;animation:none}.lost-stage [id],.lost-stage [class],.lost-hopper{transition:none;animation:none!important}.lost-slot{display:none}.lost-mote{opacity:.5}.lost-ring{opacity:.1}.lost-ring:first-child{transform:scale(1)}.lost-ring:nth-child(2){transform:scale(1.6)}.lost-ring:nth-child(3){transform:scale(2.2)}}
