/* ==========================================================================
   Challenge floating button — kmadang_challenge_fab() in inc/challenge-content.php

   Bottom-right, the mirror of the giveaway's "Win free tickets" button at the
   bottom left (assets/css/giveaway.css, .kmg-launch): same pill, same height,
   in the site blue so the two read as different things. On phones it becomes
   a round icon button so both fit side by side.
   ========================================================================== */

.kmc-fab{position:fixed;right:20px;bottom:20px;z-index:640;display:inline-flex;align-items:center;gap:12px;min-height:58px;padding:9px 24px 9px 9px;border-radius:99px;background:linear-gradient(120deg,#0047A0 0%,#0b5bd3 100%);color:#fff!important;font-family:inherit;text-decoration:none!important;box-shadow:0 0 0 2px rgba(255,255,255,.95),0 14px 34px rgba(0,71,160,.42),inset 0 1px 0 rgba(255,255,255,.18);animation:kmc-fab-in .6s cubic-bezier(.2,.9,.3,1.3) .6s both;transition:transform .2s,box-shadow .2s}
.kmc-fab:before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid #0b5bd3;animation:kmc-fab-ring 2.4s ease-out 1.4s infinite;pointer-events:none}
.kmc-fab:hover{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(255,255,255,.95),0 18px 40px rgba(0,71,160,.5),inset 0 1px 0 rgba(255,255,255,.18)}
.kmc-fab:focus-visible{outline:3px solid #FFD23F;outline-offset:3px}

.kmc-fab__icon{display:grid;place-content:center;flex:none;width:40px;height:40px;border-radius:50%;background:#fff;color:#CD2E3A;box-shadow:0 4px 10px rgba(0,0,0,.15)}
.kmc-fab__icon svg{width:33px;height:33px;overflow:visible}
.kmc-fab__icon svg *{transform-box:fill-box}
.kmc-fab__cup{transform-origin:50% 100%;animation:kmc-fab-cheer 2.8s ease-in-out 1.6s infinite}
.kmc-fab__shine{animation:kmc-fab-shine 2.8s ease-in-out 1.6s infinite}
.kmc-fab__spark{transform-origin:50% 50%;transform:scale(0);animation:kmc-fab-spark 2.8s ease-in-out 1.6s infinite}
.kmc-fab__spark--2{animation-delay:1.9s}
.kmc-fab:hover .kmc-fab__cup{animation-duration:1.1s}

.kmc-fab__text{display:flex;flex-direction:column;align-items:flex-start;gap:4px;line-height:1}
.kmc-fab__text b{font-weight:800;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.kmc-fab__text small{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;font-weight:600;letter-spacing:.02em;color:rgba(255,255,255,.82);white-space:nowrap}
.kmc-fab__text small:before{content:"";width:6px;height:6px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.25)}

@keyframes kmc-fab-in{0%{transform:translateY(120px);opacity:0}100%{transform:none;opacity:1}}
@keyframes kmc-fab-ring{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.18,1.45);opacity:0}}
@keyframes kmc-fab-cheer{0%,62%,100%{transform:none}70%{transform:translateY(-3px) rotate(-10deg) scale(1.08)}78%{transform:translateY(-3px) rotate(9deg) scale(1.08)}86%{transform:translateY(-1px) rotate(-4deg) scale(1.03)}93%{transform:none}}
@keyframes kmc-fab-shine{0%,60%{transform:translateX(-12px)}85%,100%{transform:translateX(12px)}}
@keyframes kmc-fab-spark{0%,64%,100%{transform:scale(0) rotate(0);opacity:0}74%{transform:scale(1.2) rotate(45deg);opacity:1}88%{transform:scale(0) rotate(90deg);opacity:0}}

/* Phones: a round icon button; the full wording stays in its aria-label. */
@media (max-width:600px){
	.kmc-fab{right:12px;bottom:12px;min-height:0;padding:8px;gap:0}
	.kmc-fab__icon{width:50px;height:50px}
	.kmc-fab__icon svg{width:40px;height:40px}
	.kmc-fab__text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

@media (prefers-reduced-motion:reduce){
	.kmc-fab,.kmc-fab:before,.kmc-fab__icon svg *{animation:none!important}
	.kmc-fab__spark{transform:none}
	.kmc-fab{transition:none}
}

@media print{
	.kmc-fab{display:none}
}