/* 小分 v4 — 人.jpg 抠图形象（2026-08-18 用户指定替换像素版 v3）
 * 交互：自动避鼠标（光标靠近滑开，离开归位）；点击小跳已废弃
 * fixed 右下角最上层，随屏幕宽度自适应缩放
 */

/* ── 悬浮根：位移由 JS 控制（避鼠标），transition 平滑滑行 ── */
#companion-root {
  position: fixed;
  right: 10px;
  bottom: 8px;
  z-index: 9999;
  pointer-events: none; /* 不挡任何页面内容 */
  transition: transform 0.3s ease-out;
}

.devil-float-box {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  justify-content: flex-end;
  --s: 1;
  transform: scale(var(--s));
  transform-origin: bottom right;
}
/* 自适应：平板竖屏/窄窗缩小一档，手机再缩 */
@media (max-width: 899px) { .devil-float-box { --s: 0.8; } }
@media (max-width: 599px) { .devil-float-box { --s: 0.62; } }

/* ── 舞台：抠图素材比例 346:512 ── */
.stage {
  position: relative;
  width: 150px;
  height: 222px;
  pointer-events: none;
}

.xiaofen-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: auto; /* 照片素材，不做像素缩放 */
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.5));
  animation: bobSoft 3.4s ease-in-out infinite;
}
@keyframes bobSoft {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* 地面投影随浮动呼吸 */
.ground-shadow {
  position: absolute;
  left: 50%;
  bottom: -2px;
  transform: translateX(-50%);
  width: 66px;
  height: 12px;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 70%);
  animation: shadowPulse 3.4s ease-in-out infinite;
}
@keyframes shadowPulse {
  0%, 100% { transform: translateX(-50%) scale(1); opacity: 0.85; }
  50% { transform: translateX(-50%) scale(0.78); opacity: 0.45; }
}

/* 漂浮金粉（沿用验收版光效语言） */
.sparkle {
  position: absolute;
  width: 4px;
  height: 4px;
  background: #ffeaa7;
  box-shadow: 0 0 4px #ffeaa7;
  animation: sparkDrop 1.8s steps(8) infinite;
}
.s1 { left: 34px; top: 130px; animation-delay: 0s; }
.s2 { right: 34px; top: 140px; animation-delay: 0.6s; }
@keyframes sparkDrop {
  0% { opacity: 0; transform: translateY(-4px); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: translateY(18px); }
}

/* ── 待机心情贴纸（真实小分表情抠图）+ 身体动作（CSS 动画） ──
 * 待机 ≥15s 起、每 10~20s 随机换一组「动作 + 表情」配对（JS 驱动）。
 * 动作 = 作用在 .xiaofen-img 上的关键帧；表情 = .mood-sticker 内 moods/face-*.png 抠图。 */
.mood-sticker {
  position: absolute;
  top: -10px;
  left: -12px;
  width: 60px;
  height: 60px;
  background: #0d2138;
  border: 3px solid #fff;
  border-radius: 10px;
  box-shadow: 0 3px 0 #000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(0.6) translateY(6px);
  transition: opacity .18s ease, transform .18s cubic-bezier(.34,1.56,.64,1);
  pointer-events: none;
}
.mood-sticker.show { opacity: 1; transform: scale(1) translateY(0); }
.mood-sticker .mood-face {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: auto;
  border-radius: 6px;
}

.xiaofen-img { transform-origin: bottom center; }
.xiaofen-img.act-normal    { animation: normalSway 3.2s ease-in-out infinite; }
.xiaofen-img.act-happy     { animation: happyBounce 0.7s ease-in-out infinite; }
.xiaofen-img.act-sad       { animation: sadDroop 2.2s ease-in-out infinite; }
.xiaofen-img.act-surprised { animation: surprisedLean 0.65s ease-in-out infinite; }
.xiaofen-img.act-confused  { animation: confusedTilt 1.6s ease-in-out infinite; }
.xiaofen-img.act-naughty   { animation: smugSway 1.1s ease-in-out infinite; }

@keyframes normalSway {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-3px) rotate(-1.5deg); }
}
@keyframes happyBounce {
  0%, 100% { transform: translateY(0) scale(1); }
  30% { transform: translateY(-10px) scaleY(1.04) scaleX(0.98); }
  60% { transform: translateY(0) scaleY(0.96) scaleX(1.02); }
  80% { transform: translateY(-4px) scaleY(1.02) scaleX(0.99); }
}
@keyframes sadDroop {
  0%, 100% { transform: translateY(0) rotate(0) scaleY(1); }
  50% { transform: translateY(7px) rotate(2deg) scaleY(0.96); }
}
@keyframes surprisedLean {
  0%, 100% { transform: translateY(0) rotate(0); }
  30% { transform: translateY(-9px) rotate(-8deg); }
  60% { transform: translateY(-3px) rotate(3deg); }
}
@keyframes confusedTilt {
  0%, 100% { transform: rotate(0); }
  30% { transform: rotate(-12deg); }
  55% { transform: rotate(12deg); }
  80% { transform: rotate(-4deg); }
}
@keyframes smugSway {
  0%, 100% { transform: rotate(0) translateY(0); }
  25% { transform: rotate(-5deg) translateY(-3px); }
  75% { transform: rotate(5deg) translateY(-3px); }
}

/* ── 对话气泡：深色像素气泡，尾巴指向右侧小分（沿用验收版） ── */
#companion.nes-balloon {
  background: #0d2138;
  color: #e8f4fb;
  font-size: 13px;
  line-height: 2;
  padding: 14px 18px;
  max-width: 280px;
  margin: 0 0 12px;
  /* round4 P0-1：气泡零交互，pointer-events:none 不挡页面点击（右下角同类死区根除） */
  pointer-events: none;
}
#companion.nes-balloon::before,
#companion.nes-balloon::after { background-color: #0d2138; }
#companion.nes-balloon.from-right::before {
  border-right: 4px solid #0d2138;
  border-left: 4px solid #0d2138;
}
#companion.nes-balloon.from-right::after {
  box-shadow: -4px 0, 4px 0, 4px 4px #0d2138, 0 4px, 8px 4px, 4px 8px, 8px 8px;
}

/* ── 弹窗迷你小分（克隆悬浮舞台缩小版；scene6 .ri-mini-box / runtime .mini-box 100×110 内） ── */
.stage.mini {
  width: 72px;
  height: 106px;
}
.stage.mini .xiaofen-img { animation: none; }
.stage.mini .mood-sticker { display: none; }
#ri-mini-box, #postadd-body { display: flex; align-items: flex-end; justify-content: center; }
#postadd-body .stage.mini { flex: 0 0 auto; }

/* ── 手机档折叠（G3，2026-09-30）：≤600px 小分收成角落按钮，点开弹出、点别处收起 ── */
.companion-tab {
  display: none; position: fixed; right: 10px; bottom: 10px; z-index: 9998;
  width: 46px; height: 46px; border-radius: 50%; border: 3px solid #fff;
  box-shadow: 0 3px 0 #000; background: #0d2138; padding: 2px; cursor: pointer;
}
.companion-tab img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
@media (max-width: 600px) {
  .companion-tab { display: block; }
  #companion-root .devil-float-box { display: none; }
  #companion-root.open .devil-float-box { display: flex; }
  #companion-root.open .companion-tab { display: none; }
}