.article-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  color: #707477;
  font-size: 14px;
  font-weight: 650;
}

.article-actions__info,
.article-actions__tools,
.article-actions__share,
.article-actions__meta-item,
.article-actions__read-later {
  display: flex;
  align-items: center;
}

.article-actions__info { flex-wrap: wrap; gap: 10px 22px; }
.article-actions__tools { flex-wrap: wrap; justify-content: flex-end; gap: 12px 20px; }
.article-actions__share { gap: 7px; }
.article-actions__share-label { margin-right: 3px; }
.article-actions__meta-item { min-height: 34px; gap: 8px; }

.article-actions svg {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.article-actions__meta-item svg { color: var(--color-accent); }

.article-actions__read-later {
  min-height: 36px;
  gap: 7px;
  padding: 5px 10px;
  border: 1px solid rgba(255, 99, 68, 0.36);
  border-radius: var(--radius-control);
  color: var(--color-dark);
  background: transparent;
  cursor: pointer;
  font: inherit;
  transition: color var(--transition), background-color var(--transition), border-color var(--transition);
}

.article-actions__read-later:hover,
.article-actions__read-later:focus-visible,
.article-actions__read-later[aria-pressed="true"] {
  border-color: var(--color-accent);
  color: #fff;
  background: var(--color-accent);
}

.article-actions__social {
  display: grid;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 99, 68, 0.36);
  border-radius: var(--radius-control);
  place-items: center;
  color: var(--color-accent);
  transition: color var(--transition), background-color var(--transition), border-color var(--transition), transform var(--transition);
}

.article-actions__social svg { width: 18px; height: 18px; }
.article-actions__brand-icon {
  display: block;
  width: 19px;
  height: 19px;
  background: currentColor;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.article-actions__brand-icon--vk {
  mask-image: url("../../img/social/vk.svg");
  -webkit-mask-image: url("../../img/social/vk.svg");
}

.article-actions__brand-icon--max {
  width: 20px;
  height: 20px;
  mask-image: url("../../img/social/max.svg");
  -webkit-mask-image: url("../../img/social/max.svg");
}

.article-actions__social:hover,
.article-actions__social:focus-visible {
  border-color: var(--color-accent);
  color: #fff;
  background: var(--color-accent);
  transform: translateY(-1px);
}

.article-actions--footer {
  margin-top: 50px;
  padding-top: 24px;
  border-top: 1px solid var(--color-border);
}

@media (max-width: 767px) {
  .article-actions { align-items: flex-start; flex-direction: column; }
  .article-actions__tools { width: 100%; justify-content: space-between; }
  .article-actions--footer { margin-top: 38px; }
}

@media (max-width: 480px) {
  .article-actions__tools { align-items: flex-start; flex-direction: column; }
  .article-actions__share-label { min-width: 82px; }
}