/* =========================================================================
   KeepSeal Neo — page preloader (logo + several animated styles)
   ========================================================================= */
.ksn-preloader {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: grid;
	place-items: center;
	background: var(--ksn-bg, #f4f6fa);
	transition: opacity .5s ease, visibility .5s ease;
}
.ksn-preloader.is-done {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.ksn-preloader__stage {
	position: relative;
	display: grid;
	place-items: center;
	width: 200px;
	height: 200px;
}
.ksn-preloader__brand {
	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	max-width: 130px;
}
.ksn-preloader__logo { max-width: 120px; height: auto; display: block; }
.ksn-preloader__name {
	font-family: var(--ksn-font);
	font-weight: 900;
	font-size: 1.4rem;
	color: var(--ksn-primary);
	letter-spacing: .03em;
}

/* default-hide all the decorative bits; each style enables what it needs */
.ksn-preloader__rings,
.ksn-preloader__bar,
.ksn-preloader__orbit { display: none; }

/* ---------- Style: ring (induction rings) ---------- */
.ksn-preloader--ring .ksn-preloader__rings {
	display: block;
	position: absolute;
	inset: 0;
}
.ksn-preloader--ring .ksn-preloader__rings i {
	position: absolute;
	top: 50%; left: 50%;
	border-radius: 50%;
	border: 3px solid transparent;
	transform: translate(-50%, -50%);
}
.ksn-preloader--ring .ksn-preloader__rings i:nth-child(1) {
	width: 200px; height: 200px;
	border-top-color: var(--ksn-primary);
	border-inline-end-color: var(--ksn-primary);
	animation: ksn-pl-spin 1.4s linear infinite;
}
.ksn-preloader--ring .ksn-preloader__rings i:nth-child(2) {
	width: 158px; height: 158px;
	border-top-color: var(--ksn-heat);
	animation: ksn-pl-spin 1.8s linear infinite reverse;
}
.ksn-preloader--ring .ksn-preloader__rings i:nth-child(3) {
	width: 116px; height: 116px;
	border-inline-start-color: var(--ksn-accent);
	animation: ksn-pl-spin 2.2s linear infinite;
}

/* ---------- Style: pulse (logo breathing + heat glow) ---------- */
.ksn-preloader--pulse .ksn-preloader__brand { animation: ksn-pl-pulse 1.6s ease-in-out infinite; }
.ksn-preloader--pulse .ksn-preloader__stage::after {
	content: "";
	position: absolute; inset: 30px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(var(--ksn-heat-rgb), .35), transparent 70%);
	animation: ksn-pl-glow 1.6s ease-in-out infinite;
}

/* ---------- Style: bar (logo + sweeping progress bar) ---------- */
.ksn-preloader--bar .ksn-preloader__bar {
	display: block;
	position: absolute;
	bottom: 24px; left: 50%;
	transform: translateX(-50%);
	width: 160px; height: 4px;
	border-radius: 999px;
	background: var(--ksn-surface-2);
	overflow: hidden;
}
.ksn-preloader--bar .ksn-preloader__bar i {
	position: absolute;
	inset: 0;
	width: 40%;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--ksn-primary), var(--ksn-heat));
	animation: ksn-pl-bar 1.2s cubic-bezier(.6,0,.4,1) infinite;
}

/* ---------- Style: orbit (heat dot orbiting the logo) ---------- */
.ksn-preloader--orbit .ksn-preloader__orbit {
	display: block;
	position: absolute;
	width: 150px; height: 150px;
	border-radius: 50%;
	border: 2px dashed rgba(var(--ksn-primary-rgb), .25);
	animation: ksn-pl-spin 6s linear infinite;
}
.ksn-preloader--orbit .ksn-preloader__orbit::before {
	content: "";
	position: absolute;
	top: -8px; left: 50%;
	transform: translateX(-50%);
	width: 16px; height: 16px;
	border-radius: 50%;
	background: var(--ksn-heat);
	box-shadow: 0 0 16px 3px rgba(var(--ksn-heat-rgb), .8);
}

@keyframes ksn-pl-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.ksn-preloader--orbit .ksn-preloader__orbit { animation-name: ksn-pl-spin-plain; }
@keyframes ksn-pl-spin-plain { to { transform: rotate(360deg); } }
@keyframes ksn-pl-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
@keyframes ksn-pl-glow  { 0%,100% { opacity: .5; transform: scale(1); } 50% { opacity: 1; transform: scale(1.1); } }
@keyframes ksn-pl-bar {
	0%   { inset-inline-start: -40%; }
	100% { inset-inline-start: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.ksn-preloader__rings i,
	.ksn-preloader__brand,
	.ksn-preloader__stage::after,
	.ksn-preloader__bar i,
	.ksn-preloader__orbit { animation: none !important; }
}