/* The floating WhatsApp button (server/whatsapp.js). Icon + label on desktop, icon only on phones. */
.wa-fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:60;display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 20px 0 16px;border-radius:999px;background:#1FA855;color:#fff;font:700 16px/1 "Plus Jakarta Sans",system-ui,sans-serif;text-decoration:none;box-shadow:0 12px 28px -8px rgba(15,60,35,.55),0 2px 6px rgba(0,0,0,.18);transition:transform .15s,box-shadow .15s,background .15s}
.wa-fab:hover,.wa-fab:focus-visible{background:#178a45;transform:translateY(-2px);box-shadow:0 16px 32px -8px rgba(15,60,35,.6),0 2px 6px rgba(0,0,0,.2);color:#fff}
.wa-fab:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 6px #1FA855}
.wa-fab svg{flex:none;width:28px;height:28px}
@media (max-width:1020px){
  .wa-fab{width:56px;padding:0;justify-content:center}
  .wa-fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  /* the sticky "Let's talk" bar already has a WhatsApp icon: show only one of the two */
  body:not(.wa-low) .wa-fab{display:none}
}
html.menu-open .wa-fab,body.has-float .wa-fab{display:none}
@media print{.wa-fab{display:none!important}}
@media (prefers-reduced-motion:reduce){.wa-fab{transition:none}}
/* on game pages keep it small so it never covers the board or the controls */
.wa-fab.wa-compact{width:52px;min-height:52px;padding:0;justify-content:center;opacity:.92}
.wa-fab.wa-compact span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}