/* Jackpotz Bonfire Night v1.1: one fixed overlay, nothing clickable, nothing tied to page scroll. */

#jpz-bn {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	/* Large-viewport height: the mobile address bar showing/hiding never resizes the layer. */
	height: 100vh;
	height: 100lvh;
	z-index: 9990;
	pointer-events: none;
	overflow: hidden;
	contain: strict;
	-webkit-user-select: none;
	user-select: none;
	transform: translateZ(0);
}
#jpz-bn * { pointer-events: none !important; }

#jpz-bn canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}

/* Guy Fawkes and his gunpowder barrels in the bottom-right corner */
.jpz-bn-guy {
	position: absolute;
	right: 10px;
	bottom: calc(var(--jpz-bn-floor, 0px) + 2px);
	width: 124px;
	opacity: .92;
}
.jpz-bn-guy svg { display: block; width: 100%; height: auto; overflow: visible; }
.jpz-bn-lantern { animation: jpz-bn-lantern 2.2s ease-in-out infinite alternate; }
.jpz-bn-lantern-halo { opacity: .22; transform-box: fill-box; transform-origin: 50% 50%; animation: jpz-bn-halo 2.2s ease-in-out infinite alternate; }
.jpz-bn-fuse { transform-box: fill-box; transform-origin: 50% 50%; animation: jpz-bn-fizz .16s steps(2) infinite; }

@keyframes jpz-bn-lantern { 0%, 100% { fill: #ffd43b; } 40% { fill: #ffbf2e; } 70% { fill: #ffe27a; } }
@keyframes jpz-bn-halo { from { opacity: .14; transform: scale(.9); } to { opacity: .3; transform: scale(1.08); } }
@keyframes jpz-bn-fizz { from { transform: scale(.8); fill: #ffd43b; } to { transform: scale(1.35); fill: #fff4c2; } }

/* Warm, gently flickering glow behind the Bonfire Night logo (the selector is added by the plugin). */
@keyframes jpz-bn-logo-glow {
	0%, 100% { filter: drop-shadow(0 0 3px rgba(255, 140, 30, .4)) drop-shadow(0 0 10px rgba(255, 90, 20, .22)); }
	30%      { filter: drop-shadow(0 0 5px rgba(255, 170, 40, .55)) drop-shadow(0 0 14px rgba(255, 110, 20, .32)); }
	55%      { filter: drop-shadow(0 0 4px rgba(255, 150, 30, .45)) drop-shadow(0 0 11px rgba(255, 90, 20, .26)); }
	80%      { filter: drop-shadow(0 0 7px rgba(255, 190, 60, .62)) drop-shadow(0 0 18px rgba(255, 120, 30, .38)); }
}

@media (max-width: 767px) {
	.jpz-bn-guy { width: 80px; right: 4px; opacity: .88; }
}

@media (prefers-reduced-motion: reduce) {
	.jpz-bn-guy * { animation: none !important; }
}
@media print {
	#jpz-bn { display: none !important; }
}