.mark{flex:none;overflow:visible}.mark path{transform-box:fill-box}.mark--blue .mark__body,.mark--blue .mark__clasp{fill:var(--blue)}.mark--blue .mark__n{fill:var(--on-blue)}.mark--ink .mark__body,.mark--ink .mark__clasp{fill:var(--ink)}.mark--ink .mark__n{fill:var(--canvas)}.mark--white .mark__body,.mark--white .mark__clasp{fill:var(--on-blue)}.mark--white .mark__n{fill:var(--blue)}.mark__clasp{transition:transform .52s var(--spring-bouncy)}.mark[data-motion=assemble] .mark__body{transform-origin:50%;animation:mark-body .76s var(--spring) both}.mark[data-motion=assemble] .mark__n{transform-origin:50% 60%;animation:mark-n .68s var(--spring-bouncy) .2s both}.mark[data-motion=assemble] .mark__clasp{animation:mark-clasp .64s var(--spring-bouncy) .43s both}@keyframes mark-body{0%{opacity:0;transform:scale(.7)rotate(-4deg)}}@keyframes mark-n{0%{opacity:0;transform:scale(.4)translateY(18%)}}@keyframes mark-clasp{0%{opacity:0;transform:translate(180%)}60%{opacity:1}}.mark[data-motion=breathe] .mark__clasp{animation:mark-breathe 1.6s var(--ease-in-out) infinite}.mark[data-motion=breathe] .mark__n{transform-origin:50% 60%;animation:mark-n-breathe 1.6s var(--ease-in-out) infinite}@keyframes mark-breathe{0%,to{transform:translate(0)}45%,55%{transform:translate(34%)}}@keyframes mark-n-breathe{0%,to{transform:scale(1)}50%{transform:scale(.94)}}