.oliver-delivery-page {
	background: #111;
	color: #f4ead8;
	min-height: 100vh;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
}

/* Keep the arcade's vintage terminal type isolated from the shop system. */
.oliver-delivery-page,
.oliver-delivery-page h1,
.oliver-delivery-page h2,
.oliver-delivery-page h3,
.oliver-delivery-page h4,
.oliver-delivery-page h5,
.oliver-delivery-page h6,
.oliver-delivery-page button,
.oliver-delivery-page input,
.oliver-delivery-page select,
.oliver-delivery-page textarea {
	font-family: "Courier New", Courier, monospace !important;
}

.oliver-delivery-page h1,
.oliver-delivery-page h2 {
	color: #fff !important;
	font-weight: 900 !important;
	line-height: 0.94 !important;
}

.oliver-delivery-page,
.oliver-delivery-page * {
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

.oliver-game,
.oliver-game * {
	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}

.oliver-delivery {
	margin: 0 auto;
	max-width: 920px;
	padding: 14px 14px 36px;
}

.oliver-delivery__brand {
	align-items: center;
	display: flex;
	gap: 10px;
	margin: 0 auto 10px;
	max-width: 780px;
}

.oliver-delivery__brand span,
.oliver-delivery__eyebrow,
.oliver-game__label,
.oliver-btn {
	font-family: "Courier New", Courier, monospace;
	letter-spacing: 0;
}

.oliver-delivery__brand > span:not(.oliver-delivery__snowdrop-mark) {
	font-size: 0.9rem;
	font-weight: 900;
}

.oliver-delivery__snowdrop-mark {
	display: block;
	font-size: 4px;
	height: 10em;
	position: relative;
	width: 10em;
}

.oliver-delivery__snowdrop-mark::before,
.oliver-delivery__snowdrop-mark::after {
	content: "";
	display: block;
	height: 1em;
	left: 0;
	position: absolute;
	top: 0;
	width: 1em;
}

.oliver-delivery__snowdrop-mark::before {
	background: transparent;
	box-shadow:
		2em 0 #6aa657, 3em 0 #6aa657,
		2em 1em #4f7a37, 4em 1em #6aa657,
		2em 2em #4f7a37, 5em 2em #6aa657,
		2em 3em #4f7a37, 5em 3em #4f7a37,
		1em 4em #6aa657, 2em 4em #4f7a37, 5em 4em #4f7a37, 6em 4em #6aa657,
		1em 5em #6aa657, 2em 5em #4f7a37,
		0 6em #4f7a37, 2em 6em #4f7a37,
		2em 7em #4f7a37;
}

.oliver-delivery__snowdrop-mark::after {
	background: transparent;
	box-shadow:
		5em 3em #f4ead8, 7em 3em #f4ead8,
		4em 4em #fff7e8, 6em 4em #111, 8em 4em #fff7e8,
		4em 5em #f4ead8, 6em 5em #f4ead8, 8em 5em #f4ead8,
		5em 6em #eef4e8, 6em 6em #111, 7em 6em #eef4e8,
		6em 7em #f4ead8;
}

.oliver-delivery__shell {
	background: #171717;
	border: 4px solid #f4ead8;
	box-shadow: 0 0 0 4px #111, 0 0 0 8px #2e6b5e;
	margin: 0 auto;
	max-width: 780px;
	overflow: visible;
}

.oliver-delivery__intro {
	align-items: center;
	display: grid;
	gap: 18px;
	grid-template-columns: minmax(0, 1fr) 220px;
	min-height: min(70vh, 520px);
	padding: clamp(18px, 4vw, 34px);
}

.oliver-delivery__story {
	max-width: 500px;
}

.oliver-delivery__eyebrow {
	color: #9ed3ff;
	font-size: 0.8rem;
	font-weight: 900;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.oliver-delivery h1,
.oliver-result h2 {
	color: #fff;
	font-family: "Courier New", Courier, monospace;
	font-size: clamp(2rem, 7vw, 4.2rem);
	font-weight: 900;
	line-height: 0.94;
	margin: 0 0 14px;
	text-transform: uppercase;
}

.oliver-delivery p {
	font-size: clamp(1rem, 2vw, 1.14rem);
	font-weight: 800;
	line-height: 1.42;
	margin: 0 0 12px;
}

.oliver-delivery__note {
	background: #111;
	border: 2px solid #9ed3ff;
	color: #f4ead8;
	display: inline-block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.95rem;
	font-weight: 900;
	padding: 10px;
}

.oliver-delivery__actions,
.oliver-result__actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 4px;
}

.oliver-delivery__hero {
	align-items: center;
	display: flex;
	justify-content: center;
	min-height: 230px;
}

.oliver-delivery__hero-sprite {
	--p: 8px;
	filter: drop-shadow(0 12px 0 rgba(0, 0, 0, 0.25));
	transform: translateY(10px);
}

.oliver-btn {
	appearance: none;
	background: #111;
	border: 3px solid #f4ead8;
	border-radius: 0;
	color: #f4ead8;
	cursor: pointer;
	display: inline-flex;
	font-size: 0.95rem;
	font-weight: 900;
	justify-content: center;
	line-height: 1;
	min-height: 44px;
	padding: 12px 18px;
	text-decoration: none;
	touch-action: manipulation;
	text-transform: uppercase;
}

.oliver-btn:hover,
.oliver-btn:focus-visible {
	background: #9ed3ff;
	color: #111;
	outline: 0;
}

.oliver-btn--primary {
	background: #9ed3ff;
	color: #111;
}

.oliver-btn--sound {
	background: #171717;
	font-size: 0.82rem;
	min-height: 40px;
	padding: 10px 14px;
}

.oliver-btn--sound.is-on {
	background: #2e6b5e;
	color: #f4ead8;
}

.oliver-game,
.oliver-result {
	padding: clamp(10px, 2vw, 18px);
}

.oliver-game__topbar {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-bottom: 10px;
}

.oliver-game__topbar > div {
	background: #111;
	border: 2px solid #f4ead8;
	min-width: 0;
	padding: 8px;
}

.oliver-game__label {
	color: #9ed3ff;
	display: block;
	font-size: 0.66rem;
	font-weight: 900;
	text-transform: uppercase;
}

.oliver-game__topbar strong {
	color: #f4ead8;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: clamp(0.95rem, 3vw, 1.25rem);
	line-height: 1;
	margin-top: 4px;
}

.oliver-game__rules {
	background: #111;
	border: 3px solid #9ed3ff;
	box-shadow: 0 0 0 3px #2e6b5e;
	color: #f4ead8;
	font-family: "Courier New", Courier, monospace;
	font-weight: 900;
	margin: 0 0 12px;
	padding: 10px 12px;
}

.oliver-game__rules strong,
.oliver-game__rules span {
	display: block;
}

.oliver-game__rules strong {
	color: #9ed3ff;
	text-transform: uppercase;
}

.oliver-game__rules span {
	font-size: clamp(0.82rem, 2vw, 0.98rem);
	line-height: 1.35;
	margin-top: 6px;
}

.oliver-game__board {
	background: #142033;
	border: 4px solid #f4ead8;
	box-shadow: inset 0 0 0 4px #111;
	height: min(68vh, 560px);
	min-height: 500px;
	overflow: hidden;
	position: relative;
}

.oliver-game__message {
	background: #111;
	border: 3px solid #d8b85a;
	color: #f4ead8;
	font-family: "Courier New", Courier, monospace;
	font-weight: 900;
	left: 50%;
	max-width: calc(100% - 28px);
	padding: 8px 12px;
	position: absolute;
	text-align: center;
	top: 14px;
	transform: translateX(-50%);
	width: min(380px, calc(100% - 28px));
	z-index: 30;
}

.oliver-game__message.is-compact {
	left: 12px;
	max-width: min(220px, calc(100% - 24px));
	padding: 6px 8px;
	text-align: left;
	top: 12px;
	transform: none;
	width: auto;
}

.oliver-game__message strong,
.oliver-game__message span {
	display: block;
}

.oliver-game__message span {
	color: #9ed3ff;
	font-size: 0.82rem;
	margin-top: 4px;
}

.oliver-game__message.is-compact span {
	font-size: 0.68rem;
	line-height: 1.15;
}

.oliver-game__message.is-good {
	border-color: #63b46d;
	color: #d8b85a;
}

.oliver-game__message.is-bad {
	border-color: #f0a090;
	color: #f0a090;
}

.oliver-sky {
	background:
		radial-gradient(circle at 14% 17%, rgba(244, 234, 216, 0.95) 0 14px, transparent 15px),
		radial-gradient(circle at 73% 18%, rgba(244, 234, 216, 0.5) 0 2px, transparent 3px),
		radial-gradient(circle at 58% 31%, rgba(216, 184, 90, 0.45) 0 2px, transparent 3px),
		linear-gradient(180deg, transparent 0 62%, rgba(158, 211, 255, 0.2) 62% 63%, transparent 63% 68%, #48745f 68% 75%, #2e6b5e 75% 82%, #20302d 82% 100%),
		linear-gradient(180deg, #172948 0%, #223e60 42%, #7fb9e7 63%, #9ed3ff 68%, #20302d 100%);
	height: 100%;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.oliver-sky::before {
	background:
		repeating-linear-gradient(90deg, transparent 0 30px, rgba(244, 234, 216, 0.28) 30px 36px, transparent 36px 72px),
		linear-gradient(90deg, rgba(244, 234, 216, 0.08) 0 2px, transparent 2px 100%),
		linear-gradient(180deg, rgba(244, 234, 216, 0.08) 0 2px, transparent 2px 100%);
	background-position: 0 38%, 0 0, 0 0;
	background-size: 96px 6px, 42px 42px, 42px 42px;
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.oliver-sky::after {
	background:
		linear-gradient(90deg, #111 0 6%, transparent 6% 100%),
		linear-gradient(180deg, transparent 0 18%, rgba(244, 234, 216, 0.14) 18% 23%, transparent 23% 100%),
		repeating-linear-gradient(90deg, #314640 0 30px, #d8b85a 30px 34px, #3f4f49 34px 72px, #2e6b5e 72px 96px, #3f4f49 96px 154px);
	border-top: 4px solid #111;
	bottom: 0;
	content: "";
	height: 58px;
	left: 0;
	position: absolute;
	right: 0;
	z-index: 3;
}

.oliver-sky.is-cloud-drifting {
	filter: saturate(1.05);
}

.oliver-sky.is-storm-locked {
	animation: oliverSkyStorm 220ms steps(2, end) infinite;
}

.oliver-sky-sign {
	background: rgba(17, 17, 17, 0.74);
	border: 2px solid rgba(244, 234, 216, 0.72);
	color: #d8b85a;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.72rem;
	font-weight: 900;
	left: 8%;
	padding: 5px 8px;
	position: absolute;
	text-transform: uppercase;
	top: 78%;
	z-index: 4;
}

.oliver-sky.is-boarding::after,
.oliver-sky.is-taking-off::after {
	background:
		linear-gradient(90deg, #111 0 6%, transparent 6% 100%),
		repeating-linear-gradient(90deg, #111 0 46px, #f4ead8 46px 70px, #111 70px 126px),
		linear-gradient(180deg, #3f4f49 0 50%, #20302d 50% 100%);
	height: 78px;
}

.oliver-cloud {
	background: #f4ead8;
	box-shadow:
		18px -8px #fff,
		42px 0 #f4ead8,
		66px -6px #fff,
		90px 0 #f4ead8;
	display: block;
	height: 18px;
	position: absolute;
	width: 38px;
	z-index: 2;
}

.oliver-cloud--one {
	animation: oliverCloudDrift 22s linear infinite;
	left: 8%;
	top: 19%;
}

.oliver-cloud--two {
	animation: oliverCloudDrift 28s linear infinite reverse;
	left: 62%;
	opacity: 0.72;
	top: 34%;
	transform: scale(0.75);
}

.oliver-plane {
	--plane-scale: 1;
	--plane-y: 23%;
	animation: oliverPlaneBob 980ms steps(2, end) infinite;
	height: 116px;
	left: 20%;
	position: absolute;
	top: var(--plane-y);
	transition: top 120ms linear, left 640ms steps(5, end);
	width: 290px;
	z-index: 18;
	transform-origin: left top;
}

.oliver-plane.is-boarding {
	--plane-scale: 1.34;
	animation: oliverPlaneBoarding 620ms steps(2, end) infinite;
	left: 5%;
	z-index: 24;
}

.oliver-plane.is-taking-off {
	--plane-scale: 0.72;
	animation: oliverPlaneTakeoff 920ms steps(5, end) 1, oliverPlaneBob 980ms steps(2, end) 920ms infinite;
	left: 20%;
	transition: top 1500ms steps(8, end), left 1500ms steps(8, end);
}

.oliver-plane.is-flying {
	--plane-scale: 0.52;
}

.oliver-plane.is-hit {
	animation: oliverPlaneHit 360ms steps(2, end) 1, oliverPlaneBob 980ms steps(2, end) 360ms infinite;
	filter: drop-shadow(0 0 10px rgba(124, 47, 36, 0.74));
}

.oliver-plane.is-cloud-drifting {
	animation: oliverPlaneSpinDrift 1020ms steps(6, end) 1;
}

.oliver-plane.is-storm-locked {
	animation: oliverPlaneStormLock 1900ms steps(8, end) 1;
	filter: drop-shadow(0 0 14px rgba(216, 184, 90, 0.68)) drop-shadow(0 0 10px rgba(124, 47, 36, 0.64));
}

.oliver-plane::before {
	background: rgba(244, 234, 216, 0.72);
	box-shadow:
		-24px 7px rgba(158, 211, 255, 0.55),
		-48px 0 rgba(244, 234, 216, 0.42),
		-72px 7px rgba(216, 184, 90, 0.36);
	content: "";
	height: 5px;
	left: 0;
	position: absolute;
	top: 66px;
	width: 14px;
}

.oliver-plane::after {
	background: #111;
	box-shadow:
		88px 16px #111,
		94px 16px #111,
		146px 17px #111,
		152px 17px #111,
		91px 12px #d6cab8,
		149px 13px #d6cab8;
	content: "";
	height: 5px;
	left: 34px;
	position: absolute;
	top: 86px;
	width: 5px;
	z-index: 2;
}

.oliver-plane__banner {
	display: none;
}

.oliver-plane__body,
.oliver-plane__wing,
.oliver-plane__tail,
.oliver-plane__propeller,
.oliver-plane__oliver,
.oliver-plane__coco {
	display: block;
	position: absolute;
}

.oliver-plane__body {
	background: linear-gradient(180deg, #fff7e8 0 54%, #f4ead8 54% 100%);
	border: 4px solid #111;
	box-shadow:
		inset 0 0 0 5px #9ed3ff,
		inset 20px 0 0 rgba(216, 184, 90, 0.18),
		inset 0 -7px 0 #d6cab8,
		62px 0 0 #f4ead8,
		62px 0 0 4px #111,
		114px 10px 0 -4px #f4ead8,
		114px 10px 0 0 #111;
	height: 46px;
	left: 46px;
	position: absolute;
	top: 44px;
	width: 134px;
	z-index: 3;
}

.oliver-plane__body::before {
	background: #0b1118;
	box-shadow:
		inset 2px 2px 0 #9ed3ff,
		24px 0 #0b1118,
		26px 2px 0 -1px #9ed3ff,
		48px 0 #0b1118,
		50px 2px 0 -1px #9ed3ff,
		72px 0 #0b1118,
		74px 2px 0 -1px #9ed3ff;
	content: "";
	height: 9px;
	left: 18px;
	position: absolute;
	top: 12px;
	width: 10px;
}

.oliver-plane__body::after {
	color: rgba(46, 107, 94, 0.62);
	content: "SNOWDROP GIFT PLANE";
	font-family: "Courier New", Courier, monospace;
	font-size: 5.2px;
	font-weight: 900;
	left: 12px;
	letter-spacing: 0;
	line-height: 1;
	position: absolute;
	text-shadow: 1px 1px 0 rgba(244, 234, 216, 0.72);
	text-transform: uppercase;
	top: 30px;
	white-space: nowrap;
	z-index: 1;
}

.oliver-plane__wing {
	background: linear-gradient(90deg, #2e6b5e 0 46%, #9ed3ff 46% 56%, #d8b85a 56% 68%, #2e6b5e 68% 100%);
	border: 4px solid #111;
	box-shadow:
		inset 0 -5px 0 #20302d,
		inset 16px 0 0 rgba(244, 234, 216, 0.18),
		16px 13px 0 -8px rgba(0, 0, 0, 0.4);
	height: 24px;
	left: 96px;
	top: 72px;
	transform: skewX(-18deg);
	width: 98px;
	z-index: 5;
}

.oliver-plane__tail {
	background: linear-gradient(180deg, #d8b85a 0 38%, #9ed3ff 38% 52%, #2e6b5e 52% 100%);
	border: 4px solid #111;
	height: 46px;
	left: 18px;
	top: 28px;
	transform: skewY(-14deg);
	width: 46px;
	z-index: 2;
}

.oliver-plane__propeller {
	animation: oliverPropeller 160ms steps(2, end) infinite;
	background: #111;
	height: 8px;
	left: 214px;
	top: 62px;
	width: 46px;
	z-index: 6;
}

.oliver-plane__propeller::before {
	background: #111;
	content: "";
	height: 46px;
	left: 19px;
	position: absolute;
	top: -19px;
	width: 8px;
}

.oliver-plane__oliver {
	background: #f6ead8;
	box-shadow:
		-10px -4px #8a6a58,
		-10px 2px #6a4c3c,
		8px -5px #8a6a58,
		8px 1px #6a4c3c,
		0 7px #fff7e8,
		-6px 12px #9ed3ff,
		0 12px #9ed3ff,
		6px 12px #9ed3ff,
		-6px 16px #2e6b5e,
		6px 16px #2e6b5e;
	height: 14px;
	left: 86px;
	top: 32px;
	width: 14px;
	z-index: 4;
}

.oliver-plane__oliver.hoppy-cameo__sprite {
	--p: 3.45px;
	background: transparent;
	box-shadow: none;
	height: 16em;
	left: 70px;
	overflow: visible;
	top: 7px;
	width: 13em;
	z-index: 6;
}

.oliver-plane.is-boarding .oliver-plane__oliver.hoppy-cameo__sprite {
	--p: 4.3px;
	left: 68px;
	top: -1px;
}

.oliver-plane__oliver.hoppy-cameo__sprite::before,
.oliver-plane__oliver.hoppy-cameo__sprite::after {
	display: block;
}

.oliver-plane__oliver.hoppy-cameo__sprite--oliver .hoppy-cameo__detail {
	filter: brightness(1.06);
}

.oliver-plane__oliver.hoppy-cameo__sprite--oliver .hoppy-cameo__detail::before {
	background: #111;
	box-shadow:
		4.2em 0 #111,
		1.92em 1.18em #111,
		2.18em 1.18em #111,
		2.05em 1.56em #111,
		1.8em 2.1em #111,
		2.34em 2.1em #111;
}

.oliver-plane__oliver.hoppy-cameo__sprite--oliver .hoppy-cameo__detail::after {
	background: #efe4d1;
	box-shadow:
		3.25em 0 #efe4d1,
		1.24em 0.42em #fff8ec,
		1.66em 0.58em #fff8ec,
		2.08em 0.64em #fff8ec,
		2.5em 0.58em #fff8ec,
		2.92em 0.42em #fff8ec,
		1.1em 1.25em #efe4d1,
		1.48em 1.52em #fff8ec,
		2.08em 1.72em #efe4d1,
		2.68em 1.52em #fff8ec,
		3.08em 1.25em #efe4d1;
}

.oliver-plane__oliver:not(.hoppy-cameo__sprite)::before {
	background: #111;
	box-shadow:
		8px 0 #111,
		4px 5px #111,
		1px 8px #dc8e98,
		7px 8px #dc8e98;
	content: "";
	height: 2px;
	left: 2px;
	position: absolute;
	top: 4px;
	width: 2px;
}

.oliver-plane__oliver:not(.hoppy-cameo__sprite)::after {
	background: #111;
	box-shadow:
		-3px 3px #fff7e8,
		3px 3px #fff7e8,
		0 6px #111;
	content: "";
	height: 3px;
	left: 5px;
	position: absolute;
	top: 8px;
	width: 4px;
}

.oliver-plane.is-boarding .oliver-plane__oliver,
.oliver-plane.is-boarding .oliver-plane__coco {
	animation: oliverBoardHop 420ms steps(2, end) infinite;
}

.oliver-plane.is-cheering .oliver-plane__oliver,
.oliver-plane.is-cheering .oliver-plane__coco {
	animation: oliverCabinCheer 260ms steps(2, end) 4;
}

.oliver-plane.is-cheering .oliver-plane__coco {
	animation-delay: 80ms;
}

.oliver-plane__coco {
	background: #eadcc4;
	box-shadow:
		2em 0 #d8c4a4, 3em 0 #d8c4a4, 10em 0 #d8c4a4, 11em 0 #d8c4a4,
		1em 1em #d8c4a4, 2em 1em #d8c4a4, 3em 1em #d8c4a4, 4em 1em #eadcc4, 5em 1em #eadcc4, 6em 1em #eadcc4, 7em 1em #eadcc4, 8em 1em #eadcc4, 9em 1em #eadcc4, 10em 1em #d8c4a4, 11em 1em #d8c4a4, 12em 1em #d8c4a4,
		1em 2em #d8c4a4, 2em 2em #eadcc4, 3em 2em #eadcc4, 4em 2em #eadcc4, 5em 2em #f4ead8, 6em 2em #f4ead8, 7em 2em #f4ead8, 8em 2em #f4ead8, 9em 2em #eadcc4, 10em 2em #eadcc4, 11em 2em #eadcc4, 12em 2em #d8c4a4,
		0 3em #d8c4a4, 1em 3em #eadcc4, 2em 3em #eadcc4, 3em 3em #f4ead8, 4em 3em #f4ead8, 5em 3em #f4ead8, 6em 3em #f4ead8, 7em 3em #f4ead8, 8em 3em #f4ead8, 9em 3em #f4ead8, 10em 3em #f4ead8, 11em 3em #eadcc4, 12em 3em #eadcc4, 13em 3em #d8c4a4,
		0 4em #d8c4a4, 1em 4em #eadcc4, 2em 4em #f4ead8, 3em 4em #f4ead8, 4em 4em #f4ead8, 5em 4em #f4ead8, 6em 4em #f4ead8, 7em 4em #f4ead8, 8em 4em #f4ead8, 9em 4em #f4ead8, 10em 4em #f4ead8, 11em 4em #f4ead8, 12em 4em #eadcc4, 13em 4em #d8c4a4,
		0 5em #d8c4a4, 1em 5em #eadcc4, 2em 5em #f4ead8, 3em 5em #f4ead8, 4em 5em #fff3de, 5em 5em #fff3de, 6em 5em #fff3de, 7em 5em #fff3de, 8em 5em #fff3de, 9em 5em #fff3de, 10em 5em #f4ead8, 11em 5em #f4ead8, 12em 5em #eadcc4, 13em 5em #d8c4a4,
		1em 6em #d8c4a4, 2em 6em #eadcc4, 3em 6em #f4ead8, 4em 6em #fff3de, 5em 6em #fff3de, 6em 6em #fff3de, 7em 6em #fff3de, 8em 6em #fff3de, 9em 6em #fff3de, 10em 6em #f4ead8, 11em 6em #eadcc4, 12em 6em #d8c4a4,
		1em 7em #d8c4a4, 2em 7em #eadcc4, 3em 7em #f4ead8, 4em 7em #fff3de, 5em 7em #fff3de, 6em 7em #fff3de, 7em 7em #fff3de, 8em 7em #fff3de, 9em 7em #fff3de, 10em 7em #f4ead8, 11em 7em #eadcc4, 12em 7em #d8c4a4,
		2em 8em #d8c4a4, 3em 8em #eadcc4, 4em 8em #f4ead8, 5em 8em #fff3de, 6em 8em #fff3de, 7em 8em #fff3de, 8em 8em #fff3de, 9em 8em #f4ead8, 10em 8em #eadcc4, 11em 8em #d8c4a4,
		3em 9em #d8c4a4, 4em 9em #eadcc4, 5em 9em #f4ead8, 6em 9em #f4ead8, 7em 9em #f4ead8, 8em 9em #f4ead8, 9em 9em #eadcc4, 10em 9em #d8c4a4,
		4em 10em #eadcc4, 5em 10em #eadcc4, 6em 10em #d8a25f, 7em 10em #d8a25f, 8em 10em #eadcc4, 9em 10em #eadcc4,
		3em 11em #d8c4a4, 4em 11em #eadcc4, 5em 11em #eadcc4, 6em 11em #c58a45, 7em 11em #d8a25f, 8em 11em #d8a25f, 9em 11em #eadcc4, 10em 11em #d8c4a4,
		2em 12em #d8c4a4, 3em 12em #eadcc4, 4em 12em #eadcc4, 5em 12em #eadcc4, 6em 12em #d8a25f, 7em 12em #c58a45, 8em 12em #d8a25f, 9em 12em #eadcc4, 10em 12em #eadcc4, 11em 12em #d8c4a4,
		2em 13em #d8c4a4, 3em 13em #eadcc4, 4em 13em #f4ead8, 5em 13em #eadcc4, 6em 13em #eadcc4, 7em 13em #c58a45, 8em 13em #d8a25f, 9em 13em #eadcc4, 10em 13em #f4ead8, 11em 13em #d8c4a4,
		3em 14em #d8c4a4, 4em 14em #f4ead8, 5em 14em #f4ead8, 8em 14em #d8a25f, 9em 14em #f4ead8, 10em 14em #f4ead8, 11em 14em #d8c4a4,
		4em 15em #f4ead8, 5em 15em #f4ead8, 8em 15em #c58a45, 9em 15em #f4ead8, 10em 15em #f4ead8;
	font-size: 3.18px;
	height: 1em;
	left: 124px;
	top: 8px;
	width: 1em;
	z-index: 6;
}

.oliver-plane__coco::before {
	background: #111;
	box-shadow:
		6em 0 #111,
		2.65em 2.05em #8a5142,
		3.65em 2.05em #8a5142,
		3.15em 3.08em #5b332f,
		2.65em 4.1em #5b332f,
		3.65em 4.1em #5b332f;
	content: "";
	height: 1em;
	left: 4em;
	position: absolute;
	top: 4.5em;
	width: 1em;
}

.oliver-plane__coco::after {
	background: #d8a25f;
	box-shadow:
		1em 0 #c58a45,
		2em 0 #d8a25f,
		3em 0 #e2b36f,
		4em 1em #c58a45,
		5em 1em #d8a25f,
		4em 2em #d8a25f,
		5em 2em #c58a45,
		4em 3em #c58a45,
		5em 3em #d8a25f,
		4em 4em #d8a25f,
		4em 5em #c58a45;
	content: "";
	height: 1em;
	left: 6em;
	position: absolute;
	top: 10em;
	width: 1em;
}

.oliver-distance-plane {
	animation: oliverDistancePlane 60s linear infinite;
	background: #f4ead8;
	border: 2px solid #111;
	color: #111;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.76rem;
	font-weight: 900;
	height: 22px;
	line-height: 1;
	opacity: 0;
	padding: 4px 7px;
	position: absolute;
	text-transform: uppercase;
	top: 12%;
	transform: translateX(120%);
	white-space: nowrap;
	width: max-content;
	z-index: 5;
}

.oliver-distance-plane::before {
	background: #d8b85a;
	box-shadow:
		8px 0 #d8b85a,
		16px 0 #f4ead8,
		12px -5px #9ed3ff,
		20px 5px #9ed3ff;
	content: "";
	height: 7px;
	left: -30px;
	position: absolute;
	top: 7px;
	width: 7px;
}

.oliver-airspace,
.oliver-parties,
.oliver-sky-objects {
	inset: 0;
	position: absolute;
}

.oliver-airspace {
	z-index: 20;
}

.oliver-sky-objects {
	z-index: 19;
}

.oliver-parties {
	z-index: 12;
}

.oliver-sky-object {
	height: 42px;
	left: var(--x);
	position: absolute;
	top: var(--y);
	transform: translate(-50%, -50%);
	width: 62px;
}

.oliver-sky-object.is-planned {
	opacity: 0.96;
}

.oliver-sky-object.is-entering {
	filter: saturate(0.86) brightness(1.04);
	opacity: 0.78;
}

.oliver-sky-object::before,
.oliver-sky-object::after {
	content: "";
	display: block;
	position: absolute;
}

.oliver-sky-object--cloud::before {
	background: #f4ead8;
	box-shadow:
		16px -8px #fff,
		34px 0 #f4ead8,
		52px -6px #fff,
		20px 9px rgba(158, 211, 255, 0.7),
		44px 9px rgba(158, 211, 255, 0.52),
		18px 22px rgba(244, 234, 216, 0.42),
		46px 22px rgba(244, 234, 216, 0.32);
	height: 15px;
	left: 4px;
	top: 16px;
	width: 28px;
}

.oliver-sky-object--cloud::after {
	background: rgba(158, 211, 255, 0.82);
	box-shadow:
		8px 6px rgba(158, 211, 255, 0.58),
		16px 12px rgba(158, 211, 255, 0.36);
	height: 4px;
	left: 23px;
	top: 34px;
	width: 4px;
}

.oliver-sky-object--storm::before {
	animation: oliverStormPulse 360ms steps(2, end) infinite;
	background: #2d3438;
	box-shadow:
		14px -6px #4d555a,
		30px 0 #2d3438,
		46px -5px #4d555a,
		10px 12px #1f272a,
		32px 13px #1f272a;
	height: 18px;
	left: 1px;
	top: 6px;
	width: 26px;
}

.oliver-sky-object--storm::after {
	background: #d8b85a;
	box-shadow:
		8px 8px #d8b85a,
		0 16px #d8b85a,
		8px 24px #d8b85a;
	height: 8px;
	left: 26px;
	top: 24px;
	width: 8px;
}

.oliver-sky-object.is-hit {
	filter: brightness(1.25) drop-shadow(0 0 8px rgba(124, 47, 36, 0.82));
}

.oliver-gift-drop {
	height: 26px;
	left: var(--x);
	position: absolute;
	top: var(--y);
	transform: translate(-50%, -50%);
	width: 26px;
	z-index: 22;
}

.oliver-gift-drop::before {
	background: #d8b85a;
	box-shadow:
		-8px 0 #d8b85a,
		8px 0 #d8b85a,
		0 -8px #f4ead8,
		-8px -8px #f4ead8,
		8px -8px #f4ead8,
		0 8px #7c2f24,
		-8px 8px #7c2f24,
		8px 8px #7c2f24;
	content: "";
	display: block;
	height: 8px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 8px;
}

.oliver-gift-drop__tag {
	background: #f4ead8;
	border: 1px solid #111;
	color: #2e6b5e;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 5px;
	font-weight: 900;
	left: 50%;
	line-height: 1;
	padding: 1px 2px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}

.oliver-gift-drop.is-missed {
	filter: grayscale(1) brightness(0.7);
}

.oliver-gift-drop.is-shaken {
	filter: drop-shadow(0 0 9px rgba(124, 47, 36, 0.74));
}

.oliver-gift-drop.is-shaken::after {
	background: rgba(244, 234, 216, 0.86);
	box-shadow:
		-7px 5px rgba(216, 184, 90, 0.66),
		-14px 10px rgba(124, 47, 36, 0.42);
	content: "";
	height: 3px;
	left: -10px;
	position: absolute;
	top: 14px;
	width: 10px;
}

.oliver-party {
	height: 132px;
	left: var(--x);
	position: absolute;
	bottom: 34px;
	transform: translateX(-50%) scale(var(--party-scale, 1));
	transform-origin: center bottom;
	width: 138px;
	z-index: 13;
}

.oliver-party__name {
	background: #111;
	border: 2px solid #f4ead8;
	color: #f4ead8;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.62rem;
	font-weight: 900;
	left: 50%;
	padding: 4px 6px;
	position: absolute;
	text-transform: uppercase;
	top: 0;
	transform: translateX(-50%);
	white-space: nowrap;
}

.oliver-party::before {
	background:
		linear-gradient(90deg, transparent 0 45%, #d8b85a 45% 55%, transparent 55% 100%),
		linear-gradient(180deg, #fff7e8 0 48%, #f4ead8 48% 100%);
	border: 3px solid #111;
	box-shadow:
		inset 0 0 0 4px #d8b85a,
		-24px 18px 0 -8px #111,
		24px 18px 0 -8px #111,
		0 -16px 0 -8px #f0a090,
		0 -16px 0 -5px #111;
	content: "";
	height: 34px;
	left: 38px;
	position: absolute;
	top: 58px;
	width: 62px;
}

.oliver-party__garland {
	background: #7c2f24;
	box-shadow:
		10px 0 #d8b85a,
		20px 0 #7c2f24,
		30px 0 #d8b85a,
		40px 0 #7c2f24,
		50px 0 #d8b85a,
		60px 0 #7c2f24,
		70px 0 #d8b85a,
		80px 0 #7c2f24;
	display: block;
	height: 10px;
	left: 24px;
	position: absolute;
	top: 42px;
	width: 10px;
}

.oliver-party::after {
	background: rgba(216, 184, 90, 0.18);
	border: 2px dashed rgba(216, 184, 90, 0.82);
	bottom: 4px;
	content: "";
	height: 28px;
	left: 30px;
	position: absolute;
	width: 78px;
	z-index: -1;
}

.oliver-party__mat {
	background: #111;
	border: 2px solid #2e6b5e;
	bottom: 9px;
	color: #d8b85a;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.42rem;
	font-weight: 900;
	left: 29px;
	line-height: 1;
	padding: 3px 4px;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	width: 80px;
}

.oliver-party__cake {
	background: #fff7e8;
	border: 2px solid #111;
	box-shadow:
		inset 0 -5px 0 #f0a090,
		6px -8px 0 -3px #d8b85a,
		6px -11px 0 -5px #f4ead8,
		18px -8px 0 -3px #d8b85a,
		18px -11px 0 -5px #f4ead8;
	display: block;
	height: 18px;
	left: 56px;
	position: absolute;
	top: 69px;
	width: 28px;
}

.oliver-party__child {
	background: #f4c7a2;
	box-shadow:
		0 9px #2e6b5e,
		0 18px #20302d,
		-5px 3px #111,
		5px 3px #111;
	display: block;
	height: 10px;
	position: absolute;
	top: 86px;
	width: 10px;
}

.oliver-party__child::before {
	background: #111;
	box-shadow:
		5px 0 #111,
		2.5px 4px #dc8e98;
	content: "";
	height: 2px;
	left: 2px;
	position: absolute;
	top: 3px;
	width: 2px;
}

.oliver-party__balloon {
	background: #9ed3ff;
	border: 2px solid #111;
	box-shadow:
		12px 8px #d8b85a,
		24px 0 #f0a090;
	display: block;
	height: 16px;
	left: 20px;
	position: absolute;
	top: 24px;
	width: 12px;
}

.oliver-party__balloon::before,
.oliver-party__balloon::after {
	background: #111;
	content: "";
	height: 24px;
	position: absolute;
	top: 14px;
	width: 2px;
}

.oliver-party__balloon::before {
	left: 4px;
}

.oliver-party__balloon::after {
	left: 28px;
}

.oliver-party__child--one {
	left: 8px;
}

.oliver-party__child--two {
	background: #d6a67f;
	left: 112px;
}

.oliver-party__child--three {
	background: #f0b894;
	left: 64px;
	top: 102px;
}

.oliver-party.is-cheering .oliver-party__child {
	animation: oliverChildCheer 300ms steps(2, end) 4;
}

.oliver-party.is-cheering .oliver-party__child::before,
.oliver-party.is-cheering .oliver-party__child::after {
	background: #111;
	content: "";
	height: 11px;
	position: absolute;
	top: -8px;
	width: 3px;
}

.oliver-party.is-cheering .oliver-party__child::before {
	left: -5px;
	transform: rotate(-18deg);
}

.oliver-party.is-cheering .oliver-party__child::after {
	right: -5px;
	transform: rotate(18deg);
}

.oliver-party__cheer {
	background: #111;
	border: 2px solid #d8b85a;
	color: #d8b85a;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 0.72rem;
	font-weight: 900;
	left: 50%;
	opacity: 0;
	padding: 5px 7px;
	position: absolute;
	text-transform: uppercase;
	top: 4px;
	transform: translate(-50%, 8px);
	white-space: nowrap;
}

.oliver-party.is-cheering .oliver-party__cheer {
	animation: oliverCheerPop 760ms steps(3, end) 1;
}

.oliver-party__spark {
	background: #d8b85a;
	display: block;
	height: 5px;
	opacity: 0;
	position: absolute;
	width: 5px;
}

.oliver-party__spark--one {
	left: 36px;
	top: 58px;
}

.oliver-party__spark--two {
	left: 98px;
	top: 66px;
}

.oliver-party.is-cheering .oliver-party__spark {
	animation: oliverPartySpark 540ms steps(3, end) 2;
}

.oliver-party.is-warning {
	filter: drop-shadow(0 0 10px rgba(216, 184, 90, 0.58));
}

.oliver-game__controls {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.35fr) minmax(0, 0.7fr);
	margin-top: 12px;
}

.oliver-btn--fly {
	background: #171717;
	min-width: 0;
	padding: 12px 8px;
}

.oliver-btn--fly.is-disabled,
.oliver-btn--fly:disabled {
	background: #242424;
	color: #7f8f8a;
	cursor: default;
}

.oliver-btn--drop {
	background: #d8b85a;
	border-color: #f4ead8;
	color: #111;
	font-size: clamp(1rem, 3vw, 1.35rem);
	min-height: 54px;
}

.oliver-btn--drop.is-disabled,
.oliver-btn--drop:disabled {
	background: #3f4f49;
	color: #d6cab8;
	cursor: default;
}

.oliver-btn--drop:active {
	transform: translateY(2px);
}

.oliver-result {
	min-height: min(70vh, 520px);
	padding: clamp(18px, 4vw, 34px);
}

.oliver-result__reward {
	background: #111;
	border: 3px solid #9ed3ff;
	color: #f4ead8;
	font-family: "Courier New", Courier, monospace;
	font-size: clamp(1.1rem, 4vw, 2rem);
	font-weight: 900;
	margin: 14px 0;
	padding: 14px;
	text-transform: uppercase;
}

.oliver-result__reward.is-winner {
	border-color: #d8b85a;
	box-shadow: 0 0 0 3px #111, 0 0 16px rgba(216, 184, 90, 0.48);
	color: #d8b85a;
}

.is-hidden {
	display: none !important;
}

@keyframes oliverPlaneBob {
	0%,
	100% {
		transform: scale(var(--plane-scale)) translateY(0);
	}

	50% {
		transform: scale(var(--plane-scale)) translateY(-5px);
	}
}

@keyframes oliverPlaneBoarding {
	0%,
	100% {
		transform: scale(var(--plane-scale)) translateY(0);
	}

	50% {
		transform: scale(var(--plane-scale)) translateY(4px);
	}
}

@keyframes oliverPlaneTakeoff {
	0% {
		transform: scale(var(--plane-scale)) translate(0, 8px);
	}

	45% {
		transform: scale(var(--plane-scale)) translate(22px, -8px);
	}

	100% {
		transform: scale(var(--plane-scale)) translate(0, 0);
	}
}

@keyframes oliverPlaneHit {
	0%,
	100% {
		transform: scale(var(--plane-scale)) translate(0, 0);
	}

	33% {
		transform: scale(var(--plane-scale)) translate(-8px, 5px);
	}

	66% {
		transform: scale(var(--plane-scale)) translate(7px, -4px);
	}
}

@keyframes oliverPlaneSpinDrift {
	0%,
	100% {
		transform: scale(var(--plane-scale)) rotate(0deg) translate(0, 0);
	}

	18% {
		transform: scale(var(--plane-scale)) rotate(-7deg) translate(-6px, 4px);
	}

	38% {
		transform: scale(var(--plane-scale)) rotate(8deg) translate(7px, -3px);
	}

	62% {
		transform: scale(var(--plane-scale)) rotate(-5deg) translate(-5px, 5px);
	}

	82% {
		transform: scale(var(--plane-scale)) rotate(4deg) translate(4px, -2px);
	}
}

@keyframes oliverPlaneStormLock {
	0%,
	100% {
		transform: scale(var(--plane-scale)) rotate(0deg) translate(0, 0);
	}

	12% {
		transform: scale(var(--plane-scale)) rotate(-9deg) translate(-10px, 8px);
	}

	24% {
		transform: scale(var(--plane-scale)) rotate(10deg) translate(8px, -7px);
	}

	38% {
		transform: scale(var(--plane-scale)) rotate(-8deg) translate(-7px, 4px);
	}

	52% {
		transform: scale(var(--plane-scale)) rotate(9deg) translate(9px, 5px);
	}

	68% {
		transform: scale(var(--plane-scale)) rotate(-6deg) translate(-5px, -4px);
	}

	84% {
		transform: scale(var(--plane-scale)) rotate(5deg) translate(4px, 3px);
	}
}

@keyframes oliverSkyStorm {
	0%,
	100% {
		filter: brightness(1);
	}

	50% {
		filter: brightness(1.2) saturate(0.82);
	}
}

@keyframes oliverStormPulse {
	0%,
	100% {
		filter: brightness(1);
		transform: translateY(0);
	}

	50% {
		filter: brightness(1.25);
		transform: translateY(2px);
	}
}

@keyframes oliverPartySpark {
	0% {
		opacity: 0;
		transform: scale(1) translateY(0);
	}

	30%,
	70% {
		opacity: 1;
		transform: scale(1.8) translateY(-8px);
	}

	100% {
		opacity: 0;
		transform: scale(0.8) translateY(-14px);
	}
}

@keyframes oliverBoardHop {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-5px);
	}
}

@keyframes oliverCabinCheer {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-7px);
	}
}

@keyframes oliverPropeller {
	0%,
	100% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(90deg);
	}
}

@keyframes oliverCloudDrift {
	0% {
		transform: translateX(-90px);
	}

	100% {
		transform: translateX(760px);
	}
}

@keyframes oliverDistancePlane {
	0%,
	78% {
		opacity: 0;
		transform: translateX(120%);
	}

	82% {
		opacity: 0.86;
	}

	94% {
		opacity: 0.86;
		transform: translateX(-170%);
	}

	96%,
	100% {
		opacity: 0;
		transform: translateX(-170%);
	}
}

@keyframes oliverChildCheer {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-9px);
	}
}

@keyframes oliverCheerPop {
	0% {
		opacity: 0;
		transform: translate(-50%, 8px);
	}

	20%,
	78% {
		opacity: 1;
		transform: translate(-50%, 0);
	}

	100% {
		opacity: 0;
		transform: translate(-50%, -10px);
	}
}

@media (max-width: 760px) {
	.oliver-delivery {
		padding: 10px 8px 28px;
	}

	.oliver-delivery__intro {
		grid-template-columns: 1fr;
		min-height: auto;
		padding: 18px;
	}

	.oliver-delivery__hero {
		min-height: 160px;
	}

	.oliver-delivery__hero-sprite {
		--p: 5px;
	}

	.oliver-game,
	.oliver-result {
		padding: 10px;
	}

	.oliver-game__topbar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.oliver-game__board {
		height: min(70vh, 520px);
		min-height: 440px;
	}

	.oliver-game__message {
		font-size: 0.82rem;
		top: 10px;
	}

	.oliver-plane {
		--plane-scale: 0.78;
		--plane-y: 24%;
		left: 7%;
		transform-origin: left top;
	}

	.oliver-plane.is-boarding {
		--plane-scale: 1.02;
		left: 3%;
	}

	.oliver-plane.is-taking-off {
		--plane-scale: 0.52;
		left: 9%;
	}

	.oliver-plane.is-flying {
		--plane-scale: 0.4;
	}

	.oliver-plane__banner {
		font-size: 0.56rem;
		left: 58px;
		max-width: none;
		top: 67px;
		white-space: nowrap;
	}

	.oliver-plane__oliver.hoppy-cameo__sprite {
		--p: 3.45px;
		left: 70px;
		top: 7px;
	}

	.oliver-plane__coco {
		font-size: 3.18px;
		left: 124px;
		top: 8px;
	}

	.oliver-party {
		bottom: 30px;
		transform: translateX(-50%) scale(calc(var(--party-scale, 1) * 0.86));
		transform-origin: center bottom;
	}

	.oliver-game__message.is-compact {
		max-width: min(180px, calc(100% - 20px));
	}
}