mocode-pet-app 1.4.0 → 1.7.0

package/dist/assets/pets/11-slime-blob.motion.css

@@ -0,0 +1,44 @@
+/* 史莱姆(slime-blob)专属演出:利用"形变"这个史莱姆独有的视觉语言覆盖通用规则。
+ * 史莱姆没有 arm-left/right/tail 等 id,通用规则里依赖这些 id 的动画(如 tool_call 摆臂、
+ * flustered 摆臂)对它本来就不生效,这里改用挤压/压扁形变来填补对应状态的演出。 */
+
+/* ── mood-tired:身体压扁变矮,模拟疲惫瘫软,替代通用的"下沉" ── */
+@keyframes slime-tired-squash {
+  0%, 100% { transform: scaleY(1) scaleX(1); }
+  50% { transform: scaleY(0.82) scaleX(1.08); }
+}
+.mood-tired #pet-body-group {
+  animation: slime-tired-squash 3.6s ease-in-out infinite;
+  transform-origin: 128px 200px;
+}
+
+/* ── tool_call:挤压弹跳形变代替通用双臂摆动 ── */
+@keyframes slime-tool-bounce {
+  0%, 100% { transform: scaleY(1) scaleX(1); }
+  30% { transform: scaleY(0.85) scaleX(1.12); }
+  60% { transform: scaleY(1.12) scaleX(0.9); }
+}
+.pet-tool #pet-body-group {
+  animation: slime-tool-bounce 0.5s ease-in-out infinite;
+  transform-origin: 128px 200px;
+}
+
+/* ── idle:呼吸感的轻微鼓起收缩,比通用的上下浮动更软糯 ── */
+@keyframes slime-idle-breathe {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.03); }
+}
+.pet-idle #pet-body-group {
+  animation: slime-idle-breathe 2.8s ease-in-out infinite;
+  transform-origin: 128px 138px;
+}
+
+/* ── mood-urging:急促地一颤一颤,像在催你快点 ── */
+@keyframes slime-urging-jiggle {
+  0%, 100% { transform: scaleY(1); }
+  50% { transform: scaleY(0.92); }
+}
+.mood-urging #pet-body-group {
+  animation: slime-urging-jiggle 0.45s ease-in-out infinite;
+  transform-origin: 128px 200px;
+}

package/dist/assets/pets/11-slime-blob.svg

@@ -8,7 +8,7 @@
       <feGaussianBlur stdDeviation="3" result="blur"/>
       <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
     </filter>
-  </defs>
+  </defs>
   <g id="pet-body-group">
 
   <!-- Blob body -->
@@ -31,7 +31,7 @@
   </g>
 
   <!-- Smile -->
-  <path d="M110 156 Q128 170 146 156" stroke="#0a1420" stroke-width="3.5" fill="none" stroke-linecap="round"/>
+  <path id="pet-mouth" d="M110 156 Q128 170 146 156" stroke="#0a1420" stroke-width="3.5" fill="none" stroke-linecap="round"/>
 
   <!-- Drips -->
   <path d="M84 216 Q84 232 92 232 Q100 232 96 216 Z" fill="url(#blobGrad)"/>
@@ -39,5 +39,5 @@
 
   <!-- Highlight -->
   <ellipse cx="92" cy="86" rx="18" ry="10" fill="#ffffff" fill-opacity="0.25"/>
-  </g>
+  </g>
 </svg>

package/dist/assets/pets/12-ghost-byte.motion.css

@@ -0,0 +1,73 @@
+/* 字节幽灵(ghost-byte)专属演出:体现"幽灵"的飘忽与半透明质感,所有动作都是"飘"或"闪"。
+ * SVG 自带的 ghost body 内联 animateTransform(translateY 0/-8/0) 在我们用 CSS 接管时会被覆盖,
+ * 因此 .pet-idle 必须保留一个同款飘浮动画,否则该状态会失去律动;
+ * #pet-arm-* 不存在,tool_call 用整体半透明闪烁代替双臂摆动。 */
+
+/* ── idle:保留原 SVG 飘浮风格的垂直浮动(替换内置动画) ── */
+@keyframes ghost-idle-float {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-8px); }
+}
+.pet-idle #pet-body-group {
+  animation: ghost-idle-float 2.4s ease-in-out infinite;
+}
+
+/* ── thinking:垂直 + 水平小幅漂移,像在"搜魂" ── */
+@keyframes ghost-think-drift {
+  0%, 100% { transform: translate(0, 0); }
+  25% { transform: translate(-3px, -4px); }
+  50% { transform: translate(0, -8px); }
+  75% { transform: translate(3px, -4px); }
+}
+.pet-thinking #pet-body-group {
+  animation: ghost-think-drift 2.8s ease-in-out infinite;
+}
+
+/* ── tool_call:身体快速半透明闪烁 + 轻微抖动(代替双臂) ── */
+@keyframes ghost-tool-flicker {
+  0%, 100% { transform: translateX(0); opacity: 1; }
+  20% { transform: translateX(-3px); opacity: 0.5; }
+  40% { transform: translateX(3px); opacity: 1; }
+  60% { transform: translateX(-2px); opacity: 0.6; }
+  80% { transform: translateX(2px); opacity: 1; }
+}
+.pet-tool #pet-body-group {
+  animation: ghost-tool-flicker 0.6s ease-in-out infinite;
+}
+
+/* ── mood-urging:浮得更高 + 嘴部快速张合(惊吓催促) ── */
+@keyframes ghost-urging-rise {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-14px); }
+}
+@keyframes ghost-urging-mouth {
+  0%, 100% { transform: scaleY(1); }
+  50% { transform: scaleY(1.8); }
+}
+.mood-urging #pet-body-group {
+  animation: ghost-urging-rise 0.5s ease-in-out infinite;
+}
+.mood-urging #pet-mouth {
+  animation: ghost-urging-mouth 0.4s ease-in-out infinite;
+  transform-origin: 128px 142px;
+}
+
+/* ── mood-tired:沉下去 + 透明度下降,像电量耗尽的幽灵 ── */
+@keyframes ghost-tired-sink {
+  0%, 100% { transform: translateY(0); opacity: 1; }
+  50% { transform: translateY(6px); opacity: 0.55; }
+}
+.mood-tired #pet-body-group {
+  animation: ghost-tired-sink 4.4s ease-in-out infinite;
+}
+
+/* ── done:突然显形 + 弹回 ── */
+@keyframes ghost-done-pop {
+  0% { transform: scale(0.85); opacity: 0.6; }
+  40% { transform: scale(1.12); opacity: 1; }
+  100% { transform: scale(1); opacity: 0.92; }
+}
+.pet-done #pet-body-group {
+  animation: ghost-done-pop 0.45s ease-out 1;
+  transform-origin: 128px 130px;
+}

package/dist/assets/pets/12-ghost-byte.svg

@@ -8,7 +8,7 @@
       <feGaussianBlur stdDeviation="3" result="blur"/>
       <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
     </filter>
-  </defs>
+  </defs>
   <g id="pet-body-group">
 
   <!-- Floating shadow -->
@@ -36,6 +36,6 @@
   </g>
 
   <!-- Mouth -->
-  <ellipse cx="128" cy="142" rx="10" ry="8" fill="#0a1420" fill-opacity="0.85"/>
-  </g>
+  <ellipse id="pet-mouth" cx="128" cy="142" rx="10" ry="8" fill="#0a1420" fill-opacity="0.85"/>
+  </g>
 </svg>

package/dist/assets/pets/13-cactus-bot.motion.css

@@ -0,0 +1,90 @@
+/* 仙人掌兽(cactus-bot)专属演出:体现"仙人掌"的呆萌与刺感,动作偏迟钝、带轻微摇摆。
+ * #pet-arm-left/right 是两片刺臂,旋转角度小一些避免"刺"飞出去;tool_call 复用刺臂摆动。 */
+
+/* ── thinking:整个身体轻微左右晃,像顶着烈日有点晃神 ── */
+@keyframes cactus-think-sway {
+  0%, 100% { transform: rotate(0deg); }
+  25% { transform: rotate(-2deg); }
+  75% { transform: rotate(2deg); }
+}
+.pet-thinking #pet-body-group {
+  animation: cactus-think-sway 1.4s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── idle:非常慢的上下浮动(像在晒太阳) ── */
+@keyframes cactus-idle-bob {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-3px); }
+}
+.pet-idle #pet-body-group {
+  animation: cactus-idle-bob 3.6s ease-in-out infinite;
+}
+
+/* ── tool_call:刺臂小幅拍打(代替通用双臂摆动) ── */
+@keyframes cactus-tool-arm-left {
+  0%, 100% { transform: rotate(0deg); }
+  50% { transform: rotate(-15deg); }
+}
+@keyframes cactus-tool-arm-right {
+  0%, 100% { transform: rotate(0deg); }
+  50% { transform: rotate(15deg); }
+}
+.pet-tool #pet-arm-left {
+  animation: cactus-tool-arm-left 0.55s ease-in-out infinite;
+  transform-origin: 60px 130px;
+}
+.pet-tool #pet-arm-right {
+  animation: cactus-tool-arm-right 0.55s ease-in-out infinite 0.27s;
+  transform-origin: 196px 130px;
+}
+
+/* ── mood-urging:身体急促左右摇摆(像不耐烦地甩刺) ── */
+@keyframes cactus-urging-wiggle {
+  0%, 100% { transform: rotate(0deg); }
+  25% { transform: rotate(-4deg); }
+  75% { transform: rotate(4deg); }
+}
+.mood-urging #pet-body-group {
+  animation: cactus-urging-wiggle 0.35s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── mood-tired:慢慢瘪下去 + 变暗 ── */
+@keyframes cactus-tired-droop {
+  0%, 100% { transform: translateY(0) scaleY(1); opacity: 1; }
+  50% { transform: translateY(4px) scaleY(0.94); opacity: 0.85; }
+}
+.mood-tired #pet-body-group {
+  animation: cactus-tired-droop 4s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── done:小弹一下 + 刺臂举起 ── */
+@keyframes cactus-done-pop {
+  0% { transform: scale(1); }
+  40% { transform: scale(1.06); }
+  100% { transform: scale(1); }
+}
+@keyframes cactus-done-arm-left {
+  0% { transform: rotate(0deg); }
+  40% { transform: rotate(-25deg); }
+  100% { transform: rotate(0deg); }
+}
+@keyframes cactus-done-arm-right {
+  0% { transform: rotate(0deg); }
+  40% { transform: rotate(25deg); }
+  100% { transform: rotate(0deg); }
+}
+.pet-done #pet-body-group {
+  animation: cactus-done-pop 0.4s ease-out 1;
+  transform-origin: 128px 220px;
+}
+.pet-done #pet-arm-left {
+  animation: cactus-done-arm-left 0.4s ease-out 1;
+  transform-origin: 60px 130px;
+}
+.pet-done #pet-arm-right {
+  animation: cactus-done-arm-right 0.4s ease-out 1;
+  transform-origin: 196px 130px;
+}

package/dist/assets/pets/13-cactus-bot.svg

@@ -26,8 +26,8 @@
   <rect x="48" y="150" width="160" height="70" rx="40" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
 
   <!-- Spike arms(填充块面而非线条,细刺仍保留为短线装饰) -->
-  <path d="M62 108 Q26 112 24 142 Q22 156 38 158 Q50 158 48 144 Q44 122 62 118 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
-  <path d="M194 108 Q230 112 232 142 Q234 156 218 158 Q206 158 208 144 Q212 122 194 118 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <path id="pet-arm-left" d="M62 108 Q26 112 24 142 Q22 156 38 158 Q50 158 48 144 Q44 122 62 118 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <path id="pet-arm-right" d="M194 108 Q230 112 232 142 Q234 156 218 158 Q206 158 208 144 Q212 122 194 118 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
   <path d="M34 118 L24 108 M34 128 L22 124 M222 118 L232 108 M222 128 L234 124"
         stroke="url(#accentGrad)" stroke-width="3" stroke-linecap="round"/>
 

package/dist/assets/pets/14-crystal-bot.motion.css

@@ -0,0 +1,63 @@
+/* 水晶精灵(crystal-bot)专属演出:体现"水晶"的折射与旋转,所有动作都是几何化的旋转/缩放。
+ * SVG 自带 translateY 浮动动画,这里 .pet-idle 用等效浮动覆盖内置,其他状态彻底接管;
+ * 没有 #pet-arm-*,tool_call 改用快速旋转代替双臂摆动。 */
+
+/* ── idle:保留并替换 SVG 内置浮动为更稳定的"原地悬停" ── */
+@keyframes crystal-idle-hover {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-6px); }
+}
+.pet-idle #pet-body-group {
+  animation: crystal-idle-hover 3s ease-in-out infinite;
+}
+
+/* ── thinking:缓慢连续旋转(整颗水晶),模拟展示内部折射 ── */
+@keyframes crystal-think-spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+.pet-thinking #pet-body-group {
+  animation: crystal-think-spin 4s linear infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── tool_call:急促左右摇摆(代替双臂摆动),像光在晶体里来回折射 ── */
+@keyframes crystal-tool-sway {
+  0%, 100% { transform: rotate(-6deg); }
+  50% { transform: rotate(6deg); }
+}
+.pet-tool #pet-body-group {
+  animation: crystal-tool-sway 0.4s ease-in-out infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── mood-urging:急促脉冲式缩放(像能量过载) ── */
+@keyframes crystal-urging-pulse {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.1); }
+}
+.mood-urging #pet-body-group {
+  animation: crystal-urging-pulse 0.3s ease-in-out infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── mood-tired:慢慢缩小变暗,像水晶能量耗尽 ── */
+@keyframes crystal-tired-dim {
+  0%, 100% { transform: scale(1); opacity: 1; }
+  50% { transform: scale(0.92); opacity: 0.75; }
+}
+.mood-tired #pet-body-group {
+  animation: crystal-tired-dim 4.6s ease-in-out infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── done:快速自转一圈 + 回到原位 ── */
+@keyframes crystal-done-twirl {
+  0% { transform: rotate(0deg) scale(1); }
+  50% { transform: rotate(180deg) scale(1.12); }
+  100% { transform: rotate(360deg) scale(1); }
+}
+.pet-done #pet-body-group {
+  animation: crystal-done-twirl 0.55s ease-out 1;
+  transform-origin: 128px 128px;
+}

package/dist/assets/pets/15-satellite-bot.motion.css

@@ -0,0 +1,72 @@
+/* 卫星兽(satellite-bot)专属演出:体现"卫星"的机械感与扫描感,动作以旋转/信号脉冲为主。
+ * #pet-antenna 是顶部的碟形天线(在通用 style.css 里被当成"指示灯"做透明度闪烁,这里改用旋转);
+ * 两侧的"翅膀"是矩形太阳能板(无 id),通过 #pet-body-group 整体扫描带动视觉。 */
+
+/* ── idle:缓慢小幅旋转,模拟在轨道上微微漂移 ── */
+@keyframes satellite-idle-drift {
+  0%, 100% { transform: rotate(0deg); }
+  25% { transform: rotate(-2deg); }
+  75% { transform: rotate(2deg); }
+}
+.pet-idle #pet-body-group {
+  animation: satellite-idle-drift 3.4s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── thinking:碟形天线慢速旋转(扫描天空),身体微微摆动 ── */
+@keyframes satellite-think-dish {
+  0% { transform: rotate(-15deg); }
+  100% { transform: rotate(15deg); }
+}
+@keyframes satellite-think-body {
+  0%, 100% { transform: rotate(0deg); }
+  50% { transform: rotate(-2deg); }
+}
+.pet-thinking #pet-antenna {
+  animation: satellite-think-dish 1.6s ease-in-out infinite alternate;
+  transform-origin: 128px 30px;
+}
+.pet-thinking #pet-body-group {
+  animation: satellite-think-body 1.6s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── tool_call:碟形天线快速来回扫,代替通用双臂摆动 ── */
+@keyframes satellite-tool-dish {
+  0%, 100% { transform: rotate(-20deg); }
+  50% { transform: rotate(20deg); }
+}
+.pet-tool #pet-antenna {
+  animation: satellite-tool-dish 0.4s ease-in-out infinite;
+  transform-origin: 128px 30px;
+}
+
+/* ── mood-urging:信号脉冲(天线透明度快速闪烁代替通用 0.5s 旋转闪烁) ── */
+@keyframes satellite-urging-pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.3; }
+}
+.mood-urging #pet-antenna {
+  animation: satellite-urging-pulse 0.25s ease-in-out infinite;
+}
+
+/* ── mood-bored:身体非常慢的左右扫,模拟扫描不到东西 ── */
+@keyframes satellite-bored-scan {
+  0%, 100% { transform: rotate(-4deg); }
+  50% { transform: rotate(4deg); }
+}
+.mood-bored #pet-body-group {
+  animation: satellite-bored-scan 2.8s ease-in-out infinite;
+  transform-origin: 128px 220px;
+}
+
+/* ── done:快速收回(下沉 0 → -6 → 0) + 弹回 ── */
+@keyframes satellite-done-deploy {
+  0% { transform: translateY(0) scale(1); }
+  40% { transform: translateY(-8px) scale(1.08); }
+  100% { transform: translateY(0) scale(1); }
+}
+.pet-done #pet-body-group {
+  animation: satellite-done-deploy 0.5s ease-out 1;
+  transform-origin: 128px 220px;
+}

package/dist/assets/pets/15-satellite-bot.svg

@@ -18,7 +18,7 @@
   <!-- Antenna dish (kept 8px lower than original so the dish curve's peak stays clear
        of the viewBox top edge during the idle float animation's -6px translateY) -->
   <line x1="128" y1="24" x2="128" y2="54" stroke="url(#accentGrad)" stroke-width="4"/>
-  <path d="M100 24 Q128 4 156 24 Q128 36 100 24 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <path id="pet-antenna" d="M100 24 Q128 4 156 24 Q128 36 100 24 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
 
   <!-- Solar panel wings -->
   <rect x="4" y="88" width="50" height="70" rx="6" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>

package/dist/assets/pets/16-jellyfish-bot.motion.css

@@ -0,0 +1,71 @@
+/* 水母兽(jellyfish-bot)专属演出:体现"水母"的飘逸与梦幻,所有动作都是柔缓的弧线漂移。
+ * SVG 里触手已自带 <animate> 形变,这里不动触手,只对 #pet-body-group 做整体节奏;
+ * 没有 #pet-arm-*,tool_call 改用身体左右柔摆代替双臂摆动。 */
+
+/* ── idle:缓慢垂直上下漂移 ── */
+@keyframes jellyfish-idle-drift {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-7px); }
+}
+.pet-idle #pet-body-group {
+  animation: jellyfish-idle-drift 3.2s ease-in-out infinite;
+}
+
+/* ── thinking:垂直 + 水平小幅弧线漂移,模拟随水流思考 ── */
+@keyframes jellyfish-think-drift {
+  0%, 100% { transform: translate(0, 0); }
+  25% { transform: translate(-3px, -4px); }
+  50% { transform: translate(0, -7px); }
+  75% { transform: translate(3px, -4px); }
+}
+.pet-thinking #pet-body-group {
+  animation: jellyfish-think-drift 3s ease-in-out infinite;
+}
+
+/* ── tool_call:身体柔摆(代替双臂) ── */
+@keyframes jellyfish-tool-sway {
+  0%, 100% { transform: rotate(-4deg); }
+  50% { transform: rotate(4deg); }
+}
+.pet-tool #pet-body-group {
+  animation: jellyfish-tool-sway 0.7s ease-in-out infinite;
+  transform-origin: 128px 130px;
+}
+
+/* ── mood-urging:快速上下窜动 + 嘴部张合 ── */
+@keyframes jellyfish-urging-surge {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-9px); }
+}
+@keyframes jellyfish-urging-mouth {
+  0%, 100% { transform: scaleY(1); }
+  50% { transform: scaleY(1.5); }
+}
+.mood-urging #pet-body-group {
+  animation: jellyfish-urging-surge 0.4s ease-in-out infinite;
+}
+.mood-urging #pet-mouth {
+  animation: jellyfish-urging-mouth 0.4s ease-in-out infinite;
+  transform-origin: 128px 104px;
+}
+
+/* ── mood-tired:慢慢沉下去 + 透明度下降 ── */
+@keyframes jellyfish-tired-sink {
+  0%, 100% { transform: translateY(0); opacity: 1; }
+  50% { transform: translateY(5px); opacity: 0.7; }
+}
+.mood-tired #pet-body-group {
+  animation: jellyfish-tired-sink 4.4s ease-in-out infinite;
+}
+
+/* ── done:整只小水母轻快地向下压一次再弹回 ── */
+@keyframes jellyfish-done-pulse {
+  0% { transform: scale(1); }
+  40% { transform: scale(0.92) translateY(2px); }
+  70% { transform: scale(1.08) translateY(-4px); }
+  100% { transform: scale(1); }
+}
+.pet-done #pet-body-group {
+  animation: jellyfish-done-pulse 0.55s ease-out 1;
+  transform-origin: 128px 130px;
+}

package/dist/assets/pets/16-jellyfish-bot.svg

@@ -8,7 +8,7 @@
       <feGaussianBlur stdDeviation="3" result="blur"/>
       <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
     </filter>
-  </defs>
+  </defs>
   <g id="pet-body-group">
 
   <!-- Dome head -->
@@ -20,7 +20,7 @@
     <circle cx="102" cy="86" r="8" fill="#0a1420"/>
     <circle cx="154" cy="86" r="8" fill="#0a1420"/>
   </g>
-  <path d="M112 104 Q128 114 144 104" stroke="#0a1420" stroke-width="3" fill="none" stroke-linecap="round"/>
+  <path id="pet-mouth" d="M112 104 Q128 114 144 104" stroke="#0a1420" stroke-width="3" fill="none" stroke-linecap="round"/>
 
   <!-- Tentacles -->
   <path d="M64 110 Q56 150 66 190 Q72 210 62 232" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
@@ -43,5 +43,5 @@
   <circle cx="66" cy="170" r="3" fill="#e040fb" filter="url(#glow)"/>
   <circle cx="132" cy="180" r="3" fill="#e040fb" filter="url(#glow)"/>
   <circle cx="196" cy="170" r="3" fill="#e040fb" filter="url(#glow)"/>
-  </g>
+  </g>
 </svg>

package/dist/assets/pets/17-mushroom-bot.motion.css

@@ -0,0 +1,65 @@
+/* 菌菇兽(mushroom-bot)专属演出:体现"蘑菇"的弹性与Q弹,所有动作都是"弹"或"压"。
+ * 没有 #pet-arm-* 和 #pet-mouth,所有动作只能作用在 #pet-body-group 整体;
+ * 高度对称、底下两根脚,可以用 ground origin 做压扁弹起。 */
+
+/* ── idle:缓慢的"呼吸式"上下小弹(比通用浮动更有蘑菇的Q弹) ── */
+@keyframes mushroom-idle-spring {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-5px); }
+}
+.pet-idle #pet-body-group {
+  animation: mushroom-idle-spring 2.4s ease-in-out infinite;
+}
+
+/* ── thinking:上下小幅点头,根部为支点(整颗菌盖跟着摆) ── */
+@keyframes mushroom-think-tilt {
+  0%, 100% { transform: rotate(0deg); }
+  25% { transform: rotate(-3deg); }
+  75% { transform: rotate(3deg); }
+}
+.pet-thinking #pet-body-group {
+  animation: mushroom-think-tilt 1.1s ease-in-out infinite;
+  transform-origin: 128px 240px;
+}
+
+/* ── tool_call:整体左右小摇摆(代替双臂) ── */
+@keyframes mushroom-tool-sway {
+  0%, 100% { transform: rotate(-5deg); }
+  50% { transform: rotate(5deg); }
+}
+.pet-tool #pet-body-group {
+  animation: mushroom-tool-sway 0.45s ease-in-out infinite;
+  transform-origin: 128px 240px;
+}
+
+/* ── mood-urging:急促的连续小弹跳 ── */
+@keyframes mushroom-urging-bounce {
+  0%, 100% { transform: translateY(0) scaleY(1); }
+  50% { transform: translateY(-3px) scaleY(0.94); }
+}
+.mood-urging #pet-body-group {
+  animation: mushroom-urging-bounce 0.28s ease-in-out infinite;
+  transform-origin: 128px 240px;
+}
+
+/* ── mood-tired:慢慢萎缩变矮 ── */
+@keyframes mushroom-tired-shrink {
+  0%, 100% { transform: scaleY(1); opacity: 1; }
+  50% { transform: scaleY(0.92); opacity: 0.85; }
+}
+.mood-tired #pet-body-group {
+  animation: mushroom-tired-shrink 4.4s ease-in-out infinite;
+  transform-origin: 128px 240px;
+}
+
+/* ── done:大弹跳 + 落下一次 ── */
+@keyframes mushroom-done-hop {
+  0% { transform: translateY(0) scaleY(1); }
+  30% { transform: translateY(0) scaleY(0.8) scaleX(1.12); }
+  60% { transform: translateY(-16px) scaleY(1.05) scaleX(0.95); }
+  100% { transform: translateY(0) scaleY(1); }
+}
+.pet-done #pet-body-group {
+  animation: mushroom-done-hop 0.55s ease-out 1;
+  transform-origin: 128px 240px;
+}

package/dist/assets/pets/18-star-bot.motion.css

@@ -0,0 +1,72 @@
+/* 星星兽(star-bot)专属演出:体现"星"的闪光与魔法,动作以旋转/脉冲为主。
+ * SVG 自带 4s 慢速正负 6° 摆动(.pet-idle 时被替换);没有 #pet-arm-*;
+ * 整颗星就是身体,所有 transform 都以五角星中心 (128,128) 为原点。 */
+
+/* ── idle:保留并替换内置慢摆为"原地悬停" ── */
+@keyframes star-idle-hover {
+  0%, 100% { transform: translateY(0) rotate(0deg); }
+  50% { transform: translateY(-5px) rotate(0deg); }
+}
+.pet-idle #pet-body-group {
+  animation: star-idle-hover 3s ease-in-out infinite;
+}
+
+/* ── thinking:慢速连续旋转,像在展示星芒 ── */
+@keyframes star-think-spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+.pet-thinking #pet-body-group {
+  animation: star-think-spin 4s linear infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── tool_call:快速左右摇摆(代替双臂摆动) ── */
+@keyframes star-tool-sway {
+  0%, 100% { transform: rotate(-8deg); }
+  50% { transform: rotate(8deg); }
+}
+.pet-tool #pet-body-group {
+  animation: star-tool-sway 0.4s ease-in-out infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── mood-urging:急速脉冲式缩放 + 嘴部跟随张合 ── */
+@keyframes star-urging-pulse {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.12); }
+}
+@keyframes star-urging-mouth {
+  0%, 100% { transform: scaleY(1); }
+  50% { transform: scaleY(1.5); }
+}
+.mood-urging #pet-body-group {
+  animation: star-urging-pulse 0.32s ease-in-out infinite;
+  transform-origin: 128px 128px;
+}
+.mood-urging #pet-mouth {
+  animation: star-urging-mouth 0.32s ease-in-out infinite;
+  transform-origin: 128px 148px;
+}
+
+/* ── mood-frustrated:暴怒式自转 + 脉冲(替换通用横向抖动) ── */
+@keyframes star-frustrated-spin {
+  0% { transform: rotate(0deg) scale(1); }
+  50% { transform: rotate(180deg) scale(0.92); }
+  100% { transform: rotate(360deg) scale(1); }
+}
+.mood-frustrated #pet-body-group {
+  animation: star-frustrated-spin 0.4s linear infinite;
+  transform-origin: 128px 128px;
+}
+
+/* ── done:Twinkle 爆发(放大 + 收缩 + 旋转一次) ── */
+@keyframes star-done-twinkle {
+  0% { transform: scale(1) rotate(0deg); }
+  40% { transform: scale(1.2) rotate(60deg); }
+  100% { transform: scale(1) rotate(0deg); }
+}
+.pet-done #pet-body-group {
+  animation: star-done-twinkle 0.5s ease-out 1;
+  transform-origin: 128px 128px;
+}

package/dist/assets/pets/18-star-bot.svg

@@ -8,7 +8,7 @@
       <feGaussianBlur stdDeviation="3" result="blur"/>
       <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
     </filter>
-  </defs>
+  </defs>
   <g id="pet-body-group">
 
   <!-- Star body: 5-point star -->
@@ -40,6 +40,6 @@
   </g>
 
   <!-- Smile -->
-  <path d="M114 148 Q128 158 142 148" stroke="#ffe082" stroke-width="3" fill="none" stroke-linecap="round"/>
-  </g>
+  <path id="pet-mouth" d="M114 148 Q128 158 142 148" stroke="#ffe082" stroke-width="3" fill="none" stroke-linecap="round"/>
+  </g>
 </svg>