/**
 * 原生弹层「弹出来」——对齐 Motion DialogCustomExit
 * scale 0.95 + translateY(40px) + 0.25s（CSS 无法做真 spring，曲线贴近 bounce:0）
 */

:root {
	--mytheme-pop-duration: 0.25s;
	--mytheme-pop-ease: cubic-bezier(0.32, 0.72, 0, 1);
}

.mytheme-pop__backdrop {
	opacity: 0;
	transition: opacity var(--mytheme-pop-duration) var(--mytheme-pop-ease);
}

.mytheme-pop.is-pop-open .mytheme-pop__backdrop {
	opacity: 1;
}

.mytheme-pop.is-pop-leave .mytheme-pop__backdrop {
	opacity: 0;
}

.mytheme-pop__panel {
	opacity: 0;
	transform: translateY(40px) scale(0.95);
	transition:
		opacity var(--mytheme-pop-duration) var(--mytheme-pop-ease),
		transform var(--mytheme-pop-duration) var(--mytheme-pop-ease);
}

.mytheme-pop.is-pop-open .mytheme-pop__panel {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.mytheme-pop.is-pop-leave .mytheme-pop__panel {
	opacity: 0;
	transform: translateY(40px) scale(0.95);
}

/* 根节点自己就是遮罩（灯箱 / 长图） */
.mytheme-pop--overlay {
	opacity: 0;
	transition: opacity var(--mytheme-pop-duration) var(--mytheme-pop-ease);
}

.mytheme-pop--overlay.is-pop-open {
	opacity: 1;
}

.mytheme-pop--overlay.is-pop-leave {
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	.mytheme-pop__backdrop,
	.mytheme-pop__panel,
	.mytheme-pop--overlay {
		transition: none !important;
		transform: none !important;
	}

	.mytheme-pop.is-pop-open .mytheme-pop__panel,
	.mytheme-pop.is-pop-leave .mytheme-pop__panel {
		transform: none !important;
	}
}