/* ============================================================
 * zhixia-avatar.css —— 知夏虚拟角色挂载点样式
 * （2026-09-02 输入框小头像已移除，现存：欢迎页舞台 / 台词文字）
 * ============================================================ */

/* ---------- 欢迎页角色舞台 ---------- */
.wc-avatar-stage {
  width: 110px;
  height: 110px;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 50%;
  overflow: visible;
  transition: transform 0.18s ease;
}

.wc-avatar-stage:hover {
  transform: scale(1.05);
}

.wc-avatar-stage svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

/* 欢迎页问候区文字容器 */
.wc-greeting-text {
  text-align: center;
}

/* 台词文字（角色点击反馈，无气泡打字机效果）
 * 必须 fixed：JS 用 getBoundingClientRect 视口坐标定位，absolute 会锚到文档原点，
 * 页面滚动后文字会跑到角色上方 scrollTop 处（真机复现：滚到 Home 页底部点角色，文字出现在五维成长区）。
 * 文字显隐由 JS 打字机逐字控制，这里只做 opacity 淡入淡出与定位。 */
.zhixia-speech-bubble {
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%) translateY(-45px);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-primary, #8B5A4A);
  white-space: nowrap;
  letter-spacing: 0.5px;
  /* 无气泡，靠白晕保证叠在页面内容上仍可读 */
  text-shadow:
    0 0 4px var(--color-bg, #FFFEF9),
    0 0 12px var(--color-bg, #FFFEF9),
    0 1px 3px rgba(61, 50, 41, 0.12);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.18s ease;
  z-index: 10;
}

.zhixia-speech-bubble.visible {
  opacity: 1;
}

/* 移动端适配 */
@media (max-width: 768px) {
  .wc-avatar-stage {
    width: 84px;
    height: 84px;
  }
}