.cft{-webkit-user-select:none;user-select:none;font-family:var(--font-ui);color:var(--fill-on,var(--ink));position:relative}.cft-canvas{z-index:2;pointer-events:none;position:absolute;inset:0}.cft-btn{background:color-mix(in srgb, var(--ink) 14%, var(--slab));height:44px;color:var(--on-slab);cursor:pointer;letter-spacing:-.01em;border-radius:999px;align-items:center;gap:8px;padding:0 20px;font-size:16px;font-weight:500;transition:scale .16s cubic-bezier(.22,1,.36,1);display:inline-flex;position:absolute;top:50%;left:50%;translate:-50% -50%}.cft-btn:active{scale:.96}.cft-btn[data-hop]{animation:.56s cubic-bezier(.3,.7,.4,1) cft-hop}@media (prefers-reduced-motion:reduce){.cft-btn[data-hop]{animation:none}}@keyframes cft-hop{0%{transform:none}22%{transform:translateY(-9px) rotate(calc(var(--cft-side,1) * -7deg))}48%{transform:translateY(-3px) rotate(calc(var(--cft-side,1) * 4deg))}66%{transform:translateY(0) rotate(calc(var(--cft-side,1) * -1.5deg)) scale(1.04, .95)}82%{transform:rotate(calc(var(--cft-side,1) * .6deg))}to{transform:none}}