/*
 * ЮГИД — кнопки «Войти через VK ID / Яндекс ID» (widget/login/social). Фирменные токены (tokens.css),
 * знаки провайдеров — в их цветах, как требуют их правила. Высота 52 px — удобная цель на телефоне.
 */
.yg-social { display: grid; gap: 10px; margin-bottom: 16px; }
.yg-social form { margin: 0; }
.yg-social__btn {
    display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 52px; padding: 0 18px;
    border: 0; border-radius: 14px; background: #fff; color: var(--yg-ink, #0B2E45);
    box-shadow: inset 0 0 0 1.5px var(--yg-border, #D9E7F1);
    font: 700 16px/1.2 var(--yg-font-body, 'Manrope', system-ui, sans-serif); cursor: pointer;
    transition: box-shadow .2s, background-color .2s, transform .12s;
}
.yg-social__btn:hover { box-shadow: inset 0 0 0 1.5px var(--yg-sea, #0369A1); background: var(--yg-sky-soft, #F0F9FF); }
.yg-social__btn:active { transform: scale(.99); }
.yg-social__btn:focus-visible { outline: 3px solid var(--yg-sun, #FFC123); outline-offset: 2px; }
.yg-social__btn svg { width: 24px; height: 24px; flex: none; }
.yg-social__btn.is-busy { opacity: .65; cursor: progress; }

.yg-social__or {
    display: flex; align-items: center; gap: 12px; margin: 6px 0 0;
    font-size: 14px; color: var(--yg-muted, #5B7083);
}
.yg-social__or::before, .yg-social__or::after { content: ''; flex: 1; height: 1px; background: var(--yg-border, #D9E7F1); }

@media (prefers-reduced-motion: reduce) { .yg-social__btn { transition: none; } }