.story{margin:18px 0 24px;border:1px solid #cbd9c7;border-radius:13px;overflow:hidden;background:#f5f6eb}.story-heading{padding:10px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce4d3}.story-heading small{font-size:10px;letter-spacing:1.6px;color:var(--muted);font-weight:700}.story-play{background:white;color:var(--green);border:1px solid #c5d1c0;border-radius:20px;font-size:12px;padding:5px 13px;min-height:36px}.story-stage{height:245px;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(#e5f0ec,#f5f3d9);--from:27%;--to:62%;--scale:1;--angle:0deg}.story-sky{position:absolute;width:40px;height:40px;border-radius:50%;background:#ebc56d;right:25px;top:22px;opacity:.65}.story-floor{position:absolute;bottom:68px;height:23px;background:#bbcca3;width:100%;border-radius:50% 50% 0 0}.story-setting{position:absolute;left:43%;top:25px;font-size:68px;line-height:1.3;opacity:.5;filter:saturate(.6)}.story-shot{position:absolute;inset:0;opacity:0;visibility:hidden;--delay:0s;--end:0;animation:story-first 3s linear var(--delay) both}.shot-1{--delay:3s;animation-name:story-middle}.shot-2{--delay:6s;animation-name:story-last}.story-actor,.story-object,.story-extra{position:absolute;top:79px;left:var(--from);font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:58px;line-height:1.3;transform-origin:50% 100%;display:block;filter:drop-shadow(0 4px 2px #174f4614)}.story-object{left:69%;font-size:51px;top:91px}.story-caption{position:absolute;bottom:0;left:0;right:0;margin:0!important;padding:13px 34px 12px 15px;min-height:68px;display:flex;justify-content:center;align-items:center;background:#fffdf5e8;color:var(--ink)!important;text-align:center;font:15px/1.5 system-ui,sans-serif!important;border-top:1px solid #dde3d5}.story-step{position:absolute;right:9px;bottom:5px;font-size:9px;color:var(--muted)}.story-still{display:none;font-size:13px;padding:12px;margin:0}.shot-1 .story-actor{animation:story-act 2.7s ease-in-out var(--delay) both}.shot-2 .story-actor{left:var(--to);transform:scale(var(--scale)) rotate(var(--angle))}.story-extra{opacity:0;font-size:35px;left:15%;top:50px}.extra-1{left:40%;top:89px}.extra-2{left:54%;top:43px}.extra-3{left:72%;top:54px}.extra-4{left:33%;top:20px}.shot-1 .story-extra{animation:story-appear .5s ease calc(var(--delay) + .3s) both}.shot-1 .extra-1{animation-delay:calc(var(--delay) + .7s)}.shot-1 .extra-2{animation-delay:calc(var(--delay) + 1.1s)}.shot-1 .extra-3{animation-delay:calc(var(--delay) + 1.5s)}.shot-1 .extra-4{animation-delay:calc(var(--delay) + 1.9s)}.shot-2 .story-extra{opacity:1}.motion-leave{--from:56%;--to:8%}.motion-approach{--from:9%;--to:54%}.motion-travel,.motion-walk{--from:12%;--to:68%}.motion-follow{--from:10%;--to:49%}.motion-jump{--from:17%;--to:65%}.motion-jump .shot-1 .story-actor{animation-name:story-jump}.motion-wave,.motion-bounce,.motion-roar,.motion-shake,.motion-wobble{--to:27%}.motion-wave .shot-1 .story-actor,.motion-bounce .shot-1 .story-actor{animation-name:story-bounce;animation-iteration-count:3;animation-duration:.9s}.motion-shake .shot-1 .story-actor,.motion-roar .shot-1 .story-actor{animation-name:story-shake;animation-iteration-count:6;animation-duration:.45s}.motion-wobble .shot-1 .story-actor{animation-name:story-wobble;animation-iteration-count:3;animation-duration:.9s}.motion-grow,.motion-enlarge{--scale:1.65;--to:27%}.motion-grow .shot-0 .story-actor{transform:scale(.55)}.motion-grow .shot-1 .story-actor,.motion-enlarge .shot-1 .story-actor{animation-name:story-grow}.motion-shrink{--scale:.4;--to:27%}.motion-shrink .shot-1 .story-actor{animation-name:story-shrink}.motion-hide{--to:58%}.motion-hide .shot-1 .story-actor{animation-name:story-hide}.motion-hide .shot-2 .story-actor{opacity:0}.motion-reveal{--to:27%}.motion-reveal .shot-0 .story-actor{opacity:0}.motion-reveal .shot-1 .story-actor{animation-name:story-reveal}.motion-stop{--from:21%;--to:43%}.motion-stop .shot-1 .story-actor{animation-name:story-stop}.motion-block{--from:14%;--to:42%}.motion-block .shot-1 .story-actor{animation-name:story-stop}.motion-block .shot-1 .story-object{animation:story-grow 1s ease 3s both}.motion-cautious{--from:11%;--to:42%}.motion-cautious .shot-1 .story-actor{animation-name:story-cautious;animation-timing-function:steps(4,end)}.motion-heavy{--from:15%;--to:43%;--angle:12deg}.motion-heavy .shot-1 .story-actor{animation-name:story-heavy;animation-timing-function:steps(5,end)}.motion-give{--from:21%;--to:56%}.motion-give .shot-1 .story-actor{animation-name:story-act}.motion-give .shot-2 .story-object{transform:translateY(-12px)}.motion-meet{--from:15%;--to:43%}.motion-meet .shot-1 .story-object{animation:story-meet 2.7s ease var(--delay) both}.motion-meet .shot-2 .story-object{left:59%}.motion-refuse{--from:29%;--to:29%;--angle:-18deg}.motion-refuse .shot-1 .story-actor{animation-name:story-refuse}.motion-pause,.motion-think,.motion-inspect,.motion-look,.motion-speak,.motion-repeat,.motion-balance,.motion-calm,.motion-sparse,.motion-scatter,.motion-build,.motion-time,.motion-draw,.motion-flash,.motion-light,.motion-dim,.motion-rain,.motion-pile,.motion-multiply,.motion-break,.motion-recover,.motion-wilt,.motion-trail{--to:27%}.motion-think .shot-1 .story-object,.motion-speak .shot-1 .story-object{animation:story-bubble 2.7s ease var(--delay) both}.motion-inspect .shot-1 .story-actor,.motion-look .shot-1 .story-actor{animation-name:story-look}.motion-repeat .shot-1 .story-actor{animation-name:story-bounce;animation-duration:.65s;animation-iteration-count:4}.motion-calm .shot-1 .story-actor{animation-name:story-sway}.motion-pause .shot-1 .story-actor{animation-name:story-pause}.motion-balance .shot-1 .story-object{animation:story-balance 2.7s ease var(--delay) both}.motion-time .shot-1 .story-object{animation:story-turn 2.7s ease var(--delay) both}.motion-scatter .story-extra{transform:rotate(-20deg)}.motion-scatter .extra-1,.motion-scatter .extra-3{transform:rotate(25deg)}.motion-sparse .story-extra{font-size:20px}.motion-sparse .shot-2 .story-extra{opacity:.7}.motion-build .shot-1 .story-object,.motion-draw .shot-1 .story-object{animation:story-reveal 2.7s ease var(--delay) both}.motion-build .shot-0 .story-object,.motion-draw .shot-0 .story-object{opacity:.15}.motion-light .shot-0{filter:brightness(.45)}.motion-light .shot-1{animation-name:story-light}.motion-dim .shot-1{animation-name:story-dark}.motion-dim .shot-2{filter:brightness(.68)}.motion-flash .shot-1 .story-actor{animation-name:story-flash}.motion-flash .shot-0 .story-actor,.motion-flash .shot-2 .story-actor{opacity:.12}.motion-rain .shot-1 .story-actor{animation-name:story-fall;animation-duration:.9s;animation-iteration-count:3}.motion-break .shot-1 .story-actor{animation-name:story-break}.motion-break .shot-2 .story-actor{transform:rotate(35deg) translateY(13px)}.motion-recover .shot-1 .story-actor{animation-name:story-recover}.motion-wilt{--angle:65deg;--scale:.8}.motion-wilt .shot-1 .story-actor{animation-name:story-wilt}.motion-climb{--from:22%;--to:55%}.motion-climb .shot-1 .story-actor{animation-name:story-climb}.motion-climb .shot-2 .story-actor{top:23px}.motion-trail .shot-1 .story-object{animation:story-appear .8s ease 4s both}.motion-trail .shot-0 .story-object{opacity:0}.motion-trail .shot-2 .story-object{left:45%}.motion-pile .story-extra{top:112px}.motion-pile .extra-1{left:34%;top:112px}.motion-pile .extra-2{left:23%;top:89px}.motion-pile .extra-3{left:42%;top:112px}.motion-pile .extra-4{left:36%;top:88px}
@keyframes story-first{0%,99.9%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes story-middle{0%{opacity:0;visibility:hidden}.01%,99.9%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}@keyframes story-last{0%{opacity:0;visibility:hidden}.01%,100%{opacity:1;visibility:visible}}@keyframes story-act{from{left:var(--from)}to{left:var(--to)}}@keyframes story-jump{0%{left:var(--from);transform:translateY(0)}50%{transform:translateY(-65px) rotate(-8deg)}100%{left:var(--to);transform:none}}@keyframes story-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px) rotate(-6deg)}}@keyframes story-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@keyframes story-wobble{0%,100%{transform:rotate(0)}35%{transform:rotate(-14deg)}75%{transform:rotate(14deg)}}@keyframes story-grow{from{transform:scale(.55)}to{transform:scale(1.65)}}@keyframes story-shrink{from{transform:scale(1)}to{transform:scale(.4)}}@keyframes story-hide{0%{left:var(--from);opacity:1}65%{opacity:1}100%{left:var(--to);opacity:0}}@keyframes story-reveal{from{opacity:0;transform:translateY(23px) scale(.4)}to{opacity:1;transform:none}}@keyframes story-stop{0%{left:var(--from)}50%,100%{left:var(--to)}}@keyframes story-cautious{0%,25%{left:var(--from)}100%{left:var(--to)}}@keyframes story-heavy{from{left:var(--from);transform:rotate(8deg)}to{left:var(--to);transform:rotate(12deg) translateY(9px)}}@keyframes story-meet{from{left:69%}to{left:59%}}@keyframes story-refuse{from{transform:rotate(0)}to{transform:rotate(-18deg)}}@keyframes story-bubble{0%{opacity:0;transform:scale(.3)}30%,100%{opacity:1;transform:scale(1.15)}}@keyframes story-look{0%,100%{transform:rotate(0)}45%{transform:translateX(22px) rotate(12deg) scale(1.15)}}@keyframes story-sway{0%,100%{transform:translateX(0)}50%{transform:translateX(12px)}}@keyframes story-pause{0%,65%{transform:translateX(0)}100%{transform:translateX(12px)}}@keyframes story-balance{0%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}100%{transform:rotate(0)}}@keyframes story-turn{from{transform:rotate(0)}to{transform:rotate(180deg)}}@keyframes story-light{0%{opacity:0;visibility:hidden}.01%{opacity:1;visibility:visible;filter:brightness(.45)}99.9%{opacity:1;visibility:visible;filter:brightness(1)}100%{opacity:0;visibility:hidden}}@keyframes story-dark{0%{opacity:0;visibility:hidden}.01%{opacity:1;visibility:visible;filter:brightness(1)}99.9%{opacity:1;visibility:visible;filter:brightness(.68)}100%{opacity:0;visibility:hidden}}@keyframes story-flash{0%,70%,100%{opacity:0}15%,55%{opacity:1}}@keyframes story-fall{from{transform:translateY(-45px);opacity:.5}to{transform:translateY(12px);opacity:1}}@keyframes story-break{0%,45%{transform:rotate(0)}55%,100%{transform:rotate(35deg) translateY(13px)}}@keyframes story-recover{0%{transform:rotate(0)}40%{transform:rotate(40deg)}100%{transform:rotate(0)}}@keyframes story-wilt{from{transform:rotate(0)}to{transform:rotate(65deg) scale(.8)}}@keyframes story-climb{from{left:var(--from);top:100px}to{left:var(--to);top:23px}}@keyframes story-appear{from{opacity:0;transform:translateY(-25px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:440px){.story-stage{height:230px}.story-actor{font-size:49px}.story-object{font-size:44px}.story-caption{font-size:13px!important;min-height:75px;padding:10px 25px 12px 10px}.story-floor{bottom:75px}.story-setting{font-size:60px}}
@media(prefers-reduced-motion:reduce){.story-shot{animation:none!important;opacity:0!important;visibility:hidden!important}.story-shot.shot-2{opacity:1!important;visibility:visible!important}.story-still{display:block}.story-play{display:none}.story-shot *{animation:none!important}}

.story .story-stage *{animation-play-state:paused}.story.running .story-stage *{animation-play-state:running}
.motion-rush{--from:12%;--to:68%}.motion-rush .shot-1 .story-actor{animation-duration:1s}.story[data-story="cease"] .shot-1 .story-actor{animation-name:story-rain-stop}.story[data-story="cease"] .shot-2 .story-actor{opacity:0}@keyframes story-rain-stop{from{opacity:1;transform:translateY(-20px)}to{opacity:0;transform:translateY(20px)}}
