mocode-pet-app 0.1.0 → 1.0.0

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

@@ -0,0 +1,52 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2e7d32"/>
+      <stop offset="1" stop-color="#1b5e20"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#aed581"/>
+      <stop offset="1" stop-color="#66bb6a"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Flower -->
+  <circle cx="108" cy="30" r="8" fill="#ff8a65"/>
+  <circle cx="122" cy="22" r="8" fill="#ffab91"/>
+  <circle cx="136" cy="30" r="8" fill="#ff8a65"/>
+  <circle cx="122" cy="34" r="7" fill="#ffe082"/>
+
+  <!-- Body segments -->
+  <rect x="60" y="46" width="136" height="120" rx="46" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <rect x="48" y="150" width="160" height="70" rx="40" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Spike arms -->
+  <path d="M60 110 Q28 118 30 148" stroke="url(#accentGrad)" stroke-width="8" stroke-linecap="round" fill="none"/>
+  <path d="M196 110 Q228 118 226 148" stroke="url(#accentGrad)" stroke-width="8" stroke-linecap="round" fill="none"/>
+  <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"/>
+
+  <!-- Screen face -->
+  <rect x="80" y="76" width="96" height="66" rx="14" fill="#0a1420" stroke="#aed581" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="100" y="98" width="12" height="22" rx="5" fill="url(#accentGrad)">
+      <animate attributeName="height" values="22;2;22" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="98;108;98" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="144" y="98" width="12" height="22" rx="5" fill="url(#accentGrad)">
+      <animate attributeName="height" values="22;2;22" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="98;108;98" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Pot base / feet -->
+  <path d="M56 220 L200 220 L184 244 L72 244 Z" fill="#8d6e63" stroke="#a1887f" stroke-width="2"/>
+  </g>
+</svg>

package/assets/pets/14-crystal-bot.svg

@@ -0,0 +1,32 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="crystalGrad" x1="48" y1="30" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b388ff" stop-opacity="0.85"/>
+      <stop offset="0.5" stop-color="#2afadf" stop-opacity="0.7"/>
+      <stop offset="1" stop-color="#7c4dff" stop-opacity="0.85"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="4" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Shadow (floating) -->
+  <ellipse cx="128" cy="236" rx="46" ry="8" fill="#000" fill-opacity="0.15"/>
+
+  <!-- Faceted crystal body -->
+  <path d="M128 26 L184 78 L168 190 L128 232 L88 190 L72 78 Z"
+        fill="url(#crystalGrad)" stroke="#e1bee7" stroke-width="2.5" filter="url(#glow)">
+    <animateTransform attributeName="transform" type="translate" values="0 0;0 -10;0 0" dur="3s" repeatCount="indefinite"/>
+  </path>
+  <!-- Inner facet lines -->
+  <line x1="128" y1="26" x2="128" y2="232" stroke="#ffffff" stroke-opacity="0.35" stroke-width="1.5"/>
+  <line x1="72" y1="78" x2="184" y2="78" stroke="#ffffff" stroke-opacity="0.35" stroke-width="1.5"/>
+  <line x1="88" y1="190" x2="168" y2="190" stroke="#ffffff" stroke-opacity="0.35" stroke-width="1.5"/>
+
+  <!-- Angular eyes -->
+  <path d="M100 110 L112 122 L100 134 L92 122 Z" fill="#0a1420"/>
+  <path d="M156 110 L168 122 L156 134 L148 122 Z" fill="#0a1420"/>
+  </g>
+</svg>

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

@@ -0,0 +1,55 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2afadf"/>
+      <stop offset="1" stop-color="#42a5f5"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- 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"/>
+
+  <!-- Solar panel wings -->
+  <rect x="4" y="88" width="50" height="70" rx="6" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <line x1="4" y1="105" x2="54" y2="105" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <line x1="4" y1="123" x2="54" y2="123" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <line x1="4" y1="141" x2="54" y2="141" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <rect x="202" y="88" width="50" height="70" rx="6" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <line x1="202" y1="105" x2="252" y2="105" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <line x1="202" y1="123" x2="252" y2="123" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <line x1="202" y1="141" x2="252" y2="141" stroke="url(#accentGrad)" stroke-opacity="0.5" stroke-width="1.5"/>
+  <rect x="54" y="116" width="16" height="10" fill="url(#accentGrad)"/>
+  <rect x="186" y="116" width="16" height="10" fill="url(#accentGrad)"/>
+
+  <!-- Round body -->
+  <circle cx="128" cy="140" r="76" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Screen face -->
+  <rect x="82" y="106" width="92" height="64" rx="14" fill="#0a1420" stroke="#2afadf" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <circle cx="112" cy="138" r="9" fill="url(#accentGrad)">
+      <animate attributeName="r" values="9;2;9" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+    <circle cx="144" cy="138" r="9" fill="url(#accentGrad)">
+      <animate attributeName="r" values="9;2;9" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+  </g>
+
+  <!-- Struts / feet -->
+  <line x1="106" y1="212" x2="90" y2="236" stroke="url(#accentGrad)" stroke-width="6" stroke-linecap="round"/>
+  <line x1="150" y1="212" x2="166" y2="236" stroke="url(#accentGrad)" stroke-width="6" stroke-linecap="round"/>
+  </g>
+</svg>

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

@@ -0,0 +1,47 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="domeGrad" x1="48" y1="30" x2="208" y2="120" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ce93d8" stop-opacity="0.85"/>
+      <stop offset="1" stop-color="#7e57c2" stop-opacity="0.8"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Dome head -->
+  <path d="M46 110 C46 56 82 26 128 26 C174 26 210 56 210 110 Z"
+        fill="url(#domeGrad)" stroke="#e1bee7" stroke-width="2.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <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"/>
+
+  <!-- Tentacles -->
+  <path d="M64 110 Q56 150 66 190 Q72 210 62 232" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
+    <animate attributeName="d" values="M64 110 Q56 150 66 190 Q72 210 62 232;M64 110 Q72 150 58 190 Q64 210 74 232;M64 110 Q56 150 66 190 Q72 210 62 232" dur="2.6s" repeatCount="indefinite"/>
+  </path>
+  <path d="M98 112 Q92 156 100 200 Q104 218 96 236" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
+    <animate attributeName="d" values="M98 112 Q92 156 100 200 Q104 218 96 236;M98 112 Q104 156 92 200 Q96 218 106 236;M98 112 Q92 156 100 200 Q104 218 96 236" dur="2.9s" repeatCount="indefinite"/>
+  </path>
+  <path d="M132 114 Q128 158 134 202 Q136 220 130 238" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
+    <animate attributeName="d" values="M132 114 Q128 158 134 202 Q136 220 130 238;M132 114 Q138 158 126 202 Q130 220 138 238;M132 114 Q128 158 134 202 Q136 220 130 238" dur="2.4s" repeatCount="indefinite"/>
+  </path>
+  <path d="M166 112 Q160 156 168 200 Q172 218 164 236" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
+    <animate attributeName="d" values="M166 112 Q160 156 168 200 Q172 218 164 236;M166 112 Q172 156 160 200 Q164 218 174 236;M166 112 Q160 156 168 200 Q172 218 164 236" dur="2.7s" repeatCount="indefinite"/>
+  </path>
+  <path d="M196 110 Q204 150 194 190 Q188 210 198 232" stroke="#ba68c8" stroke-width="7" fill="none" stroke-linecap="round">
+    <animate attributeName="d" values="M196 110 Q204 150 194 190 Q188 210 198 232;M196 110 Q188 150 202 190 Q196 210 186 232;M196 110 Q204 150 194 190 Q188 210 198 232" dur="3.1s" repeatCount="indefinite"/>
+  </path>
+
+  <!-- Glow dots -->
+  <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>
+</svg>

package/assets/pets/17-mushroom-bot.svg

@@ -0,0 +1,47 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="capGrad" x1="48" y1="30" x2="208" y2="110" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ef5350"/>
+      <stop offset="1" stop-color="#c62828"/>
+    </linearGradient>
+    <linearGradient id="stemGrad" x1="80" y1="110" x2="176" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#f5f5f5"/>
+      <stop offset="1" stop-color="#dcdcdc"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Cap -->
+  <path d="M30 112 C30 54 72 22 128 22 C184 22 226 54 226 112 Z" fill="url(#capGrad)" stroke="#8e1c1c" stroke-width="2.5"/>
+  <circle cx="76" cy="70" r="10" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="128" cy="50" r="8" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="176" cy="74" r="9" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="150" cy="98" r="6" fill="#fff" fill-opacity="0.75"/>
+
+  <!-- Stem / body -->
+  <rect x="72" y="108" width="112" height="120" rx="34" fill="url(#stemGrad)" stroke="#bdbdbd" stroke-width="2.5"/>
+
+  <!-- Screen face -->
+  <rect x="88" y="128" width="80" height="58" rx="12" fill="#0a1420" stroke="#2afadf" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="104" y="146" width="11" height="20" rx="5" fill="#2afadf">
+      <animate attributeName="height" values="20;2;20" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="146;155;146" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="142" y="146" width="11" height="20" rx="5" fill="#2afadf">
+      <animate attributeName="height" values="20;2;20" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="146;155;146" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Root feet -->
+  <ellipse cx="104" cy="238" rx="16" ry="8" fill="#bdbdbd"/>
+  <ellipse cx="152" cy="238" rx="16" ry="8" fill="#bdbdbd"/>
+  </g>
+</svg>

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

@@ -0,0 +1,45 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="starGrad" x1="48" y1="30" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ffd54f"/>
+      <stop offset="1" stop-color="#ff8f00"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Star body: 5-point star -->
+  <path d="M128 20
+           L156 92
+           L232 92
+           L170 138
+           L194 214
+           L128 168
+           L62 214
+           L86 138
+           L24 92
+           L100 92 Z"
+        fill="url(#starGrad)" stroke="#fff3c4" stroke-width="3">
+    <animateTransform attributeName="transform" type="rotate" values="0 128 128;6 128 128;0 128 128;-6 128 128;0 128 128" dur="4s" repeatCount="indefinite"/>
+  </path>
+
+  <!-- Screen face -->
+  <rect x="88" y="104" width="80" height="56" rx="12" fill="#0a1420" stroke="#ffe082" stroke-opacity="0.5" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <circle cx="112" cy="130" r="8" fill="#ffe082">
+      <animate attributeName="r" values="8;2;8" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+    <circle cx="146" cy="130" r="8" fill="#ffe082">
+      <animate attributeName="r" values="8;2;8" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+  </g>
+
+  <!-- Smile -->
+  <path d="M114 148 Q128 158 142 148" stroke="#ffe082" stroke-width="3" fill="none" stroke-linecap="round"/>
+  </g>
+</svg>

package/assets/pets/manifest.json

@@ -0,0 +1,25 @@
+{
+  "_description": "候选桌宠素材索引,供未来 desktop-pet '选皮' 功能读取。当前 packages/pet-app 实现仅使用 assets/mascot.svg(单一形象+CSS状态动画),这些素材是为后续换皮功能预留的候选库。",
+  "viewBox": "0 0 256 256",
+  "style": "赛博终端风,深色机身(#1b263b/#0d1b2a)+ 屏幕脸(黑底彩色像素眼,呼吸/眨眼动画),与 assets/mascot.svg 视觉语言一致",
+  "pets": [
+    { "id": "robo-cat",      "file": "01-robo-cat.svg",      "name": "机械猫",     "accent": "#2afadf" },
+    { "id": "robo-dog",      "file": "02-robo-dog.svg",      "name": "机械犬",     "accent": "#ffb74d" },
+    { "id": "robo-fox",      "file": "03-robo-fox.svg",      "name": "机械狐",     "accent": "#ff7043" },
+    { "id": "robo-panda",    "file": "04-robo-panda.svg",    "name": "机械熊猫",   "accent": "#2afadf" },
+    { "id": "robo-owl",      "file": "05-robo-owl.svg",      "name": "机械猫头鹰", "accent": "#7c4dff" },
+    { "id": "robo-bunny",    "file": "06-robo-bunny.svg",    "name": "机械兔",     "accent": "#ff6ec7" },
+    { "id": "robo-frog",     "file": "07-robo-frog.svg",     "name": "机械蛙",     "accent": "#00e676" },
+    { "id": "robo-bear",     "file": "08-robo-bear.svg",     "name": "机械熊",     "accent": "#ffa726" },
+    { "id": "robo-penguin",  "file": "09-robo-penguin.svg",  "name": "机械企鹅",   "accent": "#42a5f5" },
+    { "id": "robo-dino",     "file": "10-robo-dino.svg",     "name": "机械龙",     "accent": "#00c853" },
+    { "id": "slime-blob",    "file": "11-slime-blob.svg",    "name": "史莱姆",     "accent": "#00acc1" },
+    { "id": "ghost-byte",    "file": "12-ghost-byte.svg",    "name": "字节幽灵",   "accent": "#4dd0e1" },
+    { "id": "cactus-bot",    "file": "13-cactus-bot.svg",    "name": "仙人掌兽",   "accent": "#66bb6a" },
+    { "id": "crystal-bot",   "file": "14-crystal-bot.svg",   "name": "水晶精灵",   "accent": "#7c4dff" },
+    { "id": "satellite-bot", "file": "15-satellite-bot.svg", "name": "卫星兽",     "accent": "#42a5f5" },
+    { "id": "jellyfish-bot", "file": "16-jellyfish-bot.svg", "name": "水母兽",     "accent": "#ba68c8" },
+    { "id": "mushroom-bot",  "file": "17-mushroom-bot.svg",  "name": "菌菇兽",     "accent": "#c62828" },
+    { "id": "star-bot",      "file": "18-star-bot.svg",      "name": "星星兽",     "accent": "#ff8f00" }
+  ]
+}

package/assets/signal-light.svg

@@ -0,0 +1,55 @@
+<svg id="signal-light-svg-root" width="90" height="456" viewBox="0 0 90 456" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="lampBodyGrad" x1="8" y1="8" x2="82" y2="212" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="lampAccentGrad" x1="8" y1="8" x2="82" y2="212" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2afadf"/>
+      <stop offset="1" stop-color="#42a5f5"/>
+    </linearGradient>
+    <filter id="lampGlow" x="-100%" y="-100%" width="300%" height="300%">
+      <feGaussianBlur stdDeviation="4.5" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+
+  <!-- Housing -->
+  <rect x="10" y="8" width="72" height="204" rx="20" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Lens visor hoods (purely decorative, echo the terminal-screen look of mascot.svg) -->
+  <path d="M20 40 Q46 24 72 40" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+  <path d="M20 95 Q46 79 72 95" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+  <path d="M20 150 Q46 134 72 150" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+
+  <!-- Lamps: default = dim (25% opacity of their own hue). CSS drives the active/blinking state
+       per PetState (see style.css "信号灯状态映射表"); ids are stable and must not be renamed. -->
+  <circle id="pet-lamp-red" cx="46" cy="55" r="20" fill="#f87171" fill-opacity="0.22" filter="url(#lampGlow)"/>
+  <circle id="pet-lamp-yellow" cx="46" cy="110" r="20" fill="#fbbf24" fill-opacity="0.22" filter="url(#lampGlow)"/>
+  <circle id="pet-lamp-green" cx="46" cy="165" r="20" fill="#4ade80" fill-opacity="0.22" filter="url(#lampGlow)"/>
+
+  <!-- Post: a single plain pole running from the housing all the way down toward ground level. -->
+  <rect x="41" y="212" width="10" height="200" rx="5" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Collar ring: subtle detail where the pole meets the flared base, like real cast-iron
+       street lamp posts (a raised band, not just a bare pole-to-base joint). -->
+  <rect x="36" y="404" width="20" height="6" rx="3" fill="url(#lampAccentGrad)" fill-opacity="0.55"/>
+
+  <!-- Flared base: bell-shaped skirt widening from the pole down to the foot plate, echoing
+       the classic cast-iron lamp post base silhouette instead of a bare pole-in-a-block. -->
+  <path d="M40 410 C40 424 30 428 28 440 L64 440 C62 428 52 424 52 410 Z"
+        fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Foot plate: flat plinth the base is bolted to, slightly wider than the flare for a
+       grounded, load-bearing look; corner bolts add the "real hardware" detail. -->
+  <rect x="22" y="440" width="48" height="12" rx="4" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+  <circle cx="29" cy="446" r="2" fill="url(#lampAccentGrad)" fill-opacity="0.7"/>
+  <circle cx="63" cy="446" r="2" fill="url(#lampAccentGrad)" fill-opacity="0.7"/>
+
+  <!-- Soft contact shadow: grounds the fixture visually, matching the drop-shadow treatment
+       used under other floating/standing pet skins. -->
+  <ellipse cx="46" cy="454" rx="26" ry="4" fill="#000000" fill-opacity="0.18"/>
+</svg>

package/dist/assets/mascot.svg

@@ -53,6 +53,4 @@
   <!-- Legs / feet -->
   <rect x="76" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#cyanGrad)" stroke-width="2.5"/>
   <rect x="160" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#cyanGrad)" stroke-width="2.5"/>
-  <rect x="66" y="222" width="40" height="10" rx="5" fill="#2afadf" fill-opacity="0.6"/>
-  <rect x="150" y="222" width="40" height="10" rx="5" fill="#2afadf" fill-opacity="0.6"/>
 </svg>

package/dist/assets/pets/01-robo-cat.svg

@@ -0,0 +1,56 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2afadf"/>
+      <stop offset="1" stop-color="#42a5f5"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Ears -->
+  <path d="M52 62 L34 24 L78 48 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <path d="M204 62 L222 24 L178 48 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Body / head -->
+  <rect x="40" y="50" width="176" height="150" rx="28" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Screen face -->
+  <rect x="60" y="72" width="136" height="90" rx="14" fill="#0a1420" stroke="#2afadf" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="86" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="156" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Cat mouth -->
+  <path d="M118 148 L128 156 L138 148" stroke="#2afadf" stroke-width="4" fill="none" stroke-linecap="round" filter="url(#glow)"/>
+
+  <!-- Whiskers -->
+  <line x1="46" y1="128" x2="76" y2="124" stroke="url(#accentGrad)" stroke-width="2" stroke-linecap="round"/>
+  <line x1="46" y1="140" x2="76" y2="140" stroke="url(#accentGrad)" stroke-width="2" stroke-linecap="round"/>
+  <line x1="210" y1="128" x2="180" y2="124" stroke="url(#accentGrad)" stroke-width="2" stroke-linecap="round"/>
+  <line x1="210" y1="140" x2="180" y2="140" stroke="url(#accentGrad)" stroke-width="2" stroke-linecap="round"/>
+
+  <!-- Legs / feet -->
+  <rect x="76" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <rect x="160" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+
+  <!-- Tail -->
+  <path d="M216 180 Q246 190 240 150" stroke="url(#accentGrad)" stroke-width="8" stroke-linecap="round" fill="none"/>
+  </g>
+</svg>

package/dist/assets/pets/02-robo-dog.svg

@@ -0,0 +1,53 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ffb74d"/>
+      <stop offset="1" stop-color="#ff8a65"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Floppy ears -->
+  <path d="M50 68 Q16 88 26 142 Q42 152 58 122 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <path d="M206 68 Q240 88 230 142 Q214 152 198 122 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Body / head -->
+  <rect x="40" y="50" width="176" height="150" rx="28" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Screen face -->
+  <rect x="60" y="72" width="136" height="90" rx="14" fill="#0a1420" stroke="#ffb74d" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="86" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="156" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Nose + tongue -->
+  <ellipse cx="128" cy="145" rx="9" ry="6" fill="#ff8a65" filter="url(#glow)"/>
+  <rect x="120" y="153" width="16" height="14" rx="6" fill="#ff8fa3"/>
+
+  <!-- Legs / feet -->
+  <rect x="76" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <rect x="160" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+
+  <!-- Wagging tail -->
+  <path d="M216 178 Q250 168 244 138" stroke="url(#accentGrad)" stroke-width="8" stroke-linecap="round" fill="none">
+    <animateTransform attributeName="transform" type="rotate" values="0 216 178;18 216 178;0 216 178" dur="0.8s" repeatCount="indefinite"/>
+  </path>
+  </g>
+</svg>

package/dist/assets/pets/03-robo-fox.svg

@@ -0,0 +1,53 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ff7043"/>
+      <stop offset="1" stop-color="#ffab91"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Pointed ears with white tips -->
+  <path d="M56 60 L30 18 L82 46 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <path d="M200 60 L226 18 L174 46 Z" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <circle cx="34" cy="24" r="4" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="222" cy="24" r="4" fill="#fff" fill-opacity="0.85"/>
+
+  <!-- Body / head -->
+  <rect x="40" y="50" width="176" height="150" rx="28" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Screen face -->
+  <rect x="60" y="72" width="136" height="90" rx="14" fill="#0a1420" stroke="#ff7043" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="86" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="156" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Sharp muzzle line -->
+  <path d="M112 150 L128 158 L144 150" stroke="#ff7043" stroke-width="4" fill="none" stroke-linecap="round" filter="url(#glow)"/>
+
+  <!-- Legs / feet -->
+  <rect x="76" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <rect x="160" y="200" width="20" height="26" rx="8" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="2.5"/>
+
+  <!-- Bushy tail with white tip -->
+  <path d="M216 180 Q252 186 248 142 Q244 120 220 128" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+  <circle cx="230" cy="132" r="10" fill="#fff" fill-opacity="0.85"/>
+  </g>
+</svg>

package/dist/assets/pets/04-robo-panda.svg

@@ -0,0 +1,52 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bodyGrad" x1="48" y1="48" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#eef2f6"/>
+      <stop offset="1" stop-color="#cbd5e0"/>
+    </linearGradient>
+    <linearGradient id="accentGrad" x1="60" y1="90" x2="196" y2="170" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2afadf"/>
+      <stop offset="1" stop-color="#42a5f5"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Round black ears -->
+  <circle cx="58" cy="42" r="26" fill="#161a1e" stroke="url(#accentGrad)" stroke-width="3"/>
+  <circle cx="198" cy="42" r="26" fill="#161a1e" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Body / head -->
+  <rect x="40" y="50" width="176" height="150" rx="28" fill="url(#bodyGrad)" stroke="url(#accentGrad)" stroke-width="3"/>
+
+  <!-- Black eye patches -->
+  <ellipse cx="93" cy="112" rx="22" ry="28" fill="#161a1e"/>
+  <ellipse cx="163" cy="112" rx="22" ry="28" fill="#161a1e"/>
+
+  <!-- Screen face -->
+  <rect x="60" y="72" width="136" height="90" rx="14" fill="#0a1420" stroke="#2afadf" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="86" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="156" y="104" width="14" height="26" rx="6" fill="url(#accentGrad)">
+      <animate attributeName="height" values="26;2;26" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="104;117;104" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Nose + mouth -->
+  <ellipse cx="128" cy="142" rx="8" ry="6" fill="#161a1e"/>
+  <rect x="112" y="150" width="32" height="5" rx="2.5" fill="#161a1e" fill-opacity="0.7"/>
+
+  <!-- Legs / feet -->
+  <rect x="76" y="200" width="20" height="26" rx="8" fill="#161a1e" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  <rect x="160" y="200" width="20" height="26" rx="8" fill="#161a1e" stroke="url(#accentGrad)" stroke-width="2.5"/>
+  </g>
+</svg>