#body-login {
	isolation: isolate;
	background-color: #f4f2ed !important;
	background-position: 48% 58% !important;
	background-size: 108% 108% !important;
	color: #050505;
	display: block !important;
	min-height: 100vh;
	overflow: hidden !important;
	overflow-x: hidden;
}

#body-login .wrapper {
	bottom: 86px;
	display: block !important;
	height: auto !important;
	margin: 0 !important;
	min-height: 0 !important;
	padding: 0 !important;
	position: fixed !important;
	right: 42px;
	width: 390px !important;
	z-index: 8;
}

#body-login .v-align {
	margin: 0 !important;
	max-width: 390px;
	position: relative;
	width: 100%;
	z-index: 9;
}

#body-login #header,
#body-login #header .logo,
#body-login .header-guest {
	display: none !important;
}

#body-login .guest-content {
	background: transparent !important;
	box-shadow: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

#body-login #login,
#body-login #login > div,
#body-login #login form,
#body-login .login-box,
#body-login .login-box__wrapper,
#body-login .login-form {
	width: 100%;
}

#body-login #login > div,
#body-login #login form,
#body-login .login-box {
	background: rgba(12, 12, 12, .88) !important;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 0 !important;
	box-shadow: 0 24px 70px rgba(0, 0, 0, .38);
	display: block !important;
}

#body-login #login input {
	border-radius: 0 !important;
}

#body-login #login button {
	border-radius: 0 !important;
}

#body-login footer.guest-box {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #050505 !important;
	display: none !important;
}

.mbfx-shell {
	background:
		linear-gradient(180deg, rgba(248, 247, 242, .86) 0%, rgba(248, 247, 242, .78) 48%, rgba(248, 247, 242, .38) 74%, rgba(248, 247, 242, 0) 100%),
		linear-gradient(90deg, rgba(248, 247, 242, .76), rgba(248, 247, 242, .28) 56%, rgba(248, 247, 242, 0) 100%);
	inset: 0;
	pointer-events: none;
	position: fixed;
	z-index: 3;
}

.mbfx-graphic-field {
	inset: 0;
	overflow: hidden;
	position: absolute;
	z-index: 0;
}

.mbfx-graphic-field::before,
.mbfx-graphic-field::after {
	content: "";
	position: absolute;
}

.mbfx-graphic-field::before {
	background:
		linear-gradient(90deg, rgba(5, 5, 5, .10) 1px, transparent 1px),
		linear-gradient(0deg, rgba(5, 5, 5, .08) 1px, transparent 1px);
	background-size: 72px 72px;
	bottom: 78px;
	height: 42vh;
	left: 42px;
	opacity: .48;
	right: 42px;
}

.mbfx-graphic-field::after {
	background: linear-gradient(90deg, transparent, rgba(16, 73, 200, .28), transparent);
	bottom: 120px;
	height: 2px;
	left: 8vw;
	right: 5vw;
}

.mbfx-orbit,
.mbfx-envelope-outline,
.mbfx-routing-line,
.mbfx-node {
	position: absolute;
}

.mbfx-orbit {
	border: 2px solid rgba(5, 5, 5, .24);
	border-radius: 999px;
	height: 520px;
	right: 350px;
	top: 180px;
	transform: rotate(-12deg);
	width: 860px;
}

.mbfx-orbit-b {
	border-color: rgba(18, 80, 215, .30);
	height: 380px;
	right: 268px;
	top: 300px;
	transform: rotate(19deg);
	width: 620px;
}

.mbfx-envelope-outline {
	border: 3px solid rgba(5, 5, 5, .18);
	height: 260px;
	left: 70px;
	top: 415px;
	width: 440px;
}

.mbfx-envelope-outline::before,
.mbfx-envelope-outline::after {
	border-top: 3px solid rgba(5, 5, 5, .18);
	content: "";
	height: 1px;
	position: absolute;
	top: 0;
	width: 310px;
}

.mbfx-envelope-outline::before {
	left: 0;
	transform: rotate(32deg);
	transform-origin: left top;
}

.mbfx-envelope-outline::after {
	right: 0;
	transform: rotate(-32deg);
	transform-origin: right top;
}

.mbfx-routing-line {
	background: rgba(5, 5, 5, .22);
	height: 2px;
	left: 28vw;
	top: 58vh;
	transform: rotate(-17deg);
	transform-origin: left center;
	width: 44vw;
}

.mbfx-routing-line-b {
	background: rgba(15, 80, 210, .36);
	left: 35vw;
	top: 69vh;
	transform: rotate(10deg);
	width: 38vw;
}

.mbfx-node {
	background: #050505;
	border-radius: 50%;
	box-shadow: 0 0 0 10px rgba(5, 5, 5, .08);
	height: 13px;
	width: 13px;
}

.mbfx-node-a { left: 34vw; top: 52vh; }
.mbfx-node-b { left: 52vw; top: 44vh; }
.mbfx-node-c { background: #174ed1; left: 66vw; top: 63vh; }
.mbfx-node-d { background: #174ed1; left: 78vw; top: 49vh; }

.mbfx-nav {
	align-items: center;
	display: grid;
	grid-template-columns: 240px 1fr 54px;
	left: 0;
	padding: 30px 42px 0 42px;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 3;
}

.mbfx-brand {
	color: #050505;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 2rem;
	font-weight: 400;
	line-height: 1;
}

.mbfx-nav-items {
	align-items: center;
	color: #111;
	display: flex;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.38rem;
	font-weight: 700;
	gap: 48px;
	justify-content: center;
	line-height: 1;
	text-transform: uppercase;
}

.mbfx-menu,
.mbfx-brand a,
.mbfx-nav-items a,
.mbfx-focus {
	pointer-events: auto;
}

.mbfx-brand a,
.mbfx-nav-items a {
	color: inherit;
	text-decoration: none;
}

.mbfx-nav-items a {
	border-bottom: 1px solid transparent;
	padding-bottom: 3px;
	transition: border-color .18s ease, color .18s ease, text-shadow .18s ease;
}

.mbfx-nav-items a:hover,
.mbfx-nav-items a:focus-visible {
	border-bottom-color: currentColor;
	outline: 0;
	text-shadow: 0 0 18px rgba(92, 226, 255, .55);
}

.mbfx-logo-swarm {
	inset: -14vh -12vw;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.mbfx-swarm-logo {
	--blur: 0;
	--delay: 0s;
	--dur: 34s;
	--o: .18;
	--r: 0deg;
	--s: 1;
	align-items: center;
	color: rgba(236, 251, 255, .90);
	display: inline-flex;
	filter: blur(var(--blur));
	left: 0;
	mix-blend-mode: screen;
	opacity: var(--o);
	position: absolute;
	text-shadow: 0 0 24px rgba(137, 230, 255, .38), 0 12px 38px rgba(0, 0, 0, .72);
	top: 0;
	transform: translate3d(0, 0, 0) rotate(var(--r)) scale(var(--s));
	white-space: nowrap;
	will-change: transform, opacity;
}

.mbfx-swarm-imagehaus {
	font-family: Georgia, "Times New Roman", serif;
	font-size: .96rem;
	font-weight: 400;
	gap: .62em;
	letter-spacing: .34em;
	line-height: 1;
}

.mbfx-swarm-imagehaus i {
	background: rgba(6, 10, 23, .54);
	border: 1px solid rgba(218, 250, 255, .34);
	border-radius: 7px;
	box-shadow: 0 0 24px rgba(87, 220, 255, .18);
	display: inline-block;
	flex: 0 0 auto;
	height: 24px;
	position: relative;
	width: 24px;
}

.mbfx-swarm-imagehaus i::before,
.mbfx-swarm-imagehaus i::after {
	content: "";
	position: absolute;
}

.mbfx-swarm-imagehaus i::before {
	border: 2px solid rgba(244, 251, 255, .84);
	border-left-color: transparent;
	border-radius: 50%;
	height: 9px;
	left: 6px;
	top: 6px;
	transform: rotate(35deg);
	width: 9px;
}

.mbfx-swarm-imagehaus i::after {
	background:
		radial-gradient(circle at 38% 50%, transparent 0 3px, rgba(244, 251, 255, .88) 3.4px 4.6px, transparent 5px),
		radial-gradient(circle at 64% 50%, transparent 0 3px, rgba(244, 251, 255, .88) 3.4px 4.6px, transparent 5px);
	height: 15px;
	left: 4px;
	top: 5px;
	width: 17px;
}

.mbfx-swarm-imagehaus b {
	font: inherit;
	font-weight: 400;
}

.mbfx-swarm-henryk {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1rem;
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1;
}

.mbfx-swarm-01 { left: 6vw; top: 17vh; --s: .72; --r: -8deg; --o: .20; --x1: 8vw; --y1: -6vh; --x2: -4vw; --y2: 7vh; --dur: 32s; --delay: -5s; }
.mbfx-swarm-02 { left: 58vw; top: 12vh; --s: .88; --r: 4deg; --o: .18; --x1: -6vw; --y1: 5vh; --x2: 5vw; --y2: -4vh; --dur: 37s; --delay: -14s; }
.mbfx-swarm-03 { left: 27vw; top: 8vh; --s: .54; --r: -13deg; --o: .14; --x1: 9vw; --y1: 4vh; --x2: -7vw; --y2: -3vh; --dur: 41s; --delay: -20s; }
.mbfx-swarm-04 { left: 80vw; top: 27vh; --s: .74; --r: 8deg; --o: .12; --x1: -9vw; --y1: -3vh; --x2: 3vw; --y2: 7vh; --dur: 35s; --delay: -7s; }
.mbfx-swarm-05 { left: 9vw; top: 55vh; --s: .62; --r: 5deg; --o: .16; --x1: 6vw; --y1: 8vh; --x2: -5vw; --y2: -5vh; --dur: 39s; --delay: -2s; }
.mbfx-swarm-06 { left: 38vw; top: 60vh; --s: .80; --r: -6deg; --o: .14; --x1: -8vw; --y1: -5vh; --x2: 9vw; --y2: 4vh; --dur: 44s; --delay: -28s; }
.mbfx-swarm-07 { left: 70vw; top: 70vh; --s: .58; --r: 11deg; --o: .10; --x1: 7vw; --y1: -7vh; --x2: -8vw; --y2: 3vh; --dur: 33s; --delay: -11s; }
.mbfx-swarm-08 { left: 15vw; top: 78vh; --s: .70; --r: -3deg; --o: .16; --x1: 10vw; --y1: -5vh; --x2: -6vw; --y2: 4vh; --dur: 42s; --delay: -19s; }
.mbfx-swarm-09 { left: 49vw; top: 38vh; --s: .46; --r: 15deg; --o: .10; --x1: -5vw; --y1: 6vh; --x2: 6vw; --y2: -7vh; --dur: 31s; --delay: -9s; }
.mbfx-swarm-10 { left: 2vw; top: 33vh; --s: .64; --r: -11deg; --o: .13; --x1: 7vw; --y1: 3vh; --x2: -3vw; --y2: -8vh; --dur: 36s; --delay: -24s; }
.mbfx-swarm-11 { left: 87vw; top: 9vh; --s: .50; --r: 16deg; --o: .13; --x1: -10vw; --y1: 4vh; --x2: 4vw; --y2: -4vh; --dur: 40s; --delay: -16s; }
.mbfx-swarm-12 { left: 58vw; top: 84vh; --s: .62; --r: 4deg; --o: .12; --x1: -5vw; --y1: -9vh; --x2: 8vw; --y2: 2vh; --dur: 45s; --delay: -30s; }
.mbfx-swarm-13 { left: 24vw; top: 44vh; --s: .42; --r: -18deg; --o: .09; --x1: 11vw; --y1: -2vh; --x2: -6vw; --y2: 7vh; --dur: 29s; --delay: -4s; }
.mbfx-swarm-14 { left: 77vw; top: 50vh; --s: .56; --r: -7deg; --o: .10; --x1: -8vw; --y1: 7vh; --x2: 4vw; --y2: -5vh; --dur: 38s; --delay: -13s; }
.mbfx-swarm-15 { left: 44vw; top: 20vh; --s: .38; --r: 2deg; --o: .08; --x1: 5vw; --y1: -5vh; --x2: -8vw; --y2: 5vh; --dur: 47s; --delay: -33s; }
.mbfx-swarm-16 { left: 35vw; top: 76vh; --s: .48; --r: 12deg; --o: .11; --x1: -6vw; --y1: -7vh; --x2: 6vw; --y2: 3vh; --dur: 34s; --delay: -18s; }
.mbfx-swarm-17 { left: 66vw; top: 34vh; --s: .44; --r: -4deg; --o: .09; --x1: 7vw; --y1: 5vh; --x2: -7vw; --y2: -4vh; --dur: 43s; --delay: -22s; }
.mbfx-swarm-18 { left: 91vw; top: 72vh; --s: .58; --r: 9deg; --o: .10; --x1: -10vw; --y1: -6vh; --x2: 2vw; --y2: 5vh; --dur: 36s; --delay: -27s; }
.mbfx-swarm-19 { left: -20vw; top: 24vh; --s: .58; --r: -9deg; --o: .16; --dur: 17s; --delay: -3s; }
.mbfx-swarm-20 { left: -26vw; top: 68vh; --s: .72; --r: 5deg; --o: .13; --dur: 21s; --delay: -12s; }
.mbfx-swarm-21 { left: -18vw; top: 46vh; --s: .44; --r: 11deg; --o: .12; --dur: 24s; --delay: -18s; }
.mbfx-swarm-22 { left: -32vw; top: 10vh; --s: .86; --r: -4deg; --o: .11; --dur: 26s; --delay: -8s; }

@media (prefers-reduced-motion: no-preference) {
	.mbfx-logo-drift-a {
		animation: mailbucketLogoDriftA var(--dur) ease-in-out var(--delay) infinite alternate both;
	}

	.mbfx-logo-drift-b {
		animation: mailbucketLogoDriftB var(--dur) ease-in-out var(--delay) infinite alternate both;
	}

	.mbfx-logo-drift-c {
		animation: mailbucketLogoDriftC var(--dur) ease-in-out var(--delay) infinite alternate both;
	}

	.mbfx-logo-flyby {
		animation: mailbucketLogoFlyBy var(--dur) cubic-bezier(.18, 0, .1, 1) var(--delay) infinite both;
	}
}

@keyframes mailbucketLogoDriftA {
	0% { transform: translate3d(0, 0, 0) rotate(var(--r)) scale(var(--s)); }
	50% { transform: translate3d(var(--x1), var(--y1), 0) rotate(calc(var(--r) + 7deg)) scale(var(--s)); }
	100% { transform: translate3d(var(--x2), var(--y2), 0) rotate(calc(var(--r) - 5deg)) scale(var(--s)); }
}

@keyframes mailbucketLogoDriftB {
	0% { transform: translate3d(0, 0, 0) rotate(var(--r)) scale(var(--s)); }
	45% { transform: translate3d(var(--x1), var(--y1), 0) rotate(calc(var(--r) - 8deg)) scale(var(--s)); }
	100% { transform: translate3d(var(--x2), var(--y2), 0) rotate(calc(var(--r) + 4deg)) scale(var(--s)); }
}

@keyframes mailbucketLogoDriftC {
	0% { transform: translate3d(0, 0, 0) rotate(var(--r)) scale(var(--s)); opacity: .06; }
	52% { transform: translate3d(var(--x1), var(--y1), 0) rotate(calc(var(--r) + 12deg)) scale(var(--s)); opacity: var(--o); }
	100% { transform: translate3d(var(--x2), var(--y2), 0) rotate(calc(var(--r) - 9deg)) scale(var(--s)); opacity: .08; }
}

@keyframes mailbucketLogoFlyBy {
	0% { opacity: 0; transform: translate3d(-10vw, 7vh, 0) rotate(var(--r)) scale(.28); }
	16% { opacity: var(--o); }
	58% { opacity: var(--o); }
	100% { opacity: 0; transform: translate3d(145vw, -18vh, 0) rotate(calc(var(--r) + 11deg)) scale(1.32); }
}

.mbfx-menu {
	background: transparent;
	border: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 42px;
	justify-content: center;
	padding: 0;
	width: 42px;
}

.mbfx-menu span {
	background: #050505;
	display: block;
	height: 2px;
	width: 32px;
}

.mbfx-copy {
	color: #050505;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 4.8rem;
	font-weight: 300;
	left: 42px;
	line-height: .98;
	max-width: 980px;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	top: 18vh;
	width: calc(100% - 500px);
	z-index: 2;
}

.mbfx-copy div {
	white-space: nowrap;
}

.mbfx-script {
	font-family: Georgia, "Times New Roman", serif;
	font-style: italic;
	font-weight: 400;
	text-transform: none;
}

.mbfx-proof {
	bottom: 48px;
	color: #050505;
	max-width: 430px;
	pointer-events: auto;
	position: absolute;
	right: 478px;
	text-align: center;
	z-index: 2;
}

.mbfx-proof p {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.25rem;
	font-style: italic;
	margin: 0 0 26px 0;
}

.mbfx-focus {
	background: rgba(255, 255, 255, .64);
	border: 1px solid #050505;
	color: #050505;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .95rem;
	font-weight: 800;
	min-height: 43px;
	padding: 0 42px;
	text-transform: uppercase;
	width: 100%;
}

.mbfx-footer-line {
	align-items: center;
	bottom: 24px;
	color: #050505;
	display: grid;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.42rem;
	font-weight: 800;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	left: 42px;
	position: absolute;
	right: 42px;
	text-transform: uppercase;
	z-index: 2;
}

.mbfx-footer-line span:nth-child(n + 2) {
	text-align: center;
}

@media (prefers-reduced-motion: no-preference) {
	#body-login {
		animation: mailbucketBackgroundDrift 34s cubic-bezier(.42, 0, .2, 1) infinite alternate;
	}

	.mbfx-orbit-a {
		animation: mailbucketOrbitA 28s ease-in-out infinite alternate;
	}

	.mbfx-orbit-b {
		animation: mailbucketOrbitB 24s ease-in-out infinite alternate;
	}

	.mbfx-node {
		animation: mailbucketNodePulse 3.8s ease-in-out infinite;
	}

	#body-login::before,
	#body-login::after {
		content: "";
		position: fixed;
		pointer-events: none;
	}

	#body-login::before {
		inset: -18vmax;
		z-index: 0;
		background:
			radial-gradient(circle at 26% 24%, rgba(255, 255, 255, .20) 0 7%, transparent 19%),
			radial-gradient(circle at 74% 29%, rgba(255, 220, 184, .24) 0 8%, transparent 22%),
			linear-gradient(102deg, transparent 0 39%, rgba(255, 255, 255, .13) 46%, transparent 58%),
			linear-gradient(15deg, rgba(53, 91, 164, .22), transparent 44%);
		mix-blend-mode: screen;
		opacity: .72;
		transform: translate3d(-2.6%, 0, 0) rotate(.001deg);
		animation: mailbucketLightSweep 22s ease-in-out infinite alternate;
	}

	#body-login::after {
		inset: 0;
		z-index: 1;
		background:
			linear-gradient(90deg, transparent 0 11.7%, rgba(255, 255, 255, .22) 11.78% 11.9%, transparent 12.05% 88%, rgba(255, 255, 255, .18) 88.1% 88.22%, transparent 88.34%),
			linear-gradient(0deg, transparent 0 13.6%, rgba(255, 255, 255, .20) 13.72% 13.86%, transparent 14.02% 86%, rgba(255, 255, 255, .15) 86.1% 86.24%, transparent 86.42%),
			repeating-linear-gradient(90deg, rgba(255, 255, 255, .026) 0 1px, transparent 1px 7px);
		opacity: .42;
		transform: scale(1.012);
		animation: mailbucketFramePulse 11s ease-in-out infinite alternate;
	}

	#body-login .wrapper {
		animation: mailbucketLoginReveal 980ms cubic-bezier(.22, 1, .36, 1) both;
	}

	#body-login #login {
		transform-origin: 50% 52%;
		animation: mailbucketPanelFloat 8.5s ease-in-out infinite;
	}

	.mbfx-copy {
		animation: mailbucketEditorialRise 1180ms cubic-bezier(.22, 1, .36, 1) both;
	}

	.mbfx-nav {
		animation: mailbucketHeaderSet 840ms ease-out both;
	}

	.mbfx-proof,
	.mbfx-footer-line {
		animation: mailbucketDetailsSet 1280ms ease-out both;
	}

	#body-login form,
	#body-login #login > div {
		backdrop-filter: blur(18px) saturate(1.08);
	}
}

@media (prefers-reduced-motion: reduce) {
	#body-login,
	#body-login .wrapper,
	#body-login #login,
	.mbfx-copy,
	.mbfx-nav,
	.mbfx-proof,
	.mbfx-footer-line,
	.mbfx-orbit,
	.mbfx-node {
		animation: none !important;
	}
}

@keyframes mailbucketBackgroundDrift {
	0% {
		background-position: 44% 56%;
		background-size: 108% 108%;
	}
	50% {
		background-position: 50% 52%;
		background-size: 113% 113%;
	}
	100% {
		background-position: 56% 60%;
		background-size: 110% 110%;
	}
}

@keyframes mailbucketLightSweep {
	0% {
		opacity: .50;
		transform: translate3d(-3.5%, 1.2%, 0) rotate(-1deg) scale(1);
	}
	48% {
		opacity: .78;
		transform: translate3d(1.2%, -1.6%, 0) rotate(.7deg) scale(1.02);
	}
	100% {
		opacity: .58;
		transform: translate3d(3.6%, .4%, 0) rotate(1.4deg) scale(1.01);
	}
}

@keyframes mailbucketFramePulse {
	0% {
		opacity: .28;
		transform: scale(1.004);
	}
	100% {
		opacity: .50;
		transform: scale(1.018);
	}
}

@keyframes mailbucketLoginReveal {
	0% {
		opacity: 0;
		transform: translate3d(0, 18px, 0) scale(.985);
	}
	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1);
	}
}

@keyframes mailbucketPanelFloat {
	0%,
	100% {
		transform: translate3d(0, 0, 0);
	}
	50% {
		transform: translate3d(0, -7px, 0);
	}
}

@keyframes mailbucketEditorialRise {
	0% {
		opacity: 0;
		transform: translate3d(0, 24px, 0);
	}
	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mailbucketHeaderSet {
	0% {
		opacity: 0;
		transform: translate3d(0, -12px, 0);
	}
	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mailbucketDetailsSet {
	0% {
		opacity: 0;
		transform: translate3d(0, 14px, 0);
	}
	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mailbucketOrbitA {
	0% {
		transform: translate3d(-18px, 8px, 0) rotate(-12deg) scale(1);
	}
	100% {
		transform: translate3d(24px, -14px, 0) rotate(-7deg) scale(1.035);
	}
}

@keyframes mailbucketOrbitB {
	0% {
		transform: translate3d(18px, -10px, 0) rotate(19deg) scale(1);
	}
	100% {
		transform: translate3d(-18px, 12px, 0) rotate(24deg) scale(1.04);
	}
}

@keyframes mailbucketNodePulse {
	0%,
	100% {
		opacity: .48;
		transform: scale(.82);
	}
	50% {
		opacity: 1;
		transform: scale(1.18);
	}
}

@media (max-width: 1200px) {
	.mbfx-copy {
		font-size: 3.85rem;
		max-width: 760px;
		width: calc(100% - 460px);
	}

	.mbfx-nav-items {
		font-size: 1.05rem;
		gap: 28px;
	}
}

@media (max-width: 900px) {
	#body-login .wrapper {
		bottom: 70px;
		left: 20px;
		right: 20px;
		width: auto !important;
	}

	#body-login .v-align {
		max-width: 380px;
	}

	.mbfx-nav {
		grid-template-columns: 1fr 42px;
		padding: 24px 22px 0 22px;
	}

	.mbfx-nav-items {
		display: none;
	}

	.mbfx-brand {
		font-size: 1.65rem;
	}

	.mbfx-copy {
		font-size: 2.4rem;
		left: 20px;
		max-width: none;
		right: 20px;
		top: 96px;
		width: auto;
	}

	.mbfx-copy div {
		white-space: normal;
	}

	.mbfx-proof {
		display: none;
	}

	.mbfx-graphic-field::before {
		left: 20px;
		right: 20px;
	}

	.mbfx-orbit,
	.mbfx-routing-line,
	.mbfx-envelope-outline {
		opacity: .32;
	}

	.mbfx-footer-line {
		font-size: .95rem;
		grid-template-columns: 1fr 1fr;
		left: 20px;
		right: 20px;
		row-gap: 8px;
	}
}

/* Orbital space art direction. Kept at the end so it wins over older cache-bust
   passes while preserving the same markup and login accessibility. */
#body-login {
	background-color: #02040b !important;
	background-position: 50% 52% !important;
	background-size: 112% 112% !important;
	color: #f4fbff;
}

#body-login::before,
#body-login::after {
	content: "";
	inset: 0;
	pointer-events: none;
	position: fixed;
}

#body-login::before {
	background:
		radial-gradient(circle at 20% 20%, rgba(82, 232, 242, .24), transparent 24%),
		radial-gradient(circle at 66% 58%, rgba(31, 108, 255, .20), transparent 31%),
		radial-gradient(circle at 44% 82%, rgba(98, 89, 255, .16), transparent 28%);
	mix-blend-mode: screen;
	opacity: .82;
	z-index: 1;
}

#body-login::after {
	background:
		linear-gradient(90deg, rgba(0, 0, 0, .16), transparent 34%, rgba(0, 0, 0, .48)),
		linear-gradient(180deg, rgba(0, 0, 0, .10), transparent 58%, rgba(0, 0, 0, .54));
	z-index: 2;
}

#body-login .wrapper {
	bottom: 80px;
	right: 42px;
	width: 388px !important;
}

#body-login #login > div,
#body-login #login form,
#body-login .login-box {
	background: rgba(2, 5, 12, .82) !important;
	border: 1px solid rgba(202, 244, 255, .28);
	box-shadow: 0 28px 90px rgba(0, 0, 0, .60), 0 0 42px rgba(60, 196, 255, .12);
}

#body-login #login input {
	background: rgba(255, 255, 255, .06) !important;
	border-color: rgba(220, 250, 255, .34) !important;
	color: #f5fbff !important;
}

#body-login #login input::placeholder {
	color: rgba(238, 248, 255, .66) !important;
}

.mbfx-shell {
	background:
		radial-gradient(circle at 72% 48%, rgba(0, 0, 0, .04) 0 18%, rgba(0, 0, 0, .36) 48%, rgba(0, 0, 0, .68) 100%),
		linear-gradient(90deg, rgba(2, 4, 11, .08), rgba(2, 4, 11, .22) 55%, rgba(2, 4, 11, .72) 100%);
	overflow: hidden;
}

.mbfx-cosmos {
	inset: -12vh -10vw;
	overflow: hidden;
	position: absolute;
	z-index: 0;
}

.mbfx-stars,
.mbfx-smoke,
.mbfx-satellite,
.mbfx-comet {
	position: absolute;
}

.mbfx-stars {
	inset: -18%;
	background-image:
		radial-gradient(circle, rgba(255, 255, 255, .96) 0 1px, transparent 1.7px),
		radial-gradient(circle, rgba(141, 232, 255, .80) 0 1px, transparent 1.6px),
		radial-gradient(circle, rgba(255, 255, 255, .58) 0 1.4px, transparent 2.1px);
	background-position: 0 0, 64px 90px, 148px 34px;
	background-size: 210px 210px, 340px 340px, 520px 520px;
	opacity: .50;
}

.mbfx-stars-b {
	filter: blur(.25px);
	opacity: .34;
	transform: rotate(9deg) scale(1.08);
}

.mbfx-smoke {
	border-radius: 50%;
	filter: blur(48px);
	mix-blend-mode: screen;
	opacity: .34;
}

.mbfx-smoke-a {
	background:
		radial-gradient(circle at 30% 30%, rgba(96, 245, 255, .84), transparent 34%),
		radial-gradient(circle at 72% 54%, rgba(13, 90, 142, .58), transparent 48%),
		radial-gradient(circle at 44% 72%, rgba(255, 255, 255, .18), transparent 36%);
	height: 78vh;
	left: -10vw;
	top: -6vh;
	width: 68vw;
}

.mbfx-smoke-b {
	background:
		radial-gradient(circle at 58% 40%, rgba(47, 105, 255, .70), transparent 38%),
		radial-gradient(circle at 30% 70%, rgba(10, 33, 86, .76), transparent 50%);
	height: 66vh;
	right: -8vw;
	top: 22vh;
	width: 62vw;
}

.mbfx-smoke-c {
	background:
		radial-gradient(circle at 50% 50%, rgba(110, 104, 255, .34), transparent 44%),
		radial-gradient(circle at 64% 62%, rgba(83, 232, 255, .22), transparent 52%);
	bottom: -24vh;
	height: 62vh;
	left: 20vw;
	width: 70vw;
}

.mbfx-satellite {
	border: 1px solid rgba(223, 251, 255, .72);
	height: 24px;
	width: 76px;
}

.mbfx-satellite::before,
.mbfx-satellite::after {
	border: 1px solid rgba(148, 232, 255, .54);
	content: "";
	height: 42px;
	position: absolute;
	top: -10px;
	width: 84px;
}

.mbfx-satellite::before {
	right: 86px;
}

.mbfx-satellite::after {
	left: 86px;
}

.mbfx-satellite i {
	background: rgba(223, 251, 255, .78);
	display: block;
	height: 34px;
	left: 36px;
	position: absolute;
	top: 22px;
	width: 2px;
}

.mbfx-satellite-a {
	left: 74vw;
	top: 31vh;
	transform: rotate(-17deg);
}

.mbfx-satellite-b {
	left: 12vw;
	top: 72vh;
	transform: rotate(16deg) scale(.76);
}

.mbfx-comet {
	background: linear-gradient(90deg, transparent, rgba(194, 249, 255, .94));
	height: 2px;
	opacity: .56;
	transform-origin: right center;
	width: 260px;
}

.mbfx-comet::after {
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0 0 18px rgba(122, 233, 255, .72);
	content: "";
	height: 5px;
	position: absolute;
	right: -2px;
	top: -2px;
	width: 5px;
}

.mbfx-comet-a {
	left: 72vw;
	top: 28vh;
	transform: rotate(-21deg);
}

.mbfx-comet-b {
	left: 12vw;
	top: 52vh;
	transform: rotate(8deg);
	width: 180px;
}

.mbfx-graphic-field::before {
	background:
		linear-gradient(90deg, rgba(210, 246, 255, .055) 1px, transparent 1px),
		linear-gradient(0deg, rgba(210, 246, 255, .045) 1px, transparent 1px);
	background-size: 74px 74px;
	bottom: 76px;
	opacity: .55;
}

.mbfx-graphic-field::after {
	background: linear-gradient(90deg, transparent, rgba(105, 207, 255, .48), transparent);
	box-shadow: 0 0 22px rgba(91, 204, 255, .22);
}

.mbfx-orbit {
	border-color: rgba(208, 248, 255, .24);
	box-shadow: 0 0 32px rgba(77, 219, 255, .10);
}

.mbfx-orbit-b {
	border-color: rgba(68, 122, 255, .32);
}

.mbfx-envelope-outline,
.mbfx-envelope-outline::before,
.mbfx-envelope-outline::after {
	border-color: rgba(221, 250, 255, .24);
}

.mbfx-routing-line {
	background: rgba(197, 246, 255, .26);
}

.mbfx-routing-line-b {
	background: rgba(70, 129, 255, .44);
}

.mbfx-node {
	background: #d9fbff;
	box-shadow: 0 0 0 10px rgba(109, 230, 255, .10), 0 0 24px rgba(109, 230, 255, .48);
}

.mbfx-node-c,
.mbfx-node-d {
	background: #5b84ff;
}

.mbfx-brand,
.mbfx-nav-items,
.mbfx-copy,
.mbfx-proof,
.mbfx-footer-line {
	color: #f4fbff;
	text-shadow: 0 2px 28px rgba(0, 0, 0, .46);
}

.mbfx-menu span {
	background: #f4fbff;
	box-shadow: 0 0 14px rgba(109, 230, 255, .40);
}

.mbfx-copy {
	font-size: 4.35rem;
	max-width: 880px;
	text-align: left;
	top: 17vh;
	width: calc(100% - 560px);
}

.mbfx-copy div {
	white-space: normal;
}

.mbfx-script {
	color: #d8fbff;
}

.mbfx-proof {
	bottom: 82px;
	left: 54px;
	max-width: 360px;
	right: auto;
	text-align: left;
}

.mbfx-proof p {
	color: rgba(232, 249, 255, .82);
	font-size: 1.08rem;
	margin-bottom: 16px;
}

.mbfx-focus {
	background: rgba(232, 250, 255, .08);
	border-color: rgba(226, 250, 255, .70);
	color: #f4fbff;
	width: 260px;
}

.mbfx-footer-line {
	color: rgba(244, 251, 255, .92);
	font-size: 1.15rem;
}

@media (prefers-reduced-motion: no-preference) {
	#body-login {
		animation: mailbucketOrbitalBackground 36s cubic-bezier(.42, 0, .2, 1) infinite alternate;
	}

	#body-login::before {
		animation: mailbucketNebulaPulse 18s ease-in-out infinite alternate;
	}

	.mbfx-stars-a {
		animation: mailbucketStarsDrift 64s linear infinite;
	}

	.mbfx-stars-b {
		animation: mailbucketStarsDriftB 86s linear infinite;
	}

	.mbfx-smoke-a {
		animation: mailbucketSmokeA 26s ease-in-out infinite alternate;
	}

	.mbfx-smoke-b {
		animation: mailbucketSmokeB 31s ease-in-out infinite alternate;
	}

	.mbfx-smoke-c {
		animation: mailbucketSmokeC 38s ease-in-out infinite alternate;
	}

	.mbfx-satellite-a {
		animation: mailbucketSatelliteA 34s ease-in-out infinite alternate;
	}

	.mbfx-satellite-b {
		animation: mailbucketSatelliteB 42s ease-in-out infinite alternate;
	}

	.mbfx-comet-a {
		animation: mailbucketCometA 8s ease-in-out infinite;
	}

	.mbfx-comet-b {
		animation: mailbucketCometB 12s ease-in-out infinite;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfx-stars,
	.mbfx-smoke,
	.mbfx-satellite,
	.mbfx-comet {
		animation: none !important;
	}
}

@keyframes mailbucketOrbitalBackground {
	0% {
		background-position: 44% 51%;
		background-size: 112% 112%;
	}
	50% {
		background-position: 51% 48%;
		background-size: 118% 118%;
	}
	100% {
		background-position: 58% 54%;
		background-size: 114% 114%;
	}
}

@keyframes mailbucketNebulaPulse {
	0% {
		opacity: .56;
		transform: scale(1);
	}
	100% {
		opacity: .86;
		transform: scale(1.035);
	}
}

@keyframes mailbucketStarsDrift {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(-160px, 90px, 0);
	}
}

@keyframes mailbucketStarsDriftB {
	0% {
		transform: rotate(9deg) translate3d(0, 0, 0) scale(1.08);
	}
	100% {
		transform: rotate(9deg) translate3d(120px, -140px, 0) scale(1.08);
	}
}

@keyframes mailbucketSmokeA {
	0% {
		transform: translate3d(-4%, -2%, 0) rotate(-4deg) scale(1);
	}
	100% {
		transform: translate3d(10%, 5%, 0) rotate(7deg) scale(1.08);
	}
}

@keyframes mailbucketSmokeB {
	0% {
		transform: translate3d(6%, 1%, 0) rotate(5deg) scale(1);
	}
	100% {
		transform: translate3d(-8%, -5%, 0) rotate(-6deg) scale(1.12);
	}
}

@keyframes mailbucketSmokeC {
	0% {
		transform: translate3d(-2%, 6%, 0) rotate(2deg) scale(1);
	}
	100% {
		transform: translate3d(7%, -7%, 0) rotate(-5deg) scale(1.10);
	}
}

@keyframes mailbucketSatelliteA {
	0% {
		transform: translate3d(-18px, 8px, 0) rotate(-17deg);
	}
	100% {
		transform: translate3d(58px, -34px, 0) rotate(-11deg);
	}
}

@keyframes mailbucketSatelliteB {
	0% {
		transform: translate3d(22px, -12px, 0) rotate(16deg) scale(.76);
	}
	100% {
		transform: translate3d(-72px, 36px, 0) rotate(22deg) scale(.76);
	}
}

@keyframes mailbucketCometA {
	0%,
		54% {
		opacity: 0;
		transform: translate3d(210px, -70px, 0) rotate(-21deg);
	}
	64% {
		opacity: .74;
	}
	100% {
		opacity: 0;
		transform: translate3d(-540px, 170px, 0) rotate(-21deg);
	}
}

@keyframes mailbucketCometB {
	0%,
		70% {
		opacity: 0;
		transform: translate3d(-260px, -60px, 0) rotate(8deg);
	}
	80% {
		opacity: .50;
	}
	100% {
		opacity: 0;
		transform: translate3d(460px, 64px, 0) rotate(8deg);
	}
}

@media (max-width: 1200px) {
	.mbfx-copy {
		font-size: 3.38rem;
		max-width: 680px;
		width: calc(100% - 500px);
	}

	.mbfx-proof {
		display: none;
	}
}

@media (max-width: 900px) {
	#body-login .wrapper {
		bottom: 64px;
		left: 20px;
		right: 20px;
		width: auto !important;
	}

	.mbfx-copy {
		font-size: 2.2rem;
		left: 20px;
		right: 20px;
		text-align: left;
		top: 102px;
		width: auto;
	}

	.mbfx-satellite-a {
		left: 62vw;
		top: 22vh;
	}

	.mbfx-envelope-outline,
	.mbfx-orbit,
	.mbfx-routing-line {
		opacity: .30;
	}

	.mbfx-footer-line {
		font-size: .86rem;
	}
}

/* Godspace pass: reverse star-stream motion and larger celestial atmosphere. */
.mbfx-cosmos {
	perspective: 900px;
	transform-style: preserve-3d;
}

.mbfx-aura,
.mbfx-warp {
	pointer-events: none;
	position: absolute;
}

.mbfx-aura {
	border-radius: 50%;
	filter: blur(42px);
	mix-blend-mode: screen;
	opacity: .38;
}

.mbfx-aura-a {
	background:
		radial-gradient(circle at 50% 50%, rgba(219, 255, 255, .70), transparent 9%),
		radial-gradient(circle at 46% 48%, rgba(76, 230, 255, .32), transparent 32%),
		radial-gradient(circle at 56% 60%, rgba(44, 95, 255, .24), transparent 54%);
	height: 84vh;
	left: 25vw;
	top: 4vh;
	width: 84vh;
}

.mbfx-aura-b {
	background:
		radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .38), transparent 8%),
		radial-gradient(circle at 50% 50%, rgba(127, 105, 255, .28), transparent 34%),
		radial-gradient(circle at 50% 50%, rgba(64, 210, 255, .18), transparent 58%);
	height: 92vh;
	right: -4vw;
	top: 18vh;
	width: 92vh;
}

.mbfx-warp {
	inset: -46%;
	mix-blend-mode: screen;
	opacity: .20;
	transform-origin: 62% 52%;
	background:
		repeating-conic-gradient(from -18deg at 62% 52%,
			transparent 0 5.8deg,
			rgba(225, 252, 255, .30) 6.05deg 6.35deg,
			transparent 6.65deg 11.5deg),
		repeating-conic-gradient(from 8deg at 62% 52%,
			transparent 0 11deg,
			rgba(66, 136, 255, .22) 11.3deg 11.8deg,
			transparent 12.1deg 22deg);
	-webkit-mask-image: radial-gradient(ellipse at 62% 52%, transparent 0 8%, #000 14% 68%, transparent 78%);
	mask-image: radial-gradient(ellipse at 62% 52%, transparent 0 8%, #000 14% 68%, transparent 78%);
}

.mbfx-warp-b {
	opacity: .15;
	transform-origin: 48% 46%;
	transform: rotate(17deg);
}

.mbfx-stars {
	inset: -46%;
	background-image:
		radial-gradient(circle, rgba(255, 255, 255, 1) 0 1px, transparent 1.8px),
		radial-gradient(circle, rgba(134, 240, 255, .92) 0 1.2px, transparent 2px),
		radial-gradient(circle, rgba(255, 255, 255, .66) 0 1.7px, transparent 2.5px),
		radial-gradient(circle, rgba(105, 141, 255, .76) 0 1.1px, transparent 2px);
	background-position: 0 0, 92px 130px, 180px 48px, 260px 220px;
	background-size: 190px 190px, 310px 310px, 470px 470px, 690px 690px;
	mix-blend-mode: screen;
	opacity: .72;
	transform-origin: 62% 52%;
}

.mbfx-stars-b {
	filter: blur(.4px);
	opacity: .52;
}

.mbfx-stars-c {
	filter: blur(1px);
	opacity: .30;
	transform-origin: 45% 48%;
}

.mbfx-smoke {
	filter: blur(62px);
	opacity: .44;
}

.mbfx-smoke-a {
	height: 92vh;
	left: -14vw;
	top: -10vh;
	width: 74vw;
}

.mbfx-smoke-b {
	height: 78vh;
	right: -10vw;
	top: 14vh;
	width: 70vw;
}

.mbfx-smoke-c {
	bottom: -28vh;
	height: 72vh;
	left: 14vw;
	width: 82vw;
}

.mbfx-copy {
	text-shadow: 0 0 24px rgba(159, 244, 255, .22), 0 12px 46px rgba(0, 0, 0, .86);
}

.mbfx-script {
	text-shadow: 0 0 18px rgba(207, 255, 255, .34), 0 10px 32px rgba(0, 0, 0, .80);
}

.mbfx-satellite {
	box-shadow: 0 0 20px rgba(144, 231, 255, .18);
}

@media (prefers-reduced-motion: no-preference) {
	.mbfx-stars-a {
		animation: mailbucketReverseStarfieldA 9.5s linear infinite;
	}

	.mbfx-stars-b {
		animation: mailbucketReverseStarfieldB 12s linear infinite;
		animation-delay: -4s;
	}

	.mbfx-stars-c {
		animation: mailbucketReverseStarfieldC 16s linear infinite;
		animation-delay: -8s;
	}

	.mbfx-warp-a {
		animation: mailbucketReverseWarpA 7.2s cubic-bezier(.2, 0, .1, 1) infinite;
	}

	.mbfx-warp-b {
		animation: mailbucketReverseWarpB 10s cubic-bezier(.2, 0, .1, 1) infinite;
		animation-delay: -4.5s;
	}

	.mbfx-aura-a {
		animation: mailbucketGodAuraA 14s ease-in-out infinite alternate;
	}

	.mbfx-aura-b {
		animation: mailbucketGodAuraB 18s ease-in-out infinite alternate;
	}

	.mbfx-smoke-a {
		animation: mailbucketGodSmokeA 20s ease-in-out infinite alternate;
	}

	.mbfx-smoke-b {
		animation: mailbucketGodSmokeB 24s ease-in-out infinite alternate;
	}

	.mbfx-smoke-c {
		animation: mailbucketGodSmokeC 30s ease-in-out infinite alternate;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfx-aura,
	.mbfx-warp {
		animation: none !important;
	}
}

@keyframes mailbucketReverseStarfieldA {
	0% {
		opacity: 0;
		transform: scale(1.54) rotate(-1.5deg);
	}
	12% {
		opacity: .78;
	}
	82% {
		opacity: .64;
	}
	100% {
		opacity: 0;
		transform: scale(.56) rotate(1.5deg);
	}
}

@keyframes mailbucketReverseStarfieldB {
	0% {
		opacity: 0;
		transform: rotate(9deg) scale(1.42);
	}
	14% {
		opacity: .54;
	}
	86% {
		opacity: .42;
	}
	100% {
		opacity: 0;
		transform: rotate(9deg) scale(.48);
	}
}

@keyframes mailbucketReverseStarfieldC {
	0% {
		opacity: 0;
		transform: rotate(-7deg) scale(1.68);
	}
	16% {
		opacity: .34;
	}
	84% {
		opacity: .26;
	}
	100% {
		opacity: 0;
		transform: rotate(-7deg) scale(.64);
	}
}

@keyframes mailbucketReverseWarpA {
	0% {
		opacity: 0;
		transform: scale(1.52) rotate(-7deg);
	}
	16% {
		opacity: .32;
	}
	58% {
		opacity: .22;
	}
	100% {
		opacity: 0;
		transform: scale(.48) rotate(5deg);
	}
}

@keyframes mailbucketReverseWarpB {
	0% {
		opacity: 0;
		transform: rotate(18deg) scale(1.36);
	}
	22% {
		opacity: .22;
	}
	66% {
		opacity: .16;
	}
	100% {
		opacity: 0;
		transform: rotate(8deg) scale(.54);
	}
}

@keyframes mailbucketGodAuraA {
	0% {
		opacity: .22;
		transform: translate3d(-8%, -4%, 0) scale(.92);
	}
	100% {
		opacity: .50;
		transform: translate3d(9%, 8%, 0) scale(1.14);
	}
}

@keyframes mailbucketGodAuraB {
	0% {
		opacity: .18;
		transform: translate3d(8%, -6%, 0) scale(.98);
	}
	100% {
		opacity: .42;
		transform: translate3d(-7%, 6%, 0) scale(1.18);
	}
}

@keyframes mailbucketGodSmokeA {
	0% {
		transform: translate3d(-7%, -5%, 0) rotate(-8deg) scale(.96);
	}
	100% {
		transform: translate3d(13%, 8%, 0) rotate(10deg) scale(1.16);
	}
}

@keyframes mailbucketGodSmokeB {
	0% {
		transform: translate3d(9%, 5%, 0) rotate(8deg) scale(.98);
	}
	100% {
		transform: translate3d(-12%, -8%, 0) rotate(-9deg) scale(1.20);
	}
}

@keyframes mailbucketGodSmokeC {
	0% {
		transform: translate3d(-5%, 9%, 0) rotate(3deg) scale(.95);
	}
	100% {
		transform: translate3d(10%, -10%, 0) rotate(-7deg) scale(1.18);
	}
}

/* Celestial pass: planets, ship silhouettes, launch hardware, denser stars. */
.mbfx-planet,
.mbfx-ringed-planet,
.mbfx-starburst,
.mbfx-ship,
.mbfx-rocket {
	pointer-events: none;
	position: absolute;
}

.mbfx-planet {
	border-radius: 50%;
	filter: saturate(1.18);
	mix-blend-mode: screen;
	opacity: .72;
	overflow: hidden;
}

.mbfx-planet::before,
.mbfx-planet::after {
	border-radius: 50%;
	content: "";
	inset: 0;
	position: absolute;
}

.mbfx-planet::before {
	background:
		linear-gradient(115deg, rgba(255, 255, 255, .30), transparent 23% 68%, rgba(0, 0, 0, .52)),
		repeating-linear-gradient(12deg, transparent 0 18px, rgba(255, 255, 255, .06) 19px 23px, transparent 24px 48px);
}

.mbfx-planet::after {
	background: radial-gradient(circle at 68% 58%, transparent 0 38%, rgba(0, 0, 0, .54) 70%);
}

.mbfx-planet i {
	background: rgba(255, 255, 255, .42);
	border-radius: 50%;
	display: block;
	filter: blur(10px);
	height: 24%;
	left: 20%;
	position: absolute;
	top: 17%;
	width: 30%;
	z-index: 1;
}

.mbfx-planet-mars {
	background:
		radial-gradient(circle at 34% 28%, #ffd2a8, transparent 18%),
		radial-gradient(circle at 62% 54%, #b84c28, transparent 44%),
		linear-gradient(135deg, #ec8b4b, #8f2b1d 58%, #221014);
	box-shadow: 0 0 78px rgba(239, 103, 58, .30), inset -42px -32px 70px rgba(0, 0, 0, .56);
	height: 27vmin;
	right: 2vw;
	top: 7vh;
	width: 27vmin;
}

.mbfx-planet-blue {
	background:
		radial-gradient(circle at 28% 24%, #e8ffff, transparent 14%),
		radial-gradient(circle at 40% 58%, #49e9ff, transparent 30%),
		radial-gradient(circle at 70% 40%, #174fff, transparent 44%),
		linear-gradient(135deg, #3ef2ff, #142d93 62%, #030611);
	box-shadow: 0 0 92px rgba(79, 224, 255, .28), inset -36px -34px 72px rgba(0, 0, 0, .62);
	bottom: -13vmin;
	height: 28vmin;
	left: 42vw;
	width: 28vmin;
}

.mbfx-ringed-planet-a {
	height: 16vmin;
	left: 5vw;
	top: 55vh;
	width: 24vmin;
}

.mbfx-ringed-planet-a::before {
	border: 2px solid rgba(216, 251, 255, .46);
	border-radius: 50%;
	content: "";
	height: 52%;
	left: -18%;
	position: absolute;
	top: 26%;
	transform: rotate(-14deg);
	width: 136%;
}

.mbfx-ringed-planet-a i {
	background:
		radial-gradient(circle at 34% 26%, #fff3cf, transparent 17%),
		linear-gradient(135deg, #d9a557, #5f3527 68%, #0a0711);
	border-radius: 50%;
	box-shadow: 0 0 38px rgba(255, 211, 137, .20), inset -24px -18px 40px rgba(0, 0, 0, .56);
	display: block;
	height: 78%;
	left: 26%;
	position: absolute;
	top: 9%;
	width: 48%;
}

.mbfx-starburst {
	border-radius: 50%;
	filter: blur(.2px);
	height: 14vmin;
	mix-blend-mode: screen;
	opacity: .54;
	width: 14vmin;
}

.mbfx-starburst::before,
.mbfx-starburst::after {
	content: "";
	inset: 0;
	position: absolute;
}

.mbfx-starburst::before {
	background:
		radial-gradient(circle, #ffffff 0 4%, rgba(123, 234, 255, .56) 5% 11%, transparent 18%),
		repeating-conic-gradient(from 0deg, rgba(220, 252, 255, .72) 0 2deg, transparent 2.3deg 22deg);
	-webkit-mask-image: radial-gradient(circle, #000 0 46%, transparent 72%);
	mask-image: radial-gradient(circle, #000 0 46%, transparent 72%);
}

.mbfx-starburst::after {
	background:
		linear-gradient(90deg, transparent 0 46%, rgba(255, 255, 255, .74) 49% 51%, transparent 54%),
		linear-gradient(0deg, transparent 0 46%, rgba(255, 255, 255, .74) 49% 51%, transparent 54%);
	filter: blur(.5px);
}

.mbfx-starburst-a {
	left: 54vw;
	top: 20vh;
}

.mbfx-starburst-b {
	height: 9vmin;
	left: 82vw;
	top: 70vh;
	width: 9vmin;
}

.mbfx-ship {
	background: linear-gradient(90deg, rgba(220, 252, 255, .16), rgba(220, 252, 255, .04));
	border: 1px solid rgba(209, 247, 255, .56);
	clip-path: polygon(0 54%, 18% 27%, 72% 0, 100% 48%, 73% 100%, 18% 74%);
	height: 42px;
	opacity: .66;
	width: 142px;
}

.mbfx-ship::before {
	background: rgba(185, 244, 255, .54);
	border-radius: 999px;
	content: "";
	height: 4px;
	left: 34%;
	position: absolute;
	top: 46%;
	width: 36%;
}

.mbfx-ship::after {
	background: linear-gradient(90deg, rgba(85, 217, 255, .38), transparent);
	content: "";
	filter: blur(6px);
	height: 22px;
	position: absolute;
	right: 98%;
	top: 10px;
	width: 150px;
}

.mbfx-ship i {
	background: rgba(255, 255, 255, .50);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	display: block;
	height: 18px;
	left: 80%;
	position: absolute;
	top: 12px;
	width: 26px;
}

.mbfx-ship-a {
	right: 15vw;
	top: 24vh;
	transform: rotate(-16deg);
}

.mbfx-ship-b {
	left: 9vw;
	top: 74vh;
	transform: rotate(13deg) scale(.82);
}

.mbfx-rocket {
	background: linear-gradient(180deg, rgba(240, 252, 255, .52), rgba(91, 166, 255, .12));
	clip-path: polygon(50% 0, 78% 20%, 78% 76%, 100% 100%, 64% 90%, 50% 100%, 36% 90%, 0 100%, 22% 76%, 22% 20%);
	height: 138px;
	opacity: .58;
	right: 4vw;
	top: 43vh;
	transform: rotate(20deg);
	width: 36px;
}

.mbfx-rocket::before {
	background: rgba(8, 14, 27, .70);
	border: 1px solid rgba(230, 252, 255, .42);
	border-radius: 50%;
	content: "";
	height: 12px;
	left: 11px;
	position: absolute;
	top: 32px;
	width: 12px;
}

.mbfx-rocket::after {
	background:
		radial-gradient(ellipse at 50% 0, rgba(255, 255, 255, .86), transparent 28%),
		linear-gradient(180deg, rgba(91, 224, 255, .70), rgba(47, 99, 255, .06));
	content: "";
	filter: blur(5px);
	height: 120px;
	left: 7px;
	position: absolute;
	top: 118px;
	width: 22px;
}

.mbfx-stars {
	background-image:
		radial-gradient(circle, rgba(255, 255, 255, 1) 0 1.1px, transparent 1.9px),
		radial-gradient(circle, rgba(134, 240, 255, .96) 0 1.4px, transparent 2.2px),
		radial-gradient(circle, rgba(255, 255, 255, .72) 0 1.8px, transparent 2.7px),
		radial-gradient(circle, rgba(105, 141, 255, .86) 0 1.2px, transparent 2.1px),
		radial-gradient(circle, rgba(255, 210, 168, .82) 0 1px, transparent 1.9px);
	background-position: 0 0, 92px 130px, 180px 48px, 260px 220px, 44px 280px;
	background-size: 150px 150px, 240px 240px, 360px 360px, 520px 520px, 780px 780px;
	opacity: .82;
}

@media (prefers-reduced-motion: no-preference) {
	.mbfx-planet-mars {
		animation: mailbucketPlanetMars 42s ease-in-out infinite alternate;
	}

	.mbfx-planet-blue {
		animation: mailbucketPlanetBlue 36s ease-in-out infinite alternate;
	}

	.mbfx-ringed-planet-a {
		animation: mailbucketRingedPlanet 34s ease-in-out infinite alternate;
	}

	.mbfx-starburst-a {
		animation: mailbucketStarburst 4.6s ease-in-out infinite;
	}

	.mbfx-starburst-b {
		animation: mailbucketStarburst 6.8s ease-in-out infinite;
		animation-delay: -2.5s;
	}

	.mbfx-ship-a {
		animation: mailbucketShipA 18s ease-in-out infinite alternate;
	}

	.mbfx-ship-b {
		animation: mailbucketShipB 24s ease-in-out infinite alternate;
	}

	.mbfx-rocket-a {
		animation: mailbucketRocketA 12s ease-in-out infinite;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfx-planet,
	.mbfx-ringed-planet,
	.mbfx-starburst,
	.mbfx-ship,
	.mbfx-rocket {
		animation: none !important;
	}
}

@keyframes mailbucketPlanetMars {
	0% {
		transform: translate3d(4%, -3%, 0) scale(.94) rotate(-8deg);
	}
	100% {
		transform: translate3d(-8%, 8%, 0) scale(1.06) rotate(7deg);
	}
}

@keyframes mailbucketPlanetBlue {
	0% {
		transform: translate3d(-8%, 8%, 0) scale(.92) rotate(6deg);
	}
	100% {
		transform: translate3d(10%, -9%, 0) scale(1.08) rotate(-8deg);
	}
}

@keyframes mailbucketRingedPlanet {
	0% {
		transform: translate3d(-6%, 4%, 0) rotate(-7deg) scale(.94);
	}
	100% {
		transform: translate3d(9%, -5%, 0) rotate(8deg) scale(1.04);
	}
}

@keyframes mailbucketStarburst {
	0%,
	100% {
		opacity: .24;
		transform: scale(.72) rotate(0deg);
	}
	42% {
		opacity: .72;
		transform: scale(1.08) rotate(10deg);
	}
	58% {
		opacity: .44;
		transform: scale(.92) rotate(17deg);
	}
}

@keyframes mailbucketShipA {
	0% {
		transform: translate3d(38px, -18px, 0) rotate(-16deg);
	}
	100% {
		transform: translate3d(-90px, 44px, 0) rotate(-9deg);
	}
}

@keyframes mailbucketShipB {
	0% {
		transform: translate3d(-22px, 18px, 0) rotate(13deg) scale(.82);
	}
	100% {
		transform: translate3d(118px, -32px, 0) rotate(18deg) scale(.82);
	}
}

@keyframes mailbucketRocketA {
	0%,
	100% {
		opacity: .42;
		transform: translate3d(0, 30px, 0) rotate(20deg);
	}
	45% {
		opacity: .72;
		transform: translate3d(-18px, -36px, 0) rotate(16deg);
	}
	72% {
		opacity: .56;
		transform: translate3d(-8px, -14px, 0) rotate(22deg);
	}
}

/* Studio wordmark pass: code-native marks inspired by the reference sites. */
.mbfx-studio-marks {
	align-items: center;
	display: flex;
	gap: 28px;
	left: 42px;
	position: absolute;
	top: 88px;
	z-index: 4;
}

.mbfx-logo-imagehaus,
.mbfx-logo-henryk {
	align-items: center;
	color: rgba(244, 251, 255, .86);
	display: inline-flex;
	pointer-events: none;
	text-shadow: 0 0 18px rgba(159, 244, 255, .18), 0 10px 28px rgba(0, 0, 0, .78);
}

.mbfx-logo-imagehaus {
	gap: 10px;
}

.mbfx-logo-imagehaus i {
	background: rgba(6, 10, 23, .76);
	border: 1px solid rgba(218, 250, 255, .24);
	border-radius: 8px;
	box-shadow: 0 14px 34px rgba(0, 0, 0, .36), 0 0 28px rgba(87, 220, 255, .16);
	display: inline-block;
	height: 32px;
	position: relative;
	width: 32px;
}

.mbfx-logo-imagehaus i::before,
.mbfx-logo-imagehaus i::after {
	content: "";
	position: absolute;
}

.mbfx-logo-imagehaus i::before {
	border: 2px solid rgba(244, 251, 255, .90);
	border-left-color: transparent;
	border-radius: 50%;
	height: 13px;
	left: 8px;
	top: 8px;
	transform: rotate(35deg);
	width: 13px;
}

.mbfx-logo-imagehaus i::after {
	background:
		radial-gradient(circle at 38% 50%, transparent 0 4px, rgba(244, 251, 255, .90) 4.4px 6px, transparent 6.4px),
		radial-gradient(circle at 64% 50%, transparent 0 4px, rgba(244, 251, 255, .90) 4.4px 6px, transparent 6.4px);
	height: 20px;
	left: 5px;
	top: 6px;
	width: 22px;
}

.mbfx-logo-imagehaus b {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.18rem;
	font-weight: 400;
	letter-spacing: .38em;
	line-height: .9;
}

.mbfx-logo-imagehaus small {
	align-self: flex-end;
	color: rgba(244, 251, 255, .62);
	font-family: Arial, Helvetica, sans-serif;
	font-size: .42rem;
	font-weight: 700;
	letter-spacing: .18em;
	margin-left: -8px;
	padding-bottom: 1px;
}

.mbfx-logo-henryk {
	border-left: 1px solid rgba(244, 251, 255, .28);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.12rem;
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1;
	padding-left: 26px;
}

@media (prefers-reduced-motion: no-preference) {
	.mbfx-studio-marks {
		animation: mailbucketStudioMarksSet 980ms ease-out both;
	}
}

@keyframes mailbucketStudioMarksSet {
	0% {
		opacity: 0;
		transform: translate3d(0, -10px, 0);
	}
	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@media (max-width: 1200px) {
	.mbfx-studio-marks {
		gap: 18px;
		top: 82px;
	}

	.mbfx-logo-imagehaus b {
		font-size: .98rem;
		letter-spacing: .30em;
	}

	.mbfx-logo-henryk {
		font-size: .96rem;
		padding-left: 18px;
	}
}

@media (max-width: 900px) {
	.mbfx-studio-marks {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
		left: 22px;
		top: 62px;
	}

	.mbfx-logo-imagehaus i {
		height: 26px;
		width: 26px;
	}

	.mbfx-logo-imagehaus b {
		font-size: .82rem;
		letter-spacing: .24em;
	}

	.mbfx-logo-imagehaus small {
		display: none;
	}

	.mbfx-logo-henryk {
		border-left: 0;
		font-size: .86rem;
		padding-left: 0;
	}
}

/* White glass pass: keeps the space system but moves the mail login into a clear Gmail-like surface. */
#body-login {
	background-color: #f7faff !important;
	color: #17202a !important;
}

#body-login::after {
	background:
		linear-gradient(90deg, rgba(255, 255, 255, .40), rgba(255, 255, 255, .14) 38%, rgba(232, 240, 254, .28)),
		linear-gradient(180deg, rgba(255, 255, 255, .34), rgba(255, 255, 255, .10) 56%, rgba(232, 240, 254, .36)) !important;
}

#body-login .guest-content {
	color: #17202a !important;
}

#body-login #login,
#body-login #login > div,
#body-login #login form,
#body-login .login-box {
	color: #17202a !important;
}

#body-login #login > div,
#body-login #login form,
#body-login .login-box {
	-webkit-backdrop-filter: blur(28px) saturate(1.34);
	backdrop-filter: blur(28px) saturate(1.34);
	background: rgba(255, 255, 255, .86) !important;
	border: 1px solid rgba(255, 255, 255, .78) !important;
	box-shadow: 0 26px 86px rgba(70, 87, 119, .22), inset 0 1px 0 rgba(255, 255, 255, .86) !important;
}

#body-login #login h1,
#body-login #login h2,
#body-login #login label,
#body-login #login p,
#body-login #login span,
#body-login #login strong {
	color: #17202a !important;
}

#body-login #login a {
	color: #1a73e8 !important;
}

#body-login #login input {
	background: rgba(255, 255, 255, .88) !important;
	border-color: rgba(124, 139, 161, .34) !important;
	color: #17202a !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .80) !important;
}

#body-login #login input::placeholder {
	color: rgba(61, 73, 92, .62) !important;
}

#body-login #login button[type="submit"] {
	background: #1a73e8 !important;
	border-color: #1a73e8 !important;
	color: #fff !important;
}

#body-login #login button[type="submit"]:disabled {
	background: rgba(26, 115, 232, .38) !important;
	border-color: rgba(26, 115, 232, .24) !important;
	color: rgba(255, 255, 255, .86) !important;
}

.mbfx-shell {
	background:
		radial-gradient(circle at 72% 48%, rgba(255, 255, 255, .48) 0 18%, rgba(239, 246, 255, .34) 46%, rgba(246, 249, 255, .22) 100%),
		linear-gradient(90deg, rgba(255, 255, 255, .58), rgba(255, 255, 255, .30) 54%, rgba(229, 240, 255, .30) 100%) !important;
}

.mbfx-brand,
.mbfx-nav-items,
.mbfx-copy,
.mbfx-proof,
.mbfx-footer-line {
	color: #111827 !important;
	text-shadow: 0 1px 24px rgba(255, 255, 255, .70), 0 12px 38px rgba(90, 111, 150, .22) !important;
	opacity: 1 !important;
}

.mbfx-main-title,
.mbfx-main-title span,
.mbfx-copy-line,
.mbfx-nav-link,
.mbfx-footer-item {
	color: #0f172a !important;
	opacity: 1 !important;
	text-shadow: 0 1px 18px rgba(255, 255, 255, .84), 0 14px 34px rgba(50, 76, 126, .22) !important;
}

.mbfx-focus {
	-webkit-backdrop-filter: blur(18px) saturate(1.3);
	backdrop-filter: blur(18px) saturate(1.3);
	background: rgba(255, 255, 255, .58) !important;
	border-color: rgba(17, 24, 39, .34) !important;
	color: #111827 !important;
}

.mbfx-logo-imagehaus,
.mbfx-logo-henryk {
	color: rgba(16, 29, 50, .78) !important;
	text-shadow: 0 1px 18px rgba(255, 255, 255, .88), 0 10px 30px rgba(78, 101, 144, .22) !important;
}

.mbfx-swarm-logo {
	color: rgba(30, 51, 84, .44) !important;
	mix-blend-mode: multiply !important;
	text-shadow: 0 1px 18px rgba(255, 255, 255, .70), 0 10px 28px rgba(30, 64, 120, .16) !important;
}

.mbfx-orbit {
	border-color: rgba(52, 72, 107, .22) !important;
}

.mbfx-orbit-b {
	border-color: rgba(26, 115, 232, .24) !important;
}

.mbfx-envelope-outline,
.mbfx-envelope-outline::before,
.mbfx-envelope-outline::after {
	border-color: rgba(52, 72, 107, .20) !important;
}

.mbfx-routing-line {
	background: rgba(52, 72, 107, .22) !important;
}

.mbfx-routing-line-b {
	background: rgba(26, 115, 232, .28) !important;
}

.mbfx-planet,
.mbfx-ringed-planet,
.mbfx-ship,
.mbfx-rocket {
	opacity: .50 !important;
}

.mbfx-smoke {
	opacity: .22 !important;
}

.mbfx-stars {
	opacity: .28 !important;
}