html.opening-active,
body.opening-active { overflow: hidden !important; }

.entrance-park-opening {
	position: fixed;
	z-index: 2147483000;
	inset: 0;
	display: grid;
	place-items: stretch;
	background: #020716;
	color: #fff;
	overflow: hidden;
	isolation: isolate;
	opacity: 1;
	transition: opacity .5s ease;
}
.entrance-park-opening.is-finished { opacity: 0; pointer-events: none; }
.entrance-park-opening__stage {
	position: absolute;
	inset: -3%;
	background-color: #06122c;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	transform: scale(1.08);
	transform-origin: 50% 67%;
	filter: brightness(.16) saturate(.72);
	transition: filter 1.25s ease, transform 1.8s cubic-bezier(.2,.74,.2,1);
}
.entrance-park-opening.is-lit .entrance-park-opening__stage { filter: brightness(1) saturate(1.04); transform: scale(1.035); }
.entrance-park-opening.is-rushing .entrance-park-opening__stage { transform: scale(2.65) translateY(8%); transition-duration: 1.55s; filter: brightness(1.28) saturate(1.16); }
.entrance-park-opening__night {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 50% 66%, transparent 0 6%, #020818a8 31%, #01030beb 100%);
	opacity: 1;
	transition: opacity 1.2s ease;
}
.entrance-park-opening.is-lit .entrance-park-opening__night { opacity: .12; }
.entrance-park-opening__spotlight {
	position: absolute;
	top: -28%;
	width: 25%;
	height: 135%;
	background: linear-gradient(180deg, #fff9bf85, #86e5ff16 68%, transparent);
	filter: blur(10px);
	opacity: 0;
	transform-origin: 50% 0;
	clip-path: polygon(46% 0, 54% 0, 100% 100%, 0 100%);
}
.entrance-park-opening__spotlight--left { left: 15%; transform: rotate(19deg); }
.entrance-park-opening__spotlight--right { right: 15%; transform: rotate(-19deg); }
.entrance-park-opening.is-lit .entrance-park-opening__spotlight { opacity: .62; animation: entrance-v7-searchlight 2.3s ease-in-out infinite alternate; }
.entrance-park-opening__spotlight--right { animation-delay: -.9s !important; }
@keyframes entrance-v7-searchlight { to { transform: rotate(-8deg); opacity: .32; } }

.entrance-park-opening__lights {
	position: absolute;
	z-index: 4;
	left: 50%;
	top: 52%;
	display: flex;
	gap: clamp(9px, 1.45vw, 25px);
	transform: translateX(-50%);
}
.entrance-park-opening__lights i {
	width: clamp(5px, .55vw, 10px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: #31250c;
	box-shadow: none;
	opacity: .18;
}
.entrance-park-opening.is-lit .entrance-park-opening__lights i {
	animation: entrance-v7-lamp .85s steps(2,end) forwards;
	animation-delay: calc(var(--lamp, 0) * .1s);
}
.entrance-park-opening__lights i:nth-child(1){--lamp:1}.entrance-park-opening__lights i:nth-child(2){--lamp:2}.entrance-park-opening__lights i:nth-child(3){--lamp:3}.entrance-park-opening__lights i:nth-child(4){--lamp:4}.entrance-park-opening__lights i:nth-child(5){--lamp:5}.entrance-park-opening__lights i:nth-child(6){--lamp:6}.entrance-park-opening__lights i:nth-child(7){--lamp:7}.entrance-park-opening__lights i:nth-child(8){--lamp:8}.entrance-park-opening__lights i:nth-child(9){--lamp:9}
@keyframes entrance-v7-lamp { 35% { opacity: .25; } 55% { opacity: 1; } 72% { opacity: .3; } 100% { opacity: 1; background:#fff4a8; box-shadow:0 0 12px 5px #ffd64f,0 0 30px 12px #fff3a95c; } }

.entrance-park-opening__cards { position: absolute; z-index: 8; inset: 0; pointer-events: none; }
.entrance-park-opening__cards span {
	position: absolute;
	display: grid;
	place-items: center;
	width: clamp(38px, 4.8vw, 76px);
	aspect-ratio: 5 / 7;
	border: 2px solid #17243f;
	background: #f8efd8;
	color: #17243f;
	font: 900 clamp(11px, 1.3vw, 20px)/1 Georgia, serif;
	box-shadow: 4px 5px 0 #071129a8;
	opacity: 0;
}
.entrance-park-opening__cards .is-heart,
.entrance-park-opening__cards .is-diamond { color: #b4343c; }
.entrance-park-opening__cards .is-spade { left: 2%; top: 13%; transform: rotate(-18deg); }
.entrance-park-opening__cards .is-heart { right: 4%; top: 18%; transform: rotate(14deg); }
.entrance-park-opening__cards .is-diamond { left: 12%; bottom: 4%; transform: rotate(9deg); }
.entrance-park-opening__cards .is-joker { right: 13%; bottom: 8%; transform: rotate(-12deg); }
.entrance-park-opening.is-cards .entrance-park-opening__cards span { animation: entrance-v7-card-sucked 2.2s cubic-bezier(.33,.02,.7,.32) forwards; }
.entrance-park-opening.is-cards .entrance-park-opening__cards .is-heart { animation-delay: .12s; }
.entrance-park-opening.is-cards .entrance-park-opening__cards .is-diamond { animation-delay: .24s; }
.entrance-park-opening.is-cards .entrance-park-opening__cards .is-joker { animation-delay: .36s; }
@keyframes entrance-v7-card-sucked {
	0% { opacity: 0; scale: .7; }
	12% { opacity: 1; }
	55% { opacity: 1; }
	100% { left: 50%; right: auto; top: 67%; bottom: auto; opacity: 0; scale: .08; rotate: 540deg; translate: -50% -50%; }
}

.entrance-park-opening__gate {
	position: absolute;
	z-index: 6;
	left: 50%;
	top: 56%;
	width: clamp(130px, 17vw, 285px);
	height: 48%;
	transform: translateX(-50%);
	perspective: 900px;
	overflow: visible;
}
.entrance-park-opening__portal {
	position: absolute;
	inset: 0;
	border-radius: 48% 48% 3% 3%;
	background: radial-gradient(ellipse at 50% 45%, #fff 0 6%, #fff3a6 18%, #55d8ffbd 43%, transparent 70%);
	filter: blur(7px);
	opacity: 0;
	transform: scale(.55);
	transition: opacity .9s ease, transform 1.25s ease;
}
.entrance-park-opening__door {
	position: absolute;
	top: 2%;
	bottom: 0;
	width: 51%;
	border: 2px solid #e3b852;
	background: linear-gradient(90deg,#071735f5,#102d5bf2 54%,#06142ff5);
	box-shadow: inset 0 0 0 5px #d3a94622,0 0 16px #000;
	transition: transform 1.2s cubic-bezier(.2,.75,.2,1);
}
.entrance-park-opening__door::after { content:""; position:absolute; top:48%; width:9px; height:9px; border-radius:50%; background:#f8d46b; box-shadow:0 0 9px #ffe887; }
.entrance-park-opening__door--left { left: 0; border-radius: 80% 0 0 0; transform-origin: 0 50%; }
.entrance-park-opening__door--right { right: 0; border-radius: 0 80% 0 0; transform-origin: 100% 50%; }
.entrance-park-opening__door--left::after { right: 7px; }.entrance-park-opening__door--right::after { left: 7px; }
.entrance-park-opening.is-gate-opening .entrance-park-opening__portal { opacity: 1; transform: scale(1.35); }
.entrance-park-opening.is-gate-opening .entrance-park-opening__door--left { transform: rotateY(-104deg); }
.entrance-park-opening.is-gate-opening .entrance-park-opening__door--right { transform: rotateY(104deg); }

.entrance-park-opening__message {
	position: absolute;
	z-index: 10;
	left: 50%;
	bottom: max(20px, 4vh);
	margin: 0;
	color: #fff9dd;
	font: 900 clamp(15px, 2vw, 28px)/1.2 serif;
	letter-spacing: .12em;
	text-shadow: 0 2px 8px #000,0 0 16px #001637;
	white-space: nowrap;
	opacity: 0;
	transform: translate(-50%,12px);
}
.entrance-park-opening.is-lit .entrance-park-opening__message { animation: entrance-v7-message 2.4s ease 1.05s both; }
@keyframes entrance-v7-message { 0%{opacity:0;transform:translate(-50%,12px)} 22%,72%{opacity:1;transform:translate(-50%,0)} 100%{opacity:0;transform:translate(-50%,-7px)} }

.entrance-park-opening__skip {
	position: fixed;
	z-index: 20;
	right: max(12px, 2vw);
	top: max(12px, 2vw);
	padding: 7px 11px;
	border: 1px solid #fff7d8b8;
	background: #06132fc4;
	color: #fff7d8;
	font: 800 11px/1 sans-serif;
	cursor: pointer;
}
.entrance-park-opening__flash { position: absolute; z-index: 30; inset: 0; background:#fff; opacity:0; pointer-events:none; }
.entrance-park-opening.is-flashing .entrance-park-opening__flash { animation: entrance-v7-flash .75s ease forwards; }
@keyframes entrance-v7-flash { 0%{opacity:0} 38%{opacity:1} 100%{opacity:.96} }

@media (max-width: 760px) {
	.entrance-park-opening__stage { inset:-2%; background-position:center center; }
	.entrance-park-opening__gate { top:56%; width:34vw; min-width:116px; height:46%; }
	.entrance-park-opening__lights { top:51%; gap:9px; }
	.entrance-park-opening__cards span { width:42px; }
	.entrance-park-opening__message { bottom:9vh; font-size:16px; }
	.entrance-park-opening.is-rushing .entrance-park-opening__stage { transform:scale(3.3) translateY(8%); }
}

@media (prefers-reduced-motion: reduce) {
	.entrance-park-opening *,
	.entrance-park-opening *::before,
	.entrance-park-opening *::after { animation: none !important; transition: none !important; }
}