/* ═══════════════════════════════════════════════════════════════════════════
   배비 캐릭터 v5 — 공식 레퍼런스 치비 배달부 스타일
   크림+오렌지 헬멧 / 큰 갈색 눈 / 다크 장갑 / 배송 가방
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 씬 ─────────────────────────────────────────────────────────────────── */
.baeby-scene {
  position: relative;
  width: 170px;
  height: 250px;
  margin: 0 auto;
}

/* GLB 활성 시 CSS 아바타 숨김 */
.baeby-scene--glb-active .baeby-character,
.baeby-scene--glb-active .baeby-glow,
.baeby-scene--glb-active .baeby-shadow { visibility: hidden; }

.baeby-three-container { width: 200px; height: 250px; margin: 0 auto; }
.baeby-three-container[hidden] { display: none; }

.voice-auto-hint {
  margin: 10px 0 0; text-align: center; font-size: 0.78rem;
  color: #F47820; min-height: 1.2em; transition: color 0.2s; letter-spacing: 0.02em;
}
.baeby-glb-progress { width: 180px; margin: 6px auto 0; text-align: center; }
.baeby-glb-progress-bar { height: 4px; background: #F47820; border-radius: 2px; width: 0%; transition: width 0.2s; }
.baeby-glb-progress-label { display: block; font-size: 0.72rem; color: #F47820; margin-top: 3px; }

/* ── 배경 글로우 ─────────────────────────────────────────────────────────── */
.baeby-glow {
  position: absolute;
  inset: 20px 10px 0;
  background: radial-gradient(circle, rgba(255,193,80,0.22) 0%, rgba(244,120,32,0.12) 50%, transparent 70%);
  border-radius: 50%;
  animation: glowPulse 3.2s ease-in-out infinite;
  pointer-events: none;
}

.baeby-shadow {
  position: absolute;
  bottom: 2px; left: 50%;
  transform: translateX(-50%);
  width: 80px; height: 10px;
  background: rgba(0,0,0,0.25);
  border-radius: 50%;
  filter: blur(5px);
  transition: transform 0.3s, opacity 0.3s;
}

/* ── 캐릭터 루트 ─────────────────────────────────────────────────────────── */
.baeby-character {
  position: relative;
  width: 160px;
  height: 230px;
  margin: 0 auto;
  z-index: 1;
}

/* ── 전체 바디 컨테이너 ──────────────────────────────────────────────────── */
.baeby-body {
  position: relative;
  width: 94px;
  margin: 6px auto 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ═══════════════════════════════════════════════════════════════════════════
   HEAD — 치비 헬멧 (크림/화이트, 큰 비율)
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-head {
  width: 94px;
  height: 92px;
  border-radius: 52% 52% 44% 44% / 58% 58% 42% 42%;
  background: radial-gradient(ellipse at 40% 28%, #FFFFFF 0%, #F5EFE0 45%, #E8DFC8 80%, #D8CFBA 100%);
  position: relative;
  box-shadow:
    inset 0 5px 0 rgba(255,255,255,0.85),
    inset -5px -6px 18px rgba(180,160,110,0.25),
    0 6px 24px rgba(180,150,80,0.28),
    0 0 0 2px rgba(220,210,185,0.8);
  flex-shrink: 0;
  overflow: visible;
}

/* 헬멧 상단 하이라이트 줄 */
.baeby-head::before {
  content: "";
  position: absolute;
  top: 14px; left: 20px; right: 20px;
  height: 5px;
  background: rgba(255,255,255,0.65);
  border-radius: 4px;
}

/* 헬멧 하단 오렌지 테두리 밴드 */
.baeby-head::after {
  content: "";
  position: absolute;
  bottom: 4px; left: 6px; right: 6px;
  height: 7px;
  background: linear-gradient(90deg, #F47820, #FFB066 50%, #F47820);
  border-radius: 4px;
  opacity: 0.75;
}

/* ── 헬멧 번개 마크 ─────────────────────────────────────────────────────── */
.baeby-antenna {
  position: absolute;
  top: 8px; left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
  line-height: 1;
  z-index: 5;
  filter: drop-shadow(0 0 5px #FFD135) drop-shadow(0 1px 2px rgba(244,120,32,0.7));
  animation: boltPulse 2.8s ease-in-out infinite;
}

/* ── 머리카락 (헬멧 아래 다크 브라운) ───────────────────────────────────── */
.baeby-hair {
  position: absolute;
  bottom: -3px; left: 50%;
  transform: translateX(-50%);
  width: 84px; height: 16px;
  background: #3D2B1F;
  border-radius: 0 0 50% 50%;
  z-index: -1;
  /* 자연스러운 가닥 처리 */
  box-shadow: inset 0 3px 6px rgba(255,255,255,0.08);
}
/* 앞머리 */
.baeby-hair::before {
  content: "";
  position: absolute;
  top: -4px; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 12px;
  background: #3D2B1F;
  border-radius: 50% 50% 0 0;
  box-shadow: -20px 2px 0 0 #3D2B1F, 20px 2px 0 0 #3D2B1F;
}

/* ── 헤드셋 이어컵 ──────────────────────────────────────────────────────── */
.baeby-ear {
  position: absolute;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 35%, #FFB066 0%, #F47820 60%, #D96010 100%);
  border: 2px solid #C05010;
  top: 35px;
  box-shadow: 0 3px 8px rgba(200,80,0,0.35), inset 0 2px 0 rgba(255,255,255,0.25);
}
/* 이어컵 중심 원 */
.baeby-ear::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, #FFD135 0%, #F47820 100%);
  border: 1px solid #C05010;
}
.baeby-ear.left  { left:  -10px; }
.baeby-ear.right { right: -10px; }

/* ═══════════════════════════════════════════════════════════════════════════
   FACE AREA — 헬멧 바이저 안 얼굴
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-face-area {
  position: absolute;
  bottom: 14px; left: 50%;
  transform: translateX(-50%);
  width: 74px;
  height: 54px;
}

/* ── 눈썹 (다크 브라운) ─────────────────────────────────────────────────── */
.baeby-eye-wrap {
  position: absolute;
  top: 0px;
  width: 24px; height: 32px;
}
.baeby-eye-wrap.left  { left:  6px; }
.baeby-eye-wrap.right { right: 6px; }

.baeby-brow {
  width: 20px; height: 4px;
  background: #3D2B1F;
  border-radius: 4px 4px 2px 2px;
  position: absolute;
  top: -2px; left: 50%;
  transform: translateX(-50%);
  transition: transform 0.25s, opacity 0.25s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
}

/* ── 눈 — 큰 동그란 애니메이션 눈 (다크 브라운) ─────────────────────────── */
.baeby-eye {
  width: 24px; height: 28px;
  background: radial-gradient(circle at 42% 38%, #5C3D20 0%, #2C1810 45%, #0A0404 100%);
  border-radius: 50%;
  position: relative;
  box-shadow:
    0 3px 10px rgba(0,0,0,0.55),
    inset 0 -2px 4px rgba(0,0,0,0.4);
  animation: blink 5.2s ease-in-out infinite;
  transform-origin: 50% 50%;
  overflow: visible;
}

/* 큰 흰 하이라이트 (왼쪽 위) */
.baeby-shine {
  width: 9px; height: 11px;
  background: rgba(255,255,255,0.92);
  border-radius: 50%;
  position: absolute;
  top: 3px; left: 4px;
}
/* 작은 보조 하이라이트 (오른쪽 아래) */
.baeby-eye::after {
  content: "";
  position: absolute;
  bottom: 6px; right: 4px;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: rgba(255,255,255,0.55);
}

/* ── 코 ─────────────────────────────────────────────────────────────────── */
.baeby-nose {
  width: 8px; height: 5px;
  background: rgba(180, 100, 50, 0.3);
  border-radius: 50%;
  position: absolute;
  top: 28px; left: 50%;
  transform: translateX(-50%);
}

/* ── 볼 터치 ────────────────────────────────────────────────────────────── */
.baeby-cheek {
  position: absolute;
  width: 16px; height: 10px;
  background: rgba(255, 130, 100, 0.5);
  border-radius: 50%;
  top: 32px;
  opacity: 0;
  transition: opacity 0.35s;
  filter: blur(2px);
}
.baeby-cheek.left  { left:  2px; }
.baeby-cheek.right { right: 2px; }

/* ── 입 (부드러운 핑크 미소) ────────────────────────────────────────────── */
.baeby-mouth {
  width: 24px; height: 10px;
  border-bottom: 3px solid #D05060;
  border-left:   2px solid rgba(208,80,96,0.4);
  border-right:  2px solid rgba(208,80,96,0.4);
  border-top: none;
  border-radius: 0 0 14px 14px;
  position: absolute;
  bottom: 2px; left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 2px 6px rgba(208,80,96,0.3);
  transition: all 0.22s;
  transform-origin: 50% 100%;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NECK — 피부/크림
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-neck {
  width: 20px; height: 10px;
  background: linear-gradient(180deg, #E8DFC8, #D8CFBA);
  border-left:  1px solid rgba(200,180,140,0.3);
  border-right: 1px solid rgba(200,180,140,0.3);
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   TORSO — 크림/화이트 배달 점프수트
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-torso {
  width: 82px; height: 60px;
  background: linear-gradient(170deg, #F8F2E4 0%, #EDE5D0 50%, #D8CFBA 100%);
  border-radius: 8px 8px 12px 12px;
  position: relative;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.75),
    inset -3px -5px 14px rgba(0,0,0,0.1),
    0 5px 18px rgba(0,0,0,0.18);
  border: 1.5px solid #D0C8B0;
  flex-shrink: 0;
  overflow: visible;
}

/* 어깨 캡 */
.baeby-torso::before,
.baeby-torso::after {
  content: "";
  position: absolute;
  top: -5px;
  width: 18px; height: 14px;
  background: linear-gradient(160deg, #F8F2E4, #EDE5D0);
  border-radius: 50% 50% 0 0;
  border: 1.5px solid #D0C8B0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.baeby-torso::before { left:  -6px; }
.baeby-torso::after  { right: -6px; }

/* ── 가슴 버클/배지 ─────────────────────────────────────────────────────── */
.baeby-chest-panel {
  position: absolute;
  top: 14px; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 20px;
  background: linear-gradient(145deg, #4ECDC4, #3ABAB2);
  border-radius: 6px;
  border: 1.5px solid #2A9A92;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2), inset 0 1px 3px rgba(255,255,255,0.45);
  display: flex; align-items: center; justify-content: space-evenly;
}

.baeby-led { width: 5px; height: 5px; border-radius: 50%; }
.baeby-led.led-1 { background: #FFD135; box-shadow: 0 0 5px #FFD135; }
.baeby-led.led-2 { background: #FFFFFF; box-shadow: 0 0 5px rgba(255,255,255,0.9); animation: ledBlink 2.2s ease-in-out infinite; }
.baeby-led.led-3 { background: #F47820; box-shadow: 0 0 5px #F47820; animation: ledBlink 2.2s 0.8s ease-in-out infinite; }

/* 오렌지 사선 하네스 스트랩 */
.baeby-badge {
  position: absolute;
  top: 8px; left: 0; right: 0; bottom: 0;
  pointer-events: none;
  overflow: hidden;
  border-radius: 0 0 10px 10px;
}
.baeby-badge::before {
  content: "";
  position: absolute;
  top: 8px; left: 6px;
  width: 3px; height: 40px;
  background: linear-gradient(180deg, #F47820, #FFB066);
  border-radius: 2px;
  transform: rotate(22deg);
  transform-origin: top center;
  opacity: 0.7;
}
.baeby-badge::after {
  content: "";
  position: absolute;
  top: 8px; right: 6px;
  width: 3px; height: 40px;
  background: linear-gradient(180deg, #F47820, #FFB066);
  border-radius: 2px;
  transform: rotate(-22deg);
  transform-origin: top center;
  opacity: 0.7;
}

/* ═══════════════════════════════════════════════════════════════════════════
   HIPS — 오렌지 벨트
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-hips {
  width: 68px; height: 16px;
  background: linear-gradient(180deg, #F47820 0%, #D96010 100%);
  border-radius: 3px 3px 8px 8px;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(244,120,32,0.4), inset 0 1px 0 rgba(255,255,255,0.28);
  position: relative;
}
/* 버클 */
.baeby-hips::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 16px; height: 9px;
  background: linear-gradient(145deg, #FFD135, #FFB800);
  border-radius: 3px;
  border: 1.5px solid #CC9400;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
}

/* ═══════════════════════════════════════════════════════════════════════════
   LEGS — 크림 바지 + 오렌지 트림 부츠
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-feet {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/* 허벅지 */
.baeby-foot {
  width: 24px;
  height: 28px;
  background: linear-gradient(180deg, #EDE5D0, #D8CFBA);
  border-radius: 6px 6px 4px 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.14);
  border: 1px solid #D0C0A0;
}

/* 정강이 */
.baeby-shin {
  width: 20px; height: 22px;
  background: linear-gradient(180deg, #D8CFBA, #C8BFA8);
  border-radius: 3px 3px 0 0;
  margin-top: 2px;
  border-left:  1px solid #C0B090;
  border-right: 1px solid #C0B090;
}

/* 부츠 */
.baeby-shoe {
  width: 28px; height: 14px;
  background: linear-gradient(160deg, #FFFFFF 0%, #F5EFE0 55%, #E8DFCC 100%);
  border-radius: 5px 5px 9px 9px;
  border: 1.5px solid #D8CFBA;
  box-shadow: 0 3px 8px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.6);
  position: relative;
  overflow: hidden;
}
/* 오렌지 부츠 밑단 */
.baeby-shoe::after {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 5px;
  background: linear-gradient(90deg, #F47820, #FFB066 50%, #F47820);
  border-radius: 0 0 7px 7px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ARMS — 크림 소매 + 오렌지 커프 + 다크 장갑
   ═══════════════════════════════════════════════════════════════════════════ */
.baeby-arm {
  position: absolute;
  top: 107px;
  width: 12px; height: 32px;
  background: linear-gradient(180deg, #EDE5D0, #D8CFBA);
  border-radius: 6px;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 2px 6px rgba(0,0,0,0.16), 0 0 0 1px rgba(200,180,140,0.3);
  border: 1px solid #D0C0A0;
}

/* 어깨 관절 */
.baeby-arm::before {
  content: "";
  width: 16px; height: 16px;
  border-radius: 50%;
  background: radial-gradient(circle, #F8F2E4 0%, #EDE5D0 60%, #D8CFBA 100%);
  border: 1.5px solid #D0C0A0;
  position: absolute;
  top: -6px; left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 2px 5px rgba(0,0,0,0.18);
}

.baeby-arm.left  { left:  -14px; transform-origin: top center; transform: rotate(8deg);  }
.baeby-arm.right { right: -14px; transform-origin: top center; transform: rotate(-8deg); }

/* 아래팔 */
.baeby-forearm {
  width: 11px; height: 22px;
  background: linear-gradient(180deg, #D8CFBA, #C8BFA8);
  border-radius: 4px;
  position: absolute;
  bottom: -4px; left: 50%;
  transform: translateX(-50%);
  border: 1px solid #C0B090;
  overflow: hidden;
}
/* 오렌지 커프 */
.baeby-forearm::after {
  content: "";
  position: absolute;
  bottom: 0; left: -1px; right: -1px;
  height: 7px;
  background: linear-gradient(180deg, #F47820, #D96010);
  border-radius: 0 0 3px 3px;
}

/* 장갑 (다크 차콜) */
.baeby-hand {
  width: 15px; height: 15px;
  background: radial-gradient(circle at 40% 35%, #3D3530 20%, #1E1A18 100%);
  border-radius: 50% 50% 45% 45%;
  border: 1.5px solid #0E0C0B;
  position: absolute;
  bottom: -18px; left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 3px 7px rgba(0,0,0,0.45);
}

/* ── 배송 가방 ──────────────────────────────────────────────────────────── */
.baeby-bag {
  position: absolute;
  right: -26px;
  top: 118px;
  width: 32px; height: 30px;
  background: linear-gradient(145deg, #F8F2E4, #EDE5D0);
  border-radius: 6px;
  border: 2px solid #D0C0A0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.6);
  z-index: 2;
}
/* 가방 스트랩 */
.baeby-bag::before {
  content: "";
  position: absolute;
  top: -18px; left: 6px;
  width: 3px; height: 22px;
  background: #F47820;
  border-radius: 1.5px;
  transform: rotate(12deg);
  transform-origin: bottom center;
}
/* 가방 번개 로고 */
.baeby-bag::after {
  content: "⚡";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  font-size: 13px;
  filter: drop-shadow(0 0 3px #FFD135);
}
/* 가방 오렌지 하단 밴드 */
.baeby-bag {
  position: absolute;
  right: -26px;
  top: 118px;
  width: 32px; height: 30px;
  background:
    linear-gradient(180deg, transparent 68%, #F47820 68%) no-repeat,
    linear-gradient(145deg, #F8F2E4, #EDE5D0);
  border-radius: 6px;
  border: 2px solid #D0C0A0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.6);
  z-index: 2;
}

/* ── 생각 점 ─────────────────────────────────────────────────────────────── */
.baeby-think-dots {
  position: absolute;
  top: 20px; right: -36px;
  display: none;
  flex-direction: column;
  gap: 5px; align-items: flex-end;
}
.baeby-think-dots span {
  background: #F47820; border-radius: 50%; display: block;
  animation: dotFloat 1.4s ease-in-out infinite;
  box-shadow: 0 0 4px rgba(244,120,32,0.5);
}
.baeby-think-dots span:nth-child(1) { width: 5px;  height: 5px; }
.baeby-think-dots span:nth-child(2) { width: 7px;  height: 7px;  animation-delay: 0.15s; }
.baeby-think-dots span:nth-child(3) { width: 9px;  height: 9px;  animation-delay: 0.3s;  }

/* ── 파티클 ──────────────────────────────────────────────────────────────── */
.baeby-particles { position: absolute; inset: 0; pointer-events: none; overflow: visible; }
.baeby-particle {
  position: absolute; font-size: 14px;
  animation: particleFly 0.9s ease-out forwards; opacity: 0;
}

/* ── 타이핑 커서 ─────────────────────────────────────────────────────────── */
.speech-bubble.typing::after {
  content: "▋"; animation: cursorBlink 0.8s step-end infinite; margin-left: 2px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   상태별 스타일
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── IDLE ── */
.baeby-character[data-state="idle"] .baeby-body  { animation: float 3.2s ease-in-out infinite; }
.baeby-character[data-state="idle"] .baeby-cheek { opacity: 0.5; }
.baeby-character[data-state="idle"] .baeby-eye   { animation: blink 5.2s ease-in-out infinite; }

/* ── LISTENING ── */
.baeby-character[data-state="listening"] .baeby-antenna {
  animation: boltPulse 0.5s ease-in-out infinite;
}
.baeby-character[data-state="listening"] .baeby-mouth { animation: mouthTalk 0.38s ease-in-out infinite; }
.baeby-character[data-state="listening"] .baeby-arm.left { animation: waveLeft 0.5s ease-in-out infinite; }
.baeby-character[data-state="listening"] .baeby-cheek { opacity: 0.75; }
.baeby-character[data-state="listening"] .baeby-eye {
  background: radial-gradient(circle at 42% 38%, #7B5D35 0%, #4A3218 45%, #1A0A04 100%);
  box-shadow: 0 3px 10px rgba(0,0,0,0.55), 0 0 12px rgba(244,120,32,0.4);
}

/* ── THINKING ── */
.baeby-character[data-state="thinking"] .baeby-think-dots { display: flex; }
.baeby-character[data-state="thinking"] .baeby-brow {
  transform: translateX(-50%) scaleX(0.65) translateY(2px); opacity: 0.65;
}
.baeby-character[data-state="thinking"] .baeby-body { animation: wobble 1.6s ease-in-out infinite; }

/* ── ROULETTE ── */
.baeby-character[data-state="roulette"] .baeby-body      { animation: jumpSpin 0.55s ease-in-out infinite; }
.baeby-character[data-state="roulette"] .baeby-shadow    { animation: shadowSquash 0.55s ease-in-out infinite; }
.baeby-character[data-state="roulette"] .baeby-arm.left  { animation: waveLeft 0.35s ease-in-out infinite; }
.baeby-character[data-state="roulette"] .baeby-arm.right { animation: waveRight 0.35s ease-in-out infinite; }
.baeby-character[data-state="roulette"] .baeby-antenna   { animation: boltPulse 0.3s ease-in-out infinite; }
.baeby-character[data-state="roulette"] .baeby-eye {
  background: radial-gradient(circle at 42% 38%, #8B6020 0%, #5C3D10 45%, #1A0A04 100%);
  box-shadow: 0 3px 10px rgba(0,0,0,0.55), 0 0 10px rgba(255,200,0,0.5);
}

/* ── RECOMMEND ── */
.baeby-character[data-state="recommend"] .baeby-cheek     { opacity: 0.9; }
.baeby-character[data-state="recommend"] .baeby-arm.right { transform: rotate(-65deg); }
.baeby-character[data-state="recommend"] .baeby-mouth {
  height: 12px; border-radius: 0 0 14px 14px;
  border-color: rgba(244,120,32,0.85);
  box-shadow: 0 2px 7px rgba(244,120,32,0.4);
}
.baeby-character[data-state="recommend"] .baeby-body { animation: celebrateBounce 0.65s ease; }
.baeby-character[data-state="recommend"] .baeby-eye {
  background: radial-gradient(circle at 42% 38%, #7B5230 0%, #4A2C10 45%, #1A0804 100%);
  box-shadow: 0 3px 10px rgba(0,0,0,0.55), 0 0 10px rgba(244,120,32,0.4);
}

/* ── ORDER READY ── */
/* 화면 왼팔: 대각선 위로 올려 엄지척 */
.baeby-character[data-state="orderReady"] .baeby-arm.left {
  transform: rotate(-115deg);
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* 화면 오른팔: 자연스럽게 내려뜨림 */
.baeby-character[data-state="orderReady"] .baeby-arm.right {
  transform: rotate(20deg);
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* 엄지 이모지: 왼팔 손끝에 붙어 함께 움직임 */
.baeby-character[data-state="orderReady"] .baeby-arm.left .baeby-hand::after {
  content: "👍";
  position: absolute;
  top: -14px; left: 50%;
  transform: translateX(-50%);
  font-size: 1.2rem; line-height: 1;
  animation: thumbPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.baeby-character[data-state="orderReady"] .baeby-cheek { opacity: 0.9; }

/* ── ERROR ── */
.baeby-character[data-state="error"] .baeby-head {
  background: radial-gradient(ellipse at 40% 28%, #FFE8D8 0%, #F5C8B0 45%, #E09080 80%, #CC7060 100%);
  box-shadow: inset 0 3px 0 rgba(255,255,255,0.5), 0 0 0 2px rgba(248,80,80,0.45);
}
.baeby-character[data-state="error"] .baeby-body  { animation: shake 0.4s ease; }
.baeby-character[data-state="error"] .baeby-eye {
  background: radial-gradient(circle at 42% 38%, #8B1010 0%, #5C0808 45%, #1A0000 100%);
  box-shadow: 0 3px 10px rgba(0,0,0,0.55), 0 0 12px rgba(255,64,64,0.5);
}
.baeby-character[data-state="error"] .baeby-mouth {
  border-color: #CC3333;
  border-bottom: none;
  border-top: 3px solid #CC3333;
  border-radius: 14px 14px 0 0;
  bottom: auto; top: 8px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   KEYFRAMES
   ═══════════════════════════════════════════════════════════════════════════ */
@keyframes glowPulse {
  0%,100% { opacity:0.5; transform:scale(1); }
  50%     { opacity:1;   transform:scale(1.06); }
}
@keyframes float {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-9px); }
}
@keyframes blink {
  0%,92%,100% { transform:scaleY(1); }
  96%         { transform:scaleY(0.05); }
}
@keyframes mouthTalk {
  0%,100% { transform:translateX(-50%) scaleY(1); }
  50%     { transform:translateX(-50%) scaleY(1.6) scaleX(0.8); }
}
@keyframes jumpSpin {
  0%,100% { transform:translateY(0) rotate(0deg); }
  30%     { transform:translateY(-18px) rotate(-5deg); }
  60%     { transform:translateY(-9px) rotate(5deg); }
}
@keyframes shadowSquash {
  0%,100% { transform:translateX(-50%) scaleX(1); opacity:0.25; }
  50%     { transform:translateX(-50%) scaleX(0.55); opacity:0.1; }
}
@keyframes wobble {
  0%,100% { transform:rotate(0deg); }
  25%     { transform:rotate(-3deg); }
  75%     { transform:rotate(3deg); }
}
@keyframes waveLeft {
  0%,100% { transform:rotate(8deg); }
  50%     { transform:rotate(45deg); }
}
@keyframes waveRight {
  0%,100% { transform:rotate(-8deg); }
  50%     { transform:rotate(-45deg); }
}
@keyframes boltPulse {
  0%,100% { filter:drop-shadow(0 0 5px #FFD135) drop-shadow(0 1px 2px rgba(244,120,32,0.7)); transform:translateX(-50%) scale(1); }
  50%     { filter:drop-shadow(0 0 12px #FFD135) drop-shadow(0 2px 4px rgba(244,120,32,0.9)); transform:translateX(-50%) scale(1.15); }
}
@keyframes dotFloat {
  0%,100% { opacity:0.35; transform:translateY(0); }
  50%     { opacity:1;    transform:translateY(-6px); }
}
@keyframes celebrateBounce {
  0%   { transform:scale(1); }
  40%  { transform:scale(1.07); }
  100% { transform:scale(1); }
}
@keyframes thumbPop {
  0%   { transform:translateX(-50%) scale(0) rotate(-20deg); }
  70%  { transform:translateX(-50%) scale(1.3) rotate(5deg); }
  100% { transform:translateX(-50%) scale(1) rotate(0); }
}
@keyframes shake {
  0%,100% { transform:translateX(0); }
  25%     { transform:translateX(-6px); }
  75%     { transform:translateX(6px); }
}
@keyframes particleFly {
  0%   { opacity:1; transform:translate(0,0) scale(1); }
  100% { opacity:0; transform:translate(var(--px),var(--py)) scale(0.3); }
}
@keyframes cursorBlink { 50%{ opacity:0; } }
@keyframes ledBlink {
  0%,100% { opacity:1; }
  50%     { opacity:0.3; }
}