/* All PNG objects revolve around one ellipse; their artwork stays upright. */
.hos-about-closing {
	--hos-about-parallax: 0;
	--hos-about-orbit-x: 130px;
	--hos-about-orbit-y: 20px;
	--hos-about-orbit-depth: 18px;
}
.hos-about-scene { display: none; }
.hos-about-closing.is-motion-ready .hos-about-scene__fallback { display: none; }
.hos-about-closing.is-motion-ready .hos-about-scene {
	display: block;
	position: relative;
	aspect-ratio: 2 / 1;
	perspective: 800px;
	perspective-origin: 50% 50%;
	overflow: clip;
	pointer-events: none;
	transform-style: preserve-3d;
}
.hos-about-scene__object {
	position: absolute;
	left: 50%;
	top: 50%;
	display: block;
	animation: hos-about-revolve 40s linear infinite paused;
	animation-delay: var(--orbit-phase);
	transform-style: preserve-3d;
}
.hos-about-scene__orbit,
.hos-about-scene__body {
	display: block;
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
}
.hos-about-scene__body img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	user-select: none;
}
.hos-about-closing[data-motion-visible="true"] .hos-about-scene__object { animation-play-state: running; }
.hos-about-scene__object--tree {
	width: 24%; height: 54%;
	--orbit-phase: -20s; --drift-x: -8px; --drift-y: 20px;
}
.hos-about-scene__object--mortar {
	width: 27%; height: 48%;
	--orbit-phase: -10s; --drift-x: 4px; --drift-y: -14px;
}
.hos-about-scene__object--bottle {
	width: 15%; height: 56%;
	--orbit-phase: 0s; --drift-x: 9px; --drift-y: 26px;
}
.hos-about-scene__object--daily {
	width: 30%; height: 45%;
	--orbit-phase: -30s; --drift-x: -5px; --drift-y: 10px;
}
@keyframes hos-about-revolve {
	0% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 1 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0)) scale(1.2); z-index: 100; }
	3.125% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.980785 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.19509 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.19509)) scale(1.239018); z-index: 110; }
	6.25% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.92388 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.382683 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.382683)) scale(1.276537); z-index: 119; }
	9.375% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.83147 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.55557 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.55557)) scale(1.311114); z-index: 128; }
	12.5% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.707107 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.707107 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.707107)) scale(1.341421); z-index: 135; }
	15.625% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.55557 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.83147 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.83147)) scale(1.366294); z-index: 142; }
	18.75% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.382683 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.92388 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.92388)) scale(1.384776); z-index: 146; }
	21.875% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.19509 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.980785 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.980785)) scale(1.396157); z-index: 149; }
	25% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 1 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 1)) scale(1.4); z-index: 150; }
	28.125% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.19509 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.980785 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.980785)) scale(1.396157); z-index: 149; }
	31.25% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.382683 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.92388 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.92388)) scale(1.384776); z-index: 146; }
	34.375% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.55557 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.83147 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.83147)) scale(1.366294); z-index: 142; }
	37.5% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.707107 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.707107 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.707107)) scale(1.341421); z-index: 135; }
	40.625% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.83147 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.55557 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.55557)) scale(1.311114); z-index: 128; }
	43.75% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.92388 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.382683 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.382683)) scale(1.276537); z-index: 119; }
	46.875% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.980785 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0.19509 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0.19509)) scale(1.239018); z-index: 110; }
	50% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -1 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * 0 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * 0)) scale(1.2); z-index: 100; }
	53.125% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.980785 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.19509 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.19509)) scale(1.160982); z-index: 90; }
	56.25% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.92388 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.382683 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.382683)) scale(1.123463); z-index: 81; }
	59.375% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.83147 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.55557 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.55557)) scale(1.088886); z-index: 72; }
	62.5% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.707107 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.707107 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.707107)) scale(1.058579); z-index: 65; }
	65.625% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.55557 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.83147 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.83147)) scale(1.033706); z-index: 58; }
	68.75% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.382683 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.92388 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.92388)) scale(1.015224); z-index: 54; }
	71.875% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0.19509 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.980785 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.980785)) scale(1.003843); z-index: 51; }
	75% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * -0 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -1 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -1)) scale(1); z-index: 50; }
	78.125% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.19509 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.980785 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.980785)) scale(1.003843); z-index: 51; }
	81.25% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.382683 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.92388 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.92388)) scale(1.015224); z-index: 54; }
	84.375% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.55557 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.83147 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.83147)) scale(1.033706); z-index: 58; }
	87.5% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.707107 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.707107 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.707107)) scale(1.058579); z-index: 65; }
	90.625% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.83147 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.55557 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.55557)) scale(1.088886); z-index: 72; }
	93.75% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.92388 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.382683 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.382683)) scale(1.123463); z-index: 81; }
	96.875% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 0.980785 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0.19509 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0.19509)) scale(1.160982); z-index: 90; }
	100% { transform: translate3d(calc(-50% + var(--hos-about-orbit-x) * 1 + var(--hos-about-parallax) * var(--drift-x)), calc(-50% + var(--hos-about-orbit-y) * -0 + var(--hos-about-parallax) * var(--drift-y)), calc(var(--hos-about-orbit-depth) * -0)) scale(1.2); z-index: 100; }
}

.hos-about-closing.is-motion-ready .hos-about-closing__art { touch-action: pan-y; }
@media (hover: hover) and (pointer: fine) {
	.hos-about-closing.is-motion-ready .hos-about-closing__art { cursor: grab; }
}

@media (prefers-reduced-motion: reduce) {
	.hos-about-closing.is-motion-ready .hos-about-scene { display: none; }
	.hos-about-closing.is-motion-ready .hos-about-scene__fallback { display: block; }
	.hos-about-scene__object { transform: none; }
	.hos-about-scene .hos-about-scene__object { animation: none; }
	.hos-about-closing.is-motion-ready .hos-about-closing__art { touch-action: pan-y; }
.hos-about-motion-hint {
	margin: 0 0 var(--hos-3);
	color: var(--hos-night-ink-2);
	font-size: var(--hos-step--1);
}
.hos-about-motion-hint[hidden] { display: none; }
.hos-about-motion-hint__mouse { display: none; }
@media (hover: hover) and (pointer: fine) {
	.hos-about-closing.is-motion-ready .hos-about-closing__art { cursor: grab; }
	.hos-about-motion-hint__mouse { display: inline; }
	.hos-about-motion-hint__touch { display: none; }
}
.hos-about-motion-toggle, .hos-about-motion-hint { display: none; }
}
