.param-login-otp,
.param-register-otp {
	--param-otp-ink: #24312f;
	--param-otp-muted: #687773;
	--param-otp-accent: #a96750;
	--param-otp-soft: #f8f1ec;
	margin: 20px 0 16px;
	padding: 20px;
	border: 1px solid rgba(169, 103, 80, .2);
	border-radius: 20px;
	background: linear-gradient(145deg, #fff 0%, var(--param-otp-soft) 100%);
	box-shadow: 0 12px 32px rgba(65, 49, 42, .08);
	color: var(--param-otp-ink);
}

.param-login-otp__icon {
	display: grid;
	width: 48px;
	height: 48px;
	margin: 0 auto 12px;
	place-items: center;
	border-radius: 16px;
	background: var(--param-otp-accent);
	color: #fff;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 3px;
	box-shadow: 0 8px 18px rgba(169, 103, 80, .25);
}

.param-login-otp__destination,
.param-register-otp__description {
	margin: 0 0 16px;
	color: var(--param-otp-muted);
	text-align: center;
	line-height: 1.8;
}

.param-login-otp input[autocomplete="one-time-code"],
.param-register-otp input[autocomplete="one-time-code"] {
	box-sizing: border-box;
	width: 100%;
	min-height: 58px;
	margin-top: 7px;
	border: 1.5px solid #d9c9c1;
	border-radius: 14px;
	background: #fff;
	color: var(--param-otp-ink);
	font: 700 26px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
	letter-spacing: .34em;
	text-align: center;
	direction: ltr;
	caret-color: var(--param-otp-accent);
}

.param-login-otp input[autocomplete="one-time-code"]:focus,
.param-register-otp input[autocomplete="one-time-code"]:focus {
	border-color: var(--param-otp-accent);
	box-shadow: 0 0 0 4px rgba(169, 103, 80, .12);
	outline: none;
}

.param-login-otp__timer,
.param-register-otp__timer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 14px;
	padding: 10px 12px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .72);
	color: var(--param-otp-muted);
}

.param-login-otp__timer strong,
.param-register-otp__timer strong {
	min-width: 58px;
	color: var(--param-otp-accent);
	font: 800 16px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
	text-align: left;
}

.param-login-otp__expired,
.param-register-otp__expired {
	margin: 12px 0 0;
	color: #a33b32;
	font-weight: 700;
	text-align: center;
}

.param-login-otp.is-expired,
.param-register-otp.is-expired {
	border-color: rgba(163, 59, 50, .3);
	filter: saturate(.75);
}

.param-login-2fa-back {
	margin-top: 14px !important;
	text-align: center;
}

.param-login-2fa-message {
	border-inline-start-color: var(--param-otp-accent, #a96750) !important;
}

@media (max-width: 480px) {
	.param-login-otp,
	.param-register-otp {
		padding: 17px;
		border-radius: 16px;
	}

	.param-login-otp input[autocomplete="one-time-code"],
	.param-register-otp input[autocomplete="one-time-code"] {
		font-size: 23px;
		letter-spacing: .28em;
	}
}