/* Share-button row for pack reports (public preview + logged-in report rail).
   Matches the review page's circular-icon treatment + a one-time attention
   highlight to draw the eye to a new affordance. */
.rsx-share { display: flex; align-items: center; gap: 9px; }
.rsx-share-label {
  font: 700 11px/1 "Inter Tight", Arial, sans-serif;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-soft, #7b7466);
}
.rsx-share-row { display: flex; gap: 7px; }
.rsx-share-btn {
  width: 30px; height: 30px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--surface-mint-deep, #d8e2d4);
  background: var(--surface-white, #fff);
  color: var(--brand-deep, #0f5f4a);
  text-decoration: none;
  transition: background 0.14s ease, color 0.14s ease, border-color 0.14s ease, transform 0.14s ease;
}
.rsx-share-btn:hover {
  background: var(--brand-deep, #0f5f4a);
  color: #fff;
  border-color: var(--brand-deep, #0f5f4a);
  transform: translateY(-1px);
}
.rsx-share-btn:focus-visible { outline: 2px solid var(--brand-deep, #0f5f4a); outline-offset: 2px; }

/* Rail variant (logged-in report) stacks the label above the row. */
.rsx-share-rail { flex-direction: column; align-items: flex-start; gap: 8px;
  margin-top: 12px; padding-top: 13px; border-top: 1px solid var(--surface-mint-deep, #d8e2d4); }

/* One-time attention highlight — a soft ring that fades after a couple pulses. */
@keyframes rsx-share-attn {
  0%, 100% { box-shadow: 0 0 0 0 rgba(15, 122, 95, 0); }
  35% { box-shadow: 0 0 0 4px rgba(15, 122, 95, 0.22); }
}
.rsx-share-attn .rsx-share-btn[data-share-platform="twitter"] {
  animation: rsx-share-attn 1.6s ease-in-out 2;
}