.pgsr-method-help {
	align-items: center;
	background: #111;
	border-radius: 50%;
	color: #fff;
	cursor: help;
	display: inline-flex;
	font-size: 11px;
	font-weight: 700;
	height: 18px;
	justify-content: center;
	line-height: 1;
	margin-left: 7px;
	position: relative;
	vertical-align: 1px;
	width: 18px;
}

.pgsr-method-help::after {
	background: #111;
	border-radius: 4px;
	bottom: auto;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
	color: #fff;
	content: attr(data-pgsr-tooltip);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.45;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	left: 50%;
	right: auto;
	text-align: left;
	top: calc(100% + 9px);
	transform: translate(-50%, -4px);
	transition: opacity 140ms ease-out, transform 140ms ease-out;
	visibility: hidden;
	white-space: normal;
	width: min(280px, 76vw);
	z-index: 20;
}

.pgsr-method-help:hover::after {
	opacity: 1;
	transform: translate(-50%, 0);
	visibility: visible;
}

.pgsr-method-note {
	color: #4b4b4b;
	display: block;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.45;
	margin-top: 5px;
	max-width: 58ch;
}

@media (max-width: 640px) {
	.pgsr-method-note {
		font-size: 11.5px;
		max-width: 100%;
	}
}