/* FINNODE Loader v2 */

#fnl {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(120% 120% at 50% 40%, #1b1d2e 0%, #161826 55%, #0e0f18 100%);
	opacity: 1;
	transition: opacity .35s ease;
}

#fnl.hide {
	opacity: 0;
	pointer-events: none;
}

/* Word row */
.fnl-word {
	display: flex;
	align-items: flex-end;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(38px, 12vw, 172px);
	font-weight: 900;
	color: #e9e9ed;
	margin: 0;
	line-height: 1;
}

/* Each letter */
.fnl-word span {
	display: inline-block;
	opacity: 0;
	animation: fnl-in 1.8s cubic-bezier(.22,1,.36,1) forwards;
	animation-delay: calc(var(--d) * .11s);
}

/* Green dot */
.fnl-word i {
	display: inline-block;
	width: .14em;
	height: .14em;
	margin: 0 0 .07em .06em;
	border-radius: 50%;
	background: #8CC63E;
	opacity: 0;
	animation:
		fnl-in   1.8s cubic-bezier(.22,1,.36,1) forwards .44s,
		fnl-pulse 1s ease-in-out infinite .9s;
	box-shadow: 0 0 12px 3px rgba(140,198,62,.5);
}

@keyframes fnl-in {
	from { opacity: 0; transform: translateY(.18em); filter: blur(6px); }
	to   { opacity: 1; transform: translateY(0);     filter: blur(0); }
}

@keyframes fnl-pulse {
	0%,100% { box-shadow: 0 0 10px 2px rgba(140,198,62,.45); transform: scale(1);    }
	50%     { box-shadow: 0 0 22px 6px rgba(140,198,62,.8);  transform: scale(1.15); }
}

@media (prefers-reduced-motion: reduce) {
	.fnl-word span, .fnl-word i { animation: none; opacity: 1; }
}

/* Force hide class */
#fnl.hide,
#finnode-loader.hide {
	opacity: 0 !important;
	pointer-events: none !important;
}
