.tip-button{background:none;border:0;border-radius:.25rem .25rem 0 0;cursor:pointer;font-family:inherit;font-size:.75rem;font-weight:600;height:2.6rem;margin:0 auto;outline:0;position:relative;top:0;transform-origin:0 100%;transition:transform 50ms ease-in-out;width:9.5rem;-webkit-tap-highlight-color:transparent}.tip-button.clicked{animation:shake .15s ease-in-out 1;pointer-events:none}.tip-button.clicked .tip-button__text{opacity:0;transition:opacity .1s linear .2s}.tip-button.clicked:before{height:.5rem;width:60%}.tip-button.clicked .coin{transition:margin-bottom 1s linear .2s;margin-bottom:0}.tip-button.shrink-landing:before{transition:width .2s ease-in;width:0}.tip-button.coin-landed:after{opacity:1;transform:scale(1);transform-origin:50% 100%}.tip-button.coin-landed .coin-wrapper{background:radial-gradient(circle at 35% 97%,rgba(3,16,50,.4) .04rem,transparent 0),radial-gradient(circle at 45% 92%,rgba(3,16,50,.4) .04rem,transparent 0),radial-gradient(circle at 55% 98%,rgba(3,16,50,.4) .04rem,transparent 0),radial-gradient(circle at 65% 96%,rgba(3,16,50,.4) .06rem,transparent 0);background-position:bottom;background-size:100%;bottom:-1rem;opacity:0;transform:scale(2) translateY(-10px)}.tip-button__text{color:#fff;margin-right:1.8rem;opacity:1;position:relative;transition:opacity .1s linear .5s;z-index:3}.tip-button:before{background:var(--button-bg,#1e3a8a);border-radius:.25rem;bottom:0;content:"";display:block;height:100%;left:50%;position:absolute;transform:translateX(-50%);transition:height .25s ease-in-out .4s,width .25s ease-in-out .3s,background-color .3s cubic-bezier(.4,0,.2,1);width:100%;z-index:2}.tip-button:after{bottom:-1rem;color:#031032;content:"Thank you!";height:110%;opacity:0;text-align:center;transform:scale(0);transform-origin:50% 20%;transition:transform .2s cubic-bezier(0,0,.35,1.43);z-index:1}.coin-wrapper,.tip-button:after{left:0;position:absolute;pointer-events:none;width:100%}.coin-wrapper{background:none;bottom:0;height:18rem;opacity:1;overflow:hidden;transform:none;transform-origin:50% 100%;transition:opacity .2s linear .1s,transform .3s ease-out}.coin{--front-y-multiplier:0;--back-y-multiplier:0;--coin-y-multiplier:0;--coin-x-multiplier:0;--coin-scale-multiplier:0;--coin-rotation-multiplier:0;--shine-opacity-multiplier:0.4;--shine-bg-multiplier:50%;bottom:calc(var(--coin-y-multiplier) * 1rem - 3.5rem);height:3.5rem;margin-bottom:3.05rem;position:absolute;right:calc(var(--coin-x-multiplier) * 34% + 16%);transform:translateX(50%) scale(calc(.4 + var(--coin-scale-multiplier))) rotate(calc(var(--coin-rotation-multiplier) * -1deg));transition:opacity .1s linear .2s;width:3.5rem;z-index:3}.coin:before,.coin__back,.coin__back:after,.coin__front,.coin__front:after,.coin__middle{border-radius:50%;box-sizing:border-box;height:100%;left:0;position:absolute;width:100%;z-index:3}.coin__front{background:radial-gradient(circle at 50% 50%,transparent 50%,rgba(115,124,153,.4) 54%,#c2cadf 0),linear-gradient(210deg,#8590b3 32%,transparent 0),linear-gradient(150deg,#8590b3 32%,transparent 0),linear-gradient(90deg,#8590b3 22%,transparent 0,transparent 78%,#8590b3 0),linear-gradient(180deg,#fcfaf9 44%,transparent 0,transparent 65%,#fcfaf9 0,#fcfaf9 71%,#8590b3 0),linear-gradient(90deg,transparent 28%,#fcfaf9 0,#fcfaf9 34%,#8590b3 0,#8590b3 40%,#fcfaf9 0,#fcfaf9 47%,#8590b3 0,#8590b3 53%,#fcfaf9 0,#fcfaf9 60%,#8590b3 0,#8590b3 66%,#fcfaf9 0,#fcfaf9 72%,transparent 0);background-color:#8590b3;background-size:100% 100%;transform:translateY(calc(var(--front-y-multiplier) * .3181818182rem / 2)) scaleY(var(--front-scale-multiplier))}.coin__front:after{background:rgba(0,0,0,.2);content:"";opacity:var(--front-y-multiplier)}.coin__middle{background:#737c99;transform:translateY(calc(var(--middle-y-multiplier) * .3181818182rem / 2)) scaleY(var(--middle-scale-multiplier))}.coin__back{background:radial-gradient(circle at 50% 50%,transparent 50%,rgba(115,124,153,.4) 54%,#c2cadf 0),radial-gradient(circle at 50% 40%,#fcfaf9 23%,transparent 0),radial-gradient(circle at 50% 100%,#fcfaf9 35%,transparent 0);background-color:#8590b3;background-size:100% 100%;transform:translateY(calc(var(--back-y-multiplier) * .3181818182rem / 2)) scaleY(var(--back-scale-multiplier))}.coin__back:after{background:rgba(0,0,0,.2);content:"";opacity:var(--back-y-multiplier)}.coin:before{background:radial-gradient(circle at 25% 65%,transparent 50%,rgba(255,255,255,.9) 90%),linear-gradient(55deg,transparent calc(var(--shine-bg-multiplier) + 0%),#e9f4ff calc(var(--shine-bg-multiplier) + 0%),transparent calc(var(--shine-bg-multiplier) + 50%));content:"";opacity:var(--shine-opacity-multiplier);transform:translateY(calc(var(--middle-y-multiplier) * .3181818182rem / -2)) scaleY(var(--middle-scale-multiplier)) rotate(calc(var(--coin-rotation-multiplier) * 1deg));z-index:10}.coin:after{background:#737c99;content:"";height:.3181818182rem;left:0;position:absolute;top:50%;transform:translateY(-50%);width:100%;z-index:2}@keyframes shake{0%{transform:rotate(4deg)}66%{transform:rotate(-4deg)}to{transform:rotate(0)}}.split-flap-container{justify-content:center;padding:2rem 0}.board,.split-flap-container{display:flex;align-items:center}.board{gap:.5ch;position:relative;flex-direction:row;font-family:Roboto Mono,Courier New,monospace;padding:1rem;background:hsl(0 0% 10%);border-radius:.5rem;box-shadow:0 10px 30px -5px rgba(0,0,0,.3)}.board>span[data-key]{display:inline-block;width:0;opacity:.5;height:100%;position:relative}.board>span[data-key]:after,.board>span[data-key]:before{content:"";position:absolute;width:.5ch;top:50%;left:50%;translate:-50% -150%;aspect-ratio:1;background:currentColor;border-radius:50%}.board>span[data-key]:after{translate:-50% 75%}.flip{font-size:3rem;color:#fff;width:1.5ch;line-height:1.2;display:inline-block;height:1lh;text-align:center;position:relative;transform-style:preserve-3d;perspective:300px}.flip:after,.flip:before{content:"";position:absolute;width:calc(10% - .05em);height:calc(20% - .05em);background:rgba(255,255,255,.1);top:50%;translate:0 -50%;border-radius:2px;z-index:10}.flip:before{left:0}.flip:after{right:0}.flip div{position:absolute;transform-style:preserve-3d;overflow:hidden;inset:0;background:radial-gradient(100% 100% at 50% 100%,rgba(136,136,136,.2),transparent),hsl(0 0% 20%);border:1px solid rgba(255,255,255,.1);font-weight:700}.flip div:nth-of-type(odd){clip-path:polygon(0 0,100% 0,100% 40%,calc(90% + .025em) 40%,calc(90% + .025em) 48%,calc(10% - .025em) 48%,calc(10% - .025em) 40%,0 40%)}.flip div:nth-of-type(2n){clip-path:polygon(0 60%,calc(10% - .025em) 60%,calc(10% - .025em) 52%,calc(90% + .025em) 52%,calc(90% + .025em) 60%,100% 60%,100% 100%,0 100%)}.flip>div:nth-of-type(2){z-index:2;transform:rotateX(-180deg);backface-visibility:hidden}.flip div:nth-of-type(3){z-index:3;backface-visibility:hidden}@media (max-width:640px){.flip{font-size:2rem}.board{padding:.75rem}}