.article-share-tools {
  margin: 1rem 0 0;
  padding: .85rem 0 0;
  border-top: 1px solid rgba(80, 244, 255, .22);
}

.article-share-label {
  display: block;
  margin-bottom: .55rem;
  color: #8ff7ff;
  font: 700 .72rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .12em;
}

.article-share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.article-share-button {
  appearance: none;
  border: 1px solid rgba(255, 63, 215, .42);
  border-radius: 999px;
  background: rgba(8, 12, 20, .82);
  color: #f5f7fb;
  padding: .48rem .8rem;
  font: 700 .78rem/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}

.article-share-button:hover,
.article-share-button:focus-visible {
  border-color: #50f4ff;
  background: rgba(80, 244, 255, .1);
  outline: none;
  transform: translateY(-1px);
}

.article-share-button:active {
  transform: translateY(0);
}

@media (max-width: 640px) {
  .article-share-buttons {
    gap: .4rem;
  }

  .article-share-button {
    padding: .52rem .72rem;
    font-size: .75rem;
  }
}