/**
 * Univers — easter egg (ligne errante + voie scellée)
 */

/* Avant le 1er clic : ligne dans le flux, à côté du titre */
.asmon-univers--trace .univers-hero .asmon-hero__scroll--hunt {
	position: relative;
	cursor: pointer;
}

.asmon-univers--trace .univers-hero .asmon-hero__scroll--hunt::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: -1;
	width: 36px;
	height: 5rem;
	transform: translate(-50%, -50%) scale(0.5);
	border-radius: 50%;
	pointer-events: none;
	opacity: 0;
	background: radial-gradient(
		ellipse at center,
		rgba(255, 252, 238, 0.98) 0%,
		rgba(255, 232, 185, 0.82) 18%,
		rgba(201, 168, 76, 0.48) 42%,
		transparent 72%
	);
	filter: blur(8px);
}

.asmon-univers--trace .univers-hero .asmon-hero__scroll--hunt::after {
	content: "";
	position: absolute;
	inset: calc(-0.35rem - 3px) calc(-0.25rem - 3px);
}

.asmon-univers--trace .univers-hero .asmon-hero__scroll--hunt .asmon-hero__scroll-line {
	pointer-events: none;
	transition:
		box-shadow 0.28s ease,
		filter 0.28s ease;
}

.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick {
	animation: asmon-univers-trace-bounce 0.52s cubic-bezier(0.34, 1.28, 0.48, 1);
}

.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick::before {
	animation: asmon-univers-tick-flash 0.58s cubic-bezier(0.22, 0.72, 0.28, 1);
}

.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick .asmon-hero__scroll-line {
	animation:
		asmon-univers-line-tick 0.52s cubic-bezier(0.34, 1.28, 0.48, 1),
		asmon-hero-scroll-pulse 2.2s ease-in-out 0.52s infinite;
}

.asmon-univers-wander::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: -1;
	width: 40px;
	height: 5.5rem;
	transform: translate(-50%, -50%) scale(0.5);
	border-radius: 50%;
	pointer-events: none;
	opacity: 0;
	background: radial-gradient(
		ellipse at center,
		rgba(255, 252, 238, 0.98) 0%,
		rgba(255, 232, 185, 0.82) 18%,
		rgba(201, 168, 76, 0.48) 42%,
		transparent 72%
	);
	filter: blur(10px);
}

.asmon-univers-wander.is-tick {
	animation: asmon-univers-wander-bounce 0.52s cubic-bezier(0.34, 1.28, 0.48, 1);
}

.asmon-univers-wander.is-tick::before {
	animation: asmon-univers-tick-flash 0.58s cubic-bezier(0.22, 0.72, 0.28, 1);
}

.asmon-univers-wander.is-tick .asmon-univers-wander__line {
	animation:
		asmon-univers-line-tick 0.52s cubic-bezier(0.34, 1.28, 0.48, 1),
		asmon-univers-wander-pulse 2.2s ease-in-out 0.52s infinite;
}

@keyframes asmon-univers-tick-flash {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.45);
		filter: blur(10px) brightness(1);
	}
	18% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1.55);
		filter: blur(14px) brightness(1.65);
	}
	42% {
		opacity: 0.55;
		transform: translate(-50%, -50%) scale(1.2);
		filter: blur(12px) brightness(1.25);
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.9);
		filter: blur(8px) brightness(1);
	}
}

@keyframes asmon-univers-trace-bounce {
	0%,
	100% {
		transform: translateY(0) scale(1);
	}
	22% {
		transform: translateY(-7px) scale(1.08);
	}
	40% {
		transform: translateY(-2px) scale(1.03);
	}
	54% {
		transform: translateY(-5px) scale(1.05);
	}
}

@keyframes asmon-univers-wander-bounce {
	0%,
	100% {
		transform: translate(-50%, -50%) scale(1);
	}
	22% {
		transform: translate(-50%, -58%) scale(1.14);
	}
	40% {
		transform: translate(-50%, -51%) scale(1.05);
	}
	54% {
		transform: translate(-50%, -55%) scale(1.08);
	}
}

@keyframes asmon-univers-line-tick {
	0%,
	100% {
		opacity: 0.85;
		transform: scaleY(1);
		box-shadow: 0 0 10px rgba(201, 168, 76, 0.45);
		filter: brightness(1);
	}
	18% {
		opacity: 1;
		transform: scaleY(1.55) scaleX(4);
		box-shadow:
			0 0 28px rgba(255, 244, 220, 1),
			0 0 52px rgba(255, 228, 180, 0.92),
			0 0 88px rgba(201, 168, 76, 0.65);
		filter: brightness(2.1);
	}
	38% {
		opacity: 0.95;
		transform: scaleY(1.2) scaleX(2.6);
		box-shadow:
			0 0 20px rgba(255, 236, 200, 0.85),
			0 0 40px rgba(201, 168, 76, 0.5);
		filter: brightness(1.55);
	}
}

.asmon-hero__scroll--ghost {
	display: none !important;
}

.asmon-hero__scroll--gone {
	display: none !important;
}

/* Ligne flottante : hors flux, au-dessus de tout (jamais dans le layout) */
.asmon-univers-wander {
	position: fixed !important;
	z-index: 99990 !important;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1px;
	height: 2.5rem;
	margin: 0 !important;
	padding: 0 !important;
	border: none;
	background: transparent;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%);
	transition:
		left 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		top 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		opacity 0.2s ease;
}

.asmon-univers-wander.is-ready {
	opacity: 1;
	pointer-events: auto;
}

/* Zone de clic élargie (+4px) — ligne flottante uniquement */
.asmon-univers-wander::after {
	content: "";
	position: absolute;
	inset: -4px;
	pointer-events: auto;
}

.asmon-univers-wander:focus-visible {
	outline: 1px solid rgba(201, 168, 76, 0.35);
	outline-offset: 6px;
}

.asmon-univers-wander.is-arrive {
	opacity: 1;
	transition:
		left 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		top 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		opacity 0.34s ease;
}

.asmon-univers-wander.is-vanish {
	opacity: 0;
	transition:
		left 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		top 0.72s cubic-bezier(0.33, 1.05, 0.52, 1),
		opacity 0.18s ease;
}

.asmon-univers-wander__line {
	display: block;
	width: 1px;
	height: 2.5rem;
	background: linear-gradient(to bottom, var(--asmon-accent, #c9a84c), transparent);
	box-shadow: 0 0 8px rgba(201, 168, 76, 0.4);
	animation: asmon-univers-wander-pulse 2.2s ease-in-out infinite;
	pointer-events: none;
}

@keyframes asmon-univers-wander-pulse {
	0%,
	100% {
		opacity: 0.4;
		transform: scaleY(0.75);
	}
	50% {
		opacity: 1;
		transform: scaleY(1);
	}
}

/* —— Révélation de la voie scellée —— */
.univers-index--unveiling .univers-index__glow {
	animation: univers-sigil-flash-wide 1.6s cubic-bezier(0.22, 0.65, 0.28, 1) forwards;
}

.univers-sigils--unveiling {
	overflow: visible;
	transition:
		gap 1.05s cubic-bezier(0.33, 1.08, 0.52, 1),
		grid-template-columns 1.05s cubic-bezier(0.33, 1.08, 0.52, 1);
}

.univers-sigils--unveiling::before {
	content: "";
	position: absolute;
	inset: -12% -8%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(
		ellipse 70% 55% at 50% 58%,
		rgba(255, 244, 220, 0.32) 0%,
		rgba(201, 168, 76, 0.14) 28%,
		transparent 68%
	);
	opacity: 0;
	animation: univers-sigils-flash 1.45s cubic-bezier(0.22, 0.72, 0.28, 1) forwards;
}

.univers-sigils--unveiling .univers-sigil:not(.univers-sigil--unveiled) {
	transition:
		transform 1.05s cubic-bezier(0.33, 1.1, 0.52, 1),
		opacity 0.85s cubic-bezier(0.33, 1.05, 0.52, 1),
		box-shadow 1.05s cubic-bezier(0.33, 1.05, 0.52, 1);
}

.univers-sigil--unveiled {
	z-index: 2;
	overflow: visible;
	animation: univers-sigil-enter 1.05s cubic-bezier(0.33, 1.08, 0.52, 1) forwards;
}

.univers-sigil--unveiled::before {
	clip-path: inset(0);
}

.univers-sigil--unveiled.is-fusing {
	overflow: visible;
}

.univers-sigil--unveiled.is-settled {
	opacity: 1;
	transform: translateY(0) scale(1);
	filter: none;
	overflow: hidden;
}

.univers-sigil--unveiled.is-settled:not(.is-pulsing) {
	animation: none;
}

/* Halo rayonnant — explosion 404 puis anneau extérieur pulsant (pas au centre) */
.univers-sigil__flare {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 0;
	width: 155%;
	height: 195%;
	pointer-events: none;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	background: radial-gradient(
		ellipse at center,
		rgba(255, 252, 238, 0.98) 0%,
		rgba(255, 236, 195, 0.82) 14%,
		rgba(255, 220, 160, 0.55) 32%,
		rgba(201, 168, 76, 0.28) 52%,
		transparent 74%
	);
	filter: blur(20px);
	opacity: 0;
}

.univers-sigil__veil,
.univers-sigil__glow {
	position: absolute;
	inset: 0.2rem;
	pointer-events: none;
	border-radius: 1px;
	transform: none;
}

.univers-sigil__veil {
	z-index: 1;
	background: radial-gradient(
		ellipse 100% 100% at center,
		transparent 46%,
		transparent 50%,
		rgba(255, 228, 185, 0.16) 56%,
		rgba(201, 168, 76, 0.14) 68%,
		rgba(255, 236, 200, 0.08) 78%,
		transparent 92%
	);
	filter: blur(22px);
	opacity: 0.28;
}

.univers-sigil__glow {
	z-index: 2;
	inset: 0.5rem;
	background: radial-gradient(
		ellipse 100% 100% at center,
		transparent 44%,
		transparent 48%,
		rgba(255, 240, 210, 0.28) 54%,
		rgba(201, 168, 76, 0.18) 66%,
		transparent 88%
	);
	filter: blur(14px);
	opacity: 0.18;
}

/* Pas de carré conique tournant (halo décoratif des autres voies) */
.univers-sigil--unveiled .univers-sigil__halo {
	display: none !important;
}

.univers-sigil--unveiled .univers-sigil__frame,
.univers-sigil--unveiled .univers-sigil__num,
.univers-sigil--unveiled .univers-sigil__body {
	z-index: 3;
}

.univers-sigil--unveiled.is-fusing .univers-sigil__flare {
	animation: asmon-404-fusion-explosion 3.2s linear forwards;
}

.univers-sigil--unveiled.is-fusing .univers-sigil__veil {
	animation:
		asmon-404-fusion-burst-wide 3.2s linear forwards,
		univers-sigil-veil-life 3.85s linear forwards;
}

.univers-sigil--unveiled.is-fusing .univers-sigil__glow {
	animation:
		asmon-404-fusion-burst-core 3.2s linear forwards,
		univers-sigil-glow-life 3.85s linear forwards;
}

/* Aura diffuse autour de la carte (ombres larges, pas de halo carré) */
.univers-sigil--unveiled.is-pulsing,
.univers-sigil--unveiled.is-pulsing:hover {
	animation:
		univers-sigil-aura-ramp 1.15s linear 0s forwards,
		univers-sigil-aura-breathe 3.6s cubic-bezier(0.45, 0.05, 0.55, 0.95) 0s infinite;
}

.univers-sigil--unveiled.is-pulsing .univers-sigil__frame {
	animation:
		univers-sigil-frame-flash 0.95s cubic-bezier(0.22, 0.72, 0.28, 1) forwards,
		univers-sigil-frame-border-pulse 3.6s cubic-bezier(0.45, 0.05, 0.55, 0.95) 0s infinite;
}

/* Hover : effets classiques (asmon-univers.css) + halo / pulsation conservés */


@keyframes univers-sigils-flash {
	0% {
		opacity: 0;
		transform: scale(0.88);
	}
	22% {
		opacity: 1;
		transform: scale(1.08);
	}
	55% {
		opacity: 0.35;
		transform: scale(1.02);
	}
	100% {
		opacity: 0;
		transform: scale(1);
	}
}

@keyframes univers-sigil-flash-wide {
	0% {
		opacity: 0.45;
		transform: translateX(-50%) scale(0.9);
	}
	16% {
		opacity: 1;
		transform: translateX(-50%) scale(1.42);
	}
	38% {
		opacity: 0.65;
		transform: translateX(-50%) scale(1.12);
	}
	100% {
		opacity: 1;
		transform: translateX(-50%) scale(1.05);
	}
}

/* Une seule timeline linéaire : explosion → régression → fin */
@keyframes univers-sigil-flare-life {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.55);
		filter: blur(18px) brightness(1);
	}
	11% {
		opacity: 0.98;
		transform: translate(-50%, -50%) scale(1.55);
		filter: blur(26px) brightness(1.3);
	}
	20% {
		opacity: 0.68;
		transform: translate(-50%, -50%) scale(1.38);
		filter: blur(22px) brightness(1.12);
	}
	32% {
		opacity: 0.48;
		transform: translate(-50%, -50%) scale(1.18);
		filter: blur(18px) brightness(1.06);
	}
	46% {
		opacity: 0.32;
		transform: translate(-50%, -50%) scale(1.06);
		filter: blur(16px) brightness(1.03);
	}
	62% {
		opacity: 0.18;
		transform: translate(-50%, -50%) scale(1.02);
		filter: blur(14px) brightness(1.01);
	}
	78% {
		opacity: 0.1;
		transform: translate(-50%, -50%) scale(1);
		filter: blur(12px) brightness(1);
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(1);
		filter: blur(10px) brightness(1);
	}
}

@keyframes univers-sigil-veil-life {
	0% {
		opacity: 0.15;
		filter: blur(20px) brightness(1);
	}
	10% {
		opacity: 1;
		filter: blur(36px) brightness(1.32);
	}
	17% {
		opacity: 0.9;
		filter: blur(32px) brightness(1.22);
	}
	24% {
		opacity: 0.76;
		filter: blur(30px) brightness(1.14);
	}
	32% {
		opacity: 0.62;
		filter: blur(28px) brightness(1.1);
	}
	40% {
		opacity: 0.5;
		filter: blur(26px) brightness(1.07);
	}
	48% {
		opacity: 0.4;
		filter: blur(24px) brightness(1.05);
	}
	56% {
		opacity: 0.31;
		filter: blur(22px) brightness(1.03);
	}
	64% {
		opacity: 0.23;
		filter: blur(20px) brightness(1.02);
	}
	72% {
		opacity: 0.16;
		filter: blur(17px) brightness(1.01);
	}
	80% {
		opacity: 0.1;
		filter: blur(14px) brightness(1);
	}
	88% {
		opacity: 0.05;
		filter: blur(11px) brightness(1);
	}
	96% {
		opacity: 0.02;
		filter: blur(8px) brightness(1);
	}
	100% {
		opacity: 0;
		filter: blur(6px) brightness(1);
	}
}

@keyframes univers-sigil-glow-life {
	0% {
		opacity: 0.1;
		filter: blur(12px) brightness(1);
	}
	11% {
		opacity: 0.9;
		filter: blur(20px) brightness(1.26);
	}
	19% {
		opacity: 0.74;
		filter: blur(18px) brightness(1.16);
	}
	28% {
		opacity: 0.58;
		filter: blur(16px) brightness(1.1);
	}
	38% {
		opacity: 0.44;
		filter: blur(15px) brightness(1.06);
	}
	48% {
		opacity: 0.32;
		filter: blur(14px) brightness(1.04);
	}
	58% {
		opacity: 0.22;
		filter: blur(12px) brightness(1.02);
	}
	68% {
		opacity: 0.14;
		filter: blur(10px) brightness(1.01);
	}
	78% {
		opacity: 0.08;
		filter: blur(8px) brightness(1);
	}
	88% {
		opacity: 0.04;
		filter: blur(6px) brightness(1);
	}
	100% {
		opacity: 0;
		filter: blur(4px) brightness(1);
	}
}

@keyframes univers-sigil-aura-ramp {
	0% {
		box-shadow:
			0 14px 36px rgba(0, 0, 0, 0.34),
			0 0 62px 26px rgba(255, 228, 180, 0.11),
			0 0 124px 52px rgba(201, 168, 76, 0.05);
	}
	100% {
		box-shadow:
			0 14px 36px rgba(0, 0, 0, 0.34),
			0 0 64px 26px rgba(201, 168, 76, 0.1),
			0 0 128px 52px rgba(201, 168, 76, 0.048);
	}
}

@keyframes univers-sigil-aura-breathe {
	0%,
	100% {
		box-shadow:
			0 14px 36px rgba(0, 0, 0, 0.34),
			0 0 64px 26px rgba(201, 168, 76, 0.1),
			0 0 128px 52px rgba(201, 168, 76, 0.048);
	}
	50% {
		box-shadow:
			0 18px 44px rgba(0, 0, 0, 0.42),
			0 0 78px 32px rgba(255, 228, 180, 0.19),
			0 0 152px 64px rgba(201, 168, 76, 0.09);
	}
}

@keyframes univers-sigil-frame-border-pulse {
	0%,
	100% {
		border-color: rgba(201, 168, 76, 0.26);
	}
	50% {
		border-color: rgba(255, 236, 200, 0.4);
	}
}

@keyframes univers-sigil-enter {
	0% {
		opacity: 0;
		transform: translateY(14px) scale(0.94);
		filter: blur(5px);
		border-color: rgba(201, 168, 76, 0.12);
	}
	32% {
		opacity: 1;
		transform: translateY(-2px) scale(1.02);
		filter: blur(0);
		border-color: rgba(255, 232, 190, 0.7);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
		border-color: rgba(201, 168, 76, 0.38);
	}
}

@keyframes univers-sigil-frame-flash {
	0% {
		border-color: rgba(201, 168, 76, 0.15);
		box-shadow: none;
	}
	24% {
		border-color: rgba(255, 240, 210, 0.55);
		box-shadow:
			0 0 0 1px rgba(255, 236, 200, 0.18),
			0 0 22px 8px rgba(255, 228, 180, 0.22),
			0 0 48px 18px rgba(201, 168, 76, 0.12);
	}
	100% {
		border-color: rgba(201, 168, 76, 0.32);
		box-shadow: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick,
	.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick::before,
	.asmon-univers-wander.is-tick,
	.asmon-univers-wander.is-tick::before {
		animation: none;
	}

	.asmon-univers--trace .asmon-hero__scroll--hunt.is-tick .asmon-hero__scroll-line,
	.asmon-univers-wander.is-tick .asmon-univers-wander__line {
		animation: none;
	}

	.asmon-univers-wander,
	.asmon-univers-wander__line,
	.univers-sigil--unveiled,
	.univers-sigil--unveiled .univers-sigil__flare,
	.univers-sigil--unveiled .univers-sigil__veil,
	.univers-sigil--unveiled .univers-sigil__glow,
	.univers-sigil--unveiled .univers-sigil__halo,
	.univers-sigil--unveiled .univers-sigil__frame,
	.univers-sigils--unveiling::before,
	.univers-index--unveiling .univers-index__glow {
		animation: none;
		transition: none;
	}
}