Xing4.0 29B A4B (free)

The user wants me to draw an SVG of an astronaut cat skateboarding on the moon. Let me create a creative, detailed SVG illustration with an astronaut cat (cat suit with cat ears, a cat face) riding a skateboard on the moon. I need to make it look good and clever, fitting within the design spec guidelines.

Let me create a colorful, engaging SVG with:
- A stylized cat wearing an astronaut suit (with cat ears!)
- On a skateboard
- On the surface of the moon (gray terrain, craters)
- The moon in the background

I'll make it whimsical but detailed. Let me follow the design spec - dark background with warm accent color, though for an illustration I might use a more light/warm palette since it's a night sky scene with the moon.

Actually, let me blend: dark space background with stars, the moon surface, the astronaut cat, and the skateboard. I'll use a cohesive color palette.

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Astronaut Cat on the Moon</title>
<style>
  *{margin:0;padding:0;box-sizing:border-box}
  body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#0a0a0f;overflow:hidden}
  svg{width:100%;max-width:720px;height:auto}
</style>
</head>
<body>
<svg viewBox="0 0 720 400" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <radialGradient id="moonGlow" cx="50%" cy="50%" r="50%">
      <stop offset="0%" stop-color="#e8e8e8"/>
      <stop offset="60%" stop-color="#c8c8d0"/>
      <stop offset="100%" stop-color="#9999a0"/>
    </radialGradient>
    <linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#0d0b1a"/>
      <stop offset="100%" stop-color="#1a1630"/>
    </linearGradient>
    <filter id="glow"><feGaussianBlur stdDeviation="3" result="blur"/><feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge></filter>
    <filter id="softGlow"><feGaussianBlur stdDeviation="8" result="blur"/><feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge></filter>
    <linearGradient id="skateGrad" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0%" stop-color="#ff6b6b"/>
      <stop offset="50%" stop-color="#ee5a5a"/>
      <stop offset="100%" stop-color="#cc4444"/>
    </linearGradient>
    <linearGradient id="suitGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#f8c8d0"/>
      <stop offset="100%" stop-color="#e0a0a8"/>
    </linearGradient>
  </defs>

  <!-- Sky -->
  <rect width="720" height="400" fill="url(#skyGrad)"/>

  <!-- Stars -->
  <g fill="#fff" opacity="0.8">
    <circle cx="80" cy="50" r="1.5"/>
    <circle cx="130" cy="80" r="1"/>
    <circle cx="200" cy="40" r="1.2"/>
    <circle cx="260" cy="110" r="0.8"/>
    <circle cx="330" cy="60" r="1.3"/>
    <circle cx="400" cy="90" r="1"/>
    <circle cx="470" cy="45" r="1.5"/>
    <circle cx="530" cy="80" r="0.9"/>
    <circle cx="590" cy="55" r="1.2"/>
    <circle cx="640" cy="100" r="0.8"/>
    <circle cx="50" cy="150" r="1"/>
    <circle cx="120" cy="130" r="0.7"/>
    <circle cx="180" cy="170" r="1.1"/>
    <circle cx="300" cy="150" r="0.8"/>
    <circle cx="600" cy="160" r="1"/>
    <circle cx="670" cy="120" r="1.3"/>
    <circle cx="40" cy="200" r="0.6"/>
    <circle cx="220" cy="220" r="1"/>
    <circle cx="360" cy="200" r="0.7"/>
  </g>

  <!-- Earth in distance -->
  <ellipse cx="540" cy="90" rx="55" ry="20" fill="#3a7bd5" opacity="0.7" filter="url(#softGlow)"/>
  <ellipse cx="530" cy="85" rx="30" ry="10" fill="#4ab5e8" opacity="0.4"/>

  <!-- Moon surface -->
  <path d="M0 320 Q150 290 300 310 Q420 300 550 330 Q620 350 720 310 L720 400 L0 400 Z" fill="#888890"/>
  <!-- Craters -->
  <g fill="#7a7a80" opacity="0.6">
    <ellipse cx="120" cy="340" rx="22" ry="8"/>
    <ellipse cx="350" cy="350" rx="30" ry="10"/>
    <ellipse cx="480" cy="340" rx="18" ry="6"/>
    <ellipse cx="600" cy="345" rx="25" ry="9"/>
  </g>
  <!-- Surface texture dots -->
  <g fill="#6a6a70" opacity="0.5">
    <circle cx="90" cy="335" r="2"/>
    <circle cx="200" cy="355" r="1.5"/>
    <circle cx="250" cy="330" r="1"/>
    <circle cx="400" cy="350" r="2"/>
    <circle cx="500" cy="335" r="1.2"/>
    <circle cx="580" cy="350" r="1.5"/>
    <circle cx="660" cy="330" r="2"/>
  </g>

  <!-- Skateboard wheel glow -->
  <circle cx="520" cy="322" r="4" fill="#ffd700" opacity="0.6" filter="url(#glow)"/>

  <!-- Skateboard deck -->
  <line x1="380" y1="315" x2="550" y2="315" stroke="url(#skateGrad)" stroke-width="8" stroke-linecap="round"/>
  <!-- Skateboard trucks -->
  <rect x="410" y="308" width="8" height="14" fill="#444"/>
  <rect x="530" y="308" width="8" height="14" fill="#444"/>
  <!-- Tail of skateboard -->
  <polygon points="550,315 565,308 565,322" fill="url(#skateGrad)" opacity="0.8"/>
  <!-- Truck detail lines -->
  <line x1="418" y1="308" x2="418" y2="322" stroke="#ddd" stroke-width="1.5"/>
  <line x1="538" y1="308" x2="538" y2="322" stroke="#ddd" stroke-width="1.5"/>

  <!-- === Astronaut Cat === -->
  <!-- Body bottom / legs extending below board -->
  <ellipse cx="475" cy="312" rx="40" ry="14" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.5"/>
  <!-- Skateboard tail detail -->
  <polygon points="560,318 572,314 572,321" fill="#cc4444"/>

  <!-- Left hind leg -->
  <rect x="420" y="295" width="10" height="22" rx="4" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.2"/>
  <rect x="418" y="308" width="12" height="5" rx="2" fill="#f0c0c8"/>

  <!-- Right hind leg -->
  <rect x="465" y="295" width="10" height="22" rx="4" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.2"/>
  <rect x="463" y="308" width="12" height="5" rx="2" fill="#f0c0c8"/>

  <!-- Torso -->
  <path d="M440,260 Q440,240 475,235 Q510,240 510,260 L510,290 L430,290 Z" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.5"/>
  <!-- Chest panel -->
  <rect x="452" y="242" width="66" height="35" rx="6" fill="#fff" opacity="0.15"/>
  <!-- Parachute tether line -->
  <line x1="440" y1="260" x2="300" y2="200" stroke="#ffaa44" stroke-width="2" opacity="0.6" stroke-dasharray="4 3"/>

  <!-- Front arm holding skateboard grip -->
  <path d="M510,245 Q530,255 540,275 Q542,282 538,282 Q540,275 525,255 Z" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.5"/>
  <!-- Hand -->
  <circle cx="532" cy="278" r="7" fill="#f0c0c8" stroke="#a05060" stroke-width="1"/>
  <!-- Grip tape -->
  <rect x="524" y="271" width="14" height="14" rx="2" fill="#333" opacity="0.6"/>

  <!-- Back arm -->
  <path d="M430,250 Q410,258 400,272 Q398,280 402,280 Q404,272 420,255 Z" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.5"/>
  <circle cx="404" cy="276" r="6" fill="#f0c0c8" stroke="#a05060" stroke-width="1"/>

  <!-- Cat ears -->
  <!-- Left ear -->
  <polygon points="452,232 440,215 460,228" fill="#e8a0a8" stroke="#c07078" stroke-width="1"/>
  <polygon points="452,232 446,222 458,228" fill="#fff"/>
  <!-- Right ear -->
  <polygon points="508,232 520,215 500,228" fill="#e8a0a8" stroke="#c07078" stroke-width="1"/>
  <polygon points="508,232 514,222 502,228" fill="#fff"/>

  <!-- Cat face -->
  <!-- Head shape -->
  <ellipse cx="475" cy="248" rx="22" ry="20" fill="url(#suitGrad)" stroke="#a05060" stroke-width="1.5"/>
  <!-- Cheek fluff -->
  <ellipse cx="455" cy="258" rx="10" ry="7" fill="#f8d8dc" opacity="0.6"/>
  <ellipse cx="495" cy="258" rx="10" ry="7" fill="#f8d8dc" opacity="0.6"/>

  <!-- Eyes -->
  <ellipse cx="465" cy="246" rx="5" ry="6" fill="#1a1a2a"/>
  <ellipse cx="485" cy="246" rx="5" ry="6" fill="#1a1a2a"/>
  <!-- Eye shine -->
  <circle cx="467" cy="243" r="2" fill="#fff"/>
  <circle cx="487" cy="243" r="2" fill="#fff"/>
  <!-- Eyelashes -->
  <path d="M462,240 L460,236" stroke="#1a1a2a" stroke-width="1.5" stroke-linecap="round"/>
  <path d="M468,234 L468,230" stroke="#1a1a2a" stroke-width="1.5" stroke-linecap="round"/>
  <path d="M482,240 L484,236" stroke="#1a1a2a" stroke-width="1.5" stroke-linecap="round"/>
  <path d="M490,240 L492,236" stroke="#1a1a2a" stroke-width="1.5" stroke-linecap="round"/>

  <!-- Nose -->
  <polygon points="475,252 470,255 480,255" fill="#e85050"/>
  <!-- Mouth -->
  <path d="M470,255 Q475,257 480,255" stroke="#a05060" stroke-width="1" fill="none" stroke-linecap="round"/>
  <path d="M470,255 Q475,257 480,255 Q475,260 470,255" fill="#f8d0d0" opacity="0.5"/>

  <!-- Whiskers -->
  <line x1="455" y1="256" x2="420" y2="252" stroke="#bbb" stroke-width="1" stroke-linecap="round"/>
  <line x1="455" y1="260" x2="420" y2="262" stroke="#bbb" stroke-width="1" stroke-linecap="round"/>
  <line x1="495" y1="256" x2="530" y2="252" stroke="#bbb" stroke-width="1" stroke-linecap="round"/>
  <line x1="495" y1="260" x2="530" y2="262" stroke="#bbb" stroke-width="1" stroke-linecap="round"/>

  <!-- Helmet visor reflection -->
  <ellipse cx="475" cy="242" rx="16" ry="4" fill="#fff" opacity="0.12" filter="url(#softGlow)"/>

  <!-- Booties peeking under board -->
  <ellipse cx="420" cy="310" rx="10" ry="5" fill="#d09098" stroke="#a05060" stroke-width="1"/>
  <ellipse cx="465" cy="310" rx="10" ry="5" fill="#d09098" stroke="#a05060" stroke-width="1"/>

  <!-- Board tail detail highlight -->
  <polygon points="558,317 568,313 568,321" fill="#ff8888" opacity="0.4"/>
</svg>
```