/* Live chat launcher, 2026-11-06 (pilot). See assets/js/live-chat.js.
   The Engage character (headset and a ticked speech bubble) sits bottom right, bobs now and then, hops on
   hover and opens the chat. A small tag says what it is on hover, keyboard focus, and once after 8 seconds.
   Brand 2.0: ink tag, 2px corners, the signal blue only on the focus ring. Reduced motion keeps it still. */

.lc-launch {
  position: fixed; right: 20px; bottom: 20px; z-index: 2147483645;
  display: flex; align-items: flex-end; gap: 10px;
  margin: 0; padding: 0; border: 0; background: none; cursor: pointer;
  font: 600 14px/1.2 Geist, system-ui, -apple-system, sans-serif;
}
.lc-launch.lc-hidden { display: none; }
/* the character replaces the floating "Meet a Tribble expert" button on pages where the chat is live */
body.lc-on #floatingCta { display: none !important; }
.lc-launch:focus-visible { outline: 2px solid var(--signal, #3263E9); outline-offset: 4px; border-radius: 2px; }

.lc-tag {
  margin-bottom: 22px; padding: 9px 12px; border-radius: 2px;
  background: var(--ink, #00091A); color: #fff; white-space: nowrap;
  opacity: 0; transform: translateY(6px); transition: opacity .25s, transform .25s;
  pointer-events: none;
}
.lc-launch:hover .lc-tag, .lc-launch:focus-visible .lc-tag, .lc-launch.lc-nudge .lc-tag { opacity: 1; transform: none; }

.lc-critter { display: block; width: 76px; line-height: 0; transform-origin: 50% 90%; animation: lc-bob 6.4s ease-in-out infinite; }
.lc-critter img { display: block; width: 100%; height: auto; margin: 0; max-width: none; box-shadow: none; border-radius: 0; background: none;
  filter: drop-shadow(0 4px 10px rgba(0, 9, 26, .18)); }
.lc-launch:hover .lc-critter { animation: lc-hop .55s cubic-bezier(.3, 1.5, .5, 1); }

@keyframes lc-bob { 0%, 74%, 100% { transform: none; } 81% { transform: translateY(-7%) rotate(-3deg); } 88% { transform: none; } 92% { transform: translateY(-2%); } }
@keyframes lc-hop { 0% { transform: none; } 35% { transform: translateY(-14%) rotate(4deg) scale(1.04, .97); } 70% { transform: translateY(0) scale(.98, 1.02); } 100% { transform: none; } }

@media (max-width: 640px) {
  .lc-launch { right: 14px; bottom: 14px; }
  .lc-critter { width: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .lc-critter, .lc-launch:hover .lc-critter { animation: none; }
  .lc-tag { transition: none; }
}
@media print { .lc-launch { display: none; } }
