/* ═══════════════════════════════════════════════════════════════════════
   Космический Оракул — v1.66 «VK-мост» · стили кнопки «ВКонтакте ✦».
   Кнопка повторяет пластику btn-ghost проекта, но при наведении
   и удержании подсвечивается фирменным VK-синим — мгновенная узнаваемость.
   ═══════════════════════════════════════════════════════════════════════ */

.vk-share-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 12px;
    border: 1px solid rgba(94, 226, 240, .35);
    background: rgba(94, 226, 240, .06);
    color: #dbe7f5;
    font: inherit;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    transition: border-color .25s ease, background .25s ease, color .25s ease, transform .2s ease;
    -webkit-tap-highlight-color: transparent;
}
.vk-share-btn svg { display: block; color: #7db4f5; transition: color .25s ease; flex: none; }
.vk-share-btn:hover, .vk-share-btn:focus-visible {
    border-color: #4a90ff;
    background: rgba(74, 144, 255, .14);
    color: #fff;
    outline: none;
    transform: translateY(-1px);
}
.vk-share-btn:hover svg, .vk-share-btn:focus-visible svg { color: #fff; }
.vk-share-btn:active { transform: translateY(0); }
.vk-share-btn[disabled] { opacity: .5; cursor: default; transform: none; }

/* Компактный вариант внутри answer-actions / gd-итемов */
.answer-actions .vk-share-btn,
.gd-vk-row .vk-share-btn,
.tt-actions .vk-share-btn,
.fl-share-cta .vk-share-btn {
    padding: 8px 14px;
    font-size: 13px;
}

/* Строка соцкнопок на карточке /s/{id}/ */
.vk-share-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-top: 14px;
}
.vk-share-row .vk-hint {
    color: rgba(219, 231, 245, .55);
    font-size: 12.5px;
}

@media (prefers-reduced-motion: reduce) {
    .vk-share-btn { transition: none; }
    .vk-share-btn:hover { transform: none; }
}