/* ======================================================
   STATES
   Global modes, phases, memberships
   ====================================================== */

/* ======================
   DEFAULT / NORMAL STATE
   ====================== */

body {
	background-color: var(--veil-night);
	color: var(--text-body);
	--veil-glow-strength: 1;
}

/* ======================
   BLOOD MOON MODE
   OFF BY DEFAULT
   Add body class: is-blood-moon
   ====================== */

body.is-blood-moon {
	--veil-accent: var(--veil-crimson);
	--veil-glow: rgba(220, 38, 38, 0.65);
	--veil-glow-strength: 1.3;
}

/* Blood Moon H1 Variant */
body.is-blood-moon h1 {
	background: linear-gradient(
		90deg,
		#fff5f5 0%,
		#fecaca 30%,
		#dc2626 50%,
		#fecaca 70%,
		#fff5f5 100%
	);
	background-size: 300% 300%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;

	text-shadow:
		0 0 14px rgba(220, 38, 38, 0.55),
		0 0 36px rgba(185, 28, 28, 0.45),
		0 0 72px rgba(127, 29, 29, 0.35);
}

/* ======================
   MEMBERSHIP TIERS
   ====================== */

body.veil-initiate {
	--veil-glow-strength: 0.6;
}

body.veil-acolyte {
	--veil-glow-strength: 0.85;
}

body.veil-ascendant {
	--veil-glow-strength: 1.1;
}

/* ======================
   APPLY GLOW STRENGTH
   ====================== */

.veil-glow {
	filter: drop-shadow(
		0 0 calc(12px * var(--veil-glow-strength))
		rgba(167, 139, 250, 0.6)
	);
}

/* ======================
   CODEX UNLOCK VISUAL STATES
   These do not hide content; they visually suggest access.
   ====================== */

body.veil-initiate .codex-tier-2,
body.veil-initiate .codex-tier-3 {
	filter: blur(3px);
	opacity: 0.72;
}

body.veil-acolyte .codex-tier-3 {
	filter: blur(2px);
	opacity: 0.82;
}

body.veil-ascendant .codex-tier-1,
body.veil-ascendant .codex-tier-2,
body.veil-ascendant .codex-tier-3 {
	filter: none;
	opacity: 1;
}

/* Blood Moon reveals forbidden knowledge visually */
body.is-blood-moon .codex-tier-3 {
	filter: none;
	opacity: 1;
}

/* ======================
   DEBUG / SAFE MODE
   ====================== */

body.veil-safe *,
body.veil-safe *::before,
body.veil-safe *::after {
	animation: none !important;
	transition: none !important;
	text-shadow: none !important;
	filter: none !important;
}