.pk{top:calc(var(--d) / 2);outline-offset:6px;-webkit-tap-highlight-color:transparent;--pk-face:linear-gradient(180deg,#2dd4bf,#14b8a6 55%);--pk-base:linear-gradient(to right,#0b5f58,#0f766e 12%,#0f766e 88%,#0b5f58);--pk-glow:#0f766e59;--pk-ring:#14b8a6;border-radius:9999px;display:inline-block;position:relative}.pk.pk-purple{--pk-face:linear-gradient(180deg,#9f7aea,#7c3aed 55%);--pk-base:linear-gradient(to right,#4c1d95,#5b21b6 12%,#5b21b6 88%,#4c1d95);--pk-glow:#7c3aed59;--pk-ring:#7c3aed}.pk.pk-violet{--pk-face:linear-gradient(180deg,#ffffff38,#fff0 55%),linear-gradient(90deg,#8b5cf6,#d946ef 55%,#ec4899);--pk-base:linear-gradient(90deg,#5b21b6,#86198f 55%,#9d174d);--pk-glow:#c026d366;--pk-ring:#a855f7}button.pk{font:inherit;cursor:pointer;background:0 0;border:0;padding:0}.pk:disabled{opacity:.65;cursor:default;pointer-events:none}.pk:focus-visible{outline:3px solid var(--pk-ring)}.pk-shadow,.pk-base{border-radius:inherit;position:absolute;inset:0}.pk-shadow{background:var(--pk-glow);filter:blur(8px);transform:translateY(calc(var(--d) * .7));transition:transform .5s cubic-bezier(.3,.7,.4,1)}.pk-base{background:var(--pk-base)}.pk-face{border-radius:inherit;color:#fff;background:var(--pk-face);transform:translateY(calc(var(--d) * -1));align-items:center;font-weight:700;transition:transform .5s cubic-bezier(.3,.7,.4,1);display:flex;position:relative;box-shadow:inset 0 1px #ffffff59}.pk-face:before{content:"";z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;background:radial-gradient(circle at var(--px,50%) var(--py,50%),#0000004d,#0000 46%);transition:opacity .3s;position:absolute;inset:0;box-shadow:inset 0 3px 9px #00000052,inset 0 -1px #ffffff1f}.pk:active .pk-face:before{opacity:1;transition-duration:60ms}.pk-nudge{transition:translate .3s cubic-bezier(.3,.7,.4,1.5);display:inline-flex}.pk:hover .pk-face{transform:translateY(calc(var(--d) * -.55)) rotate(var(--tilt,0deg));transition-duration:.2s}.pk:hover .pk-shadow{transform:translateY(calc(var(--d) * .4));transition-duration:.2s}.pk:hover .pk-nudge{translate:4px}[dir=rtl] .pk:hover .pk-nudge{translate:-4px}.pk:active .pk-face,.pk:active .pk-shadow{transition-duration:40ms;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.pk-face,.pk-shadow,.pk-nudge{transition:none}}