/* Auth module: social login buttons, connected accounts, complete-account step. */
.gsx-social { margin: 20px 0 0; }
.gsx-social__heading { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; font-size: 13px; font-weight: 600; color: var(--gsx-muted); text-align: center; }
.gsx-social__heading::before, .gsx-social__heading::after { content: ""; flex: 1 1 0; height: 1px; background: var(--gsx-border); }
.gsx-social__list { display: flex; flex-direction: column; gap: 10px; }
.gsx-social__btn {
	display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 0 22px;
	border-radius: 999px; border: 1px solid var(--gsx-border); background: var(--gsx-surface); color: var(--gsx-text);
	font-weight: 700; font-size: 15px; text-decoration: none; line-height: 1.2; transition: border-color .15s, transform .15s;
}
.gsx-social__btn:hover, .gsx-social__btn:focus-visible { border-color: var(--gsx-primary); color: var(--gsx-text); transform: translateY(-1px); }
.gsx-social__btn:focus-visible { outline: 3px solid var(--gsx-primary); outline-offset: 2px; }
.gsx-social__ico {
	display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 28px; height: 28px;
	border-radius: 50%; font-size: 14px; font-weight: 800; color: #fff; background: var(--gsx-primary);
}
.gsx-social__ico--google { background: #4285f4; }
.gsx-social__ico--discord { background: #5865f2; }
.gsx-social__ico--microsoft { background: #107c10; }
.gsx-social__ico--steam { background: #171a21; }
@media (min-width: 640px) { .gsx-social__list { flex-direction: row; flex-wrap: wrap; } .gsx-social__btn { flex: 1 1 calc(50% - 10px); } }

.gsx-connections__list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 12px; }
.gsx-connections__item { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 16px; }
.gsx-connections__name { flex: 1 1 140px; }
.gsx-connections__item form { margin: 0; }

.gsx-complete { display: flex; justify-content: center; padding: 40px 16px; }
.gsx-complete__card { width: 100%; max-width: 460px; }
.gsx-complete__card h1 { margin: 0 0 8px; font-size: 26px; }