#mpt-auth {

	--auth-card: #fffdf7;
	--auth-ink: #241a12;
	--auth-tx: #5a4d3c;
	--auth-tx-muted: #6b5b45;
	--auth-red: #8a1c1c;
	--auth-red-deep: #6d1414;
	--auth-on-dark: #f6f0e2;
	--auth-line: rgba(36, 26, 18, .2);
	--auth-gold-bd: rgba(181, 138, 46, .4);
	--auth-r-md: 12px;
	--auth-r-sm: 10px;
	--auth-r-btn: 2px;

	--auth-sans: var(--sans, 'Be Vietnam Pro', system-ui, -apple-system, sans-serif);
	--auth-serif: var(--serif, 'Cormorant Garamond', Georgia, serif);

	position: fixed;
	inset: 0;
	z-index: 90;
	display: grid;
	place-items: center;
	padding: 20px;
}
#mpt-auth[hidden] { display: none; }

#mpt-auth .mpt-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(28, 19, 13, .72);
}

#mpt-auth .mpt-modal__box {
	position: relative;
	width: 100%;
	max-width: 400px;
	padding: 30px 28px;
	border: 1px solid var(--auth-gold-bd);
	border-radius: var(--auth-r-md);
	background: var(--auth-card);
	box-shadow: 0 30px 70px rgba(0, 0, 0, .4);

	font-family: var(--auth-sans);
	font-size: 13px;
	line-height: 1.6;
	color: var(--auth-ink);
	text-align: left;
}

#mpt-auth .mpt-modal__x {
	position: absolute;
	top: 12px;
	right: 14px;
	padding: 6px;
	border: 0;
	background: none;
	font-size: 14px;
	color: var(--auth-tx-muted);
	cursor: pointer;
}
#mpt-auth .mpt-modal__x:hover { color: var(--auth-red); }

#mpt-auth .mpt-modal__tabs {
	display: flex;
	gap: 4px;
	margin-bottom: 22px;
	border-bottom: 1px solid rgba(36, 26, 18, .12);
}
#mpt-auth .mpt-modal__tabs button {
	margin-bottom: -1px;
	padding: 8px 14px 12px;
	border: 0;
	border-bottom: 2px solid transparent;
	background: none;
	font-family: var(--auth-serif);
	font-size: 20px;
	color: var(--auth-tx-muted);
	cursor: pointer;
}
#mpt-auth .mpt-modal__tabs button.is-on {
	color: var(--auth-ink);
	border-bottom-color: var(--auth-red);
}

#mpt-auth .mpt-modal__pane { display: flex; flex-direction: column; gap: 12px; }
#mpt-auth .mpt-modal__pane[hidden] { display: none; }
#mpt-auth .mpt-modal__pane label { display: block; }

#mpt-auth .mpt-modal__pane input[type="text"],
#mpt-auth .mpt-modal__pane input[type="email"],
#mpt-auth .mpt-modal__pane input[type="password"] {
	width: 100%;
	padding: 13px 14px;
	border: 1px solid var(--auth-line);
	border-radius: var(--auth-r-btn);
	background: var(--auth-card);
	font-family: var(--auth-sans);
	font-size: 13px;
	color: var(--auth-ink);
}
#mpt-auth .mpt-modal__pane input:focus {
	outline: rgba(138, 28, 28, .35) solid 2px;
	border-color: var(--auth-red);
}

#mpt-auth .mpt-modal__pane input:-webkit-autofill,
#mpt-auth .mpt-modal__pane input:-webkit-autofill:hover,
#mpt-auth .mpt-modal__pane input:-webkit-autofill:focus {
	box-shadow: 0 0 0 1000px var(--auth-card) inset !important;
	-webkit-text-fill-color: var(--auth-ink) !important;
	caret-color: var(--auth-ink);
	border: 1px solid var(--auth-line);
	border-radius: var(--auth-r-btn);
	font-family: var(--auth-sans) !important;
	font-size: 13px !important;
	transition: background-color 100000s ease-in-out 0s;
}
#mpt-auth .mpt-modal__pane input:-webkit-autofill:focus { border-color: var(--auth-red); }

#mpt-auth .mpt-modal__rem {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: var(--auth-tx);
}

#mpt-auth .mpt-btn {
	display: inline-block;
	padding: 13px 26px;
	border: 0;
	border-radius: var(--auth-r-btn);
	font-family: var(--auth-sans);
	font-size: 12.5px;
	font-weight: 400;
	letter-spacing: .12em;
	text-align: center;
	text-transform: uppercase;
	cursor: pointer;
}
#mpt-auth .mpt-btn--red { background: var(--auth-red); color: var(--auth-on-dark); }
#mpt-auth .mpt-btn--red:hover { background: var(--auth-red-deep); color: var(--auth-on-dark); }
#mpt-auth .mpt-modal__submit { width: 100%; }

#mpt-auth .mpt-modal__lost { font-size: 12px; text-align: center; color: var(--auth-tx); }
#mpt-auth .mpt-modal__lost:hover { color: var(--auth-red); }

#mpt-auth .mpt-modal__back {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 4px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--auth-red);
}
#mpt-auth .mpt-modal__back .mpt-i { transition: transform .18s ease; }
#mpt-auth .mpt-modal__back:hover { color: var(--auth-red-deep); }
#mpt-auth .mpt-modal__back:hover .mpt-i { transform: translateX(-2px); }

#mpt-auth .mpt-modal__msg {
	padding: 11px 14px;
	border: 1px solid rgba(138, 28, 28, .35);
	border-radius: var(--auth-r-sm);
	background: rgba(138, 28, 28, .08);
	font-size: 12.5px;
	color: var(--auth-red);
}
#mpt-auth .mpt-modal__msg[hidden] { display: none; }
#mpt-auth .mpt-modal__msg.is-ok {
	border-color: rgba(58, 107, 58, .4);
	background: rgba(58, 107, 58, .1);
	color: #2f5a2f;
}

#mpt-auth .mpt-modal__reghint {
	margin: 10px 0 0;
	font-size: 12.5px;
	line-height: 1.8;
	color: var(--auth-tx);
}
#mpt-auth .mpt-modal__reghint a { color: var(--auth-red); text-decoration: underline; }

#mpt-auth .mpt-recaptcha {
	display: flex;
	justify-content: center;
	margin: 2px 0 4px;
	min-height: 0;
}
#mpt-auth .mpt-recaptcha[hidden] { display: none; }

@media (max-width: 359px) {
	#mpt-auth .mpt-recaptcha > div { transform: scale(.88); transform-origin: 0 center; }
}

#mpt-auth .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}