.sm-companion {
  --sm-companion-green: #078b61;
  position: fixed;
  right: clamp(14px, 1.35vw, 26px);
  bottom: clamp(12px, 1.35vw, 24px);
  z-index: 880;
  pointer-events: none;
}

.sm-companion-avatar {
  position: relative;
  display: grid;
  width: clamp(82px, 6vw, 104px);
  height: clamp(86px, 6.3vw, 110px);
  background: transparent;
  filter: drop-shadow(0 12px 14px rgba(10, 21, 31, .12));
}

.sm-companion-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
  user-select: none;
  transform-origin: 52% 84%;
  animation: sm-companion-working 2.8s ease-in-out infinite;
}

.sm-companion-workmark {
  position: absolute;
  right: 4%;
  bottom: 18%;
  display: flex;
  align-items: end;
  gap: 2px;
  height: 13px;
  padding: 3px 4px;
  border-radius: 4px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 4px 12px rgba(11, 21, 32, .1);
}

.sm-companion-workmark i {
  display: block;
  width: 2px;
  height: 4px;
  background: var(--sm-companion-green);
  animation: sm-companion-bars 1.05s ease-in-out infinite;
}

.sm-companion-workmark i:nth-child(2) { animation-delay: 140ms; }
.sm-companion-workmark i:nth-child(3) { animation-delay: 280ms; }

.sm-companion-presence {
  position: absolute;
  right: 9%;
  top: 12%;
  width: 9px;
  height: 9px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--sm-companion-green);
  animation: sm-companion-pulse 1.7s ease-out infinite;
}

@keyframes sm-companion-pulse {
  0% { box-shadow: 0 0 0 0 rgba(7, 139, 97, .3); }
  70%, 100% { box-shadow: 0 0 0 8px rgba(7, 139, 97, 0); }
}

@keyframes sm-companion-working {
  0%, 100% { transform: translateY(0) rotate(-.4deg); }
  48% { transform: translateY(-3px) rotate(.7deg); }
  58% { transform: translateY(-2px) rotate(.2deg); }
}

@keyframes sm-companion-bars {
  0%, 100% { height: 3px; opacity: .45; }
  50% { height: 9px; opacity: 1; }
}

@media (max-width: 640px) {
  .sm-companion {
    right: 10px;
    bottom: 10px;
  }

  .sm-companion-avatar {
    width: 74px;
    height: 78px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sm-companion-avatar img,
  .sm-companion-workmark i,
  .sm-companion-presence {
    animation: none !important;
  }
}