.fd-results{opacity:1}.fd-tick{opacity:1;transform:scale(1)}.fd-accent-item{opacity:1;transform:none}.filter-demo.step-1 .fd-filter-btn{animation:fd-filter-press .4s ease-in-out forwards}@keyframes fd-filter-press{0%{transform:none}35%{transform:scale(.94)}65%{transform:scale(1.02)}100%{transform:none}}.filter-demo.step-1 .fd-tap-ripple::after{animation:fd-tap-ripple .5s ease-out forwards}@keyframes fd-tap-ripple{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}30%{opacity:.95;transform:translate(-50%,-50%) scale(.7)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.35)}}.filter-demo.step-2 .fd-scrim{animation:fd-scrim-in .4s ease-out forwards}@keyframes fd-scrim-in{0%{opacity:0}100%{opacity:1}}.filter-demo.step-3 .fd-scrim{opacity:1}.filter-demo.step-2 .fd-drawer{animation:fd-drawer-in .6s ease-out forwards}@keyframes fd-drawer-in{0%{opacity:0;transform:translateX(110%)}100%{opacity:1;transform:translateX(0)}}.filter-demo.step-3 .fd-drawer{opacity:1;transform:none}.filter-demo.step-3 .fd-accent-check{animation:fd-check-press .3s ease-in-out forwards}@keyframes fd-check-press{0%{transform:none}45%{transform:scale(.97)}100%{transform:none}}.fd-accent-check{position:relative}.fd-accent-check::after{content:"";position:absolute;inset:-2px;border-radius:16px;box-shadow:0 0 0 2px rgba(122,61,240,.4);opacity:0;pointer-events:none}.filter-demo.step-3 .fd-accent-check::after{animation:fd-check-pulse .5s ease-out forwards}@keyframes fd-check-pulse{0%{opacity:0}40%{opacity:1}100%{opacity:0}}.filter-demo.step-3 .fd-tick{animation:fd-tick-out .3s ease-in forwards}@keyframes fd-tick-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.6)}}.filter-demo.step-4 .fd-tick,.filter-demo.step-5 .fd-tick{opacity:0;transform:scale(.6)}.filter-demo.step-4 .fd-apply-btn{animation:fd-apply-press .4s ease-in-out forwards}@keyframes fd-apply-press{0%{transform:none}35%{transform:scale(.94)}65%{transform:scale(1.02)}100%{transform:none}}.fd-apply-btn::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,0);pointer-events:none}.filter-demo.step-4 .fd-apply-btn::before{animation:fd-apply-flash 450ms ease-out forwards}@keyframes fd-apply-flash{0%{opacity:0}30%{opacity:.55}65%{opacity:.32}100%{opacity:0}}.filter-demo.step-4 .fd-scrim{opacity:1;animation:fd-scrim-out .5s ease-in .5s forwards}@keyframes fd-scrim-out{0%{opacity:1}100%{opacity:0}}.filter-demo.step-4 .fd-drawer{opacity:1;transform:none;animation:fd-drawer-out .6s ease-in .5s forwards}@keyframes fd-drawer-out{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(110%)}}.filter-demo.step-5 .fd-accent-item{animation:fd-item-out .5s ease-in forwards}@keyframes fd-item-out{0%{opacity:1;transform:none;max-height:80px}60%{opacity:0;transform:translateX(8px);max-height:80px}100%{opacity:0;transform:translateX(8px);max-height:0;margin:0;padding:0}}.fd-caret{animation:demo-caret-blink .9s steps(2,end) infinite}@media (prefers-reduced-motion:reduce){.fd-accent-check,.fd-accent-check::after,.fd-accent-item,.fd-apply-btn,.fd-apply-btn::before,.fd-caret,.fd-drawer,.fd-filter-btn,.fd-results,.fd-scrim,.fd-tap-ripple::after,.fd-tick{animation:none!important}.fd-scrim{opacity:0}.fd-drawer{opacity:1;transform:none;position:relative;top:auto;right:auto;bottom:auto;width:auto;margin-top:14px;pointer-events:auto}.fd-results{opacity:1;transform:none}.fd-accent-item{opacity:0}.fd-tick{opacity:0;transform:scale(.6)}.fd-caret{opacity:0}}.is-playing .fd-accent-check,.is-playing .fd-accent-item,.is-playing .fd-apply-btn,.is-playing .fd-drawer,.is-playing .fd-filter-btn,.is-playing .fd-results,.is-playing .fd-scrim,.is-playing .fd-tick{will-change:transform,opacity}