/* 角色：所有姿态都在 SVG 内逐帧计算（见 js/bot.js），这里只管定位、气泡与悬停反馈 */
.bot { position: absolute; width: var(--size); height: var(--size); pointer-events: auto; -webkit-tap-highlight-color: transparent; }
.bot svg { display: block; overflow: visible; }
/* 层级：影子（HTML）→ hover 层（CSS 过渡）→ fig（每帧 CSS transform，原点在脚底）→ SVG。
   整体动作全部走合成层，SVG 只在表情 / 视线 / 眨眼变化时重绘 */
.bot__hover, .bot__fig { position: absolute; inset: 0; transform-origin: 50% 100%; }
/* 不加 backface-visibility:hidden、不用 translate3d：旋转中的合成层在部分 GPU 上会被裁掉一个三角（首页紫色角色身上出现过一块底色三角） */
.bot__fig { will-change: transform; }
.bot__hover { transition: transform 520ms var(--ease-spring); }
.hero__bots .bot:hover .bot__hover { transform: scale(1.04); }
.hero__bots .bot:active .bot__hover { transform: scale(0.97); transition-duration: 120ms; }
.bot__shadow { position: absolute; left: 12%; width: 76%; top: 96.5%; height: 13%; border-radius: 50%; pointer-events: none; will-change: transform;
  background: radial-gradient(closest-side, rgba(27,26,23,.2), rgba(27,26,23,0)); }
/* 随身弹珠：脚边浮着的那一颗记忆 */
.bot__orb { position: absolute; left: 81%; top: 73%; width: 18%; height: 18%; border-radius: 50%; will-change: transform; pointer-events: none;
  background: radial-gradient(circle at 33% 29%, #fff 0 9%, rgba(255,255,255,0) 22%), radial-gradient(circle at 36% 30%, var(--c1), var(--c2) 60%, var(--c3)); }

.bot__bubble {
  position: absolute; left: 50%; bottom: calc(100% + 10px); z-index: 3; white-space: nowrap;
  padding: 8px 13px 9px; border-radius: 16px 16px 16px 5px; background: var(--surface); color: var(--text-1);
  font-size: 13px; line-height: 1.2; font-weight: 520; letter-spacing: -0.005em;
  box-shadow: 0 10px 28px -10px rgba(20,18,15,.22), 0 2px 6px rgba(20,18,15,.06), inset 0 0 0 1px rgba(28,25,20,.05);
  pointer-events: none; opacity: 0; transform: translate(-28%, 8px) scale(.86); transform-origin: 0 100%;
  transition: opacity 180ms var(--ease-out), transform 260ms var(--ease-out);
}
.bot__bubble.is-on { opacity: 1; transform: translate(-28%, 0) scale(1); transition: opacity 200ms var(--ease-out), transform 520ms var(--ease-spring); }
.bot--agent .bot__bubble { background: var(--ink); color: #F3F1EC; box-shadow: 0 10px 28px -10px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.06); }
.bot--right .bot__bubble { border-radius: 16px 16px 5px 16px; transform: translate(-72%, 8px) scale(.86); transform-origin: 100% 100%; }
.bot--right .bot__bubble.is-on { transform: translate(-72%, 0) scale(1); }
/* 面朝左的角色：随身弹珠放在左脚边 */
.bot--orb-left .bot__orb { left: 1%; }