/* Motion affects only the folded symbol. Add onesage-animate for one intro. */
.onesage-fold-top{transform-origin:134px 54px}
.onesage-fold-bottom{transform-origin:52px 113px}
.onesage-accent{transform-origin:124px 16px}
.onesage-animate .onesage-fold-top{animation:onesage-unfold-top 1050ms cubic-bezier(.2,.75,.2,1) both}
.onesage-animate .onesage-fold-bottom{animation:onesage-unfold-bottom 1050ms 90ms cubic-bezier(.2,.75,.2,1) both}
.onesage-animate .onesage-accent{animation:onesage-tip-intro 1350ms 120ms ease-out both}
.onesage-loading .onesage-fold-top{animation:onesage-breathe-top 2400ms ease-in-out infinite}
.onesage-loading .onesage-fold-bottom{animation:onesage-breathe-bottom 2400ms ease-in-out infinite}
.onesage-loading .onesage-accent{animation:onesage-tip-pulse 2400ms ease-in-out infinite}
@keyframes onesage-unfold-top{0%{transform:translate(2px,8px) rotate(14deg) scale(.12,.94);opacity:0}58%{transform:translate(-1px,-1px) rotate(-1deg) scale(1.01);opacity:1}100%{transform:none;opacity:1}}
@keyframes onesage-unfold-bottom{0%{transform:translate(-2px,-7px) rotate(-14deg) scale(.12,.9);opacity:0}65%{transform:translate(1px,1px) rotate(1.5deg) scale(1.01);opacity:1}100%{transform:none;opacity:1}}
@keyframes onesage-tip-intro{0%,20%{transform:translate(0,5px) scale(.75);opacity:0}60%{transform:scale(1.09);opacity:1}100%{transform:none;opacity:1}}
@keyframes onesage-breathe-top{0%,100%{transform:none}50%{transform:translate(0,-2px) rotate(-1deg)}}
@keyframes onesage-breathe-bottom{0%,100%{transform:none}50%{transform:translate(0,2px) rotate(1deg)}}
@keyframes onesage-tip-pulse{0%,100%{opacity:1}50%{opacity:.64}}
@media(prefers-reduced-motion:reduce){.onesage-animate .onesage-fold-top,.onesage-animate .onesage-fold-bottom,.onesage-animate .onesage-accent,.onesage-loading .onesage-fold-top,.onesage-loading .onesage-fold-bottom,.onesage-loading .onesage-accent{animation:none!important;transform:none!important;opacity:1!important}}
