feat:加上 Vue 学习站与可嵌入机芯

站点按 bloub 三栏做自定义、动画时间线和设置，支持序列导出。
形体只留常见几种并配中文名；动画页右栏拉满时间线旁空位，滚动条隐藏。
机芯补 GROK.create / <grok-bot>，以及暂停冻结。

src/components/AnimPanel.vue

@@ -0,0 +1,51 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import BotTile from '@/components/BotTile.vue'
+import { stateName, t } from '@/i18n'
+import { stateGroups } from '@/replica/catalog'
+
+const emit = defineEmits<{ pick: [state: string] }>()
+const current = defineModel<string>({ required: true })
+
+const props = defineProps<{
+  shape: string
+  color: string
+  ready?: boolean
+}>()
+
+const groups = computed(() => {
+  void props.ready
+  return stateGroups()
+})
+</script>
+
+<template>
+  <div>
+    <h2 class="text-sm font-semibold">{{ t('panel.animations') }}</h2>
+    <section v-for="group in groups" :key="group.key" class="mt-4">
+      <h3 class="text-xs font-medium tracking-wide text-[var(--muted)] uppercase">
+        {{
+          group.key === 'lifecycle'
+            ? t('panel.group_lifecycle')
+            : group.key === 'reactions'
+              ? t('panel.group_reactions')
+              : group.key === 'agent'
+                ? t('panel.group_agent')
+                : t('panel.group_product')
+        }}
+      </h3>
+      <div class="mt-2 grid grid-cols-4 gap-1.5">
+        <BotTile
+          v-for="id in group.states"
+          :key="id"
+          :label="stateName(id)"
+          :selected="id === current"
+          :state="id"
+          :shape="shape"
+          :color="color"
+          @click="emit('pick', id)"
+        />
+      </div>
+    </section>
+  </div>
+</template>