/* Header call button: pill with text, and a round arrow badge on the right.
   On hover the white badge grows to fill the whole pill and the arrow turns from up-right to right.
   Markup is added by preview/_build/footer/build_mf.py (class hcta + .hc-ar). */
a.hcta.hcta.hcta{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:12px;padding:5px 5px 5px 18px;min-height:42px;font-size:14px;font-weight:600;line-height:1;white-space:nowrap;transition:color .3s ease,transform .2s ease,box-shadow .3s ease}
a.hcta.hcta.hcta::after{display:none}
a.hcta.hcta.hcta::before{content:"";position:absolute;right:5px;top:50%;width:32px;height:32px;margin-top:-16px;border-radius:50%;background:#fff;z-index:-1;transform:scale(1);transform-origin:center;transition:transform .5s cubic-bezier(.7,0,.2,1)}
a.hcta .hc-ar{position:relative;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:#6b4ae0;flex:none;box-shadow:0 2px 10px rgba(20,10,60,.28)}
a.hcta .hc-ar svg{width:16px;height:16px;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
a.hcta.hcta.hcta:hover{color:#16151c;transform:none}
a.hcta.hcta.hcta:hover::before{transform:scale(14)}
a.hcta:hover .hc-ar svg{transform:rotate(45deg) translate(1px,-1px)}
a.hcta.hcta.hcta:hover{box-shadow:0 12px 34px -10px rgba(147,114,255,.75)}
a.hcta.hcta.hcta:active{transform:scale(.98)}
a.hcta.hcta.hcta:focus-visible{outline:2px solid #d9ccff;outline-offset:3px}
@media(max-width:600px){a.hcta.hcta.hcta{padding:4px 4px 4px 13px;gap:9px;min-height:38px;font-size:13.5px}
a.hcta.hcta.hcta::before{right:4px;width:30px;height:30px;margin-top:-15px}
a.hcta .hc-ar{width:30px;height:30px}}
@media(hover:none){a.hcta.hcta.hcta:hover{color:#fff}a.hcta.hcta.hcta:hover::before{transform:scale(1)}a.hcta:hover .hc-ar svg{transform:none}}
@media(prefers-reduced-motion:reduce){a.hcta.hcta.hcta,a.hcta.hcta.hcta::before,a.hcta .hc-ar svg{transition:none}}