.rf-claps{--clap:#ff4d73;--ink:#171722;display:flex;align-items:center;gap:14px;margin:34px 0;padding:16px 18px;width:max-content;max-width:100%;border:1px solid rgba(29,29,45,.09);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(250,246,249,.92));box-shadow:0 14px 40px rgba(42,20,32,.09);font-family:inherit;color:var(--ink)}
.rf-claps__button{position:relative;display:grid;place-items:center;width:66px;height:66px;flex:0 0 66px;border:0;border-radius:50%;color:#fff;background:radial-gradient(circle at 32% 25%,#ff8ca4 0,var(--clap) 46%,#d91f58 100%);box-shadow:0 10px 24px rgba(255,77,115,.32),inset 0 1px 1px rgba(255,255,255,.55);cursor:pointer;isolation:isolate;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.rf-claps__button:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 15px 30px rgba(255,77,115,.4),inset 0 1px 1px rgba(255,255,255,.55)}
.rf-claps__button:active{transform:scale(.92)}
.rf-claps__button:focus-visible{outline:3px solid rgba(255,77,115,.3);outline-offset:4px}
.rf-claps__icon{font-size:27px;line-height:1;filter:drop-shadow(0 2px 2px rgba(75,0,20,.18));transform-origin:50% 90%}
.rf-claps__mine{position:absolute;right:-5px;top:-5px;min-width:25px;height:25px;padding:0 5px;display:grid;place-items:center;border:2px solid #fff;border-radius:999px;background:#181822;color:#fff;font:700 11px/1 system-ui,sans-serif;box-shadow:0 4px 10px rgba(0,0,0,.2)}
.rf-claps__rings{position:absolute;inset:0;border:2px solid rgba(255,77,115,.65);border-radius:50%;z-index:-1;opacity:0}
.rf-claps__copy{display:flex;min-width:125px;flex-direction:column;gap:3px}.rf-claps__copy strong{font-size:17px;line-height:1.2}.rf-claps__hint{font-size:12px;color:#777382}.rf-claps__hint b{color:var(--clap)}
.rf-claps__button.is-clapping .rf-claps__icon{animation:rf-clap-hand .42s cubic-bezier(.2,.9,.3,1.3)}
.rf-claps__button.is-clapping .rf-claps__rings{animation:rf-clap-ring .55s ease-out}
.rf-claps__button.is-maxed{background:linear-gradient(145deg,#282735,#111118);filter:saturate(.35)}
.rf-claps__particle{position:absolute;left:50%;top:5px;color:var(--clap);font:800 13px/1 system-ui,sans-serif;font-style:normal;pointer-events:none;text-shadow:0 1px #fff;animation:rf-clap-float .75s ease-out forwards}
.rf-claps.is-saving .rf-claps__copy:after{content:"";width:32px;height:2px;margin-top:3px;background:linear-gradient(90deg,transparent,var(--clap),transparent);animation:rf-clap-loading .8s linear infinite}
.rf-claps.has-error{animation:rf-clap-shake .35s ease}.rf-claps.is-limit .rf-claps__button{animation:rf-clap-limit .45s ease}
@keyframes rf-clap-hand{0%{transform:rotate(0) scale(1)}35%{transform:rotate(-18deg) scale(1.25)}70%{transform:rotate(12deg) scale(.94)}100%{transform:rotate(0) scale(1)}}
@keyframes rf-clap-ring{0%{opacity:.9;transform:scale(.9)}100%{opacity:0;transform:scale(1.65)}}
@keyframes rf-clap-float{0%{opacity:1;transform:translate(-50%,0) scale(.7)}100%{opacity:0;transform:translate(calc(-50% + var(--drift)), -55px) scale(1.25)}}
@keyframes rf-clap-loading{to{transform:translateX(85px)}}
@keyframes rf-clap-shake{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
@keyframes rf-clap-limit{35%{transform:scale(.92) rotate(-5deg)}70%{transform:scale(1.03) rotate(4deg)}}
@media(max-width:480px){.rf-claps{padding:13px 15px;border-radius:19px}.rf-claps__button{width:58px;height:58px;flex-basis:58px}.rf-claps__icon{font-size:24px}}
@media(prefers-reduced-motion:reduce){.rf-claps *,.rf-claps *:before,.rf-claps *:after{animation:none!important;transition:none!important}}