.ao { margin-top: 4px; }
.ao-list {
	display: grid;
	gap: 10px;
}
.ao-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 40px;
	padding: 0 14px;
	border: 1px solid var(--cx-line-strong);
	border-radius: 8px;
	background: var(--cx-surface);
	color: var(--cx-text);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease;
}
.ao-btn:hover { background: var(--cx-raised); color: var(--cx-text); text-decoration: none; }
.ao-btn:focus-visible { outline: 2px solid var(--cx-accent); outline-offset: 2px; }
.ao-icon { display: inline-flex; width: 18px; height: 18px; flex: none; }
.ao-icon svg { width: 100%; height: 100%; }

.ao-btn--google { background: #ffffff; border-color: #dadce0; color: #1f1f1f; }
.ao-btn--google:hover { background: #f8f9fa; color: #1f1f1f; }
.ao-btn--apple { background: #000000; border-color: #000000; color: #ffffff; }
.ao-btn--apple:hover { background: #1d1d1f; color: #ffffff; }
.ao-btn--discord { background: #5865f2; border-color: #5865f2; color: #ffffff; }
.ao-btn--discord:hover { background: #4752c4; color: #ffffff; }

:root[data-theme="dark"] .ao-btn--apple,
:root:not(.cx-themed) .ao-btn--apple { background: #ffffff; border-color: #ffffff; color: #000000; }
:root[data-theme="dark"] .ao-btn--apple:hover,
:root:not(.cx-themed) .ao-btn--apple:hover { background: #f2f2f2; color: #000000; }

.ao-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--cx-dim);
	font-size: 13px;
	line-height: 1.45;
}
.ao-check input { margin-top: 2px; accent-color: var(--cx-accent); }
.ao-note { margin-top: 4px; color: var(--cx-faint); font-size: 12px; }

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

.au-passkey:not([hidden]) + .ao .au-or { display: none; }
.au-passkey:not([hidden]) + .ao { margin-top: 10px; }