.panda-peek { transform-origin: center bottom; pointer-events: auto; cursor: pointer; }
.panda-peek .face-sad,
.panda-peek .cover-paws,
.panda-peek .sweat,
.panda-peek .hearts,
.panda-peek .wow-eyes { display: none; }
.panda-reacts {
	position: absolute;
	inset: 0 0 auto 0;
	height: 120px;
	pointer-events: none;
	z-index: 5;
}
.panda-reacts i {
	position: absolute;
	font-style: normal;
	font-size: 18px;
	color: #fde68a;
	opacity: 0;
	animation: emojiPop 0.9s ease forwards;
	filter: drop-shadow(0 4px 8px rgba(2, 6, 23, 0.45));
}
@keyframes emojiPop {
	0% { transform: translateY(8px) scale(.4); opacity: 0; }
	30% { opacity: 1; transform: translateY(-6px) scale(1.15); }
	100% { transform: translateY(-28px) scale(.8); opacity: 0; }
}
.panda-peek.is-watch { animation: pandaLook 0.45s ease forwards; }
.panda-peek.is-watch .pupils { transform: translateY(3px); }
.panda-peek.is-hide { animation: pandaHide 0.35s ease forwards; }
.panda-peek.is-hide .cover-paws { display: block; }
.panda-peek.is-hide .smile { opacity: 0.2; }
.panda-peek.is-type { animation: pandaType 0.18s ease; }
.panda-peek.is-wrong { animation: pandaWrong 0.7s ease; }
.panda-peek.is-wrong .smile { display: none; }
.panda-peek.is-wrong .face-sad { display: block; }
.panda-peek.is-wrong .sweat { display: block; }
.panda-peek.is-wow { animation: pandaWow 0.5s ease; }
.panda-peek.is-wow .wow-eyes { display: block; }
.panda-peek.is-love { animation: pandaLove 0.55s ease; }
.panda-peek.is-love .hearts { display: block; }
.panda-peek.is-send { animation: pandaSend 0.6s ease; }
.panda-peek.is-high { animation: pandaHigh 0.85s ease; }
.panda-peek.is-high .wow-eyes,
.panda-peek.is-high .hearts { display: block; }
.panda-peek.is-hi { animation: pandaHi 0.9s ease; }
.panda-peek.is-hi .hearts { display: block; }
.brand-mark { cursor: pointer; position: relative; }
.brand-mark.is-hi img { animation: logoWave 0.9s ease; }
.logo-hi-pop {
	position: absolute;
	top: -14px;
	right: -8px;
	background: #fff;
	color: #0f172a;
	font-size: 13px;
	font-weight: 800;
	padding: 4px 10px;
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.28);
	animation: hiPop 0.9s ease forwards;
	white-space: nowrap;
	z-index: 6;
	pointer-events: none;
}
.auth-stage.is-acting .panda-paw { animation: pawTap 0.35s ease; }
.auth-stage.is-wrong .panda-paw { animation: pawSad 0.6s ease; }
@keyframes pandaLook {
	0% { transform: translateX(-50%) translateY(0) rotate(0); }
	50% { transform: translateX(-50%) translateY(4px) rotate(-4deg); }
	100% { transform: translateX(-50%) translateY(2px) rotate(0); }
}
@keyframes pandaHide {
	0% { transform: translateX(-50%) scale(1); }
	50% { transform: translateX(-50%) scale(1.04) translateY(4px); }
	100% { transform: translateX(-50%) scale(1) translateY(2px); }
}
@keyframes pandaType {
	0% { transform: translateX(-50%) rotate(0); }
	40% { transform: translateX(-50%) rotate(6deg) translateY(-3px); }
	100% { transform: translateX(-50%) rotate(0); }
}
@keyframes pandaWrong {
	0%, 100% { transform: translateX(-50%) rotate(0); }
	20% { transform: translateX(calc(-50% - 10px)) rotate(-8deg); }
	40% { transform: translateX(calc(-50% + 10px)) rotate(8deg); }
	60% { transform: translateX(calc(-50% - 8px)) rotate(-6deg); }
	80% { transform: translateX(calc(-50% + 8px)) rotate(6deg); }
}
@keyframes pawTap {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-6px); }
}
@keyframes pawSad {
	0%, 100% { transform: rotate(0); }
	50% { transform: rotate(-12deg); }
}
@keyframes pandaWow {
	0%, 100% { transform: translateX(-50%) scale(1); }
	40% { transform: translateX(-50%) scale(1.12) translateY(-8px); }
}
@keyframes pandaLove {
	0%, 100% { transform: translateX(-50%) rotate(0); }
	25% { transform: translateX(-50%) rotate(-10deg); }
	50% { transform: translateX(-50%) rotate(10deg); }
	75% { transform: translateX(-50%) rotate(-6deg); }
}
@keyframes pandaSend {
	0% { transform: translateX(-50%) translateY(0); }
	40% { transform: translateX(-50%) translateY(-14px) scale(1.08); }
	100% { transform: translateX(-50%) translateY(0); }
}
@keyframes pandaHigh {
	0% { transform: translateX(-50%) translateY(0) scale(1) rotate(0); }
	25% { transform: translateX(-50%) translateY(-42px) scale(1.22) rotate(-8deg); }
	50% { transform: translateX(-50%) translateY(-18px) scale(1.08) rotate(8deg); }
	75% { transform: translateX(-50%) translateY(-32px) scale(1.16) rotate(-4deg); }
	100% { transform: translateX(-50%) translateY(0) scale(1) rotate(0); }
}
@keyframes pandaHi {
	0%, 100% { transform: translateX(-50%) rotate(0); }
	20% { transform: translateX(-50%) rotate(-16deg) translateY(-6px); }
	40% { transform: translateX(-50%) rotate(14deg) translateY(-4px); }
	60% { transform: translateX(-50%) rotate(-10deg) translateY(-6px); }
	80% { transform: translateX(-50%) rotate(8deg); }
}
@keyframes logoWave {
	0%, 100% { transform: rotate(0); }
	15% { transform: rotate(14deg) translateY(-4px); }
	30% { transform: rotate(-10deg) translateY(-2px); }
	45% { transform: rotate(12deg) translateY(-4px); }
	60% { transform: rotate(-6deg); }
	75% { transform: rotate(8deg) translateY(-2px); }
}
@keyframes hiPop {
	0% { transform: scale(.4) translateY(8px); opacity: 0; }
	25% { transform: scale(1.1) translateY(-4px); opacity: 1; }
	75% { opacity: 1; }
	100% { transform: scale(.95) translateY(-10px); opacity: 0; }
}
