/* Decorative airspace scene with a desktop-only foreground treatment. */
.entry-page .entry-backdrop.entry-airspace-backdrop {
	inset: 82px 0 0;
	height: auto;
	background:
		radial-gradient(ellipse at 12% 65%, #1769c20a, transparent 55%),
		radial-gradient(ellipse at 88% 40%, #219fa50a, transparent 50%);
}
.entry-airspace {
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0.68;
}
html[data-theme='dark'] .entry-airspace {
	opacity: 0.66;
}
/* Foreground hierarchy comes from type and the form's own surface. */
.entry-page .welcome-content h1 {
	font-size: clamp(40px, 5.4vw, 64px) !important;
	line-height: 1.32 !important;
	font-weight: 750;
	color: #1b2e43;
	letter-spacing: 2px;
}
.entry-page .welcome-content > p {
	color: #415569;
	font-weight: 500;
}
html[data-theme='dark'] .entry-page .welcome-content h1 {
	color: #f4f8ff;
}
html[data-theme='dark'] .entry-page .welcome-content > p {
	color: #c4d0de;
}
.entry-page .welcome-login {
	min-width: 160px;
	min-height: 44px;
	padding: 10px 20px;
	gap: 24px;
	box-shadow: 0 6px 18px #1769c226;
}
.entry-page .entry-account .entry-card {
	position: relative;
	max-width: 460px;
	padding: 36px 40px 28px;
	border: 1px solid #bdcce0;
	border-top: 3px solid #1769c2;
	border-radius: 10px;
	box-shadow:
		0 16px 44px #203f621c,
		0 2px 10px #203f620d;
}
.entry-page .entry-card-close {
	position: absolute;
	top: 12px;
	right: 12px;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	padding: 8px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--muted);
	cursor: pointer;
}
.entry-page .entry-card-close svg {
	width: 20px;
	height: 20px;
}
.entry-page .entry-card-close:hover {
	background: color-mix(in srgb, var(--ink) 8%, transparent);
	color: var(--ink);
}
.entry-page .entry-card-close:focus-visible {
	outline: 2px solid var(--green);
	outline-offset: 2px;
}
.entry-page .entry-card.entry-card-morphing,
.entry-page .entry-card.entry-card-morphed {
	animation: none;
}
.entry-page .entry-card.entry-card-morphing {
	transform-origin: top left;
	will-change: transform;
}
.entry-page .entry-card-morphing > * {
	opacity: 0;
}
.entry-login-morph-label {
	position: fixed;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	color: #fff;
	pointer-events: none;
}
.entry-page .entry-content.entry-return-layer {
	position: fixed;
	inset: 0;
	z-index: 3;
	display: block;
	padding: 0;
	pointer-events: none;
}
.entry-page:is(.entry-returning, .entry-returned) .welcome-content {
	animation: none;
}
.entry-page.entry-returning .welcome-login {
	visibility: hidden;
}
.entry-page .entry-account .entry-card.entry-register {
	max-width: 500px;
}
html:not([data-theme='dark']) .entry-page .entry-account .entry-card {
	border-color: #bdcce0;
	border-top-color: #1769c2;
}
.entry-page .entry-card-heading h2 {
	font-size: 28px !important;
	font-weight: 700;
}
.entry-page .entry-card .auth-field {
	color: var(--ink);
	font-weight: 500;
}
.entry-page .entry-card .auth-field input {
	min-height: 48px;
	border-color: #b8c7d8;
}
html:not([data-theme='dark']) .entry-page .entry-card .auth-field input {
	border-color: #b8c7d8;
}
.entry-page .entry-card .auth-submit {
	min-height: 48px;
	font-weight: 600;
	box-shadow: 0 5px 16px #1769c21f;
}
html[data-theme='dark'] .entry-page .entry-account .entry-card {
	border-color: #435b77;
	border-top-color: #6aaff5;
	box-shadow:
		0 20px 55px #0005,
		0 3px 12px #0003;
}
html[data-theme='dark'] .entry-page .entry-card .auth-field input {
	border-color: #53647a;
}
@media (min-width: 769px) {
	.entry-page {
		--entry-mask-bg: #fffdf5;
	}
	html[data-theme='dark'] .entry-page {
		--entry-mask-bg: #151d28;
	}
	.entry-page .entry-content {
		place-items: center start;
		padding: 48px clamp(36px, 7.5vw, 128px);
	}
	.entry-page .welcome-content {
		width: min(52vw, 560px);
		padding: 28px 0 44px;
		text-align: left;
	}
	.entry-page .welcome-roles {
		justify-content: flex-start;
	}
	.entry-page .entry-content.entry-account {
		place-items: center;
		padding: 48px 24px;
	}
	html .entry-page .entry-airspace {
		opacity: 0.82;
	}
	/* Fade both the tint and the blur so the right-hand scene stays crisp. */
	.entry-page .entry-airspace-backdrop::after {
		content: '';
		position: absolute;
		inset: 0;
		pointer-events: none;
		background: linear-gradient(
			90deg,
			var(--entry-mask-bg) 0%,
			color-mix(in srgb, var(--entry-mask-bg) 92%, transparent) 28%,
			color-mix(in srgb, var(--entry-mask-bg) 48%, transparent) 52%,
			transparent 78%
		);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 26%, #0009 50%, transparent 78%);
		mask-image: linear-gradient(90deg, #000 0%, #000 26%, #0009 50%, transparent 78%);
	}
	.entry-page:has(.entry-account) .entry-airspace-backdrop::after {
		opacity: 0;
		animation: entry-mask-dismiss 700ms ease-out both;
	}
	@keyframes entry-mask-dismiss {
		from {
			opacity: 1;
		}
		to {
			opacity: 0;
		}
	}
	.entry-page.entry-returning .entry-airspace-backdrop::after {
		opacity: 1;
		animation: entry-mask-return var(--entry-return-duration, 850ms) ease-out both;
	}
	@keyframes entry-mask-return {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	html[data-motion='reduced'] .entry-page:has(.entry-account) .entry-airspace-backdrop::after {
		animation: none;
	}
	@media (prefers-reduced-motion: reduce) {
		.entry-page:has(.entry-account) .entry-airspace-backdrop::after {
			animation: none;
		}
	}
}
@media (max-width: 640px) {
	.entry-page .entry-backdrop.entry-airspace-backdrop {
		top: 72px;
	}
	html .entry-page .entry-airspace {
		opacity: 0.5;
	}
	.entry-page .welcome-content h1 {
		font-size: 36px !important;
		letter-spacing: 1px;
	}
	.entry-page .entry-account .entry-card {
		padding: 30px 24px 24px;
	}
}