@mumulinya167/ccm-pet-assets 2.0.0 → 2.0.2

package/assets/clawd/clawd-error.svg

@@ -1,94 +1,94 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -25 45 45" width="500" height="500">
-  <defs>
-    <style>
-      .body-exhausted {
-        transform-origin: 7.5px 15px;
-        animation: heavy-breathe 2.5s infinite ease-in-out;
-      }
-      .arm-fan {
-        transform-origin: 14px 10px;
-        animation: fan-self 0.4s infinite alternate ease-in-out;
-      }
-      .smoke {
-        opacity: 0;
-        animation: puff-smoke 3s infinite ease-out;
-      }
-      .sm1 { animation-delay: 0s; }
-      .sm2 { animation-delay: 1s; }
-      .sm3 { animation-delay: 2s; }
-
-      /* Error warning flash */
-      .error-warning {
-        animation: error-flash 0.8s infinite ease-in-out;
-      }
-
-      @keyframes heavy-breathe {
-        0%, 100% { transform: scale(1, 1) translateY(0); }
-        50% { transform: scale(1.05, 0.9) translateY(1.5px); }
-      }
-      @keyframes fan-self {
-        0% { transform: rotate(0deg); }
-        100% { transform: rotate(-60deg); }
-      }
-      @keyframes puff-smoke {
-        0% { transform: translate(7.5px, 6px) scale(0.5); opacity: 0; }
-        20% { opacity: 0.6; }
-        100% { transform: translate(7.5px, -15px) scale(2); opacity: 0; }
-      }
-      @keyframes error-flash {
-        0%, 100% { opacity: 1; }
-        50% { opacity: 0.15; }
-      }
-    </style>
-    <g id="smoke-puff">
-      <rect x="-1" y="-1" width="2" height="2" fill="#B0BEC5" rx="0.5"/>
-      <rect x="0" y="-2" width="2" height="2" fill="#CFD8DC" rx="0.5"/>
-    </g>
-  </defs>
-
-  <rect id="ground-shadow" x="-1" y="15" width="17" height="1" fill="#000000" opacity="0.5"/>
-
-  <!-- Smoke -->
-  <g>
-    <use href="#smoke-puff" class="smoke sm1"/>
-    <use href="#smoke-puff" class="smoke sm2" transform="translate(-2, 0)"/>
-    <use href="#smoke-puff" class="smoke sm3" transform="translate(2, 0)"/>
-  </g>
-
-  <g class="body-exhausted">
-    <!-- Sploot Legs -->
-    <g fill="#DE886D">
-      <rect x="3" y="9" width="1" height="1"/>
-      <rect x="5" y="9" width="1" height="1"/>
-      <rect x="9" y="9" width="1" height="1"/>
-      <rect x="11" y="9" width="1" height="1"/>
-    </g>
-
-    <!-- Torso Sploot -->
-    <g fill="#DE886D">
-      <rect x="1" y="10" width="13" height="5"/>
-      <rect x="-1" y="13" width="2" height="2"/>
-    </g>
-
-    <!-- Fanning Arm (closer to body) -->
-    <g class="arm-fan">
-      <rect x="13" y="11" width="2" height="2" fill="#DE886D"/>
-    </g>
-
-    <!-- XX Eyes -->
-    <g fill="#000000">
-      <!-- Left X -->
-      <rect x="3" y="12" width="0.6" height="2.2" transform="rotate(45 3.3 13.1)"/>
-      <rect x="3" y="12" width="0.6" height="2.2" transform="rotate(-45 3.3 13.1)"/>
-      <!-- Right X -->
-      <rect x="10" y="12" width="0.6" height="2.2" transform="rotate(45 10.3 13.1)"/>
-      <rect x="10" y="12" width="0.6" height="2.2" transform="rotate(-45 10.3 13.1)"/>
-    </g>
-  </g>
-
-  <!-- Error Warning (flashing) -->
-  <g class="error-warning">
-    <!-- Error text only -->
-    <text x="7.5" y="6" text-anchor="middle" font-family="'Söhne', 'Helvetica Neue', Arial, sans-serif" font-size="3.5" font-weight="700" fill="#FF3B30">ERROR</text>
-  </g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -25 45 45" width="500" height="500">
+  <defs>
+    <style>
+      .body-exhausted {
+        transform-origin: 7.5px 15px;
+        animation: heavy-breathe 2.5s infinite ease-in-out;
+      }
+      .arm-fan {
+        transform-origin: 14px 10px;
+        animation: fan-self 0.4s infinite alternate ease-in-out;
+      }
+      .smoke {
+        opacity: 0;
+        animation: puff-smoke 3s infinite ease-out;
+      }
+      .sm1 { animation-delay: 0s; }
+      .sm2 { animation-delay: 1s; }
+      .sm3 { animation-delay: 2s; }
+
+      /* Error warning flash */
+      .error-warning {
+        animation: error-flash 0.8s infinite ease-in-out;
+      }
+
+      @keyframes heavy-breathe {
+        0%, 100% { transform: scale(1, 1) translateY(0); }
+        50% { transform: scale(1.05, 0.9) translateY(1.5px); }
+      }
+      @keyframes fan-self {
+        0% { transform: rotate(0deg); }
+        100% { transform: rotate(-60deg); }
+      }
+      @keyframes puff-smoke {
+        0% { transform: translate(7.5px, 6px) scale(0.5); opacity: 0; }
+        20% { opacity: 0.6; }
+        100% { transform: translate(7.5px, -15px) scale(2); opacity: 0; }
+      }
+      @keyframes error-flash {
+        0%, 100% { opacity: 1; }
+        50% { opacity: 0.15; }
+      }
+    </style>
+    <g id="smoke-puff">
+      <rect x="-1" y="-1" width="2" height="2" fill="#B0BEC5" rx="0.5"/>
+      <rect x="0" y="-2" width="2" height="2" fill="#CFD8DC" rx="0.5"/>
+    </g>
+  </defs>
+
+  <rect id="ground-shadow" x="-1" y="15" width="17" height="1" fill="#000000" opacity="0.5"/>
+
+  <!-- Smoke -->
+  <g>
+    <use href="#smoke-puff" class="smoke sm1"/>
+    <use href="#smoke-puff" class="smoke sm2" transform="translate(-2, 0)"/>
+    <use href="#smoke-puff" class="smoke sm3" transform="translate(2, 0)"/>
+  </g>
+
+  <g class="body-exhausted">
+    <!-- Sploot Legs -->
+    <g fill="#DE886D">
+      <rect x="3" y="9" width="1" height="1"/>
+      <rect x="5" y="9" width="1" height="1"/>
+      <rect x="9" y="9" width="1" height="1"/>
+      <rect x="11" y="9" width="1" height="1"/>
+    </g>
+
+    <!-- Torso Sploot -->
+    <g fill="#DE886D">
+      <rect x="1" y="10" width="13" height="5"/>
+      <rect x="-1" y="13" width="2" height="2"/>
+    </g>
+
+    <!-- Fanning Arm (closer to body) -->
+    <g class="arm-fan">
+      <rect x="13" y="11" width="2" height="2" fill="#DE886D"/>
+    </g>
+
+    <!-- XX Eyes -->
+    <g fill="#000000">
+      <!-- Left X -->
+      <rect x="3" y="12" width="0.6" height="2.2" transform="rotate(45 3.3 13.1)"/>
+      <rect x="3" y="12" width="0.6" height="2.2" transform="rotate(-45 3.3 13.1)"/>
+      <!-- Right X -->
+      <rect x="10" y="12" width="0.6" height="2.2" transform="rotate(45 10.3 13.1)"/>
+      <rect x="10" y="12" width="0.6" height="2.2" transform="rotate(-45 10.3 13.1)"/>
+    </g>
+  </g>
+
+  <!-- Error Warning (flashing) -->
+  <g class="error-warning">
+    <!-- Error text only -->
+    <text x="7.5" y="6" text-anchor="middle" font-family="'Söhne', 'Helvetica Neue', Arial, sans-serif" font-size="3.5" font-weight="700" fill="#FF3B30">ERROR</text>
+  </g>
+</svg>

package/assets/clawd/clawd-happy.svg

@@ -1,161 +1,161 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -25 45 45" width="500" height="500">
-  <defs>
-    <style>
-      /* Bouncing Character Body */
-      .bounce-anim {
-        transform-box: fill-box;
-        transform-origin: 50% 100%; /* Base of the feet */
-        animation: bounce 1s infinite ease-in-out;
-      }
-      
-      /* Ground Shadow Pulse */
-      .shadow-anim {
-        transform-box: fill-box;
-        transform-origin: 50% 50%;
-        animation: shadow 1s infinite ease-in-out;
-      }
-
-      /* Enthusiastic Waving Arms */
-      .arm-l {
-        transform-box: fill-box;
-        transform-origin: 100% 50%; /* Shoulder joint */
-        animation: wave-l 0.15s infinite alternate ease-in-out;
-      }
-      .arm-r {
-        transform-box: fill-box;
-        transform-origin: 0% 50%; /* Shoulder joint */
-        animation: wave-r 0.15s infinite alternate ease-in-out;
-      }
-
-      /* Happy Blinking Eyes */
-      .eyes-blink {
-        transform-box: fill-box;
-        transform-origin: 50% 50%;
-        animation: blink 2s infinite linear;
-      }
-
-      /* Pixel-Art Sparkle Animations (Frame-by-frame style) */
-      .spark-center {
-        opacity: 0;
-        animation: flash-center 1.5s infinite step-end;
-        animation-delay: var(--delay, 0s);
-      }
-      
-      .spark-outer {
-        opacity: 0;
-        animation: flash-outer 1.5s infinite step-end;
-        animation-delay: var(--delay, 0s);
-      }
-
-      /* Character Keyframes */
-      @keyframes bounce {
-        0%, 15%, 100% { transform: translateY(0) scaleY(1); }
-        20% { transform: translateY(0) scaleY(0.85); }     /* Anticipation squash */
-        40% { transform: translateY(-10px) scaleY(1.05); } /* Fast up + stretch */
-        50% { transform: translateY(-12px) scaleY(1); }    /* Hangtime peak */
-        60% { transform: translateY(-10px) scaleY(1.05); } /* Fast fall + stretch */
-        80% { transform: translateY(0) scaleY(0.85); }     /* Landing squash */
-        85% { transform: translateY(0) scaleY(1); }        /* Recover */
-      }
-
-      @keyframes shadow {
-        0%, 15%, 100% { transform: scale(1); opacity: 0.5; }
-        20% { transform: scale(1.1); opacity: 0.6; }
-        40% { transform: scale(0.6); opacity: 0.2; }
-        50% { transform: scale(0.5); opacity: 0.15; }
-        60% { transform: scale(0.6); opacity: 0.2; }
-        80% { transform: scale(1.1); opacity: 0.6; }
-        85% { transform: scale(1); opacity: 0.5; }
-      }
-
-      @keyframes wave-l {
-        0% { transform: rotate(45deg); }
-        100% { transform: rotate(85deg); }
-      }
-
-      @keyframes wave-r {
-        0% { transform: rotate(-45deg); }
-        100% { transform: rotate(-85deg); }
-      }
-
-      @keyframes blink {
-        0%, 46%, 54%, 100% { transform: scaleY(1); }
-        50% { transform: scaleY(0.1); }
-      }
-
-      /* 
-        True 8-Bit Sparkle Timeline:
-        1. Small center dot appears
-        2. Outer arms appear (Full Star)
-        3. Center dot disappears (Hollow Ring)
-        4. Everything disappears 
-      */
-      @keyframes flash-center {
-        0%  { opacity: 0; }
-        10% { opacity: 1; }  /* Small dot */
-        30% { opacity: 0; }  /* Disappears, leaving hollow star */
-        100%{ opacity: 0; }
-      }
-      
-      @keyframes flash-outer {
-        0%  { opacity: 0; }
-        20% { opacity: 1; }  /* Outer arms appear to complete the star */
-        40% { opacity: 0; }  /* Entire star disappears */
-        100%{ opacity: 0; }
-      }
-    </style>
-
-    <!-- Reusable Pixel Art Sparkle Definition -->
-    <g id="px-sparkle">
-      <!-- Center pixel -->
-      <rect class="spark-center" x="-0.5" y="-0.5" width="1" height="1" />
-      <!-- Outer 4 pixels forming the cross -->
-      <path class="spark-outer" d="M -0.5,-1.5 h1 v1 h-1 z 
-                                   M -0.5,0.5 h1 v1 h-1 z 
-                                   M -1.5,-0.5 h1 v1 h-1 z 
-                                   M 0.5,-0.5 h1 v1 h-1 z" />
-    </g>
-  </defs>
-
-  <!-- Ground Shadow -->
-  <rect id="ground-shadow" class="shadow-anim" x="3" y="15" width="9" height="1" fill="#000000"/>
-
-  <!-- Pixel-Art Sparkle Particles Group -->
-  <g class="sparkles">
-    <use href="#px-sparkle" x="-4" y="-2" fill="#FFD700" style="--delay: 0.0s"/>
-    <use href="#px-sparkle" x="18" y="-4" fill="#FFA000" style="--delay: 0.3s"/>
-    <use href="#px-sparkle" x="20" y="10" fill="#FFF59D" style="--delay: 0.6s"/>
-    <use href="#px-sparkle" x="-6" y="12" fill="#FFC107" style="--delay: 0.9s"/>
-    <use href="#px-sparkle" x="7" y="-8" fill="#FFF59D" style="--delay: 1.2s"/>
-    <use href="#px-sparkle" x="-2" y="6" fill="#FFD700" style="--delay: 0.7s"/>
-  </g>
-
-  <!-- Main Animated Character -->
-  <g class="bounce-anim">
-    <!-- Body Color Group -->
-    <g id="body-color-group" fill="#DE886D">
-      <!-- Legs (Move and squash with the body naturally) -->
-      <rect id="outer-left-leg" x="3" y="13" width="1" height="2"/>
-      <rect id="inner-left-leg" x="5" y="13" width="1" height="2"/>
-      <rect id="inner-right-leg" x="9" y="13" width="1" height="2"/>
-      <rect id="outer-right-leg" x="11" y="13" width="1" height="2"/>
-
-      <!-- Main Torso -->
-      <rect id="torso" x="2" y="6" width="11" height="7"/>
-      
-      <!-- Waving Arms -->
-      <g class="arm-l">
-        <rect id="left-arm" x="0" y="9" width="2" height="2"/>
-      </g>
-      <g class="arm-r">
-        <rect id="right-arm" x="13" y="9" width="2" height="2"/>
-      </g>
-    </g>
-    
-    <!-- Eyes Color Group -->
-    <g class="eyes-blink" fill="#000000">
-      <rect id="left-eye" x="4" y="8" width="1" height="2"/>
-      <rect id="right-eye" x="10" y="8" width="1" height="2"/>
-    </g>
-  </g>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -25 45 45" width="500" height="500">
+  <defs>
+    <style>
+      /* Bouncing Character Body */
+      .bounce-anim {
+        transform-box: fill-box;
+        transform-origin: 50% 100%; /* Base of the feet */
+        animation: bounce 1s infinite ease-in-out;
+      }
+      
+      /* Ground Shadow Pulse */
+      .shadow-anim {
+        transform-box: fill-box;
+        transform-origin: 50% 50%;
+        animation: shadow 1s infinite ease-in-out;
+      }
+
+      /* Enthusiastic Waving Arms */
+      .arm-l {
+        transform-box: fill-box;
+        transform-origin: 100% 50%; /* Shoulder joint */
+        animation: wave-l 0.15s infinite alternate ease-in-out;
+      }
+      .arm-r {
+        transform-box: fill-box;
+        transform-origin: 0% 50%; /* Shoulder joint */
+        animation: wave-r 0.15s infinite alternate ease-in-out;
+      }
+
+      /* Happy Blinking Eyes */
+      .eyes-blink {
+        transform-box: fill-box;
+        transform-origin: 50% 50%;
+        animation: blink 2s infinite linear;
+      }
+
+      /* Pixel-Art Sparkle Animations (Frame-by-frame style) */
+      .spark-center {
+        opacity: 0;
+        animation: flash-center 1.5s infinite step-end;
+        animation-delay: var(--delay, 0s);
+      }
+      
+      .spark-outer {
+        opacity: 0;
+        animation: flash-outer 1.5s infinite step-end;
+        animation-delay: var(--delay, 0s);
+      }
+
+      /* Character Keyframes */
+      @keyframes bounce {
+        0%, 15%, 100% { transform: translateY(0) scaleY(1); }
+        20% { transform: translateY(0) scaleY(0.85); }     /* Anticipation squash */
+        40% { transform: translateY(-10px) scaleY(1.05); } /* Fast up + stretch */
+        50% { transform: translateY(-12px) scaleY(1); }    /* Hangtime peak */
+        60% { transform: translateY(-10px) scaleY(1.05); } /* Fast fall + stretch */
+        80% { transform: translateY(0) scaleY(0.85); }     /* Landing squash */
+        85% { transform: translateY(0) scaleY(1); }        /* Recover */
+      }
+
+      @keyframes shadow {
+        0%, 15%, 100% { transform: scale(1); opacity: 0.5; }
+        20% { transform: scale(1.1); opacity: 0.6; }
+        40% { transform: scale(0.6); opacity: 0.2; }
+        50% { transform: scale(0.5); opacity: 0.15; }
+        60% { transform: scale(0.6); opacity: 0.2; }
+        80% { transform: scale(1.1); opacity: 0.6; }
+        85% { transform: scale(1); opacity: 0.5; }
+      }
+
+      @keyframes wave-l {
+        0% { transform: rotate(45deg); }
+        100% { transform: rotate(85deg); }
+      }
+
+      @keyframes wave-r {
+        0% { transform: rotate(-45deg); }
+        100% { transform: rotate(-85deg); }
+      }
+
+      @keyframes blink {
+        0%, 46%, 54%, 100% { transform: scaleY(1); }
+        50% { transform: scaleY(0.1); }
+      }
+
+      /* 
+        True 8-Bit Sparkle Timeline:
+        1. Small center dot appears
+        2. Outer arms appear (Full Star)
+        3. Center dot disappears (Hollow Ring)
+        4. Everything disappears 
+      */
+      @keyframes flash-center {
+        0%  { opacity: 0; }
+        10% { opacity: 1; }  /* Small dot */
+        30% { opacity: 0; }  /* Disappears, leaving hollow star */
+        100%{ opacity: 0; }
+      }
+      
+      @keyframes flash-outer {
+        0%  { opacity: 0; }
+        20% { opacity: 1; }  /* Outer arms appear to complete the star */
+        40% { opacity: 0; }  /* Entire star disappears */
+        100%{ opacity: 0; }
+      }
+    </style>
+
+    <!-- Reusable Pixel Art Sparkle Definition -->
+    <g id="px-sparkle">
+      <!-- Center pixel -->
+      <rect class="spark-center" x="-0.5" y="-0.5" width="1" height="1" />
+      <!-- Outer 4 pixels forming the cross -->
+      <path class="spark-outer" d="M -0.5,-1.5 h1 v1 h-1 z 
+                                   M -0.5,0.5 h1 v1 h-1 z 
+                                   M -1.5,-0.5 h1 v1 h-1 z 
+                                   M 0.5,-0.5 h1 v1 h-1 z" />
+    </g>
+  </defs>
+
+  <!-- Ground Shadow -->
+  <rect id="ground-shadow" class="shadow-anim" x="3" y="15" width="9" height="1" fill="#000000"/>
+
+  <!-- Pixel-Art Sparkle Particles Group -->
+  <g class="sparkles">
+    <use href="#px-sparkle" x="-4" y="-2" fill="#FFD700" style="--delay: 0.0s"/>
+    <use href="#px-sparkle" x="18" y="-4" fill="#FFA000" style="--delay: 0.3s"/>
+    <use href="#px-sparkle" x="20" y="10" fill="#FFF59D" style="--delay: 0.6s"/>
+    <use href="#px-sparkle" x="-6" y="12" fill="#FFC107" style="--delay: 0.9s"/>
+    <use href="#px-sparkle" x="7" y="-8" fill="#FFF59D" style="--delay: 1.2s"/>
+    <use href="#px-sparkle" x="-2" y="6" fill="#FFD700" style="--delay: 0.7s"/>
+  </g>
+
+  <!-- Main Animated Character -->
+  <g class="bounce-anim">
+    <!-- Body Color Group -->
+    <g id="body-color-group" fill="#DE886D">
+      <!-- Legs (Move and squash with the body naturally) -->
+      <rect id="outer-left-leg" x="3" y="13" width="1" height="2"/>
+      <rect id="inner-left-leg" x="5" y="13" width="1" height="2"/>
+      <rect id="inner-right-leg" x="9" y="13" width="1" height="2"/>
+      <rect id="outer-right-leg" x="11" y="13" width="1" height="2"/>
+
+      <!-- Main Torso -->
+      <rect id="torso" x="2" y="6" width="11" height="7"/>
+      
+      <!-- Waving Arms -->
+      <g class="arm-l">
+        <rect id="left-arm" x="0" y="9" width="2" height="2"/>
+      </g>
+      <g class="arm-r">
+        <rect id="right-arm" x="13" y="9" width="2" height="2"/>
+      </g>
+    </g>
+    
+    <!-- Eyes Color Group -->
+    <g class="eyes-blink" fill="#000000">
+      <rect id="left-eye" x="4" y="8" width="1" height="2"/>
+      <rect id="right-eye" x="10" y="8" width="1" height="2"/>
+    </g>
+  </g>
 </svg>